/* PyneX Convites — landing de vendas */
:root{
  --ink:#2A1A22; --ink2:#3A2530;
  --paper:#FBF8F3; --paper2:#F3ECE1;
  --gold:#C9A24B; --gold-lt:#E7CC8C;
  --wine:#8A2E43; --blush:#EBD9CF;
  --txt:#2B2026; --txt-soft:#6A5A60; --onDark:#F3E7DA; --onDark-soft:#C9B6AE;
  --line:rgba(42,26,34,.12);
  --serif:"Cormorant Garamond",Georgia,serif;
  --script:"Great Vibes",cursive;
  --sans:"Jost",system-ui,sans-serif;
  --maxw:1120px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--sans);color:var(--txt);background:var(--paper);line-height:1.6;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

.section-label{font-family:var(--sans);font-weight:400;letter-spacing:.3em;text-transform:uppercase;
  font-size:.72rem;color:var(--gold);text-align:center}
.section-title{font-family:var(--serif);font-weight:500;font-size:clamp(2rem,6vw,3.1rem);
  line-height:1.1;text-align:center;color:var(--ink);margin:10px auto 0;max-width:20ch}
.script{font-family:var(--script);font-weight:400;color:var(--gold);font-size:1.25em;line-height:1}

/* reveal */
.reveal{opacity:0;transform:translateY(24px)}
.reveal.in{opacity:1;transform:none;transition:opacity .8s ease, transform .8s cubic-bezier(.22,1,.36,1)}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}}

/* botões */
.btn{display:inline-block;font-family:var(--sans);font-weight:500;letter-spacing:.06em;
  font-size:.86rem;text-decoration:none;cursor:pointer;border:1px solid transparent;
  padding:14px 28px;border-radius:40px;transition:.22s;text-align:center}
.btn--gold{background:linear-gradient(135deg,var(--gold),var(--gold-lt));color:#3a2a10;
  box-shadow:0 10px 26px rgba(201,162,75,.3)}
.btn--gold:hover{filter:brightness(1.05);transform:translateY(-2px)}
.btn--ghost{background:transparent;border-color:rgba(243,231,218,.5);color:var(--onDark)}
.btn--ghost:hover{background:rgba(243,231,218,.1)}
.btn--line{background:transparent;border-color:var(--ink);color:var(--ink)}
.btn--line:hover{background:var(--ink);color:var(--paper)}

/* NAV */
.nav{position:sticky;top:0;z-index:40;display:flex;justify-content:space-between;align-items:center;
  padding:14px clamp(18px,5vw,48px);background:rgba(42,26,34,.92);backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(201,162,75,.2)}
.nav__brand{font-family:var(--serif);font-size:1.3rem;font-weight:500;color:var(--onDark);text-decoration:none;letter-spacing:.02em}
.nav__mark{color:var(--gold);font-weight:600}
.nav__cta{font-family:var(--sans);font-weight:500;font-size:.82rem;color:var(--ink);text-decoration:none;
  background:var(--gold-lt);padding:9px 18px;border-radius:30px;transition:.2s}
.nav__cta:hover{background:var(--gold)}

