/* acfamilyofficer.it · sistema visual v2 (23/10/2026)
   Base: Prancha Início do Claude Design. Tipografia trocada (Bodoni saiu): Newsreader nos títulos,
   Cinzel só na inscrição e nos numerais romanos, Literata no texto, Jost na interface.
   Cores e papéis: linho = fundo; petróleo = ação e títulos; petróleo escuro = Mater/Pater e rodapé;
   tinta = texto; bronze = acento (numerais, monograma, foco), nunca texto pequeno; bronze-texto = sobrelinhas.
   Movimento: tudo dentro de prefers-reduced-motion: no-preference e de .js (sem JavaScript, nada fica escondido). */

@font-face{font-family:"Newsreader";font-style:normal;font-weight:300 400;font-display:swap;src:url(/assets/fonts/newsreader-latin.woff2) format("woff2")}
@font-face{font-family:"Newsreader";font-style:italic;font-weight:300;font-display:swap;src:url(/assets/fonts/newsreader-italic-latin.woff2) format("woff2")}
@font-face{font-family:"Cinzel";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/cinzel-insc.woff2) format("woff2")}
@font-face{font-family:"Jost";font-style:normal;font-weight:300 500;font-display:swap;src:url(/assets/fonts/jost-latin.woff2) format("woff2")}
@font-face{font-family:"Literata";font-style:normal;font-weight:400 500;font-display:swap;src:url(/assets/fonts/literata-latin.woff2) format("woff2")}
@font-face{font-family:"Literata";font-style:italic;font-weight:400;font-display:swap;src:url(/assets/fonts/literata-italic-latin.woff2) format("woff2")}

@property --sc{syntax:"<number>";inherits:false;initial-value:1}

:root{
  --linho:#EFEBE5; --linho-claro:#F7F4EF; --linha:#D8D0C4; --linha-clara:#E2DBD0;
  --petroleo:#335159; --petroleo-esc:#1F3338; --petroleo-med:#2B464D;
  --tinta:#22373C; --tinta-suave:#4E666C;
  --bronze:#B06C34; --bronze-texto:#8A5220; --bronze-claro:#D49A68;
  --salvia:#8DA5A9; --esc-txt:#B7C7C9; --esc-rot:#A9BCBF; --esc-fio:#3E5A61; --esc-div:#5F7E84;
  --f-tit:"Newsreader",Georgia,"Times New Roman",serif;
  --f-insc:"Cinzel","Newsreader",Georgia,serif;
  --f-ui:"Jost","Avenir Next","Segoe UI",sans-serif;
  --f-txt:"Literata",Georgia,serif;
  --wrap:min(1200px, calc(100% - 40px));
  --sec:clamp(88px, 10vw, 156px);
  --hdr:72px;
  --ease:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.65,0,.35,1);
  interpolate-size:allow-keywords;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr) + 16px);-webkit-text-size-adjust:100%;overflow-x:clip}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
body{margin:0;background:var(--linho);color:var(--tinta);font-family:var(--f-txt);font-size:18px;line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip;font-variant-numeric:oldstyle-nums proportional-nums}
body::after{content:"";position:fixed;inset:0;z-index:300;pointer-events:none;background:url(/assets/img/grao.png);opacity:.045;mix-blend-mode:multiply}
img{max-width:100%;height:auto;display:block}
a{color:var(--petroleo)}
a:hover{color:var(--petroleo-esc)}
:focus-visible{outline:2px solid var(--bronze);outline-offset:3px}
::selection{background:#D9C3A8}
h1,h2,h3,h4,p,ol,ul,figure,dl,dd{margin:0}
ol,ul{padding:0;list-style:none}
.wrap{width:var(--wrap);margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--petroleo);color:var(--linho);padding:10px 16px;font-family:var(--f-ui)}
.skip:focus{top:12px}

/* ---------- tipografia ---------- */
.kicker{font-family:var(--f-ui);font-weight:500;font-size:14px;line-height:1.5;letter-spacing:.16em;text-transform:uppercase;color:var(--bronze-texto)}
.it-lab{margin:0 0 16px;font-family:var(--f-tit);font-style:italic;font-weight:300;font-size:22px;line-height:1.3;color:var(--bronze-texto)}
.h1{position:relative;font-family:var(--f-tit);font-weight:300;font-size:clamp(44px, 5.5vw, 82px);line-height:1.02;letter-spacing:-.022em;color:var(--petroleo);text-wrap:balance;font-variant-numeric:lining-nums}
.h1 em{font-style:italic;color:var(--petroleo-esc);letter-spacing:-.012em}
.h2{font-family:var(--f-tit);font-weight:300;font-size:clamp(34px, 3.7vw, 56px);line-height:1.06;letter-spacing:-.018em;color:var(--petroleo);text-wrap:balance}
.h2 em{font-style:italic}
.h3{font-family:var(--f-ui);font-weight:500;font-size:22px;line-height:1.3;color:var(--petroleo)}
.h3-tit{font-family:var(--f-tit);font-weight:400;font-size:clamp(26px, 2.3vw, 33px);line-height:1.15;letter-spacing:-.01em;color:var(--petroleo)}
.lead{max-width:34em;font-size:clamp(18px, 1.4vw, 20px);line-height:1.65;text-wrap:pretty}
.txt{max-width:34em;font-size:19px;line-height:1.65;text-wrap:pretty}
.txt + .txt{margin-top:1.1em}
.muted{color:var(--tinta-suave)}
.roman{font-family:var(--f-tit);font-style:italic;font-weight:300;font-size:22px;line-height:1.3;color:var(--bronze-texto)}

/* marcador do que ainda depende do Alexandre ou do Compliance */
.tbd{font-family:var(--f-ui);font-size:.84em;letter-spacing:.02em;color:#6E4318;background:#F3E6D6;border:1px dashed var(--bronze);border-radius:2px;padding:1px 6px;font-style:normal}
.dark .tbd,.foot .tbd,.creds .tbd{color:#EBCFAF;background:var(--petroleo-med)}

/* ---------- botões e links ---------- */
.btn{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:56px;padding:0 30px;border:1px solid var(--petroleo);background:var(--petroleo);color:var(--linho);font-family:var(--f-ui);font-weight:500;font-size:17px;letter-spacing:.03em;text-decoration:none;border-radius:2px;cursor:pointer}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--petroleo-esc);transform:scaleX(0);transform-origin:100% 50%;transition:transform .55s var(--ease)}
.btn:hover{color:var(--linho)}
.btn:hover::before{transform:scaleX(1);transform-origin:0 50%}
.btn .arr{flex:none;transition:transform .5s var(--ease)}
.btn:hover .arr{transform:translateX(5px)}
.btn-line{background:transparent;color:var(--petroleo)}
.btn-line::before{background:var(--petroleo)}
.btn-line:hover{color:var(--linho)}
.btn-sm{min-height:46px;padding:0 22px;font-size:16px}
.btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:40px}
.more{font-family:var(--f-ui);font-weight:500;font-size:17px;color:var(--petroleo);text-decoration:none;padding:8px 0 6px;white-space:nowrap;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;transition:background-size .6s var(--ease)}
.more:hover{background-size:0 1px;background-position:100% 100%}
.more .ar{display:inline-block;transition:transform .5s var(--ease)}
.more:hover .ar{transform:translateX(5px)}

/* ---------- cabeçalho ----------
   Fixo. Faixa fina de credenciais (petróleo escuro) + barra principal (linho).
   Ao rolar: a faixa recolhe, a barra encolhe e vira vidro fosco; descendo some, subindo volta. */
:root{--tb:38px;--hb:92px;--hb-c:70px;--hdr-top:calc(var(--tb) + var(--hb))}
body{padding-top:var(--hdr-top)}
html{scroll-padding-top:calc(var(--hb-c) + 20px)}
.hdr{position:fixed;top:0;left:0;right:0;z-index:30;view-transition-name:hdr;transition:transform .6s var(--ease)}
.hdr.is-hidden{transform:translateY(-100%)}
.hdr:focus-within,body:has(.mmenu[open]) .hdr{transform:none}
.veil{position:absolute;top:100%;left:0;right:0;height:100vh;background:rgba(31,51,56,.3);opacity:0;pointer-events:none;transition:opacity .45s var(--ease)}
.hdr:has(.svc[open]) .veil{opacity:1}

.topbar{height:var(--tb);overflow:hidden;background:var(--petroleo-esc);transition:height .55s var(--ease)}
.hdr.is-scrolled .topbar{height:0}
.tb-in{width:var(--wrap);margin:0 auto;height:var(--tb);display:flex;align-items:center;justify-content:space-between;gap:24px;font-family:var(--f-ui);font-weight:500;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--esc-rot)}
.tb-in p{margin:0;display:flex;align-items:center;white-space:nowrap}
.tb-in i{flex:none;width:3px;height:3px;border-radius:50%;background:var(--bronze);margin:0 12px}
.tb-cred a{color:var(--linho);text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .5s var(--ease)}
.tb-cred a:hover{color:var(--linho);background-size:100% 1px}
.tb-end{display:flex;align-items:center;gap:28px}
.lang{display:flex;align-items:center;gap:6px;font-family:var(--f-ui);font-weight:500;letter-spacing:.16em}
.lang a,.lang span{color:var(--esc-rot);text-decoration:none;padding:4px 1px;border-bottom:1px solid transparent}
.lang [aria-current="true"]{color:var(--linho);border-bottom-color:var(--bronze)}
.lang .sep{color:var(--esc-fio);padding:0;border:0}
.lang .off{cursor:help}

.bar{position:relative;background:var(--linho);border-bottom:1px solid transparent;transition:background-color .5s var(--ease),border-color .5s var(--ease),box-shadow .5s var(--ease)}
.hdr.is-scrolled .bar{background:rgba(239,235,229,.94);-webkit-backdrop-filter:saturate(1.4) blur(18px);backdrop-filter:saturate(1.4) blur(18px);border-bottom-color:var(--linha);box-shadow:0 26px 44px -38px rgba(31,51,56,.55)}
body:has(.mmenu[open]) .bar{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom-color:transparent;box-shadow:none}
@supports (animation-timeline: scroll()){
  .bar::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--bronze);transform-origin:0 50%;transform:scaleX(0);animation:progresso linear both;animation-timeline:scroll(root)}
}
@keyframes progresso{to{transform:scaleX(1)}}
.hdr-in{position:relative;width:var(--wrap);margin:0 auto;height:var(--hb);display:flex;align-items:center;gap:28px;transition:height .55s var(--ease)}
.hdr.is-scrolled .hdr-in{height:var(--hb-c)}

