/* Base */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Liberation Sans", sans-serif;
  background: radial-gradient(900px 600px at 10% -10%, rgba(123,199,182,.18), transparent 60%),
              radial-gradient(720px 520px at 90% 0%, rgba(181,139,230,.14), transparent 55%),
              radial-gradient(900px 700px at 50% 120%, rgba(217,179,108,.14), transparent 60%),
              var(--bg);
  color:var(--text);
}

/* Skip link */
.skip-link{
  position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden;
}
.skip-link:focus{
  left:12px; top:12px; width:auto; height:auto; padding:.6rem .8rem;
  background: rgba(15,33,65,.92); border:1px solid var(--line); border-radius:12px;
  z-index:9999;
}

/* Helpers */
.muted{color:var(--muted)}
.kicker{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size:.86rem; letter-spacing:.12em; text-transform:uppercase;
  color: rgba(240,217,162,.86);
}
.kicker::before{
  content:""; width:26px; height:2px;
  background: linear-gradient(90deg, var(--primary), rgba(217,179,108,0));
  border-radius:999px;
}

.section{padding:84px 0}
.section-surface{
  position:relative;
  background: linear-gradient(180deg, rgba(11,23,48,.92), rgba(7,16,34,.92));
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.section-title{font-weight:650; letter-spacing:-.02em}

/* Nav */
.navbar-glass{
  background: rgba(7,16,34,.72);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(236,242,255,.10);
}
.navbar .nav-link{
  color: rgba(236,242,255,.78);
  border-radius: 999px;
  padding: .55rem .85rem;
}
.navbar .nav-link:hover{color:var(--text); background: rgba(236,242,255,.06)}
.navbar .nav-link.active{color:var(--text); background: rgba(217,179,108,.12); border:1px solid rgba(217,179,108,.22)}
.navbar-toggler{border:1px solid rgba(236,242,255,.18)}
.navbar-toggler-icon{filter: invert(1); opacity:.85}

.brand{display:inline-flex; align-items:center; gap:.55rem; text-decoration:none}
.brand-name{color: rgba(240,217,162,.92);}
.brand-text{font-weight:750; letter-spacing:.02em; color:var(--text)}
.brand-mark{
  width:28px; height:28px; border-radius:10px;
  background:
    radial-gradient(10px 10px at 30% 35%, rgba(240,217,162,.95), transparent 55%),
    radial-gradient(12px 12px at 72% 70%, rgba(123,199,182,.82), transparent 55%),
    linear-gradient(135deg, rgba(217,179,108,.85), rgba(181,139,230,.40));
  box-shadow: 0 12px 24px rgba(0,0,0,.35);
  border: 1px solid rgba(236,242,255,.12);
}
.brand-footer .brand-text{opacity:.95}

/* Buttons */
.btn-primary{
  background: linear-gradient(135deg, var(--primary), var(--primary2));
  border: 0;
  color: #1b1a16;
  box-shadow: 0 14px 30px rgba(217,179,108,.18);
}
.btn-primary:hover{filter: brightness(1.02)}
.btn-outline-light{
  border-color: rgba(236,242,255,.28);
  color: rgba(236,242,255,.92);
}
.btn-outline-light:hover{
  background: rgba(236,242,255,.08);
  border-color: rgba(236,242,255,.35);
  color: var(--text);
}

/* Hero */
.hero{
  position:relative;
  padding: 90px 0 0;
  overflow:hidden;
}
.hero-bg{
  position:absolute; inset:-2px;
  background:
    radial-gradient(900px 520px at 20% 12%, rgba(123,199,182,.18), transparent 60%),
    radial-gradient(900px 620px at 85% 20%, rgba(181,139,230,.16), transparent 60%),
    radial-gradient(980px 760px at 50% 100%, rgba(217,179,108,.16), transparent 62%);
  pointer-events:none;
}
.hero-pills{display:flex; flex-wrap:wrap; gap:.5rem}
.pill{
  padding:.5rem .75rem;
  border-radius: 999px;
  border:1px solid rgba(236,242,255,.12);
  background: rgba(15,33,65,.55);
  color: rgba(236,242,255,.86);
  font-size: .92rem;
}

.micro{display:grid; gap:.5rem}
.micro-item{display:flex; align-items:center; gap:.6rem; color: rgba(236,242,255,.78); font-size:.94rem}
.micro-dot{
  width:10px; height:10px; border-radius:999px;
  background: linear-gradient(135deg, rgba(123,199,182,.95), rgba(217,179,108,.75));
  box-shadow: 0 10px 18px rgba(0,0,0,.25);
}

.hero-card{
  position:relative;
  background: linear-gradient(180deg, rgba(15,33,65,.86), rgba(11,23,48,.86));
  border:1px solid rgba(236,242,255,.12);
  border-radius: var(--radius2);
  box-shadow: var(--shadow);
  overflow:hidden;
}
.hero-card::before{
  content:"";
  position:absolute; inset:-1px;
  background: radial-gradient(520px 240px at 30% 0%, rgba(217,179,108,.20), transparent 55%),
              radial-gradient(520px 260px at 90% 60%, rgba(123,199,182,.16), transparent 60%);
  pointer-events:none;
}
.hero-card-top{
  position:relative;
  display:flex; justify-content:space-between; align-items:center;
  padding: 16px 18px;
  border-bottom: 1px solid rgba(236,242,255,.10);
}
.hero-badge{
  display:inline-flex;
  padding:.35rem .65rem;
  border-radius:999px;
  border:1px solid rgba(217,179,108,.22);
  background: rgba(217,179,108,.10);
  color: rgba(240,217,162,.92);
  font-size:.85rem;
}
.hero-meter{display:flex; gap:6px}
.hero-meter span{
  width:10px; height:10px; border-radius:3px;
  background: rgba(236,242,255,.14);
}
.hero-meter span:nth-child(2){background: rgba(123,199,182,.30)}
.hero-meter span:nth-child(3){background: rgba(181,139,230,.26)}
.hero-meter span:nth-child(4){background: rgba(217,179,108,.35)}

.hero-card-body{position:relative; padding: 18px}
.hero-card-line{height:1px; background: rgba(236,242,255,.10); margin: 14px 0}

.checklist{list-style:none; padding:0; margin:0; display:grid; gap:.65rem}
.checklist li{
  position:relative; padding-left:28px; color: rgba(236,242,255,.84);
}
.checklist li::before{
  content:"";
  position:absolute; left:0; top:.2rem;
  width:18px; height:18px; border-radius:6px;
  background: linear-gradient(135deg, rgba(217,179,108,.85), rgba(123,199,182,.60));
  box-shadow: 0 10px 18px rgba(0,0,0,.25);
}

.hero-side{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-top: 12px;
  opacity:.92;
}
.tile{
  height: 52px;
  border-radius: 16px;
  border:1px solid rgba(236,242,255,.10);
  background: rgba(15,33,65,.55);
  box-shadow: var(--shadow2);
}
.tile.t1{transform: rotate(-1.6deg)}
.tile.t2{transform: rotate(1.2deg)}
.tile.t3{transform: rotate(-.6deg)}

/* Dividers */
.section-divider{
  position:relative;
  margin-top: 58px;
  opacity:.95;
}
.section-divider svg{width:100%; height:140px; display:block}
.section-divider path{
  fill: rgba(11,23,48,.92);
  filter: drop-shadow(0 -8px 18px rgba(0,0,0,.20));
}
.section-divider.alt path{fill: rgba(7,16,34,.92)}

/* Cards */
.grid-cards{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
}
@media (max-width: 992px){
  .grid-cards{grid-template-columns: 1fr}
}
.shape-card{
  position:relative;
  padding: 18px;
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(15,33,65,.70), rgba(11,23,48,.70));
  border: 1px solid rgba(236,242,255,.12);
  box-shadow: var(--shadow2);
  overflow:hidden;
}
.shape-card::after{
  content:"";
  position:absolute;
  right:-40px; top:-40px;
  width:140px; height:140px;
  background: radial-gradient(circle at 30% 30%, rgba(217,179,108,.20), transparent 60%),
              radial-gradient(circle at 70% 70%, rgba(123,199,182,.16), transparent 62%);
  filter: blur(2px);
}
.shape-icon{
  width:40px; height:40px;
  display:grid; place-items:center;
  border-radius: 14px;
  border: 1px solid rgba(236,242,255,.12);
  background: rgba(236,242,255,.06);
  color: rgba(240,217,162,.95);
  margin-bottom: 10px;
  position:relative;
}

