/* ============ BRAND: Logo-Rot + Photos ============ */
:root{--red:#E7362A;--grot:"Inter Tight","Arial Narrow",system-ui,sans-serif}
::selection{background:var(--red);color:#fff}
.eyebrow{font:800 11px/1.3 var(--grot);letter-spacing:.09em;color:var(--fg)}
.eyebrow::before{width:9px;height:9px;background:var(--red);box-shadow:0 0 14px rgba(231,54,42,.7)}
.hero .eyebrow,.scene .eyebrow{color:#efe7da}

/* logo block */
.logo{display:inline-flex;flex-direction:column;align-items:flex-end;background:var(--red);color:#fff;padding:10px 12px 8px;gap:3px;transition:transform .6s var(--ease),box-shadow .6s;box-shadow:0 0 0 0 rgba(231,54,42,0)}
.logo b{font:800 17px/.9 var(--grot);letter-spacing:-.025em}
.logo i{font:800 8.5px/1 var(--grot);letter-spacing:.01em;font-style:normal;opacity:.96}
.brand:hover .logo{transform:translateY(-1px) rotate(-1.5deg);box-shadow:0 0 34px 2px rgba(231,54,42,.55)}

/* buttons in brand red */
.btn{--c:var(--red);color:#fff}
.btn::before{background:#ffd9a0}
.btn:hover{color:#1b1612;box-shadow:0 0 44px 4px rgba(231,54,42,.5)}
.btn-ghost{color:var(--fg);background:transparent}
.btn-ghost::before{background:var(--red)}.btn-ghost:hover{color:#fff}
.tab-ind{background:var(--red);box-shadow:0 0 30px rgba(231,54,42,.5)}
.tabs button[aria-selected=true]{color:#fff}
.marquee-track b{width:.28em;height:.28em;background:var(--red);font-size:inherit;align-self:center;flex:none}
.show-bar i{background:var(--red);box-shadow:0 0 12px var(--red)}
.link:hover{border-color:var(--red)}
.status.open .dot{background:var(--red);box-shadow:0 0 12px 3px rgba(231,54,42,.8)}
.big-link:hover{color:var(--red)}
.big-link .mono,.step-n,.hours h3,.hours tr.today th,.hours tr.today td{color:var(--red)}
.hours tr.today th::before{background:var(--red);box-shadow:0 0 10px var(--red)}
.step.on::before{background:var(--red);box-shadow:0 0 0 4px rgba(231,54,42,.2),0 0 24px 4px rgba(231,54,42,.7)}
.steps::after{background:linear-gradient(var(--red),#ff7a45);box-shadow:0 0 14px 1px rgba(231,54,42,.8)}
.step-n{font:800 13px var(--grot);letter-spacing:0}
.card-end .card-big{color:var(--fg)}
.drag{color:var(--red)}

/* hero photo – the lamp reveals the room */
.hero-photo{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;transform-origin:62% 40%;animation:kb 36s ease-in-out infinite alternate;filter:grayscale(.7) brightness(.3) contrast(1.1)}
.hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,8,7,.82),rgba(10,8,7,.15) 70%),linear-gradient(0deg,#0a0807 4%,transparent 45%)}
.hero-photo-lit{opacity:calc(var(--on)*.9);-webkit-mask-image:radial-gradient(circle var(--mr,46vmin) at var(--lx) var(--ly),#000 0%,rgba(0,0,0,.6) 40%,transparent 100%);mask-image:radial-gradient(circle var(--mr,46vmin) at var(--lx) var(--ly),#000 0%,rgba(0,0,0,.6) 40%,transparent 100%)}
.hero-photo-lit img{filter:saturate(1.05) brightness(.95) contrast(1.08)}
.hero-photo-lit::after{background:linear-gradient(90deg,rgba(10,8,7,.55),transparent 65%),linear-gradient(0deg,#0a0807 2%,transparent 40%)}
@keyframes kb{from{transform:scale(1.04)}to{transform:scale(1.16) translate3d(-1.5%,0,0)}}

/* bento details */
.details{padding-block:clamp(70px,10vw,150px)}
.bento{display:grid;grid-template-columns:1.1fr 1fr .8fr;grid-template-rows:clamp(240px,27vw,420px) clamp(240px,27vw,420px);gap:clamp(10px,1.4vw,22px);margin-top:clamp(36px,5vw,70px)}
.b{position:relative;margin:0;overflow:hidden;border-radius:3px;background:#120f0c;isolation:isolate}
.b1{grid-row:1/3}.b2{grid-column:2/4}.b3{grid-column:2/4}
.ph{position:absolute;inset:0;overflow:hidden}
.ph img{position:absolute;left:0;top:-9%;width:100%;height:118%;object-fit:cover;transform:scale(1.28);transition:transform 1.8s var(--ease),filter .8s;will-change:transform}
.wipe .ph::after{content:"";position:absolute;inset:0;background:var(--red);transform-origin:100% 50%;transition:transform 1.3s var(--ease);z-index:2}
.wipe.in .ph::after{transform:scaleX(0)}
.wipe.in .ph img{transform:scale(1.04)}
.b:hover .ph img{transform:scale(1.1);filter:brightness(1.12)}
.b::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,rgba(8,6,5,.82));z-index:1;pointer-events:none}
.b figcaption{position:absolute;left:clamp(14px,1.6vw,26px);bottom:clamp(14px,1.6vw,24px);right:16px;z-index:3;color:#efe7da;font-size:14px;line-height:1.4;max-width:30ch;display:flex;flex-direction:column;align-items:flex-start;opacity:0;transform:translateY(12px);transition:opacity .8s .5s,transform .9s .5s var(--ease)}
.b.in figcaption{opacity:1;transform:none}
.b figcaption b{display:inline-block;margin-bottom:8px;padding:4px 8px 3px;background:var(--red);color:#fff;font:800 10px/1 var(--grot);letter-spacing:.06em;text-transform:uppercase}
@media(max-width:800px){.bento{grid-template-columns:1fr;grid-template-rows:none;grid-auto-rows:62vw}.b1,.b2,.b3{grid-column:auto;grid-row:auto}}

/* plan image stack */
.stack{position:relative;margin-top:30px;aspect-ratio:16/10;max-width:520px;border-radius:3px;overflow:hidden;box-shadow:0 0 0 1px var(--line),0 30px 60px -25px rgba(0,0,0,.7);background:#0b0a09}
.stack img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.stack .s0{object-fit:contain;background:#14171b}
.stack .s1{clip-path:inset(0 calc((1 - var(--p1,0))*100%) 0 0)}
.stack .s2{clip-path:inset(0 calc((1 - var(--p2,0))*100%) 0 0)}
.stack::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 60px rgba(0,0,0,.45)}
.stack-cap{position:absolute;left:12px;bottom:12px;z-index:2;background:var(--red);color:#fff;padding:6px 9px 5px;font:800 10px/1 var(--grot);letter-spacing:.07em}
.plan-side{top:8vh}
@media(max-height:820px){.stack{max-width:400px;margin-top:20px}.plan-side .h2{font-size:clamp(34px,4.6vw,66px)}}
@media(max-width:900px){.stack{max-width:none}}

/* footer: the logo, lit by your cursor */
.foot{padding-top:clamp(50px,7vw,110px)}
.foot-logo{position:relative;background:var(--red);color:#fff;padding:clamp(20px,3.4vw,56px) clamp(20px,3.4vw,56px) clamp(16px,2.6vw,44px);overflow:hidden;display:flex;flex-direction:column;gap:clamp(6px,1vw,16px);isolation:isolate;margin-bottom:clamp(30px,5vw,70px)}
.fl-a{font:800 min(12.4vw,200px)/.82 var(--grot);letter-spacing:-.05em;white-space:nowrap}
.fl-b{align-self:flex-end;font:800 min(6vw,96px)/.9 var(--grot);letter-spacing:-.035em}
.fl-shine{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle 24vw at var(--fx) var(--fy),rgba(255,236,200,.55),rgba(255,200,130,.14) 50%,transparent);mix-blend-mode:soft-light}
