/* ============================================================
   Guided Rehab Portal — marketing landing page
   ============================================================ */
:root{
  --primary:#0A7350; --primary-d:#0F2A26; --accent:#14B97E; --accent-d:#0E8C5F;
  --accent-ink:#0A7350;
  --ink:#233832; --ink-soft:#51655E; --line:#CBDDD3;
  --paper:#F7FAF8; --paper-2:#E4EFE9; --card:#fff;
  --maxw:1160px;
}
*{box-sizing:border-box}
body.lp{
  margin:0; font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  color:var(--ink); background:var(--paper); line-height:1.6; -webkit-font-smoothing:antialiased;
}
.lp img{max-width:100%; display:block}
.lp-wrap{max-width:var(--maxw); margin:0 auto; padding:0 clamp(1.1rem,4vw,2rem)}
.lp h1,.lp h2,.lp h3{font-family:'Atkinson Hyperlegible','Inter',system-ui,sans-serif; font-weight:700; line-height:1.12; margin:0}
.hl{color:var(--accent-d)}

/* nav */
.lp-nav{
  position:sticky; top:0; z-index:50; display:flex; align-items:center; justify-content:space-between;
  gap:1rem; padding:.8rem clamp(1.1rem,4vw,2rem);
  background:#fff; border-bottom:1px solid var(--line); box-shadow:0 1px 12px rgba(28,28,60,.05);
}
.lp-brand{font-weight:700; text-decoration:none; color:var(--primary); font-size:1.1rem; display:flex; align-items:center; gap:.45rem; white-space:nowrap}
.lp-dot{color:var(--accent)}
.lp-nav-links{display:flex; align-items:center; gap:1.3rem}
.lp-nav-links a{text-decoration:none; color:var(--ink-soft); font-weight:500; font-size:.95rem}
.lp-nav-links a:hover{color:var(--ink)}
.lp-link-btn{color:var(--primary)!important}