/* Callout */
.callout{
  border-radius: 26px;
  border: 1px solid rgba(217,179,108,.18);
  background: linear-gradient(135deg, rgba(217,179,108,.10), rgba(123,199,182,.08));
  box-shadow: var(--shadow2);
}
.callout-inner{
  padding: 16px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
}
.callout-title{font-weight:650}
.callout-text{font-size:.96rem}

/* Stats / mini panels */
.stat-card, .mini-panel, .panel, .form-card{
  background: linear-gradient(180deg, rgba(15,33,65,.70), rgba(11,23,48,.70));
  border: 1px solid rgba(236,242,255,.12);
  border-radius: var(--radius2);
  box-shadow: var(--shadow2);
}
.stat-card{padding: 16px 18px}
.stat-title{color: rgba(240,217,162,.86); font-size:.9rem; letter-spacing:.08em; text-transform:uppercase}
.stat-value{font-weight:650; margin-top:6px}
.stat-sub{color:var(--muted); margin-top:6px}

.mini-panel{padding: 14px 16px}
.mini-label{color: rgba(240,217,162,.86); font-size:.86rem; letter-spacing:.08em; text-transform:uppercase}
.mini-items{display:flex; flex-wrap:wrap; gap:8px; margin-top:10px}
.mini-chip{
  padding:.35rem .6rem;
  border-radius: 999px;
  border:1px solid rgba(236,242,255,.12);
  background: rgba(236,242,255,.06);
  color: rgba(236,242,255,.86);
  font-size:.86rem;
}

