/* ==========================================================================
   Pharo Arquitetura — site V2
   Design system oficial (navy / off-white / coral, Krona One + Montserrat,
   chanfro 45°, hairline coral, grão). Distribuição de seções: bright-avenue.jp.
   ========================================================================== */

/* ---- Fontes ---- */
@font-face{font-family:'Krona One';src:url('../assets/fonts/KronaOne-Regular.woff2') format('woff2');font-weight:400;font-display:swap;}
@font-face{font-family:'Montserrat';src:url('../assets/fonts/Montserrat-Light.woff2') format('woff2');font-weight:300;font-display:swap;}
@font-face{font-family:'Montserrat';src:url('../assets/fonts/Montserrat-Regular.woff2') format('woff2');font-weight:400;font-display:swap;}
@font-face{font-family:'Montserrat';src:url('../assets/fonts/Montserrat-Medium.woff2') format('woff2');font-weight:500;font-display:swap;}
@font-face{font-family:'Montserrat';src:url('../assets/fonts/Montserrat-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap;}
@font-face{font-family:'Montserrat';src:url('../assets/fonts/Montserrat-Bold.woff2') format('woff2');font-weight:700;font-display:swap;}
@font-face{font-family:'Raleway';src:url('../assets/fonts/Raleway-Light.woff2') format('woff2');font-weight:300;font-display:swap;}

/* ---- Tokens do design system ---- */
:root{
  --navy-900:#25272E;--navy-800:#2E313A;--navy-700:#3B3F4A;
  --off-white:#F2F2F2;--white:#FFFFFF;
  --coral-500:#FC5A3A;--coral-600:#E24A2C;--coral-400:#FD7E63;
  --coral-text-light:#C23A20; /* coral escurecido só para texto pequeno sobre claro (AA) */
  --text-muted:#5F626B;--text-muted-inverse:#B4B7C0;
  --border-subtle:rgba(37,39,46,.14);--border-subtle-inverse:rgba(242,242,242,.18);
  --font-display:'Krona One',sans-serif;--font-tagline:'Raleway',sans-serif;--font-body:'Montserrat',sans-serif;
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--space-9:96px;--space-10:128px;
  --chamfer:22px;--chamfer-sm:12px;
  --gutter:clamp(20px,5vw,64px);
  --wrap:1280px;
  --ease:cubic-bezier(.4,0,.2,1);--ease-out:cubic-bezier(.16,1,.3,1);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---- Base ---- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px;scrollbar-color:var(--navy-700) var(--off-white);}
body{margin:0;background:var(--off-white);color:var(--navy-900);font-family:var(--font-body);font-size:1rem;line-height:1.65;font-weight:400;overflow-x:hidden;}
img{display:block;max-width:100%;height:auto;}
a{color:inherit;}
h1,h2,h3,p,ul,ol,figure,dl,dd{margin:0;}
ul,ol{padding:0;list-style:none;}
button{font:inherit;color:inherit;}
::selection{background:var(--coral-500);color:var(--navy-900);}
:focus-visible{outline:2px solid var(--coral-500);outline-offset:3px;}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.skip{position:absolute;left:-9999px;top:8px;z-index:200;padding:12px 18px;background:var(--coral-500);color:var(--navy-900);font-weight:600;}
.skip:focus{left:8px;}
.grain{position:relative;isolation:isolate;}
.grain::after{content:'';position:absolute;inset:0;pointer-events:none;background-image:var(--grain);opacity:.16;mix-blend-mode:soft-light;z-index:0;}
.grain > *{position:relative;z-index:1;}

/* ---- Tipografia de marca: caixa alta em duas cores ---- */
.display{font-family:var(--font-display);font-weight:400;text-transform:uppercase;letter-spacing:.02em;line-height:1.18;text-wrap:balance;}
.display .c{color:var(--coral-500);display:block;}
.display .n{display:block;}
.h2{font-size:clamp(1.55rem,3vw,2.6rem);}
.lead{font-size:1.125rem;line-height:1.7;max-width:52ch;}
.muted{color:var(--text-muted);}
.on-dark .muted{color:var(--text-muted-inverse);}

/* ---- Botões e links ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:14px 28px;border:0;cursor:pointer;text-decoration:none;
  font-family:var(--font-body);font-size:.8125rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  clip-path:polygon(0 0,calc(100% - var(--chamfer-sm)) 0,100% var(--chamfer-sm),100% 100%,0 100%);
  text-align:center;line-height:1.35;transition:background-color 200ms var(--ease),color 200ms var(--ease);}
.btn-coral{background:var(--coral-500);color:var(--navy-900);}
.btn-coral:hover{background:var(--coral-400);}
.btn img{width:18px;height:18px;flex-shrink:0;}
/* todo caminho para o WhatsApp usa o mesmo botão coral com o ícone; no celular ocupa a largura */
.promise-side .btn,.unseen-text .btn,.services-head .btn,.faq-side .btn{align-self:flex-start;}
@media (max-width:767px){main .btn{width:100%;}}
.tlink{display:inline-flex;align-items:center;gap:10px;min-height:44px;text-decoration:none;font-size:.8125rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;border-bottom:1px solid currentColor;}
.tlink:hover{color:var(--coral-500);}
.on-light .tlink:hover{color:var(--coral-text-light);}

/* ---- Hairline chanfrada: o "desenho de linha" da marca ---- */
.hair{position:absolute;pointer-events:none;--c:44px;}
.hair::before{content:'';position:absolute;inset:0;border-top:1px solid var(--coral-500);border-left:1px solid var(--coral-500);
  clip-path:polygon(var(--c) 0,100% 0,100% 100%,0 100%,0 var(--c));}
.hair::after{content:'';position:absolute;left:0;top:var(--c);width:calc(var(--c) * 1.4142);height:1px;background:var(--coral-500);transform-origin:0 0;transform:rotate(-45deg);}

/* ---- Cabeçalho ---- */
.top{position:fixed;inset:0 0 auto;z-index:100;transition:background-color 260ms var(--ease);}
.top.is-solid{background:var(--navy-900);}
.top-in{display:flex;align-items:center;justify-content:space-between;gap:var(--space-5);height:80px;max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);}
.top-logo img{width:122px;height:auto;}
.top-nav{display:none;align-items:center;gap:var(--space-6);}
.top-nav a{color:var(--off-white);text-decoration:none;font-size:.8125rem;font-weight:500;letter-spacing:.08em;padding:10px 0;border-bottom:1px solid transparent;transition:border-color 200ms var(--ease);}
.top-nav a:hover{border-color:var(--coral-500);}
.top-cta{display:none;min-height:44px;padding:10px 20px;}
.menu-btn{display:flex;flex-direction:column;justify-content:center;gap:6px;width:44px;height:44px;padding:0 10px;background:none;border:0;cursor:pointer;}
.menu-btn span{display:block;height:1.5px;background:var(--off-white);transition:transform 260ms var(--ease),opacity 200ms var(--ease);}
.menu-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(7.5px) rotate(45deg);}
.menu-btn[aria-expanded="true"] span:nth-child(2){opacity:0;}
.menu-btn[aria-expanded="true"] span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg);}
@media (min-width:1024px){.top-nav,.top-cta{display:inline-flex;}.menu-btn{display:none;}}
.menu{position:fixed;inset:0;z-index:90;display:flex;flex-direction:column;justify-content:center;gap:var(--space-7);padding:var(--space-9) var(--gutter);background:var(--navy-900);color:var(--off-white);
  transform:translateY(-100%);transition:transform 360ms var(--ease-out);visibility:hidden;}
