.home-page .site-header { background: var(--paper); backdrop-filter: none; }
.section-shell { width: min(1240px, calc(100% - 64px)); margin-inline: auto; }

.hero {
  position: relative;
  min-height: 800px;
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(510px, 1.1fr);
  align-items: center;
  gap: clamp(30px, 5vw, 84px);
  padding-block: 78px 92px;
}
.hero > * { min-width: 0; }
.hero::before {
  position: absolute;
  z-index: -1;
  width: 560px;
  height: 560px;
  top: 90px;
  right: -250px;
  border: 1px solid rgba(92, 86, 206, .14);
  border-radius: 50%;
  box-shadow: inset 0 0 0 90px rgba(92, 86, 206, .03), inset 0 0 0 180px rgba(45, 143, 120, .025);
  content: "";
}
.eyebrow { margin: 0 0 20px; color: var(--violet); font-size: 11px; font-weight: 900; letter-spacing: .18em; }
h1, h2 { margin: 0; font-family: var(--display); font-weight: 700; letter-spacing: -.055em; }
h1 { max-width: 700px; font-size: clamp(59px, 6.7vw, 96px); line-height: .88; }
h1 em { display: block; margin-top: 13px; color: var(--teal); font-style: italic; font-weight: 500; }
.hero-lead { max-width: 610px; margin: 34px 0 0; color: #5f5c64; font-size: clamp(17px, 1.65vw, 22px); line-height: 1.62; }
.hero-actions { display: grid; justify-items: start; gap: 24px; margin-top: 36px; }
.button { display: inline-flex; min-height: 54px; align-items: center; justify-content: center; gap: 24px; padding: 0 22px; border-radius: 18px 28px 18px 28px; font-size: 14px; font-weight: 850; text-decoration: none; }
.button-primary { color: #fffdf8; background: linear-gradient(110deg, #4f4bbd, #6a63dd); box-shadow: 0 18px 38px rgba(75, 69, 177, .25); }
.button-primary span { font-size: 18px; }
.platform-actions { display: flex; flex-wrap: wrap; align-items: start; gap: 20px; }
.platform-choice { min-width: 205px; display: grid; justify-items: stretch; gap: 8px; }
.platform-label { color: #68646b; font-size: 9px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.platform-choice small { color: var(--muted); font-size: 10px; line-height: 1.35; }
.button-disabled { border: 1px solid rgba(36,36,45,.15); color: #87838a; background: rgba(255,255,255,.38); box-shadow: none; cursor: not-allowed; }
.button-disabled span { color: var(--coral); letter-spacing: .08em; }
.text-link { display: inline-flex; width: fit-content; align-items: center; gap: 18px; padding-block: 8px; border-bottom: 1px solid currentColor; color: var(--ink); font-size: 13px; font-weight: 850; text-decoration: none; }
.availability { margin: 18px 0 0; color: var(--muted); font-size: 12px; }
.trust-line { display: flex; flex-wrap: wrap; gap: 9px 24px; margin: 35px 0 0; padding: 22px 0 0; border-top: 1px solid var(--line); color: #59565d; font-size: 11px; font-weight: 750; list-style: none; }
.trust-line li { display: flex; align-items: center; gap: 8px; }
.trust-line li::before { width: 7px; height: 7px; border-radius: 50%; background: var(--teal); content: ""; }

.hero-visual { position: relative; isolation: isolate; min-height: 650px; }
.hero-rings {
  position: absolute;
  z-index: -1;
  width: 570px;
  height: 570px;
  top: 32px;
  right: -20px;
  border-radius: 49% 51% 44% 56%;
  background: linear-gradient(145deg, #dbe9ed 0%, #dcefe8 54%, #efe4d4 100%);
  transform: rotate(-7deg);
}
.hero-rings::before { position: absolute; inset: 44px; border: 1px solid rgba(255,255,255,.84); border-radius: 50%; content: ""; }
.phone { min-width: 0; position: absolute; margin: 0; }
.phone img, .screen-stage img, .screen-pair img {
  width: 100%;
  height: auto;
  aspect-ratio: 9 / 16;
  border: 8px solid #26272d;
  border-radius: 36px;
  background: #f8f4ee;
  box-shadow: 0 24px 48px rgba(43, 45, 56, .18), 0 2px 0 rgba(255,255,255,.8) inset;
}
.phone figcaption, .screen-stage figcaption, .screen-pair figcaption { color: var(--muted); font-size: 11px; font-weight: 750; letter-spacing: .02em; }
.phone-home { z-index: 2; width: 315px; top: 2px; left: 50px; transform: rotate(-4.5deg); }
.phone-calendar { z-index: 1; width: 278px; right: 0; bottom: 0; transform: rotate(6deg); }
.phone figcaption { position: absolute; padding: 11px 15px; color: var(--ink); background: rgba(255,253,248,.94); box-shadow: 0 10px 30px rgba(44,45,54,.12); }
.phone-home figcaption { left: -22px; bottom: 64px; }
.phone-calendar figcaption { right: 0; top: 85px; }

.feature-rail { padding: 26px 0; border-block: 1px solid var(--line); background: rgba(255,255,255,.26); }
.feature-rail ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px 30px; margin-block: 0; padding: 0; list-style: none; }
.feature-rail li { display: inline-flex; align-items: center; gap: 12px; min-width: 0; color: #4c4951; font: 700 14px/1.5 var(--display); }
.feature-rail li::before { flex: 0 0 5px; height: 5px; border-radius: 50%; background: var(--coral); content: ""; }

.feature-section { min-height: 820px; display: grid; grid-template-columns: minmax(0, .82fr) minmax(480px, 1.18fr); align-items: center; gap: clamp(50px, 8vw, 130px); padding-block: 120px; border-bottom: 1px solid var(--line); }
.feature-section > *, .privacy-layout > *, .screen-pair > * { min-width: 0; }
.feature-copy h2 { font-size: clamp(46px, 5.3vw, 74px); line-height: .97; }
.privacy-section h2, .closing-section h2 { font-size: clamp(46px, 6vw, 80px); line-height: .97; }
.feature-copy > p:not(.eyebrow), .privacy-copy > p, .closing-section > p:not(.eyebrow) { max-width: 620px; margin: 28px 0 0; color: #656168; font-size: clamp(16px, 1.5vw, 20px); line-height: 1.7; }
.feature-points { display: grid; gap: 14px; margin: 33px 0 0; padding: 25px 0 0; border-top: 1px solid var(--line); list-style: none; }
.feature-points li { display: flex; align-items: center; gap: 13px; color: #4e4b52; font-size: 13px; font-weight: 720; }
.feature-points li span { width: 19px; height: 1px; background: var(--teal); }

.screen-stage { position: relative; min-height: 680px; margin: 0; }
.screen-stage img { position: absolute; z-index: 2; width: 310px; }
.screen-stage figcaption { position: absolute; z-index: 3; width: 310px; max-width: calc(100% - 24px); padding: 15px 0 0; border-top: 1px solid var(--line); line-height: 1.5; }
.screen-stage-calendar { background: linear-gradient(135deg, transparent 12%, #dcece7 12% 76%, transparent 76%); }
.screen-stage-calendar img { right: 12%; top: 0; transform: rotate(2deg); }
.screen-stage-calendar figcaption { right: 12%; bottom: 12px; }
.stage-number { position: absolute; left: 25px; bottom: 10px; color: rgba(45,143,120,.2); font: 700 190px/.8 var(--display); }

.feature-lists { grid-template-columns: minmax(350px, .7fr) minmax(560px, 1.3fr); }
.screen-pair { position: relative; min-height: 650px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: start; gap: clamp(22px,4vw,50px); }
.screen-pair figure { position: relative; width: min(100%,300px); margin: 0; }
.screen-pair figure:first-child { justify-self: start; }
.screen-pair figure:last-child { justify-self: end; margin-top: 74px; }
.screen-pair figcaption { position: static; max-width: none; margin-top: 14px; padding: 12px 0 0; border-top: 1px solid var(--line); color: var(--ink); background: transparent; box-shadow: none; }

.feature-finance { grid-template-columns: minmax(480px, 1.1fr) minmax(0, .9fr); }
.screen-stage-finance { background: linear-gradient(45deg, transparent 17%, #eee2cf 17% 76%, transparent 76%); }
.screen-stage-finance img { left: 17%; top: 0; transform: rotate(-2deg); }
.screen-stage-finance figcaption { left: 17%; bottom: 12px; }
.receipt-lines { position: absolute; z-index: 1; width: 210px; height: 290px; right: 7%; top: 80px; background: repeating-linear-gradient(to bottom, rgba(91,81,69,.24) 0 1px, transparent 1px 17px); transform: rotate(6deg); }
.receipt-lines::after { position: absolute; inset: -18px; border: 1px solid rgba(92,82,70,.18); content: ""; }

.privacy-section { position: relative; overflow: hidden; color: #f8f4eb; background: #202b3f; }
.privacy-section::before { position: absolute; width: 760px; height: 760px; right: -300px; top: -370px; border: 1px solid rgba(183,219,209,.17); border-radius: 50%; box-shadow: inset 0 0 0 100px rgba(183,219,209,.025), inset 0 0 0 205px rgba(183,219,209,.02); content: ""; }
.privacy-layout { position: relative; min-height: 610px; display: grid; grid-template-columns: 1fr .78fr; align-items: center; gap: 90px; padding-block: 110px; }
.privacy-section .eyebrow { color: #91d5c2; }
.privacy-copy > p { color: #c4cad0; }
.privacy-copy ul { display: flex; flex-wrap: wrap; gap: 10px 28px; margin: 30px 0; padding: 24px 0 0; border-top: 1px solid rgba(255,255,255,.14); color: #e9e9e4; font-size: 12px; list-style: none; }
.privacy-copy li { display: flex; align-items: center; gap: 9px; }
.privacy-copy li::before { width: 7px; height: 7px; border-radius: 50%; background: #91d5c2; content: ""; }
.text-link.light { color: #fff; }

.closing-section { padding-block: 125px; text-align: center; }
.closing-section .eyebrow { margin-bottom: 24px; }
.closing-section h2 { max-width: 900px; margin-inline: auto; }
.closing-section > p:not(.eyebrow) { margin-inline: auto; }
.closing-action { margin-top: 38px; }
.closing-action .platform-actions { justify-content: center; }
.closing-action .platform-choice { text-align: left; }

@media (max-width: 1050px) {
  .hero { grid-template-columns: .8fr 1.2fr; }
  .phone-home { width: 275px; }
  .phone-calendar { width: 240px; }
  .feature-section { grid-template-columns: minmax(0, 1fr) minmax(420px, 1fr); gap: 50px; }
  .feature-lists { grid-template-columns: .7fr 1.3fr; }
  .screen-pair figure { width: min(100%,260px); }
}

@media (max-width: 820px) {
  .section-shell { width: min(100% - 36px, 680px); }
  .hero { min-height: auto; grid-template-columns: 1fr; padding-block: 62px 70px; }
  .hero-copy { text-align: center; }
  .hero-lead { margin-inline: auto; }
  .hero-actions { justify-items: center; }
  .platform-actions, .trust-line { justify-content: center; }
  .hero-visual { width: min(100%, 590px); min-height: 620px; margin-inline: auto; }
  .hero-rings { right: 50%; transform: translateX(50%) rotate(-7deg); }
  .feature-section, .feature-lists, .feature-finance { min-height: auto; grid-template-columns: 1fr; padding-block: 92px; }
  .feature-finance .screen-stage { order: 2; }
  .feature-copy { max-width: 620px; }
  .screen-stage, .screen-pair { width: min(100%, 600px); margin-inline: auto; }
  .privacy-layout { min-height: 640px; grid-template-columns: 1fr; align-content: center; gap: 36px; }
}

@media (max-width: 560px) {
  .section-shell { width: min(100% - 24px, 520px); }
  .hero { padding-top: 50px; }
  .hero::before { display: none; }
  h1 { font-size: clamp(40px, 13vw, 56px); }
  .hero-lead { font-size: 16px; }
  .hero-actions { width: 100%; gap: 20px; }
  .platform-actions { width: 100%; display: grid; grid-template-columns: 1fr; }
  .platform-choice { width: 100%; }
  .button { width: 100%; }
  .trust-line { display: grid; justify-content: start; margin-inline: auto; width: fit-content; text-align: left; }
  .hero-visual { min-height: 0; display: grid; grid-template-columns: 1fr .88fr; align-items: start; gap: 10px; margin-top: 24px; padding: 28px 6px 54px; overflow: clip; }
  .hero-rings { width: 420px; height: 420px; top: 72px; }
  .phone { position: relative; }
  .phone-home { width: auto; top: auto; left: auto; transform: rotate(-3deg); }
  .phone-calendar { width: auto; right: auto; bottom: auto; margin-top: 58px; transform: rotate(4deg); }
  .phone-home figcaption { left: 0; }
  .phone-calendar figcaption { right: 0; }
  .phone img, .screen-stage img, .screen-pair img { border-width: 6px; border-radius: 28px; }
  .phone figcaption { font-size: 9px; }
  .feature-rail ul { justify-content: flex-start; gap: 14px 20px; padding-inline: 8px; }
  .feature-rail li { font-size: 13px; white-space: nowrap; }
  .feature-section { gap: 42px; padding-block: 75px; }
  .feature-copy h2, .privacy-section h2, .closing-section h2 { font-size: clamp(36px, 11vw, 52px); }
  .feature-copy > p:not(.eyebrow), .privacy-copy > p, .closing-section > p:not(.eyebrow) { font-size: 16px; }
  .screen-stage { min-height: 545px; }
  .screen-stage img { width: 240px; }
  .screen-stage-calendar img { right: 9%; }
  .stage-number { left: 0; font-size: 140px; }
  .screen-stage figcaption { max-width: 180px; font-size: 10px; }
  .screen-pair { min-height: 530px; }
  .screen-pair figure { width: min(100%,215px); }
  .screen-pair figcaption { font-size: 9px; }
  .receipt-lines { width: 145px; right: 2%; }
  .privacy-layout { min-height: 700px; padding-block: 84px; }
  .privacy-copy ul { display: grid; }
  .closing-section { padding-block: 90px; }
}

@media (max-width: 420px) {
  .screen-pair { width: min(82%,300px); min-height: auto; grid-template-columns: 1fr; gap: 42px; }
  .screen-pair figure { width: 100%; justify-self: stretch; }
  .screen-pair figure:last-child { margin-top: 0; }
}

@media (prefers-reduced-motion: no-preference) {
  .hero-copy { animation: hero-arrive .4s ease-out; }
  .button-primary { transition: opacity .18s ease; }
  .text-link { transition: color .18s ease; }
  @keyframes hero-arrive { from { opacity: .85; } to { opacity: 1; } }
}

@media (hover: hover) and (pointer: fine) {
  .button-primary:hover { opacity: .9; }
  .text-link:hover { color: var(--violet); }
  .text-link.light:hover { color: #91d5c2; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .home-page .menu-icon i { transition: none; }
}