/* Homepage — hybrid theme aware (dark violet + lavender light bands via theme.css) */

.hp-hero{
  min-height:100vh;min-height:100dvh;
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  position:relative;overflow:hidden;
  border-bottom:1px solid var(--border);
  background:#181030;
}
.hp-hero-visual{
  position:relative;min-height:520px;overflow:hidden;
}
.hp-hero-visual img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center 30%;
  filter:brightness(.78) saturate(.95);
}
.hp-hero-visual::after{
  content:'';position:absolute;inset:0;
  background:
    linear-gradient(90deg,transparent 50%,#181030 100%),
    linear-gradient(180deg,rgba(24,16,48,.15) 0%,rgba(24,16,48,.45) 100%);
}
.hp-hero-chip{
  position:absolute;left:28px;bottom:28px;z-index:2;
  background:rgba(24,16,48,.82);backdrop-filter:blur(16px);
  border:1px solid rgba(167,139,250,.4);
  border-radius:16px;padding:16px 20px;max-width:220px;
  color:#EDE8FB;
}
.hp-hero-chip .lbl{
  font-size:10px;letter-spacing:1.8px;text-transform:uppercase;
  color:#B4ABCE;margin-bottom:6px;
}
.hp-hero-chip .val{
  font-family:'Syne',sans-serif;font-size:28px;font-weight:800;
  letter-spacing:-.03em;line-height:1;color:#EDE8FB;
}
.hp-hero-chip .val span{color:#A78BFA}
.hp-hero-chip .sub{font-size:12px;color:#B4ABCE;margin-top:6px;line-height:1.4}

.hp-hero-copy{
  display:flex;flex-direction:column;justify-content:center;
  padding:140px 56px 80px 48px;position:relative;z-index:1;
  background:#181030;color:#EDE8FB;
}
.hp-eyebrow{
  display:inline-flex;align-items:center;gap:12px;margin-bottom:22px;
  font-size:12px;font-weight:600;letter-spacing:2.2px;text-transform:uppercase;
  color:rgba(237,232,251,.72);
}
.hp-eyebrow::before{content:'';width:28px;height:1px;background:#A78BFA}
.hp-hero-copy h1{
  font-family:'Syne',sans-serif;
  font-size:clamp(32px,3.6vw,52px);
  font-weight:800;line-height:1.08;letter-spacing:-.035em;
  margin:0 0 20px;max-width:16ch;color:#EDE8FB;
}
.hp-hero-copy h1 .ac{color:#A78BFA}
.hp-hero-copy .lead{
  font-size:17px;color:#B4ABCE;line-height:1.75;
  max-width:42ch;margin:0 0 32px;
}
.hp-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-bottom:40px}
.hp-mini-stats{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;padding-top:28px;border-top:1px solid rgba(167,139,250,.18);
}
.hp-mini-stats strong{
  display:block;font-family:'Syne',sans-serif;font-size:26px;font-weight:800;
  letter-spacing:-.03em;line-height:1;margin-bottom:4px;color:#EDE8FB;
}
.hp-mini-stats strong span{color:#A78BFA}
.hp-mini-stats span{font-size:12px;color:#B4ABCE;line-height:1.35}

/* Intro strip — dark */
.hp-intro{
  padding:28px 64px;display:flex;align-items:center;justify-content:space-between;
  gap:24px;flex-wrap:wrap;
  background:linear-gradient(90deg,rgba(167,139,250,.14),rgba(24,16,48,.95));
  border-bottom:1px solid rgba(167,139,250,.16);
  color:#EDE8FB;
}
.hp-intro p{margin:0;font-size:14.5px;color:#B4ABCE;max-width:64ch;line-height:1.6}
.hp-intro strong{color:#EDE8FB}

/* LIGHT BAND — lavender surface, dark type (matches theme.css section bands) */
.hp-light{
  background:#ECE6FA;color:#241D3E;
  padding:100px 64px;
}
.hp-light .section-label{color:#6C5CE7}
.hp-light .section-title{color:#241D3E !important;opacity:1 !important;transform:none !important}
.hp-light .section-body{color:#544C72 !important;opacity:1 !important;transform:none !important}
.hp-light a.btn-ghost{color:#4A3F7A}
.hp-light a.btn-ghost:hover{color:#6C5CE7}

.hp-pivot-grid{
  display:grid;grid-template-columns:1fr 1.2fr;gap:64px;align-items:start;margin-top:48px;
}
.hp-pivot-list{display:flex;flex-direction:column;gap:0}
.hp-pivot-item{
  display:grid;grid-template-columns:56px 1fr;gap:18px;
  padding:26px 0;border-bottom:1px solid rgba(108,92,231,.16);
}
.hp-pivot-item:first-child{padding-top:0}
.hp-pivot-item:last-child{border-bottom:none;padding-bottom:0}
.hp-pivot-num{
  font-family:'Syne',sans-serif;font-size:22px;font-weight:800;
  color:#6C5CE7;line-height:1.2;
}
.hp-pivot-item h3{
  font-family:'Syne',sans-serif;font-size:18px;font-weight:700;margin:0 0 8px;color:#241D3E;
}
.hp-pivot-item p{margin:0;font-size:14.5px;color:#544C72;line-height:1.7}

/* Services — dark band */
.hp-services{
  padding:100px 64px;background:#181030;color:#EDE8FB;
}
.hp-services .section-label{color:#A78BFA}
.hp-services .section-title{color:#EDE8FB !important;opacity:1 !important;transform:none !important}
.hp-services .section-body{color:#B4ABCE !important;opacity:1 !important;transform:none !important}
.hp-mosaic{
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:48px;
}
.hp-mosaic a{
  display:block;text-decoration:none;color:inherit;
  background:rgba(167,139,250,.06);border:1px solid rgba(167,139,250,.18);
  border-radius:18px;padding:28px 24px;min-height:190px;
  transition:border-color .25s,transform .25s,background .25s;
}
.hp-mosaic a:hover{
  border-color:rgba(167,139,250,.5);background:rgba(167,139,250,.12);
  transform:translateY(-3px);
}
.hp-mosaic .ico{
  width:42px;height:42px;border-radius:12px;
  background:rgba(167,139,250,.14);display:flex;align-items:center;justify-content:center;
  font-size:18px;margin-bottom:18px;
}
.hp-mosaic h3{
  font-family:'Syne',sans-serif;font-size:17px;font-weight:700;margin:0 0 8px;color:#EDE8FB;
}
.hp-mosaic p{margin:0;font-size:13.5px;color:#B4ABCE;line-height:1.65}
.hp-mosaic .wide{
  grid-column:span 2;min-height:160px;display:flex;flex-direction:column;justify-content:center;
  background:linear-gradient(135deg,rgba(167,139,250,.18),rgba(167,139,250,.04));
  border-color:rgba(167,139,250,.3);
}
.hp-mosaic .wide h3{font-size:22px}
.hp-mosaic .wide p{max-width:48ch;font-size:14.5px}

/* Categories — light */
.hp-cats{
  padding:80px 64px;background:#E7E1F8;color:#241D3E;
  border-top:1px solid rgba(108,92,231,.12);border-bottom:1px solid rgba(108,92,231,.12);
}
.hp-cats .section-label{color:#6C5CE7}
.hp-cats .section-title{color:#241D3E !important;opacity:1 !important}
.hp-cat-row{
  display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:36px;
}
.hp-cat{
  text-align:center;padding:22px 12px;
  border:1px solid rgba(108,92,231,.18);border-radius:14px;
  background:#fff;
  font-family:'Syne',sans-serif;font-size:14px;font-weight:700;
  color:#2A2150;letter-spacing:.02em;
  transition:border-color .2s,color .2s,background .2s,box-shadow .2s;
}
.hp-cat:hover{
  border-color:#6C5CE7;color:#6C5CE7;
  box-shadow:0 8px 24px rgba(108,92,231,.12);
}

/* Proof — light */
.hp-proof{padding:100px 64px;background:#ECE6FA;color:#241D3E}
.hp-proof .section-label{color:#6C5CE7}
.hp-proof .section-title{color:#241D3E !important;opacity:1 !important}
.hp-proof .section-body{color:#544C72 !important}
.hp-proof-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin-top:40px;
}
.hp-proof .stats-bar{
  flex-direction:column;background:#fff;border-color:rgba(108,92,231,.14);
}
.hp-proof .stat-item{border-right:none;border-bottom:1px solid rgba(108,92,231,.12)}
.hp-proof .stat-item:last-child{border-bottom:none}
.hp-proof .stat-num{
  background:none !important;-webkit-text-fill-color:#2A2150 !important;color:#2A2150 !important;
}
.hp-proof .stat-num span{-webkit-text-fill-color:#6C5CE7 !important;color:#6C5CE7 !important}
.hp-proof .stat-label{color:#544C72}

/* Method — dark */
.hp-method{padding:100px 64px;background:#181030;color:#EDE8FB}
.hp-method .section-label{color:#A78BFA}
.hp-method .section-title{color:#EDE8FB !important;opacity:1 !important}
.hp-method .section-body{color:#B4ABCE !important}
.hp-steps{
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:48px;
}
.hp-step{
  padding:28px 24px;border-radius:18px;
  border:1px solid rgba(167,139,250,.18);background:rgba(167,139,250,.05);
  transition:border-color .25s,background .25s;
}
.hp-step:hover{border-color:rgba(167,139,250,.45);background:rgba(167,139,250,.1)}
.hp-step .n{
  font-family:'Syne',sans-serif;font-size:13px;font-weight:700;
  letter-spacing:2px;color:#A78BFA;margin-bottom:16px;
}
.hp-step h3{
  font-family:'Syne',sans-serif;font-size:18px;font-weight:700;margin:0 0 10px;color:#EDE8FB;
}
.hp-step p{margin:0;font-size:14px;color:#B4ABCE;line-height:1.7}

/* Ask */
.hp-ask{
  margin:0 64px;padding:40px 44px;border-radius:22px;
  border:1px solid rgba(167,139,250,.28);
  background:linear-gradient(120deg,rgba(167,139,250,.18),rgba(24,16,48,.95));
  display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;
  color:#EDE8FB;
}
.hp-ask h2{
  font-family:'Syne',sans-serif;font-size:clamp(22px,2.4vw,30px);
  font-weight:800;letter-spacing:-.02em;margin:0 0 8px;color:#EDE8FB;
}
.hp-ask p{margin:0;font-size:14.5px;color:#B4ABCE;max-width:48ch;line-height:1.65}

/* AEO / GEO answer-first band */
.hp-aeo{
  padding:90px 64px;background:#181030;color:#EDE8FB;
  border-top:1px solid rgba(167,139,250,.16);
}
.hp-aeo .section-label{color:#A78BFA}
.hp-aeo .section-title{color:#EDE8FB !important;opacity:1 !important}
.hp-aeo .section-body{color:#B4ABCE !important;max-width:62ch}
.hp-aeo .section-body strong{color:#EDE8FB}
.hp-aeo-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:40px;
}
.hp-aeo-card{
  padding:28px 26px;border-radius:18px;
  border:1px solid rgba(167,139,250,.22);
  background:rgba(167,139,250,.06);
}
.hp-aeo-kicker{
  font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;
  color:#A78BFA;margin:0 0 10px;
}
.hp-aeo-card h3{
  font-family:'Syne',sans-serif;font-size:22px;font-weight:700;
  margin:0 0 12px;color:#EDE8FB;letter-spacing:-.02em;
}
.hp-aeo-card p{margin:0 0 16px;font-size:14.5px;color:#B4ABCE;line-height:1.7}
.hp-aeo-card a{
  font-size:14px;font-weight:600;color:#A78BFA;text-decoration:none;
}
.hp-aeo-card a:hover{color:#EDE8FB}

/* FAQ stays on dark body background via .section */

@media (max-width:1100px){
  .hp-hero{
    grid-template-columns:1fr;
    min-height:auto; /* don't force full viewport when stacked */
  }
  .hp-hero-visual{
    min-height:36vh;max-height:420px;order:-1;
  }
  .hp-hero-visual::after{
    background:linear-gradient(180deg,transparent 40%,#181030 100%);
  }
  .hp-hero-copy{padding:48px 28px 56px}
  .hp-hero-copy h1{max-width:none}
  .hp-hero-copy .lead{max-width:54ch}
  .hp-intro,.hp-light,.hp-services,.hp-cats,.hp-proof,.hp-method,.hp-aeo{
    padding-left:28px;padding-right:28px;
  }
  .hp-ask{margin-left:28px;margin-right:28px;padding:28px}
  .hp-pivot-grid,.hp-proof-grid,.hp-aeo-grid{grid-template-columns:1fr;gap:36px}
  .hp-mosaic{grid-template-columns:1fr 1fr}
  .hp-mosaic .wide{grid-column:span 2}
  .hp-cat-row{grid-template-columns:repeat(3,1fr)}
  .hp-steps{grid-template-columns:1fr 1fr}
}
@media (max-width:768px){
  .hp-light,.hp-services,.hp-proof,.hp-method,.hp-aeo{padding-top:72px;padding-bottom:72px}
  .hp-cats{padding-top:56px;padding-bottom:56px}
  .hp-mosaic a{min-height:0;padding:22px 18px}
}
@media (max-width:640px){
  .hp-hero{min-height:auto}
  .hp-hero-visual{
    min-height:200px;height:34vh;max-height:260px;
  }
  .hp-hero-copy{padding:28px 18px 44px}
  .hp-hero-copy h1{
    max-width:none;
    font-size:clamp(28px,7.2vw,36px);
    margin-bottom:14px;
  }
  .hp-hero-copy .lead{
    max-width:none;
    font-size:15px;
    line-height:1.65;
    margin-bottom:24px;
  }
  .hp-eyebrow{margin-bottom:16px;font-size:11px;letter-spacing:1.6px}
  .hp-actions{
    flex-direction:column;align-items:stretch;gap:12px;margin-bottom:28px;
  }
  .hp-actions .btn-primary,
  .hp-actions .btn-ghost,
  .hp-actions a{
    width:100%;justify-content:center;text-align:center;box-sizing:border-box;
  }
  .hp-mini-stats{grid-template-columns:1fr;gap:14px;padding-top:22px}
  .hp-mini-stats strong{font-size:22px}
  .hp-mosaic,.hp-steps,.hp-cat-row{grid-template-columns:1fr}
  .hp-mosaic .wide{grid-column:span 1}
  .hp-hero-chip{
    left:12px;right:12px;max-width:none;bottom:12px;
    padding:12px 14px;border-radius:12px;
  }
  .hp-hero-chip .val{font-size:22px}
  .hp-intro,
  .hp-light,
  .hp-services,
  .hp-cats,
  .hp-proof,
  .hp-method,
  .hp-aeo{
    padding-left:18px;padding-right:18px;
  }
  .hp-intro{padding-top:22px;padding-bottom:22px}
  .hp-light,.hp-services,.hp-proof,.hp-method{padding-top:64px;padding-bottom:64px}
  .hp-aeo{padding-top:64px;padding-bottom:64px}
  .hp-cats{padding-top:48px;padding-bottom:48px}
  .hp-ask{
    margin-left:16px;margin-right:16px;
    padding:24px 18px;
    border-radius:18px;
  }
  .hp-ask h2{font-size:clamp(20px,5.5vw,26px)}
  .hp-pivot-item{
    grid-template-columns:40px 1fr;gap:12px;padding:20px 0;
  }
  .hp-pivot-item h3{font-size:16px}
  .hp-aeo-card{padding:22px 18px}
  .hp-aeo-card h3{font-size:18px}
  .hp-step{padding:22px 18px}
  .hp-cat{padding:18px 10px;font-size:13px}
}
@media (max-width:480px){
  /* Match theme: hide floating growth chip so image stays clean on phones */
  .hp-hero-chip{display:none}
  .hp-hero-visual{height:30vh;min-height:180px;max-height:220px}
  .hp-hero-copy{padding:24px 16px 40px}
  .hp-intro,.hp-light,.hp-services,.hp-cats,.hp-proof,.hp-method,.hp-aeo{
    padding-left:16px;padding-right:16px;
  }
  .hp-ask{margin-left:12px;margin-right:12px;padding:20px 16px}
}
@media (prefers-reduced-motion:reduce){
  .hp-mosaic a,.hp-step,.hp-cat{transition:none}
}