.menu.is-open{transform:none;visibility:visible;}
.menu a.m{font-family:var(--font-display);font-size:1.4rem;text-transform:uppercase;text-decoration:none;padding:6px 0;}
.menu ul{display:flex;flex-direction:column;gap:var(--space-4);}
@media (min-width:1024px){.menu{display:none;}}

/* ---- 1. Hero com letreiro ---- */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;color:var(--off-white);background:var(--navy-900);overflow:hidden;}
.hero-media{position:absolute;inset:0;}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:0% 60%;}
/* o vídeo carrega depois da página e entra por cima da foto com uma fusão; a foto segue como capa */
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.4s var(--ease-out);}
.hero-video.is-on{opacity:1;}
.hero-media::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(37,39,46,.45) 0%,rgba(37,39,46,.05) 22%,rgba(37,39,46,.2) 42%,rgba(37,39,46,.82) 70%,rgba(37,39,46,.94) 100%),linear-gradient(270deg,rgba(37,39,46,.55) 0%,rgba(37,39,46,0) 60%);}
@media (max-width:767px){.hero-media img{object-position:50% 55%;}.hero-media::after{background:linear-gradient(180deg,rgba(37,39,46,.5) 0%,rgba(37,39,46,.06) 16%,rgba(37,39,46,.1) 44%,rgba(37,39,46,.72) 64%,rgba(37,39,46,.9) 84%,rgba(37,39,46,.94) 100%);}}
.marquee{position:absolute;left:0;right:0;top:30%;transform:translateY(-50%);overflow:hidden;pointer-events:none;}
.marquee-track{display:flex;width:max-content;animation:marquee 60s linear infinite;}
.marquee span{flex:0 0 auto;padding-right:.6em;font-family:var(--font-display);font-size:clamp(4rem,11vw,10rem);line-height:1;text-transform:uppercase;letter-spacing:.01em;white-space:nowrap;color:rgba(242,242,242,.32);}
@keyframes marquee{to{transform:translateX(-50%);}}
.hero-in{position:relative;width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter) var(--space-8);display:flex;flex-direction:column;gap:var(--space-6);}
.hero-copy{align-self:flex-end;max-width:620px;display:flex;flex-direction:column;gap:var(--space-5);}
.hero h1{font-size:clamp(1.6rem,2.9vw,2.6rem);}
.hero-sub{font-size:1.125rem;line-height:1.6;color:rgba(242,242,242,.92);max-width:44ch;}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-5);}
.hero-note{font-size:.875rem;color:rgba(242,242,242,.82);}
.caption{font-size:.75rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;}
.hero-cap{position:absolute;left:var(--gutter);bottom:var(--space-6);display:flex;align-items:center;gap:var(--space-3);color:rgba(242,242,242,.85);}
.hero-play{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;background:rgba(37,39,46,.35);border:1px solid rgba(242,242,242,.45);color:var(--off-white);cursor:pointer;transition:border-color 200ms var(--ease),background-color 200ms var(--ease);}
.hero-play[hidden]{display:none;}
.hero-play:hover{border-color:var(--coral-400);background:rgba(37,39,46,.6);}
.hero-play svg{width:14px;height:14px;}
.hero-play .i-play,.hero-play.is-paused .i-pause{display:none;}
.hero-play.is-paused .i-play{display:block;}
@media (max-width:767px){
  .hero-cap{left:auto;right:var(--gutter);bottom:auto;top:96px;}
  .hero-cap-txt{display:none;}
  .hero-copy{align-self:stretch;}
  .hero-actions .btn{width:100%;min-height:48px;padding:12px 16px;font-size:.75rem;letter-spacing:.08em;}
  .hero-in{padding-bottom:var(--space-6);gap:var(--space-4);}
  .hero-copy{gap:var(--space-3);}
  .hero-kicker{font-size:.625rem;letter-spacing:.12em;}
  .hero h1{font-size:1.3rem;line-height:1.2;}
  .hero-sub{font-size:.9375rem;line-height:1.5;}
  .hero-actions{gap:var(--space-2);}
  .hero-actions .tlink{min-height:40px;font-size:.75rem;}
  .hero-note{font-size:.75rem;line-height:1.45;}
}