/* logo: monograma em bronze + ALEX CUPPARI em petróleo (vetores do PDF da marca) */
.brand{position:relative;z-index:61;display:flex;align-items:center;gap:15px;flex:none;color:var(--petroleo);text-decoration:none;transition:color .4s}
.brand:hover{color:var(--petroleo-esc)}
.brand-mono{display:block;height:46px;width:auto;color:var(--bronze);overflow:visible;transition:height .55s var(--ease),color .4s}
.brand-mono path{fill:currentColor;stroke:currentColor;stroke-width:0;stroke-dasharray:1 1;stroke-dashoffset:0}
.brand:hover .brand-mono path{animation:redesenha 1.5s var(--ease-io)}
@keyframes redesenha{0%{fill-opacity:1;stroke-width:0;stroke-dashoffset:0}15%{fill-opacity:0;stroke-width:1.2;stroke-dashoffset:1}75%{fill-opacity:0;stroke-width:1.2;stroke-dashoffset:0}100%{fill-opacity:1;stroke-width:0;stroke-dashoffset:0}}
.wordmark{display:block;height:15px;width:auto;transition:height .55s var(--ease)}
.hdr.is-scrolled .brand-mono{height:38px}
.hdr.is-scrolled .wordmark{height:13px}

/* menu principal com linha de bronze que desliza */
.nav{display:flex;align-items:center;gap:34px;margin-left:auto;font-family:var(--f-ui);font-size:15.5px;letter-spacing:.02em}
.nav > a,.svc > summary{position:relative;color:var(--tinta);text-decoration:none;padding:12px 0;transition:color .35s}
.nav > a:hover,.svc > summary:hover,.nav a[aria-current="page"],.svc.on > summary,.svc[open] > summary{color:var(--petroleo)}
html:not(.js) .nav a[aria-current="page"],html:not(.js) .svc.on > summary{box-shadow:inset 0 -1px var(--bronze)}
.nav-line{position:absolute;top:calc(50% + 16px);left:0;width:0;height:1px;background:var(--bronze);opacity:0;pointer-events:none;transition:left .55s var(--ease),width .55s var(--ease),opacity .35s,top .55s var(--ease)}
.hdr.is-scrolled .nav-line{top:calc(50% + 14px)}
.svc{position:static}
.svc > summary{display:flex;align-items:center;gap:8px;list-style:none;cursor:pointer}
.svc > summary::-webkit-details-marker{display:none}
.svc > summary svg{transition:transform .45s var(--ease)}
.svc[open] > summary svg{transform:rotate(180deg)}
.hdr-end{display:flex;align-items:center;gap:22px;margin-left:12px}
.hdr-cta{min-height:48px}

/* painel de serviços */
.mega{position:absolute;top:100%;left:calc(50% - 50vw);width:100vw;background:var(--linho-claro);border-top:1px solid var(--linha);box-shadow:0 60px 90px -60px rgba(31,51,56,.5)}
.svc[open] .mega{animation:mega-abre .65s var(--ease) both}
@keyframes mega-abre{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 -120px 0)}}
.mega-in{width:var(--wrap);margin:0 auto;padding:36px 0 44px;display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:56px}
.mega-k{margin:0 0 12px;font-family:var(--f-tit);font-style:italic;font-weight:300;font-size:21px;color:var(--bronze-texto)}
.mega-list ul{display:grid;grid-template-columns:1fr 1fr;column-gap:40px}
.svc[open] .mega-list li{animation:sobe .75s var(--ease) both;animation-delay:calc(.1s + var(--k) * 45ms)}
.mega-it{display:grid;grid-template-columns:46px minmax(0,1fr);height:100%;padding:18px 16px 18px 0;border-top:1px solid var(--linha);color:var(--tinta);text-decoration:none;transition:background-color .35s}
.mi-n{grid-row:1 / span 3;font-family:var(--f-insc);font-size:19px;line-height:1.5;color:var(--bronze)}
.mi-t{font-family:var(--f-tit);font-weight:400;font-size:22px;line-height:1.2;letter-spacing:-.005em;color:var(--petroleo);transition:transform .55s var(--ease)}
.mi-d{margin-top:6px;font-size:15px;line-height:1.5;color:var(--tinta-suave)}
.mi-go{margin-top:10px;font-family:var(--f-ui);font-weight:500;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--petroleo)}
a.mega-it .mi-go::after{content:"\2192";display:inline-block;margin-left:8px;transition:transform .5s var(--ease)}
.mega-it.off .mi-go{font-weight:400;color:var(--tinta-suave)}
a.mega-it:hover{background:var(--linho);color:var(--tinta)}
a.mega-it:hover .mi-t{transform:translateX(6px)}
a.mega-it:hover .mi-go::after{transform:translateX(4px)}
.mega-feat{display:grid;grid-template-columns:118px minmax(0,1fr);gap:24px;align-items:end;padding:28px;background:var(--petroleo-esc) url(/assets/img/textura-mater-pater.webp) 0 0/720px auto;color:var(--linho)}
.mf-img{aspect-ratio:4 / 5;overflow:hidden;border-radius:60px 60px 0 0;background:#E2CDB5}
.mf-img img{width:100%;height:100%;object-fit:cover}
.mf-k{margin:0;font-family:var(--f-ui);font-weight:500;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--bronze-claro)}
.mf-t{margin:10px 0 0;font-family:var(--f-tit);font-weight:300;font-size:27px;line-height:1.1;letter-spacing:-.01em;color:var(--linho)}
.mf-d{margin:10px 0 16px;font-size:15px;line-height:1.5;color:var(--esc-txt)}
.mega-feat .more{font-size:15px;color:var(--linho)}

/* menu do celular: tela cheia, escura, funciona sem JavaScript */
.mmenu{display:none}
.mmenu > summary{position:relative;z-index:61;display:flex;align-items:center;gap:12px;min-height:44px;padding:0 2px 0 10px;font-family:var(--f-ui);font-weight:500;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--petroleo);cursor:pointer;list-style:none;transition:color .4s}
.mmenu > summary::-webkit-details-marker{display:none}
.mmenu .x{display:none}
.mmenu[open] .x{display:inline}
.mmenu[open] .o{display:none}
.burger{position:relative;width:24px;height:12px}
.burger i{position:absolute;left:0;right:0;height:1.5px;background:currentColor;transition:transform .55s var(--ease),top .55s var(--ease)}
.burger i:first-child{top:0}
.burger i:last-child{top:10px}
.mmenu[open] .burger i:first-child{top:5px;transform:rotate(45deg)}
.mmenu[open] .burger i:last-child{top:5px;transform:rotate(-45deg)}
.mpanel{position:fixed;inset:0;z-index:60;overflow:auto;display:flex;flex-direction:column;padding:calc(var(--hb) + 12px) 0 calc(28px + env(safe-area-inset-bottom));background:var(--petroleo-esc) url(/assets/img/textura-mater-pater.webp) 0 0/720px auto}
.mmenu[open] .mpanel{animation:cortina .75s var(--ease) both}
@keyframes cortina{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
body:has(.mmenu[open]) .brand,body:has(.mmenu[open]) .mmenu > summary{color:var(--linho)}
body:has(.mmenu[open]) .brand-mono{color:var(--bronze-claro)}
.mpanel nav{width:calc(100% - 40px);margin:0 auto;display:flex;flex-direction:column}
.mpanel nav > a,.mgrp > summary{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid var(--esc-fio);font-family:var(--f-tit);font-weight:300;font-size:34px;line-height:1.15;letter-spacing:-.01em;color:var(--linho);text-decoration:none;list-style:none;cursor:pointer}
.mpanel nav > a[aria-current="page"]{font-style:italic;color:var(--bronze-claro)}
.mgrp > summary::-webkit-details-marker{display:none}
.mgrp > summary::after{content:"+";font-family:var(--f-ui);font-weight:300;font-size:30px;color:var(--bronze-claro);transition:transform .45s var(--ease)}
.mgrp[open] > summary::after{transform:rotate(45deg)}
.mgrp-in{display:flex;flex-direction:column;padding:8px 0 16px;border-bottom:1px solid var(--esc-fio)}
.mgrp-in a,.mgrp-in span{padding:9px 0 9px 4px;font-size:18px;line-height:1.4;color:var(--linho);text-decoration:none}
.mgrp-in span{color:var(--esc-rot)}
.mgrp-in em{font-style:normal;font-family:var(--f-ui);font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin-left:6px;color:var(--esc-rot)}
.mmenu[open] .mpanel nav > *,.mmenu[open] .mfoot > *{animation:sobe .8s var(--ease) both}
.mmenu[open] .mpanel nav > :nth-child(2){animation-delay:.05s}
.mmenu[open] .mpanel nav > :nth-child(3){animation-delay:.1s}
.mmenu[open] .mpanel nav > :nth-child(4){animation-delay:.15s}
.mmenu[open] .mpanel nav > :nth-child(5){animation-delay:.2s}
.mmenu[open] .mpanel nav > :nth-child(6){animation-delay:.25s}
.mmenu[open] .mfoot > *{animation-delay:.3s}
@keyframes fade{from{opacity:0}}
@keyframes sobe{from{opacity:0;transform:translateY(18px)}}
.mfoot{width:calc(100% - 40px);margin:auto auto 0;padding-top:40px;display:flex;flex-direction:column;gap:14px}
.mfoot .btn{width:100%}
.btn-light{background:var(--linho);border-color:var(--linho);color:var(--petroleo-esc)}
.btn-light::before{background:var(--bronze-claro)}
.btn-light:hover{color:var(--petroleo-esc)}
.mcred{margin:0;font-family:var(--f-ui);font-weight:500;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--esc-rot)}
.mfoot .lang{font-size:13px;margin-top:6px}
.mcta{display:none}

@media (max-width:1180px){.tb-in .tb-place{display:none}.nav{gap:26px}}
@media (max-width:1079px){
  :root{--tb:0px;--hb:66px;--hb-c:60px}
  .topbar{display:none}
  .nav,.nav-line,.hdr-cta{display:none}
  .mmenu{display:block}
  .hdr-end{margin-left:auto}
  .brand{gap:12px}
  .brand-mono{height:36px}
  .wordmark{height:12px}
  .hdr.is-scrolled .brand-mono{height:32px}
  .hdr.is-scrolled .wordmark{height:11px}
  body:has(.mmenu[open]){overflow:hidden}
  body:has(.mmenu[open]) .mcta{display:none}
  .mcta{display:block;position:fixed;left:0;right:0;bottom:0;z-index:40;background:rgba(239,235,229,.9);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--linha);padding:12px 16px calc(12px + env(safe-area-inset-bottom));transition:transform .5s var(--ease)}
  .mcta.is-hidden{transform:translateY(110%)}
  .mcta .btn{display:flex;width:100%;min-height:52px}
  body.has-mcta{padding-bottom:calc(77px + env(safe-area-inset-bottom))}
}
@media (max-width:380px){.wordmark{height:10.5px}.brand-mono{height:32px}}

