:root{
--brand-violet:#7C3AC9;
--brand-violet-deep:#4A1F80;
--brand-orange:#E5551A;
--brand-orange-soft:#FF8F5B;
--brand-ink:#1A0A2E;
--brand-mist:#F6F0FF;
--brand-cream:#FFF8F2;
}
body{
font-family:'Be Vietnam Pro',sans-serif;color:var(--brand-ink);-webkit-font-smoothing:antialiased;
background:
radial-gradient(circle at 90% 6%,rgba(229,85,26,.09),transparent 28%),
radial-gradient(circle at 12% 0%,rgba(124,58,201,.08),transparent 28%),
linear-gradient(180deg,var(--brand-cream) 0%,#fff 42%,var(--brand-mist) 100%);
}
.ff-display,h1,h2,h3{font-family:'Be Vietnam Pro',sans-serif;line-height:1.15;letter-spacing:-.015em}
h1{font-size:clamp(2.8rem,5.5vw,4.8rem);font-weight:800}
h2{font-size:clamp(1.8rem,3vw,2.6rem);font-weight:700}
p{line-height:1.75}
.label{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--brand-orange)}

#prog{position:fixed;top:0;left:0;height:2px;background:linear-gradient(90deg,var(--brand-orange),var(--brand-violet));z-index:9999;width:0;transition:width .12s}

#btt{opacity:0;transform:translateY(8px);transition:all .3s}
#btt.show{opacity:1;transform:translateY(0)}

#nav.scrolled{background:rgba(255,250,244,.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid rgba(124,58,201,.14);box-shadow:0 8px 26px rgba(74,31,128,.08)}
#nav.nav-solid{background:rgba(255,250,244,.95);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(124,58,201,.16);box-shadow:0 10px 28px rgba(74,31,128,.09)}

.has-drop .drop{display:none;padding-top:8px}
.has-drop:hover .drop{display:block;animation:dropIn .2s ease}
@keyframes dropIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
#mob{display:none}#mob.open{display:block}
body.mob-open{overflow:hidden}