/* ---- 2. Colagem + promessa ---- */
.collage{position:relative;padding:var(--space-10) 0 var(--space-9);overflow:hidden;}
.collage .marquee{top:300px;}
.collage .marquee span{color:rgba(37,39,46,.06);}
.collage-grid{position:relative;max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3);}
.collage-grid figure{margin:0;}
@media (max-width:1023px){.collage-grid .p3{grid-column:1/-1;order:-1;}.collage-grid .p3 img{aspect-ratio:16/10;}.collage-grid .p2,.collage-grid .p5{margin-top:var(--space-7);}.collage-grid .p4{margin-top:calc(-1 * var(--space-5));}.collage .marquee{top:160px;}.collage .marquee span{color:rgba(37,39,46,.09);}}
.collage-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;}
@media (min-width:1024px){
  .collage-grid{display:block;height:600px;}
  .collage-grid figure{position:absolute;}
  .collage-grid img{aspect-ratio:auto;height:100%;}
  .collage-grid .p1{left:3%;top:150px;width:24%;height:210px;}
  .collage-grid .p2{left:21%;top:20px;width:20%;height:170px;}
  .collage-grid .p3{left:36%;top:120px;width:24%;height:360px;}
  .collage-grid .p4{left:58%;top:240px;width:22%;height:190px;}
  .collage-grid .p5{left:72%;top:360px;width:24%;height:230px;}
}
.collage-grid figure:nth-child(3) img{clip-path:polygon(0 0,calc(100% - var(--chamfer)) 0,100% var(--chamfer),100% 100%,0 100%);}
.promise{max-width:var(--wrap);margin:var(--space-9) auto 0;padding:0 var(--gutter);display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-6);}
@media (min-width:1024px){.promise{grid-template-columns:minmax(0,1fr) minmax(0,8fr) minmax(300px,3fr);}.promise > :first-child{grid-column:2;}.promise .promise-side{align-self:end;}}
.lit{font-family:var(--font-display);font-weight:400;font-size:clamp(1.45rem,2.9vw,2.4rem);line-height:1.4;letter-spacing:.01em;text-transform:uppercase;text-wrap:pretty;}
.lit .w{color:rgba(37,39,46,.22);transition:color 220ms var(--ease);}
.lit .w.on{color:var(--navy-900);}
.lit .w.k.on{color:var(--coral-500);}
.promise-side{display:flex;flex-direction:column;gap:var(--space-4);}
.promise-side p{font-size:1rem;color:var(--text-muted);}

