/* ==========================================================================
   Agência Maktub — sistema visual
   Base escura, bronze metálico, tipografia didone + geométrica.
   ========================================================================== */

:root{
  color-scheme: dark;

  /* Fundos — near-black com viés quente, em camadas */
  --obsidian:#0A0807;
  --umber:#120E0B;
  --ember:#1C1511;
  --ash:#272019;

  /* Bronze metálico (gradiente real, como na logo) */
  --bronze-deep:#7A4A28;
  --bronze:#C08043;
  --bronze-lit:#E9BE8B;
  --starlight:#F7E9D3;

  /* Texto */
  --parchment:#EDE1D1;
  --dust:#A3907C;
  --dust-dim:#8F7E6D; /* clareado de #77695B: o original ficava abaixo de 4.5:1 (WCAG AA) em todo lugar em que era usado — legendas, disclaimer da calculadora */

  /* Traços */
  --edge:rgba(233,190,139,.14);
  --edge-strong:rgba(233,190,139,.28);

  --metal:linear-gradient(135deg,var(--bronze-lit) 0%,var(--bronze) 45%,var(--bronze-deep) 100%);

  /* Tipografia */
  --display:'Playfair Display',"Didot","Bodoni MT",Georgia,serif;
  --sans:'Jost',"Futura","Century Gothic",system-ui,sans-serif;

  --fs-xl:clamp(2.35rem,5.1vw,4.2rem);
  --fs-lg:clamp(1.9rem,3.3vw,2.95rem);
  --fs-md:clamp(1.55rem,2.5vw,2.2rem);
  --fs-sm:clamp(1.15rem,1.6vw,1.4rem);
  --fs-body:1.0625rem;
  --fs-micro:.75rem;

  /* Ritmo */
  --gutter:clamp(20px,5vw,56px);
  --shell:1280px;
  --section-y:clamp(88px,11vw,164px);

  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{box-sizing:border-box;}

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}

body{
  margin:0;
  background:var(--obsidian);
  color:var(--parchment);
  font-family:var(--sans);
  font-size:var(--fs-body);
  line-height:1.65;
  font-weight:400; /* 300 ficava fino demais sobre o fundo escuro */
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{display:block;max-width:100%;height:auto;}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;}
input,textarea,select{font:inherit;color:inherit;}
a{color:inherit;text-decoration:none;}

:focus-visible{
  outline:2px solid var(--bronze-lit);
  outline-offset:3px;
  border-radius:2px;
}

::selection{background:var(--bronze-deep);color:var(--starlight);}

/* ---------- Tipografia base ---------- */
h1,h2,h3,h4{
  font-family:var(--display);
  font-weight:500;
  line-height:1.1;
  letter-spacing:-.015em;
  text-wrap:balance;
  margin:0;
}
h1{font-size:var(--fs-xl);}
h2{font-size:var(--fs-lg);}
h3{font-size:var(--fs-sm);line-height:1.25;}
/* Itálico da Playfair já é encorpado; em 500 ele fica pesado demais */
h1 .italic,h2 .italic{font-weight:400;}
p{margin:0;}

.eyebrow{
  font-family:var(--sans);
  font-size:var(--fs-micro);
  font-weight:500;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--bronze-lit);
  display:inline-flex;
  align-items:center;
  gap:12px;
}
.eyebrow::before{
  content:"";
  width:22px;height:1px;
  background:var(--bronze);
  flex:none;
}
.eyebrow--plain::before{display:none;}

.lead{
  font-size:clamp(1.0625rem,1.35vw,1.2rem);
  color:var(--dust);
  line-height:1.7;
  max-width:54ch;
}

.gold{
  background:var(--metal);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.italic{font-style:italic;}

/* ---------- Layout ---------- */
.shell{
  width:100%;
  max-width:var(--shell);
  margin-inline:auto;
  padding-inline:var(--gutter);
}
.section{padding-block:var(--section-y);position:relative;}
.section--tight{padding-block:clamp(56px,7vw,96px);}

.section-head{
  display:grid;
  gap:22px;
  max-width:760px;
  margin-bottom:clamp(48px,6vw,80px);
}
.section-head--split{
  max-width:none;
  grid-template-columns:minmax(0,1fr) minmax(0,26rem);
  align-items:end;
  gap:clamp(28px,4vw,64px);
}
@media (max-width:900px){
  .section-head--split{grid-template-columns:1fr;align-items:start;}
}

/* Divisor "horizonte": luz no centro, some nas bordas.
   Substitui a régua fina genérica. */
.horizon{
  position:relative;
  height:1px;
  border:0;
  margin:0;
  background:linear-gradient(90deg,transparent 0%,var(--bronze-deep) 22%,var(--bronze-lit) 50%,var(--bronze-deep) 78%,transparent 100%);
  opacity:.4;
}
.horizon::after{
  content:"";
  position:absolute;
  left:50%;top:-42px;
  width:min(780px,82vw);height:84px;
  transform:translateX(-50%);
  background:radial-gradient(ellipse at 50% 100%,rgba(192,128,67,.18),transparent 70%);
  pointer-events:none;
}

/* ==========================================================================
   Navegação
   ========================================================================== */
.nav{
  position:fixed;
  inset:0 0 auto 0;
  z-index:100;
  transition:background .4s var(--ease),backdrop-filter .4s var(--ease),border-color .4s var(--ease);
  border-bottom:1px solid transparent;
}
.nav.is-stuck{
  background:rgba(10,8,7,.82);
  backdrop-filter:blur(14px) saturate(140%);
  border-bottom-color:var(--edge);
}
.nav__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding-block:clamp(14px,1.6vw,20px);
}
.brand{display:flex;align-items:center;gap:11px;}
.brand__mark{width:36px;height:36px;flex:none;}
.brand__name{
  font-family:var(--display);
  font-size:1.02rem;
  letter-spacing:.14em;
  color:var(--starlight);
}
.nav__links{display:flex;align-items:center;gap:34px;}
.nav__link{
  font-size:.875rem;
  color:var(--dust);
  position:relative;
  padding-block:11px;
  transition:color .3s var(--ease);
}
.nav__link::after{
  content:"";
  position:absolute;
  left:0;bottom:0;
  width:100%;height:1px;
  background:var(--bronze);
  transform:scaleX(0);
  transform-origin:right;
  transition:transform .4s var(--ease);
}
.nav__link:hover{color:var(--starlight);}
.nav__link:hover::after{transform:scaleX(1);transform-origin:left;}

.nav__toggle{
  display:none;
  width:44px;height:44px;
  align-items:center;
  justify-content:center;
}
.nav__toggle span{
  display:block;width:20px;height:1px;
  background:var(--parchment);
  position:relative;
  transition:background .2s var(--ease);
}
.nav__toggle span::before,
.nav__toggle span::after{
  content:"";position:absolute;left:0;
  width:20px;height:1px;background:var(--parchment);
  transition:transform .3s var(--ease);
}
.nav__toggle span::before{top:-6px;}
.nav__toggle span::after{top:6px;}
.nav__toggle[aria-expanded="true"] span{background:transparent;}
.nav__toggle[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg);}
.nav__toggle[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg);}

@media (max-width:940px){
  .nav__toggle{display:flex;}
  .nav__links{
    position:fixed;
    inset:0 0 auto 0;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding:88px var(--gutter) 32px;
    background:rgba(10,8,7,.97);
    backdrop-filter:blur(18px);
    border-bottom:1px solid var(--edge);
    transform:translateY(-101%);
    transition:transform .45s var(--ease-out);
    z-index:-1;
  }
  .nav__links.is-open{transform:translateY(0);}
  .nav__link{
    padding-block:16px;
    font-size:1.15rem;
    border-bottom:1px solid var(--edge);
  }
  .nav__link::after{display:none;}
  .nav__links .btn{margin-top:20px;justify-content:center;}
}

/* ==========================================================================
   Botões
   ========================================================================== */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:48px;
  padding:14px 26px;
  border-radius:2px;
  font-size:.9375rem;
  font-weight:500;
  letter-spacing:.01em;
  position:relative;
  overflow:hidden;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease);
  touch-action:manipulation;
}
.btn__label{position:relative;z-index:2;}
.btn svg{position:relative;z-index:2;flex:none;transition:transform .35s var(--ease);}

.btn--primary{
  background:var(--metal);
  color:#1A1007;
  font-weight:600;
  box-shadow:0 14px 34px -16px rgba(192,128,67,.85);
}
/* Varredura de luz no hover — ecoa a estrela da logo */
.btn--primary::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(100deg,transparent 20%,rgba(255,247,235,.75) 50%,transparent 80%);
  transform:translateX(-120%);
  transition:transform .7s var(--ease);
  z-index:1;
}
.btn--primary:hover{transform:translateY(-2px);box-shadow:0 20px 44px -16px rgba(192,128,67,.95);}
.btn--primary:hover::after{transform:translateX(120%);}
.btn--primary:hover svg{transform:translateX(4px);}

.btn--ghost{
  border:1px solid var(--edge-strong);
  color:var(--parchment);
}
.btn--ghost:hover{border-color:var(--bronze);color:var(--starlight);}
.btn--ghost:hover svg{transform:translateX(4px);}

.btn--block{width:100%;}
.btn--lg{min-height:58px;padding:18px 38px;font-size:1.02rem;}

/* ==========================================================================
   Hero — "o rascunho que se escreve sozinho"
   Texto à esquerda, prévia viva à direita. Fundo: aurora de bronze em
   movimento lento, uma grade fina que some nas bordas e um foco de luz
   que acompanha o cursor.
   ========================================================================== */
