/* PREVIEW "tighter sections" (Oct 28) — loads last. Denser, more even home sections; headline fonts unchanged. */

/* 7. even, slightly smaller vertical rhythm on home */
.hy-home main > .s { padding: clamp(44px, 4.4vw, 64px) 0; }
.hy-home .head-split { margin-bottom: 24px; }
.hy-page .s { padding: clamp(36px, 4vw, 56px) 0; }

/* 1. hero fills the first screen: content sits a bit lower, no empty band under it */
.hy-home .hero.hero-inset { min-height: calc(100svh - 73px); display: flex; flex-direction: column; justify-content: center; padding: clamp(28px, 3.4vw, 48px) 0; }
.hy-home .hero-split .hero-grid { width: min(1240px, 100% - 64px); }
.hero-copy { isolation: isolate; }
.hero-shield { position: absolute; z-index: 0; top: 26px; right: max(24px, calc((100% - 1240px) / 2)); width: clamp(7rem, 14vw, 13rem); aspect-ratio: 173 / 214; color: rgba(242,165,72,.22); pointer-events: none; line-height: 0; }
.hy-home .hero-split .hero-grid { position: relative; z-index: 1; }
.hero-shield svg { display: block; width: 100%; height: 100%; overflow: visible; }
@media (max-width: 1080px) { .hy-home .hero.hero-inset { min-height: 0; } }
@media (max-width: 520px) { .hero-shield { width: 5.5rem; top: 12px; right: 12px; } }

/* 2. network: smaller interactive diagram so heading + diagram + caption fit one screen */
.network .stage { padding: clamp(10px, 1.6vw, 20px) clamp(14px, 2vw, 26px); }
@media (min-width: 761px) { .network .nba-svg { height: calc(239px + clamp(140px, 50svh - 270px, 220px)); width: 100%; } }
.network .nba-controls { margin-bottom: 4px; }
.network .recap-one { margin-top: 16px; }

/* 3. portal features: smaller tabs + mock window */
.pt-wrap { gap: clamp(18px, 2.4vw, 30px); align-items: center; }
.pt-tabs { gap: 8px; }
.pt-tab { padding: 11px 16px; gap: 12px; grid-template-columns: 38px 1fr; border-radius: 16px; }
.pt-ico { width: 38px; height: 38px; border-radius: 11px; } .pt-ico svg { width: 22px; height: 22px; }
.pt-tt b { font-size: .96rem; } .pt-tt em { font-size: .84rem; line-height: 1.45; margin-top: 2px; }
.pm { zoom: .74; max-width: 760px; justify-self: center; width: 100%; }
.pm-body { min-height: 330px; }
.pt-more { margin-top: 16px; padding: 12px 18px; }
.pt-more-ico { width: 36px; height: 36px; } .pt-more-ico svg { width: 22px; height: 22px; }
.pt-more p { font-size: .94rem; }

/* 4. how it works: slimmer step cards */
.tl { gap: 8px; }
.tl-step { padding: 11px 18px; gap: 14px; border-radius: 16px; }
.tl-ico .tl-step { grid-template-columns: 52px minmax(0, 1fr) 38px; }
.tl-num { font-size: 1.55rem; padding-top: 0; }
.tl-body h3 { font-size: 1.08rem; margin-bottom: 2px; }
.tl-body p { font-size: .92rem; line-height: 1.45; }
.tl-i { width: 38px; height: 38px; border-radius: 10px; } .tl-i svg { width: 22px; height: 22px; }
.tl-note { margin-top: 12px; }
.hy-home .path .split { align-items: center; }

/* 5. testimonials: tighter card */
.q-feature .q-card:first-child, .q-carousel.is-carousel .q-card { padding: clamp(20px, 2.2vw, 30px) clamp(22px, 2.6vw, 36px); gap: 14px; }
.q-feature .q-card:first-child .q-mark { width: 34px; height: 26px; }
.q-feature .q-card:first-child blockquote p { font-size: clamp(1.08rem, 1.45vw, 1.32rem); line-height: 1.5; }
.q-carousel.is-carousel .q-card { max-width: 860px; }
.q-nav { margin-top: 12px; } .q-nav button { width: 34px; height: 34px; }

/* 6. team (home): no button, smaller photos, all six in one row on desktop, 3 x 2 below */
.team-cta { display: none !important; }
.team-teaser .tg { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; max-width: none; }
.team-teaser .tm-card { border-radius: 18px; }
.team-teaser .tm-info { padding: 10px 12px 12px; gap: 2px; }
.team-teaser .tm-name { font-size: .98rem; }
.team-teaser .tm-title { font-size: .78rem; }
@media (max-width: 1100px) { .team-teaser .tg { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 780px; margin-inline: auto; } }
@media (max-width: 639px) { .team-teaser .tg { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } }
@media (min-width: 1101px) { .pt-wrap { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); } }

