/* =========================================================
   AMLEA Behavioral Healthcare | homepage
   Replica of "homepage final.png" (1586 x 992 canvas).
   --u = one mockup pixel; every desktop coordinate below was
   measured from the mockup, so the page scales 1:1 with the
   viewport width. Phones (<=760px) use the stacked layout at the end.
   ========================================================= */
:root{
  color-scheme:only light;
  --u:calc(100vw / 1586);
  --navy:#0b2442;
  --ink:#021038;
  --care-ink:#020753;
  --care-sub:#2f407a;
  --grant-ink:#070d71;
  --purple:#7f06ea;
  --care-bg:#f6f5f4;
  --panel-l:#f8f8fb;
  --panel-r:#f5f4f9;
  --rule:#9ca6b8;
  --font:'Figtree',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;height:100%;background:var(--navy)}
body{margin:0;min-height:100%;display:flex;flex-direction:column;font-family:var(--font);font-weight:500;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased;line-height:1.3;overflow-x:hidden}
main{display:contents}
.hero,.band{flex:none}
/* ---- Hero video (desktop): clip scaled to the strip on the right over a blurred copy of itself ---- */
.hero--video .ov{position:absolute;pointer-events:none;margin:0}
.hero--video .ov img{display:block;width:100%;height:auto}
.hero--video video{position:absolute;opacity:0;transition:opacity .6s linear}
.hero--video video.on{opacity:1}
.hero--video .h1v .grad,.hero--video .hero-copy .grad{background:linear-gradient(90deg,#9932ee 0%,#8e37f4 45%,#0c6ff0 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
h1,h4,p{margin:0}
.hero{position:relative;width:100%}
.hero-img{width:100%;height:auto}
.hero-btn:focus-visible{outline:3px solid #fff;outline-offset:3px}
.hero-btn .arrow{display:inline-block}
.grant--hg{background:var(--panel-l)}
.grant--cgf{background:var(--panel-r)}
.grant-copy{color:var(--grant-ink)}
.grant-copy a{color:var(--purple);font-weight:500}
.grant-copy a .arrow{display:block}
.grant-copy a .arrow svg{display:block;width:100%;height:100%}
.grant-copy a:hover{text-decoration:underline}
.band{width:100%;height:auto}
.care{background:var(--care-bg)}
.care-item{color:var(--care-ink)}
.care-sub{color:var(--care-sub);font-weight:400}
.care-item:hover .care-title{color:var(--purple)}
.site-footer{position:relative;background:var(--navy);color:#fff}
.f-col h4{font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:#fff}
.f-col a{color:#f6f4f8;font-weight:500}
.f-col a:hover{color:#fff;text-decoration:underline}
.f-social{display:flex}
.f-social a{display:block;line-height:0}
.f-social svg{width:100%;height:100%}
.f-slogan{font-weight:500;text-transform:uppercase;color:#fff}
.f-slogan .rule{display:block;background:#fff}

/* =================== DESKTOP: measured 1:1 layout =================== */
@media (min-width:761px){
  .hero-img--mobile{display:none}
  .hero--video{height:calc(394 * var(--u));overflow:hidden;background:#d9cfc6 url(/assets/home/hero-poster-blur.jpg) center 45%/cover no-repeat}
  .hero--video .hero-btn{display:none}
  .hero--video video.bg{inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%;filter:blur(22px) saturate(1.05);transform:scale(1.08)}
  .hero--video video.fg{top:0;right:0;height:100%;width:auto;aspect-ratio:16/9;object-fit:cover;-webkit-mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,#000 22%);mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,#000 22%)}
  .hero--video .logo{left:calc(64 * var(--u));top:calc(62 * var(--u));width:calc(240 * var(--u))}
  .hero--video .sub{left:calc(64 * var(--u));width:calc(240 * var(--u));top:calc(184 * var(--u));text-align:center;font-size:calc(12.5 * var(--u));font-weight:600;letter-spacing:.27em;text-transform:uppercase;color:#0a1738;line-height:calc(14 * var(--u));white-space:nowrap}
  .hero--video .tag{left:calc(64 * var(--u));width:calc(240 * var(--u));top:calc(213 * var(--u));text-align:center;font-size:calc(17 * var(--u));line-height:calc(24 * var(--u));color:#0a1738;white-space:nowrap;font-weight:500}
  .hero--video .hero-copy{clip:auto;width:auto;height:auto;overflow:visible;left:calc(371 * var(--u));top:calc(148 * var(--u))}
  .hero--video .hero-copy .hero-tag{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .hero--video .hero-copy h1{margin:0;font-size:calc(56 * var(--u));line-height:calc(56 * var(--u));font-weight:500;letter-spacing:-.005em;color:#0a1738;white-space:nowrap}
  .hero--video .btnv{position:absolute;left:calc(371 * var(--u));top:calc(278 * var(--u));width:calc(319 * var(--u));height:calc(49 * var(--u));border-radius:999px;background:#0a1a32;color:#fff;display:flex;align-items:center;padding-left:calc(30 * var(--u));font-size:calc(19.5 * var(--u));font-weight:500;box-shadow:0 6px 18px rgba(0,0,0,.25)}
  .hero--video .btnv svg{width:calc(22 * var(--u));height:calc(14 * var(--u));margin-left:calc(12 * var(--u))}
  .hero--video .pin{right:calc(33 * var(--u));top:calc(354 * var(--u));height:calc(28 * var(--u));display:flex;align-items:center;gap:calc(6 * var(--u));color:#fff;font-size:calc(14.5 * var(--u));font-weight:500;text-shadow:0 1px 6px rgba(0,0,0,.45);white-space:nowrap}
  .hero--video .pin svg{width:calc(16 * var(--u));height:calc(20 * var(--u))}
  .hero-copy{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .hero-btn{position:absolute;left:calc(371 * var(--u));top:calc(278 * var(--u));width:calc(319 * var(--u));height:calc(49 * var(--u));
    border-radius:999px;color:transparent;font-size:calc(19 * var(--u));display:flex;align-items:center;justify-content:center;gap:.5em}

  /* Our care strip (y 394-518) */
  .care{position:relative;flex:124 0 calc(124 * var(--u));display:flex;align-items:center}
  .care-in{position:relative;width:100%;height:calc(124 * var(--u))}
  .care-item{position:absolute;top:0;height:100%;width:calc(400 * var(--u));text-align:center}
  .care-item:nth-of-type(1){left:calc(12 * var(--u))}
  .care-item:nth-of-type(2){left:calc(413 * var(--u))}
  .care-item:nth-of-type(3){left:calc(774 * var(--u))}
  .care-item:nth-of-type(4){left:calc(1171.5 * var(--u))}
  .care-item img{position:absolute;top:calc(9 * var(--u));max-width:none}
  .care-item:nth-of-type(1) img{left:calc(170 * var(--u));width:calc(56 * var(--u))}
  .care-item:nth-of-type(2) img{left:calc(169 * var(--u));width:calc(58 * var(--u))}
  .care-item:nth-of-type(3) img{left:calc(170 * var(--u));width:calc(58 * var(--u))}
  .care-item:nth-of-type(4) img{left:calc(172.5 * var(--u));top:calc(8 * var(--u));width:calc(58 * var(--u))}
  .care-title,.care-sub{position:absolute;left:0;right:0;white-space:nowrap}
  .care-title{top:calc(62.5 * var(--u));font-size:calc(19.5 * var(--u));font-weight:500;line-height:calc(24 * var(--u))}
  .care-sub{top:calc(87 * var(--u));font-size:calc(15.5 * var(--u));line-height:calc(20 * var(--u))}
  .care-item:nth-of-type(2) .care-sub{font-size:calc(16 * var(--u))}
  .care-item:nth-of-type(3) .care-sub{font-size:calc(16.2 * var(--u))}
  .care-item:nth-of-type(4) .care-title{font-size:calc(20 * var(--u))}
  .care-item:nth-of-type(4) .care-sub{font-size:calc(15.9 * var(--u))}
  .care-rule{position:absolute;top:calc(26 * var(--u));width:1px;height:calc(50 * var(--u));background:#d1d7e2}
  .care-rule:nth-of-type(1){left:calc(421.5 * var(--u))}
  .care-rule:nth-of-type(2){left:calc(792.5 * var(--u))}
  .care-rule:nth-of-type(3){left:calc(1164.5 * var(--u))}

  /* Grant panels (y 518-727) */
  .grants{position:relative;flex:209 0 calc(209 * var(--u));display:flex;align-items:center;background:linear-gradient(90deg,var(--panel-l) 50%,var(--panel-r) 50%)}
  .grants-in{position:relative;width:100%;height:calc(209 * var(--u));display:grid;grid-template-columns:793fr 793fr}
  .grant{position:relative}
  .grant-visual{position:absolute;left:0;top:0;height:calc(209 * var(--u));width:auto;max-width:none}
  .grant-copy{position:absolute;top:0}
  .grant--hg .grant-copy{left:calc(531 * var(--u))}
  .grant--cgf .grant-copy{left:calc(453 * var(--u))}
  .grant-copy p{position:absolute;top:calc(38 * var(--u));left:0;font-size:calc(20 * var(--u));line-height:calc(25 * var(--u));font-weight:500;white-space:nowrap}
  .grant--cgf .grant-copy p{font-size:calc(20.8 * var(--u))}
  .grant-copy a{position:absolute;top:calc(155 * var(--u));left:0;display:flex;align-items:center;font-size:calc(18.3 * var(--u));line-height:calc(20 * var(--u));white-space:nowrap}
  .grant--cgf .grant-copy a{top:calc(152 * var(--u));font-size:calc(17.7 * var(--u))}
  .grant-copy a .arrow{width:calc(18 * var(--u));height:calc(11 * var(--u));margin-left:calc(9 * var(--u))}
  .grant--cgf .grant-copy a .arrow{margin-left:calc(6 * var(--u))}

  /* Footer (y 801-992); the navy grows to fill tall windows */
  .site-footer{flex:191 0 calc(191 * var(--u));font-size:calc(14.5 * var(--u));display:flex;align-items:center}
  .footer-in{position:relative;width:100%;height:calc(191 * var(--u))}
  .footer-in > *{position:absolute;margin:0}
  .f-logo{left:calc(36 * var(--u));top:calc(17 * var(--u));width:calc(190 * var(--u));max-width:none}
  .f-tag{left:calc(240 * var(--u));top:calc(54 * var(--u));line-height:calc(20 * var(--u));color:#ffffff;white-space:nowrap}
  .f-rule{top:calc(20 * var(--u));width:1px;height:calc(135 * var(--u));background:var(--rule)}
  .f-rule:nth-of-type(1){left:calc(444 * var(--u))}
  .f-rule:nth-of-type(2){left:calc(726 * var(--u))}
  .f-rule:nth-of-type(3){left:calc(1000 * var(--u))}
  .f-rule:nth-of-type(4){left:calc(1312 * var(--u))}
  .f-col{top:calc(16 * var(--u));display:flex;flex-direction:column;align-items:flex-start}
  .f-col--explore{left:calc(486 * var(--u))}
  .f-col--programs{left:calc(762 * var(--u))}
  .f-col--contact{left:calc(1039 * var(--u))}
  .f-col h4{font-size:calc(12 * var(--u));line-height:calc(18 * var(--u));margin-bottom:0}
  .f-col--programs h4{letter-spacing:.09em;margin-bottom:calc(2 * var(--u))}
  .f-col--contact h4{margin-bottom:calc(2 * var(--u))}
  .f-col a{line-height:calc(17.33 * var(--u));white-space:nowrap}
  .f-col--programs a{line-height:calc(18.4 * var(--u))}
  .f-col--contact a{line-height:calc(19 * var(--u));font-size:calc(15.2 * var(--u))}
  .f-social{gap:calc(20.5 * var(--u));margin-top:calc(10 * var(--u))}
  .f-social a{width:calc(27 * var(--u));height:calc(27 * var(--u))}
  .f-slogan{left:calc(1381 * var(--u));top:calc(42 * var(--u));font-size:calc(16 * var(--u));letter-spacing:.245em;line-height:calc(23 * var(--u));white-space:nowrap}
  .f-slogan .rule{width:calc(56 * var(--u));height:1px;margin-top:calc(15 * var(--u))}
  .f-slogan--left{left:auto;right:calc(1211 * var(--u))}  /* longest line ends 69u before the first divider, mirroring the right block's 69u gap after the last divider */
}

/* Windows taller than the composition: the grant visuals float inside taller panels, so fade their top/bottom edges into the panel colour (the mockup background is not perfectly uniform). Not applied at the exact 1586:992 size. */
@media (min-width:761px) and (max-aspect-ratio:1586/1000){
  .grant-visual{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 14px,#000 calc(100% - 14px),transparent);mask-image:linear-gradient(to bottom,transparent,#000 14px,#000 calc(100% - 14px),transparent)}
}

/* =================== PHONES: stacked layout =================== */
@media (max-width:760px){
  body{font-size:16px}
  .hero-img--desktop{display:none}
  .hero--video video,.hero--video .ov,.hero--video .btnv{display:none}
  .hero{display:flex;flex-direction:column;align-items:center}
  .hero-copy{padding:28px 20px 0;text-align:center}
  .hero-tag{font-size:1rem;line-height:1.35;margin-bottom:14px}
  .hero h1{font-size:2.1rem;font-weight:500;line-height:1.12;letter-spacing:-.01em}
  .hero h1 .grad{background:linear-gradient(90deg,#9932ee 0%,#8e37f4 45%,#0c6ff0 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
  .hero-btn{display:inline-flex;align-items:center;gap:.5em;margin:20px auto 30px;background:var(--navy);color:#fff;font-size:1rem;font-weight:500;padding:14px 26px;border-radius:999px}
  .care-in{display:grid;grid-template-columns:1fr 1fr;padding:8px 0 14px}
  .care-rule{display:none}
  .care-item{display:flex;flex-direction:column;align-items:center;text-align:center;padding:18px 8px 12px}
  .care-item img{height:44px;width:auto}
  .care-title{font-size:1rem;line-height:1.25;margin-top:10px}
  .care-sub{font-size:.85rem;line-height:1.3;margin-top:4px}
  .grant{display:flex;flex-direction:column}
  .grant-visual{width:100%;height:auto}
  .grant-copy{padding:18px 24px 30px}
  .grant-copy br{display:none}
  .grant-copy p{font-size:1.15rem;line-height:1.4}
  .grant-copy a{display:inline-flex;align-items:center;font-size:1rem;line-height:1.3;margin-top:14px}
  .grant-copy a .arrow{width:18px;height:11px;margin-left:10px}
  .footer-in{font-size:.95rem;padding:34px 24px 30px;display:grid;gap:26px}
  .f-logo{width:170px}
  .f-tag{line-height:1.45}
  .f-rule{display:none}
  .f-col{display:flex;flex-direction:column;align-items:flex-start}
  .f-col h4{font-size:.78rem;line-height:1.4;margin-bottom:6px}
  .f-col a{line-height:1.7}
  .f-social{gap:20px;margin-top:14px}
  .f-social a{width:26px;height:26px}
  .f-slogan{font-size:.95rem;letter-spacing:.2em;line-height:1.6}
  .f-slogan .rule{width:56px;height:2px;margin-top:12px}
}

/* ===== Growth layer 2026-09-18: hero secondary link, conversion strip, footer link strip ===== */
.hero-start{display:inline-flex;align-items:center;gap:.35em;color:#fff;font-weight:500;text-shadow:0 1px 6px rgba(5,12,40,.55)}
.hero-start strong{font-weight:600;text-decoration:underline;text-underline-offset:3px}
.hero-start:hover strong{color:#fff}
.hero-start:focus-visible{outline:3px solid #fff;outline-offset:3px;border-radius:6px}
.paths{flex:none;background:#fff;border-top:1px solid #e3e7ef;border-bottom:1px solid #e3e7ef}
.paths-in{display:grid;grid-template-columns:1fr 1fr 1fr}
.path{display:block;color:var(--ink);padding:18px 26px;position:relative}
.path+.path::before{content:"";position:absolute;left:0;top:18%;height:64%;width:1px;background:#d1d7e2}
.path-k{display:block;font-weight:600;color:var(--care-ink);font-size:.98rem;margin-bottom:3px}
.path-v{display:block;color:var(--care-sub);font-weight:400;font-size:.9rem;line-height:1.4}
.path-cta{color:var(--purple);font-weight:500;white-space:nowrap}
a.path:hover .path-cta,.path-cta:hover{text-decoration:underline}
a.path:focus-visible{outline:3px solid var(--purple);outline-offset:-3px}
.site-footer{flex-wrap:wrap;align-content:flex-start}
.footer-in{width:100%}
.f-links{width:100%;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 18px;font-size:.82rem;line-height:1.4;padding:14px 24px 22px;border-top:1px solid rgba(255,255,255,.14)}
.f-links a{color:#c9d0e0}
.f-links a:hover{color:#fff;text-decoration:underline}
@media (min-width:761px){
  .hero-start{position:absolute;left:calc(371 * var(--u));top:calc(340 * var(--u));font-size:calc(14.5 * var(--u));white-space:nowrap}
  .paths-in{width:100%;padding:0 calc(12 * var(--u))}
  .path{padding:calc(16 * var(--u)) calc(30 * var(--u))}
  .path-k{font-size:calc(16 * var(--u))}
  .path-v{font-size:calc(14 * var(--u))}
  .f-links{font-size:calc(11 * var(--u));gap:calc(8 * var(--u)) calc(18 * var(--u));padding:calc(12 * var(--u)) calc(24 * var(--u)) calc(18 * var(--u))}
}
@media (max-width:760px){
  .hero-start{order:3;margin:14px auto 28px;font-size:.95rem;color:var(--navy);text-shadow:none}
  .hero-btn{margin-bottom:0}
  .paths-in{grid-template-columns:1fr}
  .path{padding:16px 24px}
  .path+.path::before{left:24px;right:24px;top:0;height:1px;width:auto}
}