/* Editorial de proyectos: los materiales de cada marca conservan sus colores. */
.br-case-collection { display:grid; gap:clamp(60px,7vw,105px); }
.br-case { min-width:0; }
.br-case-heading { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.72fr); gap:36px; align-items:end; margin-bottom:27px; }
.br-case-name { display:flex; align-items:baseline; gap:24px; min-width:0; }
.br-case-number { color:var(--amber); font-size:10px; line-height:1.5; letter-spacing:.1em; }
.branding-page .br-case-heading h3 { margin:0; font-family:var(--font-body); font-size:clamp(38px,4.4vw,68px); font-weight:500; line-height:1; letter-spacing:-.055em; overflow-wrap:anywhere; }
.br-case-heading>p { max-width:480px; margin:0; color:rgba(255,246,224,.63); font-size:13px; line-height:1.85; }
.br-case-canvas { position:relative; display:grid; min-width:0; gap:18px; padding:20px; border:1px solid rgba(255,246,224,.14); background:#101015; }
.br-case-canvas--elements { grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); grid-template-rows:255px 175px; }
.br-case-figure { position:relative; min-width:0; margin:0; overflow:hidden; background:#111115; }
.br-case-figure img { display:block; width:100%; height:100%; object-fit:contain; }
.br-case-figure[data-surface="light"] { background:#f5f3ee; }
.br-case-figure figcaption { position:absolute; left:15px; top:13px; padding:5px 7px; background:#0b090f; color:rgba(255,246,224,.65); font:500 8px/1.5 var(--font-body); text-transform:uppercase; letter-spacing:.1em; }
.br-case-construction { grid-column:1; grid-row:1/3; background:#15141b; }
.br-case-construction img { padding:16px; }
.br-case-elements-symbol { grid-column:2; grid-row:1; }
.br-case-elements-symbol img { padding:26px 20px 16px; }
.br-case-family { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-column:2; grid-row:2; gap:8px; align-items:stretch; min-width:0; }
.br-case-family-piece { background:#fff; }
.br-case-family-piece img { object-fit:contain; }
.br-case-open { position:absolute; right:32px; bottom:31px; display:flex; align-items:center; gap:24px; padding:10px 13px; border:1px solid rgba(255,246,224,.25); color:var(--cream); background:#100d17; font:500 9px/1.5 var(--font-body); text-transform:uppercase; letter-spacing:.08em; opacity:0; transform:translateY(4px); transition:opacity .25s,transform .25s; }
.br-case-open>span { color:var(--amber); font-size:19px; }
.br-case-canvas:hover .br-case-open,.br-case-canvas:focus-visible .br-case-open { opacity:1; transform:none; }
.br-case-foot { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:17px; padding-bottom:19px; border-bottom:1px solid rgba(255,246,224,.16); }
.br-case-foot>span { color:rgba(255,246,224,.42); font:500 9px/1.5 var(--font-body); text-transform:uppercase; letter-spacing:.12em; }
.br-case-action { display:flex; align-items:center; gap:28px; min-height:34px; padding:6px 0; font:500 11px/1.5 var(--font-body); }
.br-case-action>span { color:var(--amber); font-size:18px; }.br-case-action:hover { color:var(--amber); }
.br-case-canvas--remoteness { grid-template-columns:minmax(0,1fr) minmax(0,.82fr) minmax(0,1fr); grid-template-rows:150px 350px; align-items:center; background:#111018; gap:20px; }
.br-case-remoteness-wordmark { grid-column:1/-1; height:150px; background:#f5f3ee; }
.br-case-remoteness-wordmark img { position:absolute; top:50%; left:50%; width:min(92%,850px); height:auto; max-width:none; transform:translate(-50%,-50%); }
.br-case-remoteness-flags,.br-case-remoteness-tags,.br-case-remoteness-pack { height:350px; background:transparent; }
.br-case-remoteness-flags img { max-width:380px; margin:auto; }.br-case-remoteness-tags img { max-width:245px; margin:auto; }.br-case-remoteness-pack img { max-width:300px; margin:auto; }
.br-case-remoteness-flags figcaption,.br-case-remoteness-tags figcaption,.br-case-remoteness-pack figcaption { top:auto; bottom:8px; left:50%; transform:translateX(-50%); white-space:nowrap; }
.br-case-canvas--harsar { grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); grid-template-rows:210px 250px; background:#10140f; }
.br-case-harsar-symbol { grid-column:1; grid-row:1; background:#344737; }.br-case-harsar-symbol img { padding:12px; }
.br-case-harsar-credentials { grid-column:2; grid-row:1/3; background:#344737; }.br-case-harsar-credentials img { object-fit:contain; }
.br-case-harsar-objects { grid-column:1; grid-row:2; background:#fff; }.br-case-harsar-objects img { object-fit:contain; }
.br-real-lab { min-width:0; border-top:1px solid rgba(255,246,224,.2); border-bottom:1px solid rgba(255,246,224,.2); background:#0d0b12; }
.br-real-lab-heading { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:25px 28px 0; }
.br-real-lab-heading>p { margin:0; font:500 12px/1.5 var(--font-body); }.br-real-lab-heading>span { color:rgba(255,246,224,.4); font:500 8px/1.5 var(--font-body); letter-spacing:.12em; text-transform:uppercase; }
.br-real-lab-controls { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; padding:21px 28px 0; }
.br-real-lab-controls button { display:flex; align-items:baseline; gap:19px; min-width:0; padding:15px 0 19px; border:0; border-bottom:2px solid rgba(255,246,224,.12); color:rgba(255,246,224,.48); background:none; font:500 clamp(17px,1.55vw,23px)/1.4 var(--font-body); text-align:left; cursor:pointer; }
.br-real-lab-controls button>span { color:rgba(255,246,224,.33); font-size:9px; letter-spacing:.1em; }
.br-real-lab-controls button[aria-pressed="true"] { color:var(--cream); border-image:linear-gradient(90deg,var(--blue),var(--violet),var(--pink),var(--amber)) 1; }.br-real-lab-controls button[aria-pressed="true"]>span { color:var(--amber); }
.br-real-lab-stage { padding:24px 28px; }
.br-real-lab-panel { position:relative; display:flex; align-items:center; justify-content:center; min-height:400px; height:440px; overflow:hidden; background:#141319; }
.br-real-lab-panel[hidden] { display:none; }
.br-real-lab-panel>img { display:block; max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; }
.br-real-lab-panel--construction>img { max-height:94%; }.br-real-lab-panel--symbol>img { max-height:88%; }
.br-real-lab-coordinate { position:absolute; bottom:18px; left:20px; color:rgba(255,246,224,.36); font:500 8px/1.5 var(--font-body); letter-spacing:.12em; text-transform:uppercase; }
.br-real-lab-panel--family { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); height:auto; min-height:260px; gap:14px; background:transparent; }
.br-real-lab-panel--family>figure { min-width:0; margin:0; background:#fff; }
.br-real-lab-panel--family img { display:block; width:100%; height:100%; object-fit:contain; }
.br-real-lab-foot { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:0 28px 24px; }
.br-real-lab-foot>span { color:rgba(255,246,224,.4); font:500 8px/1.5 var(--font-body); letter-spacing:.11em; text-transform:uppercase; }
.br-real-lab-foot>a { display:flex; align-items:center; gap:23px; min-height:36px; font:500 10px/1.5 var(--font-body); }.br-real-lab-foot>a>span { color:var(--amber); font-size:17px; }.br-real-lab-foot>a:hover { color:var(--amber); }
@media (max-width:1050px) {
 .br-case-heading { grid-template-columns:minmax(0,1fr) minmax(0,.9fr); gap:25px; }.br-case-name { gap:18px; }.br-case-heading>p { font-size:12px; }
 .br-case-canvas { padding:15px; gap:13px; }.br-case-canvas--elements { grid-template-rows:235px 145px; }.br-case-family { gap:5px; }
 .br-case-canvas--remoteness { grid-template-rows:135px 300px; }.br-case-remoteness-wordmark { height:135px; }.br-case-remoteness-flags,.br-case-remoteness-tags,.br-case-remoteness-pack { height:300px; }
 .br-case-canvas--harsar { grid-template-rows:190px 220px; }.br-case-open { right:25px; bottom:25px; }
}
@media (max-width:820px) {
 .br-case-heading { grid-template-columns:1fr; gap:16px; margin-bottom:21px; }.branding-page .br-case-heading h3 { font-size:clamp(37px,6vw,55px); }.br-case-heading>p { max-width:580px; font-size:13px; }
 .br-case-canvas--elements { grid-template-columns:minmax(0,1fr) minmax(0,1fr); grid-template-rows:225px 150px; }.br-case-elements-symbol img { padding:20px 10px; }.br-case-construction img { padding:8px; }.br-case-family { grid-template-columns:repeat(2,minmax(0,1fr)); }.br-case-family-piece { min-height:0; }.br-case-family-piece img { height:100%; }
 .br-case-canvas--remoteness { grid-template-rows:125px 285px; gap:10px; }.br-case-remoteness-wordmark { height:125px; }.br-case-remoteness-flags,.br-case-remoteness-tags,.br-case-remoteness-pack { height:285px; }.br-case-figure figcaption { left:8px; top:8px; font-size:7px; padding:4px 5px; }.br-case-remoteness-flags figcaption,.br-case-remoteness-tags figcaption,.br-case-remoteness-pack figcaption { top:auto; left:50%; bottom:6px; }
 .br-real-lab-heading { padding:23px 20px 0; }.br-real-lab-controls { padding:17px 20px 0; gap:19px; }.br-real-lab-controls button { gap:10px; font-size:17px; }.br-real-lab-stage { padding:20px; }.br-real-lab-panel { min-height:340px; height:380px; }.br-real-lab-panel--family { min-height:0; height:auto; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.br-real-lab-panel--family>figure { aspect-ratio:1.12; }.br-real-lab-foot { padding:0 20px 20px; }
}
@media (max-width:520px) {
 .br-case-collection { gap:52px; }.br-case-name { gap:17px; }.branding-page .br-case-heading h3 { font-size:39px; }.br-case-heading>p { font-size:12px; line-height:1.8; }
 .br-case-canvas { padding:12px; gap:12px; }.br-case-canvas--elements { grid-template-columns:1fr; grid-template-rows:285px 230px auto; }.br-case-construction { grid-column:1; grid-row:1; }.br-case-elements-symbol { grid-column:1; grid-row:2; }.br-case-family { grid-column:1; grid-row:3; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }.br-case-family-piece { aspect-ratio:1.12; }.br-case-elements-symbol img { padding:22px 15px 12px; }
 .br-case-open { display:none; }.br-case-foot { gap:15px; margin-top:12px; padding-bottom:14px; }.br-case-foot>span { font-size:8px; letter-spacing:.08em; }.br-case-action { gap:18px; min-height:44px; font-size:10px; }
 .br-case-canvas--remoteness { grid-template-columns:minmax(0,1fr) minmax(0,1fr); grid-template-rows:115px 260px 310px; gap:12px; }.br-case-remoteness-wordmark { grid-column:1/-1; height:115px; }.br-case-remoteness-flags { grid-column:1/-1; height:260px; }.br-case-remoteness-tags { height:310px; }.br-case-remoteness-pack { height:310px; }.br-case-remoteness-tags figcaption,.br-case-remoteness-pack figcaption { font-size:6px; letter-spacing:.02em; }
 .br-case-canvas--harsar { grid-template-columns:1fr; grid-template-rows:235px 320px 250px; }.br-case-harsar-symbol { grid-column:1; grid-row:1; }.br-case-harsar-credentials { grid-column:1; grid-row:2; }.br-case-harsar-objects { grid-column:1; grid-row:3; }
 .br-real-lab-heading { align-items:start; padding:21px 16px 0; gap:16px; }.br-real-lab-heading>p { font-size:11px; }.br-real-lab-heading>span { max-width:110px; text-align:right; font-size:7px; }.br-real-lab-controls { gap:11px; padding:15px 16px 0; }.br-real-lab-controls button { display:block; padding:11px 0 14px; font-size:clamp(10.5px,3.2vw,13px); line-height:1.4; }.br-real-lab-controls button>span { display:block; margin-bottom:5px; font-size:8px; }.br-real-lab-stage { padding:16px; }.br-real-lab-panel { min-height:280px; height:305px; }.br-real-lab-panel--family { height:auto; min-height:0; gap:8px; }.br-real-lab-coordinate { bottom:13px; left:13px; max-width:110px; font-size:7px; }.br-real-lab-foot { flex-wrap:wrap; gap:8px 18px; padding:0 16px 17px; }.br-real-lab-foot>span { font-size:7px; }.br-real-lab-foot>a { min-height:40px; gap:17px; font-size:9px; }
}
@media (prefers-reduced-motion:reduce) { .br-case-open { transition:none; transform:none; } }