/* ---- round 2 (Oct 28, 11:15) ---- */
/* 2. portal mock: one locked frame size for every tab */
.pm-body { min-height: 0; height: 420px; }
.pm-main { overflow: hidden; }
.pm-card { grid-template-columns: 34px minmax(0, 1fr); column-gap: 10px; row-gap: 6px; padding: 12px 14px; align-items: center; }
.pm-card .pm-av { grid-row: span 2; }
.pm-card b, .pm-card em { grid-column: 2; line-height: 1.2; }
.pm-card .pm-x, .pm-card .pm-btn { grid-column: 1 / -1; }
.pm-card .pm-x + .pm-x { display: none; }
@media (max-width: 639px) { .pm-body { height: 520px; } }
/* 3. demo CTA buttons centred under the checklist, equal width */
.demo-side { display: grid; justify-items: center; }
.demo-hl { width: 100%; }
.demo-actions { margin-top: 26px; justify-content: center; gap: 14px; width: 100%; }
.demo-actions .btn { flex: 0 0 276px; max-width: 100%; justify-content: center; text-align: center; }
/* 5. Book a Demo dropdown: smaller chevron, tighter right padding */
.demo-wrap .btn-demo { gap: 4px; padding-right: 13px; }
.demo-wrap .btn-demo .ico-chev { width: 11px; height: 11px; margin-left: 1px; opacity: .85; stroke-width: 2.6; }
/* 6. team: every caption bubble the same height */
.team-teaser .tg { align-items: stretch; }
.team-teaser .tm-card { height: 100%; }
.team-teaser .tm-info { flex: 1 1 auto; align-content: start; min-height: 64px; }
@media (max-width: 639px) { .demo-actions .btn { flex: 1 1 100%; } }

/* ---- round 3: every dedicated page starts its numbered heading at the same height ---- */
.hy-page .hy-chapter > .s:first-of-type { padding-top: clamp(56px, 6.5vw, 96px); }
.hy-page .hy-chapter > .s:first-of-type .split { align-items: start; }
.hy-page .hy-chapter > .s:first-of-type .split > .split-l { align-self: start; }
.hy-page .hy-chapter > .s:first-of-type .head-split > .split-r { align-self: end; }

/* ---------- round 3b: "Continue exploring" pills on ONE row (desktop/laptop) ---------- */
@media (min-width: 992px) {
  .hy-a2 .hy-strip { grid-template-columns: minmax(0,1fr); }
  .hy-a2 .hy-pills { flex-wrap: nowrap; gap: 6px; justify-content: space-between; }
  .hy-a2 .hy-pill { flex: 1 1 auto; min-width: 0; justify-content: center; gap: 5px; padding: 5px 9px 5px 5px; font-size: .72rem; }
  .hy-a2 .hy-pill b { width: 18px; height: 18px; font-size: .56rem; }
}
@media (min-width: 992px) and (max-width: 1240px) {
  .hy-a2 .hy-strip { padding: 14px 14px; }
  .hy-a2 .hy-pills { gap: 4px; }
  .hy-a2 .hy-pill { gap: 4px; padding: 4px 7px 4px 4px; font-size: .66rem; }
  .hy-a2 .hy-pill b { width: 16px; height: 16px; font-size: .52rem; }
}

/* ===== Oct 28 fix 52: one site-wide FIXED shield; content scrolls over it ===== */
.sm-fixed-shield { position: fixed; z-index: 0; top: calc(var(--hdr-h, 76px) + 26px); right: max(24px, calc((100vw - 1240px) / 2)); width: clamp(7rem, 14vw, 13rem); aspect-ratio: 173 / 214; color: rgba(242,165,72,.22); pointer-events: none; line-height: 0; }
.sm-fixed-shield svg { display: block; width: 100%; height: 100%; overflow: visible; }
.hy main, .hy .site-footer { position: relative; z-index: 1; }
.hero-shield, .hy-bignum { display: none !important; }
@media (max-width: 520px) { .sm-fixed-shield { width: 5.5rem; top: calc(var(--hdr-h, 64px) + 12px); right: 12px; } }