/* HERO */
.hero{position:relative;background:radial-gradient(120% 90% at 80% 0%, #45303a, var(--ink) 60%);
  color:var(--onDark);display:grid;gap:30px;align-items:center;
  grid-template-columns:1fr;padding:clamp(48px,8vw,90px) clamp(20px,5vw,48px) clamp(60px,9vw,100px);
  overflow:hidden}
.hero__glow{position:absolute;top:-30%;right:-10%;width:60vw;height:60vw;border-radius:50%;
  background:radial-gradient(circle,rgba(201,162,75,.28),transparent 65%);filter:blur(10px);pointer-events:none}
.hero__txt{max-width:620px;position:relative;z-index:1}
.eyebrow{font-family:var(--sans);font-weight:300;letter-spacing:.28em;text-transform:uppercase;
  font-size:.7rem;color:var(--gold-lt);margin-bottom:18px}
.hero h1{font-family:var(--serif);font-weight:500;font-size:clamp(2.6rem,9vw,4.4rem);line-height:1.04;margin-bottom:20px}
.hero__sub{font-family:var(--serif);font-size:clamp(1.15rem,3.6vw,1.4rem);color:var(--onDark-soft);
  max-width:46ch;margin-bottom:28px;line-height:1.5}
.hero__btns{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:18px}
.hero__note{font-family:var(--sans);font-weight:300;font-size:.82rem;letter-spacing:.04em;color:var(--onDark-soft)}
.hero__phone{display:flex;justify-content:center;position:relative;z-index:1}

/* phone mockup */
.phone{width:min(300px,78vw);border-radius:34px;padding:10px;background:linear-gradient(160deg,#1b1116,#2e1f26);
  box-shadow:0 30px 70px rgba(0,0,0,.4), inset 0 0 0 1px rgba(201,162,75,.25)}
.phone img{width:100%;border-radius:26px;display:block}
.phone--sm{width:min(210px,62vw);border-radius:26px;padding:7px}
.phone--sm img{border-radius:20px}

/* FEATURES */
.feats{max-width:var(--maxw);margin:0 auto;padding:clamp(60px,10vw,110px) clamp(20px,5vw,48px)}
.feats__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;margin-top:40px}
.feat{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px 24px;
  transition:transform .25s, box-shadow .25s}
.feat:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(42,26,34,.1)}
.feat__i{font-size:1.8rem;display:block;margin-bottom:12px}
.feat h3{font-family:var(--serif);font-weight:600;font-size:1.3rem;color:var(--ink);margin-bottom:6px}
.feat p{font-family:var(--sans);font-weight:300;font-size:.95rem;color:var(--txt-soft)}

/* DEMO */
.demo{background:var(--paper2);padding:clamp(60px,10vw,110px) clamp(20px,5vw,48px)}
.demo{display:grid;gap:40px;align-items:center;grid-template-columns:1fr;max-width:var(--maxw);margin:0 auto}
.demo__txt{text-align:center}
.demo__txt .section-title{text-align:center;margin-left:auto;margin-right:auto}
.demo__txt p{font-family:var(--serif);font-size:1.2rem;color:var(--txt-soft);max-width:40ch;margin:14px auto 22px}
.demo__shots{display:flex;justify-content:center;align-items:flex-end;gap:14px;flex-wrap:wrap}
.phone--up{margin-bottom:24px}

/* PLANOS */
.planos{max-width:var(--maxw);margin:0 auto;padding:clamp(60px,10vw,110px) clamp(20px,5vw,48px);text-align:center}
.toggle{display:inline-flex;background:var(--paper2);border:1px solid var(--line);border-radius:40px;
  padding:5px;margin:26px auto 8px;gap:4px}
.toggle__opt{font-family:var(--sans);font-weight:500;font-size:.84rem;border:none;cursor:pointer;
  background:transparent;color:var(--txt-soft);padding:9px 20px;border-radius:30px;transition:.2s}
.toggle__opt.is-on{background:var(--ink);color:var(--paper)}
.toggle__hint{font-family:var(--sans);font-weight:300;font-size:.82rem;color:var(--txt-soft);margin-bottom:34px}
.planos__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;text-align:left}
.plano{position:relative;background:#fff;border:1px solid var(--line);border-radius:20px;
  padding:30px 26px;display:flex;flex-direction:column}
