/* TRG Estúdio — estilos do site.
   Dois mundos: claro = Pérola (papel perolado, tinta quente, reflexos rosa, champanhe, lilás e céu);
   escuro = Óleo e floresta (verde-floresta profundo, ouro antigo e bordô, sem roxo).
   O monograma TRG é sempre o colorido de óleo. Tipos: GFS Didot (títulos), Hanken Grotesk (texto),
   Libre Baskerville itálico (detalhes). Movimento só com propósito, e nada com reduced-motion. */
@font-face{font-family:"GFS Didot";src:url("assets/fonts/GFSDidot-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url("assets/fonts/HankenGrotesk.woff2") format("woff2");font-weight:400 650;font-style:normal;font-display:swap}
@font-face{font-family:"Libre Baskerville";src:url("assets/fonts/LibreBaskerville-Italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}

@property --mx{syntax:"<percentage>";inherits:true;initial-value:50%}
@property --my{syntax:"<percentage>";inherits:true;initial-value:50%}

:root{
  --display:"GFS Didot","Didot","Bodoni 72",Georgia,serif;
  --text:"Hanken Grotesk","Helvetica Neue",Arial,sans-serif;
  --accentface:"Libre Baskerville",Georgia,serif;

  /* Pérola (claro) */
  --bg:#F5F1EC;
  --bg-2:#EDE6DF;
  --surface:#FBF8F5;
  --surface-2:#F3ECE6;
  --ink:#1D191E;
  --ink-2:#4B4349;
  --ink-3:#6B6168;
  --line:rgba(29,25,30,.12);
  --line-2:rgba(29,25,30,.2);
  --accent:#6E3A6B;
  --accent-ink:#FBF8F5;
  --btn-bg:#1D191E;
  --btn-fg:#FBF8F5;
  --focus:#6E3A6B;
  --oil:linear-gradient(105deg,#2C346E 0%,#3F2F5A 16%,#7E447C 34%,#B17869 52%,#C7A35E 68%,#2D8098 86%,#2C346E 100%);
  --sheen:linear-gradient(115deg,#EFC4B6 0%,#E9D8A8 26%,#D9C8DF 52%,#B8D6DF 78%,#EFC4B6 100%);
  --numfoil:linear-gradient(100deg,#2C346E 0%,#7E447C 26%,#B17869 44%,#C7A35E 54%,#2D8098 74%,#2C346E 100%);
  --wash:
    radial-gradient(60% 50% at 8% 0%, rgba(239,196,182,.42), transparent 70%),
    radial-gradient(50% 40% at 100% 18%, rgba(184,214,223,.38), transparent 70%),
    radial-gradient(60% 50% at 70% 100%, rgba(217,200,223,.34), transparent 70%);
  --shadow:0 1px 0 rgba(255,255,255,.7) inset, 0 30px 60px -38px rgba(60,40,50,.42);
  --shadow-lift:0 1px 0 rgba(255,255,255,.8) inset, 0 40px 70px -36px rgba(60,40,50,.5);
  --grain-op:.05;
  --ic-a:#2C346E;--ic-b:#7E447C;--ic-c:#B17869;
  --t1:#EFC4B6;--t2:#D9C8DF;--t3:#B8D6DF;--t4:#E9D8A8;--t5:#EFC4B6;
  --thread-base:rgba(29,25,30,.10);
  --hero-fg:#1D191E;--hero-muted:#3E373C;--hero-bg:#F2EEEA;
  --hero-scrim:linear-gradient(90deg, rgba(245,241,236,.86) 0%, rgba(245,241,236,.5) 34%, transparent 58%);
  --max:1180px;
  --radius:18px;
  --ease:cubic-bezier(.22,1,.36,1);
  --theme-dur:.6s;
  color-scheme:light;
}
html[data-theme="dark"]{
  /* Óleo e floresta (escuro) */
  --bg:#0A110D;
  --bg-2:#0E1712;
  --surface:#111C16;
  --surface-2:#16241C;
  --ink:#F1EBDD;
  --ink-2:#C9BFA9;
  --ink-3:#A39A86;
  --line:rgba(241,235,221,.12);
  --line-2:rgba(241,235,221,.22);
  --accent:#D8B56E;
  --accent-ink:#0A110D;
  --btn-bg:linear-gradient(180deg,#D9B96F,#B8954F);
  --btn-fg:#14110A;
  --focus:#D8B56E;
  --sheen:linear-gradient(115deg,#C7A35E 0%,#E9D8A8 22%,#3E7A5C 48%,#7A2333 72%,#C7A35E 100%);
  --numfoil:linear-gradient(100deg,#7A2333 0%,#B8954F 26%,#EEDDA8 46%,#D8B56E 58%,#4F8A68 82%,#7A2333 100%);
  --wash:
    radial-gradient(60% 50% at 6% 0%, rgba(42,92,66,.42), transparent 70%),
    radial-gradient(50% 40% at 100% 22%, rgba(122,35,51,.28), transparent 70%),
    radial-gradient(60% 50% at 70% 100%, rgba(199,163,94,.14), transparent 70%);
  --shadow:0 1px 0 rgba(241,235,221,.06) inset, 0 30px 60px -34px rgba(0,0,0,.8);
  --shadow-lift:0 1px 0 rgba(241,235,221,.09) inset, 0 40px 80px -34px rgba(0,0,0,.9);
  --grain-op:.07;
  --ic-a:#D8B56E;--ic-b:#E9D8A8;--ic-c:#A8483F;
  --t1:#C7A35E;--t2:#5E9474;--t3:#E9D8A8;--t4:#9A3444;--t5:#C7A35E;
  --thread-base:rgba(241,235,221,.10);
  --hero-fg:#F1EBDD;--hero-muted:#D6CCB6;--hero-bg:#0A110D;
  --hero-scrim:linear-gradient(90deg, rgba(10,17,13,.86) 0%, rgba(10,17,13,.5) 34%, transparent 58%);
  color-scheme:dark;
}
html[data-mode="vitral"]{
  --hero-fg:#F7F3EF;--hero-muted:rgba(247,243,239,.9);--hero-bg:#140C18;
  --hero-scrim:linear-gradient(90deg, rgba(12,8,16,.9) 0%, rgba(12,8,16,.62) 36%, rgba(12,8,16,.12) 62%);
}
html[data-theme="light"][data-mode="glass"]{--hero-bg:#E9E7E3}
html[data-theme="dark"][data-mode="glass"]{--hero-bg:#101211}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:6rem;-webkit-text-size-adjust:100%}
body{
  margin:0;font-family:var(--text);font-size:1.0625rem;line-height:1.6;
  color:var(--ink);background:var(--bg);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:var(--wash);
}
body::after{
  content:"";position:fixed;inset:0;z-index:100;pointer-events:none;
  background:url("assets/grao.webp");opacity:var(--grain-op);mix-blend-mode:overlay;
}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.08;margin:0;letter-spacing:.005em;text-wrap:balance}
p{margin:0;text-wrap:pretty}
em{font-family:var(--accentface);font-style:italic}
::selection{background:#D9C8DF;color:#1D191E}
html[data-theme="dark"] ::selection{background:#C7A35E;color:#0A110D}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:6px}
.wrap{width:min(100% - 2.5rem, var(--max));margin-inline:auto}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:1rem;top:-4rem;z-index:200;background:var(--btn-bg);color:var(--btn-fg);padding:.7rem 1rem;border-radius:10px;text-decoration:none}
.skip:focus{top:1rem}
.svg-defs{position:absolute;width:0;height:0;overflow:hidden}
.svg-defs .s1{stop-color:var(--ic-a)}.svg-defs .s2{stop-color:var(--ic-b)}.svg-defs .s3{stop-color:var(--ic-c)}
.hidden{display:none!important}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* transição de tema: cores fluem juntas (sem View Transition ou como base dela) */
html.theme-anim body,
html.theme-anim body *:not(canvas){
  transition:background-color var(--theme-dur) var(--ease), color var(--theme-dur) var(--ease),
    border-color var(--theme-dur) var(--ease), fill var(--theme-dur) var(--ease), stroke var(--theme-dur) var(--ease),
    box-shadow var(--theme-dur) var(--ease)!important;
}
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-old(root){z-index:1}
::view-transition-new(root){z-index:2}

/* foil holográfico que segue o ponteiro (trg-holografico) */
[data-foil]{--mx:50%;--my:50%;position:relative;isolation:isolate}
[data-foil]::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;opacity:0;
  background:radial-gradient(420px circle at var(--mx) var(--my), rgba(255,255,255,.55), transparent 42%), var(--sheen);
  background-size:100% 100%, 260% 260%;background-position:0 0, var(--mx) var(--my);
  mix-blend-mode:soft-light;transition:opacity .5s var(--ease);
}
html[data-theme="dark"] [data-foil]::after{
  background:radial-gradient(420px circle at var(--mx) var(--my), rgba(233,216,168,.22), transparent 45%), var(--sheen);
  background-size:100% 100%, 260% 260%;background-position:0 0, var(--mx) var(--my);
  mix-blend-mode:overlay;
}
@media (hover:hover){[data-foil]:hover::after{opacity:.5}}

/* botões */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  min-height:3rem;padding:.8rem 1.35rem;border-radius:12px;text-decoration:none;
  font:600 .97rem/1.1 var(--text);letter-spacing:.01em;border:1px solid transparent;cursor:pointer;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), background-color .3s, color .3s, border-color .3s;
}
.btn-primary{background:var(--btn-bg);color:var(--btn-fg);box-shadow:0 14px 30px -18px rgba(29,25,30,.7);position:relative;overflow:hidden;isolation:isolate}
.btn-primary::before{
  content:"";position:absolute;inset:0;z-index:-1;opacity:0;background:var(--oil);background-size:220% 100%;
  transition:opacity .45s var(--ease), background-position 1.2s var(--ease);
}
html[data-theme="dark"] .btn-primary::before{background:var(--numfoil);background-size:220% 100%}
.btn-primary:hover{transform:translateY(-2px)}
.btn-primary:hover::before{opacity:.9;background-position:100% 0}
html[data-theme="dark"] .btn-primary:hover{color:#14110A}
.btn-ghost{background:transparent;color:inherit;border-color:var(--line-2)}
.btn-ghost:hover{border-color:currentColor;transform:translateY(-2px)}
.link-arrow{display:inline-flex;align-items:center;gap:.4rem;font-weight:600}
.link-arrow svg{width:1.1em;height:1.1em;transition:transform .3s var(--ease)}

/* barra de navegação */
.nav{
  position:sticky;top:.75rem;z-index:50;
  width:min(100% - 1.5rem, calc(var(--max) + 2rem));margin:.75rem auto 0;
  display:flex;align-items:center;gap:1rem;padding:.5rem .6rem .5rem 1.1rem;border-radius:16px;
  background:color-mix(in srgb, var(--surface) 72%, transparent);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);
  box-shadow:0 1px 0 rgba(255,255,255,.5) inset, 0 18px 40px -30px rgba(29,25,30,.5);
}
html[data-theme="dark"] .nav{box-shadow:0 1px 0 rgba(241,235,221,.06) inset, 0 18px 40px -26px rgba(0,0,0,.9)}
.brand{display:inline-flex;align-items:center;padding:.2rem 0}
.brand img{width:56px;height:auto}
.mono-dark{display:none!important}
html[data-theme="dark"] .mono-light{display:none!important}
html[data-theme="dark"] .mono-dark{display:block!important}
.nav-links{display:flex;align-items:center;gap:.2rem;margin-left:auto}
.nav-links a:not(.btn){
  text-decoration:none;font-size:.94rem;font-weight:500;color:var(--ink-2);padding:.5rem .7rem;border-radius:10px;
  transition:color .25s, background-color .25s;
}
.nav-links a:not(.btn):hover{color:var(--ink);background:color-mix(in srgb, var(--ink) 6%, transparent)}
.nav-links a[aria-current="page"]{color:var(--ink)}
.nav-links a[aria-current="page"]::after{content:"";display:block;height:1.5px;margin-top:2px;background:var(--oil)}
.nav-cta{min-height:2.6rem;padding:.6rem 1rem;margin-left:.4rem;font-size:.9rem}
.nav-tools{display:flex;align-items:center;gap:.5rem}
.lang-switch{display:flex;border-radius:10px;padding:2px;background:color-mix(in srgb, var(--ink) 6%, transparent)}
.lang-switch a{font-size:.78rem;font-weight:600;letter-spacing:.04em;text-decoration:none;padding:.32rem .5rem;border-radius:8px;color:var(--ink-3)}
.lang-switch a[aria-current="page"]{background:var(--surface);color:var(--ink);box-shadow:0 2px 6px -3px rgba(0,0,0,.3)}
.theme-toggle{
  --w:60px;--h:32px;--knob:26px;
  position:relative;width:var(--w);height:var(--h);border-radius:999px;border:0;padding:0;cursor:pointer;
  background:linear-gradient(120deg,#F3E6E0,#E8E0EE 50%,#DCE9EE);
  box-shadow:inset 0 1px 2px rgba(0,0,0,.12), inset 0 0 0 1px rgba(29,25,30,.08);
  transition:background .6s var(--ease);
}
html[data-theme="dark"] .theme-toggle{background:linear-gradient(120deg,#16261D,#1D2A20 50%,#2A1A1E);box-shadow:inset 0 1px 2px rgba(0,0,0,.6), inset 0 0 0 1px rgba(216,181,110,.22)}
.theme-icons{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 8px;color:var(--ink-2)}
.theme-icons svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;opacity:.45;transition:opacity .4s}
html[data-theme="light"] .theme-icons .moon,html[data-theme="dark"] .theme-icons .sun{opacity:.75}
.theme-knob{
  position:absolute;top:calc((var(--h) - var(--knob))/2);left:calc((var(--h) - var(--knob))/2);
  width:var(--knob);height:var(--knob);border-radius:50%;
  background:radial-gradient(circle at 32% 30%,#fff 0,#F8F2EE 40%,#E6DCE4 100%);
  box-shadow:0 3px 8px -2px rgba(60,40,50,.45), inset 0 -2px 4px rgba(126,68,124,.15);
  transition:transform .55s var(--ease), background .55s var(--ease);
}
html[data-theme="dark"] .theme-knob{
  transform:translateX(calc(var(--w) - var(--h)));
  background:radial-gradient(circle at 32% 30%,#F4E3B4 0,#D8B56E 45%,#8C6A2E 100%);
  box-shadow:0 3px 10px -2px rgba(0,0,0,.8), 0 0 14px -4px rgba(216,181,110,.6);
}
.nav-toggle{display:none;width:44px;height:44px;border:0;border-radius:12px;background:transparent;cursor:pointer;color:var(--ink);align-items:center;justify-content:center}
.nav-toggle-bar,.nav-toggle-bar::before,.nav-toggle-bar::after{display:block;width:20px;height:1.6px;background:currentColor;border-radius:2px;transition:transform .3s var(--ease), background .3s}
.nav-toggle-bar{position:relative}
.nav-toggle-bar::before,.nav-toggle-bar::after{content:"";position:absolute;left:0}
.nav-toggle-bar::before{top:-6px}.nav-toggle-bar::after{top:6px}
.nav.is-open .nav-toggle-bar{background:transparent}
.nav.is-open .nav-toggle-bar::before{top:0;transform:rotate(45deg)}
.nav.is-open .nav-toggle-bar::after{top:0;transform:rotate(-45deg)}
@media (max-width:980px){
  .nav{flex-wrap:wrap}
  .nav-toggle{display:inline-flex}
  .nav-tools{margin-left:auto}
  .nav-links{display:none;order:3;width:100%;flex-direction:column;align-items:stretch;gap:0;padding:.4rem 0 .5rem;margin:0}
  .nav-links a:not(.btn){font-size:1.05rem;padding:.8rem .5rem;border-radius:10px}
  .nav-cta{margin:.5rem 0 0}
  .nav.is-open .nav-links{display:flex}
}

/* HERO com o material WebGL */
.hero{
  position:relative;min-height:max(100svh, 640px);margin-top:-4.4rem;
  display:flex;flex-direction:column;justify-content:flex-end;
  color:var(--hero-fg);background:var(--hero-bg);overflow:hidden;isolation:isolate;
}
.hero-stage,.hero-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero-stage canvas{z-index:0}
.hero-fallback{position:absolute;inset:0;z-index:1;transition:opacity .5s ease;background:var(--hero-bg)}
.hero-stage.is-live .hero-fallback{opacity:0;pointer-events:none}
.hero-fallback picture{position:absolute;left:43.5%;width:51%;top:36%;transform:translateY(-50%)}
.hero-fallback img{width:100%;height:auto;filter:drop-shadow(0 22px 30px rgba(40,30,40,.22))}
@media (max-width:859px){
  .hero-fallback picture{left:50%;width:min(89vw, 54.4svh);top:calc(96px + min(24.5vw, 15svh));transform:translate(-50%,-50%)}
}
/* fundos de reserva (antes do WebGL, sem WebGL ou com movimento reduzido) */
html[data-mode="pearl"] .hero-fallback{
  background:
    repeating-radial-gradient(ellipse 120% 80% at 70% 30%, rgba(255,255,255,0) 0 14px, rgba(255,255,255,.32) 15px 16px, rgba(255,255,255,0) 17px 30px),
    radial-gradient(42% 46% at 18% 22%, rgba(239,196,182,.78), transparent 70%),
    radial-gradient(40% 44% at 52% 12%, rgba(233,216,168,.62), transparent 70%),
    radial-gradient(44% 48% at 84% 34%, rgba(184,214,223,.78), transparent 70%),
    radial-gradient(52% 50% at 60% 82%, rgba(217,200,223,.82), transparent 72%),
    #F3EFEC;
}
html[data-theme="dark"][data-mode="pearl"] .hero-fallback{
  background:
    repeating-radial-gradient(ellipse 120% 80% at 70% 30%, rgba(233,216,168,0) 0 14px, rgba(233,216,168,.05) 15px 16px, rgba(233,216,168,0) 17px 30px),
    radial-gradient(40% 44% at 20% 26%, rgba(30,82,60,.55), transparent 70%),
    radial-gradient(36% 40% at 82% 30%, rgba(140,106,46,.38), transparent 70%),
    radial-gradient(44% 46% at 56% 84%, rgba(110,30,44,.42), transparent 72%),
    #080D0B;
}
html[data-mode="glass"] .hero-fallback{
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.0) 0 2px, rgba(255,255,255,.34) 3px 5px, rgba(255,255,255,.08) 6px 30px, rgba(0,0,0,.10) 31px 34px, rgba(0,0,0,0) 35px 36px),
    radial-gradient(28% 50% at 30% 46%, rgba(70,72,74,.55), transparent 72%),
    radial-gradient(24% 30% at 76% 30%, rgba(255,244,226,.9), transparent 70%),
    linear-gradient(180deg,#F4F3F0,#D6D4D0);
}
html[data-theme="dark"][data-mode="glass"] .hero-fallback{
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,0) 0 2px, rgba(255,255,255,.07) 3px 5px, rgba(255,255,255,.015) 6px 30px, rgba(0,0,0,.4) 31px 34px, rgba(0,0,0,0) 35px 36px),
    radial-gradient(24% 30% at 74% 32%, rgba(216,170,90,.38), transparent 70%),
    radial-gradient(26% 24% at 56% 86%, rgba(110,20,32,.4), transparent 70%),
    linear-gradient(180deg,#1A1C1A,#0B0D0C);
}
html[data-mode="vitral"] .hero-fallback{
  background:
    radial-gradient(36% 40% at 22% 30%, rgba(38,68,121,.8), transparent 70%),
    radial-gradient(30% 36% at 78% 26%, rgba(126,68,124,.75), transparent 70%),
    radial-gradient(26% 30% at 60% 70%, rgba(199,163,94,.45), transparent 70%),
    radial-gradient(30% 34% at 36% 74%, rgba(52,46,96,.85), transparent 70%),
    #140C18;
}
.hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:var(--hero-scrim)}
.hero-copy{position:relative;z-index:2;padding:0 0 clamp(2.5rem, 7vh, 4.5rem);display:flex;flex-direction:column;align-items:flex-start;gap:1rem}
.hero-copy > *{max-width:min(36rem, 46vw)}
.hero-brand{font-weight:600;font-size:.98rem;letter-spacing:.01em}
.hero-brand em{font-weight:400;color:var(--hero-muted)}
.hero h1{font-size:clamp(2.2rem, 3.6vw, 3.35rem);line-height:1.05;max-width:16ch;color:var(--hero-fg);text-wrap:pretty}
.hero .lead{font-size:1.1rem;line-height:1.55;color:var(--hero-muted);max-width:36ch}
.actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:.3rem}
html[data-mode="vitral"] .hero .btn-ghost,html[data-theme="dark"] .hero .btn-ghost{border-color:rgba(247,243,239,.4)}
html[data-mode="vitral"] .hero .btn-primary{background:#F7F3EF;color:#1D191E}
.mode-dock{
  position:absolute;z-index:3;right:max(1.25rem, calc((100% - var(--max))/2));bottom:clamp(2.5rem, 7vh, 4.5rem);
  display:flex;align-items:center;gap:.7rem;
}
.mode-label{font-family:var(--accentface);font-style:italic;font-size:.92rem;color:var(--hero-muted)}
.mode-switch{
  display:flex;gap:2px;padding:4px;border-radius:14px;
  background:color-mix(in srgb, var(--hero-bg) 55%, transparent);
  -webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);
  box-shadow:0 1px 0 rgba(255,255,255,.35) inset, 0 12px 30px -20px rgba(0,0,0,.6);
}
.mode-switch button{
  font:600 .86rem/1 var(--text);color:var(--hero-muted);background:transparent;border:0;border-radius:10px;
  padding:.62rem .9rem;min-height:2.5rem;cursor:pointer;transition:background-color .35s, color .35s;
}
.mode-switch button:hover{color:var(--hero-fg)}
.mode-switch button[aria-checked="true"]{color:#1D191E;background:linear-gradient(120deg,#F8EDE8,#EFE6F2 50%,#E4EEF2);box-shadow:0 4px 12px -6px rgba(0,0,0,.5)}
html[data-theme="dark"] .mode-switch button[aria-checked="true"]{background:linear-gradient(180deg,#E2C47E,#B8954F);color:#14110A}
@media (max-width:859px){
  .hero{justify-content:flex-end}
  .hero-copy{padding-bottom:6.5rem}
  .hero-copy > *{max-width:100%}
  .hero h1{font-size:clamp(2.1rem, 9vw, 2.8rem)}
  .hero::after{background:linear-gradient(0deg, color-mix(in srgb, var(--hero-bg) 92%, transparent) 0%, color-mix(in srgb, var(--hero-bg) 60%, transparent) 48%, transparent 66%)}
  .mode-dock{left:1.25rem;right:auto;bottom:1.6rem}
}

/* blocos gerais */
main > section{margin-block:clamp(5rem, 11vw, 9rem)}
main > .hero{margin-top:-4.4rem;margin-bottom:0}
.sec-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:1rem 3rem;align-items:end;margin-bottom:2.5rem}
.sec-head h2{font-size:clamp(2rem, 4vw, 3.1rem)}
.sec-head p{color:var(--ink-2);max-width:42ch;font-size:1.05rem}
@media (max-width:760px){.sec-head{grid-template-columns:1fr}}

/* O que fazemos: texto conduz à esquerda, lista à direita */
.services{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);gap:2.5rem clamp(2rem, 7vw, 7rem);align-items:start}
.services-intro{position:sticky;top:7rem}
.services-intro h2{font-size:clamp(2.3rem, 5vw, 4rem);margin-bottom:1.4rem}
.services-lead{font-family:var(--display);font-size:clamp(1.35rem, 2.1vw, 1.7rem);line-height:1.28;margin-bottom:1rem;max-width:22ch}
.services-intro p:not(.services-lead){color:var(--ink-2);max-width:38ch}
.services-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.services-list li{
  display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);gap:.4rem 2rem;align-items:baseline;
  padding:1.45rem .25rem;border-bottom:1px solid var(--line);position:relative;
}
.services-list li::before{
  content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--oil);transition:width .7s var(--ease);
}
html[data-theme="dark"] .services-list li::before{background:var(--numfoil)}
.services-list li:hover::before{width:100%}
.services-list h3{font-size:1.45rem}
.services-list p{color:var(--ink-2)}
@media (max-width:860px){
  .services{grid-template-columns:1fr}
  .services-intro{position:static}
  .services-list li{grid-template-columns:1fr}
}

/* Canais: fio holográfico */
.thread{position:relative;padding-block:clamp(4.5rem, 9vw, 7.5rem);background:var(--bg-2);overflow:hidden;isolation:isolate}
.thread::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(40% 60% at 12% 30%, rgba(239,196,182,.35), transparent 70%), radial-gradient(40% 60% at 92% 80%, rgba(184,214,223,.32), transparent 70%);
}
html[data-theme="dark"] .thread{background:#070C09}
html[data-theme="dark"] .thread::before{background:radial-gradient(40% 60% at 12% 30%, rgba(42,92,66,.32), transparent 70%), radial-gradient(40% 60% at 92% 80%, rgba(122,35,51,.24), transparent 70%)}
.thread-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:1rem 3rem;align-items:end;margin-bottom:clamp(2rem, 5vw, 3.5rem)}
.thread-head h2{font-size:clamp(2.2rem, 4.6vw, 3.8rem);max-width:14ch}
.thread-head p{color:var(--ink-2);max-width:40ch}
.thread-stage{position:relative;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,4fr);gap:0 1.5rem;align-items:start}
.thread-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.thread-svg path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.thread-svg .thread-base{stroke:var(--thread-base);stroke-width:1.2}
.thread-svg .thread-line{stroke:url(#thread-grad);stroke-width:2.4;filter:drop-shadow(0 0 6px rgba(217,200,223,.7))}
html[data-theme="dark"] .thread-svg .thread-line{filter:drop-shadow(0 0 7px rgba(199,163,94,.45))}
.thread-svg .thread-pulse{stroke:#fff;stroke-width:3.4;opacity:.95;filter:drop-shadow(0 0 8px rgba(255,255,255,.95))}
html[data-theme="dark"] .thread-svg .thread-pulse{stroke:#F4E3B4;filter:drop-shadow(0 0 9px rgba(233,200,120,.9))}
.thread-svg #thread-grad .t1{stop-color:var(--t1)}.thread-svg #thread-grad .t2{stop-color:var(--t2)}.thread-svg #thread-grad .t3{stop-color:var(--t3)}.thread-svg #thread-grad .t4{stop-color:var(--t4)}.thread-svg #thread-grad .t5{stop-color:var(--t5)}
html[data-theme="light"] .thread-svg .thread-line{stroke:url(#thread-grad)}
.thread-origin{position:relative;z-index:1;margin-top:10px}
.thread-origin img{width:100%;height:auto;filter:drop-shadow(0 20px 26px rgba(40,30,40,.18))}
.stations{list-style:none;margin:0;padding:0 0 1rem;position:relative;z-index:1;display:grid;grid-template-columns:repeat(5, minmax(0,1fr));gap:1.25rem}
.station{padding:1.1rem 1rem 1.2rem;border-radius:16px;transition:transform .5s var(--ease)}
/* o fio corre numa faixa acima dos textos: os nós ondulam, os textos ficam abaixo, em degraus leves */
.station{--ny:0px;--ty:0px}
.station:nth-child(1){--ny:70px;--ty:0px}
.station:nth-child(2){--ny:0px;--ty:28px}
.station:nth-child(3){--ny:86px;--ty:56px}
.station:nth-child(4){--ny:18px;--ty:14px}
.station:nth-child(5){--ny:60px;--ty:42px}
@media (min-width:1081px){
  .station{padding-top:0}
  .station .station-node{margin-top:var(--ny);margin-bottom:calc(150px - 52px - var(--ny) + var(--ty))}
}
.station-node{
  display:grid;place-items:center;width:52px;height:52px;border-radius:50%;margin-bottom:1rem;
  background:var(--surface);box-shadow:0 10px 24px -14px rgba(40,30,40,.55), inset 0 0 0 1px var(--line);
  transition:box-shadow .6s var(--ease), background .6s var(--ease), transform .6s var(--ease);
}
.station-node .ci{width:24px;height:24px;display:block}
.station-node svg{width:100%;height:100%}
.station.is-on .station-node{
  transform:scale(1.06);
  background:radial-gradient(circle at 35% 30%, #fff, var(--surface) 55%);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--surface) 70%, transparent), 0 0 0 4.5px rgba(217,200,223,.9), 0 14px 30px -12px rgba(126,68,124,.55);
}
html[data-theme="dark"] .station.is-on .station-node{
  background:radial-gradient(circle at 35% 30%, #22342A, var(--surface) 60%);
  box-shadow:0 0 0 3px #070C09, 0 0 0 4.5px rgba(216,181,110,.85), 0 0 26px -6px rgba(216,181,110,.6);
}
.station h3{font-size:1.65rem;margin-bottom:.35rem}
.station p{color:var(--ink-2);font-size:.96rem;line-height:1.5;margin-bottom:.7rem}
.station-link{display:inline-flex;align-items:center;gap:.25rem;font-weight:600;font-size:.93rem;text-decoration:none;color:var(--accent)}
.station-link svg{width:1em;height:1em;transition:transform .3s var(--ease)}
a.station-link:hover{text-decoration:underline;text-underline-offset:3px}
a.station-link:hover svg{transform:translate(2px,-2px)}
.station-link.is-static{color:var(--ink-3);font-weight:500}
@media (max-width:1080px){
  .thread-head{grid-template-columns:1fr}
  .thread-stage{display:block}
  .thread-origin{width:min(56%, 260px);margin:0 0 1.5rem 0}
  .stations{grid-template-columns:1fr;gap:.5rem;padding-top:0;padding-left:72px}
  .station{margin-top:0!important;padding:.9rem 0 1.4rem}
  .station-node{position:absolute;left:-72px;margin:0;width:48px;height:48px}
  .station{position:relative}
}

/* Degraus: escada */
.steps-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem 3rem;align-items:end;margin-bottom:3rem}
.steps-intro h2{font-size:clamp(2.4rem, 5.4vw, 4.4rem)}
.steps-intro p{color:var(--ink-2);max-width:44ch}
.stairs{display:flex;flex-direction:column;gap:14px}
.step{
  --indent:0%;
  display:grid;grid-template-columns:clamp(4.5rem, 9vw, 7.5rem) minmax(0,1.1fr) minmax(0,1fr) auto;gap:1rem 2rem;align-items:center;
  margin-left:var(--indent);padding:1.5rem 1.75rem 1.5rem 1.25rem;border-radius:var(--radius);
  background:var(--surface);box-shadow:var(--shadow);
  transition:transform .5s var(--ease), box-shadow .5s var(--ease);
}
.step-1{--indent:5%}.step-2{--indent:10%}.step-3{--indent:15%}
.step:hover{transform:translateY(-3px);box-shadow:var(--shadow-lift)}
.step-foil{display:none}
.step-num{
  font-family:var(--display);font-size:clamp(4rem, 8vw, 6.4rem);line-height:.85;text-align:center;
  background:var(--numfoil);background-size:180% 100%;background-position:var(--mx) 50%;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  transition:background-position 1.2s var(--ease);
}
.step-head h3{font-size:clamp(1.55rem, 2.4vw, 2rem);line-height:1.12;margin-bottom:.45rem}
.step-sub{font-size:.62em;color:var(--ink-3);white-space:nowrap}
.step-who{color:var(--ink-2);font-size:.98rem;max-width:34ch}
.step-list{list-style:none;margin:0;padding:0;display:grid;gap:.35rem;font-size:.96rem}
.step-list li{padding-left:1.1rem;position:relative}
.step-list li::before{content:"";position:absolute;left:0;top:.68em;width:.45rem;height:1px;background:var(--ink-3)}
.step-cta{
  display:inline-flex;align-items:center;gap:.45rem;text-decoration:none;font-weight:600;font-size:.92rem;
  padding:.7rem .95rem;border-radius:12px;border:1px solid var(--line-2);white-space:nowrap;
  transition:border-color .3s, background-color .3s, color .3s;
}
.step-cta svg{width:1.05em;height:1.05em;transition:transform .3s var(--ease)}
.step-cta:hover{border-color:currentColor}
.step-cta:hover svg{transform:translateX(3px)}
.note{margin-top:1.75rem;color:var(--ink-3);font-size:.92rem;max-width:70ch;margin-left:15%}
@media (max-width:1080px){
  .step{grid-template-columns:clamp(4rem, 9vw, 6rem) minmax(0,1fr) minmax(0,1fr)}
  .step-cta{grid-column:2 / -1;justify-self:start}
}
@media (max-width:760px){
  .steps-intro{grid-template-columns:1fr}
  .step{grid-template-columns:4.2rem minmax(0,1fr);--indent:0%!important;padding:1.3rem 1.2rem 1.4rem .8rem}
  .step-list,.step-cta{grid-column:2}
  .step-num{font-size:4rem}
  .note{margin-left:0}
}

/* Portfólio na home */
.teaser-card{
  display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:center;gap:0;text-decoration:none;
  border-radius:24px;overflow:hidden;background:var(--surface);box-shadow:var(--shadow);
  transition:transform .5s var(--ease), box-shadow .5s var(--ease);
}
.teaser-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift)}
.teaser-card:hover .link-arrow svg{transform:translateX(4px)}
.teaser-card img{width:100%;height:100%;object-fit:cover;aspect-ratio:3/2}
.teaser-copy{display:flex;flex-direction:column;gap:.8rem;padding:clamp(1.5rem, 4vw, 3.2rem)}
.teaser-kicker{font-family:var(--accentface);font-style:italic;color:var(--ink-3)}
.teaser-title{font-family:var(--display);font-size:clamp(1.8rem, 3.2vw, 2.6rem);line-height:1.1}
.teaser-text{color:var(--ink-2)}
@media (max-width:760px){.teaser-card{grid-template-columns:1fr}}

/* faixa de contato */
.contact-band{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2rem clamp(2rem, 6vw, 5rem);align-items:start;
  padding:clamp(1.75rem, 5vw, 3.5rem);border-radius:28px;background:var(--surface);box-shadow:var(--shadow);
  position:relative;overflow:hidden;isolation:isolate;
}
.contact-band::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.5;background:radial-gradient(60% 80% at 0% 0%, rgba(239,196,182,.5), transparent 70%), radial-gradient(50% 70% at 100% 100%, rgba(184,214,223,.45), transparent 70%)}
html[data-theme="dark"] .contact-band::before{background:radial-gradient(60% 80% at 0% 0%, rgba(42,92,66,.5), transparent 70%), radial-gradient(50% 70% at 100% 100%, rgba(122,35,51,.35), transparent 70%)}
.contact-band-head h2{font-size:clamp(2.2rem, 4.6vw, 3.6rem);margin-bottom:1rem}
.contact-band-head p{color:var(--ink-2);max-width:36ch;margin-bottom:1.6rem}
.contact-band-actions{display:flex;flex-wrap:wrap;gap:.7rem}
.contact-list,.foot-contact{list-style:none;margin:0;padding:0;display:grid;gap:.2rem}
.contact-list .row,.foot-contact .row{
  display:grid;grid-template-columns:40px minmax(0,1fr);gap:.9rem;align-items:center;padding:.65rem .5rem;border-radius:12px;text-decoration:none;
  transition:background-color .3s;
}
.contact-list a.row:hover,.foot-contact a.row:hover{background:color-mix(in srgb, var(--ink) 5%, transparent)}
.ci{display:block;width:26px;height:26px}
.ci svg{width:100%;height:100%;display:block}
.row .ci{width:40px;height:40px;padding:8px;border-radius:12px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line)}
.cv{display:flex;flex-direction:column;line-height:1.3;font-weight:500;overflow-wrap:anywhere}
.cv small{font-size:.8rem;font-weight:500;color:var(--ink-3)}
@media (max-width:860px){.contact-band{grid-template-columns:1fr}}

/* rodapé */
.foot{margin-top:clamp(5rem, 10vw, 8rem);padding:3.5rem 0 2rem;background:var(--bg-2);position:relative}
html[data-theme="dark"] .foot{background:#070C09}
.foot::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--oil);opacity:.6}
html[data-theme="dark"] .foot::before{background:var(--numfoil)}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.2fr) minmax(0,.8fr);gap:2.5rem}
.foot-brand img{width:96px;height:auto;margin-bottom:1rem}
.foot-brand p{display:flex;flex-direction:column;gap:.15rem}
.foot-name{font-family:var(--display);font-size:1.5rem}
.foot-brand em{color:var(--ink-2)}
.foot-where{color:var(--ink-3);font-size:.92rem;margin-top:.6rem!important}
.foot-h{font-family:var(--accentface);font-style:italic;font-size:1rem;color:var(--ink-3);margin-bottom:.9rem}
.foot-links{list-style:none;margin:0;padding:0;display:grid;gap:.15rem}
.foot-links a{text-decoration:none;color:var(--ink-2);padding:.3rem 0;display:inline-block}
.foot-links a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.foot-contact .row{padding:.45rem .4rem}
.foot-contact .row .ci{width:34px;height:34px;padding:7px}
.foot-contact .row{grid-template-columns:34px minmax(0,1fr)}
.foot-legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem 2rem;margin-top:3rem;padding-top:1.4rem;border-top:1px solid var(--line);font-size:.85rem;color:var(--ink-3)}
@media (max-width:860px){.foot-grid{grid-template-columns:1fr}}

/* páginas internas */
.page-hero{position:relative;padding:clamp(4rem, 10vw, 7.5rem) 0 clamp(1rem, 3vw, 2rem);margin-top:0!important;overflow:hidden}
.page-hero-sheen{position:absolute;right:-10%;top:-30%;width:70%;height:140%;z-index:-1;pointer-events:none;
  background:radial-gradient(closest-side, rgba(217,200,223,.55), transparent), radial-gradient(40% 40% at 30% 70%, rgba(239,196,182,.45), transparent 70%);filter:blur(10px)}
html[data-theme="dark"] .page-hero-sheen{background:radial-gradient(closest-side, rgba(42,92,66,.4), transparent), radial-gradient(40% 40% at 30% 70%, rgba(122,35,51,.3), transparent 70%)}
.page-hero-in{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:1.5rem 3rem;align-items:end}
.page-hero h1{font-size:clamp(2.8rem, 7.4vw, 6rem);line-height:.98}
.page-hero .lead{font-size:1.15rem;color:var(--ink-2);max-width:38ch}
@media (max-width:760px){.page-hero-in{grid-template-columns:1fr}}

.case-feature{display:grid;gap:2rem}
.case-hero{margin:0;border-radius:26px;overflow:hidden;box-shadow:var(--shadow-lift)}
.case-hero img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.case-body{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:2rem 4rem}
.case-copy h2{font-size:clamp(2rem, 4vw, 3rem);margin-bottom:1rem}
.case-copy h2 em{font-size:.55em;color:var(--ink-3)}
.case-copy p{color:var(--ink-2);max-width:52ch}
.case-meta{margin:0;display:grid;gap:0;border-top:1px solid var(--line)}
.case-meta div{display:grid;grid-template-columns:7rem minmax(0,1fr);gap:1rem;padding:.8rem 0;border-bottom:1px solid var(--line)}
.case-meta dt{color:var(--ink-3);font-size:.9rem}
.case-meta dd{margin:0}
.gallery{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:1.25rem}
.shot{margin:0}
.shot img{width:100%;height:auto;border-radius:18px;box-shadow:var(--shadow)}
.shot.tall{grid-row:span 2}
.shot.tall img{height:calc(100% - 2.2rem);object-fit:cover}
.shot.wide{grid-column:1 / -1}
.shot figcaption{font-family:var(--accentface);font-style:italic;font-size:.92rem;color:var(--ink-3);padding:.6rem .2rem 0}
.system{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:1.25rem}
.system-card{padding:1.6rem;border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow)}
.system-card:nth-child(2){margin-top:2.5rem}
.system-card:nth-child(3){margin-top:5rem}
.system-card h3{font-size:1.6rem;margin-bottom:1rem}
.swatches{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.swatches li{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:.8rem;align-items:center;font-size:.95rem}
.sw{width:30px;height:30px;border-radius:9px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.swatches code{font-size:.8rem;color:var(--ink-3)}
.spec-didot{font-family:var(--display);font-size:2.4rem;line-height:1.1}
.spec-grot{font-size:1.15rem}
.spec-label{font-size:.85rem;color:var(--ink-3);margin:.2rem 0 1.2rem}
@media (max-width:860px){
  .case-body,.gallery,.system{grid-template-columns:1fr}
  .system-card:nth-child(n){margin-top:0}
  .shot.tall{grid-row:auto}
  .shot.tall img{height:auto}
}
.cta-card{
  padding:clamp(2rem, 6vw, 4rem);border-radius:28px;background:var(--surface);box-shadow:var(--shadow);overflow:hidden;
  display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:1rem 3rem;align-items:end;
}
.cta-card h2{font-size:clamp(2rem, 4.4vw, 3.4rem);grid-row:span 2;align-self:center}
.cta-card p{color:var(--ink-2);max-width:40ch}
@media (max-width:760px){.cta-card{grid-template-columns:1fr}.cta-card h2{grid-row:auto}}

/* Sobre */
.about-intro{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:2.5rem clamp(2rem, 7vw, 6rem);align-items:start}
.about-lead{font-family:var(--display);font-size:clamp(1.8rem, 3.4vw, 2.7rem);line-height:1.15;margin-bottom:1.4rem!important}
.about-copy p:not(.about-lead){color:var(--ink-2);max-width:54ch;margin-bottom:1rem}
.founder-card{padding:2rem;border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);margin-top:3rem}
.founder-card img{width:96px;height:auto;margin-bottom:1.4rem}
.founder-card h2{font-size:1.75rem}
.founder-role{font-family:var(--accentface);font-style:italic;color:var(--ink-3);margin:.2rem 0 .9rem!important}
.founder-card p:last-child{color:var(--ink-2)}
.phases{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:0;position:relative}
.phases::before{content:"";position:absolute;left:0;right:0;top:2.1rem;height:2px;background:var(--oil);opacity:.75;border-radius:2px}
html[data-theme="dark"] .phases::before{background:var(--numfoil)}
.phase{padding:0 2rem 0 0}
.phase h3{
  font-size:clamp(2.4rem, 4.4vw, 3.4rem);display:inline-block;padding-right:1rem;background:var(--bg);position:relative;
  margin-bottom:1rem;
}
.phase > p{font-family:var(--accentface);font-style:italic;color:var(--ink-2);margin-bottom:1rem}
.phase ul{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.phase ul li{padding-left:1.1rem;position:relative;color:var(--ink)}
.phase ul li::before{content:"";position:absolute;left:0;top:.68em;width:.45rem;height:1px;background:var(--ink-3)}
.phase:nth-child(2){padding-top:2.2rem}
.phase:nth-child(3){padding-top:4.4rem}
@media (max-width:860px){
  .about-intro,.phases{grid-template-columns:1fr}
  .founder-card{margin-top:0}
  .phases::before{left:.2rem;right:auto;top:0;bottom:0;width:2px;height:auto}
  .phase{padding:0 0 2rem 1.6rem!important}
  .phase h3{background:none;padding:0}
}
.rules-sec{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:2rem 4rem}
.rules-sec h2{font-size:clamp(2.2rem, 4.6vw, 3.6rem)}
.rules{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:0 3rem}
.rules li{padding:1.4rem 0;border-top:1px solid var(--line)}
.rules li:nth-child(even){transform:translateY(2.2rem)}
.rules h3{font-size:1.5rem;margin-bottom:.4rem}
.rules p{color:var(--ink-2)}
@media (max-width:860px){.rules-sec,.rules{grid-template-columns:1fr}.rules li:nth-child(even){transform:none}}

/* Contato */
.contact-page{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:1.25rem 2.5rem;align-items:start}
.contact-main{
  padding:clamp(1.75rem, 4vw, 2.75rem);border-radius:26px;color:#F7F3EF;overflow:hidden;
  background:radial-gradient(70% 80% at 0% 0%, rgba(177,120,105,.55), transparent 70%), radial-gradient(60% 70% at 100% 100%, rgba(45,128,152,.5), transparent 70%), #1D191E;
  box-shadow:var(--shadow-lift);
}
html[data-theme="dark"] .contact-main{background:radial-gradient(70% 80% at 0% 0%, #1F4A35, transparent 70%), radial-gradient(60% 70% at 100% 100%, #5B1A26, transparent 70%), #0E1712;box-shadow:var(--shadow-lift)}
.contact-main .ci{width:44px;height:44px;margin-bottom:2.2rem}
.contact-main .ci svg *{stroke:#F4E3D8}
.contact-main h2{font-size:clamp(2.4rem, 4.6vw, 3.4rem)}
.contact-value{font-size:1.3rem;font-weight:600;margin:.5rem 0 .3rem!important}
.contact-note{color:rgba(247,243,239,.86);margin-bottom:1.6rem!important;max-width:30ch}
.contact-main .btn-primary{background:#F7F3EF;color:#1D191E}
.contact-others{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1px solid var(--line)}
.contact-row{
  display:grid;grid-template-columns:44px minmax(0,8rem) minmax(0,1fr);grid-template-rows:auto auto;gap:.1rem 1.1rem;align-items:center;
  padding:1.2rem .8rem;border-bottom:1px solid var(--line);text-decoration:none;border-radius:0;transition:background-color .3s;
}
a.contact-row:hover{background:color-mix(in srgb, var(--ink) 4%, transparent)}
.contact-row .ci{grid-row:span 2;width:44px;height:44px;padding:9px;border-radius:13px;background:var(--surface);box-shadow:var(--shadow)}
.contact-row-name{font-family:var(--display);font-size:1.5rem;grid-row:span 2}
.contact-row-value{font-weight:600;overflow-wrap:anywhere}
.contact-row-note{color:var(--ink-3);font-size:.92rem;grid-column:3}
@media (max-width:860px){
  .contact-page{grid-template-columns:1fr}
  .contact-row{grid-template-columns:44px minmax(0,1fr)}
  .contact-row-name{grid-row:auto;font-size:1.35rem}
  .contact-row-value,.contact-row-note{grid-column:2}
  .contact-row .ci{grid-row:span 3}
}
.form-card{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr);gap:2rem clamp(2rem, 5vw, 4.5rem);padding:clamp(1.75rem, 5vw, 3.25rem);border-radius:28px;background:var(--surface);box-shadow:var(--shadow)}
.form-head h2{font-size:clamp(2rem, 4vw, 3rem);margin-bottom:1rem}
.form-head p{color:var(--ink-2);margin-bottom:1rem}
.form-next{font-family:var(--accentface);font-style:italic;font-size:.95rem;color:var(--ink-3)!important}
.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.field{display:flex;flex-direction:column;gap:.4rem}
.field-full{grid-column:1 / -1}
.field label{font-weight:600;font-size:.92rem}
.opt{font-weight:400;color:var(--ink-3)}
.field input,.field textarea{
  font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line-2);border-radius:12px;padding:.8rem .9rem;min-height:3rem;
  transition:border-color .3s, box-shadow .3s;
}
.field textarea{resize:vertical;min-height:8rem}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent)}
.form-actions{display:flex;flex-wrap:wrap;gap:.7rem;align-items:center}
.form-alt{color:var(--ink-2);font-size:.95rem}
.linkish{font:inherit;color:var(--accent);background:none;border:0;padding:0;text-decoration:underline;cursor:pointer}
.form-status{min-height:1.5em;color:var(--ink-2);font-size:.95rem}
.form-status.is-error{color:#A3283C}
html[data-theme="dark"] .form-status.is-error{color:#F0A0A8}
.ts-slot{min-height:65px}
@media (max-width:860px){.form-card,.contact-form{grid-template-columns:1fr}}
.faq{display:grid;border-top:1px solid var(--line);max-width:860px;margin-left:auto}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.3rem .2rem;font-family:var(--display);font-size:clamp(1.25rem, 2vw, 1.55rem)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:12px;height:12px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translate(-3px,-3px);transition:transform .35s var(--ease)}
.faq details[open] summary::after{transform:rotate(225deg)}
.faq details p{padding:0 .2rem 1.4rem;color:var(--ink-2);max-width:66ch}
.company{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:1.5rem 3rem}
.company h2{font-size:clamp(1.8rem, 3.4vw, 2.6rem)}
.company dl{margin:0;display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:0 2rem}
.company dl div{padding:.85rem 0;border-top:1px solid var(--line)}
.company dt{font-size:.85rem;color:var(--ink-3)}
.company dd{margin:0;overflow-wrap:anywhere}
.company a{text-underline-offset:3px}
@media (max-width:760px){.company,.company dl{grid-template-columns:1fr}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}
  .step:hover,.teaser-card:hover,.btn:hover{transform:none}
}

/* revelação do tema: círculo com borda suave a partir do botão */
@property --vr{syntax:"<length>";inherits:true;initial-value:0px}
html.vt-theme::view-transition-new(root){
  -webkit-mask-image:radial-gradient(circle at var(--vx, 90%) var(--vy, 30px), #000 calc(var(--vr) - 160px), transparent var(--vr));
  mask-image:radial-gradient(circle at var(--vx, 90%) var(--vy, 30px), #000 calc(var(--vr) - 160px), transparent var(--vr));
}
