/* landing-premium uses unified tokens from tokens.css */
:root{
  --hr-bg:var(--bg);
  --hr-surface:var(--surface);
  --hr-surface-soft:var(--surface-soft);
  --hr-line:var(--border);
  --hr-ink:var(--text);
  --hr-muted:var(--muted);
  --hr-primary:var(--primary);
  --hr-primary-strong:var(--primaryDark);
  --hr-accent:var(--accent);
  --hr-accent-2:var(--accent2);
  --hr-shadow:var(--shadow-lg);
  --hr-shadow-soft:var(--shadow-md);
}

body{min-height:100vh;color:var(--hr-ink);background:var(--hr-bg);}
.container.narrow.hrPage{max-width:1320px;padding:18px 22px 72px;}

.hrTopbar{
  position:sticky; top:14px; z-index:30;
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:18px; align-items:center;
  padding:18px 22px; border-radius:20px; background:rgba(255,255,255,.9);
  border:1px solid rgba(255,255,255,.8); box-shadow:0 16px 40px rgba(21,35,70,.08); backdrop-filter:blur(16px);
}
.hrBrand{display:flex;align-items:center;gap:0;color:inherit;text-decoration:none;min-width:0;}
.hrBrandLogo{width:124px;height:124px;object-fit:contain;flex:0 0 auto;}
.hrBrandText{display:grid;gap:3px;min-width:0;}
.hrBrandText strong{font-size:1.2rem;letter-spacing:-.02em;}
.hrBrandText span{font-size:.95rem;color:var(--hr-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.hrNav{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:18px 20px;}
.hrNav a{color:var(--hr-muted);text-decoration:none;font-weight:800;white-space:nowrap;}
.hrNav a:hover{color:var(--hr-ink);}

.hrBtn,.hrBtnSecondary{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 22px;border-radius:14px;font-weight:800;text-decoration:none;transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;}
.hrBtn{border:none;background:linear-gradient(135deg,var(--hr-primary),var(--hr-primary-strong));color:#fff!important;box-shadow:0 16px 34px rgba(52,103,235,.28);}
.hrBtnSecondary{background:#fff;color:var(--hr-ink);border:1px solid var(--hr-line);box-shadow:var(--hr-shadow-soft);}
.hrBtn:hover,.hrBtnSecondary:hover{transform:translateY(-1px);}
.hrBtnNav{min-height:48px;padding:0 18px;}

.hrHero{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,332px);
  gap:36px;
  align-items:center;
  margin-top:26px;
  padding:52px 40px 132px;
  border-radius:28px;
  background:url('/assets/img/home/hero-woman-front.webp') 74% center / cover no-repeat,#fff;
  box-shadow:var(--hr-shadow);
  overflow:hidden;
}
.hrHeroCopy{display:grid;gap:18px;align-content:start;min-width:0;max-width:560px;position:relative;z-index:1;}
.hrHeroAside{
  position:relative;
  z-index:1;
  justify-self:end;
  width:100%;
  max-width:332px;
  display:grid;
  gap:18px;
  padding:22px 22px 20px;
  border-radius:22px;
  border:1px solid rgba(212,223,243,.95);
  background:rgba(255,255,255,.88);
  box-shadow:0 18px 36px rgba(21,35,70,.08);
  backdrop-filter:blur(8px);
}
.hrEyebrow,.hrBandPill{display:inline-flex;align-items:center;padding:9px 14px;border-radius:999px;font-size:.82rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;}
.hrEyebrow{justify-self:start;background:#edf2ff;color:#3151a3;}
.hrHero h1,.hrSectionHead h2,.hrProductCopy h3,.hrFooterCta h2,.hrCalmCopy h2{letter-spacing:-.04em;line-height:1.05;}
.hrHero h1{font-size:clamp(2.4rem,4.6vw,4.6rem);margin:0;max-width:8.5ch;}
.hrHeroLead{max-width:34ch;margin:0;color:var(--hr-muted);font-size:1.12rem;line-height:1.72;}
.hrCTA{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin:0;}
.hrCTAAside{justify-content:flex-start;}
.hrHeroAside .hrBtn{width:100%;}
.hrCTAEnd{justify-content:flex-end;}
.hrBullets{display:grid;gap:12px;margin:0;padding:0;list-style:none;max-width:none;}
.hrBullets li{position:relative;margin:0;padding-left:16px;color:var(--hr-ink);font-size:.96rem;font-weight:800;white-space:normal;}
.hrBullets li::before{content:"";position:absolute;left:0;top:.58em;width:6px;height:6px;border-radius:999px;background:#5579e6;}
.hrHeroMedia{display:none;}
.hrHeroMedia img{display:none;}

.hrSection{padding:52px 0;scroll-margin-top:110px;}
.hrTrustStrip{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
  align-items:stretch;
  margin-top:-84px;
  padding:0 22px;
}
.hrTrustCard{position:relative;display:flex;gap:16px;align-items:flex-start;padding:26px 22px 22px;border:1px solid rgba(213,223,243,.9);border-radius:var(--radius-md);background:#fff;box-shadow:var(--shadow-lg);transition:transform .2s ease, box-shadow .2s ease;}
.hrTrustCardSafe{background:linear-gradient(180deg,#ffffff 0%,#f6fbff 100%);}
.hrTrustCardPrivacy{background:linear-gradient(180deg,#ffffff 0%,#f5f7ff 100%);}
.hrTrustCardClaim{background:linear-gradient(180deg,#ffffff 0%,#f5fbff 100%);}
.hrTrustTop{position:absolute;left:-1px;right:-1px;top:-1px;height:4px;border-radius:var(--radius-md) var(--radius-md) 0 0;background:linear-gradient(90deg,var(--hr-accent),#8ac7ff);}
.hrTrustCardPrivacy .hrTrustTop{background:linear-gradient(90deg,#8ba2ff,#bfd1ff);}
.hrTrustCardClaim .hrTrustTop{background:linear-gradient(90deg,#3f6df3,#5dc8ff);}
.hrTrustCard img,.hrTrustMark{width:48px;height:48px;object-fit:contain;flex:0 0 auto;margin-top:2px;}
.hrTrustMark{display:grid;place-items:center;}
.hrTrustMark svg{display:block;width:48px;height:48px;filter:drop-shadow(0 8px 18px rgba(48,87,183,.10));}
.hrTrustCard h2{font-size:1.08rem;margin:0 0 6px;}
.hrTrustCard p{margin:0;color:var(--hr-muted);line-height:1.58;}

.hrSectionHead{display:grid;gap:10px;margin-bottom:22px;}
.hrSectionHead h2,.hrCalmCopy h2,.hrFooterCta h2{font-size:clamp(2rem,3.3vw,3.35rem);margin:0;max-width:12ch;}
.hrSectionHead p,.hrCalmCopy p,.hrFooterCta p,.hrProductCopy p{max-width:58ch;margin:0;color:var(--hr-muted);line-height:1.75;}

.hrHowGrid{padding:28px;border:1px solid var(--hr-line);border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.96)), url('/assets/img/home/flow-line.webp') center/cover no-repeat;box-shadow:var(--hr-shadow-soft);}
.hrSteps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;}
.hrStepCard{padding:24px;border:1px solid var(--hr-line);border-radius:16px;background:#fff;box-shadow:var(--hr-shadow-soft);min-height:100%;}
.hrStepCard .step{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:#5771b8;font-weight:800;}
.hrStepCard h3{font-size:1.22rem;line-height:1.1;margin:12px 0 8px;letter-spacing:-.03em;}
.hrStepCard p{margin:0;color:var(--hr-muted);line-height:1.65;}

.hrProductBand{display:grid;grid-template-columns:minmax(0,.95fr) minmax(420px,1.05fr);gap:34px;padding:36px;border-radius:24px;background:linear-gradient(145deg,#14204a 0%,#1b2d63 48%,#284eaa 100%);color:#fff;box-shadow:0 26px 70px rgba(20,31,67,.24);}
.hrBandPills{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px;}
.hrBandPill{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.14);color:#eef4ff;}
.hrProductCopy{display:flex;flex-direction:column;justify-content:center;}
.hrProductCopy h3{font-size:clamp(2.2rem,3.6vw,4rem);margin:0 0 14px;max-width:9.5ch;}
.hrProductCopy p{color:#d7e3ff;}
.hrProductChecklist{list-style:none;padding:0;margin:0 0 24px;display:grid;gap:10px;}
.hrProductChecklist li{display:flex;align-items:flex-start;gap:10px;color:#e7efff;line-height:1.6;}
.hrProductChecklist li::before{content:"";width:10px;height:10px;margin-top:8px;border-radius:999px;flex:0 0 auto;background:linear-gradient(135deg,#95bbff,#ffffff);box-shadow:0 0 0 4px rgba(149,187,255,.12);}
.hrProductBand .hrBtnSecondary{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:#fff;}
.hrProductStage{display:grid;align-content:center;justify-items:center;gap:16px;padding:24px;border-radius:22px;background:rgba(10,18,42,.18);border:1px solid rgba(255,255,255,.08);min-height:420px;}
.hrProductScreen{width:min(100%,520px);padding:18px;border-radius:24px;background:rgba(8,13,30,.24);box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 22px 50px rgba(8,13,30,.28);}
.hrProductScreen img{display:block;width:100%;aspect-ratio:1.7;object-fit:cover;border-radius:18px;}
.hrProductStage p{margin:0;color:#d9e5ff;font-weight:700;}

.hrGrid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch;}
.hrCard{position:relative;overflow:hidden;border:1px solid var(--hr-line);border-radius:18px;background:#fff;box-shadow:var(--hr-shadow-soft);height:100%;}
.hrCardImage{min-height:330px;}
.hrCardBg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.62;}
.hrCardBody{position:relative;z-index:1;display:flex;flex-direction:column;height:100%;padding:28px;background:linear-gradient(180deg,rgba(255,255,255,.3),rgba(255,255,255,.92) 48%, rgba(255,255,255,.98) 100%);}
.hrCardIcon{width:48px;height:48px;border-radius:12px;margin-bottom:18px;background:linear-gradient(135deg,#dce7ff,#eef2ff);display:grid;place-items:center;font-weight:800;color:#274dc1;box-shadow:inset 0 1px 0 rgba(255,255,255,.7);}
.hrCard h3{font-size:1.35rem;line-height:1.12;letter-spacing:-.03em;margin:0 0 10px;}
.hrCard p{color:var(--hr-muted);line-height:1.7;margin:0 0 14px;}
.hrCard a,.hrInlineLinks a,.hrFooterLinks a{color:var(--hr-primary);font-weight:800;text-decoration:none;}

.hrSafetyBand{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;align-items:stretch;}
.hrSafetyColumn{padding:30px;border-radius:20px;border:1px solid var(--hr-line);background:#fff;box-shadow:var(--hr-shadow-soft);}
.hrSafetyColumn h3{font-size:1.5rem;margin:0 0 16px;letter-spacing:-.03em;}
.hrSafetyList{display:grid;gap:12px;}
.hrSafetyList div{padding:16px 18px;border-radius:12px;border:1px solid var(--hr-line);background:#fff;}
.hrSafetyList b{display:block;margin-bottom:5px;}
.hrSafetyList span{color:var(--hr-muted);line-height:1.55;font-size:.95rem;}
.hrInlineLinks{display:flex;flex-wrap:wrap;gap:16px;margin-top:18px;}

.hrCalmBlock{
  display:flex;
  align-items:center;
  min-height:460px;
  padding:56px;
  border-radius:24px;
  background:
    linear-gradient(90deg,
      rgba(255,255,255,.97) 0%,
      rgba(255,255,255,.95) 34%,
      rgba(255,255,255,.84) 48%,
      rgba(255,255,255,.18) 68%,
      rgba(255,255,255,.02) 100%
    ),
    url('/assets/img/home/woman-eyes-closed.webp') right center / cover no-repeat,
    #fff;
  box-shadow:var(--hr-shadow);
  overflow:hidden;
}
.hrCalmMedia{display:none;}
.hrCalmMedia img{display:none;}
.hrCalmCopy{display:grid;gap:18px;max-width:540px;position:relative;z-index:1;}

.hrFooterCta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px;align-items:center;padding:34px 38px;border-radius:22px;background:linear-gradient(135deg,#ffffff 0%,#f4f8ff 100%);border:1px solid var(--hr-line);box-shadow:var(--hr-shadow);position:relative;overflow:hidden;}
.hrFooterCta::before{content:"";position:absolute;left:0;top:0;bottom:0;width:8px;background:linear-gradient(180deg,var(--hr-accent),var(--hr-primary));}
.hrFooterLinks{display:flex;flex-wrap:wrap;gap:16px;margin-top:4px;}
.hrFooterLinks a{color:#40506e;}
.hrFooterCta .hrCTA{justify-content:flex-end;}

.footer{padding:28px 0 8px;color:var(--hr-muted);text-align:center;}
.footer a{color:inherit;text-decoration:none;}
.hrFooter{text-align:left;padding:48px 0 24px;border-top:1px solid var(--hr-line);}
.hrFooterGrid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:32px;}
.hrFooterCol{display:flex;flex-direction:column;gap:8px;}
.hrFooterCol b{font-size:var(--fsSmall);color:var(--hr-ink);margin-bottom:4px;}
.hrFooterCol a{color:var(--hr-muted);font-size:var(--fsSmall);text-decoration:none;transition:color .12s ease;}
.hrFooterCol a:hover{color:var(--hr-ink);text-decoration:underline;}
.hrFooterBottom{margin-top:32px;padding-top:16px;border-top:1px solid var(--hr-line);font-size:12px;color:var(--hr-muted);text-align:center;}
@media (max-width:700px){.hrFooterGrid{grid-template-columns:1fr 1fr;gap:24px 16px;}}

.hrNav a,.hrBtnNav{white-space:nowrap;}
.hrCTA .hrBtn,.hrCTA .hrBtnSecondary{min-width:220px;}
.hrSectionHead > p{margin-top:8px;color:var(--hr-muted,#6B7280);}

@media (max-width: 1180px){
  .hrHero{grid-template-columns:minmax(0,1fr) minmax(260px,310px);gap:24px;padding:36px 30px 118px;background-position:72% center; background-size:cover;}
  .hrHero h1{max-width:9ch;}
  .hrTrustStrip,.hrSteps,.hrGrid3,.hrSafetyBand,.hrProductBand,.hrFooterCta{grid-template-columns:1fr;}
  .hrTrustStrip{margin-top:-72px;padding:0 12px;}
  .hrCalmBlock{min-height:420px;padding:36px;background-position:72% center;}
  .hrProductStage{min-height:360px;}
}

@media (max-width: 980px){
  .hrTopbar{position:static;grid-template-columns:1fr;gap:14px;}
  .hrNav{justify-content:flex-start;gap:12px 16px;}
  .hrNav a,.hrBtnNav{font-size:.95rem;}
  .hrHero{
    grid-template-columns:1fr;
    gap:22px;
    align-items:start;
    min-height:0;
    padding:30px 24px 22px;
    background:
      linear-gradient(180deg,
        rgba(255,255,255,.96) 0%,
        rgba(255,255,255,.92) 38%,
        rgba(255,255,255,.55) 62%,
        rgba(255,255,255,.18) 100%
      ),
      url('/assets/img/home/hero-woman-front.webp') center bottom / cover no-repeat,
      #fff;
  }
  .hrHeroCopy{max-width:30rem;}
  .hrHeroAside{justify-self:stretch;max-width:none;padding:18px;}
  .hrTrustStrip{margin-top:16px;padding:0;}
  .hrCalmBlock{
    min-height:auto;
    padding:28px 24px;
    background:
      linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,255,255,.94)),
      #fff;
  }
}

@media (max-width: 700px){
  .container.narrow.hrPage{padding:12px 14px 48px;}
  .hrTopbar{padding:14px 16px;border-radius:18px;}
  .hrBrandLogo{width:96px;height:96px;}
  .hrBrandText span{white-space:normal;}
  .hrNav{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:stretch;
    justify-content:stretch;
    gap:10px;
  }
  .hrNav a{
    min-height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
  }
  .hrNav .hrBtnNav{grid-column:1 / -1;width:100%;}
  .hrHero{
    gap:18px;
    padding:22px 18px 18px;
    border-radius:22px;
    background:
      linear-gradient(180deg,
        rgba(255,255,255,.97) 0%,
        rgba(255,255,255,.94) 34%,
        rgba(255,255,255,.62) 58%,
        rgba(255,255,255,.24) 100%
      ),
      url('/assets/img/home/hero-woman-front.webp') center bottom / cover no-repeat,
      #fff;
  }
  .hrHero h1{font-size:clamp(2.35rem,13vw,3.65rem);max-width:7.6ch;}
  .hrHeroLead{font-size:1rem;max-width:28ch;}
  .hrHeroAside{max-width:none;padding:16px;border-radius:18px;}
  .hrCTA,.hrCTAEnd,.hrCTAAside{display:grid;grid-template-columns:1fr;justify-content:stretch;}
  .hrBullets{gap:8px 16px;}
  .hrBullets li{white-space:normal;}
  .hrTrustStrip{margin-top:14px;padding:0;grid-template-columns:1fr;}
  .hrTrustCard,.hrHowGrid,.hrStepCard,.hrSafetyColumn,.hrProductBand,.hrFooterCta{padding:20px;}
  .hrProductScreen{padding:12px;}
  .hrProductStage{min-height:auto;padding:18px;}
  .hrProductCopy h3{font-size:clamp(2rem,10vw,2.8rem);}
  .hrCalmBlock{padding:20px;border-radius:20px;min-height:auto;}
  .hrFooterCta{padding:24px 20px 24px 26px;}
}