.plano--destaque{border-color:var(--gold);box-shadow:0 20px 50px rgba(201,162,75,.18);
  background:linear-gradient(180deg,#fffdf8,#fff)}
.plano__selo{position:absolute;top:-13px;left:50%;transform:translateX(-50%);white-space:nowrap;
  font-family:var(--sans);font-weight:600;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;
  background:linear-gradient(135deg,var(--gold),var(--gold-lt));color:#3a2a10;padding:6px 16px;border-radius:20px}
.plano__nome{font-family:var(--serif);font-weight:600;font-size:1.9rem;color:var(--ink)}
.plano__tag{font-family:var(--serif);font-style:italic;font-size:1.05rem;color:var(--wine);margin-bottom:16px}
.plano__preco{margin-bottom:20px;display:flex;flex-direction:column}
.plano__preco b{font-family:var(--serif);font-weight:600;font-size:2.2rem;color:var(--ink);line-height:1}
.plano__preco small{font-family:var(--sans);font-weight:300;font-size:.8rem;color:var(--txt-soft);margin-top:4px;min-height:1em}
.plano__feats{list-style:none;flex:1;margin-bottom:22px}
.plano__feats li{font-family:var(--sans);font-weight:300;font-size:.95rem;color:var(--txt);
  padding:7px 0 7px 26px;position:relative;border-bottom:1px solid var(--line)}
.plano__feats li:last-child{border-bottom:none}
.plano__feats li::before{content:"✦";position:absolute;left:0;color:var(--gold);font-size:.8rem;top:8px}
.plano .btn{width:100%}
.planos__obs{font-family:var(--sans);font-weight:300;font-size:.9rem;color:var(--txt-soft);margin-top:30px}

/* PASSOS */
.passos{background:var(--ink);color:var(--onDark);padding:clamp(60px,10vw,110px) clamp(20px,5vw,48px);text-align:center}
.passos .section-title{color:var(--onDark)}
.passos__lista{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:28px;max-width:900px;margin:44px auto 0;text-align:center}
.passos__n{display:grid;place-items:center;width:56px;height:56px;margin:0 auto 14px;border-radius:50%;
  font-family:var(--serif);font-size:1.6rem;font-weight:600;color:var(--gold);
  border:1px solid rgba(201,162,75,.5)}
.passos__lista h3{font-family:var(--serif);font-weight:500;font-size:1.4rem;margin-bottom:6px}
.passos__lista p{font-family:var(--sans);font-weight:300;font-size:.95rem;color:var(--onDark-soft)}

/* ORÇAMENTO */
.orc{padding:clamp(60px,10vw,110px) clamp(20px,5vw,48px);background:var(--paper2)}
.orc__card{max-width:680px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:24px;
  padding:clamp(30px,6vw,52px);box-shadow:0 20px 50px rgba(42,26,34,.08);text-align:center}
.orc__card .section-title{text-align:center;margin:8px auto 22px}
.form{display:flex;flex-direction:column;gap:14px;text-align:left;margin-top:10px}
.form__row{display:flex;gap:14px;flex-wrap:wrap}
.f-grow{flex:1;min-width:180px}
.form label{display:flex;flex-direction:column;gap:6px;font-family:var(--sans);font-weight:500;
  font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--txt-soft)}
.form input,.form select,.form textarea{font-family:var(--serif);font-size:1.1rem;color:var(--txt);
  background:var(--paper);border:1px solid var(--line);border-radius:11px;padding:12px 14px;width:100%;transition:.2s}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(201,162,75,.18);outline:none}
.form textarea{resize:vertical}
.form .btn{margin-top:4px}
.form__msg{font-family:var(--sans);font-size:.92rem;min-height:1.2em;text-align:center;color:var(--wine)}
.form__msg.ok{color:#2f6b3e}
.orc__wa{display:inline-block;margin-top:18px;font-family:var(--sans);font-size:.9rem;color:var(--wine);
  text-decoration:underline;text-underline-offset:4px}

/* FAQ */
.faq{max-width:760px;margin:0 auto;padding:clamp(60px,10vw,110px) clamp(20px,5vw,48px)}
.faq__list{margin-top:34px;display:flex;flex-direction:column;gap:10px}
.faq details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:4px 20px}
.faq summary{font-family:var(--serif);font-weight:600;font-size:1.2rem;color:var(--ink);
  cursor:pointer;padding:16px 0;list-style:none;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;color:var(--gold);font-weight:400;font-size:1.4rem}
.faq details[open] summary::after{content:"–"}
.faq details p{font-family:var(--sans);font-weight:300;font-size:.98rem;color:var(--txt-soft);padding:0 0 18px}

/* RODAPÉ */
.rodape{background:var(--ink);color:var(--onDark);text-align:center;padding:60px 24px 54px}
.rodape__brand{font-family:var(--serif);font-size:1.6rem;font-weight:500}
.rodape__brand span{color:var(--gold);font-weight:600}
.rodape__sub{font-family:var(--sans);font-weight:300;font-size:.9rem;color:var(--onDark-soft);margin:8px 0 18px}
.rodape__wa{font-family:var(--sans);font-weight:500;font-size:.95rem;color:var(--gold-lt);text-decoration:none}

/* desktop */
@media(min-width:860px){
  .hero{grid-template-columns:1.15fr .85fr;gap:50px}
  .demo{grid-template-columns:1fr 1fr}
  .demo__txt{text-align:left}
  .demo__txt .section-title,.demo__txt p{text-align:left;margin-left:0}
  .demo .section-label{text-align:left}
}