/* ---- 3. O que não se vê ---- */
.unseen{padding:var(--space-9) 0 var(--space-10);}
.unseen-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-8);align-items:center;}
@media (min-width:1024px){.unseen-grid{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--space-9);}}
.unseen-text{display:flex;flex-direction:column;gap:var(--space-5);}
.unseen-text p{max-width:46ch;}
.unseen-close{font-family:var(--font-body);font-weight:300;font-size:clamp(1.35rem,2.4vw,1.9rem);line-height:1.4;letter-spacing:.04em;margin-top:var(--space-3);}
.unseen-figure{position:relative;margin:0;padding:var(--space-6) 0 0 var(--space-6);}
.unseen-figure img{position:relative;width:100%;aspect-ratio:4/3;object-fit:cover;clip-path:polygon(0 0,calc(100% - var(--chamfer)) 0,100% var(--chamfer),100% 100%,0 100%);}
.unseen-figure .hair{inset:0 var(--space-6) var(--space-6) 0;}
.unseen-figure figcaption{margin-top:var(--space-3);color:var(--text-muted);}

/* ---- 4. Serviços numerados ---- */
.services{padding:var(--space-9) 0;border-top:1px solid var(--border-subtle);}
.services-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-8);}
@media (min-width:1024px){.services-grid{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:var(--space-9);}.services-head{order:2;position:sticky;top:120px;align-self:start;}}
.services-head{display:flex;flex-direction:column;gap:var(--space-5);}
.svc{padding:var(--space-7) 0;border-top:1px solid var(--border-subtle);}
.svc:first-child{border-top:0;padding-top:0;}
.svc h3{display:flex;gap:var(--space-4);align-items:baseline;font-family:var(--font-display);font-weight:400;font-size:clamp(1.15rem,1.8vw,1.5rem);text-transform:uppercase;line-height:1.3;}
.svc h3 b{font-weight:400;color:var(--coral-text-light);}
.svc > p{margin-top:var(--space-3);color:var(--text-muted);max-width:52ch;}
.svc ul{margin-top:var(--space-5);display:grid;grid-template-columns:minmax(0,1fr);gap:0;}
@media (min-width:640px){.svc ul{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--space-6);}}
.svc li{padding:var(--space-4) 0;border-top:1px solid var(--border-subtle);}
.svc li strong{display:block;font-weight:600;}
.svc li span{display:block;margin-top:2px;font-size:.9375rem;color:var(--text-muted);line-height:1.55;}
.services-head > img{width:100%;aspect-ratio:3/2;object-fit:cover;margin-top:var(--space-4);clip-path:polygon(0 0,100% 0,100% calc(100% - var(--chamfer)),calc(100% - var(--chamfer)) 100%,0 100%);}

