/* ============================================================
   GM VENTURES — sistema de design
   Conceito: encadernação de livro. Pano verde-garrafa, carimbo
   a folha de ouro, ficha de catálogo de biblioteca como motivo
   estrutural. Tipografia serifada expressiva + monoespaçada de
   "ficha catalográfica" para rótulos e dados legais.
   ============================================================ */

   @import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,560;0,9..144,680;1,9..144,500&family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;1,6..72,400&family=Space+Mono:wght@400;700&display=swap');

   :root{
     /* cor — encadernação */
     --cloth:        #1f3129;   /* verde-garrafa, pano de capa */
     --cloth-deep:   #131f19;   /* verde profundo, sombras/gradiente */
     --oxblood:      #6d2c2c;   /* vinho, guarda-livros / acento secundário */
     --foil:         #b8912f;   /* folha de ouro */
     --foil-bright:  #dcb662;   /* folha de ouro, hover/destaque */
     --paper:        #f4efe2;   /* papel — fundo claro e texto sobre escuro */
     --paper-dim:    #e6ddc6;   /* papel envelhecido — bordas, divisores */
     --ink:          #171310;   /* tinta — texto principal sobre papel */
     --ink-soft:     #4a4038;   /* tinta diluída — texto secundário */
   
     --serif-display: 'Fraunces', ui-serif, Georgia, serif;
     --serif-body: 'Newsreader', ui-serif, Georgia, serif;
     --mono: 'Space Mono', ui-monospace, 'SFMono-Regular', monospace;
   
     --max: 1120px;
     --edge: clamp(24px, 6vw, 72px);
   }
   
   *{ box-sizing:border-box; }
   html{ scroll-behavior:smooth; }
   body{
     margin:0;
     background:var(--paper);
     color:var(--ink);
     font-family:var(--serif-body);
     font-size:18px;
     line-height:1.6;
     -webkit-font-smoothing:antialiased;
   }
   img{ max-width:100%; display:block; }
   a{ color:inherit; }
   
   @media (prefers-reduced-motion: reduce){
     *{ animation-duration:0.001ms !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
   }
   
   ::selection{ background:var(--foil); color:var(--cloth-deep); }
   
   /* ---------- utilitários de tipografia ---------- */
   .eyebrow{
     font-family:var(--mono);
     font-size:12.5px;
     letter-spacing:0.14em;
     text-transform:uppercase;
     display:inline-flex;
     align-items:center;
     gap:10px;
   }
   .eyebrow::before{
     content:"";
     width:18px; height:1px;
     background:currentColor;
     opacity:0.55;
   }
   h1,h2,h3{
     font-family:var(--serif-display);
     font-weight:680;
     line-height:1.05;
     margin:0 0 0.4em;
     letter-spacing:-0.01em;
   }
   h1{ font-size:clamp(40px, 6.4vw, 78px); }
   h2{ font-size:clamp(28px, 3.6vw, 42px); }
   h3{ font-size:clamp(20px, 2.2vw, 24px); font-weight:560; }
   p{ margin:0 0 1em; color:var(--ink-soft); max-width:62ch; }
   .lede{ font-size:1.2em; color:var(--ink); }
   
   .rule{
     width:56px; height:2px;
     background:var(--foil);
     margin:18px 0 26px;
     border:none;
   }
   .rule.center{ margin-left:auto; margin-right:auto; }
   
   /* ---------- foco visível (acessibilidade) ---------- */
   a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
     outline:2px solid var(--foil);
     outline-offset:3px;
     border-radius:2px;
   }
   
   /* ============================================================
      NAV — barra de lombada
      ============================================================ */
   .nav{
     position:sticky; top:0; z-index:50;
     background:var(--cloth);
     border-bottom:1px solid rgba(244,239,226,0.12);
   }
   .nav-inner{
     max-width:var(--max); margin:0 auto; padding:16px var(--edge);
     display:flex; align-items:center; justify-content:space-between; gap:24px;
   }
   .brand{
     display:flex; align-items:center; gap:12px;
     text-decoration:none; color:var(--paper);
   }
   .brand-mark{
     width:34px; height:34px; border-radius:50%;
     border:1.4px solid var(--foil);
     display:flex; align-items:center; justify-content:center;
     font-family:var(--serif-display); font-weight:680; font-size:14px;
     color:var(--foil-bright);
     flex:none;
   }
   .brand-name{ font-family:var(--serif-display); font-weight:680; font-size:17px; letter-spacing:0.01em; }
   .brand-tag{
     display:block; font-family:var(--mono); font-size:10px; letter-spacing:0.12em;
     color:rgba(244,239,226,0.55); text-transform:uppercase; margin-top:1px;
   }
   .nav-links{ display:flex; align-items:center; gap:30px; list-style:none; margin:0; padding:0; }
   .nav-links a{
     text-decoration:none; color:var(--paper); font-family:var(--mono);
     font-size:12.5px; letter-spacing:0.09em; text-transform:uppercase;
     opacity:0.78; transition:opacity .2s ease, color .2s ease;
     position:relative; padding-bottom:3px;
   }
   .nav-links a:hover, .nav-links a[aria-current="page"]{ opacity:1; color:var(--foil-bright); }
   .nav-links a[aria-current="page"]::after{
     content:""; position:absolute; left:0; right:0; bottom:-3px; height:1px; background:var(--foil-bright);
   }
   .nav-toggle{ display:none; }
   
   @media (max-width: 720px){
     .nav-links{
       position:fixed; inset:60px 0 auto 0; flex-direction:column; align-items:flex-start;
       background:var(--cloth); padding:20px var(--edge) 28px; gap:18px;
       transform:translateY(-8px); opacity:0; pointer-events:none;
       transition:opacity .2s ease, transform .2s ease;
       border-bottom:1px solid rgba(244,239,226,0.12);
     }
     .nav-links.open{ transform:translateY(0); opacity:1; pointer-events:auto; }
     .nav-toggle{
       display:inline-flex; background:none; border:1px solid rgba(244,239,226,0.35);
       color:var(--paper); border-radius:4px; padding:8px 10px; font-family:var(--mono); font-size:12px;
       cursor:pointer;
     }
   }
   
   /* ============================================================
      HERO
      ============================================================ */
   .hero{
     background:
       radial-gradient(ellipse at 50% -10%, rgba(184,145,47,0.18), transparent 55%),
       linear-gradient(180deg, var(--cloth) 0%, var(--cloth-deep) 100%);
     color:var(--paper);
     padding:96px var(--edge) 84px;
     position:relative;
     overflow:hidden;
   }
   .hero::before{
     content:"";
     position:absolute; inset:0;
     background-image:
       repeating-linear-gradient(90deg, rgba(244,239,226,0.035) 0px, rgba(244,239,226,0.035) 1px, transparent 1px, transparent 84px);
     pointer-events:none;
   }
   .hero-inner{ max-width:var(--max); margin:0 auto; position:relative; text-align:center; }
   .seal{
     width:96px; height:96px; margin:0 auto 30px;
     border-radius:50%;
     border:1.5px solid var(--foil);
     display:flex; align-items:center; justify-content:center;
     position:relative;
     animation:seal-in .9s cubic-bezier(.2,.8,.2,1) both;
   }
   .seal::before{
     content:""; position:absolute; inset:6px; border-radius:50%;
     border:1px solid rgba(220,182,98,0.45);
   }
   .seal-mark{ font-family:var(--serif-display); font-weight:680; font-size:30px; color:var(--foil-bright); }
   @keyframes seal-in{ from{ opacity:0; transform:scale(.85); } to{ opacity:1; transform:scale(1); } }
   
   .hero .eyebrow{ color:var(--foil-bright); justify-content:center; margin-bottom:22px; }
   .hero .eyebrow::before{ display:none; }
   .hero h1{ max-width:16ch; margin-left:auto; margin-right:auto; }
   .hero h1 em{ font-style:italic; color:var(--foil-bright); font-weight:500; }
   .hero .lede{ color:rgba(244,239,226,0.82); max-width:52ch; margin:22px auto 34px; }
   
   .cta-row{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
   .btn{
     font-family:var(--mono); font-size:13px; letter-spacing:0.08em; text-transform:uppercase;
     text-decoration:none; padding:14px 26px; border-radius:3px; display:inline-block;
     transition:transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
   }
   .btn-primary{ background:var(--foil); color:var(--cloth-deep); border:1px solid var(--foil); font-weight:700; }
   .btn-primary:hover{ background:var(--foil-bright); transform:translateY(-1px); }
   .btn-ghost{ background:transparent; color:var(--paper); border:1px solid rgba(244,239,226,0.4); }
   .btn-ghost:hover{ border-color:var(--foil-bright); color:var(--foil-bright); }
   
   /* faixa de registro legal sob o hero */
   .registry{
     background:var(--cloth-deep);
     border-top:1px solid rgba(244,239,226,0.1);
     border-bottom:1px solid rgba(244,239,226,0.1);
     padding:14px var(--edge);
   }
   .registry-inner{
     max-width:var(--max); margin:0 auto;
     display:flex; flex-wrap:wrap; gap:10px 34px; justify-content:center;
     font-family:var(--mono); font-size:11.5px; letter-spacing:0.06em;
     color:rgba(244,239,226,0.55); text-transform:uppercase;
   }
   .registry-inner span b{ color:rgba(244,239,226,0.85); font-weight:400; }
   
   /* ============================================================
      SEÇÕES — página comum
      ============================================================ */
   .section{ padding:88px var(--edge); }
   .section-inner{ max-width:var(--max); margin:0 auto; }
   .section.dark{ background:var(--cloth); color:var(--paper); }
   .section.dark .eyebrow{ color:var(--foil-bright); }
   .section.dark p{ color:rgba(244,239,226,0.78); }
   .section.dark h2{ color:var(--paper); }
   .section-head{ max-width:640px; margin-bottom:52px; }
   .section.center .section-head{ margin-left:auto; margin-right:auto; text-align:center; }
   
   /* ficha de catálogo — cartão base */
   .card{
     background:var(--paper);
     border:1px solid var(--paper-dim);
     border-radius:2px;
     padding:30px 28px;
     position:relative;
   }
   .card::before{
     content:"";
     position:absolute; top:0; left:22px; width:1px; height:14px;
     background:var(--foil);
   }
   .card .index{
     font-family:var(--mono); font-size:11px; color:var(--foil);
     letter-spacing:0.1em; display:block; margin-bottom:14px;
   }
   .card h3{ margin-bottom:10px; }
   .card p{ margin-bottom:0; font-size:0.95em; }
   
   .grid-3{ display:grid; grid-template-columns:repeat(3, 1fr); gap:22px; }
   .grid-2{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; align-items:start; }
   @media (max-width: 860px){
     .grid-3{ grid-template-columns:1fr; }
     .grid-2{ grid-template-columns:1fr; gap:40px; }
   }
   
   .stat-row{ display:flex; gap:40px; flex-wrap:wrap; margin-top:8px; }
   .stat b{ display:block; font-family:var(--serif-display); font-size:30px; color:var(--foil); font-weight:680; }
   .stat span{ font-family:var(--mono); font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft); }
   .section.dark .stat span{ color:rgba(244,239,226,0.6); }
   
   .divider-mark{
     text-align:center; color:var(--foil); font-size:20px; letter-spacing:0.5em;
     padding:8px 0 0;
   }
   
   /* ---------- formulário (contato) ---------- */
   .field{ margin-bottom:20px; }
   .field label{
     display:block; font-family:var(--mono); font-size:11.5px; letter-spacing:0.08em;
     text-transform:uppercase; color:var(--ink-soft); margin-bottom:8px;
   }
   .field input, .field textarea{
     width:100%; font-family:var(--serif-body); font-size:16px; color:var(--ink);
     background:var(--paper); border:1px solid var(--paper-dim); border-radius:2px;
     padding:12px 14px; resize:vertical;
   }
   .field input:focus, .field textarea:focus{ border-color:var(--foil); }
   .form-note{ font-family:var(--mono); font-size:11.5px; color:var(--ink-soft); margin-top:14px; }
   
   .contact-list{ list-style:none; margin:0; padding:0; }
   .contact-list li{
     display:flex; gap:14px; padding:16px 0; border-bottom:1px solid var(--paper-dim);
   }
   .section.dark .contact-list li{ border-bottom-color:rgba(244,239,226,0.14); }
   .contact-list .k{
     font-family:var(--mono); font-size:11px; letter-spacing:0.08em; text-transform:uppercase;
     color:var(--foil); width:132px; flex:none; padding-top:3px;
   }
   .contact-list .v{ color:var(--ink); }
   .section.dark .contact-list .v{ color:var(--paper); }
   .contact-list a.v{ text-decoration:none; }
   .contact-list a.v:hover{ color:var(--foil); }
   
   /* ============================================================
      COLOFÃO — rodapé
      ============================================================ */
   .colophon{
     background:var(--cloth-deep); color:rgba(244,239,226,0.72);
     padding:64px var(--edge) 36px;
   }
   .colophon-inner{ max-width:var(--max); margin:0 auto; }
   .colophon-grid{
     display:grid; grid-template-columns:1.1fr 0.85fr 0.85fr 0.95fr; gap:34px;
     padding-bottom:36px; border-bottom:1px solid rgba(244,239,226,0.12);
   }
   @media (max-width: 720px){ .colophon-grid{ grid-template-columns:1fr; gap:30px; } }
   .colophon h4{
     font-family:var(--mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase;
     color:var(--foil-bright); margin:0 0 16px;
   }
   .colophon .brand{ margin-bottom:14px; }
   .colophon p{ color:rgba(244,239,226,0.68); font-size:0.92em; }
   .colophon ul{ list-style:none; margin:0; padding:0; }
   .colophon li{ margin-bottom:10px; font-size:0.94em; }
   .colophon a{ text-decoration:none; color:rgba(244,239,226,0.78); }
   .colophon a:hover{ color:var(--foil-bright); }
   .colophon-legal{ font-family:var(--mono); font-size:10.5px; line-height:1.9; color:rgba(244,239,226,0.42); }
   .colophon-bottom{
     padding-top:22px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
     font-family:var(--mono); font-size:11px; letter-spacing:0.04em; color:rgba(244,239,226,0.42);
   }
   
   /* ---------- animação de entrada leve (nunca oculta conteúdo) ---------- */
   .reveal{ opacity:1; }
   @media (prefers-reduced-motion: no-preference){
     .reveal{ animation:reveal-in .7s ease both; }
   }
   @keyframes reveal-in{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:translateY(0); } }