/* Pricing */
.pricing-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
}
@media (max-width: 992px){
  .pricing-grid{grid-template-columns: 1fr}
}
.price-card{
  position:relative;
  padding: 18px;
  border-radius: 26px;
  background: linear-gradient(180deg, rgba(15,33,65,.70), rgba(11,23,48,.70));
  border: 1px solid rgba(236,242,255,.12);
  box-shadow: var(--shadow2);
  overflow:hidden;
}
.price-card.featured{
  border-color: rgba(217,179,108,.28);
  box-shadow: 0 22px 60px rgba(0,0,0,.40);
}
.price-card.featured::before{
  content:"";
  position:absolute; inset:-2px;
  background: radial-gradient(520px 240px at 40% 0%, rgba(217,179,108,.24), transparent 55%),
              radial-gradient(520px 280px at 95% 70%, rgba(181,139,230,.18), transparent 60%);
  pointer-events:none;
}
.price-top{display:flex; justify-content:space-between; align-items:center; gap:12px}
.price-name{font-weight:700}
.price-tag{
  padding:.35rem .6rem;
  border-radius:999px;
  border:1px solid rgba(236,242,255,.12);
  background: rgba(236,242,255,.06);
  color: rgba(236,242,255,.82);
  font-size:.86rem;
}
.price-value{font-size:2rem; font-weight:760; letter-spacing:-.02em; margin-top:12px}
.price-list{
  padding-left: 1rem;
  margin: 0;
  color: rgba(236,242,255,.84);
}
.price-list li{margin:.35rem 0}

/* Accordion tweaks */
.accordion-item{
  background: rgba(15,33,65,.55);
  border: 1px solid rgba(236,242,255,.10);
}
.accordion-button{
  background: rgba(15,33,65,.55);
  color: rgba(236,242,255,.92);
}
.accordion-button:focus{box-shadow:none}
.accordion-button:not(.collapsed){
  color: rgba(240,217,162,.95);
  background: rgba(217,179,108,.10);
}
.accordion-body{background: rgba(11,23,48,.55)}

/* Quotes */
.quote-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
}
@media (max-width: 992px){
  .quote-grid{grid-template-columns: 1fr}
}
.quote-card{
  padding: 18px;
  border-radius: 26px;
  border: 1px solid rgba(236,242,255,.12);
  background: linear-gradient(180deg, rgba(15,33,65,.60), rgba(11,23,48,.60));
  box-shadow: var(--shadow2);
}
.quote-card blockquote{
  font-size: 1.05rem;
  color: rgba(236,242,255,.92);
}

/* Forms */
.form-card{padding: 18px}
.form-label{color: rgba(236,242,255,.86)}
.form-control, .form-select, textarea{
  background: rgba(7,16,34,.55);
  border: 1px solid rgba(236,242,255,.14);
  color: rgba(236,242,255,.92);
  border-radius: 14px;
}
.form-control::placeholder{
  color: #fff;
}
.form-control:focus, textarea:focus{
  background: rgba(7,16,34,.65);
  border-color: rgba(217,179,108,.35);
  box-shadow: 0 0 0 .2rem rgba(217,179,108,.12);
  color: rgba(236,242,255,.94);
}
.form-check-input{
  background-color: rgba(7,16,34,.55);
  border: 1px solid rgba(236,242,255,.18);
}
.form-check-input:checked{
  background-color: rgba(217,179,108,.95);
  border-color: rgba(217,179,108,.95);
}
.form-status{min-height: 1.2em; color: rgba(240,217,162,.92)}

/* Panels */
.panel{padding: 16px 18px}

/* Page hero */
.page-hero{
  position:relative;
  padding: 68px 0 0;
  overflow:hidden;
}
.page-hero::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(820px 520px at 15% 0%, rgba(123,199,182,.14), transparent 60%),
    radial-gradient(760px 520px at 90% 10%, rgba(181,139,230,.12), transparent 60%);
  pointer-events:none;
}

/* Footer */
.footer{
  padding: 56px 0 26px;
  border-top: 1px solid rgba(236,242,255,.10);
  background: rgba(7,16,34,.72);
}
.footer-title{
  color: rgba(240,217,162,.86);
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:.86rem;
  margin-bottom: 10px;
}
.footer-links{
  list-style:none; padding:0; margin:0; display:grid; gap:8px;
}
.footer-links a{color: rgba(236,242,255,.80); text-decoration:none}
.footer-links a:hover{color: var(--text); text-decoration: underline}
.footer-contact a{color: rgba(236,242,255,.88)}
.social-row{display:flex; flex-wrap:wrap; gap:10px}
.social-btn{
  padding:.45rem .7rem;
  border-radius: 999px;
  border: 1px solid rgba(236,242,255,.14);
  background: rgba(236,242,255,.05);
  color: rgba(236,242,255,.86);
  text-decoration:none;
  font-size:.9rem;
}
.social-btn:hover{background: rgba(236,242,255,.08); color: var(--text)}
.footer-note{opacity:.85}
.footer-bottom{
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid rgba(236,242,255,.08);
}

/* Reveal */
.reveal{
  opacity:0;
  transform: translateY(10px);
  transition: opacity .6s ease, transform .6s ease;
}
.reveal.is-visible{
  opacity:1;
  transform: translateY(0);
}