/* ---- 5. Faixa navy: diferenciais em abas + números ---- */
.band{background:var(--navy-900);color:var(--off-white);padding:var(--space-9) 0;}
.band-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-8);}
@media (min-width:1024px){.band-grid{grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:var(--space-9);}}
.band-side{display:flex;flex-direction:column;gap:var(--space-7);}
@media (min-width:1024px){.band-side{position:sticky;top:120px;align-self:start;min-height:calc(100svh - 200px);justify-content:space-between;}}
.tabs{display:flex;flex-direction:column;}
.tabs a{display:flex;gap:var(--space-4);align-items:baseline;padding:var(--space-3) 0;text-decoration:none;color:var(--text-muted-inverse);font-weight:500;border-top:1px solid var(--border-subtle-inverse);transition:color 200ms var(--ease);}
.tabs a:last-child{border-bottom:1px solid var(--border-subtle-inverse);}
.tabs a b{font-weight:500;font-size:.75rem;letter-spacing:.1em;}
.tabs a.is-on,.tabs a:hover{color:var(--off-white);}
.tabs a.is-on b{color:var(--coral-500);}
@media (max-width:1023px){.tabs{display:none;}}
.diffs{display:flex;flex-direction:column;gap:var(--space-9);}
.diff img{width:100%;aspect-ratio:16/10;object-fit:cover;clip-path:polygon(0 0,calc(100% - var(--chamfer)) 0,100% var(--chamfer),100% 100%,0 100%);}
.diff h3{margin-top:var(--space-5);font-family:var(--font-display);font-weight:400;font-size:clamp(1.15rem,1.8vw,1.45rem);text-transform:uppercase;line-height:1.3;}
.diff h3 b{font-weight:400;color:var(--coral-500);margin-right:var(--space-3);}
.diff p{margin-top:var(--space-3);max-width:54ch;color:rgba(242,242,242,.86);}
/* números: quinto item da coluna que rola, um número por linha entre fios, como no Bright Avenue */
.nums dl{display:flex;flex-direction:column;margin-top:var(--space-6);}
.nums dl > div{padding:var(--space-6) 0 var(--space-7);border-top:1px solid var(--border-subtle-inverse);}
.nums dl > div:last-child{padding-bottom:0;}
.nums dt{font-family:var(--font-display);font-size:clamp(3.2rem,7vw,6rem);line-height:1;letter-spacing:-.02em;white-space:nowrap;}
.nums dt sup{font-size:.42em;vertical-align:top;position:relative;top:.06em;margin-left:.04em;color:var(--coral-500);line-height:1;}
.nums dt .u{font-size:.42em;margin-left:.2em;letter-spacing:0;}
.nums dd{margin-top:var(--space-4);font-size:1.0625rem;color:rgba(242,242,242,.86);max-width:30ch;}

/* ---- 5b. Faixa do lema ---- */
.motto{position:relative;min-height:100svh;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:var(--space-5);overflow:hidden;clip-path:inset(0);color:var(--off-white);background:var(--navy-900);}
.motto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
/* janela, como no Bright Avenue: perto da tela a foto passa a ser fixa no viewport e a faixa
   (recortada pelo clip-path) corre por cima dela; o texto rola junto com a página */
.motto.is-fixed img{position:fixed;}
.motto::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(37,39,46,.4) 0%,rgba(37,39,46,.62) 45%,rgba(37,39,46,.82) 100%);}
.motto p{position:relative;z-index:1;padding:0 var(--gutter);text-align:center;font-size:clamp(2rem,6.4vw,5.6rem);}
.motto .caption{position:absolute;z-index:1;left:var(--gutter);bottom:var(--space-6);color:rgba(242,242,242,.85);}

/* ---- 6. Projetos com abas ---- */
.projects{padding:var(--space-10) 0 var(--space-9);}
.projects-head{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-5);}
@media (min-width:1024px){.projects-head{grid-template-columns:minmax(0,7fr) minmax(0,4fr);align-items:end;}}
.pgrid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-7) var(--space-5);margin-top:var(--space-8);}
@media (min-width:640px){.pgrid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (min-width:1024px){.pgrid{grid-template-columns:repeat(3,minmax(0,1fr));}}
.pcard{display:block;width:100%;padding:0;background:none;border:0;text-align:left;cursor:pointer;}
.pcard-img{display:block;overflow:hidden;clip-path:polygon(0 0,calc(100% - var(--chamfer)) 0,100% var(--chamfer),100% 100%,0 100%);background:var(--navy-800);}
.pcard-img img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform 600ms var(--ease-out);}
.pcard:hover .pcard-img img{transform:scale(1.04);}
.pcard-name{display:block;margin-top:var(--space-4);font-family:var(--font-display);font-size:1.05rem;text-transform:uppercase;letter-spacing:.02em;}
.pcard-meta{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-3);}
.tag{display:inline-block;padding:4px 10px;border:1px solid var(--border-subtle);font-size:.75rem;font-weight:500;letter-spacing:.04em;color:var(--text-muted);}
.pcard-more{display:block;margin-top:var(--space-3);font-size:.8125rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--coral-text-light);}
.projects-note{margin-top:var(--space-6);font-size:.875rem;color:var(--text-muted);}
.projects-cta{margin-top:var(--space-7);display:flex;flex-wrap:wrap;gap:var(--space-5);align-items:center;}