.hero{
  position:relative;
  display:grid;
  align-items:center;
  min-height:min(940px,100vh);
  padding-top:clamp(112px,14vh,150px);
  padding-bottom:clamp(76px,9vw,112px);
  overflow:hidden;
  isolation:isolate;
}
.hero__bg{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;}
.hero__aurora{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;will-change:transform;}
.hero__aurora--a{
  top:-30%;right:-10%;
  width:min(780px,95vw);aspect-ratio:1;
  background:radial-gradient(circle,rgba(192,128,67,.55),rgba(122,74,40,.18) 55%,transparent 70%);
  animation:auroraA 18s ease-in-out infinite alternate;
}
.hero__aurora--b{
  bottom:-42%;left:-16%;
  width:min(640px,85vw);aspect-ratio:1;
  background:radial-gradient(circle,rgba(233,190,139,.26),rgba(122,74,40,.1) 55%,transparent 70%);
  animation:auroraB 23s ease-in-out infinite alternate;
}
@keyframes auroraA{to{transform:translate(-14%,12%) scale(1.14);}}
@keyframes auroraB{to{transform:translate(16%,-10%) scale(.9);}}
.hero.is-offscreen .hero__aurora{animation-play-state:paused;}
.hero__grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(233,190,139,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(233,190,139,.055) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(ellipse 72% 62% at 62% 46%,#000 18%,transparent 76%);
  mask-image:radial-gradient(ellipse 72% 62% at 62% 46%,#000 18%,transparent 76%);
}
.hero__spot{
  position:absolute;
  left:var(--mx,68%);top:var(--my,42%);
  width:560px;height:560px;
  background:radial-gradient(circle,rgba(247,233,211,.075),transparent 62%);
  transform:translate(-50%,-50%);
  transition:left .7s var(--ease-out),top .7s var(--ease-out);
}
.hero::after{
  content:"";
  position:absolute;left:0;right:0;bottom:0;z-index:-1;
  height:160px;
  background:linear-gradient(transparent,var(--obsidian));
  pointer-events:none;
}

.hero__inner{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  gap:clamp(40px,5vw,88px);
  align-items:center;
}
.hero__copy{display:grid;gap:24px;justify-items:start;}

.hero__tag{
  display:inline-flex;align-items:center;gap:9px;
  padding:7px 15px 7px 12px;
  border:1px solid var(--edge-strong);
  border-radius:99px;
  background:rgba(28,21,17,.55);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  font-size:.72rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;
  color:var(--bronze-lit);
}
.hero__tag svg{width:12px;height:12px;fill:var(--starlight);filter:drop-shadow(0 0 6px rgba(247,233,211,.8));animation:tagStar 3.6s ease-in-out infinite;}
.hero__tag span{font-weight:400;letter-spacing:.04em;text-transform:none;color:var(--dust);}
@keyframes tagStar{0%,100%{transform:scale(1) rotate(0);}50%{transform:scale(.7) rotate(45deg);}}

.hero__title{font-size:clamp(2.7rem,5.5vw,5rem);line-height:1.02;letter-spacing:-.026em;}
.hero__line{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em;}
.hero__line > span{display:inline-block;padding-right:.06em;}

.hero__lead{max-width:47ch;font-size:clamp(1.02rem,1.22vw,1.13rem);line-height:1.7;color:#BCA994;}

/* Campo e segmentos */
.hero__try{display:grid;gap:12px;width:100%;max-width:520px;}
.hero__field{
  position:relative;
  display:flex;align-items:center;gap:12px;
  height:58px;
  padding:0 18px;
  border:1px solid var(--edge-strong);
  border-radius:12px;
  background:rgba(18,14,11,.74);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  cursor:text;
  transition:border-color .3s var(--ease),box-shadow .3s var(--ease);
}
.hero__field svg{width:19px;height:19px;flex:none;color:var(--bronze-lit);transform-origin:20% 80%;}
.hero__field.is-typing svg{animation:penWrite .28s ease-in-out infinite alternate;}
@keyframes penWrite{from{transform:rotate(-6deg) translateX(-1px);}to{transform:rotate(6deg) translateX(1px);}}
.hero__field input{
  flex:1;min-width:0;height:100%;
  border:0;outline:none;background:none;
  font-size:1.05rem;font-weight:500;
  color:var(--starlight);
  caret-color:var(--bronze-lit);
}
.hero__field input::placeholder{font-weight:400;color:var(--dust-dim);}
.hero__field:focus-within{border-color:var(--bronze);box-shadow:0 0 0 4px rgba(192,128,67,.16),0 18px 40px -24px rgba(192,128,67,.6);}
.hero__caret{display:none;}

.hero__chips{display:flex;flex-wrap:wrap;gap:8px;}
.hero__chip{
  padding:8px 14px;
  border:1px solid var(--edge);
  border-radius:99px;
  background:rgba(18,14,11,.42);
  font-size:.8125rem;font-weight:500;
  color:var(--dust);
  transition:color .3s var(--ease),border-color .3s var(--ease),background .3s var(--ease),transform .3s var(--ease);
}
.hero__chip:hover{border-color:var(--edge-strong);color:var(--parchment);}
.hero__chip:active{transform:scale(.96);}
.hero__chip[aria-checked="true"]{border-color:transparent;background:var(--metal);color:#1A1007;}

.hero__actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;}
.hero__secondary{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 0;
  border-bottom:1px solid var(--edge-strong);
  font-size:.9375rem;font-weight:500;
  color:var(--parchment);
  transition:color .3s var(--ease),border-color .3s var(--ease);
}
.hero__secondary svg{width:15px;height:15px;transition:transform .35s var(--ease);}
.hero__secondary:hover{border-color:var(--bronze);color:var(--bronze-lit);}
.hero__secondary:hover svg{transform:translate(2px,-2px);}

.hero__facts{
  display:flex;flex-wrap:wrap;gap:14px 36px;
  width:100%;max-width:520px;
  margin:4px 0 0;padding:20px 0 0;
  border-top:1px solid var(--edge);
  list-style:none;
}
.hero__facts li{display:grid;gap:2px;}
.hero__facts b{font-family:var(--display);font-size:1.35rem;font-weight:500;color:var(--starlight);}
.hero__facts span{font-size:.78rem;color:var(--dust-dim);}

/* --- A prévia --- */
.hero__stage{position:relative;perspective:1700px;}
.draft{
  --m-bg:#F4EEE6;--m-ink:#2A2019;--m-muted:#8B7B6B;--m-line:rgba(42,32,25,.12);
  --m-accent:#9C7352;--m-accent-ink:#FFF8F0;
  --m-shape1:linear-gradient(160deg,#E9D6C2,#CDA98C 58%,#9C7352);
  --m-shape2:#EBDCCB;
  position:relative;
  overflow:hidden;
  border-radius:14px;
  background:var(--m-bg);
  box-shadow:0 70px 120px -50px rgba(0,0,0,.95),0 0 0 1px rgba(233,190,139,.2),0 30px 70px -34px rgba(192,128,67,.4);
  transform:rotateY(var(--ry,-9deg)) rotateX(var(--rx,4deg));
  transition:transform .9s var(--ease-out),background-color .7s var(--ease);
  container-type:inline-size;
}
.draft[data-theme="advocacia"]{--m-bg:#0F1826;--m-ink:#EFE8DA;--m-muted:#8E97A6;--m-line:rgba(239,232,218,.12);--m-accent:#C9A45C;--m-accent-ink:#131A25;--m-shape1:linear-gradient(160deg,#30425F,#1A263A 60%,#0B111C);--m-shape2:#1B2638;}
.draft[data-theme="arquitetura"]{--m-bg:#EDEBE5;--m-ink:#1E1E1C;--m-muted:#7E7B74;--m-line:rgba(30,30,28,.12);--m-accent:#1E1E1C;--m-accent-ink:#F4F2EC;--m-shape1:linear-gradient(180deg,#DAD6CC 0 50%,#BBB5A8 50% 100%);--m-shape2:#CFCABF;}
.draft[data-theme="consultoria"]{--m-bg:#0F2420;--m-ink:#E9F1EC;--m-muted:#86A298;--m-line:rgba(233,241,236,.12);--m-accent:#7FC4A4;--m-accent-ink:#0C1E1A;--m-shape1:linear-gradient(150deg,#22524A,#14362F 60%,#0A1F1A);--m-shape2:#173A33;}
.draft[data-theme="industria"]{--m-bg:#16191E;--m-ink:#ECEEF1;--m-muted:#8A919C;--m-line:rgba(236,238,241,.1);--m-accent:#E58A3A;--m-accent-ink:#16191E;--m-shape1:repeating-linear-gradient(135deg,#2C313A 0 10px,#232830 10px 20px);--m-shape2:#232830;}

.draft__bar{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;
  padding:9px 12px;
  background:#1A1511;
  border-bottom:1px solid rgba(0,0,0,.4);
}
.draft__dots{display:flex;gap:6px;}
.draft__dots i{display:block;width:9px;height:9px;border-radius:50%;background:#3B312A;}
.draft__url{
  justify-self:center;
  display:inline-flex;align-items:center;gap:6px;
  min-width:0;max-width:100%;
  padding:5px 14px;
  border-radius:7px;
  background:rgba(0,0,0,.35);
  font-size:.72rem;
  color:var(--dust);
}
.draft__url svg{width:11px;height:11px;flex:none;color:#6FCF97;}
#heroUrl{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.draft__state{display:inline-flex;align-items:center;gap:6px;font-size:.64rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:#8FDCAE;transition:color .3s var(--ease);}
.draft__state i{display:block;width:6px;height:6px;border-radius:50%;background:#6FCF97;}
.draft.is-writing .draft__state{color:var(--bronze-lit);}
.draft.is-writing .draft__state i{background:var(--bronze-lit);animation:livePulse 1s ease-out infinite;}

.draft__page{color:var(--m-ink);transition:color .6s var(--ease);}
.draft__nav{display:flex;align-items:center;gap:4cqw;padding:3.2cqw 5cqw;border-bottom:1px solid var(--m-line);}
.draft__logo{
  max-width:42cqw;overflow:hidden;
  font-family:var(--display);
  font-size:clamp(9px,2.3cqw,16px);font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;
  white-space:nowrap;text-overflow:ellipsis;
}
.draft__links{display:flex;gap:2.2cqw;margin-left:auto;}
.draft__links i{display:block;width:5.5cqw;height:.55cqw;min-height:2px;border-radius:2px;background:var(--m-muted);opacity:.5;}
.draft__pill{padding:1.1cqw 2.4cqw;border:1px solid var(--m-accent);border-radius:99px;font-size:clamp(7px,1.45cqw,11px);font-weight:600;color:var(--m-accent);white-space:nowrap;}
.draft__hero{display:grid;grid-template-columns:1.15fr .85fr;gap:4.5cqw;align-items:center;padding:5.5cqw 5cqw 4.8cqw;}
.draft__copy{display:grid;gap:2.3cqw;align-content:center;}
.draft__eyebrow{font-size:clamp(6px,1.3cqw,10px);font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--m-accent);}
.draft__h{font-family:var(--display);font-size:clamp(15px,4.7cqw,36px);font-weight:500;line-height:1.07;letter-spacing:-.02em;}
.draft__p{display:grid;gap:1.1cqw;}
.draft__p i{display:block;height:.75cqw;min-height:3px;border-radius:2px;background:var(--m-muted);opacity:.35;}
.draft__p i:nth-child(2){width:88%;}
.draft__p i:nth-child(3){width:60%;}
.draft__actions{display:flex;align-items:center;gap:2.6cqw;margin-top:.6cqw;}
.draft__btn{padding:1.6cqw 3.2cqw;border-radius:99px;background:var(--m-accent);color:var(--m-accent-ink);font-size:clamp(7px,1.5cqw,12px);font-weight:600;white-space:nowrap;box-shadow:0 1.2cqw 3cqw -1.4cqw var(--m-accent);}
.draft__link{padding-bottom:.3cqw;border-bottom:1px solid var(--m-line);font-size:clamp(7px,1.4cqw,11px);color:var(--m-muted);white-space:nowrap;}
.draft__media{position:relative;align-self:stretch;min-height:30cqw;}
.draft__shape{position:absolute;display:block;}
.draft__shape--1{inset:0 0 10% 12%;border-radius:26cqw 26cqw 1.6cqw 1.6cqw;background:var(--m-shape1);}
.draft__shape--2{left:0;bottom:0;width:40%;height:32%;border:1px solid var(--m-line);border-radius:1.6cqw;background:var(--m-shape2);}
.draft__rating{
  position:absolute;left:-3cqw;bottom:10%;
  display:grid;gap:.3cqw;
  padding:1.6cqw 2.4cqw;
  border:1px solid var(--m-line);
  border-radius:1.6cqw;
  background:var(--m-bg);
  box-shadow:0 2cqw 5cqw -2cqw rgba(0,0,0,.45);
}
.draft__rating b{font-family:var(--display);font-size:clamp(10px,2.7cqw,20px);font-weight:600;line-height:1;}
.draft__stars{font-size:clamp(6px,1.25cqw,10px);letter-spacing:.1em;color:#E0A83C;}
.draft.no-stars .draft__stars{display:none;}
.draft__rating span:last-child{font-size:clamp(6px,1.1cqw,9px);color:var(--m-muted);}
.draft__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:3cqw;padding:3.6cqw 5cqw 4.4cqw;border-top:1px solid var(--m-line);}
.draft__stats span{display:grid;gap:.4cqw;}
.draft__stats b{font-family:var(--display);font-size:clamp(10px,2.8cqw,22px);font-weight:500;}
.draft__stats i{font-size:clamp(6px,1.2cqw,10px);font-style:normal;color:var(--m-muted);}

/* Escrita: os blocos somem rápido e voltam um a um, varridos pela caneta */
.draft__w{transition:opacity .5s var(--ease),transform .7s var(--ease-out),filter .5s var(--ease);}
.draft__copy .draft__w:nth-child(1){transition-delay:.05s;}
.draft__copy .draft__w:nth-child(2){transition-delay:.17s;}
.draft__copy .draft__w:nth-child(3){transition-delay:.29s;}
.draft__copy .draft__w:nth-child(4){transition-delay:.4s;}
.draft__media.draft__w{transition-delay:.22s;}
.draft__stats.draft__w{transition-delay:.52s;}
.draft.is-writing .draft__w{opacity:0;filter:blur(4px);transform:translateY(8px);transition-duration:.18s;transition-delay:0s;}
.draft__pen{position:absolute;inset:34px 0 0;pointer-events:none;opacity:0;}
.draft__pen i{
  position:absolute;top:0;bottom:0;left:0;
  width:2px;
  background:linear-gradient(180deg,transparent,#E9BE8B 18%,#F7E9D3 50%,#E9BE8B 82%,transparent);
  box-shadow:0 0 22px 5px rgba(233,190,139,.6);
}
.draft.is-sweeping .draft__pen{animation:penSweep 1s var(--ease-out) forwards;}
@keyframes penSweep{
  0%{opacity:1;transform:translateX(0);}
  85%{opacity:1;}
  100%{opacity:0;transform:translateX(100%);}
}

/* Cartões flutuantes */
.hero__float{
  position:absolute;z-index:2;
  display:flex;align-items:center;gap:12px;
  padding:11px 17px 11px 12px;
  border:1px solid var(--edge-strong);
  border-radius:14px;
  background:rgba(20,16,13,.84);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  box-shadow:0 24px 50px -24px rgba(0,0,0,.9);
  transition:opacity .6s var(--ease);
}
.hero__float-text{display:grid;gap:1px;}
.hero__float-text b{font-size:.8125rem;font-weight:600;color:var(--starlight);white-space:nowrap;}
.hero__float-text span{font-size:.72rem;color:var(--dust);white-space:nowrap;}
.hero__float--speed{top:-15%;left:-9%;animation:floatY 6s ease-in-out infinite;}
.hero__float--lead{right:-7%;bottom:-15%;animation:floatY 7s ease-in-out -2s infinite;}
.hero__float--lead.is-pop{animation:toastPop .7s var(--ease-out),floatY 7s ease-in-out .7s infinite;}
@keyframes floatY{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}
@keyframes toastPop{0%{opacity:0;transform:translateY(16px) scale(.9);}100%{opacity:1;transform:none;}}
.hero__float-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:rgba(111,207,151,.14);color:#6FCF97;}
.hero__float-icon svg{width:19px;height:19px;}
.gauge{position:relative;display:grid;place-items:center;width:40px;height:40px;}
.gauge svg{position:absolute;inset:0;transform:rotate(-90deg);}
.gauge circle{fill:none;stroke:rgba(111,207,151,.18);stroke-width:3;}
.gauge .gauge__fill{stroke:#6FCF97;stroke-linecap:round;stroke-dasharray:97.4;stroke-dashoffset:1.95;transition:stroke-dashoffset 1.8s var(--ease-out) .4s;}
.js .hero:not(.is-ready) .gauge__fill{stroke-dashoffset:97.4;}
.gauge b{font-size:.8rem;font-weight:600;color:#8FDCAE;}

/* Indicador de rolagem */
.hero__scroll{position:absolute;left:50%;bottom:22px;padding:6px;transform:translateX(-50%);}
.hero__mouse{position:relative;display:block;width:24px;height:38px;border:1.5px solid var(--edge-strong);border-radius:14px;transition:border-color .3s var(--ease);}
.hero__mouse i{position:absolute;top:7px;left:50%;width:3px;height:7px;margin-left:-1.5px;border-radius:2px;background:var(--bronze-lit);animation:mouseWheel 1.8s var(--ease) infinite;}
.hero__scroll:hover .hero__mouse{border-color:var(--bronze);}
@keyframes mouseWheel{0%{opacity:0;transform:translateY(-3px);}30%{opacity:1;}100%{opacity:0;transform:translateY(12px);}}

/* Abertura */
.js .hero__line > span{transform:translateY(108%);animation:lineUp 1.05s var(--ease-out) forwards;}
.js .hero__line:nth-child(1) > span{animation-delay:.18s;}
.js .hero__line:nth-child(2) > span{animation-delay:.3s;}
.js .hero__line:nth-child(3) > span{animation-delay:.42s;}
@keyframes lineUp{to{transform:none;}}
.js .hero__tag,
.js .hero__lead,
.js .hero__try,
.js .hero__actions,
.js .hero__facts{opacity:0;transform:translateY(16px);animation:heroRise .9s var(--ease-out) forwards;}
.js .hero__tag{animation-delay:.05s;}
.js .hero__lead{animation-delay:.6s;}
.js .hero__try{animation-delay:.72s;}
.js .hero__actions{animation-delay:.84s;}
.js .hero__facts{animation-delay:.96s;}
@keyframes heroRise{to{opacity:1;transform:none;}}
.js .hero__stage{opacity:0;animation:stageIn 1.3s var(--ease-out) .35s forwards;}
@keyframes stageIn{from{opacity:0;transform:translateY(46px) scale(.95);}to{opacity:1;transform:none;}}
.js .hero:not(.is-ready) .hero__float{opacity:0;}

@media (max-width:1040px){
  .hero{min-height:auto;}
  .hero__inner{grid-template-columns:minmax(0,1fr);gap:24px;}
  .hero__copy{display:contents;}
  .hero__tag{order:1;justify-self:start;}
  .hero__title{order:2;}
  .hero__lead{order:3;}
  .hero__try{order:4;}
  .hero__stage{order:5;width:100%;max-width:640px;justify-self:center;margin:30px 0 34px;}
  .hero__actions{order:6;}
  .hero__facts{order:7;}
  .draft{--ry:0deg;--rx:0deg;}
  .hero__scroll{display:none;}
}
@media (max-width:560px){
  .hero{padding-top:96px;padding-bottom:60px;}
  .hero__inner{gap:20px;}
  .hero__title{font-size:clamp(2.35rem,11.2vw,3.1rem);}
  .hero__field{height:54px;padding:0 15px;}
  .hero__chip{padding:7px 12px;font-size:.78rem;}
  .hero__actions{width:100%;}
  .hero__actions .btn{flex:1 1 100%;}
  .hero__secondary{margin-inline:auto;}
  .hero__stage{margin:26px 0 30px;}
  .hero__float{gap:9px;padding:8px 12px 8px 9px;border-radius:12px;}
  .hero__float--speed{top:-11%;left:-2%;}
  .hero__float--lead{right:-2%;bottom:-14%;}
  .gauge{width:32px;height:32px;}
  .gauge b{font-size:.7rem;}
  .hero__float-icon{width:30px;height:30px;}
  .hero__float-icon svg{width:16px;height:16px;}
  .hero__float-text b{font-size:.74rem;}
  .hero__float-text span{font-size:.66rem;}
  .hero__facts{gap:14px 26px;}
}

/* ==========================================================================
   Problema + calculadora
   ========================================================================== */
.problem{background:linear-gradient(180deg,var(--obsidian),var(--umber) 60%,var(--obsidian));}
/* Argumento no centro; logo abaixo, os sintomas e a conta. */
.problem__head{
  display:grid;
  gap:20px;
  justify-items:center;
  text-align:center;
  max-width:800px;
  margin:0 auto clamp(52px,6.5vw,88px);
}
.problem__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.06fr);
  gap:clamp(40px,5vw,80px);
  align-items:start;
}
@media (max-width:960px){.problem__grid{grid-template-columns:1fr;}}

.symptoms{display:grid;gap:0;margin-top:22px;}
.symptom{
  display:flex;
  gap:16px;
  align-items:flex-start;
  padding:18px 0;
  border-top:1px solid var(--edge);
}
.symptom:last-child{border-bottom:1px solid var(--edge);}
.symptom__icon{
  flex:none;width:20px;height:20px;margin-top:3px;color:var(--bronze);
}
.symptom p{color:var(--dust);font-size:.9688rem;}
.symptom strong{color:var(--parchment);font-weight:500;}

/* Calculadora de custo de oportunidade */
.calc{
  background:linear-gradient(160deg,var(--ember),var(--umber));
  border:1px solid var(--edge);
  border-radius:4px;
  padding:clamp(24px,3.2vw,38px);
  position:relative;
  overflow:hidden;
}
.calc::before{
  content:"";
  position:absolute;
  top:-90px;right:-60px;
  width:280px;height:280px;
  background:radial-gradient(circle,rgba(192,128,67,.17),transparent 68%);
  pointer-events:none;
}
.calc__head{position:relative;display:grid;gap:8px;margin-bottom:26px;}
.calc__title{font-family:var(--display);font-size:1.5rem;color:var(--starlight);line-height:1.2;}
.calc__note{font-size:.8125rem;color:var(--dust-dim);}

.calc__fields{position:relative;display:grid;gap:22px;}
.field{display:grid;gap:9px;}
.field__top{display:flex;align-items:baseline;justify-content:space-between;gap:12px;}
.field label{font-size:.8125rem;color:var(--dust);letter-spacing:.02em;}
.field__value{
  font-family:var(--display);
  font-size:1.1rem;
  color:var(--bronze-lit);
  font-variant-numeric:tabular-nums;
}

input[type="range"]{
  -webkit-appearance:none;appearance:none;
  width:100%;height:44px;      /* área de toque, não espessura da trilha */
  background:transparent;
  cursor:pointer;
  margin:0;
}
input[type="range"]::-webkit-slider-runnable-track{
  height:2px;
  background:linear-gradient(90deg,var(--bronze) var(--fill,50%),var(--ash) var(--fill,50%));
}
input[type="range"]::-moz-range-track{height:2px;background:var(--ash);}
input[type="range"]::-moz-range-progress{height:2px;background:var(--bronze);}
input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;
  width:18px;height:18px;
  margin-top:-8px;
  border-radius:50%;
  background:var(--metal);
  border:2px solid var(--obsidian);
  box-shadow:0 0 14px rgba(233,190,139,.5);
  transition:transform .2s var(--ease);
}
input[type="range"]::-moz-range-thumb{
  width:18px;height:18px;border-radius:50%;
  background:var(--bronze-lit);border:2px solid var(--obsidian);
  box-shadow:0 0 14px rgba(233,190,139,.5);
}
input[type="range"]:hover::-webkit-slider-thumb{transform:scale(1.14);}

/* Convite ao gesto: os controles pulsam até o primeiro toque, e durante a
   demonstração automática o controle ativo acende. */
.calc__head{padding-right:96px;}
.calc__hint{
  position:absolute;
  top:2px;right:0;
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 11px 5px 8px;
  border:1px solid var(--edge-strong);
  border-radius:99px;
  font-size:.6875rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  color:var(--bronze-lit);
  background:rgba(122,74,40,.14);
  transition:opacity .5s var(--ease);
}
.calc__hint svg{width:15px;height:15px;animation:hintTap 1.6s var(--ease) infinite;transform-origin:50% 80%;}
@keyframes hintTap{0%,100%{transform:translateX(0) rotate(0);}40%{transform:translateX(4px) rotate(8deg);}}
.calc.is-touched .calc__hint{opacity:0;}
.calc:not(.is-touched) input[type="range"]::-webkit-slider-thumb{animation:thumbPulse 2.4s ease-in-out infinite;}
@keyframes thumbPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(233,190,139,.45),0 0 14px rgba(233,190,139,.5);}
  55%{box-shadow:0 0 0 9px rgba(233,190,139,0),0 0 14px rgba(233,190,139,.5);}
}
.field.is-demo input[type="range"]::-webkit-slider-thumb{transform:scale(1.28);animation:none;box-shadow:0 0 0 7px rgba(233,190,139,.2),0 0 20px rgba(233,190,139,.85);}
.field.is-demo input[type="range"]::-moz-range-thumb{transform:scale(1.28);box-shadow:0 0 0 7px rgba(233,190,139,.2),0 0 20px rgba(233,190,139,.85);}
.field.is-demo .field__value{color:var(--starlight);}
.field.is-demo label{color:var(--parchment);}
.field__value{transition:color .3s var(--ease);}
@media (max-width:420px){.calc__head{padding-right:0;}.calc__hint{position:static;justify-self:start;margin-top:6px;}}

.calc__result{
  position:relative;
  margin-top:30px;
  padding-top:26px;
  border-top:1px solid var(--edge);
  display:grid;
  gap:18px;
}
.calc__rows{display:grid;gap:10px;}
.calc__row{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:14px;
  font-size:.9375rem;
}
.calc__row span{color:var(--dust);}
.calc__row b{
  font-weight:400;
  color:var(--parchment);
  font-variant-numeric:tabular-nums;
  font-family:var(--display);
  font-size:1.05rem;
}
.calc__loss{
  display:grid;
  gap:5px;
  padding:20px 22px;
  background:rgba(122,74,40,.16);
  border:1px solid var(--edge-strong);
  border-radius:3px;
}
.calc__loss-label{
  font-size:var(--fs-micro);
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--bronze-lit);
}
.calc__loss-value{
  font-family:var(--display);
  font-size:clamp(1.9rem,3.4vw,2.7rem);
  line-height:1.05;
  color:var(--starlight);
  font-variant-numeric:tabular-nums;
  letter-spacing:-.02em;
}
.calc__loss-sub{font-size:.8125rem;color:var(--dust);}
.calc__disclaimer{font-size:.75rem;color:var(--dust-dim);line-height:1.55;}

/* ==========================================================================
   Serviços — cardápio
   Cada serviço numa linha: o nome e o convite "ver funcionando" ligados
   por pontilhado, como num cardápio. A linha aberta vira uma vitrine
   escura, com o serviço funcionando de um lado e a ficha do outro.
   ========================================================================== */

/* Tokens escuros de volta, para blocos escuros dentro de uma seção clara */
.is-night{
  --obsidian:#0A0807;--umber:#120E0B;--ember:#1C1511;--ash:#272019;
  --bronze-deep:#7A4A28;--bronze:#C08043;--bronze-lit:#E9BE8B;--starlight:#F7E9D3;
  --parchment:#EDE1D1;--dust:#A3907C;--dust-dim:#8F7E6D;
  --edge:rgba(233,190,139,.14);--edge-strong:rgba(233,190,139,.28);
  --metal:linear-gradient(135deg,#E9BE8B 0%,#C08043 45%,#7A4A28 100%);
  color:var(--parchment);
}
.is-day .is-night .btn--primary{background:var(--metal);color:#1A1007;box-shadow:0 14px 34px -16px rgba(192,128,67,.85);}
.is-day .is-night .btn--primary:hover{box-shadow:0 20px 44px -16px rgba(192,128,67,.95);}

/* --- As linhas --- */
.menu__cap{
  display:flex;justify-content:space-between;gap:20px;
  margin:0;padding-bottom:14px;
  border-bottom:3px double var(--edge-strong);
  font-size:var(--fs-micro);font-weight:500;letter-spacing:.24em;text-transform:uppercase;
  color:var(--dust);
}
.menu__item{border-bottom:1px solid var(--edge-strong);}
.menu__title{margin:0;font:inherit;letter-spacing:normal;}
.menu__head{
  width:100%;
  display:grid;
  grid-template-columns:clamp(42px,4vw,54px) minmax(0,max-content) minmax(28px,1fr) max-content 44px;
  grid-template-areas:"icon name dots price toggle" "icon line line line toggle";
  align-items:baseline;
  column-gap:clamp(14px,1.8vw,24px);
  row-gap:6px;
  padding:clamp(22px,2.4vw,30px) 0;
  text-align:left;
  color:var(--parchment);
  -webkit-tap-highlight-color:transparent;
}
.menu__icon{
  grid-area:icon;align-self:center;
  display:grid;place-items:center;
  width:100%;aspect-ratio:1;
  border:1px solid var(--edge-strong);border-radius:50%;
  color:var(--bronze);
  transition:background .4s var(--ease),border-color .4s var(--ease),color .4s var(--ease),transform .55s var(--ease-out);
}
.menu__icon svg{width:48%;height:48%;}
.menu__name{
  grid-area:name;
  font-family:var(--display);font-size:clamp(1.3rem,2.2vw,1.9rem);font-weight:500;line-height:1.15;letter-spacing:-.01em;
  color:var(--starlight);
  transition:color .35s var(--ease);
}
.menu__dots{
  grid-area:dots;align-self:baseline;
  height:10px;
  background:radial-gradient(circle,currentColor 1.1px,transparent 1.6px) 0 100%/9px 4px repeat-x;
  color:var(--ash);
  transition:color .35s var(--ease);
}
.menu__peek{
  grid-area:price;
  display:inline-flex;align-items:center;gap:9px;
  font-size:.7rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap;
  color:var(--bronze-lit);
  transition:opacity .35s var(--ease),transform .45s var(--ease-out);
}
.menu__peek::before{content:"";width:0;height:0;border-left:7px solid currentColor;border-block:4.5px solid transparent;}
.menu__item.is-open .menu__peek{opacity:0;transform:translateX(8px);}
html:not(.js) .menu__peek{visibility:hidden;}
.menu__line{grid-area:line;max-width:64ch;font-size:.98rem;line-height:1.55;color:var(--dust);}
.menu__badge{
  display:inline-flex;align-items:center;gap:6px;
  margin-left:8px;padding:2px 10px 3px;
  border:1px solid var(--bronze);border-radius:99px;
  font-size:.72rem;font-weight:500;letter-spacing:.03em;line-height:1.5;white-space:nowrap;
  color:var(--bronze-lit);vertical-align:1px;
}
.menu__badge::before{content:"";width:8px;height:8px;background:currentColor;clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);}
.menu__toggle{
  grid-area:toggle;align-self:center;justify-self:end;
  position:relative;width:44px;height:44px;
  border:1px solid var(--edge-strong);border-radius:50%;
  transition:background .4s var(--ease),border-color .4s var(--ease),transform .55s var(--ease-out);
}
.menu__toggle::before,.menu__toggle::after{
  content:"";position:absolute;left:50%;top:50%;
  width:14px;height:1.5px;margin:-.75px 0 0 -7px;
  border-radius:1px;background:var(--parchment);
  transition:background .4s var(--ease);
}
.menu__toggle::after{transform:rotate(90deg);}
html:not(.js) .menu__toggle{visibility:hidden;}

.menu__item.is-open .menu__name{color:var(--bronze-lit);}
.menu__item.is-open .menu__icon{background:var(--parchment);border-color:var(--parchment);color:#F1DDBE;transform:rotate(-8deg);}
.menu__item.is-open .menu__toggle{background:var(--parchment);border-color:var(--parchment);transform:rotate(135deg);}
.menu__item.is-open .menu__toggle::before,.menu__item.is-open .menu__toggle::after{background:#F8F1E5;}
@media (hover:hover){
  .menu__head:hover .menu__name{color:var(--bronze-lit);}
  .menu__head:hover .menu__dots{color:var(--bronze);}
  .menu__head:hover .menu__icon,.menu__head:hover .menu__toggle{border-color:var(--bronze);}
}

/* Abre e fecha pela altura; a linha que fecha quando outra abre recolhe
   sem animação (is-snap), e o JS compensa a rolagem */
.menu__body{display:grid;grid-template-rows:1fr;}
.js .menu__body{grid-template-rows:0fr;transition:grid-template-rows .7s var(--ease-out);}
.js .menu__item.is-open .menu__body{grid-template-rows:1fr;}
.js .menu__item.is-snap .menu__body{transition:none;}
.menu__inner{min-height:0;overflow:hidden;overflow:clip;}

/* --- A vitrine --- */
.vit{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:clamp(26px,3.4vw,50px);
  margin:4px 0 clamp(26px,3vw,40px);
  padding:clamp(16px,2.6vw,36px);
  border-radius:22px;
  background:
    radial-gradient(ellipse 62% 70% at 24% 26%,rgba(192,128,67,.2),transparent 62%),
    linear-gradient(155deg,#1E1712,#0B0908 72%);
  box-shadow:0 30px 60px -44px rgba(35,26,18,.95),inset 0 1px 0 rgba(233,190,139,.12);
  transition:opacity .55s var(--ease),transform .7s var(--ease-out);
}
.js .menu__item:not(.is-open) .vit{opacity:0;transform:translateY(-14px);}
.vit__stage{display:grid;gap:14px;align-content:start;align-self:start;min-width:0;}
@media (min-width:981px){.vit__stage{position:sticky;top:100px;}}
.vit__hint{display:flex;align-items:center;gap:8px;font-size:.8rem;line-height:1.45;color:var(--dust);}
.vit__hint svg{flex:none;width:16px;height:16px;color:var(--bronze-lit);}
.vit__bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;}
.vit__toggle{
  display:inline-flex;align-items:center;
  min-height:40px;padding:9px 18px;
  border-radius:99px;
  background:var(--metal);color:#1A1007;
  font-size:.85rem;font-weight:600;
  box-shadow:0 12px 26px -14px rgba(192,128,67,.8);
  transition:transform .3s var(--ease),background .3s var(--ease),color .3s var(--ease);
}
.vit__toggle:hover{transform:translateY(-2px);}
.vit__toggle[aria-pressed="true"]{background:transparent;color:var(--parchment);box-shadow:inset 0 0 0 1px var(--edge-strong);}

/* --- A ficha --- */
.ficha{display:grid;gap:22px;align-content:start;min-width:0;}
.ficha__lede{font-family:var(--display);font-size:clamp(1.12rem,1.45vw,1.3rem);line-height:1.45;color:var(--starlight);}
.ficha__group{display:grid;gap:12px;}
.ficha__label{display:flex;align-items:center;gap:12px;font-size:.68rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--bronze-lit);}
.ficha__label::after{content:"";flex:1;height:1px;background:var(--edge);}
.ficha__chips{display:flex;flex-wrap:wrap;gap:7px;margin:0;padding:0;list-style:none;}
.ficha__chips li{padding:5px 12px 6px;border:1px solid var(--edge-strong);border-radius:99px;font-size:.82rem;line-height:1.3;color:var(--parchment);}
.ficha__inc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 22px;margin:0;padding:0;list-style:none;}
.ficha__inc li,.ficha__list li{position:relative;padding-left:25px;font-size:.9rem;line-height:1.4;color:var(--parchment);}
.ficha__inc li::before{
  content:"";position:absolute;left:0;top:.1em;
  width:16px;height:16px;border-radius:50%;
  background:rgba(233,190,139,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E9BE8B' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/10px no-repeat;
}
.ficha__list{display:grid;gap:8px;margin:0;padding:0;list-style:none;}
.ficha__list li::before{content:"";position:absolute;left:4px;top:.45em;width:6px;height:6px;border:1px solid var(--bronze-lit);transform:rotate(45deg);}
.ficha__note{padding-left:14px;border-left:1px solid var(--bronze);font-size:.86rem;line-height:1.55;color:var(--dust);}
.ficha__note b{font-weight:500;color:var(--parchment);}
.ficha__foot{display:grid;gap:16px;padding-top:20px;border-top:1px solid var(--edge);}
.ficha__deal{display:flex;align-items:center;gap:9px;font-size:.86rem;line-height:1.45;color:var(--dust);}
.ficha__deal svg{flex:none;width:18px;height:18px;color:var(--bronze-lit);}
.ficha__actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;}
.ficha__wa{display:inline-flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--edge-strong);font-size:.88rem;font-weight:500;color:var(--parchment);transition:color .3s var(--ease),border-color .3s var(--ease);}
.ficha__wa svg{flex:none;width:18px;height:18px;color:#5BD68D;}
.ficha__wa:hover{color:var(--bronze-lit);border-color:var(--bronze);}

.menu__note{display:flex;align-items:flex-start;gap:10px;max-width:74ch;margin-top:20px;font-size:.88rem;line-height:1.55;color:var(--dust);}
.menu__note svg{flex:none;width:18px;height:18px;margin-top:1px;color:var(--bronze);}
.menu__note a{padding-bottom:1px;border-bottom:1px solid var(--edge-strong);font-weight:500;color:var(--bronze-lit);transition:border-color .3s var(--ease);}
.menu__note a:hover{border-color:var(--bronze);}

/* --- Demonstrações ---
   Os mini-sites medem tudo em em, e a letra acompanha a largura da moldura
   (cqw): encolhem juntos, como um print que dá para tocar. Em molduras
   estreitas o mini-site passa para a versão de celular, como um site de
   verdade faria. */
.dm-web{
  --ink:#1E1914;--mute:#8A7E72;--line:#E7DFD2;--paper:#FBF8F3;--accent:#9A6A33;--wa:#25D366;
  position:relative;container-type:inline-size;
  overflow:hidden;border-radius:12px;
  background:var(--paper);
  box-shadow:0 30px 60px -30px rgba(0,0,0,.95),0 0 0 1px rgba(233,190,139,.18);
}
.dm-web__bar{display:flex;align-items:center;gap:10px;height:30px;padding:0 12px;background:#ECE5D9;border-bottom:1px solid #DED4C5;}
.dm-web__dots{display:flex;flex:none;gap:5px;}
.dm-web__dots i{width:8px;height:8px;border-radius:50%;background:#D2C7B7;}
.dm-web__url{display:flex;align-items:center;justify-content:center;gap:6px;flex:0 1 58%;min-width:0;height:18px;margin-inline:auto;padding:0 10px;border-radius:9px;background:#F8F4EE;font-size:10px;color:#7E7266;white-space:nowrap;overflow:hidden;}
.dm-web__url svg{flex:none;width:9px;height:9px;}
.dm-web__view{position:relative;aspect-ratio:16/10.6;overflow:hidden;font-family:var(--sans);font-size:clamp(6.4px,1.72cqw,12px);line-height:1.35;color:var(--ink);text-align:left;}
.dm-web__view b{font-weight:600;}
@container (max-width:520px){.dm-web__view{aspect-ratio:4/4.3;font-size:clamp(8.6px,3.05cqw,12px);}}

.dm-phone{
  position:relative;flex:none;
  width:clamp(180px,17vw,228px);aspect-ratio:9/18.6;
  padding:7px;border-radius:32px;
  background:linear-gradient(150deg,#2B231D,#0D0A08);
  box-shadow:0 30px 60px -28px rgba(0,0,0,.95),inset 0 0 0 1px rgba(233,190,139,.24);
}
.dm-phone__screen{position:relative;height:100%;overflow:hidden;border-radius:26px;background:#fff;container-type:size;}
.dm-phone__island{position:absolute;top:7px;left:50%;z-index:4;width:30%;height:13px;border-radius:9px;background:#0D0A08;transform:translateX(-50%);}

/* 1 · Site completo: cinco páginas, uma navegação */
.dc{display:flex;flex-direction:column;}
.dc-nav{position:relative;z-index:2;display:flex;align-items:center;gap:1.6em;padding:1.05em 2.1em;background:#fff;border-bottom:1px solid var(--line);}
.dc-logo{max-width:34%;overflow:hidden;font-family:var(--display);font-size:1.35em;font-weight:600;white-space:nowrap;text-overflow:ellipsis;}
.dc-links{display:flex;gap:1.35em;margin-left:auto;}
.dc-links button{position:relative;padding:.35em 0;color:var(--mute);line-height:1.2;transition:color .3s var(--ease);}
.dc-links button::after{content:"";position:absolute;left:0;right:0;bottom:-.1em;height:.16em;border-radius:1em;background:var(--accent);transform:scaleX(0);transition:transform .45s var(--ease-out);}
.dc-links button.is-on{color:var(--ink);font-weight:500;}
.dc-links button.is-on::after{transform:scaleX(1);}
.dc-links button:hover{color:var(--ink);}
.dc-links button:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.dc-wa{display:inline-flex;align-items:center;gap:.45em;padding:.5em .95em;border-radius:99em;background:var(--wa);color:#fff;font-size:.92em;font-weight:600;white-space:nowrap;}
.dc-wa svg{width:1.25em;height:1.25em;}
.dc-pages{position:relative;flex:1;display:flex;width:500%;transform:translateX(calc(var(--page,0) * -20%));transition:transform .75s var(--ease-out);}
.dc-page{flex:none;display:grid;align-content:start;gap:1.1em;width:20%;padding:2.2em 2.4em;}
.dc-col{display:grid;align-content:start;gap:1em;}
.dc-kicker{font-size:.8em;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);}
.dc-h{display:block;font-family:var(--display);font-size:2.3em;font-weight:500;line-height:1.08;letter-spacing:-.01em;}
.dc-h--m{font-size:1.75em;}
.dc-bars{display:grid;gap:.5em;}
.dc-bars i,.dc-bar{display:block;height:.42em;border-radius:1em;background:#E6DDD0;}
.dc-bars i.s{width:60%;}
.dc-bar.s{width:64%;}
.dc-row{display:flex;flex-wrap:wrap;align-items:center;gap:1.2em;}
.dc-btn{justify-self:start;display:inline-flex;padding:.8em 1.4em;border-radius:.45em;background:var(--ink);color:#fff;font-weight:500;white-space:nowrap;}
.dc-link{padding-bottom:.15em;border-bottom:1px solid var(--accent);font-weight:500;}
.dc-img{display:block;border-radius:.8em;}
.dc-home{grid-template-columns:1.1fr .9fr;align-items:center;column-gap:2.2em;}
.dc-img--a{aspect-ratio:1/1.04;background:
  radial-gradient(circle at 72% 26%,#F7E4C6 0 10%,transparent 10.5%),
  linear-gradient(172deg,transparent 60%,rgba(70,44,26,.5) 60.3%),
  linear-gradient(160deg,#DDBB92,#8A6240);}
.dc-stats{grid-column:1/-1;display:flex;gap:2.6em;padding-top:1.1em;border-top:1px solid var(--line);}
.dc-stats span{display:grid;font-size:.85em;color:var(--mute);}
.dc-stats b{font-family:var(--display);font-size:1.5em;color:var(--ink);}
.dc-about{grid-template-columns:.78fr 1.22fr;align-items:center;column-gap:2.4em;}
.dc-img--b{aspect-ratio:1/1.18;background:
  radial-gradient(circle at 50% 38%,#F0DABB 0 15%,transparent 15.5%),
  radial-gradient(ellipse 36% 30% at 50% 92%,#6F4C31 0 98%,transparent 100%),
  linear-gradient(170deg,#D7B996,#9E7652);}
.dc-quote{font-family:var(--display);font-size:1.15em;font-style:italic;color:var(--accent);}
.dc-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1em;margin-top:.4em;}
.dc-card{display:grid;align-content:start;gap:.6em;padding:1.2em;border:1px solid var(--line);border-radius:.8em;background:#fff;}
.dc-ring{display:block;width:2.4em;height:2.4em;border-radius:50%;background:radial-gradient(circle,#F4EADB 0 40%,var(--accent) 41% 52%,#F4EADB 53%);}
.dc-card b{font-size:1.1em;}
.dc-band{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8em;margin-top:.9em;padding:1.1em 1.3em;border-radius:.8em;background:#F1E6D6;}
.dc-band b{font-family:var(--display);font-size:1.25em;font-weight:500;}
.dc-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7em;margin-top:.3em;}
.dc-gallery i{display:block;aspect-ratio:4/3;border-radius:.55em;background:linear-gradient(150deg,#D9C2A2,#9B7651);}
.dc-gallery i:nth-child(2){background:linear-gradient(150deg,#C9D2CF,#6E8580);}
.dc-gallery i:nth-child(3){background:linear-gradient(150deg,#E4CDB3,#B27E55);}
.dc-gallery i:nth-child(4){background:linear-gradient(150deg,#BFC9D6,#5F6F86);}
.dc-gallery i:nth-child(5){background:linear-gradient(150deg,#E2D6C2,#A0906F);}
.dc-gallery i:nth-child(6){background:linear-gradient(150deg,#D6BFB4,#8E6457);}
.dc-contact{grid-template-columns:1fr 1fr;align-items:stretch;column-gap:2.2em;}
.dc-field{display:block;padding:.75em .9em;border:1px solid var(--line);border-radius:.45em;background:#fff;font-size:.9em;color:var(--mute);}
.dc-field--tall{height:4.4em;}
.dc-map{position:relative;display:block;min-height:14em;border-radius:.8em;background:
  linear-gradient(90deg,rgba(255,255,255,.55) 1px,transparent 1px) 0 0/2.4em 2.4em,
  linear-gradient(rgba(255,255,255,.55) 1px,transparent 1px) 0 0/2.4em 2.4em,
  linear-gradient(140deg,#DCE3D5,#C7D3C1);}
.dc-map i{position:absolute;left:50%;top:44%;width:1.6em;height:1.6em;border-radius:50% 50% 50% 0;background:var(--accent);transform:translate(-50%,-50%) rotate(-45deg);box-shadow:0 .4em .8em -.2em rgba(0,0,0,.35);}
.dc-float{position:absolute;right:1.5em;bottom:1.5em;z-index:2;display:grid;place-items:center;width:3.4em;height:3.4em;border-radius:50%;background:var(--wa);color:#fff;box-shadow:0 .6em 1.4em -.4em rgba(37,211,102,.75);}
.dc-float svg{width:1.7em;height:1.7em;}
.dc-float::after{content:"";position:absolute;inset:0;border-radius:50%;}
.is-playing .dc-float::after{animation:waRing 2.4s var(--ease-out) infinite;}
@keyframes waRing{0%{box-shadow:0 0 0 0 rgba(37,211,102,.5);}80%,100%{box-shadow:0 0 0 1.1em rgba(37,211,102,0);}}
@container (max-width:520px){
  .dc-nav{flex-wrap:wrap;row-gap:.55em;padding:.9em 1.3em .7em;}
  .dc-logo{max-width:60%;}
  .dc-links{order:3;width:100%;margin-left:0;justify-content:space-between;gap:.4em;}
  .dc-wa{margin-left:auto;font-size:.8em;}
  .dc-page{padding:1.3em;}
  .dc-home,.dc-about,.dc-contact{grid-template-columns:1fr;}
  .dc-img--a,.dc-img--b,.dc-map{display:none;}
  .dc-stats{gap:1.4em;}
  .dc-h{font-size:1.9em;}
  .dc-h--m{font-size:1.55em;}
  .dc-cards{grid-template-columns:1fr;gap:.5em;}
  .dc-card{grid-template-columns:auto 1fr;align-items:center;column-gap:.8em;padding:.7em .9em;}
  .dc-card .dc-bar{display:none;}
  .dc-ring{width:1.8em;height:1.8em;}
  .dc-gallery{grid-template-columns:repeat(2,minmax(0,1fr));}
  .dc-gallery i:nth-child(n+5){display:none;}
  .dc-float{right:1em;bottom:1em;}
}

/* 2 · Página para divulgar um serviço: a página rola e os contatos chegam */
.dp{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:clamp(18px,2.6vw,32px);padding:6px 0;}
.dp-page{
  --ink:#1D1A18;--mute:#857B74;--accent:#2F6F8F;--line:#ECE6E0;
  display:grid;gap:1.6em;
  padding:3.4em 1.4em 6.6em;
  font-family:var(--sans);font-size:clamp(6px,4.6cqw,10px);line-height:1.35;color:var(--ink);
  animation:dpScroll 16s ease-in-out infinite alternate;
  animation-play-state:paused;
}
.is-playing .dp-page{animation-play-state:running;}
@keyframes dpScroll{0%,8%{transform:translateY(0);}92%,100%{transform:translateY(calc(-100% + 100cqh));}}
.dp-brand{font-family:var(--display);font-size:1.25em;font-weight:600;}
.dp-hero{display:grid;gap:.85em;}
.dp-kicker{font-size:.78em;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);}
.dp-h{font-family:var(--display);font-size:2em;font-weight:500;line-height:1.1;}
.dp-bars{display:grid;gap:.45em;}
.dp-bars i{display:block;height:.4em;border-radius:1em;background:#E8E3DE;}
.dp-bars i.s{width:66%;}
.dp-btn{justify-self:start;padding:.8em 1.3em;border-radius:99em;background:var(--accent);color:#fff;font-weight:600;}
.dp-img{display:block;aspect-ratio:4/3.1;border-radius:1em;background:radial-gradient(circle at 68% 34%,#F5FBFE 0 12%,transparent 12.5%),linear-gradient(160deg,#CFE4EE,#5E93AF);}
.dp-sec{display:grid;gap:.8em;padding-top:1.4em;border-top:1px solid var(--line);}
.dp-h2{font-family:var(--display);font-size:1.4em;font-weight:500;line-height:1.15;}
.dp-check{display:flex;align-items:center;gap:.6em;}
.dp-check::before{content:"";flex:none;width:1.35em;height:1.35em;border-radius:50%;background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/.85em no-repeat;}
.dp-stars{letter-spacing:.12em;color:#E0A03A;}
.dp-quote{font-family:var(--display);font-size:1.15em;font-style:italic;}
.dp-by{font-size:.85em;color:var(--mute);}
.dp-q{display:flex;justify-content:space-between;padding:.6em 0;border-bottom:1px solid var(--line);}
.dp-q i{font-style:normal;color:var(--accent);}
.dp-field{display:block;height:2.6em;border:1px solid #E1DAD3;border-radius:.5em;}
.dp-cta{
  position:absolute;left:7%;right:7%;bottom:3.6%;z-index:3;
  display:flex;align-items:center;justify-content:center;gap:.5em;
  padding:.95em .6em;border-radius:99em;
  background:#25D366;color:#fff;
  font-size:clamp(9px,5.4cqw,12px);font-weight:600;line-height:1.2;
  box-shadow:0 .9em 1.8em -.7em rgba(37,211,102,.8);
  transition:transform .25s var(--ease);
}
.dp-cta svg{flex:none;width:1.35em;height:1.35em;}
.dp-cta:active,.dp-cta.is-press{transform:scale(.95);}
.dp-side{display:grid;align-content:center;gap:12px;min-width:0;}
.dp-side__label{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:.7rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--dust);}
.dp-side__label b{font-family:var(--display);font-size:1.7rem;font-weight:500;letter-spacing:0;color:var(--starlight);}
.dp-feed{display:grid;gap:10px;margin:0;padding:0;list-style:none;}
.dp-lead{display:grid;grid-template-columns:32px minmax(0,1fr);align-items:start;gap:10px;padding:12px;border:1px solid var(--edge);border-radius:14px;background:rgba(247,233,211,.04);animation:leadIn .6s var(--ease-out);}
.dp-lead__icon{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#25D366;color:#fff;}
.dp-lead__icon svg{width:17px;height:17px;}
.dp-lead--form .dp-lead__icon{background:var(--metal);color:#1A1007;}
.dp-lead__text b{display:block;font-size:.8rem;font-weight:600;line-height:1.3;color:var(--starlight);}
.dp-lead__text span{display:block;margin-top:2px;font-size:.8rem;line-height:1.4;color:var(--dust);}
@keyframes leadIn{from{opacity:0;transform:translateY(-10px);}}

/* 3 · Renovação: o site de 2008 vira o de hoje, no mesmo endereço */
.dr{--red:#D2483F;--green:#1E9E63;}
.dr-old,.dr-new{position:absolute;inset:0;display:flex;flex-direction:column;}
.dr-old{background:#EDEDED;font-family:"Times New Roman",Times,serif;color:#1A1A1A;}
.dr-o-top{display:flex;align-items:baseline;flex-wrap:wrap;gap:.2em 1em;padding:.8em 1.3em;background:linear-gradient(180deg,#4169C0,#1D3A82);color:#fff;border-bottom:.3em solid #F2C230;}
.dr-o-top b{font-size:1.65em;font-weight:700;letter-spacing:.03em;text-shadow:.08em .08em 0 #0B1B44;}
.dr-o-top span{font-size:.95em;font-style:italic;opacity:.9;}
.dr-o-strip{overflow:hidden;padding:.3em 0;background:#FFF5C4;color:#B30000;font-size:.95em;font-weight:700;white-space:nowrap;}
.dr-o-strip span{display:inline-block;padding-left:100%;animation:marquee 16s linear infinite;animation-play-state:paused;}
.is-playing .dr-o-strip span{animation-play-state:running;}
@keyframes marquee{to{transform:translateX(-100%);}}
.dr-o-body{flex:1;display:grid;grid-template-columns:24% minmax(0,1fr);gap:1.2em;padding:1.1em 1.3em;}
.dr-o-side{display:grid;align-content:start;gap:.15em;padding:.6em .7em;background:#DDE5F5;border:1px solid #9CB1DA;}
.dr-o-side i{font-size:.95em;font-style:normal;color:#1B3FA0;text-decoration:underline;}
.dr-o-main{display:grid;align-content:start;gap:.7em;}
.dr-o-main > b{font-size:1.5em;color:#1D3A82;}
.dr-o-text{display:grid;gap:.4em;}
.dr-o-text i{display:block;height:.34em;background:#A5A5A5;}
.dr-o-text i:nth-child(3n){width:84%;}
.dr-o-text i:nth-child(4n){width:92%;}
.dr-o-text i:last-child{width:58%;}
.dr-o-btn{justify-self:start;padding:.35em .9em;border:.14em outset #FF8A80;background:linear-gradient(#FF5B4D,#C8231A);color:#fff;font-family:Arial,sans-serif;font-size:.9em;font-weight:700;}
.dr-o-count{font-family:"Courier New",monospace;font-size:.8em;color:#555;}
.dr-o-build{justify-self:start;padding:.2em .6em;border:.28em solid;border-image:repeating-linear-gradient(135deg,#F2C230 0 .45em,#1A1A1A .45em .9em) 1;background:#F2C230;color:#1A1A1A;font-family:Arial,sans-serif;font-size:.78em;font-weight:700;letter-spacing:.04em;}
.dr-o-foot{padding:.45em 1.3em;background:#CDCDCD;color:#3A3A3A;font-family:Verdana,sans-serif;font-size:.72em;}
.dr-new{background:var(--paper);clip-path:inset(0 100% 0 0);transition:clip-path 1.25s var(--ease-out);}
.dr[data-state="new"] .dr-new{clip-path:inset(0 0 0 0);}
.dr-n-top{display:flex;align-items:center;gap:1.4em;padding:1.05em 2em;background:#fff;border-bottom:1px solid var(--line);}
.dr-n-top b{font-family:var(--display);font-size:1.35em;}
.dr-n-links{display:flex;gap:1.3em;margin-left:auto;color:var(--mute);}
.dr-n-links i{font-style:normal;}
.dr-n-menu{display:none;}
.dr-n-hero{flex:1;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:2em;padding:1.8em 2.1em 1.2em;}
.dr-n-copy{display:grid;gap:1em;}
.dr-n-kicker{font-size:.8em;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);}
.dr-n-h{font-family:var(--display);font-size:2.25em;font-weight:500;line-height:1.08;}
.dr-n-bars{display:grid;gap:.5em;}
.dr-n-bars i{display:block;height:.42em;border-radius:1em;background:#E6DDD0;}
.dr-n-bars i.s{width:60%;}
.dr-n-btn{justify-self:start;display:inline-flex;align-items:center;gap:.5em;padding:.8em 1.3em;border-radius:99em;background:var(--wa);color:#fff;font-weight:600;}
.dr-n-btn svg{width:1.3em;height:1.3em;}
.dr-n-img{display:block;aspect-ratio:1/1.02;border-radius:.9em;background:
  radial-gradient(circle at 30% 28%,#F6E7D0 0 9%,transparent 9.5%),
  linear-gradient(176deg,transparent 58%,rgba(64,42,26,.5) 58.3%),
  linear-gradient(160deg,#D6B48C,#80593A);}
.dr-n-stats{display:flex;gap:2.4em;margin:0 2.1em 1.5em;padding-top:1em;border-top:1px solid var(--line);}
.dr-n-stats span{display:grid;font-size:.85em;color:var(--mute);}
.dr-n-stats b{font-family:var(--display);font-size:1.45em;color:var(--ink);}
.dr-scan{position:absolute;top:0;bottom:0;left:0;z-index:2;width:2px;background:linear-gradient(180deg,transparent,#E9BE8B 20%,#FFF6E6 50%,#E9BE8B 80%,transparent);box-shadow:0 0 18px 4px rgba(233,190,139,.75);opacity:0;pointer-events:none;}
.dr[data-state="new"] .dr-scan{animation:drScan 1.25s var(--ease-out) forwards;}
@keyframes drScan{0%{left:0;opacity:1;}88%{opacity:1;}100%{left:100%;opacity:0;}}
.dr-pin{
  position:absolute;z-index:3;left:var(--x);top:var(--y);
  display:flex;align-items:center;gap:.5em;
  transform:translate(-.95em,-50%);
  transition:left .9s var(--ease-out),top .9s var(--ease-out),opacity .45s var(--ease);
  transition-delay:0s,0s,calc(var(--i) * .45s + .5s);
}
.js .dr-pin{opacity:0;}
.js .is-playing .dr-pin,.js .dr[data-state="new"] .dr-pin{opacity:1;}
.dr[data-state="new"] .dr-pin{left:var(--nx);top:var(--ny);}
.dr-pin > b{flex:none;display:grid;place-items:center;width:1.9em;height:1.9em;border-radius:50%;background:var(--red);color:#fff;font-family:var(--sans);font-size:1em;box-shadow:0 0 0 .32em rgba(210,72,63,.24);transition:background-color .5s var(--ease),box-shadow .5s var(--ease),color .3s var(--ease);}
.dr[data-state="new"] .dr-pin > b{background:var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/1.05em no-repeat;color:transparent;box-shadow:0 0 0 .32em rgba(30,158,99,.22);}
.dr-pin > span{padding:.35em .7em;border-radius:.45em;background:#fff;color:var(--ink);font-family:var(--sans);font-size:.95em;font-weight:500;white-space:nowrap;box-shadow:0 .4em 1em -.3em rgba(0,0,0,.4);}
.dr-pin__new,.dr[data-state="new"] .dr-pin__old{display:none;}
.dr[data-state="new"] .dr-pin__new{display:block;}
.dr-pin--1{--x:60%;--y:33%;--nx:54%;--ny:47%;}
.dr-pin--2{--x:14%;--y:36%;--nx:64.5%;--ny:4.8%;}
.dr-pin--3{--x:47%;--y:95%;--nx:30%;--ny:62%;}
.dr[data-state="new"] .dr-pin--2{flex-direction:row-reverse;transform:translate(calc(-100% + .95em),-50%);}
@container (max-width:520px){
  .dr-old{font-size:.58em;}
  .dr-n-links{display:none;}
  .dr-n-menu{display:grid;gap:.32em;margin-left:auto;}
  .dr-n-menu i{display:block;width:1.5em;height:.14em;border-radius:1em;background:var(--ink);}
  .dr-n-hero{grid-template-columns:1fr;padding:1.4em 1.3em .8em;}
  .dr-n-img{display:none;}
  .dr-n-h{font-size:1.9em;}
  .dr-n-stats{gap:1.4em;margin:0 1.3em 1.2em;}
  .dr-pin--1{--x:60%;--y:30%;--nx:48%;--ny:48%;}
  .dr-pin--2{--x:9%;--y:42%;--nx:88%;--ny:8%;}
  .dr-pin--3{--x:24%;--y:95%;--nx:50%;--ny:65.5%;}
}

/* 4 · Site que você mesmo atualiza: muda no painel, aparece no celular */
.da{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(16px,2.4vw,28px);}
.da-panel{display:grid;gap:11px;padding:14px;border-radius:14px;background:#fff;color:#2A241F;box-shadow:0 26px 50px -22px rgba(0,0,0,.9);font-family:var(--sans);}
.da-panel__top{display:flex;align-items:center;gap:6px;margin:0;padding-bottom:10px;border-bottom:1px solid #EEE7DC;font-size:11px;color:#8C8176;}
.da-panel__top svg{flex:none;width:12px;height:12px;color:#9A6A33;}
.da-panel__top b{font-size:12.5px;font-weight:600;color:#2A241F;}
.da-panel__top span{margin-left:auto;}
.da-field{display:grid;gap:5px;font-size:11px;font-weight:500;color:#6E645A;}
.da-field input{width:100%;min-width:0;padding:8px 10px;border:1px solid #E2D9CC;border-radius:8px;background:#FBF8F3;font-size:13px;color:#1E1914;outline:none;transition:border-color .2s var(--ease),box-shadow .2s var(--ease);}
.da-field input:focus,.da-field input.is-typing{border-color:#9A6A33;box-shadow:0 0 0 3px rgba(154,106,51,.18);}
@media (pointer:coarse){.da-field input{font-size:16px;}}
.da-photos{display:flex;gap:7px;}
.da-photos button{width:36px;height:27px;border-radius:6px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);transition:transform .2s var(--ease),box-shadow .2s var(--ease);}
.da-photos button:hover{transform:translateY(-1px);}
.da-photos button[aria-pressed="true"]{box-shadow:0 0 0 2px #fff,0 0 0 3.5px #9A6A33;}
.da-photos button:focus-visible{outline:2px solid #9A6A33;outline-offset:3px;}
.da-photos [data-da-photo="1"]{background:linear-gradient(150deg,#C9986A,#5B3B25);}
.da-photos [data-da-photo="2"]{background:linear-gradient(150deg,#86ADA7,#2E4B49);}
.da-photos [data-da-photo="3"]{background:linear-gradient(150deg,#D29A8E,#6E3A34);}
.da-status{display:flex;align-items:center;gap:7px;margin:0;font-size:11px;font-weight:500;color:#1E9E63;}
.da-status::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px rgba(30,158,99,.18);}
.da-status.is-busy{color:#B7791F;}
.da-site{--ink:#1E1914;--wa:#25D366;display:flex;flex-direction:column;height:100%;font-family:var(--sans);font-size:clamp(6px,4.6cqw,10px);line-height:1.35;color:var(--ink);}
.da-nav{display:flex;align-items:center;justify-content:space-between;padding:3.4em 1.4em 1em;}
.da-nav b{font-family:var(--display);font-size:1.25em;}
.da-burger{display:grid;gap:.32em;}
.da-burger i{display:block;width:1.5em;height:.14em;border-radius:1em;background:var(--ink);}
.da-hero{position:relative;display:flex;align-items:flex-end;min-height:48%;margin:0 .9em;padding:1.3em;overflow:hidden;border-radius:1em;transition:background .6s var(--ease);}
.da-hero[data-photo="1"]{background:radial-gradient(circle at 78% 22%,#F7DDB5 0 8%,transparent 8.5%),linear-gradient(150deg,#C18E60,#4E3321);}
.da-hero[data-photo="2"]{background:radial-gradient(circle at 78% 22%,#E4F2EE 0 8%,transparent 8.5%),linear-gradient(150deg,#7FA6A0,#243F3D);}
.da-hero[data-photo="3"]{background:radial-gradient(circle at 78% 22%,#FBE4DC 0 8%,transparent 8.5%),linear-gradient(150deg,#C98A7E,#5A2E29);}
.da-hero::before{content:"";position:absolute;right:8%;bottom:0;width:34%;aspect-ratio:1/1.6;background:radial-gradient(circle at 50% 20%,rgba(255,255,255,.3) 0 17%,transparent 17.5%),radial-gradient(ellipse 50% 40% at 50% 100%,rgba(255,255,255,.24) 0 98%,transparent 100%);}
.da-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,12,8,0) 25%,rgba(18,12,8,.72));}
.da-copy{position:relative;z-index:1;display:grid;gap:.6em;color:#fff;}
.da-kicker{font-size:.78em;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#F4D8B0;}
.da-h{font-family:var(--display);font-size:1.85em;font-weight:500;line-height:1.1;overflow-wrap:anywhere;border-radius:.15em;}
.da-price{justify-self:start;display:inline-flex;align-items:baseline;gap:.45em;padding:.45em .9em;border-radius:99em;background:rgba(255,255,255,.16);font-size:.95em;}
.da-price b{font-size:1.25em;border-radius:.3em;}
.is-flash{animation:daFlash .9s var(--ease);}
@keyframes daFlash{from{background-color:rgba(233,190,139,.6);}to{background-color:rgba(233,190,139,0);}}
.da-body{display:grid;gap:1em;padding:1.2em 1.4em;}
.da-btn{padding:.85em;border-radius:99em;background:var(--wa);color:#fff;font-weight:600;text-align:center;}
.da-list{display:grid;}
.da-list span{display:flex;align-items:center;gap:.6em;padding:.6em 0;border-bottom:1px solid #EEE8E1;}
.da-list i{flex:none;width:1.8em;height:1.8em;border-radius:.4em;background:#F1E6D6;}

/* 5 · Imobiliária: busca, filtros e WhatsApp em cada anúncio */
.di{--navy:#1F3A5F;display:flex;flex-direction:column;background:#F6F4F0;}
.dm-web__view.di{aspect-ratio:16/7.4;}
.di-top{display:flex;align-items:center;gap:1.4em;padding:1em 1.8em;background:#fff;border-bottom:1px solid var(--line);}
.di-logo{font-family:var(--display);font-size:1.3em;color:var(--navy);}
.di-logo span{margin-left:.35em;font-family:var(--sans);font-size:.72em;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);}
.di-links{display:flex;gap:1.2em;margin-left:auto;color:var(--mute);}
.di-links i{font-style:normal;}
.di-bar{display:flex;flex-wrap:wrap;align-items:center;gap:.7em 1em;padding:1em 1.8em .9em;}
.di-seg{display:inline-flex;padding:.22em;border-radius:99em;background:#fff;box-shadow:inset 0 0 0 1px var(--line);}
.di-seg button{padding:.5em 1em;border-radius:99em;color:var(--mute);font-weight:500;line-height:1.2;transition:background .3s var(--ease),color .3s var(--ease);}
.di-seg button[aria-pressed="true"]{background:var(--navy);color:#fff;}
.di-seg button:focus-visible{outline:2px solid var(--navy);outline-offset:1px;}
.di-count{margin-left:auto;font-size:.95em;color:var(--mute);}
.di-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-content:start;gap:1em;margin:0;padding:0 1.8em 1.6em;list-style:none;}
.di-card{position:relative;overflow:hidden;border-radius:.8em;background:#fff;box-shadow:0 .35em 1em -.45em rgba(31,58,95,.3);}
.di-card[hidden]{display:none;}
.di-card.is-in{animation:diIn .5s var(--ease-out);}
@keyframes diIn{from{opacity:0;transform:translateY(.6em) scale(.97);}}
.di-photo{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;background:linear-gradient(180deg,var(--sky,#C9DCE8) 0 70%,#C3CBB4 70%);}
.di-photo::before{content:"";position:absolute;bottom:30%;}
.di-photo--apto::before{left:27%;right:27%;top:12%;background:repeating-linear-gradient(180deg,var(--b,#E9DFD2) 0 .55em,rgba(70,92,112,.38) .55em .95em);box-shadow:inset 0 0 0 .12em rgba(0,0,0,.05);}
.di-photo--casa::before{left:16%;right:16%;top:34%;clip-path:polygon(0 36%,50% 0,100% 36%,100% 100%,0 100%);background:linear-gradient(180deg,#9C5E3E 0 36%,var(--b,#EFE4D2) 36%);}
.di-photo--casa::after{content:"";position:absolute;left:45%;bottom:30%;width:10%;height:17%;border-radius:.2em .2em 0 0;background:#7A5A40;}
.di-tag{position:absolute;top:.55em;left:.55em;z-index:1;padding:.22em .55em;border-radius:.3em;background:rgba(255,255,255,.94);font-size:.78em;font-weight:600;color:var(--navy);}
.di-info{display:grid;gap:.25em;padding:.65em .75em .8em;}
.di-info b{font-size:1.2em;color:var(--navy);}
.di-name{overflow:hidden;font-size:.9em;color:var(--mute);white-space:nowrap;text-overflow:ellipsis;}
.di-specs{display:flex;gap:.75em;margin-top:.15em;}
.di-specs i{display:inline-flex;align-items:center;gap:.25em;font-size:.9em;font-style:normal;color:var(--ink);}
.di-specs i::before{content:"";width:1.15em;height:1.15em;background:currentColor;opacity:.72;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat;}
.di-q{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 19v-8h18v8M3 15h18M6.5 11V8h5v3'/%3E%3C/svg%3E");}
.di-b{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16v1.5a5.5 5.5 0 0 1-5.5 5.5h-5A5.5 5.5 0 0 1 4 13.5zM6.5 12V6.5a2 2 0 0 1 4 0M8 19l-1 2M16 19l1 2'/%3E%3C/svg%3E");}
.di-v{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 16.5h15V13l-2-4.5h-11l-2 4.5zM7 16.5v2M17 16.5v2'/%3E%3C/svg%3E");}
.di-wa{position:absolute;top:.5em;right:.5em;z-index:1;display:grid;place-items:center;width:2.3em;height:2.3em;border-radius:50%;background:var(--wa);color:#fff;box-shadow:0 .3em .8em -.2em rgba(0,0,0,.35);transition:transform .25s var(--ease);}
.di-wa svg{width:1.3em;height:1.3em;}
.di-wa:hover{transform:scale(1.08);}
.di-wa:focus-visible{outline:2px solid var(--navy);outline-offset:2px;}
.di-toast{position:absolute;left:50%;bottom:1em;z-index:3;width:max-content;max-width:86%;margin:0;padding:.7em 1.1em;border-radius:.7em;background:#17261C;color:#fff;font-size:.95em;line-height:1.35;box-shadow:0 .8em 1.8em -.6em rgba(0,0,0,.5);opacity:0;transform:translate(-50%,.8em);transition:opacity .35s var(--ease),transform .45s var(--ease-out);pointer-events:none;}
.di-toast.is-on{opacity:1;transform:translate(-50%,0);}
@container (max-width:520px){
  .dm-web__view.di{aspect-ratio:4/5.6;}
  .di-links{display:none;}
  .di-top,.di-bar{padding-inline:1.2em;}
  .di-count{width:100%;margin-left:0;}
  .di-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.7em;padding:0 1.2em 1.2em;}
  .di-photo{aspect-ratio:16/9;}
}

/* 6 · Sistema: os pedidos andam de coluna em coluna */
.ds{--blue:#3B7FC4;--amber:#D4952A;--green:#1E9E63;display:grid;grid-template-columns:19% minmax(0,1fr);background:#F4F2EE;}
.ds-side{display:grid;align-content:start;gap:.25em;padding:1.3em .9em;background:#1C1714;color:#B8AB9E;}
.ds-logo{display:flex;align-items:center;gap:.45em;margin-bottom:.9em;font-family:var(--display);font-size:1.2em;color:#F3E3C8;}
.ds-logo svg{width:.95em;height:.95em;fill:#E9BE8B;}
.ds-side i{padding:.55em .75em;border-radius:.5em;font-size:.95em;font-style:normal;}
.ds-side i.is-on{background:rgba(233,190,139,.14);color:#F3E3C8;}
.ds-main{display:flex;flex-direction:column;gap:.9em;min-width:0;padding:1.3em 1.5em;}
.ds-head{display:flex;align-items:center;justify-content:space-between;}
.ds-head b{font-family:var(--display);font-size:1.4em;}
.ds-user{display:grid;place-items:center;width:2.3em;height:2.3em;border-radius:50%;background:var(--accent);color:#fff;font-size:.85em;font-weight:600;}
.ds-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7em;}
.ds-stats span{display:grid;padding:.6em .85em;border-radius:.7em;background:#fff;box-shadow:inset 0 0 0 1px var(--line);font-size:.82em;color:var(--mute);}
.ds-stats b{font-family:var(--display);font-size:1.75em;line-height:1.1;color:var(--ink);}
.ds-board{flex:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7em;min-height:0;}
.ds-col{display:flex;flex-direction:column;gap:.55em;min-height:0;overflow:hidden;padding:.65em;border-radius:.8em;background:rgba(30,25,20,.05);}
.ds-col[data-col="novo"]{--c:var(--blue);}
.ds-col[data-col="and"]{--c:var(--amber);}
.ds-col[data-col="ok"]{--c:var(--green);}
.ds-col__t{display:flex;align-items:center;gap:.5em;margin:0;font-size:.76em;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);}
.ds-col__t::before{content:"";width:.6em;height:.6em;border-radius:50%;background:var(--c);}
.ds-list{display:grid;gap:.5em;margin:0;padding:0;list-style:none;}
.ds-card{display:grid;gap:.12em;width:100%;padding:.6em .7em;border-radius:.6em;background:#fff;text-align:left;box-shadow:0 .2em .6em -.3em rgba(30,25,20,.35),inset .22em 0 0 var(--c);transition:transform .25s var(--ease);}
.ds-card:not(:disabled):hover{transform:translateY(-.12em);}
.ds-card:focus-visible{outline:2px solid var(--accent);outline-offset:1px;}
.ds-card:disabled{cursor:default;}
.ds-id{font-size:.78em;color:var(--mute);}
.ds-card b{font-size:1em;}
.ds-job{overflow:hidden;font-size:.85em;color:var(--mute);white-space:nowrap;text-overflow:ellipsis;}
.ds-card.is-new .ds-id{font-weight:600;color:var(--blue);}
.ds-card.is-moved{animation:dsIn .55s var(--ease-out);}
@keyframes dsIn{from{opacity:0;transform:translateY(-.5em) scale(.96);}}
.ds-col[data-col="ok"] .ds-card b::after{content:" ✓";color:var(--green);}
@container (max-width:520px){
  .dm-web__view.ds{aspect-ratio:4/4.7;}
  .ds{grid-template-columns:1fr;}
  .ds-side{display:none;}
  .ds-main{padding:1.1em 1em;}
  .ds-board{gap:.45em;}
  .ds-col{padding:.45em;}
  .ds-job{display:none;}
  .ds-stats span{padding:.5em .6em;}
}

/* --- Cuidado mensal --- */
.care{
  display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  gap:clamp(28px,4vw,56px);
  margin-top:clamp(52px,6vw,84px);
  padding:clamp(22px,3.4vw,48px);
  border-radius:24px;
  background:linear-gradient(160deg,#EDE5D8,#E5DBCA);
  box-shadow:inset 0 0 0 1px var(--edge);
}
.care__kicker{display:flex;align-items:center;gap:10px;font-size:var(--fs-micro);font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--bronze-lit);}
.care__kicker svg{flex:none;width:20px;height:20px;}
.care__title{margin-top:14px;font-size:clamp(1.7rem,2.8vw,2.4rem);line-height:1.1;}
.care__lede{margin-top:14px;max-width:46ch;color:var(--dust);}
.pulse{margin-top:26px;padding:16px 18px 18px;border-radius:16px;background:linear-gradient(160deg,#1E1712,#0C0A08);box-shadow:0 24px 44px -30px rgba(35,26,18,.9);}
.pulse__top{display:flex;align-items:center;gap:8px;margin:0;font-size:.78rem;color:var(--dust);}
.pulse__top i{flex:none;width:8px;height:8px;border-radius:50%;background:#3DDC84;box-shadow:0 0 0 4px rgba(61,220,132,.16);}
.pulse__top b{overflow:hidden;font-weight:500;color:var(--starlight);white-space:nowrap;text-overflow:ellipsis;}
.pulse__top span{margin-left:auto;font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;}
.pulse__line{display:block;width:100%;height:58px;margin:10px 0 8px;overflow:visible;}
.pulse__base{fill:none;stroke:rgba(233,190,139,.16);stroke-width:1.5;}
.pulse__beat{fill:none;stroke:#E9BE8B;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:16 100;stroke-dashoffset:116;filter:drop-shadow(0 0 4px rgba(233,190,139,.8));animation:beat 3.4s linear infinite;animation-play-state:paused;}
.care.is-live .pulse__beat{animation-play-state:running;}
@keyframes beat{to{stroke-dashoffset:0;}}
.pulse__list{display:grid;gap:7px;margin:0;padding:0;list-style:none;}
.pulse__list li{display:flex;align-items:center;gap:9px;font-size:.84rem;color:var(--parchment);}
.pulse__list li::before{content:"";flex:none;width:15px;height:15px;border-radius:50%;background:rgba(61,220,132,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233DDC84' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/9px no-repeat;}
.care__plans{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:stretch;}
.plan{display:flex;flex-direction:column;gap:12px;padding:clamp(18px,2vw,24px);border-radius:18px;background:#FBF7F0;box-shadow:0 18px 40px -30px rgba(35,26,18,.55),inset 0 0 0 1px var(--edge);}
.plan--plus{background:radial-gradient(ellipse 80% 60% at 20% 0%,rgba(192,128,67,.2),transparent 60%),linear-gradient(165deg,#241C16,#100C09);box-shadow:0 26px 50px -30px rgba(35,26,18,.9),inset 0 0 0 1px var(--edge-strong);}
.plan__name{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;font-size:.72rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--bronze-lit);}
.plan__tag{padding:3px 9px;border-radius:99px;background:var(--metal);font-size:.62rem;letter-spacing:.08em;color:#1A1007;}
.plan__for{font-family:var(--display);font-size:clamp(1.12rem,1.5vw,1.3rem);line-height:1.35;color:var(--starlight);}
.plan__list{display:grid;gap:8px;margin:2px 0 6px;padding:14px 0 0;border-top:1px solid var(--edge);list-style:none;}
.plan__list li{position:relative;padding-left:23px;font-size:.88rem;line-height:1.4;color:var(--parchment);}
.plan__list li::before{content:"";position:absolute;left:0;top:.12em;width:15px;height:15px;border-radius:50%;background:rgba(154,106,51,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237B4920' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/9px no-repeat;}
.plan--plus .plan__list li::before{background-color:rgba(233,190,139,.14);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E9BE8B' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E");}
.plan__cta{width:100%;margin-top:auto;padding-inline:16px;}

/* --- Telas menores --- */
@media (max-width:980px){
  .vit{grid-template-columns:minmax(0,1fr);}
  .care{grid-template-columns:minmax(0,1fr);}
}
@media (max-width:700px){
  .menu__head{
    grid-template-columns:38px minmax(0,1fr) 38px;
    grid-template-areas:"icon name toggle" "icon line toggle" "icon price toggle";
    align-items:start;
    column-gap:14px;row-gap:8px;
    padding:22px 0;
  }
  .menu__icon{align-self:start;}
  .menu__dots{display:none;}
  .menu__toggle{align-self:start;width:38px;height:38px;}
  .menu__peek{margin-top:4px;}
  .menu__badge{display:flex;width:max-content;margin:8px 0 0;}
  .menu__cap span + span{display:none;}
}
@media (max-width:560px){
  .vit{padding:14px 14px 22px;border-radius:18px;}
  .ficha__inc{grid-template-columns:minmax(0,1fr);}
  .dp,.da{grid-template-columns:minmax(0,1fr);justify-items:center;}
  .dp-side,.da-panel{width:100%;}
  .dp-feed li:nth-child(n+3){display:none;}
  .da-phone{order:-1;}
  .care__plans{grid-template-columns:minmax(0,1fr);}
}

/* Movimento reduzido: cada demonstração fica parada no estado mais claro */
@media (prefers-reduced-motion:reduce){
  .dp-page,.pulse__beat{animation:none;}
  .pulse__beat{stroke-dasharray:none;stroke-opacity:.5;}
  .dr-o-strip span{padding-left:0;animation:none;}
}

/* ==========================================================================
   Trabalhos
   ========================================================================== */
.work__body{display:grid;gap:16px;align-content:center;}
.work__meta{
  display:flex;align-items:center;gap:10px;
  font-size:var(--fs-micro);
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--dust-dim);
}
.work__meta i{width:3px;height:3px;border-radius:50%;background:var(--bronze);display:block;flex:none;}
.work__body h3{font-size:clamp(1.4rem,2.2vw,1.9rem);color:var(--starlight);}
.work__body p{color:var(--dust);font-size:.9688rem;max-width:44ch;}
.work__results{
  display:flex;flex-wrap:wrap;
  gap:clamp(18px,2.6vw,34px);
  padding-top:16px;
  border-top:1px solid var(--edge);
}
.work__result{display:grid;gap:1px;}
.work__result b{
  font-family:var(--display);
  font-size:1.45rem;
  font-weight:500;
  color:var(--bronze-lit);
  font-variant-numeric:tabular-nums;
}
.work__result span{font-size:.75rem;color:var(--dust-dim);letter-spacing:.04em;}

/* --- Vitrine de projetos: os sites reais rodando dentro da página ---
   Um único palco para todos os projetos. O iframe carrega o site em
   largura real (1440 no computador, 402 no celular) e é reduzido com
   transform, então o layout exibido é o de verdade, não um recorte. */
.works{background:linear-gradient(180deg,var(--umber),var(--obsidian) 78%);}

.cases{
  display:grid;
  grid-template-columns:minmax(0,320px) minmax(0,1fr);
  grid-template-areas:"niches niches" "list stage" "panels stage";
  grid-template-rows:auto auto 1fr;
  gap:30px clamp(32px,4.5vw,64px);
  align-items:start;
}
.cases__switch{grid-area:list;}
.cases__stage{grid-area:stage;min-width:0;}
.cases__panels{grid-area:panels;}

/* --- Nichos: régua que filtra a lista de projetos --- */
.cases__niches{
  grid-area:niches;
  display:flex;
  gap:clamp(18px,3vw,44px);
  border-bottom:1px solid var(--edge);
  overflow-x:auto;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
.cases__niches::-webkit-scrollbar{display:none;}
.cases__niche{
  position:relative;
  flex:none;
  display:inline-flex;
  align-items:flex-start;
  gap:7px;
  padding:4px 0 18px;
  color:var(--dust);
  font-size:.75rem;
  font-weight:500;
  letter-spacing:.18em;
  text-transform:uppercase;
  white-space:nowrap;
  transition:color .4s var(--ease);
  -webkit-tap-highlight-color:transparent;
}
.cases__niche::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-1px;
  height:2px;
  background:linear-gradient(90deg,transparent,var(--bronze-lit) 20%,var(--starlight) 50%,var(--bronze-lit) 80%,transparent);
  box-shadow:0 0 14px 1px rgba(233,190,139,.4);
  transform:scaleX(0);
  transition:transform .55s var(--ease-out);
}
.cases__niche-icon{
  display:inline-flex;
  width:16px;height:16px;
  margin-right:3px;
  color:var(--dust-dim);
  transform:translateY(-2px);
  transition:color .4s var(--ease);
}
.cases__niche-icon svg{width:100%;height:100%;}
.cases__niche[aria-pressed="true"] .cases__niche-icon{color:var(--bronze-lit);}
.cases__niche-count{
  font-family:var(--display);
  font-size:.8rem;
  letter-spacing:0;
  color:var(--dust-dim);
  font-variant-numeric:tabular-nums;
  transform:translateY(-4px);
  transition:color .4s var(--ease);
}
.cases__niche[aria-pressed="true"]{color:var(--starlight);}
.cases__niche[aria-pressed="true"] .cases__niche-count{color:var(--bronze-lit);}
.cases__niche[aria-pressed="true"]::after{transform:none;}
@media (hover:hover){
  .cases__niche[aria-pressed="false"]:hover{color:var(--parchment);}
}
.cases__niche:focus-visible{outline:1px solid var(--bronze-lit);outline-offset:4px;}
.cases__tab[hidden]{display:none;}

/* --- Lista de projetos --- */
.cases__switch{position:relative;display:grid;border-top:1px solid var(--edge);}
.cases__light{
  position:absolute;
  top:0;left:0;
  z-index:2;
  width:2px;
  height:var(--lh,80px);
  transform:translateY(var(--ly,0px));
  background:linear-gradient(180deg,transparent,var(--bronze-lit) 18%,var(--starlight) 50%,var(--bronze-lit) 82%,transparent);
  box-shadow:0 0 18px 2px rgba(233,190,139,.45);
  transition:transform .6s var(--ease-out),height .6s var(--ease-out);
  pointer-events:none;
}
.cases__tab{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:16px;
  width:100%;
  padding:18px 12px 18px 22px;
  text-align:left;
  border-bottom:1px solid var(--edge);
  transition:background .5s var(--ease);
  -webkit-tap-highlight-color:transparent;
}
.cases__tab[aria-selected="true"]{background:linear-gradient(90deg,rgba(192,128,67,.14),rgba(192,128,67,0) 82%);}
.cases__num{
  font-family:var(--display);
  font-size:.95rem;
  color:var(--dust-dim);
  font-variant-numeric:tabular-nums;
  transition:color .4s var(--ease);
}
.cases__tab-text{display:grid;gap:3px;min-width:0;}
.cases__tab-niche{
  font-size:.6875rem;
  font-weight:500;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--bronze-lit);
}
.cases__tab-name{
  font-family:var(--display);
  font-size:1.15rem;
  font-weight:500;
  line-height:1.25;
  color:var(--dust);
  transition:color .4s var(--ease);
}
.cases__tab-arrow{
  width:18px;height:18px;
  color:var(--bronze-lit);
  opacity:0;
  transform:translateX(-8px);
  transition:opacity .4s var(--ease),transform .5s var(--ease-out);
}
.cases__tab[aria-selected="true"] .cases__tab-name{color:var(--starlight);}
.cases__tab[aria-selected="true"] .cases__num{color:var(--bronze-lit);}
.cases__tab[aria-selected="true"] .cases__tab-arrow{opacity:1;transform:none;}
@media (hover:hover){
  .cases__tab[aria-selected="false"]:hover .cases__tab-name{color:var(--parchment);}
  .cases__tab[aria-selected="false"]:hover .cases__tab-arrow{opacity:.4;transform:translateX(-3px);}
}

.cases__panel[hidden]{display:none;}
.js .cases__panel{animation:panelIn .6s var(--ease-out);}

/* --- Palco --- */
.live{display:grid;gap:16px;}
.live__toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;}

.seg{
  display:inline-flex;
  gap:2px;
  padding:3px;
  border:1px solid var(--edge);
  border-radius:99px;
  background:rgba(28,21,17,.55);
}
.seg__btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 17px;
  border-radius:99px;
  font-size:.8125rem;
  font-weight:500;
  color:var(--dust);
  transition:background .35s var(--ease),color .35s var(--ease);
}
.seg__btn svg{width:16px;height:16px;flex:none;}
.seg__btn[aria-pressed="true"]{background:var(--metal);color:#1A1007;}
@media (hover:hover){.seg__btn[aria-pressed="false"]:hover{color:var(--parchment);}}

.live__actions{display:flex;align-items:center;gap:8px;}
.live__fs,
.live__exit{
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 15px;
  border:1px solid var(--edge-strong);
  border-radius:99px;
  font-size:.8125rem;
  font-weight:500;
  color:var(--parchment);
  transition:border-color .3s var(--ease),color .3s var(--ease),background .3s var(--ease);
}
.live__fs svg,.live__exit svg{width:15px;height:15px;flex:none;}
.live__fs:hover,.live__exit:hover{border-color:var(--bronze);color:var(--starlight);background:rgba(192,128,67,.08);}
.live__exit{border-color:rgba(111,207,151,.5);}
.live__exit[hidden]{display:none;}

.live__screen{position:relative;display:grid;place-items:center;min-height:clamp(420px,44vw,610px);}
.live[data-view="desktop"] .phone,
.live[data-view="mobile"] .browser{display:none;}
.js .live__screen > *{animation:panelIn .55s var(--ease-out);}

.live__badge{
  display:inline-flex;align-items:center;gap:7px;
  font-size:.6875rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  color:#8FDCAE;
  white-space:nowrap;
}
.live__badge i{
  display:block;
  width:7px;height:7px;border-radius:50%;
  background:#6FCF97;
  animation:livePulse 2s ease-out infinite;
}
@keyframes livePulse{
  0%{box-shadow:0 0 0 0 rgba(111,207,151,.55);}
  100%{box-shadow:0 0 0 9px rgba(111,207,151,0);}
}

.live__note{
  display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px 8px;
  font-size:.78rem;
  color:var(--dust-dim);
  text-align:center;
}
.live__note .live__domain{color:var(--dust);}

/* --- Navegador --- */
.browser{
  width:100%;
  overflow:hidden;
  border:1px solid rgba(233,190,139,.2);
  border-radius:10px;
  background:#15110E;
  box-shadow:0 50px 100px -50px rgba(0,0,0,.95),0 0 0 1px rgba(0,0,0,.45);
}
.browser__bar{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
  padding:10px 14px;
  background:linear-gradient(180deg,#241D18,#1A1511);
  border-bottom:1px solid rgba(0,0,0,.55);
}
.browser__dots{display:flex;gap:7px;}
.browser__dots i{display:block;width:11px;height:11px;border-radius:50%;opacity:.85;}
.browser__dots i:nth-child(1){background:#D9695F;}
.browser__dots i:nth-child(2){background:#D9A441;}
.browser__dots i:nth-child(3){background:#6DB872;}
.browser__url{
  justify-self:center;
  display:inline-flex;align-items:center;gap:7px;
  min-width:0;max-width:100%;
  padding:6px 18px;
  border-radius:8px;
  background:rgba(0,0,0,.38);
  font-size:.75rem;
  color:var(--dust);
}
.browser__url .live__domain{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.browser__url svg{width:12px;height:12px;flex:none;color:#6FCF97;}

/* --- Área onde o site roda (comum aos dois aparelhos) --- */
.live__viewport{position:relative;overflow:hidden;background:#0F0C0A;}
.browser .live__viewport{aspect-ratio:16/10;}
.live__poster{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;object-position:top center;
  transition:opacity .6s var(--ease);
}
.live__frame{
  position:absolute;top:0;left:0;
  border:0;
  background:#fff;
  transform-origin:0 0;
  opacity:0;
  pointer-events:none;
  transition:opacity .6s var(--ease);
}
.live__viewport.is-loaded .live__frame{opacity:1;}
.live__viewport.is-loaded .live__poster{opacity:0;}

.live__loading{
  position:absolute;left:50%;bottom:16px;z-index:2;
  display:inline-flex;align-items:center;gap:9px;
  padding:7px 14px;
  border-radius:99px;
  background:rgba(10,8,7,.82);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  font-size:.72rem;
  color:var(--parchment);
  white-space:nowrap;
  transform:translateX(-50%);
  opacity:0;
  transition:opacity .4s var(--ease);
  pointer-events:none;
}
.live__loading i{
  display:block;
  width:12px;height:12px;border-radius:50%;
  border:1.5px solid rgba(233,190,139,.28);
  border-top-color:var(--bronze-lit);
  animation:spin .8s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg);}}
.live__viewport.is-loading:not(.is-loaded) .live__loading{opacity:1;}

/* Capa: o site aparece rodando por baixo; um clique libera a navegação.
   Sem ela, a roda do mouse ficaria presa dentro do site enquanto o
   visitante só queria continuar descendo a página. */
.live__cover{
  position:absolute;inset:0;z-index:3;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:8px;
  padding:0 16px 22px;
  background:linear-gradient(180deg,transparent 52%,rgba(10,8,7,.62));
  cursor:pointer;
  transition:opacity .4s var(--ease),visibility 0s linear .4s;
}
.live__cta{
  display:inline-flex;align-items:center;gap:9px;
  padding:11px 20px;
  border-radius:99px;
  background:var(--metal);
  color:#1A1007;
  font-size:.875rem;font-weight:600;
  box-shadow:0 14px 34px -14px rgba(0,0,0,.85);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);
}
.live__cta svg{width:17px;height:17px;flex:none;}
.live__sub{font-size:.75rem;color:rgba(247,233,211,.9);text-shadow:0 1px 10px rgba(0,0,0,.85);}
.live__cover:hover .live__cta,
.live__cover:focus-visible .live__cta{transform:translateY(-2px);box-shadow:0 20px 40px -14px rgba(192,128,67,.7);}
.live__viewport.is-live .live__cover{opacity:0;visibility:hidden;}
.live__viewport.is-live .live__frame{pointer-events:auto;}

/* --- iPhone 17 ---
   Tudo derivado da largura (--pw) e da unidade --u = 1pt de tela do
   aparelho (tela de 402 × 874 pt), então as proporções — bordas finas,
   raio dos cantos, Dynamic Island, barra de status — se mantêm em
   qualquer tamanho. */
.phone{
  --pw:284px;
  --edge:calc(var(--pw) * .014);
  --bez:calc(var(--pw) * .028);
  --r:calc(var(--pw) * .172);
  --sw:calc(var(--pw) - 2 * (var(--edge) + var(--bez)));
  --u:calc(var(--sw) / 402);
  position:relative;
  width:var(--pw);
  filter:drop-shadow(0 40px 50px rgba(0,0,0,.55));
}
.phone__frame{
  position:relative;
  z-index:1;
  padding:var(--edge);
  border-radius:var(--r);
  background:linear-gradient(140deg,#A7A29B 0%,#4E4A45 9%,#27241F 30%,#1C1A17 52%,#2C2925 74%,#5A554F 90%,#B5AFA7 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.14),
    inset 0 1px 1px rgba(255,255,255,.28),
    0 0 0 1px rgba(0,0,0,.7);
}
.phone__bezel{
  padding:var(--bez);
  border-radius:calc(var(--r) - var(--edge));
  background:#020202;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);
}
.phone__screen{
  position:relative;
  display:flex;
  flex-direction:column;
  width:var(--sw);
  aspect-ratio:402 / 874;
  overflow:hidden;
  border-radius:calc(var(--r) - var(--edge) - var(--bez));
  background:#000;
  isolation:isolate;
}
.phone__status{
  position:relative;
  flex:none;
  display:flex;align-items:center;justify-content:space-between;
  height:calc(54 * var(--u));
  padding:calc(5 * var(--u)) calc(30 * var(--u)) 0 calc(42 * var(--u));
  background:var(--status-bg,#FBF8F2);
  color:var(--status-ink,#1B1712);
  transition:background .5s var(--ease),color .5s var(--ease);
}
.phone__time{
  font-family:-apple-system,"SF Pro Text","Segoe UI",system-ui,sans-serif;
  font-size:calc(16.5 * var(--u));
  font-weight:600;
  letter-spacing:-.01em;
}
.phone__island{
  position:absolute;
  left:50%;top:calc(11 * var(--u));
  width:calc(125 * var(--u));
  height:calc(37 * var(--u));
  border-radius:99px;
  background:#000;
  transform:translateX(-50%);
}
.phone__icons{display:flex;align-items:center;gap:calc(6 * var(--u));}
.phone__icons svg{width:auto;height:calc(11.5 * var(--u));fill:currentColor;}
.phone__icons svg:last-child{height:calc(12.5 * var(--u));}
.phone .live__viewport{flex:1;min-height:0;}
.phone .live__poster{object-position:top center;}
.phone__home{
  position:absolute;
  left:50%;bottom:calc(8 * var(--u));z-index:4;
  width:calc(139 * var(--u));
  height:calc(5 * var(--u));
  border-radius:99px;
  background:rgba(12,12,12,.78);
  box-shadow:0 0 0 .5px rgba(255,255,255,.35);
  transform:translateX(-50%);
  pointer-events:none;
}
.phone__glare{
  position:absolute;inset:0;z-index:5;
  border-radius:var(--r);
  background:linear-gradient(118deg,rgba(255,255,255,.1) 0%,rgba(255,255,255,0) 26%,rgba(255,255,255,0) 78%,rgba(255,255,255,.05) 100%);
  pointer-events:none;
}
.phone__btn{
  position:absolute;z-index:0;
  width:calc(var(--pw) * .014);
  border-radius:3px;
  background:linear-gradient(90deg,#3E3A35,#9C968F 55%,#4A4540);
}
.phone__btn--action{left:calc(var(--pw) * -.009);top:15.5%;height:4.6%;}
.phone__btn--volup{left:calc(var(--pw) * -.009);top:23.5%;height:8.2%;}
.phone__btn--voldown{left:calc(var(--pw) * -.009);top:33.5%;height:8.2%;}
.phone__btn--side{right:calc(var(--pw) * -.009);top:26%;height:12.5%;}
.phone__btn--camera{
  right:calc(var(--pw) * -.006);top:56%;height:7%;
  width:calc(var(--pw) * .01);
  background:linear-gradient(90deg,#1F1D1A,#5E5953);
}
.phone .live__cover{padding-bottom:calc(46 * var(--u));background:linear-gradient(180deg,transparent 58%,rgba(10,8,7,.55));}
.phone .live__cta{padding:10px 16px;font-size:.8rem;}

/* --- Tela cheia --- */
.viewer{
  width:min(1480px,96vw);
  height:min(960px,94vh);
  max-width:none;max-height:none;
  margin:auto;
  padding:0;
  overflow:hidden;
  border:1px solid var(--edge-strong);
  border-radius:14px;
  background:#0C0A08;
  color:var(--parchment);
  box-shadow:0 60px 140px -40px rgba(0,0,0,.95);
}
.viewer[open]{display:flex;flex-direction:column;animation:viewerIn .45s var(--ease-out);}
@keyframes viewerIn{from{opacity:0;transform:translateY(18px) scale(.985);}}
.viewer::backdrop{background:rgba(6,5,4,.8);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);}
.viewer__bar{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 14px;
  padding:11px 14px 11px 18px;
  background:#15110E;
  border-bottom:1px solid var(--edge);
}
.viewer__title{display:flex;align-items:center;gap:12px;min-width:0;}
.viewer__title b{font-family:var(--display);font-size:1.05rem;font-weight:500;color:var(--starlight);white-space:nowrap;}
.viewer__domain{overflow:hidden;font-size:.75rem;color:var(--dust-dim);white-space:nowrap;text-overflow:ellipsis;}
.viewer__tools{display:flex;align-items:center;gap:8px;}
.viewer__ext{padding:8px 12px;font-size:.8125rem;color:var(--dust);transition:color .3s var(--ease);}
.viewer__ext:hover{color:var(--bronze-lit);}
.viewer__close{
  display:grid;place-items:center;
  width:38px;height:38px;
  border:1px solid var(--edge-strong);
  border-radius:50%;
  color:var(--parchment);
  transition:border-color .3s var(--ease),color .3s var(--ease);
}
.viewer__close svg{width:16px;height:16px;}
.viewer__close:hover{border-color:var(--bronze);color:var(--starlight);}
.viewer__body{
  position:relative;
  flex:1;min-height:0;
  display:grid;place-items:center;
  background:radial-gradient(ellipse at 50% 40%,rgba(192,128,67,.12),transparent 62%),#0A0807;
}
.viewer__frame{width:100%;height:100%;border:0;background:#fff;}
.viewer__body[data-view="desktop"] .viewer__phone,
.viewer__body[data-view="mobile"] .viewer__frame{display:none;}
.viewer__phone{--pw:330px;}
.viewer .live__viewport .live__frame{opacity:1;pointer-events:auto;}
html.has-viewer{overflow:hidden;}

@media (max-width:980px){
  .cases{grid-template-columns:minmax(0,1fr);grid-template-areas:"niches" "list" "stage" "panels";gap:24px;}
  .cases__niches{margin-inline:calc(var(--gutter,20px) * -1);padding-inline:var(--gutter,20px);}
  .cases__tab{padding:14px 10px 14px 18px;gap:14px;}
  .cases__tab-name{font-size:1.05rem;}
  .live__screen{min-height:0;}
}
@media (max-width:560px){
  .live__toolbar{justify-content:space-between;}
  .seg__btn{padding:9px 13px;}
  .live__fs span{display:none;}
  .live__fs{padding:9px 11px;}
  .phone{--pw:min(280px,74vw);}
  .browser__bar{gap:8px;padding:8px 10px;}
  .browser__dots i{width:8px;height:8px;}
  .browser__url{padding:4px 10px;font-size:.66rem;}
  .browser__bar .live__badge{font-size:0;gap:0;}
  .live__sub{display:none;}
  .live__cta{padding:9px 15px;font-size:.78rem;}
  .viewer{width:100vw;height:100vh;height:100dvh;border:0;border-radius:0;}
  .viewer__domain,.viewer__ext{display:none;}
}

/* ==========================================================================
   Depoimentos — três colunas rolando em looping contínuo, cada uma num
   ritmo diferente (e a do meio no sentido contrário) para não parecer
   mecânico. Passar o mouse ou focar um cartão pausa a coluna inteira.
   ========================================================================== */
.testimonials{
  position:relative;
  padding-block:clamp(88px,11vw,150px);
  background:
    radial-gradient(ellipse 70% 55% at 50% 0%,rgba(192,128,67,.16),transparent 62%),
    linear-gradient(180deg,var(--ember),var(--umber) 60%,var(--obsidian));
  overflow:hidden;
}
.testimonials .section-head{margin-bottom:clamp(40px,5vw,64px);}

.testi{
  position:relative;
  z-index:1;
  display:flex;
  justify-content:center;
  gap:clamp(16px,2.2vw,28px);
  max-height:720px;
  overflow:hidden;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 10%,#000 88%,transparent);
  mask-image:linear-gradient(180deg,transparent,#000 10%,#000 88%,transparent);
}
.testi__col{width:min(360px,86vw);flex:none;overflow:hidden;}
.testi__col--b,.testi__col--c{display:none;}
@media(min-width:760px){.testi__col--b{display:block;}}
@media(min-width:1100px){.testi__col--c{display:block;}}

.testi__list{
  list-style:none;margin:0;padding:0;
  display:flex;flex-direction:column;gap:20px;
  width:100%;
  animation:testiScroll var(--testi-duration,36s) linear infinite;
}
.testi__list--reverse{animation-direction:reverse;}
.testi__col:hover .testi__list,
.testi__col:focus-within .testi__list{animation-play-state:paused;}
@keyframes testiScroll{to{transform:translateY(-50%);}}

.testi__card{
  padding:clamp(22px,2.4vw,28px);
  border:1px solid var(--edge);
  border-radius:4px;
  background:linear-gradient(160deg,rgba(28,21,17,.92),rgba(16,12,10,.92));
  box-shadow:0 24px 48px -30px rgba(0,0,0,.75);
  transition:border-color .35s var(--ease),transform .35s var(--ease),box-shadow .35s var(--ease);
}
.testi__card:hover,.testi__card:focus-visible{
  border-color:var(--edge-strong);
  transform:translateY(-4px);
  box-shadow:0 30px 58px -26px rgba(0,0,0,.8);
}
.testi__stars{display:flex;gap:3px;margin-bottom:14px;}
.testi__stars svg{width:16px;height:16px;fill:#D9A441;filter:drop-shadow(0 1px 0 rgba(122,74,40,.25));}
.testi__quote{margin:0;color:var(--parchment);font-size:.9375rem;line-height:1.65;}
.testi__foot{display:flex;align-items:center;gap:12px;margin-top:18px;}
.testi__avatar{
  width:38px;height:38px;border-radius:50%;flex:none;
  display:grid;place-items:center;
  background:var(--metal);color:#1A1007;
  font-family:var(--display);font-size:.8rem;
}
.testi__who{display:grid;gap:1px;}
.testi__who b{font-weight:500;font-size:.85rem;color:var(--starlight);}
.testi__who span{font-size:.75rem;color:var(--dust-dim);}

@media(max-width:620px){
  .testi{max-height:600px;}
  .testi__col{width:min(320px,90vw);}
}
@media (prefers-reduced-motion:reduce){
  .testi__list{animation:none !important;}
}

/* ==========================================================================
   Processo — o caminho
   A estrada da logo vira linha do tempo: acende conforme a rolagem e a
   estrela acende no lançamento. Rolar é a interação, então vale no toque.
   ========================================================================== */
.process{position:relative;}
.journey{
  --nav-h:89px;
  --node-col:56px;
  --col-gap:clamp(20px,3.5vw,56px);
  position:relative;
}
@media (max-width:940px){.journey{--nav-h:73px;}}
@media (max-width:860px){.journey{--node-col:36px;--col-gap:18px;}}

/* Régua presa sob o menu: dia atual, fase e o prazo em proporção real.
   Sem JavaScript ela não teria o que mostrar, então só aparece com ele. */
.journey__ruler{display:none;}
.js .journey__ruler{
  position:sticky;
  top:var(--nav-h);
  z-index:5;
  display:grid;
  gap:12px;
  margin-bottom:clamp(8px,1.5vw,16px);
  padding:16px 0 18px;
  background:linear-gradient(180deg,rgba(10,8,7,.97) 72%,rgba(10,8,7,.88));
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--edge);
}
.journey__readout{display:flex;align-items:baseline;justify-content:space-between;gap:16px;}
.journey__day{font-size:var(--fs-micro);font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--dust);}
.journey__day b{
  display:inline-block;
  min-width:1.4em;
  margin:0 .12em;
  font-family:var(--display);
  font-size:1.65rem;
  font-weight:500;
  letter-spacing:0;
  text-align:center;
  color:var(--starlight);
  font-variant-numeric:tabular-nums;
}
.journey__phase{font-family:var(--display);font-style:italic;font-size:1.3rem;color:var(--bronze-lit);transition:color .5s var(--ease);}
.journey.is-arrived .journey__phase{color:var(--starlight);}
.journey__bar,
.journey__labels{display:flex;gap:3px;}
.journey__bar{height:6px;}
.journey__seg{position:relative;flex:var(--len) 1 0;overflow:hidden;border-radius:1px;background:var(--ash);}
.journey__seg i{position:absolute;inset:0;background:var(--metal);transform:scaleX(var(--p,1));transform-origin:left;transition:transform .2s linear;}
.journey__label{
  flex:var(--len) 1 0;
  min-width:0;
  overflow:hidden;
  font-size:.6875rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  white-space:nowrap;
  color:var(--dust);
  transition:color .4s var(--ease);
}
.journey__label.is-done{color:var(--bronze-lit);}
.journey__label.is-current{color:var(--starlight);}
.journey__label svg{width:11px;height:11px;fill:currentColor;vertical-align:-1px;}

/* Marcos */
.journey__track{position:relative;}
.journey__steps{list-style:none;margin:0;padding:0;display:grid;}
.jstep{
  position:relative;
  display:grid;
  grid-template-columns:var(--node-col) minmax(0,1fr) minmax(0,19rem);
  gap:0 var(--col-gap);
  padding:clamp(28px,3.6vw,44px) 0;
}
.jstep + .jstep::before{
  content:"";
  position:absolute;
  top:0;right:0;
  left:calc(var(--node-col) + var(--col-gap));
  height:1px;
  background:var(--edge);
}
.jstep__node{
  position:relative;
  z-index:2;
  grid-column:1;
  grid-row:1 / span 2;
  justify-self:center;
  width:15px;height:15px;
  margin-top:.45rem;
  border:1px solid var(--bronze-lit);
  border-radius:50%;
  background:var(--bronze-lit);
  box-shadow:0 0 0 5px rgba(233,190,139,.12),0 0 18px rgba(233,190,139,.6);
  transition:background .5s var(--ease),border-color .5s var(--ease),box-shadow .5s var(--ease);
}
.jstep__main{grid-column:2;display:grid;gap:8px;align-content:start;}
.jstep__meta{
  display:flex;
  align-items:baseline;
  gap:14px;
  font-size:var(--fs-micro);
  font-weight:500;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--dust);
}
.jstep__num{
  font-family:var(--display);
  font-size:1.05rem;
  font-weight:500;
  letter-spacing:0;
  color:var(--bronze-lit);
  font-variant-numeric:tabular-nums;
  transition:color .5s var(--ease);
}
.jstep h3{font-size:clamp(1.35rem,2.1vw,1.75rem);color:var(--starlight);transition:color .5s var(--ease);}
.jstep__desc{max-width:50ch;font-size:.9688rem;color:var(--dust);}
.jstep__you{
  grid-column:3;
  align-self:start;
  margin-top:.3rem;
  padding:16px 18px;
  border-left:1px solid var(--bronze);
  background:rgba(28,21,17,.62);
  font-size:.9375rem;
  line-height:1.55;
  color:var(--parchment);
  transition:border-color .5s var(--ease),background .5s var(--ease),color .5s var(--ease);
}
.jstep__you span{
  display:block;
  margin-bottom:6px;
  font-size:var(--fs-micro);
  font-weight:500;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--bronze-lit);
  transition:color .5s var(--ease);
}

/* Ainda não alcançado: apagado, mas continua legível */
.js .jstep:not(.is-lit):not(.jstep--final) .jstep__node{background:var(--obsidian);border-color:var(--bronze-deep);box-shadow:none;}
.js .jstep:not(.is-lit) h3,
.js .jstep:not(.is-lit) .jstep__num{color:var(--dust);}
.js .jstep:not(.is-lit) .jstep__you{border-left-color:var(--edge-strong);background:transparent;color:var(--dust);}
.js .jstep:not(.is-lit) .jstep__you span{color:var(--dust);}

/* A estrela de chegada */
.jstep--final .jstep__node{
  width:30px;height:30px;
  margin-top:0;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
}
.jstep--final .jstep__node svg{
  display:block;
  width:100%;height:100%;
  fill:var(--starlight);
  filter:drop-shadow(0 0 10px rgba(247,233,211,.85));
  transition:fill .6s var(--ease),filter .6s var(--ease),transform .9s var(--ease-out);
}
.js .jstep--final:not(.is-lit) .jstep__node svg{fill:var(--ash);filter:none;transform:scale(.7) rotate(-45deg);}

/* A estrada: trilho apagado com a luz preenchendo por cima */
.journey__road{
  position:absolute;
  z-index:1;
  left:calc(var(--node-col) / 2);
  top:var(--road-top,46px);
  height:var(--road-h,calc(100% - 92px));
  width:1px;
  transform:translateX(-50%);
  background:var(--edge-strong);
}
.journey__road i{
  position:absolute;
  top:0;bottom:0;
  left:-.5px;
  width:2px;
  background:linear-gradient(180deg,var(--bronze-deep),var(--bronze) 45%,var(--bronze-lit));
  box-shadow:0 0 12px rgba(233,190,139,.5);
  transform-origin:top;
  transform:scaleY(var(--fill,1));
}
.js .journey__road i{transform:scaleY(var(--fill,0));}

@media (max-width:860px){
  .jstep{grid-template-columns:var(--node-col) minmax(0,1fr);}
  .jstep__you{grid-column:2;margin-top:16px;}
  .journey__labels{display:none;}
  .journey__day b{font-size:1.4rem;}
  .journey__phase{font-size:1.12rem;}
}

/* ==========================================================================
   Por que a Maktub — seis compromissos, mostrados em vez de explicados
   Um mosaico: cada quadro tem uma cena pequena (a conversa, o calendário,
   o desenho, o celular, o registro, as aprovações) que roda uma vez quando
   aparece. Título curto e uma frase: dá para ler de relance.
   As cenas ficam paradas no primeiro quadro até o JS pôr .is-live. Sem JS,
   ou com movimento reduzido, aparecem direto no estado final.
   ========================================================================== */
.bento{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:clamp(12px,1.3vw,18px);
  margin:0;padding:0;
  list-style:none;
}
.bento__tile{
  position:relative;
  grid-column:span 2;
  display:grid;
  grid-template-rows:1fr auto;
  gap:clamp(16px,1.8vw,22px);
  min-width:0;
  padding:clamp(12px,1.2vw,16px) clamp(12px,1.2vw,16px) clamp(20px,2vw,26px);
  border-radius:26px;
  background:#FBF8F2;
  box-shadow:inset 0 0 0 1px var(--edge),0 26px 50px -42px rgba(35,26,18,.55);
}
.js .bento__tile.anim{transition:opacity .85s var(--ease-out) var(--d,0ms),transform .85s var(--ease-out) var(--d,0ms),box-shadow .45s var(--ease);}
@media (hover:hover){
  .bento__tile:hover{box-shadow:inset 0 0 0 1px var(--edge-strong),0 34px 60px -40px rgba(35,26,18,.6);}
}

.bento__scene{
  position:relative;
  display:grid;
  min-height:196px;
  overflow:hidden;
  border-radius:18px;
  background:linear-gradient(160deg,#F2EADD,#EAE0CF);
  box-shadow:inset 0 0 0 1px rgba(35,26,18,.06);
}
.bento__copy{display:grid;gap:8px;align-content:end;padding:0 clamp(6px,.9vw,12px);}
.bento__n{font-family:var(--display);font-size:.95rem;font-style:italic;line-height:1;color:var(--bronze);}
.bento__title{font-size:clamp(1.3rem,1.8vw,1.6rem);line-height:1.15;color:var(--starlight);}
.bento__text{max-width:46ch;font-size:.95rem;line-height:1.55;color:var(--dust);}

/* Quadros largos: texto de um lado, cena do outro */
.bento__tile--talk,
.bento__tile--ok{grid-column:span 4;grid-template-rows:none;align-items:stretch;}
.bento__tile--talk{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);}
.bento__tile--ok{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);}
.bento__tile--talk .bento__copy{align-content:space-between;gap:28px;padding:clamp(10px,1.6vw,22px);}
.bento__lead{display:grid;gap:8px;}
.bento__chip{
  display:inline-flex;align-items:center;gap:8px;
  justify-self:start;
  padding:7px 14px 7px 11px;
  border-radius:99px;
  background:rgba(233,190,139,.07);
  box-shadow:inset 0 0 0 1px var(--edge-strong);
  font-size:.78rem;font-weight:500;
  color:var(--parchment);
}
.bento__chip svg{flex:none;width:15px;height:15px;color:var(--bronze-lit);}
.bento__tile--ok .bento__copy{padding-block:clamp(8px,1.2vw,16px);}

.bento__tile.is-night{
  background:
    radial-gradient(ellipse 70% 90% at 0% 100%,rgba(192,128,67,.24),transparent 62%),
    linear-gradient(155deg,#241C16,#0C0908 72%);
  box-shadow:0 34px 64px -44px rgba(35,26,18,.95),inset 0 0 0 1px rgba(233,190,139,.14);
}

/* --- 01 · A conversa --- */
.chat{
  display:grid;
  grid-template-rows:auto 1fr;
  gap:14px;
  padding:14px 16px 18px;
  border-radius:18px;
  background:rgba(8,6,5,.62);
  box-shadow:inset 0 0 0 1px rgba(233,190,139,.1);
}
.chat__top{display:flex;align-items:center;gap:10px;margin:0;padding-bottom:12px;border-bottom:1px solid var(--edge);}
.chat__avatar{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--metal);font-family:var(--display);font-size:1rem;font-weight:600;color:#1A1007;}
.chat__who{display:grid;line-height:1.3;}
.chat__who b{font-size:.88rem;font-weight:600;color:var(--starlight);}
.chat__who small{display:inline-flex;align-items:center;gap:6px;font-size:.72rem;color:#5BD68D;}
.chat__who small::before{content:"";width:6px;height:6px;border-radius:50%;background:#3DDC84;box-shadow:0 0 0 3px rgba(61,220,132,.18);}
.chat__list{display:grid;align-content:start;gap:8px;margin:0;padding:0;list-style:none;}
.chat__row{position:relative;display:flex;}
.chat__row--me{justify-content:flex-end;}
.chat__bubble{
  max-width:84%;
  padding:9px 13px 10px;
  border-radius:16px 16px 16px 5px;
  background:#2B221B;
  font-size:.875rem;line-height:1.42;
  color:var(--parchment);
  transform-origin:0 100%;
}
.chat__row--me .chat__bubble{border-radius:16px 16px 5px 16px;background:linear-gradient(135deg,#EBC291,#C9894A);color:#1F1409;transform-origin:100% 100%;}
.chat__bubble--photo{padding:4px;}
.chat__pic{
  display:block;
  width:clamp(120px,11vw,148px);aspect-ratio:16/10;
  border-radius:12px;
  background:
    radial-gradient(circle at 74% 30%,#FFE9C4 0 8%,transparent 9%),
    linear-gradient(162deg,transparent 58%,rgba(58,36,18,.6) 59%),
    linear-gradient(200deg,transparent 64%,rgba(92,58,28,.55) 65%),
    linear-gradient(180deg,#E1A868,#9C6534);
}
.chat__ticks{margin-left:3px;font-size:.78rem;letter-spacing:-.18em;color:#53BDEB;}
.chat__dots{
  position:absolute;left:0;top:0;
  display:flex;align-items:center;gap:4px;
  height:34px;padding:0 14px;
  border-radius:16px 16px 16px 5px;
  background:#2B221B;
  opacity:0;
}
.chat__dots i{width:6px;height:6px;border-radius:50%;background:var(--dust);animation:chatDot 1s var(--ease) infinite;}
.chat__dots i:nth-child(2){animation-delay:.15s;}
.chat__dots i:nth-child(3){animation-delay:.3s;}
@keyframes chatDot{0%,60%,100%{transform:none;opacity:.45;}30%{transform:translateY(-3px);opacity:1;}}

.js .chat__bubble{animation:chatIn .5s var(--ease-out) var(--t) both;}
.js .chat__dots{animation:chatType 1.1s var(--ease) var(--t) both;}
@keyframes chatIn{from{opacity:0;transform:translateY(10px) scale(.94);}}
@keyframes chatType{0%{opacity:0;transform:translateY(6px);}18%,84%{opacity:1;transform:none;}100%{opacity:0;}}

/* --- 02 · O calendário --- */
.cal{align-content:space-between;gap:14px;padding:16px;}
.cal__head,
.cal__foot{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:0;}
.cal__head{font-size:.64rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--dust);}
.cal__head b{font-family:var(--display);font-size:1.08rem;font-weight:500;letter-spacing:0;text-transform:none;color:var(--starlight);}
.cal__foot{font-size:.72rem;color:var(--dust);}
.cal__air{font-weight:600;color:var(--bronze-lit);}
.cal__days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;margin:0;padding:0;list-style:none;}
.cal__days li{display:grid;place-items:center;aspect-ratio:1;border-radius:8px;background:#BE905A;font-size:.66rem;font-weight:600;color:#FBF5EA;}
.cal__days .cal__go{background:var(--metal);box-shadow:0 0 0 3px rgba(154,106,51,.2),0 8px 18px -8px rgba(94,55,22,.8);}
.cal__go svg{width:56%;height:56%;fill:#FFF7EA;}

.js .cal__days li{animation:calDay .35s var(--ease) calc(var(--i) * 70ms + .35s) both;}
.js .cal__days .cal__go{animation:calGo .8s cubic-bezier(.34,1.56,.64,1) 1.85s both;}
.js .cal__air{animation:calAir .5s var(--ease-out) 2.3s both;}
@keyframes calDay{from{background:rgba(35,26,18,.07);color:var(--dust);}}
@keyframes calGo{from{opacity:.25;transform:scale(.5) rotate(-90deg);box-shadow:none;}}
@keyframes calAir{from{opacity:0;transform:translateY(4px);}}

/* --- 03 · O desenho --- */
.draw{place-items:center;padding:16px 16px 50px;}
.draw svg{display:block;width:100%;max-width:300px;height:auto;overflow:visible;}
.draw__line{fill:none;stroke:#7A5534;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.draw__line--bold{stroke:#3A2A1C;stroke-width:3.4;}
.draw__line--thin{stroke:#A0846A;stroke-width:1.2;}
.draw__fill--img{fill:#E6C699;}
.draw__fill--btn{fill:#9A6A33;}
.draw__tag{
  position:absolute;left:0;right:0;bottom:13px;
  width:max-content;max-width:calc(100% - 24px);
  margin-inline:auto;
  overflow:hidden;
  padding:5px 13px;
  border-radius:99px;
  background:#FFFDF9;
  box-shadow:0 10px 20px -12px rgba(35,26,18,.45),inset 0 0 0 1px var(--edge);
  font-size:.74rem;
  white-space:nowrap;text-overflow:ellipsis;
  color:var(--dust);
}
.draw__tag b{font-weight:600;color:var(--bronze-lit);}

.js .draw__line{stroke-dasharray:1;stroke-dashoffset:0;animation:drawIn .9s var(--ease) var(--t) both;}
.js .draw__fill{animation:fadeIn .6s var(--ease) 2.2s both;}
.js .draw__tag{animation:popIn .6s cubic-bezier(.34,1.56,.64,1) 2.5s both;}
@keyframes drawIn{from{stroke-dashoffset:1;}}
@keyframes fadeIn{from{opacity:0;}}
@keyframes popIn{from{opacity:0;transform:translateY(8px) scale(.9);}}

/* --- 04 · O celular --- */
.fast{place-items:end center;padding:22px 16px 0;}
.fast__phone{
  position:relative;
  display:grid;align-content:start;gap:7px;
  width:clamp(132px,11.5vw,152px);height:178px;
  margin-bottom:-28px;
  padding:26px 11px 0;
  border-radius:24px;
  background:#FFFDF9;
  box-shadow:0 0 0 5px #1E1712,0 24px 40px -16px rgba(35,26,18,.6);
}
.fast__notch{position:absolute;left:50%;top:8px;width:34%;height:9px;margin-left:-17%;border-radius:99px;background:#1E1712;}
.fast__bar{position:absolute;left:11px;right:11px;top:21px;height:2px;border-radius:2px;overflow:hidden;background:rgba(35,26,18,.08);opacity:0;}
.fast__bar i{display:block;height:100%;background:linear-gradient(90deg,#C08043,#E9BE8B);transform-origin:left;}
.fast__img{
  height:58px;border-radius:10px;
  background:
    radial-gradient(circle at 76% 32%,#FFE9C4 0 9%,transparent 10%),
    linear-gradient(160deg,transparent 60%,rgba(58,36,18,.55) 61%),
    linear-gradient(180deg,#DDA466,#9C6534);
}
.fast__h{height:10px;width:82%;border-radius:4px;background:#2A2019;}
.fast__t{height:6px;border-radius:3px;background:#D7CBBB;}
.fast__t--s{width:66%;}
.fast__btn{
  display:inline-flex;align-items:center;justify-content:center;gap:5px;
  height:26px;margin-top:3px;
  border-radius:99px;
  background:#25D366;
  font-size:.66rem;font-weight:600;
  color:#FFFFFF;
}
.fast__btn svg{width:12px;height:12px;}
.fast__badge{
  position:absolute;right:12px;top:14px;
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 11px 6px 9px;
  border-radius:99px;
  background:#FFFDF9;
  box-shadow:0 10px 22px -12px rgba(35,26,18,.5),inset 0 0 0 1px var(--edge);
  font-size:.72rem;font-weight:600;
  color:var(--parchment);
}
.fast__badge svg{width:13px;height:13px;fill:var(--bronze);}

.js .fast__bar{animation:fastBar 1.3s var(--ease) .4s both;}
.js .fast__bar i{animation:fastFill 1s var(--ease) .4s both;}
.js .fast__img,.js .fast__h,.js .fast__t,.js .fast__btn{animation:fastLoad 1.5s linear .3s both;}
.js .fast__badge{animation:popIn .6s cubic-bezier(.34,1.56,.64,1) 1.8s both;}
@keyframes fastBar{0%,85%{opacity:1;}100%{opacity:0;}}
@keyframes fastFill{from{transform:scaleX(0);}to{transform:scaleX(1);}}
@keyframes fastLoad{0%,86%{background:#ECE3D5;color:transparent;}}

/* --- 05 · O registro --- */
.deed{place-items:center;padding:20px 22px 26px;}
.deed__card{
  position:relative;
  display:grid;gap:10px;
  width:min(100%,284px);
  padding:16px 16px 18px;
  border-radius:14px;
  background:#FFFDF9;
  box-shadow:0 20px 36px -22px rgba(35,26,18,.5),inset 0 0 0 1px rgba(35,26,18,.08);
  transform:rotate(-2deg);
}
.deed__top{display:flex;align-items:center;gap:7px;margin:0;font-size:.62rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--dust);}
.deed__top svg{flex:none;width:15px;height:15px;color:var(--bronze);}
.deed__domain{margin:0;overflow:hidden;font-family:var(--display);font-size:1.12rem;white-space:nowrap;text-overflow:ellipsis;color:var(--starlight);}
.deed__rows{display:grid;margin:0;border-top:1px dashed rgba(35,26,18,.2);}
.deed__rows div{display:grid;grid-template-columns:60px minmax(0,1fr);align-items:baseline;padding:7px 0;border-bottom:1px dashed rgba(35,26,18,.2);}
.deed__rows dt{font-size:.6rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--dust);}
.deed__rows dd{min-width:0;margin:0;overflow:hidden;font-family:var(--display);font-size:1rem;font-style:italic;white-space:nowrap;text-overflow:ellipsis;color:#7B4920;}
.deed__ink{display:inline-block;max-width:100%;overflow:hidden;vertical-align:bottom;text-overflow:ellipsis;}
.deed__ok{
  position:absolute;right:-12px;bottom:-14px;
  display:inline-flex;align-items:center;gap:5px;
  padding:6px 12px 6px 9px;
  border-radius:99px;
  background:var(--metal);
  box-shadow:0 10px 20px -10px rgba(94,55,22,.8);
  font-size:.7rem;font-weight:600;
  color:#FBF5EA;
  transform:rotate(5deg);
}
.deed__ok svg{width:12px;height:12px;}

.js .deed__ink{animation:deedInk .8s var(--ease-out) .6s both;}
.js .deed__ink--2{animation-delay:1.25s;}
.js .deed__ok{animation:stampIn .6s cubic-bezier(.2,1.35,.4,1) 1.9s both;}
@keyframes deedInk{from{clip-path:inset(0 100% 0 0);}to{clip-path:inset(0 -4% 0 0);}}
@keyframes stampIn{from{opacity:0;transform:rotate(-12deg) scale(1.8);}}

/* --- 06 · As aprovações --- */
.ok{align-content:center;justify-items:start;gap:16px;padding:clamp(16px,2vw,24px);}
.ok__steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;width:100%;margin:0;padding:0;list-style:none;}
.ok__steps li{
  display:grid;justify-items:start;align-content:start;gap:10px;
  padding:14px 12px 12px;
  border-radius:14px;
  background:#FFFDF9;
  box-shadow:0 12px 24px -18px rgba(35,26,18,.45),inset 0 0 0 1px rgba(154,106,51,.35);
}
.ok__n{position:relative;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#9A6A33;}
.ok__n b{font-family:var(--display);font-size:.82rem;font-weight:500;color:var(--dust);opacity:0;}
.ok__n svg{position:absolute;width:13px;height:13px;color:#FBF5EA;}
.ok__name{min-height:2.5em;font-size:.86rem;font-weight:600;line-height:1.25;color:var(--parchment);}
.ok__btn{display:grid;min-width:0;height:28px;font-size:.72rem;font-weight:600;}
.ok__btn span{grid-area:1 / 1;display:grid;place-items:center;padding:0 12px;border-radius:99px;white-space:nowrap;}
.ok__btn span:first-child{background:#2A2019;color:#FBF5EA;opacity:0;}
.ok__btn span:last-child{background:rgba(154,106,51,.16);color:#7B4920;}
.ok__extra{
  display:inline-flex;align-items:center;gap:8px;
  margin:0;padding:7px 14px 7px 11px;
  border-radius:99px;
  background:#FFFDF9;
  box-shadow:inset 0 0 0 1px var(--edge);
  font-size:.78rem;font-weight:500;
  color:var(--parchment);
}
.ok__extra svg{flex:none;width:15px;height:15px;color:var(--bronze);}

.js .ok__steps li{animation:okCard .5s var(--ease) calc(var(--t) + .25s) both;}
.js .ok__n{animation:okDot .4s var(--ease) calc(var(--t) + .25s) both;}
.js .ok__n b{animation:okNum .3s var(--ease) calc(var(--t) + .25s) both;}
.js .ok__n svg{animation:okTick .45s cubic-bezier(.34,1.56,.64,1) calc(var(--t) + .3s) both;}
.js .ok__btn span:first-child{animation:okPress .55s var(--ease) var(--t) both;}
.js .ok__extra{animation:popIn .6s cubic-bezier(.34,1.56,.64,1) 3.4s both;}
@keyframes okCard{from{box-shadow:0 12px 24px -18px rgba(35,26,18,.45),inset 0 0 0 1px rgba(35,26,18,.07);}}
@keyframes okDot{from{background:rgba(35,26,18,.07);}}
@keyframes okNum{from{opacity:1;}}
@keyframes okTick{from{opacity:0;transform:scale(.3);}}
@keyframes okPress{0%{opacity:1;transform:none;}45%{opacity:1;transform:scale(.88);}100%{opacity:0;transform:scale(.88);}}

/* --- O fecho --- */
.bento__tile--cta{
  grid-template-rows:none;
  align-content:center;justify-items:start;
  gap:18px;
  padding:clamp(24px,2.6vw,34px);
  background:
    radial-gradient(ellipse 80% 70% at 100% 0%,rgba(255,240,215,.55),transparent 60%),
    linear-gradient(145deg,#D9A86D,#A9743C 55%,#7A4A28);
  box-shadow:0 30px 60px -40px rgba(94,55,22,.9),inset 0 1px 0 rgba(255,244,225,.5);
}
.bento__star svg{display:block;width:30px;height:30px;fill:#2A1A0C;animation:tagStar 4s ease-in-out infinite;}
.bento__close{font-family:var(--display);font-size:clamp(1.35rem,1.9vw,1.65rem);line-height:1.2;color:#1F1409;}

/* Parado no primeiro quadro até aparecer na tela (important: vence os
   atalhos "animation" acima, que voltariam o estado para running) */
.js .bento__tile:not(.is-live) *{animation-play-state:paused !important;}

@media (max-width:980px){
  .bento{grid-template-columns:repeat(2,minmax(0,1fr));}
  .bento__tile{grid-column:span 1;}
  .bento__tile--talk,
  .bento__tile--ok,
  .bento__tile--cta{grid-column:1 / -1;}
}
@media (max-width:640px){
  .bento{grid-template-columns:minmax(0,1fr);}
  .bento__tile--talk,
  .bento__tile--ok{grid-template-columns:minmax(0,1fr);}
  .bento__tile--talk .bento__copy{padding:12px 8px 4px;}
  .ok__steps{grid-template-columns:minmax(0,1fr);}
  .ok__steps li{grid-template-columns:26px minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 12px;}
  .ok__name{min-height:0;}
}

/* Para quem faz sentido — o teste de dez segundos
   Frases na primeira pessoa; o visitante toca nas que parecem com a empresa
   dele e o quadro ao lado responde com os serviços que combinam. */
.fit{
  isolation:isolate;
  overflow:hidden;
  background:
    linear-gradient(180deg,transparent 62%,var(--umber)),
    linear-gradient(150deg,var(--ember),var(--umber) 70%);
}
.fit__glow{
  position:absolute;z-index:-1;
  right:-10%;top:8%;
  width:min(900px,110vw);aspect-ratio:1;
  background:radial-gradient(circle,rgba(192,128,67,.13),transparent 62%);
  pointer-events:none;
}
.fit__head{display:grid;gap:20px;max-width:780px;margin-bottom:clamp(40px,5vw,64px);}
.fit__head .lead{max-width:50ch;}
.fit__game{
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  gap:clamp(24px,4vw,64px);
  align-items:start;
}

/* As frases */
.fit__says{display:grid;gap:10px;min-width:0;margin:0;padding:0;border:0;}
.say{
  position:relative;
  display:grid;
  grid-template-columns:28px minmax(0,1fr);
  align-items:center;
  gap:16px;
  padding:17px 20px;
  border-radius:16px;
  background:rgba(10,8,7,.38);
  box-shadow:inset 0 0 0 1px var(--edge);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  transition:background .35s var(--ease),box-shadow .35s var(--ease),transform .35s var(--ease-out);
}
.say input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}
.say__box{
  display:grid;place-items:center;
  width:26px;height:26px;
  border-radius:8px;
  box-shadow:inset 0 0 0 1.5px var(--edge-strong);
  transition:background .3s var(--ease),box-shadow .3s var(--ease),transform .45s cubic-bezier(.34,1.56,.64,1);
}
.say__box svg{width:15px;height:15px;fill:none;stroke:#1A1007;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:22;stroke-dashoffset:22;transition:stroke-dashoffset .35s var(--ease-out) .08s;}
.say__text{font-size:clamp(1rem,1.2vw,1.08rem);line-height:1.45;color:var(--parchment);transition:color .3s var(--ease);}
@media (hover:hover){
  .say:hover{background:rgba(28,21,17,.7);box-shadow:inset 0 0 0 1px var(--edge-strong);}
  .say:hover .say__box{box-shadow:inset 0 0 0 1.5px var(--bronze);}
}
.say:active{transform:scale(.99);}
.say.is-on{
  background:linear-gradient(100deg,rgba(192,128,67,.2),rgba(192,128,67,.04));
  box-shadow:inset 0 0 0 1px var(--bronze-lit);
}
.say.is-on .say__box{background:var(--metal);box-shadow:none;transform:scale(1.08);}
.say.is-on .say__box svg{stroke-dashoffset:0;}
.say.is-on .say__text{color:var(--starlight);}
.say:has(input:focus-visible){outline:2px solid var(--bronze-lit);outline-offset:3px;}

/* A resposta */
.match{
  position:sticky;top:112px;
  display:grid;
  padding:clamp(22px,2.6vw,32px);
  border-radius:24px;
  background:
    radial-gradient(ellipse 90% 60% at 50% 0%,rgba(192,128,67,.2),transparent 65%),
    linear-gradient(165deg,#231B16,#0E0B09);
  box-shadow:0 44px 90px -50px rgba(0,0,0,.95),inset 0 0 0 1px var(--edge-strong);
}
.match[hidden],.match__empty[hidden],.match__full[hidden],.match__item[hidden]{display:none;}
.match.is-bump{animation:matchBump .6s var(--ease-out);}
@keyframes matchBump{
  35%{box-shadow:0 44px 90px -50px rgba(0,0,0,.95),inset 0 0 0 1px var(--bronze-lit),0 0 0 7px rgba(192,128,67,.14);}
}
.match__empty{display:grid;justify-items:center;gap:10px;padding:clamp(14px,2vw,24px) 0 0;text-align:center;}
.match__ghost{display:grid;gap:8px;width:100%;margin-top:14px;}
.match__ghost i{
  display:block;height:58px;
  border-radius:15px;
  background:linear-gradient(100deg,rgba(255,255,255,.015) 30%,rgba(233,190,139,.07) 50%,rgba(255,255,255,.015) 70%) 0 0 / 250% 100%;
  box-shadow:inset 0 0 0 1px var(--edge);
  animation:ghost 2.8s linear infinite;
}
.match__ghost i:nth-child(2){opacity:.65;}
.match__ghost i:nth-child(3){opacity:.35;}
@keyframes ghost{from{background-position:100% 0;}to{background-position:-150% 0;}}
.match__star svg{display:block;width:34px;height:34px;fill:var(--bronze-deep);filter:drop-shadow(0 0 12px rgba(192,128,67,.35));animation:tagStar 4s ease-in-out infinite;}
.match__title{font-family:var(--display);font-size:clamp(1.3rem,1.9vw,1.6rem);line-height:1.2;color:var(--starlight);}
.match__hint{font-size:.9rem;color:var(--dust);}
.match__full{display:grid;gap:16px;}
.match__kicker{display:inline-flex;align-items:center;gap:8px;font-size:.7rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#5BD68D;}
.match__kicker svg{width:14px;height:14px;}
.match__list{display:grid;gap:8px;margin:0;padding:0;list-style:none;}
.match__item{
  display:grid;
  grid-template-columns:40px minmax(0,1fr);
  align-items:center;
  gap:6px 14px;
  padding:13px 14px;
  border-radius:15px;
  background:rgba(255,255,255,.025);
  box-shadow:inset 0 0 0 1px var(--edge);
  animation:matchIn .45s var(--ease-out) both;
}
@keyframes matchIn{from{opacity:0;transform:translateY(8px);}}
.match__item.is-top{background:linear-gradient(120deg,rgba(192,128,67,.22),rgba(192,128,67,.05));box-shadow:inset 0 0 0 1px var(--bronze);}
.match__icon{grid-row:span 2;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--edge-strong);color:var(--bronze-lit);}
.match__icon svg{width:20px;height:20px;}
.match__item.is-top .match__icon{background:var(--metal);box-shadow:none;color:#1A1007;}
.match__txt{display:grid;gap:2px;min-width:0;}
.match__txt b{font-size:.98rem;font-weight:600;line-height:1.3;color:var(--starlight);}
.match__txt small{font-size:.82rem;line-height:1.45;color:var(--dust);}
.match__tag{display:none;}
.match__item.is-top .match__tag{
  display:inline-flex;align-items:center;gap:5px;
  grid-column:2;justify-self:start;order:-1;
  font-size:.62rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--bronze-lit);
}
.match__item.is-top .match__tag::before{content:"";width:8px;height:8px;background:currentColor;clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);}
.match__see{grid-column:2;justify-self:start;padding-bottom:1px;border-bottom:1px solid var(--edge-strong);font-size:.8rem;font-weight:500;color:var(--bronze-lit);transition:color .3s var(--ease),border-color .3s var(--ease);}
.match__see:hover{color:var(--starlight);border-color:var(--bronze);}
.match__cta{width:100%;margin-top:4px;}
.match__note{font-size:.82rem;line-height:1.5;color:var(--dust);}
.match__note b{font-weight:600;color:var(--parchment);}

.fit__none{max-width:70ch;margin-top:clamp(28px,3vw,40px);font-size:.94rem;color:var(--dust);}
.fit__none a{padding-bottom:1px;border-bottom:1px solid var(--edge-strong);color:var(--bronze-lit);transition:color .3s var(--ease),border-color .3s var(--ease);}
.fit__none a:hover{color:var(--starlight);border-color:var(--bronze);}

@media (max-width:900px){
  .fit__game{grid-template-columns:minmax(0,1fr);}
  .match{position:relative;top:0;}
}
@media (max-width:560px){
  .say{gap:14px;padding:15px 16px;}
  .match__item{grid-template-columns:36px minmax(0,1fr);padding:12px;}
  .match__icon{width:36px;height:36px;}
}

/* ==========================================================================
   Sobre — o verbete e o cartão
   "maktub" entra como verbete de dicionário, e a primeira acepção é escrita
   à mão quando aparece. Ao lado, o cartão de visita da agência vira com
   um toque (e uma vez sozinho, para mostrar que tem verso).
   ========================================================================== */
.about{isolation:isolate;overflow:hidden;background:linear-gradient(180deg,var(--umber) 0,var(--obsidian) 420px);}
.about__glow{position:absolute;z-index:-1;left:0;top:-10%;width:min(1100px,130vw);aspect-ratio:1;background:radial-gradient(circle,rgba(192,128,67,.13),transparent 60%);transform:translateX(-28%);pointer-events:none;}
.about__grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(44px,6vw,110px);align-items:start;margin-top:clamp(26px,3vw,40px);}

.entry__word{font-size:clamp(4.6rem,12.5vw,10.4rem);font-weight:500;line-height:1;letter-spacing:-.04em;}
.entry__word .gold{display:inline-block;padding:0 .06em .1em 0;}
.entry__meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:10px;font-size:1rem;color:var(--dust);}
.entry__say{letter-spacing:.16em;color:var(--parchment);}
.entry__meta i{width:1px;height:16px;background:var(--edge-strong);}
.entry__meta em{font-family:var(--display);}
.entry__senses{display:grid;gap:clamp(12px,1.6vw,20px);margin:clamp(24px,3vw,34px) 0 0;padding:clamp(22px,2.6vw,30px) 0 0;border-top:1px solid var(--edge);list-style:none;}
.entry__senses li{display:grid;grid-template-columns:clamp(26px,3vw,38px) minmax(0,1fr);gap:10px;align-items:center;}
.entry__n{align-self:start;font-family:var(--display);font-size:1.35rem;font-style:italic;line-height:1.5;color:var(--bronze-lit);}
.entry__script svg{display:block;width:min(100%,560px);height:auto;overflow:visible;}
.entry__script text{font-family:var(--display);font-size:94px;font-style:italic;font-weight:500;fill:rgba(233,190,139,.95);stroke:#E9BE8B;stroke-width:1.2;}
.js .entry__script text{fill:rgba(233,190,139,0);stroke-dasharray:640;stroke-dashoffset:640;}
.js .entry.is-in .entry__script text{animation:scriptDraw 3.2s var(--ease-out) .35s forwards,scriptFill 1.3s var(--ease) 2.5s forwards;}
@keyframes scriptDraw{to{stroke-dashoffset:0;}}
@keyframes scriptFill{to{fill:rgba(233,190,139,.95);stroke-opacity:.3;}}
.entry__def{max-width:36ch;font-size:clamp(1.12rem,1.6vw,1.34rem);line-height:1.55;color:var(--parchment);}
.entry__def em{font-family:var(--display);color:var(--bronze-lit);}

.about__story{display:grid;gap:18px;max-width:58ch;margin-top:clamp(36px,4.4vw,60px);}
.about__story p{color:var(--dust);}
.about__story p:first-child{font-size:1.14rem;color:var(--parchment);}

/* --- O cartão de visita --- */
.about__side{display:grid;gap:18px;justify-items:start;}
@media (min-width:961px){.about__side{position:sticky;top:120px;padding-top:clamp(20px,3vw,48px);}}
.bcard{position:relative;width:100%;max-width:470px;aspect-ratio:1.72;perspective:1800px;cursor:pointer;-webkit-tap-highlight-color:transparent;}
.bcard__in{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(var(--tx,0deg)) rotateY(calc(var(--flip,0) * 180deg + var(--ty,0deg)));transition:transform 1s var(--ease-out);}
.bcard.is-flipped{--flip:1;}
.bcard__face{position:absolute;inset:0;overflow:hidden;border-radius:16px;-webkit-backface-visibility:hidden;backface-visibility:hidden;}
.bcard__front{
  display:grid;place-items:center;align-content:center;gap:8px;
  background:radial-gradient(ellipse 80% 70% at 30% 18%,rgba(192,128,67,.24),transparent 60%),linear-gradient(150deg,#201813,#0A0807);
  box-shadow:0 40px 70px -36px rgba(0,0,0,.95),inset 0 0 0 1px rgba(233,190,139,.3);
}
.bcard__front::after{content:"";position:absolute;inset:10px;border:1px solid rgba(233,190,139,.2);border-radius:10px;pointer-events:none;}
.bcard__front img{width:34%;mix-blend-mode:lighten;}
.bcard__brand{margin-right:-.42em;font-size:clamp(.9rem,1.5vw,1.08rem);font-weight:500;letter-spacing:.42em;color:var(--starlight);}
.bcard__tag{font-family:var(--display);font-size:.84rem;font-style:italic;color:var(--bronze-lit);}
.bcard__sheen{position:absolute;inset:-40%;background:linear-gradient(115deg,transparent 42%,rgba(255,240,220,.14) 50%,transparent 58%);transform:translateX(var(--sx,-24%));transition:transform .8s var(--ease-out);pointer-events:none;}
.bcard__back{
  display:grid;align-content:space-between;
  padding:clamp(18px,2.4vw,28px);
  transform:rotateY(180deg);
  background:radial-gradient(ellipse 90% 80% at 100% 0%,rgba(192,128,67,.14),transparent 55%),linear-gradient(160deg,#F7F1E6,#EADFCC);
  color:#231A12;
  box-shadow:0 40px 70px -36px rgba(0,0,0,.95);
}
.bcard__star{position:absolute;top:clamp(16px,2.2vw,26px);right:clamp(16px,2.2vw,26px);width:18px;height:18px;fill:#9A6A33;}
.bcard__who b{display:block;font-family:var(--display);font-size:clamp(1.35rem,2.3vw,1.8rem);font-weight:500;line-height:1.1;}
.bcard__who span{display:block;margin-top:7px;font-size:.66rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:#7B4920;}
.bcard__lines{display:grid;gap:4px;padding-top:12px;border-top:1px solid rgba(35,26,18,.14);font-size:clamp(.72rem,1vw,.82rem);color:#3A2E24;}
.bcard__lines > span{display:grid;grid-template-columns:5.4em minmax(0,1fr);gap:6px;}
.bcard__lines > span[hidden]{display:none;}
.bcard__lines i{font-style:normal;color:#8A7662;}
.bcard__hint{display:flex;align-items:center;gap:8px;font-size:.78rem;color:var(--dust-dim);}
.bcard__hint svg{flex:none;width:16px;height:16px;color:var(--bronze-lit);}

.founder{display:grid;gap:10px;max-width:470px;margin-top:12px;}
.founder__label{font-family:var(--sans);font-size:.7rem;font-weight:500;line-height:1.4;letter-spacing:.22em;text-transform:uppercase;color:var(--bronze-lit);}
.founder p{font-size:1.06rem;color:var(--dust);}
.founder strong{font-weight:500;color:var(--starlight);}
.founder__cta{justify-self:start;margin-top:8px;}
.founder__cta svg{width:18px;height:18px;}

/* --- Manifesto --- */
.manifesto{display:grid;justify-items:center;gap:20px;max-width:920px;margin:clamp(72px,9vw,128px) auto 0;text-align:center;}
.manifesto__star{width:26px;height:26px;fill:var(--bronze-lit);filter:drop-shadow(0 0 14px rgba(233,190,139,.6));}
.manifesto blockquote{margin:0;font-family:var(--display);font-size:clamp(1.45rem,3vw,2.35rem);font-style:italic;font-weight:400;line-height:1.3;color:var(--starlight);text-wrap:balance;}
.manifesto figcaption{font-size:.74rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--dust);}

@media (max-width:960px){
  .about__grid{grid-template-columns:minmax(0,1fr);}
  .about__side{justify-items:stretch;}
  .bcard,.founder{max-width:520px;}
}

/* ==========================================================================
   FAQ
   ========================================================================== */
.faq{display:grid;gap:0;max-width:920px;margin-inline:auto;}
.faq__item{border-top:1px solid var(--edge);}
.faq__item:last-child{border-bottom:1px solid var(--edge);}
.faq__q{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:24px 0;
  text-align:left;
  font-size:1.0625rem;
  font-weight:400;
  color:var(--parchment);
  transition:color .3s var(--ease);
  min-height:56px;
}
.faq__q:hover{color:var(--starlight);}
.faq__icon{
  flex:none;
  width:22px;height:22px;
  position:relative;
  color:var(--bronze);
}
.faq__icon::before,.faq__icon::after{
  content:"";
  position:absolute;
  top:50%;left:50%;
  background:currentColor;
  transform:translate(-50%,-50%);
  transition:transform .38s var(--ease),opacity .3s var(--ease);
}
.faq__icon::before{width:13px;height:1px;}
.faq__icon::after{width:1px;height:13px;}
.faq__q[aria-expanded="true"] .faq__icon::after{transform:translate(-50%,-50%) rotate(90deg);opacity:0;}
.faq__a{
  display:grid;
  grid-template-rows:0fr;
  transition:grid-template-rows .45s var(--ease-out);
}
.faq__a[data-open="true"]{grid-template-rows:1fr;}
.faq__a-inner{overflow:hidden;}
.faq__a p{
  color:var(--dust);
  font-size:.9688rem;
  max-width:64ch;
  padding-bottom:26px;
}
.faq__a a{color:var(--bronze-lit);border-bottom:1px solid var(--edge-strong);transition:border-color .3s var(--ease);}
.faq__a a:hover{border-color:var(--bronze);}

/* ==========================================================================
   Proposta — perguntas de um lado, a proposta sendo escrita do outro
   A folha fica em papel claro sobre o fundo escuro: é o ponto de luz da
   seção. Cada resposta é "escrita" na linha correspondente e, no fim, o
   selo da Maktub carimba a folha.
   ========================================================================== */
.proposal{
  position:relative;
  padding-block:clamp(96px,11vw,160px);
  overflow:hidden;
  isolation:isolate;
  background:linear-gradient(180deg,var(--obsidian) 0,rgba(10,8,7,0) 180px),radial-gradient(ellipse 80% 55% at 50% 0%,rgba(122,74,40,.24),transparent 62%),var(--obsidian);
}
.proposal__bg{position:absolute;inset:0;z-index:-1;pointer-events:none;}
.proposal__glow{
  position:absolute;left:50%;top:-12%;
  width:min(1100px,140vw);aspect-ratio:1;
  background:radial-gradient(circle,rgba(192,128,67,.15),transparent 60%);
  transform:translateX(-50%);
}
.proposal__rays{position:absolute;left:50%;bottom:0;width:min(1500px,170vw);height:100%;opacity:.34;transform:translateX(-50%);}
.proposal__rays path{fill:none;stroke:rgba(192,128,67,.55);stroke-width:1;stroke-dasharray:1400;stroke-dashoffset:0;transition:stroke-dashoffset 2.8s var(--ease-out);}
.js .proposal:not(.is-lit) .proposal__rays path{stroke-dashoffset:1400;}

.proposal__head{display:grid;justify-items:center;gap:18px;max-width:740px;margin:0 auto clamp(44px,5vw,68px);text-align:center;}
.proposal__star svg{display:block;width:30px;height:30px;fill:var(--starlight);filter:drop-shadow(0 0 16px rgba(247,233,211,.7));animation:tagStar 4s ease-in-out infinite;}
.proposal__head h2{font-size:clamp(2.3rem,4.8vw,3.9rem);}
.proposal__head .lead{max-width:56ch;}

.wiz{
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  gap:clamp(24px,3vw,44px);
  align-items:start;
  max-width:1160px;
  margin-inline:auto;
}
.wiz__form{
  position:relative;
  padding:clamp(24px,3vw,40px);
  border:1px solid var(--edge-strong);
  border-radius:22px;
  background:linear-gradient(160deg,rgba(28,21,17,.94),rgba(14,11,9,.96));
  box-shadow:0 50px 100px -60px rgba(0,0,0,.95),inset 0 1px 0 rgba(233,190,139,.08);
}

/* Etapas */
.wiz__track{position:relative;margin-bottom:30px;}
.wiz__progress{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,1fr);margin:0;padding:0;list-style:none;}
.wiz__progress button{
  display:flex;flex-direction:column;align-items:center;gap:8px;
  width:100%;
  font-size:.7rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;
  color:var(--dust-dim);
  transition:color .4s var(--ease);
}
.wiz__progress button:disabled{cursor:default;}
.wiz__progress span{
  display:grid;place-items:center;
  width:32px;height:32px;
  border:1px solid var(--edge-strong);
  border-radius:50%;
  background:#120E0B;
  font-family:var(--display);font-size:.9rem;letter-spacing:0;
  color:var(--dust);
  transition:background .45s var(--ease),border-color .45s var(--ease),color .45s var(--ease),transform .5s var(--ease-out),box-shadow .45s var(--ease);
}
.wiz__progress li.is-current button{color:var(--starlight);}
.wiz__progress li.is-current span{border-color:var(--bronze-lit);color:var(--starlight);box-shadow:0 0 0 5px rgba(192,128,67,.16);transform:scale(1.08);}
.wiz__progress li.is-done button{color:var(--bronze-lit);}
.wiz__progress li.is-done span{border-color:transparent;background:var(--metal);color:transparent;position:relative;}
.wiz__progress li.is-done span::after{content:"";position:absolute;width:12px;height:7px;border-left:2px solid #1A1007;border-bottom:2px solid #1A1007;transform:translateY(-2px) rotate(-45deg);}
.wiz__progress li.is-done button:not(:disabled):hover span{transform:scale(1.08);}
.wiz__bar{position:absolute;left:12.5%;right:12.5%;top:16px;height:1px;background:var(--edge-strong);}
.wiz__bar i{display:block;height:100%;background:var(--metal);box-shadow:0 0 10px rgba(233,190,139,.5);transform:scaleX(var(--p,0));transform-origin:left;transition:transform .8s var(--ease-out);}

/* Passos */
.wiz__step{min-width:0;margin:0;padding:0;border:0;}
.wiz__step > * + *{margin-top:16px;}
.js .wiz__step:not(.is-active){display:none;}
.wiz__step.is-active{animation:stepIn .55s var(--ease-out);}
.wiz__step.is-active.is-back{animation-name:stepInBack;}
@keyframes stepIn{from{opacity:0;transform:translateX(28px);}}
@keyframes stepInBack{from{opacity:0;transform:translateX(-28px);}}
.wiz__q{
  display:grid;gap:6px;
  width:100%;
  margin:0 0 20px;padding:0;
  font-family:var(--display);
  font-size:clamp(1.5rem,2.4vw,2rem);font-weight:500;line-height:1.15;
  color:var(--starlight);
}
.wiz__q small{font-family:var(--sans);font-size:.7rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--bronze-lit);}
.wiz__step > .wiz__hint{margin-top:-10px;}
.wiz__hint{font-size:.875rem;color:var(--dust);}
.wiz__sub{padding-top:12px;font-size:.72rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--parchment);}
.wiz__sub span{margin-left:6px;letter-spacing:.06em;text-transform:none;color:var(--dust-dim);}

/* Opções */
.pick{display:grid;gap:10px;}
.pick label{position:relative;cursor:pointer;-webkit-tap-highlight-color:transparent;}
.pick input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}

.pick--cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.pick__card{
  display:grid;gap:3px;
  padding:16px 16px 18px;
  border:1px solid var(--edge);
  border-radius:14px;
  background:rgba(10,8,7,.42);
  transition:border-color .35s var(--ease),background .35s var(--ease),transform .4s var(--ease-out),box-shadow .35s var(--ease);
}
.pick__card::after{
  content:"";
  position:absolute;top:13px;right:13px;
  width:18px;height:18px;
  border:1px solid var(--edge-strong);
  border-radius:50%;
  transition:background .3s var(--ease),border-color .3s var(--ease),transform .45s cubic-bezier(.34,1.56,.64,1);
}
.pick__card b{font-size:.98rem;font-weight:600;line-height:1.3;color:var(--parchment);}
.pick__card small{font-size:.8rem;line-height:1.4;color:var(--dust);}
@media (hover:hover){.pick__card:hover{transform:translateY(-3px);border-color:var(--edge-strong);}}
.pick__card.is-checked{
  border-color:var(--bronze-lit);
  background:linear-gradient(160deg,rgba(192,128,67,.2),rgba(122,74,40,.05));
  box-shadow:inset 0 0 0 1px var(--bronze-lit),0 18px 36px -24px rgba(192,128,67,.75);
}
.pick__card.is-checked::after{
  border-color:transparent;
  background:#E9BE8B url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A1007' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 11px no-repeat;
  transform:scale(1.12);
}
.pick label:has(input:focus-visible){outline:2px solid var(--bronze-lit);outline-offset:3px;border-radius:14px;}

/* Ícone de cada serviço, o mesmo do cardápio */
.pick--cards .pick__card{grid-template-columns:38px minmax(0,1fr);align-items:center;column-gap:12px;row-gap:1px;padding:13px 38px 13px 13px;}
.pick__art{grid-row:span 2;display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--edge-strong);border-radius:10px;background:rgba(233,190,139,.05);color:var(--bronze-lit);transition:border-color .35s var(--ease),background .35s var(--ease),transform .45s var(--ease-out);}
.pick__art svg{width:20px;height:20px;}
@media (hover:hover){.pick__card:hover .pick__art{transform:rotate(-6deg);}}
.pick__card.is-checked .pick__art{border-color:var(--bronze-lit);background:rgba(233,190,139,.12);}
@media (max-width:560px){
  .pick--cards .pick__card{grid-template-columns:minmax(0,1fr);align-content:start;row-gap:2px;padding:12px;}
  .pick__art{grid-row:auto;width:30px;height:30px;margin-bottom:8px;border-radius:8px;}
  .pick__art svg{width:16px;height:16px;}
}

.pick--chips{display:flex;flex-wrap:wrap;gap:10px;}
.pick__chip span{
  display:inline-flex;align-items:center;gap:8px;
  padding:10px 16px;
  border:1px solid var(--edge-strong);
  border-radius:99px;
  font-size:.875rem;font-weight:500;
  color:var(--dust);
  transition:background .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease),transform .35s var(--ease-out);
}
.pick__chip span::before{content:"+";width:10px;font-size:1.05rem;line-height:1;text-align:center;color:var(--bronze-lit);transition:transform .4s var(--ease-out);}
@media (hover:hover){.pick__chip:hover span{border-color:var(--bronze);color:var(--parchment);}}
.pick__chip:active span{transform:scale(.96);}
.pick__chip.is-checked span{border-color:transparent;background:var(--metal);color:#1A1007;}
.pick__chip.is-checked span::before{content:"✓";color:#1A1007;transform:rotate(360deg);}
.pick__chip:has(input:focus-visible){outline:none;}
.pick__chip:has(input:focus-visible) span{outline:2px solid var(--bronze-lit);outline-offset:3px;}

.pick--scale{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;}
.pick__tick span{
  position:relative;
  display:grid;place-items:center;
  height:50px;
  padding:0 6px;
  overflow:hidden;
  border:1px solid var(--edge);
  border-radius:10px;
  font-size:.8rem;font-weight:500;text-align:center;
  color:var(--dust);
  transition:border-color .3s var(--ease),background .3s var(--ease),color .3s var(--ease);
}
.pick__tick span::before{content:"";position:absolute;left:0;bottom:0;width:100%;height:3px;background:var(--metal);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease-out);}
@media (hover:hover){.pick__tick:hover span{border-color:var(--edge-strong);color:var(--parchment);}}
.pick__tick.is-checked span{border-color:var(--bronze-lit);background:rgba(192,128,67,.13);color:var(--starlight);}
.pick__tick.is-checked span::before{transform:scaleX(1);}
.pick__tick:has(input:focus-visible){outline:none;}
.pick__tick:has(input:focus-visible) span{outline:2px solid var(--bronze-lit);outline-offset:2px;}

.pick--rows{gap:8px;}
.pick__row{
  display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:6px 14px;
  padding:16px 18px;
  border:1px solid var(--edge);
  border-radius:12px;
  transition:border-color .3s var(--ease),background .3s var(--ease),transform .4s var(--ease-out);
}
.pick__row b{font-size:.98rem;font-weight:600;color:var(--parchment);}
.pick__row small{justify-self:end;font-size:.8rem;color:var(--dust-dim);text-align:right;}
.pick__dot{position:relative;width:20px;height:20px;border:1.5px solid var(--edge-strong);border-radius:50%;transition:border-color .3s var(--ease);}
.pick__dot::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--metal);transform:scale(0);transition:transform .45s cubic-bezier(.34,1.56,.64,1);}
@media (hover:hover){.pick__row:hover{transform:translateX(4px);border-color:var(--edge-strong);}}
.pick__row.is-checked{border-color:var(--bronze-lit);background:linear-gradient(90deg,rgba(192,128,67,.17),rgba(192,128,67,.02));}
.pick__row.is-checked .pick__dot{border-color:var(--bronze-lit);}
.pick__row.is-checked .pick__dot::after{transform:scale(1);}
.pick__row:has(input:focus-visible){outline:2px solid var(--bronze-lit);outline-offset:3px;}

/* Campos com rótulo flutuante */
.wiz__fields{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.wiz .form__field{position:relative;}
.wiz .form__field--wide{grid-column:1 / -1;}
.wiz .form__field input,
.wiz .form__field textarea{
  display:block;
  width:100%;height:58px;
  padding:24px 16px 8px;
  border:1px solid var(--edge-strong);
  border-radius:12px;
  outline:none;
  background:rgba(10,8,7,.55);
  font-size:1rem;
  color:var(--starlight);
  transition:border-color .3s var(--ease),box-shadow .3s var(--ease),background .3s var(--ease);
}
.wiz .form__field textarea{min-height:100px;height:auto;padding-top:28px;line-height:1.5;resize:vertical;}
.wiz .form__field label{
  position:absolute;left:17px;top:19px;
  font-size:.95rem;
  color:var(--dust);
  pointer-events:none;
  transform-origin:left top;
  transition:transform .3s var(--ease-out),color .3s var(--ease);
}
.wiz .form__field input:focus + label,
.wiz .form__field input:not(:placeholder-shown) + label,
.wiz .form__field textarea:focus + label,
.wiz .form__field textarea:not(:placeholder-shown) + label{color:var(--bronze-lit);transform:translateY(-11px) scale(.74);}
.wiz .form__field input:focus,
.wiz .form__field textarea:focus{border-color:var(--bronze-lit);background:rgba(20,16,13,.85);box-shadow:0 0 0 4px rgba(192,128,67,.14);}
.wiz .form__field label span{color:var(--bronze);}
.wiz .form__field label .optional{margin-left:6px;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--dust-dim);}
.form__error{display:none;margin-top:6px;font-size:.8rem;color:#E8846B;}
.form__field.has-error input{border-color:#E8846B;}
.form__field.has-error .form__error{display:block;}
.form__hint{font-size:.78rem;color:var(--dust-dim);}
.form__status{display:none;margin-top:14px;padding:12px 14px;border:1px solid var(--edge-strong);border-radius:10px;background:rgba(122,74,40,.15);font-size:.875rem;color:var(--bronze-lit);}
.form__status.is-visible{display:block;}

/* Navegação entre passos */
.wiz__nav{display:flex;align-items:center;gap:12px;margin-top:26px;padding-top:22px;border-top:1px solid var(--edge);}
.wiz__back{display:inline-flex;align-items:center;gap:8px;padding:10px 4px;font-size:.9rem;font-weight:500;color:var(--dust);transition:color .3s var(--ease);}
.wiz__back svg{width:16px;height:16px;transition:transform .35s var(--ease);}
.wiz__back:hover{color:var(--parchment);}
.wiz__back:hover svg{transform:translateX(-3px);}
.wiz__back[hidden]{display:none;}
.wiz__next{margin-left:auto;}
.wiz__next.is-muted{opacity:.5;box-shadow:none;}
.wiz.is-done .wiz__nav{display:none;}

.wiz__done{display:grid;gap:16px;outline:none;animation:stepIn .6s var(--ease-out);}
.wiz__done[hidden]{display:none;}
.wiz__done .wiz__q{margin:0;}
.wiz__send{display:flex;flex-wrap:wrap;gap:10px;}
.wiz__send [hidden]{display:none;}
.wiz__edit{justify-self:start;padding-bottom:2px;border-bottom:1px solid var(--edge-strong);font-size:.85rem;color:var(--dust);transition:color .3s var(--ease);}
.wiz__edit:hover{color:var(--bronze-lit);}

/* A folha */
.paper{position:sticky;top:112px;}
.paper__sheet{
  position:relative;
  overflow:hidden;
  padding:clamp(24px,2.8vw,38px) clamp(22px,2.6vw,36px) clamp(26px,3vw,40px);
  border-radius:6px;
  background:
    radial-gradient(ellipse at 15% 0%,rgba(255,255,255,.65),transparent 52%),
    repeating-linear-gradient(0deg,rgba(90,60,30,.03) 0 1px,transparent 1px 3px),
    linear-gradient(172deg,#F9F3E8,#EDE1CD);
  color:#2A2019;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 60px 100px -50px rgba(0,0,0,.95),0 20px 40px -24px rgba(0,0,0,.8);
  transform:rotate(1.3deg);
  transition:transform .8s var(--ease-out);
}
@media (hover:hover){.paper:hover .paper__sheet{transform:rotate(0deg) translateY(-4px);}}
.paper__sheet::before{
  content:"";
  position:absolute;top:0;right:0;
  width:36px;height:36px;
  background:linear-gradient(225deg,#0E0B09 50%,#D8C8AE 50%);
  box-shadow:-3px 3px 7px rgba(0,0,0,.16);
}
.paper__top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding-bottom:18px;border-bottom:1px solid rgba(42,32,25,.18);}
.paper__brand{display:inline-flex;align-items:center;gap:8px;font-family:var(--display);font-size:1.05rem;font-weight:600;letter-spacing:.2em;color:#2A2019;}
.paper__brand svg{width:13px;height:13px;fill:#9A6A33;}
.paper__meta{padding-right:26px;font-size:.72rem;line-height:1.5;text-align:right;color:#7A6A5A;}
.paper__meta b{color:#2A2019;}
.paper__to{margin:22px 0 4px;font-family:var(--display);font-size:clamp(1.35rem,2vw,1.75rem);font-weight:500;line-height:1.2;color:#2A2019;}
.paper__to .paper__ink{font-style:italic;color:#7B4920;}
.paper__rows{display:grid;margin:14px 0 0;}
.paper__row{display:grid;grid-template-columns:100px minmax(0,1fr);align-items:baseline;gap:12px;padding:13px 0;border-bottom:1px dashed rgba(42,32,25,.22);}
.paper__row dt{font-size:.68rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#8B7B6B;transition:color .4s var(--ease);}
.paper__row dd{min-height:1.35em;margin:0;font-family:var(--display);font-size:1.02rem;line-height:1.35;color:#2A2019;overflow-wrap:anywhere;}
.paper__row.is-filled dt{color:#9A6A33;}
.paper__ink{display:inline-block;}
.paper__ink.is-empty{color:#B4A690;}
.paper__to .paper__ink.is-empty{font-style:normal;}
.paper__ink.is-writing{animation:inkIn .8s var(--ease-out);}
@keyframes inkIn{
  from{opacity:.2;filter:blur(2px);clip-path:inset(0 100% 0 0);}
  to{opacity:1;filter:none;clip-path:inset(0 -2% 0 0);}
}
.paper__foot{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-top:28px;}
.paper__sign span{display:block;font-family:var(--display);font-size:1.4rem;font-style:italic;color:#2A2019;}
.paper__sign small{display:block;margin-top:4px;font-size:.72rem;color:#8B7B6B;}
.paper__seal{flex:none;width:100px;height:100px;opacity:0;transform:scale(2.2) rotate(-40deg);}
.paper__seal svg{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 3px 4px rgba(90,30,10,.35));}
.paper__seal circle{fill:#8C2E23;}
.paper__seal .paper__seal-ring{fill:none;stroke:rgba(255,222,196,.5);stroke-width:1;}
.paper__seal text{font-family:var(--sans);font-size:8.4px;font-weight:600;letter-spacing:2.1px;fill:rgba(255,232,210,.92);}
.paper__seal-star{fill:#F7E9D3;}
.paper.is-sealed .paper__seal{animation:sealIn .85s cubic-bezier(.2,1.35,.4,1) forwards;}
.paper.is-sealed .paper__sheet{animation:paperThump .5s .5s var(--ease-out);}
@keyframes sealIn{
  0%{opacity:0;transform:scale(2.3) rotate(-40deg);}
  60%{opacity:1;transform:scale(.9) rotate(-10deg);}
  100%{opacity:1;transform:scale(1) rotate(-14deg);}
}
@keyframes paperThump{50%{transform:rotate(1.3deg) scale(.985);}}
.paper__draft{
  position:absolute;right:-24px;top:46%;
  font-family:var(--display);font-size:3.5rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(154,106,51,.08);
  transform:rotate(-22deg);
  pointer-events:none;
  transition:opacity .6s var(--ease);
}
.paper.is-sealed .paper__draft{opacity:0;}
.paper__progress{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(42,32,25,.08);}
.paper__progress i{display:block;width:100%;height:100%;background:linear-gradient(90deg,#9A6A33,#C08043);transform:scaleX(var(--p,0));transform-origin:left;transition:transform .8s var(--ease-out);}

.proposal__direct{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 16px;margin-top:36px;font-size:.875rem;color:var(--dust-dim);}
.proposal__direct a{padding-bottom:2px;border-bottom:1px solid var(--edge-strong);color:var(--parchment);transition:color .3s var(--ease);}
.proposal__direct a:hover{color:var(--bronze-lit);}
.proposal__direct a[hidden]{display:none;}

@media (max-width:980px){
  .wiz{grid-template-columns:minmax(0,1fr);}
  .paper{position:relative;top:0;}
  .paper__sheet{transform:none;}
}
@media (max-width:560px){
  .proposal{padding-block:84px;}
  .wiz__form{padding:22px 16px;border-radius:18px;}
  .wiz__progress button{font-size:.58rem;letter-spacing:.04em;}
  .wiz__progress span{width:28px;height:28px;font-size:.8rem;}
  .wiz__bar{top:14px;}
  .pick--cards{gap:8px;}
  .pick__card{padding:12px 12px 14px;}
  .pick__card b{font-size:.9rem;}
  .pick__card small{font-size:.74rem;}
  .pick--scale{grid-template-columns:repeat(2,minmax(0,1fr));}
  .pick__row{grid-template-columns:auto 1fr;padding:14px;}
  .pick__row small{grid-column:2;justify-self:start;text-align:left;}
  .wiz__fields{grid-template-columns:1fr;}
  .wiz__nav .btn{flex:1;}
  .paper__row{grid-template-columns:84px minmax(0,1fr);}
  .paper__seal{width:80px;height:80px;}
  .paper__sign span{font-size:1.2rem;}
}

/* ==========================================================================
   Rodapé
   ========================================================================== */
.footer{position:relative;overflow:hidden;background:var(--obsidian);border-top:1px solid var(--edge);padding-top:clamp(56px,7vw,88px);}
.footer__glow{
  position:absolute;
  top:-160px;left:50%;
  width:min(900px,120vw);height:340px;
  transform:translateX(-50%);
  background:radial-gradient(ellipse at 50% 0%,rgba(192,128,67,.14),transparent 68%);
  pointer-events:none;
}
.footer__grid{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));
  gap:clamp(32px,5vw,64px);
  padding-bottom:clamp(40px,5vw,64px);
}
.footer__brand{display:grid;gap:18px;align-content:start;}
.footer__tagline{font-size:.9375rem;line-height:1.65;color:var(--dust);max-width:34ch;}
.footer__whatsapp{
  display:inline-flex;align-items:center;gap:10px;
  font-size:.875rem;color:var(--bronze-lit);
  border:1px solid var(--edge-strong);border-radius:2px;
  padding:10px 16px;width:fit-content;
  transition:border-color .3s var(--ease),color .3s var(--ease),background .3s var(--ease);
}
.footer__whatsapp svg{width:16px;height:16px;flex:none;}
.footer__whatsapp:hover{border-color:var(--bronze);background:rgba(192,128,67,.1);color:var(--starlight);}

.footer__col{display:grid;gap:14px;align-content:start;}
.footer__heading{
  font-size:var(--fs-micro);font-weight:500;letter-spacing:.2em;text-transform:uppercase;
  color:var(--bronze-lit);margin:0 0 4px;
}
.footer__col a{font-size:.9375rem;color:var(--dust);transition:color .3s var(--ease);}
.footer__col a:hover{color:var(--starlight);}

.footer__bottom{
  position:relative;
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;
  padding-block:24px;
  border-top:1px solid var(--edge);
  font-size:.8125rem;color:var(--dust-dim);
}
.footer__bottom-right{display:flex;align-items:center;gap:20px;}
.footer__credit{color:var(--dust-dim);}
.footer__top{
  display:grid;place-items:center;
  width:34px;height:34px;
  border:1px solid var(--edge-strong);border-radius:50%;
  color:var(--dust);
  transition:color .3s var(--ease),border-color .3s var(--ease),transform .3s var(--ease);
}
.footer__top svg{width:15px;height:15px;}
.footer__top:hover{color:var(--bronze-lit);border-color:var(--bronze);transform:translateY(-2px);}

@media(max-width:900px){
  .footer__grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .footer__brand{grid-column:1 / -1;}
}
@media(max-width:560px){
  .footer__grid{grid-template-columns:1fr;}
  .footer__bottom{flex-direction:column;align-items:flex-start;}
  .footer__bottom-right{width:100%;justify-content:space-between;}
}

/* Compatibilidade: /privacidade/ e /sites-para-clinicas-de-estetica/ ainda
   usam o rodapé antigo (footer__main/footer__inner/footer__links), de uma
   versão anterior da página que nunca foi migrada para o layout atual.
   Isto só evita regressão nessas duas páginas — não é o rodapé novo. */
.cta{position:relative;overflow:hidden;text-align:center;padding-block:clamp(96px,12vw,150px);}
.cta__inner{position:relative;display:grid;gap:28px;justify-items:center;}
.cta h2{max-width:16ch;}
.cta .lead{max-width:50ch;}
.footer__main{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;padding-block:34px;}
.footer .footer__inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:18px;flex-wrap:wrap;font-size:.8125rem;color:var(--dust-dim);border-top:1px solid var(--edge);}
.footer .footer__links{display:flex;gap:20px;flex-wrap:wrap;padding:0;margin:0;list-style:none;}
.footer .footer__links a{transition:color .3s var(--ease);}
.footer .footer__links a:hover{color:var(--bronze-lit);}

/* ==========================================================================
   CTA flutuante (mobile)
   ========================================================================== */
.dock{
  position:fixed;
  left:0;right:0;bottom:0;
  z-index:90;
  padding:12px var(--gutter) calc(12px + env(safe-area-inset-bottom));
  background:rgba(10,8,7,.92);
  backdrop-filter:blur(14px);
  border-top:1px solid var(--edge);
  transform:translateY(110%);
  transition:transform .45s var(--ease-out);
  display:none;
}
.dock.is-visible{transform:translateY(0);}
@media (max-width:720px){.dock{display:block;}}

/* ==========================================================================
   Animação de entrada
   ========================================================================== */
.js .anim{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .85s var(--ease-out),transform .85s var(--ease-out);
  transition-delay:var(--d,0ms);
}
.js .anim.is-in{opacity:1;transform:none;}

@keyframes rise{to{opacity:1;transform:none;}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-delay:0ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .js .anim,
  .js .hero__tag,.js .hero__lead,.js .hero__try,.js .hero__actions,.js .hero__facts,.js .hero__stage{opacity:1;transform:none;}
  .js .hero__line > span{transform:none;}
}

/* ==========================================================================
   Seções claras
   O site alterna blocos escuros e claros para a leitura não cansar. Em vez
   de duplicar cada componente, a seção clara redefine os próprios tokens —
   tudo que já usa var(--parchment), var(--edge) e companhia acompanha
   sozinho. Só o que tem cor fixa no código precisa de ajuste aqui embaixo.
   ========================================================================== */
.is-day{
  --obsidian:#F3EEE4;
  --umber:#EBE4D7;
  --ember:#E2D9C8;
  --ash:#CDC0AC;

  --bronze-deep:#663B1C;
  --bronze:#9A6A33;
  --bronze-lit:#7B4920;   /* em fundo claro, "aceso" é mais escuro, não mais claro */
  --starlight:#16100B;

  --parchment:#231A12;
  --dust:#5B4E42;
  --dust-dim:#6A5B4D;

  --edge:rgba(35,26,18,.16);
  --edge-strong:rgba(35,26,18,.32);

  --metal:linear-gradient(135deg,#B37E3D 0%,#8A5A28 45%,#5E3716 100%);

  background:linear-gradient(180deg,#F6F1E8,#EFE7D9);
  color:var(--parchment);
}

/* Botão primário: em fundo claro vira tinta escura, não bronze sobre bege */
.is-day .btn--primary{
  background:linear-gradient(135deg,#2C221A,#14100B);
  color:#F8F1E5;
  box-shadow:0 16px 34px -18px rgba(20,16,11,.6);
}
.is-day .btn--primary:hover{box-shadow:0 22px 44px -18px rgba(20,16,11,.72);}
.is-day .btn--ghost{border-color:var(--edge-strong);color:var(--parchment);}
.is-day .btn--ghost:hover{border-color:var(--bronze);color:var(--bronze-lit);}

/* Depoimentos */
.testimonials.is-day{
  background:
    linear-gradient(180deg,#F6F1E8,rgba(246,241,232,0) 180px),
    radial-gradient(ellipse 72% 55% at 50% 0%,rgba(154,106,51,.12),transparent 62%),
    linear-gradient(180deg,#F6F1E8,#EFE7D9);
}
.is-day .testi__card{
  background:#FCF8F1;
  box-shadow:0 20px 44px -30px rgba(35,26,18,.42);
}
.is-day .testi__card:hover,
.is-day .testi__card:focus-visible{box-shadow:0 26px 54px -26px rgba(35,26,18,.5);}
.is-day .testi__avatar{color:#FBF5EA;}

/* ==========================================================================
   Transições entre seções
   Cada passagem tem um sentido: a luz nasce depois do problema; a
   persiana baixa para a sessão de trabalhos; cinco estrelas acendem antes
   dos depoimentos; seis degraus sobem até o processo; a estrela do
   lançamento se abre em luz no "por que"; a página vira antes de "para
   quem"; os pontos se dissolvem nas dúvidas; e a noite sobe até o pedido
   de proposta. Todas discretas: só forma e luz, sem texto.
   --p (0 → 1) é o avanço da rolagem sobre o elemento, calculado no JS.
   ========================================================================== */
.tr{position:relative;overflow:hidden;pointer-events:none;}

/* Amanhecer e anoitecer: um arco que sobe e se abre até virar reta */
.tr--dawn,
.tr--dusk{height:clamp(110px,13vw,190px);margin-block:-1px;}
.tr--dawn{background:var(--obsidian);}
.tr--dusk{background:#EFE7D9;}
.tr__arc{
  position:absolute;left:-3%;right:-3%;bottom:-2px;
  height:calc(100% + 2px);
  border-radius:50% 50% 0 0 / calc((1 - var(--p,1)) * 100%) calc((1 - var(--p,1)) * 100%) 0 0;
  transform:translateY(calc((1 - var(--p,1)) * 58%));
}
.tr--dawn .tr__arc{background:#F6F1E8;}
.tr--dusk .tr__arc{background:var(--obsidian);}
.tr__sun{
  position:absolute;left:50%;
  bottom:calc(14% + var(--p,1) * 48%);
  width:24px;height:24px;
  opacity:calc(1 - var(--p,1) * .85);
  transform:translateX(-50%) rotate(calc(var(--p,1) * 90deg)) scale(calc(.7 + var(--p,1) * .5));
}
.tr__sun svg{display:block;width:100%;height:100%;fill:#9A6A33;filter:drop-shadow(0 0 12px rgba(192,128,67,.85));}
.tr--dusk .tr__sun svg{fill:var(--starlight);filter:drop-shadow(0 0 14px rgba(247,233,211,.9));}

/* A persiana baixa: as lâminas engrossam de baixo para cima até virar
   noite — as luzes se apagam para a sessão de trabalhos */
.tr--blinds{
  display:grid;
  grid-template-rows:repeat(12,1fr);
  height:clamp(110px,11vw,160px);
  margin-block:-1px;
  background:#EFE7D9;
}
.tr--blinds i{
  display:block;
  background:var(--umber);
  transform:scaleY(clamp(.05,calc(var(--p,1) * 1.7 - var(--r) * .06),1.08));
}

/* Cinco estrelas acendem uma a uma e a luz sobe em onda até os depoimentos */
.tr--stars{
  height:clamp(140px,13vw,196px);
  margin-block:-1px;
  background:var(--obsidian);
}
.tr__tide{
  position:absolute;left:0;right:0;bottom:0;
  height:100%;
  background:#F6F1E8;
  transform:translateY(calc((1 - var(--p,1)) * 100%));
}
.tr__tide::before{
  content:"";
  position:absolute;left:0;right:0;bottom:calc(100% - 1px);
  height:16px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 16' preserveAspectRatio='none'%3E%3Cpath d='M0 9C20 9 26 1 40 1s20 8 40 8 26-8 40-8 20 8 40 8v7H0z' fill='%23F6F1E8'/%3E%3C/svg%3E") 0 100% / 160px 16px repeat-x;
  transform:scaleY(calc(1.2 - var(--p,1)));
  transform-origin:bottom;
}
.tr__rating{
  position:absolute;left:50%;top:44%;
  z-index:1;
  display:flex;gap:clamp(8px,1vw,14px);
  transform:translate(-50%,-50%);
}
.tr__rating svg{
  --on:clamp(0,calc((var(--p,1) - .08 - var(--k) * .085) * 9),1);
  display:block;
  width:clamp(18px,1.8vw,24px);height:clamp(18px,1.8vw,24px);
  overflow:visible;
  transform:scale(calc(.72 + var(--on) * .28)) rotate(calc((1 - var(--on)) * -40deg));
}
.tr__rating path{stroke-width:1.2;stroke-linejoin:round;}
.tr__rating .tr__off{fill:none;stroke:rgba(233,190,139,.32);}
.tr__rating .tr__on{fill:#D9A441;stroke:#D9A441;opacity:var(--on);filter:drop-shadow(0 0 8px rgba(233,176,80,.7));}

/* Seis degraus sobem até o processo: um para cada etapa */
.tr--steps{
  display:flex;align-items:flex-end;
  height:clamp(120px,12vw,176px);
  margin-block:-1px;
  background:#EFE7D9;
}
.tr--steps i{
  flex:1 0 0;
  margin-right:-1px;
  height:calc(clamp(0,var(--p,1) * 1.6 - var(--r) * .12,1) * 100%);
  background:linear-gradient(180deg,#221A14,var(--obsidian) 18px);
  border-top:1px solid rgba(233,190,139,.5);
}

/* A estrela do lançamento se abre em luz no "por que" */
.tr--bloom{
  height:clamp(140px,13vw,196px);
  margin-block:-1px;
  background:var(--obsidian);
}
.tr__light,
.tr__halo,
.tr__halo i{position:absolute;inset:0;}
.tr__light{background:#F6F1E8;clip-path:circle(clamp(0px,calc((var(--p,1) * 1.3 - .3) * 56vw),60vw) at 50% 50%);}
.tr__halo{filter:blur(12px);}
.tr__halo i{background:rgba(233,190,139,.55);clip-path:circle(calc(clamp(0px,calc((var(--p,1) * 1.3 - .3) * 56vw),60vw) + 18px) at 50% 50%);}
.tr__spark{
  position:absolute;left:50%;top:50%;
  width:26px;height:26px;
  margin:-13px 0 0 -13px;
  transform:rotate(calc(var(--p,1) * 180deg)) scale(calc(1.25 - var(--p,1) * .45));
}
.tr__spark svg{display:block;width:100%;height:100%;fill:#9A6A33;fill:color-mix(in srgb,#9A6A33 calc(clamp(0,(var(--p,1) - .2) * 20,1) * 100%),#F7E9D3);filter:drop-shadow(0 0 10px rgba(233,190,139,.9));}

/* Os pontos se dissolvem nas dúvidas: retícula que cresce até virar luz */
.tr--dots{
  display:grid;
  margin-block:-1px;
  background:var(--obsidian);
}
.tr--dots{--cell:22px;}
.tr--dots i{
  --dot:clamp(-1px,calc((var(--p,1) * 1.8 - var(--r) * .13) * var(--cell) * .73),calc(var(--cell) * .73));
  display:block;
  height:var(--cell);
  background:radial-gradient(circle,#F6F1E8 var(--dot),rgba(246,241,232,0) calc(var(--dot) + .8px)) 0 0 / var(--cell) var(--cell) repeat-x;
}
.tr--dots i:nth-child(even){background-position:calc(var(--cell) / 2) 0;}
@media (max-width:560px){.tr--dots{--cell:15px;}}

/* A página vira: "para quem" entra com o topo inclinado, que se endireita */
.fit[data-progress]{
  --cut:clamp(40px,7vw,110px);
  z-index:1;
  margin-top:calc(var(--cut) * -1);
  padding-top:calc(var(--section-y) + var(--cut));
  clip-path:polygon(0 calc((1 - var(--p,1)) * var(--cut)),100% 0,100% 100%,0 100%);
}

.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-link{
  position:absolute;
  top:-60px;left:var(--gutter);
  z-index:200;
  background:var(--bronze);
  color:#1A1007;
  padding:12px 20px;
  border-radius:2px;
  font-weight:500;
  transition:top .3s var(--ease);
}
.skip-link:focus{top:14px;}