/* ---------- abertura ---------- */
.hero{width:var(--wrap);margin:0 auto;padding:clamp(44px, 6vw, 92px) 0 clamp(64px, 7vw, 108px);display:flex;flex-wrap:wrap;align-items:flex-end;gap:clamp(48px, 6vw, 104px)}
.hero-txt{flex:1 1 560px;min-width:0;max-width:720px}
.hero .h1{margin:26px 0 34px}
.swash{position:absolute;left:0;top:0;width:0;height:.2em;pointer-events:none;color:var(--bronze);overflow:visible}
.swash path{fill:currentColor}
.arch{flex:0 1 430px;min-width:0;position:relative;padding:22px 22px 0 0}
.arch::before{content:"";position:absolute;top:0;right:0;left:22px;bottom:54px;border:1px solid var(--bronze);border-bottom:0;border-radius:1000px 1000px 0 0;pointer-events:none}
.arch-img{position:relative;aspect-ratio:10 / 13.5;overflow:hidden;background:#E2CDB5;border-radius:1000px 1000px 0 0}
.arch-img img{width:100%;height:112%;margin-top:-6%;object-fit:cover;transform:translate3d(0,var(--py,0px),0) scale(var(--sc));will-change:transform}
.arch figcaption,.cap{position:relative;display:flex;justify-content:space-between;gap:12px;margin-top:16px;padding-top:14px;font-family:var(--f-ui);font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--tinta-suave);font-variant-numeric:lining-nums}
.arch figcaption::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--petroleo);transform-origin:0 50%}
@media (max-width:640px){.hero{gap:44px}.arch{flex-basis:100%;max-width:440px}}
/* primeira dobra: rosácea de guilhoché (as linhas finas das notas antigas de lira e dos títulos de ações)
   como auréola atrás do arco, e um selo com MATRIMONIVM ANTE PATRIMONIVM em volta do monograma.
   Os dois são criados pelo site.js; sem JavaScript, o retrato fica como sempre. */
.hero .arch{isolation:isolate}
.rosa{position:absolute;z-index:-1;left:calc((100% - 22px) / 2);top:22px;margin-top:calc((100% - 22px) / 2);width:calc((100% - 22px) * 1.52);aspect-ratio:1;translate:-50% -50%;pointer-events:none;transform:translate3d(calc(var(--mx, 0) * 14px), calc(var(--my, 0) * 10px), 0) rotate(calc(var(--rs, 0) * 1deg));transition:transform 1.1s var(--ease)}
.rosa svg{display:block;width:100%;height:100%;overflow:visible}
.rosa path{fill:none;stroke:var(--bronze);stroke-width:.75;opacity:.34}
.rosa path.fio{opacity:.5}
.selo{position:absolute;z-index:2;left:-44px;top:66%;width:122px;aspect-ratio:1;pointer-events:none;filter:drop-shadow(0 14px 22px rgba(31,51,56,.14));translate:calc(var(--mx, 0) * -9px) calc(var(--my, 0) * -7px);transition:translate 1.1s var(--ease)}
.selo svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.s-disco{fill:var(--linho-claro);stroke:var(--bronze);stroke-width:1}
.s-fio{fill:none;stroke:var(--bronze);stroke-width:.6;opacity:.75}
.s-fundo path{fill:var(--bronze)}
.s-texto text{font-family:var(--f-insc);font-size:10.4px;fill:var(--petroleo)}
@media (max-width:1099px){.rosa{width:calc((100% - 22px) * 1.34)}.selo{left:-10px}}  /* retrato abaixo do texto: auréola menor (não encosta nos botões) e selo dentro da tela */
@media (max-width:640px){.selo{width:104px}}

/* faixa de credenciais */
.creds{background:var(--petroleo);color:var(--linho)}
.creds ul{width:var(--wrap);margin:0 auto;padding:34px 0 38px;display:grid;grid-template-columns:1.2fr 1fr 1.15fr 1fr}
.creds li{padding:2px 28px;border-left:1px solid var(--esc-div)}
.creds li:first-child{padding-left:0;border-left:0}
@media (min-width:821px) and (max-width:1099px){
  .creds ul{grid-template-columns:1fr 1fr;row-gap:30px}
  .creds li:nth-child(3){padding-left:0;border-left:0}
}
.c-lab{display:block;font-family:var(--f-ui);font-weight:500;font-size:13px;line-height:1.4;letter-spacing:.16em;text-transform:uppercase;color:var(--esc-rot)}
.c-val{display:block;margin-top:10px;font-family:var(--f-tit);font-weight:300;font-size:clamp(34px, 3.2vw, 48px);line-height:1;letter-spacing:-.015em;color:var(--linho);font-variant-numeric:lining-nums}
.c-sub{display:block;margin-top:12px;font-size:15px;line-height:1.45;color:var(--esc-txt)}
@media (max-width:820px){
  .creds ul{grid-template-columns:1fr;padding:12px 0 16px}
  .creds li{padding:22px 0;border-left:0;border-top:1px solid var(--esc-div)}
  .creds li:first-child{border-top:0}
}

/* ---------- seções ---------- */
.sec{width:var(--wrap);margin:0 auto;padding:var(--sec) 0}
.band{background:var(--linho-claro);border-top:1px solid var(--linha-clara);border-bottom:1px solid var(--linha-clara)}
.band + .band{border-top:0}
.split{display:flex;flex-wrap:wrap;gap:clamp(28px, 5vw, 80px)}
.split > :first-child{flex:1 1 300px;min-width:0}
.split > :last-child{flex:2 1 560px;min-width:0;max-width:720px}
.split.end{align-items:flex-end}
.head{margin-bottom:clamp(40px, 4.4vw, 60px)}

/* fios no topo dos itens: são fundos, não bordas, para poderem "se desenhar" */
.rlist li,.faq details,.tl li,.rows > li{background:linear-gradient(var(--linha),var(--linha)) 0 0/100% 1px no-repeat}
.cols > li,.steps li,.post,.rows > li:first-child{background:linear-gradient(var(--petroleo),var(--petroleo)) 0 0/100% 1px no-repeat}

/* lista com numeral romano */
.rlist{border-bottom:1px solid var(--linha)}
.rlist li{display:grid;grid-template-columns:56px minmax(0,1fr);align-items:baseline;padding:26px 0;font-size:19px;line-height:1.6}
.rlist li > span:last-child{text-wrap:pretty}
.rlist b,.rlist strong{font-weight:500;color:var(--petroleo)}
.plist li{grid-template-columns:minmax(0,1fr)}

/* frase de destaque centralizada */
.quote{width:min(1040px, calc(100% - 40px));margin:0 auto;padding:clamp(80px, 9vw, 136px) 0;text-align:center}
.quote .mono-draw{width:64px;height:auto;margin:0 auto;color:var(--bronze)}
.quote p{margin:36px auto 0;max-width:21em;font-family:var(--f-tit);font-style:italic;font-weight:300;font-size:clamp(30px, 3.6vw, 54px);line-height:1.18;letter-spacing:-.012em;color:var(--petroleo);text-wrap:balance}

/* colunas com numeral grande */
.cols{margin-top:clamp(56px, 6vw, 88px);display:flex;flex-wrap:wrap;gap:48px clamp(28px, 3vw, 56px)}
.cols > li{flex:1 1 300px;min-width:0;padding-top:24px}
.cols .num{display:block;font-family:var(--f-insc);font-size:clamp(64px, 6.4vw, 96px);line-height:1;letter-spacing:.04em;color:var(--bronze)}
.cols h3{margin:26px 0 12px}
.cols p{font-size:18px;line-height:1.65;text-wrap:pretty}
.cols.five > li{flex-basis:200px}
.cols.five .num{font-size:clamp(48px, 4.6vw, 72px)}

/* passos */
.steps{display:flex;flex-wrap:wrap;gap:40px clamp(28px, 3vw, 56px)}
.steps li{flex:1 1 280px;min-width:0;padding-top:24px;display:grid;grid-template-columns:64px minmax(0,1fr)}
.steps .num{font-family:var(--f-insc);font-size:36px;line-height:1.05;letter-spacing:.04em;color:var(--bronze)}
.steps p{font-size:19px;line-height:1.6;text-wrap:pretty}
.steps b{font-weight:500;color:var(--petroleo)}

/* serviços em linhas */
.rows{border-bottom:1px solid var(--linha)}
.rows > li{position:relative;isolation:isolate;display:flex;flex-wrap:wrap;gap:12px clamp(24px, 4vw, 64px);align-items:baseline;padding:38px 0}
.rows h3{flex:1 1 320px;margin:0;transition:transform .7s var(--ease)}
.rows p{flex:1.5 1 420px;font-size:18px;line-height:1.65;max-width:34em}
.rows .act{flex:0 0 150px}
.rows .soon-tag{font-family:var(--f-ui);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--tinta-suave)}
.rows > li.go::before{content:"";position:absolute;inset:1px -16px 0;z-index:-1;background:var(--linho-claro);transform:scaleX(0);transform-origin:0 50%;transition:transform .8s var(--ease)}
.rows > li.go:hover::before{transform:scaleX(1)}
.rows > li.go:hover h3{transform:translateX(14px)}
.rows > li.go .more::after{content:"";position:absolute;inset:0}