/* ---- 7. Perguntas ---- */
.faq{background:var(--white);padding:var(--space-9) 0;}
.faq-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-7);}
@media (min-width:1024px){.faq-grid{grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:var(--space-9);}.faq-side{position:sticky;top:120px;align-self:start;}}
.faq-side{display:flex;flex-direction:column;gap:var(--space-5);}
.faq-item{border-top:1px solid var(--border-subtle);}
.faq-item:last-child{border-bottom:1px solid var(--border-subtle);}
.faq-q{display:flex;justify-content:space-between;align-items:center;gap:var(--space-5);width:100%;min-height:72px;padding:var(--space-4) 0;background:none;border:0;cursor:pointer;text-align:left;font-size:1.0625rem;font-weight:600;line-height:1.4;}
.faq-q i{position:relative;flex:0 0 18px;height:18px;}
.faq-q i::before,.faq-q i::after{content:'';position:absolute;left:0;right:0;top:50%;height:1.5px;background:var(--coral-500);transition:transform 260ms var(--ease);}
.faq-q i::after{transform:rotate(90deg);}
.faq-item.is-open .faq-q i::after{transform:rotate(0deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height 420ms var(--ease);}
.faq-a > div{padding:0 0 var(--space-6);max-width:62ch;display:flex;flex-direction:column;gap:var(--space-3);color:var(--text-muted);}
.faq-a ul{display:flex;flex-direction:column;gap:var(--space-2);padding-left:var(--space-5);list-style:disc;}
.faq-a a{color:var(--coral-text-light);font-weight:600;}
.faq-a a.btn{color:var(--navy-900);}

/* ---- 8. Indicação sobre foto ---- */
.refer{position:relative;min-height:84svh;display:flex;align-items:center;color:var(--off-white);background:var(--navy-900);overflow:hidden;}
.refer > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.refer::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(37,39,46,.88) 0%,rgba(37,39,46,.62) 46%,rgba(37,39,46,.15) 100%);}
.refer .wrap{position:relative;z-index:1;width:100%;}
.refer-box{max-width:560px;display:flex;flex-direction:column;gap:var(--space-5);}
.refer-box p{color:rgba(242,242,242,.92);}
.refer-actions{display:flex;flex-wrap:wrap;gap:var(--space-4) var(--space-6);margin-top:var(--space-3);}