.gt{background:linear-gradient(135deg,var(--brand-orange),var(--brand-violet));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.gt-o{background:linear-gradient(135deg,var(--brand-orange),var(--brand-orange-soft));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}

.rv{opacity:0;transform:translateY(16px);transition:opacity .4s cubic-bezier(.22,1,.36,1),transform .4s cubic-bezier(.22,1,.36,1)}
.rv.vi{opacity:1;transform:none}
.rv-l{opacity:0;transform:translateX(-16px);transition:opacity .4s cubic-bezier(.22,1,.36,1),transform .4s cubic-bezier(.22,1,.36,1)}
.rv-l.vi,.rv-r.vi{opacity:1;transform:none}
.rv-r{opacity:0;transform:translateX(16px);transition:opacity .4s cubic-bezier(.22,1,.36,1),transform .4s cubic-bezier(.22,1,.36,1)}
[data-d="1"]{transition-delay:.05s}[data-d="2"]{transition-delay:.1s}
[data-d="3"]{transition-delay:.15s}[data-d="4"]{transition-delay:.2s}
[data-d="5"]{transition-delay:.25s}[data-d="6"]{transition-delay:.3s}

.faq-body{max-height:0;overflow:hidden;transition:max-height .3s ease}
.faq-icon{transition:transform .3s}

#cookie{transform:translateY(100px);opacity:0;transition:all .45s ease}
#cookie.show{transform:translateY(0);opacity:1}

/* Shared page system */
.web-section{position:relative}
.web-section::after{content:'';position:absolute;left:5%;right:5%;bottom:0;height:1px;background:linear-gradient(90deg,transparent,rgba(124,58,201,.2) 36%,rgba(229,85,26,.18) 64%,transparent)}
.web-shell{max-width:1200px;margin-inline:auto}
.web-card{
  background:linear-gradient(150deg,rgba(255,255,255,.95),rgba(247,239,255,.8));
  border:1px solid rgba(124,58,201,.18);
  border-radius:18px;
  box-shadow:0 16px 40px rgba(74,31,128,.11);
}
.web-soft{background:linear-gradient(145deg,#fff,#f7f1ff 58%,#fff4ec)}
.cms-content{
  background:linear-gradient(155deg,rgba(255,255,255,.96),rgba(248,241,255,.9));
  border:1px solid rgba(124,58,201,.18);
  border-radius:20px;
  box-shadow:0 18px 38px rgba(74,31,128,.11);
  padding:clamp(18px,3vw,34px);
  color:#2b1c42;
}
.cms-content > *:first-child{margin-top:0}
.cms-content > *:last-child{margin-bottom:0}
.cms-content h1,.cms-content h2,.cms-content h3,.cms-content h4{
  color:#1A0A2E;
  line-height:1.2;
  margin:1.15em 0 .55em;
  font-family:'Be Vietnam Pro',sans-serif;
}
.cms-content h1{font-size:clamp(1.8rem,3vw,2.4rem);font-weight:800}
.cms-content h2{font-size:clamp(1.45rem,2.4vw,1.95rem);font-weight:750}
.cms-content h3{font-size:clamp(1.2rem,2vw,1.45rem);font-weight:700}
.cms-content p,.cms-content li,.cms-content td,.cms-content th{font-size:15px;line-height:1.8;color:#4a4260}
.cms-content p{margin:.75rem 0}
.cms-content ul,.cms-content ol{margin:.8rem 0 .95rem;padding-left:1.2rem}
.cms-content a{color:#7C3AC9;text-decoration:none;font-weight:600}
.cms-content a:hover{color:#E5551A}
.cms-content blockquote{
  margin:1rem 0;
  border-left:3px solid rgba(124,58,201,.35);
  padding:.6rem .95rem;
  background:rgba(124,58,201,.06);
  border-radius:0 12px 12px 0;
}
.cms-content table{
  width:100%;
  border-collapse:collapse;
  margin:1rem 0;
  overflow:hidden;
  border-radius:12px;
}
.cms-content th,.cms-content td{border:1px solid rgba(124,58,201,.16);padding:.7rem .8rem}
.cms-content th{background:rgba(124,58,201,.08);font-weight:700;color:#2e2146}
.related-shell{
  background:linear-gradient(140deg,rgba(255,255,255,.96),rgba(255,243,234,.88));
  border:1px solid rgba(229,85,26,.2);
  border-radius:20px;
  padding:clamp(16px,2.6vw,28px);
  box-shadow:0 14px 34px rgba(229,85,26,.11);
}
.related-title{
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:700;
  color:#E5551A;
  margin:0 0 12px;
}
.facts-band{
  background:linear-gradient(90deg,rgba(124,58,201,.14),rgba(255,255,255,.92),rgba(229,85,26,.15));
  border-bottom:1px solid rgba(124,58,201,.18);
}
.field-premium{
  border:1px solid rgba(124,58,201,.2);
  background:rgba(255,255,255,.95);
  box-shadow:0 6px 18px rgba(74,31,128,.08);
}
.field-premium:focus{
  border-color:rgba(124,58,201,.56);
  box-shadow:0 0 0 3px rgba(229,85,26,.14);
}
.border.border-gray-200.rounded-xl,
.border.border-gray-200.rounded-2xl{
  border-color:rgba(124,58,201,.2);
  box-shadow:0 14px 30px rgba(74,31,128,.08);
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(250,245,255,.92));
}
.border.border-gray-200.rounded-xl:hover,
.border.border-gray-200.rounded-2xl:hover{
  box-shadow:0 22px 44px rgba(74,31,128,.15);
}
input.border.border-gray-200,
textarea.border.border-gray-200,
select.border.border-gray-200{
  border-color:rgba(124,58,201,.2);
  background:rgba(255,255,255,.96);
}
input.border.border-gray-200:focus,
textarea.border.border-gray-200:focus,
select.border.border-gray-200:focus{
  border-color:rgba(124,58,201,.56);
  box-shadow:0 0 0 3px rgba(229,85,26,.14);
}

/* AI slot */
.ai-slot{position:relative;max-width:min(100%,460px);margin-inline:auto}
.ai-slot-frame{
  border-radius:22px;
  overflow:hidden;
  border:1px solid rgba(124,58,201,.22);
  background:linear-gradient(145deg,#f4ebff 15%,#fff2e8 85%);
  box-shadow:0 16px 36px rgba(74,31,128,.16);
}
.ai-slot-placeholder{
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:14px;
  border:1.5px dashed rgba(124,58,201,.28);
  border-radius:22px;
  margin:8px;
  background:rgba(255,255,255,.74);
}
.ai-slot-badge{
  display:inline-flex;
  align-items:center;
  padding:5px 10px;
  border-radius:999px;
  font-size:11px;
  letter-spacing:.08em;
  font-weight:700;
  color:#7C3AC9;
  background:rgba(124,58,201,.12);
  margin-bottom:10px;
}
.ai-slot-title{font-weight:700;color:#1A0A2E;font-size:14px;margin:0 0 6px}
.ai-slot-prompt{font-size:11.5px;line-height:1.45;color:#675a7a;max-width:260px;margin:0}
.hero-ai-slot{max-width:360px}
.hero-ai-slot .ai-slot-frame{transform:rotate(-1deg);transition:transform .35s ease}
.hero-ai-slot:hover .ai-slot-frame{transform:rotate(0deg) scale(1.02)}

/* Hero component */
.page-hero-premium::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(120deg,transparent 32%,rgba(255,255,255,.26) 50%,transparent 68%);
  transform:translateX(-120%);
  animation:heroSweepGlobal 11s ease-in-out infinite;
  pointer-events:none;
}
@keyframes heroSweepGlobal{
  0%,15%{transform:translateX(-120%)}
  48%,100%{transform:translateX(120%)}
}

@media (max-width:900px){
  .web-section::after{left:0;right:0}
  .page-hero-premium::before{display:none}
  .ai-slot{max-width:300px}
  .hero-ai-slot{max-width:300px}
  .ai-slot-placeholder{margin:6px}
}