/* =========================================================
   Zxnova — "Ivory Atelier" luxury light theme
   Loaded after style.css. Warm ivory + champagne gold + deep emerald ink,
   frosted glass surfaces, with deep-emerald "jewel" bands (CTA, footer).
   ========================================================= */
:root{
  --bg:#faf7f0; --bg-2:#f3eee3; --bg-3:#fffdf8; --surface:#ffffff; --surface-2:#f5efe2;
  --line:rgba(15,38,36,.09); --line-2:rgba(168,116,42,.24); --line-w:rgba(15,38,36,.1);
  --text:#0f2624; --muted:#566b67; --dim:#8a9894;
  --gold:#a8742a; --gold-2:#d4a659; --gold-3:#8c6428; --teal:#0f766e;
  --ivory:#fffdf8; --ink:#0f2624;
  --grad-gold:linear-gradient(110deg,#f4dca2 0%,#dcae5e 45%,#b07a2e 100%);
  --grad-text:linear-gradient(100deg,#c08b39 0%,#9a6620 55%,#7a4f17 100%);
  --glass:linear-gradient(150deg,rgba(255,255,255,.86),rgba(255,255,255,.58));
  --glass-line:rgba(255,255,255,.9);
  --shadow-soft:0 1px 0 rgba(255,255,255,.95) inset,0 30px 60px -36px rgba(15,38,36,.28),0 4px 14px -8px rgba(15,38,36,.08);
  --shadow-lift:0 1px 0 rgba(255,255,255,.95) inset,0 44px 80px -40px rgba(15,38,36,.38),0 10px 24px -14px rgba(168,116,42,.22);
  --blur:blur(22px) saturate(170%);
}
/* deep emerald "jewel" scopes keep the old night palette */
.footer,.cta,.mega-feature,.wa-card,.jewel{
  --bg:#061514; --bg-2:#082220; --bg-3:#0b2926; --surface:#0d2b29; --surface-2:#123633;
  --line:rgba(233,194,125,.12); --line-2:rgba(233,194,125,.24); --line-w:rgba(255,255,255,.08);
  --text:#f6f1e7; --muted:#b3c6c0; --dim:#7b958f; --gold:#e9c27d; --gold-3:#c79549; --ivory:#f6f1e7;
  --grad-text:linear-gradient(105deg,#f8e2ae,#e9c27d 45%,#c79549);
  color:var(--text)}

body{background:var(--bg);color:var(--text)}
body::before{content:"";position:fixed;inset:-20vh -20vw;z-index:-1;pointer-events:none;
  background:radial-gradient(42vw 42vw at 85% 8%,rgba(220,174,94,.16),transparent 60%),
             radial-gradient(38vw 38vw at 5% 40%,rgba(15,118,110,.08),transparent 60%),
             radial-gradient(40vw 40vw at 70% 95%,rgba(220,174,94,.10),transparent 60%);
  animation:lx-drift 28s ease-in-out infinite alternate}
@keyframes lx-drift{to{transform:translate3d(-3vw,2vh,0) rotate(2deg)}}
body::after{opacity:.025;mix-blend-mode:multiply}
::selection{background:#e9c27d;color:#0f2624}

h1 em,h2 em,h3 em,.statement em,p.h-xl em,p.h-hero em{background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.label,.eyebrow,.mega-h,.mm-h,.foot-h{color:var(--gold)}
.label::before{background:linear-gradient(90deg,transparent,var(--gold))}

/* ---------- buttons: ink fill on hover ---------- */
.btn{border-color:rgba(15,38,36,.16);color:var(--text)}
.btn::before{background:var(--ink)}
.btn:hover{color:#fffdf8;border-color:var(--ink)}
.btn-gold{color:#2b1c05;border-color:transparent;box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 18px 36px -16px rgba(168,116,42,.75)}
.btn-gold::before{background:var(--ink)}
.btn-gold:hover{color:#f6dca6}
.btn-ghost{background:rgba(255,255,255,.6);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.jewel .btn,.cta .btn,.footer .btn{border-color:var(--line-2);color:var(--text)}
.jewel .btn::before,.cta .btn::before,.footer .btn::before{background:#f6f1e7}
.jewel .btn:hover,.cta .btn:hover,.footer .btn:hover{color:#0f2624}
.cta .btn-gold{color:#2b1c05}
.btn-wa:hover svg{color:#25d366}

/* ---------- header: floating pearl glass ---------- */
.nav{background:rgba(255,253,248,.66);border:1px solid var(--glass-line);box-shadow:0 18px 50px -28px rgba(15,38,36,.35),0 1px 0 #fff inset;-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}
.logo-word b{color:var(--ink)}
.logo-mark{filter:drop-shadow(0 4px 10px rgba(168,116,42,.25))}
.nav-links>a,.nav-item>a{color:var(--muted)}
.nav-links>a:hover,.nav-item>a:hover,.nav-links a.active{color:var(--text);background:rgba(15,38,36,.05)}
.mega,.mega-in{background:rgba(255,253,248,.94)!important;border-color:var(--glass-line)!important;box-shadow:0 50px 100px -40px rgba(15,38,36,.45)!important}
.mega-col a:hover,.mega-col a:focus-visible{background:rgba(168,116,42,.08)}
.mi{background:linear-gradient(140deg,rgba(220,174,94,.18),rgba(15,118,110,.08));border-color:rgba(168,116,42,.18);color:var(--gold)}
.mega-col a:hover .mi{background:var(--ink);color:#e9c27d}
.burger{border-color:rgba(15,38,36,.16);background:rgba(255,255,255,.6)}
.mobile-menu{background:var(--bg)}
.cur-switch select{background-color:rgba(255,255,255,.7)!important;color:var(--text);border-color:var(--line-2)}

/* ---------- cursor ---------- */
.cursor{border-color:rgba(168,116,42,.55)}
.cursor.hover{background:rgba(168,116,42,.08)}
.cursor-dot{background:var(--gold)}

/* ---------- hero: ivory light with champagne aura ---------- */
.hero{background:
  radial-gradient(760px 560px at 76% 42%,rgba(220,174,94,.22),transparent 62%),
  radial-gradient(620px 520px at 92% 92%,rgba(15,118,110,.10),transparent 60%),
  radial-gradient(700px 500px at 0% 0%,rgba(255,255,255,.9),transparent 60%),var(--bg)}
.page-hero{background:radial-gradient(800px 520px at 85% 15%,rgba(220,174,94,.2),transparent 62%),radial-gradient(600px 400px at 0 100%,rgba(15,118,110,.07),transparent 60%),var(--bg)}
.hero::after,.page-hero::after{background:linear-gradient(to top,var(--bg),transparent)}
.live-pill{background:rgba(255,255,255,.7);border-color:var(--glass-line);box-shadow:0 10px 30px -18px rgba(15,38,36,.35);color:var(--muted)}
.live-pill .dot{background:#10b981}
.stat b{background:var(--grad-text);-webkit-background-clip:text;background-clip:text}
.hero-stats .stat,.hero-stats .stat+.stat{border-color:var(--line)}
@media (max-width:980px){
  .hero{background:radial-gradient(520px 360px at 50% 18%,rgba(220,174,94,.26),transparent 70%),radial-gradient(500px 400px at 50% 100%,rgba(15,118,110,.08),transparent 65%),var(--bg)}
  .hero-stats{background:var(--glass);border-color:var(--glass-line);box-shadow:var(--shadow-soft)}
}
.scroll-cue i::after{background:var(--gold)}
.price-badge{background:rgba(255,255,255,.7);border-color:var(--line-2)}

/* ---------- sections ---------- */
.light{background:linear-gradient(180deg,#fffdf8,#fbf6ec);color:var(--ink)}
.dark-2{background:linear-gradient(180deg,rgba(243,238,227,.7),rgba(250,247,240,.7));border-color:var(--line)}
.logo-chip{border-color:rgba(15,38,36,.06);box-shadow:0 18px 40px -26px rgba(15,38,36,.35)}
.statement .w{opacity:.14}

/* ---------- glass cards ---------- */
.card,.review,section:not(.light) .review,.form,.qq-form,.author-box,.faq details,.price-card,.area-card,.step,.value{
  background:var(--glass);border:1px solid var(--glass-line);box-shadow:var(--shadow-soft);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}
.card{border-radius:26px}
.card:hover,.review:hover{border-color:rgba(168,116,42,.35);box-shadow:var(--shadow-lift)}
.tilt .glare{background:radial-gradient(600px circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.7),transparent 40%)}
.spot{background:radial-gradient(420px circle at var(--gx,50%) var(--gy,50%),rgba(220,174,94,.16),transparent 55%)}
.svc-ic,.why-ic{background:linear-gradient(140deg,rgba(220,174,94,.2),rgba(15,118,110,.07));border-color:rgba(168,116,42,.2);color:var(--gold)}
.svc-card:hover .svc-ic,.area-card:hover .svc-ic,.card:hover .go{background:var(--ink);color:#e9c27d}
.go{border-color:rgba(15,38,36,.14)}
.tag{background:rgba(220,174,94,.14);color:#8c6428;border-color:rgba(168,116,42,.25)}
.chip{border-color:rgba(15,38,36,.14);background:rgba(255,255,255,.55)}
.chip:hover{border-color:var(--gold)}
.chip.active{color:#2b1c05}
.why-card:hover{border-color:rgba(168,116,42,.4)}

/* portfolio frames: pearl browser chrome */
.pj-frame{background:#fff;border-color:rgba(15,38,36,.08);box-shadow:0 50px 90px -50px rgba(15,38,36,.5),0 1px 0 #fff inset}
.pj-bar{background:linear-gradient(180deg,#fbf8f2,#f3eee3);border-bottom-color:rgba(15,38,36,.07)}
.pj-bar i{background:rgba(15,38,36,.14)}
.pj-bar i:nth-child(1){background:#f87171}.pj-bar i:nth-child(2){background:#fbbf24}.pj-bar i:nth-child(3){background:#34d399}
.pj-ph{background:radial-gradient(circle at 30% 20%,rgba(220,174,94,.25),transparent 60%),var(--surface-2)}

/* reviews */
.review figcaption small,section:not(.light) .review figcaption small{color:var(--muted)}
.avatar{background:var(--ink);color:#e9c27d}

/* founder */
.founder-card::after{background:linear-gradient(to top,rgba(15,38,36,.78),transparent 55%)}
.founder-card figcaption b{color:#fffdf8}
.founder-card figcaption span{color:#f1d39a}

/* forms */
.fld-box,.qq-form input,.qq-form select,.qq-form textarea{background:rgba(255,255,255,.85)!important;border-color:rgba(15,38,36,.12)!important;color:var(--text)}
.fld-box:focus-within,.qq-form input:focus,.qq-form select:focus,.qq-form textarea:focus{background:#fff!important;border-color:var(--gold)!important;box-shadow:0 0 0 4px rgba(220,174,94,.18)!important}
.qq-form select option{background:#fff;color:var(--text)}
.types label{background:rgba(255,255,255,.6)}
.form-badge{background:rgba(16,185,129,.08);border-color:rgba(16,185,129,.25);color:#047857}
.fld-err,.qq-err,.fld.bad .fld-ic,.fld.bad>label{color:#be123c}
.qq-done{background:rgba(16,185,129,.08);border-color:rgba(16,185,129,.25);color:#065f46}
.qq-done b{color:#047857}
.qq-sec{background:radial-gradient(700px 420px at 85% 30%,rgba(220,174,94,.18),transparent 65%),linear-gradient(180deg,#f6f1e6,#faf7f0)}
.qq-direct a{background:rgba(255,255,255,.7);border-color:var(--glass-line);box-shadow:var(--shadow-soft)}
.done-steps li{background:rgba(255,255,255,.7)}
.map-frame,.map-tag{box-shadow:var(--shadow-lift)}
.map-tag{background:rgba(255,253,248,.94)!important;color:var(--text)}

/* blog / prose */
.prose{color:#2f4441}
.prose pre{background:#0f2624;color:#e9efe9}
.prose code{background:rgba(15,38,36,.06)}
.prose img{box-shadow:var(--shadow-soft)}

/* ---------- jewel bands ---------- */
.cta{background:radial-gradient(800px 400px at 50% -10%,rgba(233,194,125,.22),transparent 60%),linear-gradient(160deg,#0f3a36,#061514 70%);border-color:rgba(233,194,125,.25);box-shadow:0 60px 120px -50px rgba(15,38,36,.7)}
.cta p{color:var(--muted)}
.footer{background:radial-gradient(900px 500px at 80% 0,rgba(31,122,112,.25),transparent 60%),linear-gradient(180deg,#0b2926,#061514);border-top:0}
.footer ul a:hover,.nap a:hover{color:var(--gold)}
.socials a{color:var(--text)}

/* phones: sticky contact bar in pearl glass */
@media (max-width:760px){
  .m-cta{background:rgba(255,253,248,.9)!important;border-color:var(--glass-line)!important;box-shadow:0 20px 40px -14px rgba(15,38,36,.45)!important}
  .m-cta a{color:var(--muted)}
}

/* ---------- motion extras (driven by main.js) ---------- */
.lx-progress{position:fixed;left:0;top:0;height:2px;width:100%;z-index:150;transform-origin:0 50%;transform:scaleX(0);background:var(--grad-gold);pointer-events:none}
html.anim [data-unveil]{clip-path:inset(12% 8% 12% 8% round 28px);opacity:.001}
[data-unveil]{will-change:clip-path}
.lx-ribbon{padding:28px 0;overflow:hidden;border-block:1px solid var(--line);background:linear-gradient(90deg,rgba(255,255,255,.5),rgba(243,238,227,.6))}
.lx-ribbon-track{display:flex;gap:56px;width:max-content;animation:marquee 46s linear infinite;align-items:center}
.lx-ribbon span{font-family:var(--f-serif);font-size:clamp(1.4rem,2.4vw,2.1rem);font-weight:500;color:var(--text);white-space:nowrap;display:inline-flex;align-items:center;gap:56px}
.lx-ribbon span::after{content:"✦";font-size:.8rem;color:var(--gold)}
.lx-ribbon span em{font-style:italic;background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}
@media (prefers-reduced-motion:reduce){body::before{animation:none}.lx-ribbon-track{animation:none}html.anim [data-unveil]{clip-path:none;opacity:1}}
.lx-ribbon a{display:inline-flex}.lx-ribbon a:hover em{filter:brightness(1.2)}

/* preloader + page curtain in ivory */
.preloader{background:radial-gradient(600px 400px at 50% 40%,rgba(220,174,94,.18),transparent 70%),var(--bg)}
.pl-word{color:var(--ink)}
.pl-count{color:var(--dim)}
.pl-bar{background:rgba(15,38,36,.1)}
.curtain{background:linear-gradient(180deg,#fffdf8,#f3eee3)}
.curtain::after{filter:drop-shadow(0 10px 24px rgba(168,116,42,.35))}