/* ===== Oct 28 fix 56: Book a Demo — LEFT-aligned heading like every other section; right = tidy action panel ===== */
.demo .demo-head { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 80px); align-items: center; text-align: left; max-width: none; margin: 0 0 34px; }
.demo .demo-head > .split-l, .demo .demo-head > .split-r { width: auto; max-width: none; }
.demo .demo-head .chap { justify-content: flex-start; }
.demo .demo-head .lead { max-width: 46ch; margin-left: 0; margin-right: 0; }
.demo .demo-side { display: block; margin: 0; padding: 26px 28px; border-radius: 20px; background: linear-gradient(160deg, rgba(255,255,255,.07), rgba(255,255,255,.025)); border: 1px solid rgba(255,255,255,.12); box-shadow: 0 24px 60px -30px rgba(0,0,0,.6); }
.demo .demo-hl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 22px; width: auto; margin: 0; padding: 0 0 22px; list-style: none; border-bottom: 1px solid rgba(255,255,255,.10); }
.demo .demo-hl li { padding: 0; border: 0; background: none; border-radius: 0; font-size: .97rem; line-height: 1.3; gap: 10px; white-space: normal; }
@media (min-width: 1100px) { .demo .demo-hl li { white-space: nowrap; } }
.demo .demo-hl li::before { width: 20px; height: 20px; background-size: 13px; }
.demo .demo-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 22px; width: auto; }
.demo .demo-actions .btn { flex: none; width: 100%; justify-content: center; text-align: center; padding-left: 16px; padding-right: 16px; white-space: nowrap; }
.demo .demo-card { margin-top: 0; }
@media (max-width: 991px) {
  .demo .demo-head { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width: 639px) {
  .demo .demo-side { padding: 20px; }
  .demo .demo-hl { grid-template-columns: 1fr; gap: 10px; }
  .demo .demo-actions { grid-template-columns: 1fr; }
}

/* ===== Oct 28 fix 52: home hero transparent so the fixed shield shows through; content still scrolls over it ===== */
.hy-home .hero.hero-inset { background: transparent; }

/* ===== Oct 28 fix 52: Register Your Clinic stands out (Book a Demo stays primary solid orange) ===== */
.btn-reg { border: 1.5px solid var(--orange); color: #fff; background: rgba(242,165,72,.14); box-shadow: 0 0 0 0 rgba(242,165,72,0); transition: background .25s, color .25s, box-shadow .25s; }
.btn-reg:hover, .btn-reg:focus-visible { background: var(--orange); color: #fff; box-shadow: 0 10px 28px -12px rgba(242,165,72,.7); }
.footer-links .btn-reg-solid, .menu-foot .btn-reg-solid { justify-self: start; margin-top: 8px; color: #fff; }
.footer-links .btn-reg-solid:hover { background: var(--orange-bright); color: var(--navy); }
.hy .login-pop a[href$="#/register"] { color: var(--orange-bright, #f2a548); font-weight: 700; }
.menu-foot .btn-reg-solid { background: rgba(242,165,72,.14); border: 1.5px solid var(--orange); }
.hy-home .hero.hero-inset { background: radial-gradient(ellipse 55% 65% at 28% 50%, rgba(0,93,217,.26), transparent 72%), radial-gradient(ellipse 40% 50% at 90% 10%, rgba(0,93,217,.16), transparent 70%); }

/* ===== Oct 28 fix 56: footer — Register Your Clinic stacked under Book a Demo, same style as section btn-reg ===== */
.footer-brand .footer-ctas { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; margin-top: 16px; }
.footer-brand .footer-ctas .btn { min-width: 190px; justify-content: center; text-align: center; margin: 0; }
.footer-brand .footer-ctas .btn-reg { background: rgba(10,18,40,.9); border: 1.5px solid var(--orange); color: #fff; }
.footer-brand .footer-ctas .btn-reg:hover, .footer-brand .footer-ctas .btn-reg:focus-visible { background: var(--orange); color: #fff; }

/* ===== Oct 28 fix 58: Why goal box — icon | thin divider | two stacked lines (Nick mockup) ===== */
.goal { grid-template-columns: 44px 1px 1fr; align-items: center; column-gap: 22px; }
.goal::after { content: ""; grid-column: 2; grid-row: 1; align-self: stretch; width: 1px; min-height: 44px; background: rgba(16,32,72,.2); position: relative; }
.goal .goal-icon { grid-column: 1; grid-row: 1; }
.goal p.goal-lines { grid-column: 3; grid-row: 1; margin: 0; line-height: 1.55; }
.goal p.goal-lines span { display: inline; }
@media (max-width: 640px) {
  .goal { grid-template-columns: 36px 1px 1fr; column-gap: 16px; }
  .goal .goal-icon { width: 36px; height: 36px; }
}