/* Mater / Pater */
.dark{position:relative;overflow:hidden;background:var(--petroleo-esc);color:var(--linho)}
.dark.tex > *{position:relative}
.dark.tex::before{content:"";position:absolute;left:0;right:0;top:-18%;bottom:-18%;background:url(/assets/img/textura-mater-pater.webp) 0 0/960px auto repeat;transform:translate3d(0,var(--py,0px),0);will-change:transform;pointer-events:none}
.mantra{position:relative;width:var(--wrap);margin:0 auto;padding:clamp(104px, 12vw, 196px) 0;text-align:center}
.mantra .over{margin:0 0 clamp(44px, 5vw, 76px);font-family:var(--f-ui);font-weight:500;font-size:14px;letter-spacing:.3em;text-transform:uppercase;color:var(--esc-rot)}
.insc{display:inline-block;text-align:left;font-family:var(--f-insc);font-weight:400;font-size:clamp(31px, 8vw, 124px);line-height:1;letter-spacing:.06em;color:var(--linho)}
.insc > .l1,.insc > .l2{white-space:nowrap;transition:opacity .6s var(--ease)}
.insc .ini{display:inline-block;width:.92em;text-align:right;transition:text-shadow .6s var(--ease)}
.insc .lt{display:inline-block}
.insc .m{color:var(--bronze-claro)}
.insc .p{color:var(--esc-rot)}
.insc .ante{display:flex;align-items:center;gap:.3em;margin:.24em 0 .22em .92em;font-size:.26em;letter-spacing:.5em;color:var(--esc-txt)}
.insc .ante i{flex:1;height:1px;background:#4A666D}
.insc .ante i:first-child{transform-origin:100% 50%}
.insc .ante i:last-child{transform-origin:0 50%}
.insc .ante span{font-family:var(--f-ui);font-weight:400;font-style:normal}
.mantra h2{margin:clamp(52px, 6vw, 84px) auto 0;max-width:19em;font-family:var(--f-tit);font-weight:300;font-style:italic;font-size:clamp(28px, 3.2vw, 46px);line-height:1.15;letter-spacing:-.01em;color:var(--linho);text-wrap:balance}
.mantra .soft{margin:clamp(56px, 6vw, 88px) auto 0;font-size:19px;line-height:1.6;color:var(--esc-txt)}
.mp{margin:32px auto 0;max-width:900px;display:flex;flex-wrap:wrap;text-align:left;border-top:1px solid var(--esc-fio);border-bottom:1px solid var(--esc-fio)}
.mp > div{flex:1 1 320px;min-width:0;padding:32px clamp(0px, 3vw, 40px) 32px 0;transition:background-color .6s var(--ease)}
.mp > div + div{padding:32px 0 32px clamp(0px, 3vw, 40px);border-left:1px solid var(--esc-fio)}
@media (min-width:720px){.mp > div:hover{background:rgba(239,235,229,.03)}}
@media (max-width:719px){.mp > div + div{border-left:0;border-top:1px solid var(--esc-fio);padding-left:0}}
.mp .w{margin:0 0 12px;font-family:var(--f-tit);font-style:italic;font-weight:300;font-size:34px;line-height:1}
.mp .w.m{color:var(--bronze-claro)}
.mp .w.p{color:var(--esc-rot)}
.mp p:last-child{font-size:clamp(19px, 1.5vw, 21px);line-height:1.55;color:var(--linho);text-wrap:pretty}
.mantra .body{margin:40px auto 0;max-width:34em;font-size:clamp(19px, 1.5vw, 21px);line-height:1.65;color:var(--linho);text-wrap:pretty}
.dark a{color:var(--linho)}
.dark a:hover{color:#fff}
.mantra .more{display:inline-block;margin-top:40px}
/* passar o mouse em mater acende o M; em pater, o P */
.mantra:has(.m-col:hover) .insc .l2,.mantra:has(.p-col:hover) .insc .l1{opacity:.22}
.mantra:has(.m-col:hover) .insc .m{text-shadow:0 0 34px rgba(212,154,104,.6)}
.mantra:has(.p-col:hover) .insc .p{text-shadow:0 0 34px rgba(169,188,191,.55)}

/* blog */
.posts{display:flex;flex-wrap:wrap;gap:40px clamp(28px, 3vw, 56px)}
.post{flex:1 1 300px;min-width:0;display:flex;flex-direction:column;padding-top:26px}
.post .tag{font-family:var(--f-ui);font-weight:500;font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--bronze-texto)}
.post h3{margin:16px 0 28px;font-family:var(--f-tit);font-weight:300;font-size:clamp(26px, 2.2vw, 32px);line-height:1.18;letter-spacing:-.01em;color:var(--petroleo);text-wrap:pretty}
.post .soon{margin-top:auto;font-family:var(--f-ui);color:var(--tinta-suave)}
.post a{color:inherit;text-decoration:none}
.post a.more{margin-top:auto}

/* perguntas frequentes */
.faq{border-bottom:1px solid var(--linha)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:26px 0;font-family:var(--f-ui);font-weight:500;font-size:clamp(19px, 1.5vw, 21px);line-height:1.35;color:var(--petroleo);list-style:none;cursor:pointer;transition:color .3s}
.faq summary:hover{color:var(--petroleo-esc)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font-weight:300;font-size:30px;line-height:1;color:var(--bronze);transition:transform .45s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0 0 30px;max-width:34em;font-size:18px;line-height:1.65}
@supports selector(::details-content){
  .faq details::details-content{block-size:0;overflow:hidden;transition:block-size .6s var(--ease),content-visibility .6s allow-discrete}
  .faq details[open]::details-content{block-size:auto}
}

/* fecho com mapa */
.close{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(56px, 7vw, 120px)}
.close > div{flex:1 1 520px;min-width:0}
.close .h2{max-width:15em;font-size:clamp(36px, 4.2vw, 62px);line-height:1.04}
.close .lead{margin-top:28px;max-width:32em}
.map{flex:0 1 360px;min-width:0;margin:0 auto}
.map-svg{display:block;width:100%;height:auto;overflow:visible}
.map-land{fill:none;stroke:var(--petroleo);stroke-width:1.25;stroke-linejoin:round}
.map-route{fill:none;stroke:var(--bronze);stroke-width:1.4;stroke-dasharray:3 5;stroke-linecap:round}
.route-mask{fill:none;stroke:#fff;stroke-width:9}
.map-city .pin{fill:var(--bronze)}
.map-city .ring{fill:none;stroke:var(--bronze);stroke-width:1.2;opacity:0;transform-box:fill-box;transform-origin:center}
.map-city text{font-family:var(--f-ui);font-weight:500;font-size:15px;letter-spacing:.14em;fill:var(--petroleo);paint-order:stroke;stroke:var(--linho-claro);stroke-width:6px;stroke-linejoin:round}
.map figcaption{margin-top:20px;padding-top:14px;border-top:1px solid var(--petroleo);font-size:16px;line-height:1.5;color:var(--tinta-suave)}
.close.simple{justify-content:space-between}
.close.simple > div{flex:1 1 640px}

/* monograma que se desenha */
.mono-draw{display:block;overflow:visible}
.mono-draw path{fill:currentColor;stroke:currentColor;stroke-width:0;stroke-linejoin:round}
.mono-draw.outline path{fill:none;stroke-width:.9}

/* ---------- páginas internas ---------- */
.crumbs{display:flex;flex-wrap:wrap;gap:8px;padding:22px 0 0;font-family:var(--f-ui);font-size:14px;letter-spacing:.04em;color:var(--tinta-suave)}
.crumbs li + li::before{content:"/";margin-right:8px;color:var(--salvia)}
.crumbs a{color:var(--tinta-suave)}
.phero{width:var(--wrap);margin:0 auto;padding:clamp(40px, 5vw, 72px) 0 clamp(64px, 7vw, 104px);display:flex;flex-wrap:wrap;align-items:flex-end;gap:clamp(48px, 6vw, 104px)}
.phero > div:first-child{flex:1 1 560px;min-width:0;max-width:780px}
.phero .h1{margin:26px 0 32px;font-size:clamp(42px, 4.9vw, 72px)}
.phero-mark{flex:0 1 260px;min-width:0;margin-left:auto;color:var(--bronze)}
.phero-mark .mono-draw{width:min(100%, 220px);height:auto;margin-left:auto}
@media (max-width:900px){.phero-mark{display:none}}

/* painel de registros (consultor) */
.regs{flex:0 1 430px;min-width:0;background:var(--linho-claro);border:1px solid var(--linha);border-top:3px solid var(--petroleo);padding:28px 30px 30px;box-shadow:0 40px 70px -60px rgba(31,51,56,.55)}
.regs .t{font-family:var(--f-ui);font-weight:500;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--petroleo)}
.regs dl{margin:18px 0 0}
.regs dl > div{padding:16px 0;border-top:1px solid var(--linha)}
.regs dt{font-family:var(--f-ui);font-weight:500;font-size:17px;color:var(--petroleo)}
.regs dd{margin:4px 0 0;font-size:16px;line-height:1.5;color:var(--tinta-suave)}
.regs dd a{color:var(--petroleo)}
.regs .note{margin-top:14px;padding-top:14px;border-top:1px solid var(--linha);font-size:15px;line-height:1.5;color:var(--tinta-suave)}

/* sim / não */
.yesno{display:flex;flex-wrap:wrap}
.yesno > div{flex:1 1 360px;min-width:0;padding:32px 40px 32px 0}
.yesno > div + div{padding:32px 0 32px 40px;border-left:1px solid var(--linha)}
@media (max-width:799px){.yesno > div + div{border-left:0;border-top:1px solid var(--linha);padding-left:0}}
.yesno .w{font-family:var(--f-tit);font-style:italic;font-weight:300;font-size:34px;line-height:1;margin-bottom:14px}
.yesno .w.no{color:var(--tinta-suave)}
.yesno .w.yes{color:var(--bronze-texto)}

/* faixa reta (rotina, registros) */
.strip{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--linha);background:linear-gradient(var(--petroleo),var(--petroleo)) 0 0/100% 1px no-repeat}
.strip > li{flex:1 1 240px;min-width:0;padding:30px 28px 32px 0}
.strip > li + li{padding-left:28px;border-left:1px solid var(--linha)}
.strip .when{display:block;font-family:var(--f-tit);font-style:italic;font-weight:300;font-size:28px;line-height:1.1;color:var(--bronze-texto);margin-bottom:12px}
.strip p{font-size:17px;line-height:1.6}
@media (max-width:620px){.strip > li{flex-basis:100%;padding:24px 0}.strip > li + li{padding-left:0;border-left:0;border-top:1px solid var(--linha)}}

/* sobre: duas famílias */
.fams{display:flex;flex-wrap:wrap;margin-top:clamp(40px, 5vw, 64px);border-bottom:1px solid var(--linha);background:linear-gradient(var(--petroleo),var(--petroleo)) 0 0/100% 1px no-repeat}
.fams > div{flex:1 1 420px;min-width:0;padding:38px 48px 42px 0}
.fams > div + div{padding:38px 0 42px 48px;border-left:1px solid var(--linha)}
@media (max-width:899px){.fams > div + div{border-left:0;border-top:1px solid var(--linha);padding-left:0}}
.fams .who{font-family:var(--f-ui);font-weight:500;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--bronze-texto)}
.fams .name{margin:10px 0 18px;font-family:var(--f-tit);font-weight:300;font-size:clamp(34px, 3.2vw, 46px);line-height:1.05;letter-spacing:-.015em;color:var(--petroleo)}
.fams p{font-size:18px;line-height:1.65;text-wrap:pretty}
.fams .end{margin-top:20px;font-family:var(--f-tit);font-style:italic;font-weight:300;font-size:24px;color:var(--petroleo)}

/* linha do tempo */
.tl{position:relative;border-bottom:1px solid var(--linha)}
.tl li{display:grid;grid-template-columns:120px minmax(0,1fr);gap:0 28px;padding:26px 0;font-size:18px;line-height:1.6}
.tl .y{font-family:var(--f-tit);font-weight:300;font-size:32px;line-height:1.05;letter-spacing:-.01em;color:var(--bronze);font-variant-numeric:lining-nums}
.tl .y.w{font-style:italic;font-size:24px;color:var(--bronze-texto);padding-top:4px}
@media (max-width:560px){.tl li{grid-template-columns:1fr;gap:6px}}

.photo{position:relative}
.photo .ph{overflow:hidden;border-radius:2px}
.photo img{width:100%;height:auto}
.photo figcaption{margin-top:14px;padding-top:12px;border-top:1px solid var(--petroleo);font-family:var(--f-ui);font-size:14px;letter-spacing:.06em;color:var(--tinta-suave)}
.team{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(40px, 6vw, 96px)}
.team > div{flex:1 1 420px;min-width:0}
.team > figure{flex:1 1 440px;min-width:0;max-width:600px}

