/*
 * Landing imersiva (3D): primeira dobra em 4 cenas (tesoura, cadeira, maquina de corte, barber pole).
 * Tudo escopado em .imm / .imm-*; as demais secoes da landing continuam como estao.
 * Sem JS/WebGL, as cenas viram um layout estatico preto e amarelo (progressive enhancement).
 */
:root{--imm-y:#FFD700;--imm-y2:#FFB000;--imm-ivory:#F4F1EA;--imm-mut:#8f8b82}

/* amarelo da marca nesta pagina (substitui o dourado antigo so aqui) */
body.landing{--bs-gold:#FFD700;--bs-gold-light:#FFE866;--bs-gold-dark:#E6C200;--bs-gold-muted:rgba(255,215,0,.1);--shadow-gold:0 10px 30px rgba(255,215,0,.3);--shadow-gold-lg:0 20px 40px rgba(255,215,0,.4)}

/* navegacao: vidro escuro sobre a cena */
body.landing .navbar-barbershop{background:rgba(0,0,0,.55);border-bottom:1px solid rgba(255,255,255,.06)}

.imm{position:relative;background:#000;overflow:clip}
.imm-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:0;display:block;opacity:0;transition:opacity .6s;pointer-events:none}
.imm.is-3d .imm-canvas{opacity:1}
.imm.is-away .imm-canvas{opacity:0}
.imm-vig{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(120% 90% at 70% 45%,transparent 35%,rgba(0,0,0,.72) 100%);opacity:0;transition:opacity .6s}
.imm.is-3d .imm-vig{opacity:1}.imm.is-away .imm-vig{opacity:0}
.imm-grain{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence baseFrequency='.9' numOctaves='2'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>")}

/* fallback estatico (sem WebGL): brilho amarelo atras do texto */
.imm:not(.is-3d) .imm-scene{background:radial-gradient(700px 420px at 78% 40%,rgba(255,215,0,.13),transparent 65%)}
.imm:not(.is-3d) .imm-scene .imm-fallback{display:flex}
.imm .imm-fallback{display:none;position:absolute;right:6vw;top:50%;transform:translateY(-50%);width:min(34vw,420px);aspect-ratio:1;align-items:center;justify-content:center;font-size:clamp(90px,12vw,170px);color:var(--imm-y);filter:drop-shadow(0 0 40px rgba(255,215,0,.45));opacity:.9}

.imm-scene{position:relative;z-index:10;min-height:100vh;min-height:100svh;display:flex;align-items:center;padding:100px 6vw 84px}
@media(max-height:900px){.imm-hint{display:none}}
.imm-txt{width:min(580px,46vw)}
.imm-tag{display:inline-flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--imm-mut)}
.imm-tag i{width:7px;height:7px;border-radius:50%;background:var(--imm-y);box-shadow:0 0 12px var(--imm-y)}
.imm h1,.imm h2{font-family:var(--font-display,'Sora',sans-serif);font-weight:600;letter-spacing:-.035em;line-height:.98;color:var(--imm-ivory)}
.imm h1{font-size:clamp(40px,min(5.2vw,8.4vh),92px);margin:18px 0 20px}
.imm h1 .imm-kicker{display:block;font:500 12px/1.4 var(--font-sans,'Inter',sans-serif);letter-spacing:.2em;text-transform:uppercase;color:var(--imm-mut);margin:0 0 14px}
.imm h2{font-size:clamp(30px,min(4.2vw,8vh),60px);margin:16px 0 18px}
.imm .ln{display:block;overflow:hidden;padding-bottom:.08em}
.imm .ln>span{display:block;transform:translateY(110%);transition:transform 1s cubic-bezier(.2,.8,.2,1)}
.imm .is-in .ln>span{transform:none}
.imm .ln:nth-of-type(2)>span{transition-delay:.12s}
.imm .out{color:transparent;-webkit-text-stroke:1.5px var(--imm-y)}
.imm .y{color:var(--imm-y)}
.imm p.imm-lead{font-size:clamp(16px,1.3vw,19px);line-height:1.6;color:#cfcbc2;max-width:46ch;opacity:0;transform:translateY(20px);transition:all .9s .35s;margin:0}
.imm .is-in p.imm-lead,.imm .is-in .imm-fade{opacity:1;transform:none}
.imm-fade{opacity:0;transform:translateY(20px);transition:all .9s .5s}
.imm-btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.imm .imm-btn{display:inline-flex;align-items:center;gap:10px;border-radius:999px;padding:16px 28px;font:600 15px var(--font-sans,'Inter',sans-serif);text-decoration:none;color:#0a0a0a;background:var(--imm-y);box-shadow:0 16px 40px -14px rgba(255,215,0,.8);transition:transform .25s;border:0}
.imm .imm-btn:hover{transform:translateY(-2px) scale(1.02);color:#0a0a0a}
.imm .imm-btn.o{background:transparent;color:var(--imm-ivory);border:1px solid #3b3b3b;box-shadow:none}
.imm .imm-btn.o:hover{color:var(--imm-y);border-color:var(--imm-y)}
.imm-micro{margin-top:16px;font-size:13px;color:#7f7b73}
.imm-list{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:12px}
.imm-list li{display:flex;gap:12px;align-items:flex-start;font-size:15px;color:#d8d4c9}
.imm-list li:before{content:"";flex:none;width:22px;height:22px;margin-top:1px;border-radius:50%;border:1px solid var(--imm-y);background:radial-gradient(circle,var(--imm-y) 0 3px,transparent 4px)}
.imm-price{margin-top:26px;display:inline-flex;align-items:baseline;gap:10px;padding:18px 26px;border-radius:20px;background:rgba(20,20,20,.7);border:1px solid #2a2a2a;backdrop-filter:blur(6px)}
.imm-price b{font:700 44px var(--font-display,'Sora',sans-serif);color:var(--imm-y);letter-spacing:-.03em}.imm-price span{font-size:14px;color:#a7a39a}
.imm-hint{position:absolute;left:50%;transform:translateX(-50%);bottom:84px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:#6f6c64;display:flex;align-items:center;gap:12px}
.imm-hint:after{content:"";width:1px;height:46px;background:linear-gradient(var(--imm-y),transparent);animation:immdr 1.8s infinite}
@keyframes immdr{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.imm-marquee{position:absolute;left:0;right:0;bottom:0;overflow:hidden;border-top:1px solid #1c1c1c;border-bottom:1px solid #1c1c1c;background:rgba(0,0,0,.5);backdrop-filter:blur(4px);padding:14px 0;white-space:nowrap}
.imm-marquee div{display:inline-block;animation:immmq 30s linear infinite;font:700 22px var(--font-display,'Sora',sans-serif);letter-spacing:.04em;text-transform:uppercase}
.imm-marquee span{margin:0 26px;color:transparent;-webkit-text-stroke:1px #6b6b6b}.imm-marquee span.f{color:var(--imm-y);-webkit-text-stroke:0}
@keyframes immmq{to{transform:translateX(-50%)}}
.imm-rail{position:fixed;right:2.2vw;top:50%;transform:translateY(-50%);z-index:30;display:grid;gap:16px;opacity:0;transition:opacity .4s;pointer-events:none}
.imm.is-3d:not(.is-away) .imm-rail{opacity:1;pointer-events:auto}
.imm-rail a{display:flex;align-items:center;gap:10px;justify-content:flex-end;color:#6f6c64;font-size:11px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none}
.imm-rail a i{width:8px;height:8px;border-radius:50%;background:#333;transition:.3s}
.imm-rail a b{font-weight:500;opacity:0;transform:translateX(6px);transition:.3s}
.imm-rail a.on{color:var(--imm-ivory)}.imm-rail a.on i{background:var(--imm-y);box-shadow:0 0 14px var(--imm-y);transform:scale(1.4)}.imm-rail a.on b{opacity:1;transform:none}

@media(max-width:860px){.imm h1{font-size:clamp(36px,10.5vw,52px)}.imm-scene{padding-top:min(230px,32svh);padding-bottom:96px}.imm-txt{margin:0 -6vw;padding:56px 6vw 0;background:linear-gradient(180deg,transparent,rgba(0,0,0,.82) 38%)}.imm h1{text-shadow:0 2px 24px #000}.sobre-section{overflow-x:clip}.imm-txt{width:100%}.imm-scene{align-items:flex-end;padding-bottom:110px}.imm-rail,.imm-hint{display:none}.imm-fallback{right:50%;transform:translate(50%,0);top:90px;width:42vw}}
@media(prefers-reduced-motion:reduce){.imm .ln>span,.imm p.imm-lead,.imm-fade{transition:none;transform:none;opacity:1}.imm-marquee div{animation:none}}
