@font-face{font-family:"Playfair Display";font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/playfair-display-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Playfair Display";font-weight:500;font-style:normal;font-display:swap;src:url(../fonts/playfair-display-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Playfair Display";font-weight:400;font-style:italic;font-display:swap;src:url(../fonts/playfair-display-latin-400-italic.woff2) format("woff2")}
@font-face{font-family:"Playfair Display";font-weight:500;font-style:italic;font-display:swap;src:url(../fonts/playfair-display-latin-500-italic.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-weight:400;font-display:swap;src:url(../fonts/dm-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-weight:500;font-display:swap;src:url(../fonts/dm-sans-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-weight:600;font-display:swap;src:url(../fonts/dm-sans-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-weight:700;font-display:swap;src:url(../fonts/dm-sans-latin-700-normal.woff2) format("woff2")}

:root{
  --noite:#071a2a;
  --azul:#0d2939;
  --azul-2:#0b2230;
  --azul-3:#102d3d;
  --rodape:#03121e;
  --areia:#f1eee8;
  --tinta:#132837;
  --texto:#ede8df;
  --texto-suave:#c4cacb;
  --ouro:#c4a46e;
  --ouro-botao:#d5b47a;
  --ouro-claro:#e2c99a;
  --linha-clara:rgba(255,255,255,.14);
  --linha-escura:#c2c6c4;
  --serifa:"Playfair Display",Georgia,"Times New Roman",serif;
  --sans:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --lado:clamp(22px,8vw,150px);
  --topo:88px;
  --ease:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-padding-top:var(--topo)}
html.lenis,html.lenis body{height:auto}
.lenis:not(.lenis-autoToggle).lenis-stopped{overflow:clip}
body{background:var(--noite);color:var(--texto);font-family:var(--sans);font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:clip;text-rendering:optimizeLegibility}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
svg{flex:none}
:focus-visible{outline:2px solid var(--ouro);outline-offset:4px}
h1,h2,h3{font-family:var(--serifa);font-weight:400;letter-spacing:-.015em}
h1,h2{line-height:1.06}
h2{font-size:clamp(38px,5vw,76px)}
em{font-style:italic;color:var(--ouro);font-weight:400}
.section-label,.eyebrow{display:block;font:600 12px/1.4 var(--sans);letter-spacing:.2em;color:var(--ouro);text-transform:uppercase}

/* linhas com máscara (SplitText) */
.linha-mascara{overflow:clip;padding-bottom:.08em;margin-bottom:-.08em}

/* ---------- cabeçalho ---------- */
.site-header{position:fixed;inset:0 0 auto;z-index:60;height:var(--topo);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 var(--lado);padding-top:env(safe-area-inset-top);border-bottom:1px solid transparent;transition:background-color .5s var(--ease),border-color .5s var(--ease),backdrop-filter .5s;will-change:transform}
.site-header.solido{background:rgba(7,26,42,.82);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border-bottom-color:var(--linha-clara)}
.brand{display:flex;align-items:center;gap:14px;min-height:44px;position:relative;z-index:2}
.brand-symbol{font:400 34px/1 var(--serifa);color:var(--ouro);letter-spacing:-.04em}
.brand-symbol span{font-weight:400;margin:0 -.04em;opacity:.8}
.brand-name{font:400 20px/1.05 var(--serifa);color:var(--texto)}
.brand-name small{display:block;font:600 11px/1 var(--sans);letter-spacing:.32em;margin-top:6px;color:var(--texto)}
.site-nav{display:flex;align-items:center;gap:34px}
.site-nav a{position:relative;font:600 14px/1 var(--sans);color:var(--texto);padding:14px 0}
.site-nav a:not(.nav-contact)::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:1px;background:var(--ouro);transform:scaleX(0);transform-origin:right;transition:transform .6s var(--ease)}
.site-nav a:not(.nav-contact):hover::after{transform:scaleX(1);transform-origin:left}
.nav-contact{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(237,232,223,.75);padding:15px 20px!important;transition:background-color .4s var(--ease),color .4s var(--ease),border-color .4s}
.nav-contact svg,.btn svg,.form-bottom button svg{width:14px;height:14px;transition:transform .5s var(--ease)}
.nav-contact:hover{background:var(--texto);color:var(--noite)}
.nav-contact:hover svg,.btn:hover svg,.form-bottom button:hover svg{transform:translate(2px,-2px)}
.btn.ghost:hover svg{transform:translateY(3px)}
.menu-toggle{display:none;position:relative;z-index:2;width:48px;height:48px;margin-right:-10px;border:0;background:transparent;color:var(--texto);cursor:pointer}
.menu-toggle i{position:absolute;left:12px;right:12px;height:1.5px;background:currentColor;transition:transform .6s var(--ease),top .6s var(--ease)}
.menu-toggle i:first-child{top:19px}.menu-toggle i:last-child{top:28px}
.menu-aberto .menu-toggle i:first-child{top:23.5px;transform:rotate(45deg)}
.menu-aberto .menu-toggle i:last-child{top:23.5px;transform:rotate(-45deg)}

/* menu do celular em tela cheia */
.menu-celular{position:fixed;inset:0;z-index:55;background:var(--noite);display:flex;flex-direction:column;justify-content:space-between;padding:calc(var(--topo) + 40px + env(safe-area-inset-top)) 26px calc(34px + env(safe-area-inset-bottom));clip-path:inset(0 0 100% 0);visibility:hidden;transition:clip-path .8s var(--ease),visibility 0s linear .8s}
.menu-aberto .menu-celular{clip-path:inset(0 0 0 0);visibility:visible;transition:clip-path .8s var(--ease),visibility 0s}
.menu-celular nav{display:flex;flex-direction:column}
.menu-celular nav a{display:block;overflow:hidden;font:400 clamp(36px,10.5vw,48px)/1.25 var(--serifa);color:var(--texto);padding:6px 0;border-bottom:1px solid var(--linha-clara)}
.menu-celular nav a span{display:inline-block;transform:translateY(105%);transition:transform .9s var(--ease)}
.menu-aberto .menu-celular nav a span{transform:none}
.menu-aberto .menu-celular nav a:nth-child(1) span{transition-delay:.18s}
.menu-aberto .menu-celular nav a:nth-child(2) span{transition-delay:.24s}
.menu-aberto .menu-celular nav a:nth-child(3) span{transition-delay:.30s}
.menu-aberto .menu-celular nav a:nth-child(4) span{transition-delay:.36s}
.menu-aberto .menu-celular nav a:nth-child(5) span{transition-delay:.42s}
.menu-whats{display:flex;align-items:center;gap:12px;font:600 16px/1 var(--sans);color:var(--ouro);min-height:48px;opacity:0;transform:translateY(10px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.menu-aberto .menu-whats{opacity:1;transform:none;transition-delay:.5s}
.menu-whats svg{width:22px;height:22px}

/* ---------- hero ---------- */
.hero{position:relative;display:grid;grid-template-columns:56% 44%;min-height:100vh;min-height:100svh;overflow:hidden;background:var(--noite)}
.hero-copy{grid-column:1;grid-row:1;position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;padding:calc(var(--topo) + 6vw) 5vw 3.2vw var(--lado)}
.hero h1{font-size:clamp(52px,5.5vw,92px);line-height:1.04;margin-top:26px;max-width:11.5em}
.hero-copy>p{margin-top:28px;font-size:clamp(17px,1.25vw,20px);color:var(--texto-suave);max-width:34em}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin:38px 0 72px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;padding:16px 24px;font:600 12.5px/1 var(--sans);text-transform:uppercase;letter-spacing:.09em;transition:background-color .45s var(--ease),color .45s var(--ease),border-color .45s var(--ease)}
.btn.solid{background:var(--ouro-botao);color:#102236}
.btn.solid:hover{background:var(--ouro-claro)}
.btn.ghost{border:1px solid rgba(255,255,255,.32);color:var(--texto)}
.btn.ghost:hover{border-color:var(--ouro)}
.hero-foot{border-top:1px solid rgba(255,255,255,.2);padding-top:22px;display:flex;gap:16px 34px;flex-wrap:wrap;font:600 11.5px/1.5 var(--sans);letter-spacing:.14em;color:#b9bdbd;max-width:820px}
.hero-portrait{grid-column:2;grid-row:1;position:relative;overflow:hidden;min-height:650px}
.hero-portrait img{position:absolute;inset:-6% 0 0;width:100%;height:106%;object-fit:cover;object-position:50% 12%;filter:grayscale(35%);will-change:transform}
.hero-portrait::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--noite) 0%,transparent 40%),linear-gradient(0deg,rgba(7,26,42,.47),transparent 45%);pointer-events:none}
.image-caption{position:absolute;bottom:6%;right:7%;z-index:2;font:600 11px/1 var(--sans);letter-spacing:.2em;color:var(--texto)}
.hero-monogram{position:absolute;right:35%;bottom:-.12em;z-index:1;font:400 clamp(180px,20vw,300px)/1 var(--serifa);color:var(--texto);opacity:.05;pointer-events:none;will-change:transform}

/* ---------- visão ---------- */
.vision{display:grid;grid-template-columns:25% 1fr;gap:5%;padding:clamp(90px,10vw,150px) var(--lado);background:var(--azul)}
.vision .section-label{padding-top:14px}
.vision h2{max-width:980px}
.vision p{margin-top:34px;max-width:650px;color:#c2caca}

/* ---------- atuação ---------- */
.services-section{background:var(--areia);color:var(--tinta);padding:clamp(90px,9vw,140px) 6vw}
.services-section .section-label{color:#9a7b45}
.services-section em{color:#a8864f}
.section-head{max-width:1000px}
.section-head h2{margin-top:22px}
.section-head p{margin-top:24px;max-width:640px;color:inherit;opacity:.85}
.services-grid{margin-top:64px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--linha-escura);border-left:1px solid var(--linha-escura)}
.service{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:56px;min-height:236px;padding:34px 36px 38px;border-right:1px solid var(--linha-escura);border-bottom:1px solid var(--linha-escura);overflow:hidden;isolation:isolate}
.service::before{content:"";position:absolute;inset:0;z-index:-1;background:#fff;transform:scaleY(0);transform-origin:bottom;transition:transform .7s var(--ease)}
.service:hover::before{transform:scaleY(1)}
.service .number{font:500 13px/1 var(--sans);color:#b59a6a;letter-spacing:.08em}
.service h3{font-size:clamp(25px,2.05vw,32px);line-height:1.15;color:var(--tinta)}
.service p{margin-top:12px;font-size:15px;line-height:1.6;color:#5a6670}
.service .arrow{position:absolute;top:34px;right:34px;width:16px;height:16px;color:var(--tinta);transition:transform .6s var(--ease),color .4s}
.service:hover .arrow{transform:translate(4px,-4px);color:#a8864f}

/* ---------- história ---------- */
.story-section{display:grid;grid-template-columns:44% 56%;background:var(--azul-2)}
.story-photo{position:relative;min-height:760px;overflow:hidden}
.story-photo img{position:absolute;left:0;top:-8%;width:100%;height:116%;object-fit:cover;object-position:50% 18%;will-change:transform}
.story-text{padding:clamp(80px,8vw,120px) var(--lado) clamp(80px,8vw,110px) 8%}
.story-text h2{margin:22px 0 36px;font-size:clamp(38px,4.6vw,72px)}
.story-text p{color:#c9caca;max-width:44em}
.story-text p+p{margin-top:20px}
.story-section blockquote{margin-top:48px;font:400 clamp(26px,2.4vw,36px)/1.35 var(--serifa);color:#d2b481;max-width:24em}
.story-section cite{display:flex;align-items:center;gap:14px;margin-top:20px;font:600 13px/1 var(--sans);letter-spacing:.06em;font-style:normal;color:#d2b481}
.story-section cite::before{content:"";width:28px;height:1px;background:currentColor}

/* ---------- método ---------- */
.method-section{background:var(--azul-3);padding:clamp(90px,9vw,140px) 6vw}
.method-section .section-head p{color:var(--texto)}
.steps-grid{margin-top:72px;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.step{position:relative;padding-top:34px}
.step::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:rgba(255,255,255,.18)}
.step::after{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--ouro);transform:scaleX(var(--linha,1));transform-origin:left}
.step b{display:block;font:700 13px/1 var(--sans);letter-spacing:.06em;color:var(--texto)}
.step h3{margin-top:40px;font-size:clamp(24px,1.8vw,30px);line-height:1.2}
.step p{margin-top:18px;font-size:15.5px;color:#d5d9da;max-width:22em}

/* ---------- contato ---------- */
.contact-section{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:6vw;align-items:start;padding:clamp(90px,9vw,140px) 6vw;background:var(--noite)}
.contact-intro h2{margin-top:22px}
.contact-intro p{margin-top:28px;max-width:34em;color:var(--texto)}
.whatsapp-number{display:inline-flex;align-items:center;min-height:44px;margin-top:22px;font:500 15px/1 var(--sans);letter-spacing:.06em;color:var(--texto);border-bottom:1px solid var(--ouro)}
.contact-form{border:1px solid #9e977f;padding:clamp(26px,3vw,40px);display:grid;gap:22px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.contact-form label{display:flex;flex-direction:column;gap:12px;font:700 14px/1.2 var(--sans);color:var(--texto)}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;font:500 16px/1.4 var(--sans);color:var(--texto);background:transparent;border:1px solid rgba(237,232,223,.55);border-radius:0;padding:14px 16px;min-height:54px;transition:border-color .35s,background-color .35s;-webkit-appearance:none;appearance:none}
.contact-form select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 6l4.5 4.5L12.5 6' fill='none' stroke='%23ede8df' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:44px}
.contact-form select option{color:#102236}
.contact-form textarea{min-height:150px;resize:vertical}
.contact-form ::placeholder{color:rgba(237,232,223,.55)}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{outline:none;border-color:var(--ouro);background:rgba(196,164,110,.06)}
.contact-form [aria-invalid="true"]{border-color:#e08a7a}
.form-erro{min-height:0;font:600 14px/1.4 var(--sans);color:#f0a596}
.form-erro:empty{display:none}
.form-bottom{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap}
.form-bottom p{flex:1 1 240px;font-size:13.5px;line-height:1.55;color:#c7c9c6;max-width:30em}
.form-bottom button{display:inline-flex;align-items:center;gap:12px;min-height:54px;padding:16px 24px;border:0;cursor:pointer;background:var(--ouro-botao);color:#0b1e2d;font:700 14px/1 var(--sans);letter-spacing:.04em;transition:background-color .45s var(--ease)}
.form-bottom button:hover{background:var(--ouro-claro)}
.txt-curto{display:none}

/* ---------- rodapé ---------- */
footer{background:var(--rodape);padding:72px 6vw calc(36px + env(safe-area-inset-bottom))}
.footer-brand{display:flex;align-items:center;gap:22px;font:400 46px/1 var(--serifa);color:var(--texto)}
.fb-mono span{opacity:.8;margin:0 -.04em}
.footer-brand small{font:600 12px/1 var(--sans);letter-spacing:.26em}
footer>p{margin-top:28px;color:#c3c7c8;font-size:15.5px}
.footer-small{margin-top:56px;padding-top:24px;border-top:1px solid var(--linha-clara);display:flex;justify-content:space-between;gap:12px 32px;flex-wrap:wrap;font-size:13px;color:#a9b0b3}
.footer-small a{display:inline-flex;align-items:center;min-height:44px;margin:-12px 0}
.footer-small a:hover{color:var(--ouro)}

/* botão de WhatsApp (só no celular) */
.whats-fixo{display:none}

/* ---------- estados iniciais das animações (só com JS) ---------- */
.js:not(.pronto) [data-fade]{opacity:0}
.js:not(.pronto) [data-linhas]{visibility:hidden}
.js:not(.pronto) .hero-portrait{clip-path:inset(0 0 100% 0)}
.js:not(.pronto) .site-header{opacity:0}

/* ---------- celular e tablet ---------- */
@media (max-width:1100px){
  .site-nav{gap:24px}
  .services-grid{grid-template-columns:repeat(2,1fr)}
  .steps-grid{grid-template-columns:repeat(2,1fr);row-gap:56px}
}
@media (max-width:900px){
  :root{--topo:68px;--lado:24px}
  body{font-size:16.5px}
  .site-nav{display:none}
  .menu-toggle{display:block}
  .brand-symbol{font-size:30px}
  .brand-name{font-size:18px}
  .brand-name small{font-size:11px;margin-top:5px}

  /* hero de revista: foto ocupa a tela, texto sobe por cima */
  .hero{display:block;min-height:100vh;min-height:100svh}
  .hero-portrait{position:absolute;inset:0;min-height:0}
  .hero-portrait img{inset:-4% 0 0;height:104%;object-position:62% 8%}
  .hero-portrait::after{background:linear-gradient(0deg,var(--noite) 22%,rgba(7,26,42,.86) 46%,rgba(7,26,42,.25) 72%,rgba(7,26,42,.1) 100%)}
  .image-caption{top:calc(var(--topo) + 18px + env(safe-area-inset-top));bottom:auto;right:var(--lado);font-size:11px}
  .hero-copy{min-height:100vh;min-height:100svh;justify-content:flex-end;padding:calc(var(--topo) + 40px) var(--lado) calc(30px + env(safe-area-inset-bottom))}
  .hero h1{font-size:clamp(40px,11.4vw,60px);margin-top:18px}
  .hero-copy>p{margin-top:18px;font-size:16.5px}
  .actions{flex-direction:column;align-items:stretch;margin:28px 0 32px}
  .btn{width:100%;min-height:54px;font-size:12.5px}
  .hero-foot{flex-direction:column;gap:6px;padding-top:18px;font-size:11.5px}
  .hero-monogram{display:none}

  h2{font-size:clamp(34px,9.6vw,46px)}
  .vision{display:block;padding:88px var(--lado)}
  .vision h2{margin-top:22px}
  .vision p{margin-top:26px}

  .services-section{padding:88px var(--lado)}
  .services-grid{margin-top:44px;grid-template-columns:1fr;border-left:0}
  .service{min-height:0;gap:22px;padding:28px 52px 30px 0;border-right:0}
  .service::before{display:none}
  .service .arrow{top:30px;right:4px}
  .service h3{font-size:26px}

  .story-section{display:block}
  .story-photo{height:min(118vw,560px);min-height:0}
  .story-text{padding:72px var(--lado) 84px}
  .story-text h2{font-size:clamp(34px,9.6vw,46px);margin:20px 0 28px}
  .story-section blockquote{font-size:25px;margin-top:40px}

  .method-section{padding:88px var(--lado)}
  .steps-grid{grid-template-columns:1fr;gap:0;margin-top:48px}
  .step{padding:26px 0 30px}
  .step h3{margin-top:18px;font-size:25px}
  .step p{margin-top:10px}

  .contact-section{display:block;padding:88px var(--lado) 96px}
  .contact-form{margin-top:44px;padding:26px 20px}
  .form-row{grid-template-columns:1fr}
  .form-bottom button{width:100%;justify-content:center}
  .txt-longo{display:none}.txt-curto{display:inline}

  footer{padding:60px var(--lado) calc(96px + env(safe-area-inset-bottom))}
  .footer-brand{flex-direction:column;align-items:flex-start;gap:14px;font-size:40px}
  .footer-small{flex-direction:column;margin-top:40px}

  .whats-fixo{display:grid;place-items:center;position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom));z-index:50;width:56px;height:56px;border-radius:50%;background:var(--ouro-botao);color:#0b1e2d;box-shadow:0 10px 30px rgba(0,0,0,.35);transform:scale(.6);opacity:0;pointer-events:none;transition:transform .6s var(--ease),opacity .4s}
  .whats-fixo svg{width:28px;height:28px}
  .whats-fixo.visivel{transform:none;opacity:1;pointer-events:auto}
  .menu-aberto .whats-fixo{opacity:0;pointer-events:none}
}
@media (max-width:380px){
  .hero h1{font-size:38px}
  .brand-name{font-size:17px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
  .js [data-fade]{opacity:1!important}
  .js [data-linhas]{visibility:visible!important}
  .js .hero-portrait{clip-path:none!important}
  .js .site-header{opacity:1!important}
}