/* ---- 9. CTAs finais + rodapé ---- */
.final{background:var(--navy-900);color:var(--off-white);padding:var(--space-10) 0 0;overflow:hidden;}
.final-head{position:relative;padding:var(--space-7) 0 0 var(--space-7);}
.final-head .hair{inset:0 auto auto 0;width:min(100%,780px);height:calc(100% + var(--space-7));--c:56px;}
.final-head p{margin-top:var(--space-4);color:rgba(242,242,242,.86);max-width:52ch;}
.doors{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-5);margin-top:var(--space-9);}
@media (min-width:768px){.doors{grid-template-columns:repeat(2,minmax(0,1fr));}}
.door{display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-7) var(--space-6);background:var(--navy-800);clip-path:polygon(0 0,calc(100% - var(--chamfer)) 0,100% var(--chamfer),100% 100%,0 100%);}
.door h3{font-family:var(--font-display);font-weight:400;font-size:1.2rem;text-transform:uppercase;line-height:1.3;}
.door p{color:rgba(242,242,242,.84);flex:1;}
.door .btn{align-self:flex-start;}
.final-micro{margin-top:var(--space-6);font-size:.875rem;color:rgba(242,242,242,.8);}
.foot{margin-top:var(--space-9);padding:var(--space-8) 0 var(--space-6);border-top:1px solid var(--border-subtle-inverse);color:rgba(242,242,242,.66);}
.foot-top{display:flex;flex-direction:column;gap:var(--space-7);padding-bottom:var(--space-7);border-bottom:1px solid var(--border-subtle-inverse);}
.foot-brand img{width:auto;height:51px;margin-bottom:var(--space-4);}
.foot-brand p{font-size:.9375rem;line-height:1.7;max-width:34ch;}
.foot-brand .foot-reg{margin-top:var(--space-3);font-size:.8125rem;line-height:1.6;}
.foot-cols{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-6);}
.foot h3{margin-bottom:var(--space-3);font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--off-white);}
.foot li{margin-bottom:var(--space-2);}
.foot li a{text-decoration:none;font-size:.9375rem;transition:color .2s var(--ease);}
.foot li a:hover{color:var(--coral-500);}
.foot-social a{display:inline-flex;align-items:center;gap:10px;padding:2px 0;}
.foot-social svg{width:17px;height:17px;flex-shrink:0;}
.foot-bottom{display:flex;flex-direction:column;gap:var(--space-3);padding-top:var(--space-5);font-size:.8125rem;}
.foot-tag{font-family:var(--font-tagline);font-weight:300;font-size:.9375rem;letter-spacing:.14em;text-transform:uppercase;color:var(--off-white);}
.foot-tag span{color:var(--coral-500);}
@media (max-width:767px){
  .foot-top,.foot-brand,.foot-cols,.foot-bottom{align-items:center;justify-items:center;text-align:center;}
  .foot-brand{display:flex;flex-direction:column;}
  .foot li{margin-bottom:0;}
  .foot li a{display:inline-flex;align-items:center;min-height:44px;}
  .foot-bottom > span{text-wrap:balance;}
  .foot-tag span{display:block;}
}
@media (min-width:768px){
  .foot-top{flex-direction:row;justify-content:space-between;}
  .foot-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-8);width:min(460px,52%);}
  .foot-bottom{flex-direction:row;justify-content:space-between;align-items:baseline;}
}

/* ---- Botão flutuante (mobile) ---- */
.float{position:fixed;right:16px;bottom:16px;z-index:80;display:flex;align-items:center;justify-content:center;width:56px;height:56px;background:var(--coral-500);
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%);opacity:0;pointer-events:none;transition:opacity 260ms var(--ease);}
.float img{width:26px;height:26px;}
.float.is-on{opacity:1;pointer-events:auto;}
@media (min-width:1024px){.float{display:none;}}

/* ---- Álbum (dialog) ---- */
.album{width:100vw;max-width:100vw;height:100svh;max-height:100svh;margin:0;padding:0;border:0;background:rgba(37,39,46,.97);color:var(--off-white);}
.album::backdrop{background:rgba(37,39,46,.6);}
.album-in{display:grid;grid-template-rows:auto 1fr auto;height:100%;padding:var(--space-4) var(--gutter) var(--space-5);gap:var(--space-4);}
.album-top{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);}
.album-title{font-family:var(--font-display);font-size:1rem;text-transform:uppercase;}
.album-x{width:48px;height:48px;background:none;border:1px solid var(--border-subtle-inverse);cursor:pointer;display:flex;align-items:center;justify-content:center;}
.album-x svg,.album-nav svg{width:22px;height:22px;}
.album-stage{position:relative;display:flex;align-items:center;justify-content:center;min-height:0;touch-action:pan-y;}
.album-stage img{max-width:100%;max-height:100%;object-fit:contain;}
.album-nav{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;background:rgba(37,39,46,.7);border:1px solid var(--border-subtle-inverse);cursor:pointer;display:flex;align-items:center;justify-content:center;}
.album-prev{left:0;}.album-next{right:0;}
.album-bottom{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);flex-wrap:wrap;}
.album-count{font-size:.875rem;color:rgba(242,242,242,.8);}

/* ---- Entrada discreta, uma vez ---- */
.rv{opacity:0;transform:translateY(20px);transition:opacity 700ms var(--ease-out),transform 800ms var(--ease-out);}
.rv.in{opacity:1;transform:none;}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .marquee-track{animation:none;}
  .rv{opacity:1;transform:none;transition:none;}
  .lit .w{color:var(--navy-900);transition:none;}
  .lit .w.k{color:var(--coral-500);}
  .pcard-img img,.menu{transition:none;}
}