/* buttons */
.lp-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
  font-weight:600; font-size:1rem; text-decoration:none; cursor:pointer;
  background:var(--primary); color:#fff; border:1px solid var(--primary);
  padding:.8rem 1.5rem; border-radius:8px; transition:.16s; white-space:nowrap;
}
.lp-btn:hover{background:var(--primary-d); border-color:var(--primary-d)}
.lp-btn.sm{padding:.55rem 1.1rem; font-size:.92rem}
.lp-btn.ghost{background:transparent; color:var(--ink); border-color:var(--line)}
.lp-btn.ghost:hover{background:#fff}
.lp-btn.light{background:#fff; color:var(--primary); border-color:#fff}
.lp-btn.light:hover{background:var(--paper-2)}
.lp-btn.outline{background:transparent; color:#fff; border-color:rgba(255,255,255,.6)}
.lp-btn.outline:hover{background:rgba(255,255,255,.12)}

/* hero — full-bleed image with text overlay */
.lp-hero{position:relative; isolation:isolate; overflow:hidden; display:flex; align-items:center;
  min-height:clamp(480px,72vh,660px);}
.lp-hero-bg{position:absolute; inset:0; z-index:-2}
.lp-hero-bg img{width:100%; height:100%; object-fit:cover; object-position:center}
.lp-hero::after{content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(100deg, rgba(15,42,38,.96) 0%, rgba(15,42,38,.88) 42%, rgba(15,42,38,.6) 74%, rgba(15,42,38,.4) 100%);}
.lp-hero-copy{width:100%; max-width:var(--maxw); margin:0 auto; padding:clamp(2.5rem,6vw,4.5rem) clamp(1.1rem,4vw,2rem)}
.lp-hero-inner{max-width:39rem}
.lp-eyebrow{font-family:'IBM Plex Mono',monospace; text-transform:uppercase; letter-spacing:.16em; font-size:.74rem; font-weight:600; color:var(--accent-ink); margin:0 0 1rem}
.lp-hero .lp-eyebrow{color:#6FE0B0}
.lp-hero h1{font-family:'Atkinson Hyperlegible','Inter',system-ui,sans-serif; font-weight:700; font-size:clamp(2.4rem,5.6vw,3.9rem); letter-spacing:-.02em; color:#fff}
.lp-hero .hl{color:#62D6A0}
.lp-hero .lp-lead{color:rgba(255,255,255,.9)}
.lp-hero .lp-trust{color:rgba(255,255,255,.72)}
.lp-lead{font-size:clamp(1.05rem,2vw,1.2rem); color:var(--ink-soft); max-width:48ch; margin:1.1rem 0 1.6rem}
.lp-cta{display:flex; gap:.8rem; flex-wrap:wrap}
.lp-cta.center{justify-content:center}
.lp-trust{margin-top:1.1rem; font-size:.85rem; color:var(--ink-soft)}

/* placeholder image blocks */
.ph{position:relative; border-radius:20px; overflow:hidden; background:var(--paper-2); border:1px solid var(--line); min-height:240px}
.ph img{width:100%; height:100%; object-fit:cover; display:block}
.ph-fall{
  position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:.6rem; text-align:center; padding:1.4rem; color:var(--ink-soft);
  background:
    repeating-linear-gradient(45deg, transparent, transparent 14px, rgba(0,0,0,.015) 14px, rgba(0,0,0,.015) 28px),
    linear-gradient(160deg, var(--paper-2), #e2e4f2);
}
.ph-ico{font-size:2rem; color:var(--accent); opacity:.8}
.ph-fall span:last-child{font-size:.9rem; max-width:24ch}
.lp-hero-img .ph{min-height:330px}

/* bands */
.lp-band{padding:clamp(2.4rem,6vw,4.5rem) 0; border-top:1px solid var(--line)}
.lp-band:nth-of-type(even){background:#fff}
.lp-h2{font-family:'Atkinson Hyperlegible','Inter',system-ui,sans-serif; font-weight:500; font-size:clamp(1.6rem,3.4vw,2.2rem); color:var(--primary); max-width:22ch}
.lp-h2.center{margin:0 auto 2rem; text-align:center; max-width:26ch}

/* 3 cards */
.lp-cards3{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1.1rem; margin-top:1.8rem}
.lp-card{background:var(--card); border:1px solid var(--line); border-radius:16px; padding:1.4rem}
.lp-card-ico{font-size:1.6rem}
.lp-card h3{font-size:1.1rem; margin:.6rem 0 .35rem; color:var(--ink)}
.lp-card p{margin:0; color:var(--ink-soft)}

/* features */
.lp-features{padding:clamp(2rem,5vw,4rem) clamp(1.1rem,4vw,2rem)}
.lp-feature{display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.4rem,4vw,3rem); align-items:center; padding:clamp(1.5rem,4vw,2.6rem) 0}
.lp-feature.reverse .lp-feature-text{order:2}
.lp-feature .ph{min-height:300px}
.lp-kicker{display:inline-block; text-transform:uppercase; letter-spacing:.1em; font-size:.72rem; font-weight:700; color:var(--accent-ink); margin-bottom:.6rem}
.lp-feature h2{font-family:'Atkinson Hyperlegible','Inter',system-ui,sans-serif; font-weight:500; font-size:clamp(1.5rem,3vw,2rem); color:var(--primary); margin-bottom:.6rem}
.lp-feature p{color:var(--ink-soft); font-size:1.05rem; margin:0}

/* steps */
.lp-steps{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1.2rem}
.lp-step{background:var(--card); border:1px solid var(--line); border-radius:16px; padding:1.5rem}
.lp-step-n{display:inline-flex; align-items:center; justify-content:center; width:2.2rem; height:2.2rem; border-radius:50%; background:color-mix(in srgb,var(--accent) 16%,white); color:var(--accent-d); font-family:'Atkinson Hyperlegible','Inter',system-ui,sans-serif; font-weight:600; font-size:1.2rem; margin-bottom:.7rem}
.lp-step h3{font-size:1.1rem; color:var(--ink)}
.lp-step p{margin:.35rem 0 0; color:var(--ink-soft)}

/* video */
.lp-video{margin-top:2rem}
.lp-video-frame{position:relative; padding-bottom:56.25%; height:0; border-radius:18px; overflow:hidden; border:1px solid var(--line); box-shadow:0 18px 50px rgba(40,50,45,.10)}
.lp-video-frame iframe{position:absolute; inset:0; width:100%; height:100%}
.lp-video-ph{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5rem; text-align:center;
  aspect-ratio:16/9; border-radius:18px; border:1px dashed color-mix(in srgb,var(--primary) 30%,var(--line));
  background:linear-gradient(160deg, var(--paper-2), #e2e4f2); color:var(--ink-soft);
}
.lp-play{display:inline-flex; align-items:center; justify-content:center; width:4rem; height:4rem; border-radius:50%; background:var(--primary); color:#fff; font-size:1.4rem; padding-left:.2rem}
.lp-video-ph p{margin:.4rem 0 0; font-weight:600; color:var(--ink)}
.lp-video-ph small{font-size:.8rem}

/* testimonial */
.lp-quote-band{background:var(--primary); color:#fff; padding:clamp(2.4rem,6vw,4rem) 0}
.lp-quote{font-family:'Atkinson Hyperlegible','Inter',system-ui,sans-serif; font-size:clamp(1.3rem,3vw,1.9rem); font-weight:400; line-height:1.35; text-align:center; max-width:24ch; margin:0 auto}
.lp-quote cite{display:block; font-family:'Inter',sans-serif; font-size:.9rem; font-style:normal; opacity:.8; margin-top:1rem}

/* privacy */
.lp-privacy{max-width:60ch; margin:0 auto; text-align:center}
.lp-privacy p{color:var(--ink-soft); font-size:1.08rem; margin-top:1rem}

/* final cta */
.lp-final{background:linear-gradient(160deg, var(--primary), var(--primary-d)); color:#fff; padding:clamp(2.6rem,6vw,4.5rem) 0; text-align:center}
.lp-final h2{font-family:'Atkinson Hyperlegible','Inter',system-ui,sans-serif; font-weight:500; font-size:clamp(1.7rem,4vw,2.5rem); margin-bottom:1.4rem}

/* footer */
.lp-foot{background:#171826; color:#c7c9e6; padding:1.6rem 0}
.lp-foot-in{display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap}
.lp-foot-in .lp-dot{color:var(--accent)}
.lp-foot-links{display:flex; gap:1.3rem}
.lp-foot-links a{color:#c7c9e6; text-decoration:none; font-size:.9rem}
.lp-foot-links a:hover{color:#fff}

@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* responsive */
@media (max-width:820px){
  .lp-hero{grid-template-columns:1fr}
  .lp-hero-img{order:-1}
  .lp-feature{grid-template-columns:1fr}
  .lp-feature.reverse .lp-feature-text{order:0}
  .lp-nav-links a:not(.lp-btn):not(.lp-link-btn){display:none}
  .lp-nav{gap:.5rem}
  .lp-nav-links{gap:.7rem}
  .lp-brand{font-size:1rem}
  .lp-btn.sm{padding:.55rem .95rem; font-size:.88rem}
}
@media (max-width:520px){
  .lp-link-btn{display:none}
  .lp-brand{font-size:.92rem}
}

/* Landing nav logo (replaces the diamond + wordmark) */
.lp-brand img.lp-logo{height:34px; width:auto; display:block}
@media (max-width:520px){ .lp-brand img.lp-logo{height:28px} }