/* ---------- contato ---------- */
.contact{width:var(--wrap);margin:0 auto;padding:clamp(40px, 5vw, 72px) 0 var(--sec);display:flex;flex-wrap:wrap;gap:clamp(48px, 6vw, 96px);align-items:flex-start}
.contact > aside{flex:1 1 320px;min-width:0;max-width:440px}
.contact > aside .h1{margin:24px 0 28px;font-size:clamp(42px, 4.6vw, 66px)}
.contact .mini{margin-top:40px;display:grid;grid-template-columns:120px minmax(0,1fr);gap:20px;align-items:end}
.contact .mini img{width:120px;aspect-ratio:4 / 5;object-fit:cover;border-radius:60px 60px 0 0}
.contact .mini p{font-size:16px;line-height:1.55;color:var(--tinta-suave)}
.contact .other{margin-top:40px;border-top:1px solid var(--petroleo)}
.contact .other li{padding:16px 0;border-bottom:1px solid var(--linha);font-size:17px;line-height:1.5}
.contact .other b{display:block;font-family:var(--f-ui);font-weight:500;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--bronze-texto)}
.form{flex:1.4 1 520px;min-width:0;background:var(--linho-claro);border:1px solid var(--linha);border-top:3px solid var(--petroleo);padding:clamp(24px, 4vw, 48px);box-shadow:0 50px 90px -70px rgba(31,51,56,.55)}
.form .grid2{display:flex;flex-wrap:wrap;gap:22px}
.form .grid2 > .fld{flex:1 1 220px}
.fld{display:flex;flex-direction:column;gap:8px;margin-top:28px}
.form > .fld:first-child,.form > .grid2:first-child .fld{margin-top:0}
.fld > label,.fset legend{font-family:var(--f-ui);font-weight:500;font-size:17px;line-height:1.35;color:var(--petroleo);padding:0}
.fld .hint,.fset .hint{font-family:var(--f-ui);font-weight:400;font-size:15px;color:var(--tinta-suave)}
.in{width:100%;min-height:52px;border:1px solid #9AA6A8;border-radius:2px;background:#fff;padding:0 14px;font:inherit;font-size:18px;color:var(--tinta);transition:border-color .3s,box-shadow .3s}
.in:hover{border-color:var(--petroleo)}
.in:focus{border-color:var(--petroleo);outline:none;box-shadow:0 0 0 3px rgba(176,108,52,.28)}
textarea.in{min-height:132px;padding:12px 14px;line-height:1.55;resize:vertical}
select.in{appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23335159' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 16px center;padding-right:44px}
.fset{border:0;margin:28px 0 0;padding:0;min-width:0}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.chip span{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:8px 16px;border:1px solid #9AA6A8;border-radius:2px;background:#fff;font-family:var(--f-ui);font-size:16px;line-height:1.3;color:var(--tinta);cursor:pointer;transition:background .35s var(--ease),border-color .35s,color .35s,transform .2s}
.chip span::before{content:"";width:0;height:10px;border:solid var(--linho);border-width:0 0 1.6px 1.6px;transform:rotate(-45deg) translateY(-2px);transition:width .35s var(--ease);margin-right:-8px}
.chip:hover span{border-color:var(--petroleo)}
.chip:active span{transform:scale(.97)}
.chip input:checked + span{background:var(--petroleo);border-color:var(--petroleo);color:var(--linho)}
.chip input:checked + span::before{width:5px;margin-right:2px}
.chip input:focus-visible + span{outline:2px solid var(--bronze);outline-offset:2px}
.check{display:grid;grid-template-columns:26px minmax(0,1fr);gap:10px;align-items:start;margin-top:22px;font-size:16px;line-height:1.5}
.check input{width:22px;height:22px;margin:2px 0 0;accent-color:var(--petroleo)}
.form .send{margin-top:32px;display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px}
.form .legal{margin-top:22px;font-size:15px;line-height:1.55;color:var(--tinta-suave)}
.form .err{display:none;margin-top:16px;font-family:var(--f-ui);font-size:16px;color:#8E2B1E}
.form.bad .err{display:block}
.ok{display:none;padding:clamp(28px, 4vw, 52px);background:var(--linho-claro);border:1px solid var(--linha);border-top:3px solid var(--petroleo)}
.ok .mono-draw{width:56px;height:auto;color:var(--bronze);margin-bottom:26px}
.ok .h2{font-size:clamp(32px, 3.2vw, 46px)}
.ok p{margin-top:16px}
.sent .form{display:none}
.sent .ok{display:block;flex:1.4 1 520px}
.preview{margin-top:16px;font-family:var(--f-ui);font-size:14px;color:var(--bronze-texto)}
.form .hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.form .fail-msg{display:none;margin-top:16px;font-family:var(--f-ui);font-size:16px;line-height:1.5;color:#8E2B1E}
.form.fail .fail-msg{display:block}
.form button[disabled]{opacity:.7;cursor:progress}

/* ---------- textos longos (privacidade, artigos) ---------- */
.prose{max-width:720px}
.prose h2{margin:56px 0 16px;font-family:var(--f-tit);font-weight:300;font-size:clamp(28px, 2.5vw, 36px);line-height:1.12;letter-spacing:-.01em;color:var(--petroleo)}
.prose p,.prose li{font-size:18px;line-height:1.7}
.prose p + p{margin-top:1em}
.prose ul,.prose ol{margin-top:12px;padding-left:22px}
.prose ul{list-style:disc}
.prose ol{list-style:decimal}
/* artigos do blog */
.assina{margin:10px 0 0;font-family:var(--f-ui);font-size:15px;line-height:1.5;color:var(--tinta-suave)}
.assina a{color:var(--tinta-suave)}
.art{padding-top:clamp(36px, 4.5vw, 64px)}
.art-t{margin:18px 0 0;max-width:860px;font-size:clamp(38px, 4.4vw, 60px)}
.art .assina{margin:18px 0 clamp(32px, 4vw, 48px)}
.art .faq{margin-top:12px;max-width:720px;border-top:1px solid var(--linha)}
.tabela{margin:20px 0;overflow-x:auto;-webkit-overflow-scrolling:touch}
.tabela table{width:100%;min-width:520px;border-collapse:collapse;font-family:var(--f-ui);font-size:16px;line-height:1.45}
.tabela th,.tabela td{padding:12px 14px 12px 0;border-top:1px solid var(--linha);text-align:left;vertical-align:top}
.tabela thead th{border-top:1px solid var(--petroleo);font-weight:500;color:var(--petroleo)}
.tabela tbody th{font-weight:500;color:var(--tinta)}
.art-aviso{margin-top:28px;font-size:15px;line-height:1.55;color:var(--tinta-suave)}
.prose .art-aviso{font-size:15px}
.art-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 32px;max-width:720px;margin-top:clamp(40px, 5vw, 64px);padding-top:24px;border-top:1px solid var(--petroleo)}
.art-cta p{margin:0;font-family:var(--f-tit);font-weight:300;font-size:26px;line-height:1.2;color:var(--petroleo)}
.prose li + li{margin-top:6px}

/* ---------- rodapé ---------- */
.foot{position:relative;overflow:hidden;background:var(--petroleo-esc);color:var(--linho)}
.foot::before{content:"";position:absolute;right:-60px;bottom:-90px;width:420px;height:557px;background:var(--linho);opacity:.035;-webkit-mask:url(/assets/img/monograma.svg) no-repeat center/contain;mask:url(/assets/img/monograma.svg) no-repeat center/contain;pointer-events:none}
.foot-in{position:relative;width:var(--wrap);margin:0 auto;padding:clamp(64px, 7vw, 100px) 0 40px}
.foot-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:48px}
.foot-id{flex:1 1 320px;max-width:400px}
.foot-id img{height:40px;width:auto}
.foot-id p{margin-top:28px;font-size:17px;line-height:1.6;color:var(--esc-txt)}
.foot nav{flex:2 1 560px;display:grid;grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));gap:36px 32px;font-family:var(--f-ui)}
.foot h2{margin:0 0 16px;font-family:var(--f-ui);font-weight:500;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--esc-rot)}
.foot nav ul{display:flex;flex-direction:column;gap:10px;font-size:16px;line-height:1.35}
.foot nav a{color:var(--linho);text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .5s var(--ease)}
.foot nav a:hover{background-size:100% 1px}
.foot nav .off{color:var(--esc-rot)}
.foot .disc{margin-top:56px;padding-top:28px;border-top:1px solid var(--esc-fio);max-width:56em;font-size:16px;line-height:1.6;color:var(--esc-txt)}
.foot-bot{margin-top:28px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px 32px;font-family:var(--f-ui);font-size:15px;color:var(--esc-rot)}
.foot-bot div{display:flex;flex-wrap:wrap;gap:24px}
.foot-bot a{color:var(--linho)}
.ck-abrir{padding:0;border:0;background:none;color:var(--linho);font:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}

/* aviso de cookies: Aceitar e Recusar com o mesmo peso, sem empurrar para um dos lados */
.cookies{position:fixed;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:50;max-width:520px;margin-left:auto;padding:18px 20px 20px;border-top:2px solid var(--bronze);border-radius:2px;background:var(--petroleo-esc);color:var(--linho);font-family:var(--f-ui);font-size:16px;line-height:1.45;box-shadow:0 18px 50px -18px rgba(31,51,56,.65)}
.cookies[hidden]{display:none}
.cookies p{margin:0}
.cookies a{color:var(--linho)}
.ck-btns{display:flex;gap:10px;margin-top:14px}
.ck-btns button{flex:1;min-height:48px;border:1px solid var(--esc-txt);border-radius:2px;background:transparent;color:var(--linho);font-family:var(--f-ui);font-weight:500;font-size:16px;letter-spacing:.03em;cursor:pointer}
.ck-btns button:hover,.ck-btns button:focus-visible{background:var(--linho);color:var(--petroleo-esc)}

/* seções escuras genéricas (além do Mater/Pater) */
.dark .h2{color:var(--linho)}
.dark .it-lab{color:var(--bronze-claro)}
.dark .txt{color:var(--linho)}
.dark .txt.soft2{color:var(--esc-txt)}
.dark .strip{border-bottom-color:var(--esc-fio);background-image:linear-gradient(var(--esc-rot),var(--esc-rot))}
.dark .strip > li + li{border-color:var(--esc-fio)}
.dark .strip .when{color:var(--bronze-claro)}
.dark .strip p{color:var(--linho)}
.dark .rlist{border-bottom-color:var(--esc-fio)}
.dark .rlist li{background-image:linear-gradient(var(--esc-fio),var(--esc-fio));color:var(--esc-txt)}
.dark .rlist b,.dark .rlist strong{color:var(--linho)}
.dark .roman{color:var(--bronze-claro)}
.txt + .rlist{margin-top:clamp(24px, 2.6vw, 36px)}
.txt + .src,.rlist + .src{margin-top:24px}
.src{max-width:44em;font-size:15px;line-height:1.55;color:var(--tinta-suave)}
.src a{color:inherit}
.dark .src{color:var(--esc-rot)}
.cols .ck{margin-top:18px;border-bottom:1px solid var(--linha)}
.cols .ck li{padding:12px 0;border-top:1px solid var(--linha);font-size:17px;line-height:1.55;text-wrap:pretty}
.cols .h3 + .ck{margin-top:22px}
.cmp{width:100%;margin-top:clamp(40px, 4.4vw, 60px);border-collapse:collapse;border-bottom:1px solid var(--linha);font-size:17px;line-height:1.55}
.cmp th,.cmp td{text-align:left;vertical-align:top;padding:20px 28px 20px 0;border-top:1px solid var(--linha);text-wrap:pretty}
.cmp thead th{padding:0 28px 14px 0;border-top:0;font-family:var(--f-ui);font-weight:500;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--bronze-texto)}
.cmp tbody tr:first-child > *{border-top-color:var(--petroleo)}
.cmp tbody th{width:24%;font-family:var(--f-ui);font-weight:500;font-size:17px;color:var(--petroleo)}
@media (max-width:719px){
  .cmp thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .cmp tbody tr{display:block;padding:18px 0 20px;border-top:1px solid var(--linha)}
  .cmp tbody tr:first-child{border-top-color:var(--petroleo)}
  .cmp tbody th,.cmp tbody td{display:block;width:auto;padding:0;border:0}
  .cmp tbody td::before{content:attr(data-l);display:block;margin:14px 0 2px;font-family:var(--f-ui);font-weight:500;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--bronze-texto)}
}