/* Os renders têm o logo embutido no canto inferior direito: quando a imagem é recortada
   na largura, o corte sai todo à direita para o logo ficar inteiro fora do quadro. */
.collage-grid img,.unseen-figure img,.services-head > img,.diff img{object-position:0% 50%;}
#dif-4 img{object-position:50% 50%;} /* sala de jantar da AF: simétrica e sem logo */
.motto img{object-position:50% 0%;}

/* Residência NC: do estudo 3D à casa construída */
.pair{position:relative;margin:var(--space-8) 0 0;padding:var(--space-6) 0 0 var(--space-6);}
.pair .hair{inset:0 auto auto 0;width:60%;height:120px;}
.pair-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-4);}
@media (min-width:768px){.pair-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
.pair-item{position:relative;}
.pair-item img{width:100%;aspect-ratio:4/3;object-fit:cover;}
.pair-item:first-child img{object-position:72% 50%;}
.pair-item:last-child img{clip-path:polygon(0 0,calc(100% - var(--chamfer)) 0,100% var(--chamfer),100% 100%,0 100%);}
.pair-tag{position:absolute;left:0;bottom:0;padding:8px 12px;background:var(--navy-900);color:var(--off-white);font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;}
.pair figcaption{margin-top:var(--space-4);font-size:1rem;color:var(--text-muted);}
.pair figcaption strong{color:var(--navy-900);font-weight:600;}

/* Manifesto sob o lema, na faixa em janela */
.motto .motto-manifesto{position:relative;z-index:1;max-width:46ch;padding:0 var(--gutter);text-align:center;font-size:1rem;line-height:1.65;font-weight:400;letter-spacing:0;text-transform:none;color:rgba(242,242,242,.92);}

/* Caminho do Farol: seis passos numa linha do tempo, vertical no celular */
.path{padding:var(--space-9) 0;border-top:1px solid var(--border-subtle);}
.path-head{display:flex;flex-direction:column;gap:var(--space-4);max-width:46rem;}
.path-head .lead{max-width:48ch;}
.path-list{margin-top:var(--space-8);display:grid;grid-template-columns:minmax(0,1fr);}
.path-list li{position:relative;padding:0 0 var(--space-7) var(--space-6);border-left:1px solid var(--coral-500);}
.path-list li::before{content:'';position:absolute;left:-5px;top:4px;width:9px;height:9px;background:var(--coral-500);}
.path-list li:last-child{padding-bottom:0;border-left-color:transparent;}
.path-list li b{display:block;font-family:var(--font-display);font-weight:400;font-size:.75rem;letter-spacing:.1em;color:var(--coral-text-light);}
.path-list h3{margin-top:var(--space-2);font-family:var(--font-display);font-weight:400;font-size:1.05rem;text-transform:uppercase;line-height:1.3;}
.path-list p{margin-top:var(--space-3);font-size:.9375rem;line-height:1.6;color:var(--text-muted);}
.path-note{margin-top:var(--space-7);font-size:.875rem;color:var(--text-muted);}
.path-cta{margin-top:var(--space-6);display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-4) var(--space-6);}
.path-cta p{font-weight:600;}
@media (min-width:768px){
  .path-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-8) 0;}
  .path-list li{padding:var(--space-5) var(--space-5) 0 0;border-left:0;border-top:1px solid var(--coral-500);}
  .path-list li::before{left:0;top:-5px;}
  .path-list li:last-child{border-left-color:transparent;padding-bottom:0;}
}
@media (min-width:1200px){.path-list{grid-template-columns:repeat(6,minmax(0,1fr));}}

/* Serviços: o quinto benefício ocupa a linha inteira; bloco de escopo abaixo das duas listas */
@media (min-width:640px){.svc li:last-child:nth-child(odd){grid-column:1 / -1;}}
.scope{margin-top:var(--space-7);padding:var(--space-5) 0 0;border-top:1px solid var(--coral-500);display:grid;gap:var(--space-4);}
.scope p{font-size:.9375rem;line-height:1.6;color:var(--text-muted);}
.scope strong{color:var(--navy-900);font-weight:600;}

/* Linha de lugar e tipo acima do título do topo */
.hero-kicker{font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(242,242,242,.88);}

@media (max-width:767px) and (max-height:700px){.hero-note{display:none;}}