:root{
    --fundo:#170c0a;
    --superficie:#221211;
    --mogno:#3a1819;
    --creme:#f0e7d8;
    --creme-suave:rgba(240,231,216,.68);
    --dourado:#c8a765;
    --dourado-claro:#dcc28a;
    --linha:rgba(200,167,101,.22);
    --serif:"Didot","Bodoni 72","Playfair Display",Georgia,serif;
    --sans:"Avenir Next","Avenir","Seravek","Futura",-apple-system,"Helvetica Neue",sans-serif;
    color-scheme:dark;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  body{background:var(--fundo);color:var(--creme);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
  img{max-width:100%;display:block}
  a{color:inherit;text-decoration:none}

  .miolo{max-width:1180px;margin:0 auto;padding:0 32px}
  .rotulo{font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--dourado);font-weight:600}
  .titulo{font-family:var(--serif);font-weight:400;line-height:1.12;text-wrap:balance}

  /* ---------- header ---------- */
  header{position:sticky;top:0;z-index:50;background:#f5efe4;border-bottom:1px solid rgba(58,24,25,.12)}
  .barra{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:13px 32px;max-width:1280px;margin:0 auto}
  .barra img{height:42px;width:auto}
  nav{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
  nav a{color:#3a1819;font-size:13.5px;font-weight:500;letter-spacing:.03em;border-bottom:1.5px solid transparent;padding-bottom:2px;transition:border-color .2s}
  nav a:hover,nav a:focus-visible{border-color:var(--dourado)}
  nav a.ativo{border-color:#3a1819;font-weight:600}
  .tag-proto{font-size:10px;letter-spacing:.16em;color:#8a6f4d;border:1px solid #c8a765;border-radius:999px;padding:4px 10px;font-weight:600;white-space:nowrap}
  .cta{background:#3a1819;color:#f0e7d8;padding:11px 20px;border-radius:2px;font-size:14px;font-weight:600;letter-spacing:.05em;transition:background .2s;white-space:nowrap}
  .cta:hover,.cta:focus-visible{background:#5a2426}
  @media(max-width:1080px){nav{display:none}}

  /* ---------- páginas (router) ---------- */
  .pagina{display:none}
  .pagina.ativa{display:block;animation:surgir .45s ease}
  @keyframes surgir{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  @media(prefers-reduced-motion:reduce){.pagina.ativa{animation:none}}

  /* ---------- hero home ---------- */
  .hero .miolo{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center;padding-top:88px;padding-bottom:72px}
  .hero h1{font-size:clamp(42px,5.4vw,72px);margin:20px 0 24px}
  .hero h1 em,.titulo em{font-style:italic;color:var(--dourado-claro)}
  .hero p{max-width:32em;color:var(--creme-suave);font-size:18px}
  .hero-acoes{display:flex;gap:16px;margin-top:34px;flex-wrap:wrap}
  .botao-ouro{background:var(--dourado);color:#241312;padding:15px 28px;border-radius:2px;font-weight:700;font-size:15px;letter-spacing:.04em;transition:background .2s;border:none;cursor:pointer;font-family:var(--sans)}
  .botao-ouro:hover,.botao-ouro:focus-visible{background:var(--dourado-claro)}
  .botao-borda{border:1px solid var(--linha);color:var(--creme);padding:15px 28px;border-radius:2px;font-weight:500;font-size:15px;transition:border-color .2s,background .2s;display:inline-block}
  .botao-borda:hover,.botao-borda:focus-visible{border-color:var(--dourado);background:rgba(200,167,101,.08)}
  .hero-foto{position:relative}
  .hero-foto img{width:100%;border-radius:4px;box-shadow:0 40px 80px rgba(0,0,0,.5)}
  .hero-foto::after{content:"";position:absolute;inset:0;border-radius:4px;box-shadow:inset 0 0 60px 24px var(--fundo)}
  @media(max-width:900px){.hero .miolo{grid-template-columns:1fr;padding-top:56px;padding-bottom:56px}}

  /* ---------- faixa de provas ---------- */
  .provas{border-top:1px solid var(--linha);border-bottom:1px solid var(--linha);background:var(--superficie)}
  .provas .miolo{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding-top:34px;padding-bottom:34px}
  .prova strong{display:block;font-family:var(--serif);font-size:30px;color:var(--dourado);font-weight:400;font-variant-numeric:tabular-nums}
  .prova span{font-size:13.5px;color:var(--creme-suave);letter-spacing:.04em}
  @media(max-width:900px){.provas .miolo{grid-template-columns:1fr 1fr}}

  /* ---------- seções ---------- */
  .secao{padding:96px 0;border-bottom:1px solid var(--linha)}
  .secao:last-of-type{border-bottom:none}
  .cabeca-secao{max-width:640px;margin-bottom:52px}
  .cabeca-secao h2{font-size:clamp(30px,3.6vw,46px);margin-top:16px}
  .cabeca-secao p{margin-top:16px;color:var(--creme-suave)}
  .centrado{text-align:center;margin-left:auto;margin-right:auto}

  /* muro do zero */
  .zero{padding:100px 0;border-bottom:1px solid var(--linha);text-align:center}
  .zero h2{font-size:clamp(32px,4.4vw,56px);line-height:1.22}
  .zero h2 span{display:block}
  .zero h2 .ouro{color:var(--dourado)}
  .zero p{margin-top:26px;color:var(--creme-suave);max-width:38em;margin-left:auto;margin-right:auto}

  /* cards de linha */
  .linhas{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
  .linha-card{background:var(--superficie);border:1px solid var(--linha);border-radius:4px;overflow:hidden;display:flex;flex-direction:column;transition:transform .25s,border-color .25s}
  .linha-card:hover{transform:translateY(-4px);border-color:rgba(200,167,101,.45)}
  .linha-card .foto{background:#000;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;overflow:hidden}
  .linha-card .foto img{width:76%;height:auto}
  .linha-card .texto{padding:26px;display:flex;flex-direction:column;gap:12px;flex:1}
  .linha-card h3{font-family:var(--serif);font-weight:400;font-size:25px}
  .linha-card p{color:var(--creme-suave);font-size:15.5px;flex:1}
  .linha-card .saiba{color:var(--dourado);font-size:13px;letter-spacing:.14em;text-transform:uppercase;font-weight:600}
  @media(max-width:900px){.linhas{grid-template-columns:1fr}}

  /* banda dupla (foto + texto) */
  .banda{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center}
  .banda.invertida{grid-template-columns:1.1fr .9fr}
  .banda-foto{background:#000;border-radius:4px;padding:38px;border:1px solid var(--linha)}
  .banda h2{font-size:clamp(30px,3.6vw,44px);margin-top:14px}
  .banda .texto>p{margin-top:16px;color:var(--creme-suave)}
  ul.riscas{list-style:none;margin-top:26px;display:flex;flex-direction:column;gap:16px}
  ul.riscas li{display:flex;gap:16px;align-items:baseline;color:var(--creme-suave)}
  ul.riscas li::before{content:"—";color:var(--dourado);flex:0 0 auto}
  ul.riscas li strong{color:var(--creme);font-weight:600}
  @media(max-width:900px){.banda,.banda.invertida{grid-template-columns:1fr}}

  /* grade portfólio */
  .grade-portfolio{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
  .grade-portfolio.seis{grid-template-columns:repeat(3,1fr)}
  .item-port{background:#000;border:1px solid var(--linha);border-radius:4px;overflow:hidden;text-align:center;padding-bottom:16px}
  .item-port img{aspect-ratio:1/1;object-fit:contain;padding:16px;width:100%}
  .item-port span{font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--creme-suave)}
  @media(max-width:900px){.grade-portfolio,.grade-portfolio.seis{grid-template-columns:repeat(2,1fr)}}

  /* passos */
  .passos{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;counter-reset:passo}
  .passos.cinco{grid-template-columns:repeat(5,1fr)}
  .passo{border-top:1px solid var(--linha);padding-top:20px}
  .passo::before{counter-increment:passo;content:counter(passo,decimal-leading-zero);font-family:var(--serif);font-size:36px;color:var(--dourado);display:block;margin-bottom:10px}
  .passo h3{font-size:16.5px;font-weight:600;margin-bottom:8px}
  .passo p{font-size:14.5px;color:var(--creme-suave)}
  @media(max-width:900px){.passos,.passos.cinco{grid-template-columns:1fr 1fr}}

  /* hero interno */
  .hero-interno{padding:84px 0 64px;border-bottom:1px solid var(--linha)}
  .hero-interno h1{font-size:clamp(36px,4.6vw,60px);margin-top:18px;max-width:16em}
  .hero-interno .sub{margin-top:20px;color:var(--creme-suave);max-width:36em;font-size:18px}

  /* tabela de especificações */
  .tabela-wrap{overflow-x:auto;border:1px solid var(--linha);border-radius:4px}
  table{width:100%;border-collapse:collapse;background:var(--superficie);font-size:15px}
  th{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--dourado);font-weight:600;text-align:left}
  th,td{padding:16px 20px;border-bottom:1px solid var(--linha)}
  tr:last-child td{border-bottom:none}
  td{color:var(--creme-suave)}
  td:first-child{color:var(--creme);font-weight:500}

  /* selos */
  .selos{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px}
  .selo{border:1px solid var(--linha);border-radius:999px;padding:8px 18px;font-size:13px;letter-spacing:.08em;color:var(--creme-suave)}
  .selo b{color:var(--dourado);font-weight:700}

  /* FAQ */
  details{border:1px solid var(--linha);border-radius:4px;background:var(--superficie);margin-bottom:14px}
  summary{padding:20px 24px;cursor:pointer;font-weight:600;font-size:16px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
  summary::after{content:"+";font-family:var(--serif);font-size:26px;color:var(--dourado);flex:0 0 auto}
  details[open] summary::after{content:"–"}
  details .resposta{padding:0 24px 20px;color:var(--creme-suave);font-size:15.5px;max-width:60em}

  /* citação/manifesto */
  .citacao{font-family:var(--serif);font-size:clamp(24px,3vw,36px);line-height:1.35;max-width:26em;margin:0 auto;text-align:center;font-weight:400}
  .citacao .ouro{color:var(--dourado)}

  /* banda CTA final */
  .cta-banda{background:var(--superficie);border-top:1px solid var(--linha)}
  .cta-banda .miolo{padding-top:72px;padding-bottom:72px;text-align:center}
  .cta-banda h2{font-size:clamp(30px,3.8vw,46px)}
  .cta-banda p{color:var(--creme-suave);margin:16px auto 30px;max-width:34em}

  /* contato */
  .contato{display:grid;grid-template-columns:1fr 1fr;gap:60px}
  form{display:flex;flex-direction:column;gap:16px}
  label{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--creme-suave);display:flex;flex-direction:column;gap:8px}
  input,select,textarea{background:var(--superficie);border:1px solid var(--linha);border-radius:2px;color:var(--creme);padding:13px 14px;font-family:var(--sans);font-size:15px}
  input:focus-visible,select:focus-visible,textarea:focus-visible{outline:1.5px solid var(--dourado);outline-offset:1px}
  .dupla{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .zap{display:inline-block;margin-top:26px;border:1px solid var(--linha);padding:14px 24px;border-radius:2px;font-weight:600;font-size:15px;transition:border-color .2s}
  .zap:hover{border-color:var(--dourado)}
  @media(max-width:900px){.contato{grid-template-columns:1fr}}

  /* footer */
  footer{background:#120908;border-top:1px solid var(--linha);padding:64px 0 40px}
  .pe-grade{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:48px;padding-bottom:44px;border-bottom:1px solid var(--linha)}
  .pe-marca{font-family:var(--serif);font-size:24px}
  .pe-marca small{display:block;font-family:var(--sans);font-size:10px;letter-spacing:.3em;color:var(--dourado);text-transform:uppercase;margin-top:6px}
  .pe-grade p{color:var(--creme-suave);font-size:14.5px;margin-top:14px;max-width:26em}
  .pe-grade h4{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--dourado);font-weight:600;margin-bottom:16px}
  .pe-grade ul{list-style:none;display:flex;flex-direction:column;gap:10px}
  .pe-grade ul a{color:var(--creme-suave);font-size:14.5px}
  .pe-grade ul a:hover{color:var(--creme)}
  .pe-final{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:26px;color:rgba(240,231,216,.45);font-size:12.5px}
  @media(max-width:900px){.pe-grade{grid-template-columns:1fr}}

  /* revelação */
  .revela{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
  .revela.visivel{opacity:1;transform:none}
  @media(prefers-reduced-motion:reduce){
    .revela{opacity:1;transform:none;transition:none}
    .linha-card,.linha-card:hover{transform:none;transition:none}
  }

  #toast{position:fixed;left:50%;bottom:32px;transform:translateX(-50%) translateY(20px);background:#f5efe4;color:#3a1819;padding:16px 24px;border-radius:3px;font-size:14.5px;font-weight:500;box-shadow:0 12px 40px rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;max-width:90vw;text-align:center;z-index:99}
  #toast.ativo{opacity:1;transform:translateX(-50%) translateY(0)}