/* ---------- transição entre páginas ---------- */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vt-sai .35s var(--ease-io) both}
::view-transition-new(root){animation:vt-entra .7s var(--ease) both}
@keyframes vt-sai{to{opacity:0}}
@keyframes vt-entra{from{opacity:0;transform:translateY(14px)}}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}

/* ---------- movimento (revelação ao rolar) ---------- */
@media (prefers-reduced-motion:no-preference){
  /* blocos: sobem e aparecem */
  .js [data-r]{opacity:0;transform:translate3d(0,30px,0);transition:opacity 1.1s var(--ease) var(--d,0s),transform 1.2s var(--ease) var(--d,0s),background-size 1.6s var(--ease-io) var(--d,0s)}
  .js [data-r].is-in{opacity:1;transform:none}
  /* fios que se desenham da esquerda para a direita */
  .js .rlist li[data-r]:not(.is-in),.js .faq details[data-r]:not(.is-in),.js .tl li[data-r]:not(.is-in),
  .js .cols > li[data-r]:not(.is-in),.js .steps li[data-r]:not(.is-in),.js .post[data-r]:not(.is-in),
  .js .rows > li[data-r]:not(.is-in),.js .strip[data-r]:not(.is-in),.js .fams[data-r]:not(.is-in){background-size:0 1px}
  .js .strip[data-r],.js .fams[data-r]{transform:none}

  /* títulos: cada palavra sobe por trás de uma linha invisível */
  .js .ws .w{display:inline-block;clip-path:inset(-.4em -.25em -.32em -.25em)}
  .js .ws .wi{display:inline-block;transform:translate3d(0,122%,0);transition:transform 1.3s var(--ease) calc(var(--d0,0s) + var(--i) * 52ms)}
  .js .ws.is-in .wi{transform:none}

  /* numerais romanos: sobem como se fossem gravados */
  .js .cols .num,.js .steps .num{clip-path:inset(100% 0 0 0);transition:clip-path 1.3s var(--ease-io) calc(var(--d,0s) + .15s)}
  .js .is-in > .num{clip-path:inset(-10% -10% -10% -10%)}

  /* abertura: retrato abre como um arco, contorno em bronze se desenha */
  .js .arch-img{clip-path:inset(100% 0 0 0 round 1000px 1000px 0 0);transition:clip-path 1.7s var(--ease-io) .15s}
  .js .arch.is-in .arch-img{clip-path:inset(0 0 0 0 round 1000px 1000px 0 0)}
  .js .arch-img img{--sc:1.18;transition:--sc 2.6s var(--ease) .15s}
  .js .arch.is-in .arch-img img{--sc:1}
  .js .arch::before{clip-path:inset(100% 0 0 0);transition:clip-path 2s var(--ease-io) .65s}
  .js .arch.is-in::before{clip-path:inset(0 0 0 0)}
  .js .arch figcaption span{opacity:0;transition:opacity 1s var(--ease) 1.5s}
  .js .arch.is-in figcaption span{opacity:1}
  .js .arch figcaption::before{transform:scaleX(0);transition:transform 1.5s var(--ease-io) 1.1s}
  .js .arch.is-in figcaption::before{transform:scaleX(1)}
  /* rosácea: cada anel se desenha do alto para os dois lados (um atrás do outro) e depois tudo gira bem devagar;
     o selo chega carimbando e o texto gira */
  .js .rosa path{stroke-dasharray:0 1 0;transition:stroke-dasharray 2.8s var(--ease-io);transition-delay:calc(.7s + var(--i, 0) * 75ms)}
  .js .arch.is-in .rosa path{stroke-dasharray:.5 0 .5}
  .rosa svg{animation:gira 300s linear infinite;will-change:transform}
  .js .selo{opacity:0;transform:scale(1.32) rotate(-28deg);transition:opacity .9s var(--ease) 1.9s,transform 1.5s cubic-bezier(.34,1.38,.64,1) 1.9s}
  .js .arch.is-in .selo{opacity:1;transform:none}
  .selo .s-texto{animation:gira 42s linear infinite}
  /* brilho de bronze que passa uma vez pelo trecho em itálico do título, depois do traço */
  @supports ((-webkit-background-clip:text) or (background-clip:text)){
    .js .hero .h1 em .wi{background:linear-gradient(100deg,transparent 36%,var(--bronze-claro) 50%,transparent 64%) 120% 0/260% 100% no-repeat var(--petroleo);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
    .js .hero .h1.brilha em .wi{animation:brilho 1.7s var(--ease-io) calc(var(--k, 0) * 110ms) both}
  }
  /* cabeçalho na primeira visita da sessão: faixa, monograma que se desenha, letras do nome e menu em sequência */
  .js.intro .tb-in{animation:fade 1s var(--ease) .1s both}
  .js.intro .brand-mono path{animation:logo-entra 2.2s var(--ease-io) .1s both}
  .js.intro .wordmark use{animation:letra 1s var(--ease) both;animation-delay:calc(.5s + var(--l, 0) * 48ms)}
  .js.intro .nav > *,.js.intro .hdr-cta,.js.intro .mmenu > summary{animation:desce .9s var(--ease) both;animation-delay:calc(.4s + var(--n, 0) * 70ms)}
  .js .swash{clip-path:inset(0 100% 0 0);transition:clip-path 1.2s var(--ease-io)}
  .js .swash.on{clip-path:inset(-50% -2% -50% 0)}

  /* sobrelinha da abertura: as letras se aproximam */
  .js .hero .kicker,.js .phero .kicker,.js .contact .kicker{letter-spacing:.34em;opacity:0;transition:letter-spacing 1.6s var(--ease),opacity 1.2s var(--ease)}
  .js .hero .kicker.is-in,.js .phero .kicker.is-in,.js .contact .kicker.is-in{letter-spacing:.16em;opacity:1}

  /* credenciais */
  .js .creds li{opacity:0;transform:translate3d(0,16px,0);transition:opacity 1s var(--ease) var(--d,0s),transform 1.1s var(--ease) var(--d,0s)}
  .js .creds.is-in li{opacity:1;transform:none}

  /* frase que acende palavra por palavra conforme a rolagem */
  .js [data-scrub] .sw{opacity:var(--o,.14);transition:opacity .3s linear}

  /* inscrição MATRIMONIVM ANTE PATRIMONIVM */
  .js .insc .lt{opacity:0;transform:translate3d(0,.32em,0);filter:blur(7px);transition:opacity 1.1s var(--ease),transform 1.3s var(--ease),filter 1.1s var(--ease);transition-delay:calc(var(--j) * 58ms + var(--l,0) * 160ms)}
  .js .insc.is-in .lt{opacity:1;transform:none;filter:none}
  .js .insc .ini{opacity:0;transform:scale(1.3);transition:opacity 1.3s var(--ease) 1.15s,transform 1.8s var(--ease) 1.15s,text-shadow .6s var(--ease)}
  .js .insc.is-in .ini{opacity:1;transform:none}
  .js .insc .ante i{transform:scaleX(0);transition:transform 1.5s var(--ease-io) .55s}
  .js .insc.is-in .ante i{transform:none}
  .js .insc .ante span{opacity:0;transition:opacity 1s var(--ease) 1s}
  .js .insc.is-in .ante span{opacity:1}

  /* mapa: a Itália se desenha, as cidades acendem, a rota aparece */
  .js .map-land{stroke-dasharray:1 1;stroke-dashoffset:1;transition:stroke-dashoffset 3s var(--ease-io) .1s}
  .js .map.is-in .map-land{stroke-dashoffset:0}
  .js .route-mask{stroke-dasharray:1 1;stroke-dashoffset:1;transition:stroke-dashoffset 1.8s var(--ease-io) 2.7s}
  .js .map.is-in .route-mask{stroke-dashoffset:0}
  .js .map-city .pin{transform:scale(0);transform-box:fill-box;transform-origin:center;transition:transform .8s cubic-bezier(.34,1.56,.64,1) calc(1.9s + var(--k) * .3s)}
  .js .map.is-in .map-city .pin{transform:none}
  .js .map-city text{opacity:0;transition:opacity .9s var(--ease) calc(2.1s + var(--k) * .3s)}
  .js .map.is-in .map-city text{opacity:1}
  .js .map.is-in .map-city .ring{animation:anel 2.8s var(--ease) calc(2.2s + var(--k) * .3s) 2 both}

  /* monograma: o traço se desenha e depois ganha preenchimento */
  .js .mono-draw path{fill-opacity:0;stroke-width:1.1;stroke-dasharray:1 1;stroke-dashoffset:1;transition:stroke-dashoffset 2.4s var(--ease-io) var(--d,0s),fill-opacity 1.4s var(--ease) calc(var(--d,0s) + 1.6s),stroke-width 1.2s var(--ease) calc(var(--d,0s) + 1.9s)}
  .js .is-in .mono-draw path,.js .mono-draw.is-in path{stroke-dashoffset:0;fill-opacity:1;stroke-width:0}
  .js .mono-draw.outline path,.js .is-in .mono-draw.outline path,.js .mono-draw.outline.is-in path{fill-opacity:0;stroke-width:.9}

  /* fotos: abrem de baixo para cima */
  .js .photo .ph{clip-path:inset(100% 0 0 0);transition:clip-path 1.6s var(--ease-io) var(--d,0s)}
  .js .photo.is-in .ph{clip-path:inset(0)}
  .js .photo .ph img{--sc:1.12;transform:scale(var(--sc));transition:--sc 2.4s var(--ease) var(--d,0s)}
  .js .photo.is-in .ph img{--sc:1}
}
@keyframes anel{0%{opacity:.75;transform:scale(1)}100%{opacity:0;transform:scale(4.2)}}
@keyframes gira{to{transform:rotate(360deg)}}
@keyframes brilho{from{background-position:120% 0}to{background-position:-20% 0}}
@keyframes logo-entra{0%{fill-opacity:0;stroke-width:1.3;stroke-dashoffset:1}66%{fill-opacity:0;stroke-width:1.3;stroke-dashoffset:0}100%{fill-opacity:1;stroke-width:0;stroke-dashoffset:0}}
@keyframes letra{from{opacity:0;translate:0 38px}}
@keyframes desce{from{opacity:0;transform:translateY(-10px)}}
.nav > :nth-child(2){--n:1}.nav > :nth-child(3){--n:2}.nav > :nth-child(4){--n:3}.nav > :nth-child(5){--n:4}.nav > :nth-child(6){--n:5}.hdr-cta{--n:6}

/* ---------- Brasil e Itália: globo com o arco São Paulo → Turim ---------- */
.ponte-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,540px);gap:clamp(40px, 6vw, 96px);align-items:center}
.ponte-txt .h2{margin-bottom:28px}
.globe{margin:0}
.globe-svg{display:block;width:100%;height:auto;overflow:visible}
.g-grade{fill:none;stroke:#D9D1C5;stroke-width:.7}
.g-terra{fill:rgba(51,81,89,.07);stroke:var(--petroleo);stroke-width:.8;stroke-linejoin:round}
.g-pais{fill:none;stroke:var(--petroleo-esc);stroke-width:.9;stroke-linejoin:round;transition:stroke .5s,stroke-width .5s}
.g-borda{fill:none;stroke:var(--petroleo);stroke-width:1;transition:stroke .3s,stroke-width .3s}
.g-halo,.g-volume,.g-brilho,.g-arco,.g-cauda,.g-viajante,.g-pino{pointer-events:none}
.g-arco{fill:none;stroke:var(--bronze);stroke-width:1.6;stroke-linecap:round}
.g-cauda{fill:none;stroke-width:3.2;stroke-linecap:round}
.g-pino .pin{fill:var(--bronze);stroke:#FBF9F5;stroke-width:1.6}
.g-pino .anel{fill:none;stroke:var(--bronze);stroke-width:1.2;opacity:0;transform-box:fill-box;transform-origin:center}
.g-pino text{font-family:var(--f-ui);font-weight:500;font-size:14px;letter-spacing:.14em;fill:var(--petroleo);paint-order:stroke;stroke:#F7F4EF;stroke-width:6px;stroke-linejoin:round}
.g-viajante{fill:var(--bronze);filter:drop-shadow(0 0 5px rgba(176,108,52,.9))}
/* bandeiras pintadas sobre os países (cores oficiais) */
.g-flag{transition:filter .5s var(--ease)}
.f-br-verde{fill:#009C3B}.f-br-losango{fill:#FFDF00}.f-br-circulo{fill:#002776}.f-br-faixa{fill:#fff}
.f-it-verde{fill:#009246}.f-it-branco{fill:#F4F5F0}.f-it-vermelho{fill:#CE2B37}
/* globo que gira (public/assets/globo.js liga a classe .viva) */
.globe.viva .globe-svg{cursor:grab;touch-action:pan-y;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none}
.globe.arrastando .globe-svg{cursor:grabbing}
.globe.viva .globe-svg:focus-visible .g-borda{stroke:var(--bronze);stroke-width:2.5}
.globe.viva:not(.arrastando) .g-flag:hover{filter:brightness(1.07) saturate(1.12)}
.globe.viva:not(.arrastando) .globe-svg:has(.g-flag-br:hover) .g-br,.globe.viva:not(.arrastando) .globe-svg:has(.g-flag-it:hover) .g-it,.globe.chegou .g-it{stroke:var(--bronze);stroke-width:1.7}
.g-dica{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:10px;font-family:var(--f-ui);font-weight:500;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--tinta-suave);opacity:0;transition:opacity .9s var(--ease)}
.g-dica svg{width:30px;height:14px;flex:none;fill:none;stroke:var(--bronze);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.globe.pronto .g-dica{opacity:1}
.globe.usado .g-dica{opacity:0;transition-duration:.4s}
@keyframes dica{0%,100%{transform:translateX(0)}30%{transform:translateX(-4px)}62%{transform:translateX(4px)}}
.pfacts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:44px;background:linear-gradient(var(--petroleo),var(--petroleo)) 0 0/100% 1px no-repeat}
.pfacts li{padding:22px 20px 0 0}
.pfacts li + li{padding-left:20px;border-left:1px solid var(--linha)}
.pf-v{display:block;white-space:nowrap;font-family:var(--f-tit);font-weight:300;font-size:clamp(26px, 2.2vw, 34px);line-height:1;letter-spacing:-.01em;color:var(--petroleo);font-variant-numeric:lining-nums}
.pf-l{display:block;margin-top:10px;font-size:15px;line-height:1.45;color:var(--tinta-suave)}
@media (max-width:960px){.ponte-in{grid-template-columns:1fr}.globe{width:min(100%, 520px);margin:0 auto}}
@media (max-width:560px){.pfacts{grid-template-columns:1fr}.pfacts li{padding:18px 0}.pfacts li + li{border-left:0;padding-left:0;border-top:1px solid var(--linha)}}

/* mantra em italiano, sob o português */
.it-mantra{margin:18px auto 0;font-family:var(--f-tit);font-style:italic;font-weight:300;font-size:clamp(18px, 1.6vw, 22px);color:var(--esc-rot)}

/* pórticos de Turim no alto do rodapé */
.portici{display:block;height:60px;opacity:.9}
.portici svg{display:block}
.portici path{fill:none;stroke:var(--esc-fio);stroke-width:1}

@media (prefers-reduced-motion:no-preference){
  .js .globe .g-grade{opacity:0;transition:opacity 1.8s var(--ease) .1s}
  .js .globe.is-in .g-grade{opacity:1}
  .js .globe .g-terra{stroke-dasharray:1 1;stroke-dashoffset:1;fill-opacity:0;transition:stroke-dashoffset 3.2s var(--ease-io) .2s,fill-opacity 1.6s var(--ease) 2.4s}
  .js .globe.is-in .g-terra{stroke-dashoffset:0;fill-opacity:1}
  .js .globe .g-pais{opacity:0;transition:opacity 1.4s var(--ease) 2.3s,stroke .5s,stroke-width .5s}
  .js .globe .g-flag{opacity:0;transition:opacity 1.4s var(--ease) 2.3s,filter .5s var(--ease)}
  .js .globe.is-in .g-pais,.js .globe.is-in .g-flag{opacity:1}
  /* globo que gira: a terra aparece enquanto ele gira; o Brasil logo, a Itália quando o arco chega */
  .js .globe.viva .g-terra{stroke-dasharray:none;stroke-dashoffset:0;fill-opacity:1;opacity:0;transition:opacity 1.6s var(--ease) .15s}
  .js .globe.viva.is-in .g-terra{opacity:1}
  .js .globe.viva .g-flag-br,.js .globe.viva .g-br{transition-delay:1.4s,0s,0s}
  .js .globe.viva .g-flag-it,.js .globe.viva .g-it{transition-delay:5s,0s,0s}
  .js .globe.viva .g-pino .anel{animation:none}
  .globe.pronto:not(.usado) .g-dica svg{animation:dica 2.8s var(--ease-io) .4s infinite}
  .js .globe .g-arco{stroke-dasharray:1 1;stroke-dashoffset:1;transition:stroke-dashoffset 2.4s var(--ease-io) 2.9s}
  .js .globe.is-in .g-arco{stroke-dashoffset:0}
  .js .globe .g-pino .pin{transform:scale(0);transform-box:fill-box;transform-origin:center;transition:transform .8s cubic-bezier(.34,1.56,.64,1) calc(2.7s + var(--k) * 2.5s)}
  .js .globe.is-in .g-pino .pin{transform:none}
  .js .globe .g-pino text{opacity:0;transition:opacity .9s var(--ease) calc(2.9s + var(--k) * 2.5s)}
  .js .globe.is-in .g-pino text{opacity:1}
  .js .globe.is-in .g-pino .anel{animation:anel 2.8s var(--ease) calc(2.9s + var(--k) * 2.5s) 2 both}
  .js .pfacts{background-size:0 1px;transition:background-size 1.6s var(--ease-io) .3s}
  .js .pfacts.is-in{background-size:100% 1px}
  .js .portici path{stroke-dasharray:300;stroke-dashoffset:300;transition:stroke-dashoffset 2.6s var(--ease-io) .2s}
  .js .foot.is-in .portici path{stroke-dashoffset:0}
}

/* ---------- fotos da Itália ---------- */
/* faixa larga de Turim */
.faixa-foto{position:relative;margin:0;height:clamp(440px, 74vh, 780px);overflow:hidden;background:var(--petroleo-esc);color:var(--linho)}
.ff-img{position:absolute;left:0;right:0;top:-12%;bottom:-12%;transform:translate3d(0,var(--py,0px),0);will-change:transform}
.ff-img img{width:100%;height:100%;object-fit:cover;object-position:50% 38%;transform:scale(var(--sc))}
.faixa-foto::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(31,51,56,0) 42%,rgba(31,51,56,.82) 100%);pointer-events:none}
.faixa-foto figcaption{position:absolute;z-index:1;left:0;right:0;bottom:0;width:var(--wrap);margin:0 auto;padding-bottom:clamp(28px, 4vw, 56px);display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:end;gap:10px 44px}
.ff-k{grid-column:1 / -1;font-family:var(--f-ui);font-weight:500;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--esc-rot);font-variant-numeric:lining-nums}
.ff-place{font-family:var(--f-tit);font-style:italic;font-weight:300;font-size:clamp(66px, 9.5vw, 156px);line-height:.88;letter-spacing:-.025em;color:var(--linho)}
.ff-txt{max-width:22em;padding-bottom:12px;font-size:clamp(17px, 1.4vw, 20px);line-height:1.5;color:var(--linho)}
.ff-cred{align-self:end;padding-bottom:14px;font-family:var(--f-ui);font-size:12px;letter-spacing:.05em;color:rgba(239,235,229,.72);text-decoration:none}
.ff-cred:hover{color:var(--linho);text-decoration:underline;text-underline-offset:3px}
@media (max-width:760px){.faixa-foto figcaption{grid-template-columns:1fr;gap:8px}.ff-cred{padding-bottom:0}.ff-txt{padding-bottom:0}}

/* Torino, Milano, Lucca: três arcos, como os pórticos */
.trip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px, 3vw, 44px)}
.cid{margin:0}
.cid-img{position:relative;aspect-ratio:4 / 5;overflow:hidden;border-radius:1000px 1000px 0 0;background:#E2CDB5}
.cid-img img{width:100%;height:100%;object-fit:cover;transform:scale(var(--sc));transition:transform 1.4s var(--ease)}
.cid:hover .cid-img img{transform:scale(calc(var(--sc) * 1.05))}
.cid figcaption{display:grid;gap:4px;margin-top:18px;padding-top:14px;border-top:1px solid var(--petroleo)}
.cid-n{font-family:var(--f-tit);font-style:italic;font-weight:300;font-size:clamp(32px, 3vw, 44px);line-height:1;letter-spacing:-.015em;color:var(--petroleo)}
.cid-d{font-size:16px;line-height:1.45;color:var(--tinta-suave)}
.cid-cred{margin-top:4px;font-family:var(--f-ui);font-size:12px;letter-spacing:.04em;color:var(--tinta-suave);text-decoration:none}
.cid-cred:hover{text-decoration:underline;text-underline-offset:3px}
@media (max-width:760px){.trip{grid-template-columns:1fr;gap:40px}.cid-img{aspect-ratio:4 / 3.6}}

@media (prefers-reduced-motion:no-preference){
  .js .faixa-foto{clip-path:inset(7% 3% 7% 3%);transition:clip-path 1.7s var(--ease-io)}
  .js .faixa-foto.is-in{clip-path:inset(0 0 0 0)}
  .js .faixa-foto img{--sc:1.16;transition:--sc 2.8s var(--ease)}
  .js .faixa-foto.is-in img{--sc:1}
  .js .faixa-foto .ff-k,.js .faixa-foto .ff-txt,.js .faixa-foto .ff-cred{opacity:0;transform:translate3d(0,16px,0);transition:opacity 1.1s var(--ease) 1s,transform 1.2s var(--ease) 1s}
  .js .faixa-foto.is-in .ff-k,.js .faixa-foto.is-in .ff-txt,.js .faixa-foto.is-in .ff-cred{opacity:1;transform:none}
  .js .cid .cid-img{clip-path:inset(100% 0 0 0 round 1000px 1000px 0 0);transition:clip-path 1.6s var(--ease-io) var(--d,0s)}
  .js .cid.is-in .cid-img{clip-path:inset(0 0 0 0 round 1000px 1000px 0 0)}
  .js .cid .cid-img img{--sc:1.14;transition:--sc 2.4s var(--ease) var(--d,0s),transform 1.4s var(--ease)}
  .js .cid.is-in .cid-img img{--sc:1}
}

/* ---------- organograma da família (Family Office; tools/make_organograma.py) ----------
   Larga no computador, alta no celular. Sem JavaScript: versão "com Family Officer" e a lista inteira embaixo.
   Com o site.js (classe .og-on): botões sem/com, caixa escolhida em bronze e só o item dela na lista. */
.og{margin:0}
.og-svg{display:block;width:100%;height:auto;overflow:visible}
.og-alto{display:none;max-width:460px;margin-inline:auto}
@media (max-width:979px){.og-largo{display:none}.og-alto{display:block}}
.og-e{fill:none;stroke:var(--petroleo);stroke-width:1.3;stroke-linejoin:round;transition:opacity .6s var(--ease)}
.og-e-sem{display:none;stroke:var(--tinta-suave);stroke-width:1.1}
.og-n text{font-family:var(--f-ui);font-weight:500;font-size:17px;letter-spacing:.01em;text-anchor:middle;pointer-events:none}
.og-alto .og-n text{font-size:16px}
.og-n rect{stroke-width:1;transition:stroke .3s,stroke-width .3s}
.og-fam rect{fill:var(--petroleo-esc)} .og-fam text{fill:var(--linho)}
.og-fo rect{fill:var(--bronze-texto)} .og-fo text{fill:#FBF7F1}
.og-pro rect{fill:#fff;stroke:var(--petroleo)} .og-pro text{fill:var(--petroleo)}
.og-pat rect{fill:var(--petroleo)} .og-pat text{fill:var(--linho)}
.og-fre rect{fill:#D5DEDE} .og-fre text{fill:var(--petroleo-esc)}
.og-bem rect{fill:#E6DDD0} .og-bem text{fill:var(--tinta)}
.og-fo{transition:opacity .7s var(--ease)}
.og-on .og-e-sem{display:inline}
.og-on[data-modo=com] .og-e-sem,.og-on[data-modo=sem] .og-e-com,.og-on[data-modo=sem] .og-fo{opacity:0}
.og-on[data-modo=sem] .og-fo{pointer-events:none}
.og-on .og-n{cursor:pointer;outline:none}
.og-on .og-n:hover rect{stroke:var(--bronze);stroke-width:1.6}
.og-on .og-n:focus-visible rect,.og-n.on rect{stroke:var(--bronze);stroke-width:3}
.og-modo{display:none}
.og-on .og-modo{display:flex;justify-content:center;margin:0 0 clamp(28px, 3.4vw, 48px)}
.og-modo button{min-height:46px;padding:8px 22px;border:1px solid var(--petroleo);background:transparent;color:var(--petroleo);font-family:var(--f-ui);font-weight:500;font-size:16px;letter-spacing:.03em;cursor:pointer;border-radius:2px 0 0 2px;transition:background .35s var(--ease),color .35s}
.og-modo button + button{border-left:0;border-radius:0 2px 2px 0}
.og-modo button[aria-pressed=true]{background:var(--petroleo);color:var(--linho)}
.og-modo button:not([aria-pressed=true]):hover{background:rgba(51,81,89,.08)}
.og-cap{margin-top:clamp(24px, 3vw, 36px);padding-top:12px;border-top:1px solid var(--petroleo);font-size:17px;line-height:1.5;color:var(--tinta-suave)}
.og-c-sem{display:none}
.og-on[data-modo=sem] .og-c-sem{display:inline}
.og-on[data-modo=sem] .og-c-com{display:none}
.og-info{margin-top:clamp(40px, 4.4vw, 64px)}
.og-dica{display:none;margin-bottom:14px;font-family:var(--f-ui);font-weight:500;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--bronze-texto)}
.og-on .og-dica{display:block}
.og-it{display:grid;grid-template-columns:minmax(0,280px) minmax(0,1fr);gap:10px 48px;padding:24px 0 28px;border-top:1px solid var(--linha)}
.og-t{font-family:var(--f-tit);font-weight:300;font-size:clamp(26px, 2.2vw, 32px);line-height:1.1;letter-spacing:-.01em;color:var(--petroleo)}
.og-d{max-width:760px;font-size:18px;line-height:1.6}
.og-it dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 48px}
.og-it dt{margin-bottom:6px;font-family:var(--f-ui);font-weight:500;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--bronze-texto)}
.og-it dd{margin:0;font-size:18px;line-height:1.6}
@media (max-width:760px){.og-it{grid-template-columns:1fr}.og-it dl{grid-template-columns:1fr}}
.og-on .og-it{display:none}
.og-on .og-it.on{display:grid;border-top-color:var(--petroleo);animation:og-in .5s var(--ease)}
@keyframes og-in{from{opacity:0;transform:translate3d(0,8px,0)}}
@media (prefers-reduced-motion:no-preference){
  /* as linhas se desenham; ao trocar sem/com, umas recolhem e outras se desenham */
  .js .og .og-e{stroke-dasharray:1 1;stroke-dashoffset:1;transition:stroke-dashoffset 1.1s var(--ease-io) var(--d,0s),opacity .6s var(--ease)}
  .js .og.is-in .og-e-base,.js .og.is-in[data-modo=com] .og-e-com,.js .og.is-in[data-modo=sem] .og-e-sem{stroke-dashoffset:0}
  .js .og .og-n{opacity:0;transition:opacity .9s var(--ease) var(--d,0s)}
  .js .og.is-in .og-n{opacity:1}
  .js .og.is-in[data-modo=sem] .og-fo{opacity:0}
}

/* ---------- sobre: saldo de cada família, régua Brasil | Itália, duas colunas ---------- */
.saldo{display:flex;flex-wrap:wrap;gap:10px 36px;margin-top:22px;padding-top:16px;border-top:1px solid var(--linha)}
.saldo > div{display:flex;align-items:baseline;gap:12px}
.saldo dt{position:relative;font-family:var(--f-tit);font-style:italic;font-weight:300;font-size:24px;line-height:1.2;color:var(--petroleo)}
.saldo dd{margin:0;font-family:var(--f-ui);font-weight:500;font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.saldo .sim dd{color:var(--bronze-texto)}
.saldo .nao dt{color:var(--tinta-suave)}
.saldo .nao dd{color:var(--tinta-suave)}
/* o que se perdeu leva um traço de bronze por cima */
.saldo .nao dt::after{content:"";position:absolute;left:-3px;right:-3px;top:56%;height:1.5px;background:var(--bronze);transform-origin:left}
.regua{position:relative;display:flex;height:8px;margin:44px 0 clamp(64px, 6vw, 88px)}
.regua > div{position:relative;height:100%;transform-origin:left}
.regua > div + div{box-shadow:-2px 0 0 var(--linho)}
.rg-br{background:var(--petroleo)}
.rg-it{background:var(--bronze)}
.rg-l{position:absolute;left:0;bottom:calc(100% + 12px);font-family:var(--f-ui);font-weight:500;font-size:14px;letter-spacing:.16em;text-transform:uppercase;color:var(--petroleo)}
.rg-it .rg-l{color:var(--bronze-texto)}
.rg-a{position:absolute;top:calc(100% + 12px);transform:translateX(-50%);font-family:var(--f-tit);font-weight:300;font-size:22px;line-height:1;color:var(--tinta-suave);font-variant-numeric:lining-nums;white-space:nowrap}
.rg-a::before{content:"";position:absolute;left:50%;top:-12px;width:1px;height:8px;background:var(--tinta-suave)}
.rg-a[style*="left:0"]{transform:none}
.rg-a[style*="left:0"]::before{left:0}
.rg-a[style*="left:100%"]{transform:translateX(-100%);font-style:italic}
.rg-a[style*="left:100%"]::before{left:auto;right:0}
@media (max-width:560px){.rg-a.mid{display:none}}
.duas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px clamp(40px, 5vw, 80px)}
@media (max-width:899px){.duas{grid-template-columns:1fr}}
.duas-k{margin-bottom:6px;font-family:var(--f-ui);font-weight:500;font-size:14px;letter-spacing:.16em;text-transform:uppercase;color:var(--petroleo)}
.duas-k.it{color:var(--bronze-texto)}
@media (prefers-reduced-motion:no-preference){
  .js .regua > div{transform:scaleX(0);transition:transform 1.3s var(--ease-io)}
  .js .regua > .rg-it{transition-delay:1.1s}
  .js .regua.is-in > div{transform:none}
  .js .regua .rg-l,.js .regua .rg-a{opacity:0;transition:opacity .9s var(--ease) .5s}
  .js .regua .rg-it .rg-l{transition-delay:1.6s}
  .js .regua.is-in .rg-l,.js .regua.is-in .rg-a{opacity:1}
  .js .saldo .nao dt::after{transform:scaleX(0);transition:transform .9s var(--ease-io) .7s}
  .js .saldo.is-in .nao dt::after{transform:none}
}
@media (max-width:420px){.og-modo button{padding:8px 12px;font-size:15px;letter-spacing:.01em;white-space:nowrap}}
.rg-a[style*="left:100%"]{padding-right:3px}