/* ============================================================
   AEIC AI for Practitioners — Your playbook
   Tokens, fonts and buttons match the course hub (hub-page/assets/style.css).
   Fonts are self-hosted: some member networks block Google.
   ============================================================ */

@font-face{font-family:"Montserrat";src:url("fonts/montserrat-v31-latin-500.ttf") format("truetype");font-weight:500;font-display:swap;}
@font-face{font-family:"Montserrat";src:url("fonts/montserrat-v31-latin-600.ttf") format("truetype");font-weight:600;font-display:swap;}
@font-face{font-family:"Montserrat";src:url("fonts/montserrat-v31-latin-700.ttf") format("truetype");font-weight:700;font-display:swap;}
@font-face{font-family:"Montserrat";src:url("fonts/montserrat-v31-latin-800.ttf") format("truetype");font-weight:800;font-display:swap;}
@font-face{font-family:"Roboto";src:url("fonts/roboto-v51-latin-regular.ttf") format("truetype");font-weight:400;font-display:swap;}
@font-face{font-family:"Roboto";src:url("fonts/roboto-v51-latin-500.ttf") format("truetype");font-weight:500;font-display:swap;}
@font-face{font-family:"Roboto";src:url("fonts/roboto-v51-latin-700.ttf") format("truetype");font-weight:700;font-display:swap;}

:root{
  --slate:#333F48; --slate-deep:#1F262B; --slate-card:#3C4A54;
  --green:#4A9560; --green-text:#2F6B3D; --green-hover:#3f8253; --green-wash:#EEF5F0;
  --yellow:#F0B431; --yellow-wash:#FDF4DE;
  --hairline:#D9D9D9; --meta:#6B6B6B; --fill:#F5F6F7; --white:#fff;
  --container:1180px; --measure:60ch;
  --gutter:clamp(16px,5vw,40px);
  --pad:clamp(40px,7vw,88px);
  --radius:10px; --radius-btn:6px;
  font-size:18px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:64px;}
body{font-family:"Roboto",system-ui,sans-serif;font-size:1rem;line-height:1.6;color:var(--slate);background:var(--white);-webkit-font-smoothing:antialiased;overflow-x:hidden;}
img,svg{max-width:100%;display:block;}
a{color:var(--green-text);text-underline-offset:2px;}
b,strong{font-weight:700;}

a:focus-visible,.btn:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,label.btn:focus-within{outline:3px solid var(--yellow);outline-offset:2px;}

.container{max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter);width:100%;}
.section{padding-block:var(--pad);}
.section--fill{background:var(--fill);border-block:1px solid var(--hairline);}
.measure{max-width:var(--measure);}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.skip-link{position:fixed;top:8px;left:8px;z-index:100;padding:12px 20px;background:var(--white);color:var(--slate);transform:translateY(-160%);}
.skip-link:focus{transform:translateY(0);}

.eyebrow{font-family:"Montserrat";font-weight:700;font-size:.74rem;text-transform:uppercase;letter-spacing:.13em;color:var(--green-text);margin-bottom:.7rem;}
.h2{font-family:"Montserrat";font-weight:700;font-size:clamp(1.4rem,3vw,2rem);line-height:1.18;letter-spacing:-.012em;color:var(--slate);text-wrap:balance;margin-bottom:.9rem;}
.lead{font-size:1.0625rem;line-height:1.6;max-width:var(--measure);}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:"Montserrat";font-weight:600;font-size:.95rem;letter-spacing:.01em;padding:.7em 1.3em;border-radius:var(--radius-btn);text-decoration:none;border:0;cursor:pointer;min-height:48px;transition:background .15s,box-shadow .15s,color .15s;}
.btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.btn--primary{background:var(--green);color:#fff;}
.btn--primary:hover{background:var(--green-hover);}
.btn--outline{background:var(--white);color:var(--slate);box-shadow:inset 0 0 0 2px var(--slate);}
.btn--outline:hover{background:var(--slate);color:#fff;}
.btn--quiet{background:transparent;color:var(--green-text);text-decoration:underline;text-underline-offset:3px;padding-inline:.4em;font-weight:600;}
.btn--quiet:hover{color:var(--slate);}

/* ---------- Hero (same pattern as the hub) ---------- */
.pbhero{position:relative;color:#fff;overflow:hidden;background:var(--slate-deep);}
.pbhero__media{position:absolute;inset:0;}
.pbhero__media img{width:100%;height:100%;object-fit:cover;object-position:center 30%;}
.pbhero__scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(31,38,43,.62) 0%,rgba(31,38,43,.82) 55%,rgba(31,38,43,.95) 100%);}
.pbhero__bar{position:relative;display:flex;align-items:center;gap:.75rem;padding-top:18px;font-family:"Montserrat";font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;}
.pbhero__bar img{height:26px;width:auto;}
.pbhero__inner{position:relative;padding-block:clamp(28px,5vw,52px) clamp(32px,6vw,56px);}
.pbhero__wordmark{width:min(300px,68vw);margin-bottom:1.2rem;}
.pbhero h1{font-family:"Montserrat";font-weight:800;font-size:clamp(1.9rem,4.4vw,2.8rem);line-height:1.1;letter-spacing:-.015em;margin-bottom:.6rem;}
.pbhero p{max-width:48ch;color:rgba(255,255,255,.88);font-size:1.0625rem;}
.pbhero__back{display:inline-flex;align-items:center;min-height:44px;margin-top:.8rem;color:#fff;font-family:"Montserrat";font-weight:600;font-size:.9rem;}
.pbhero__back:hover{color:var(--yellow);}

/* ---------- Progress strip ---------- */
.steps{position:sticky;top:0;z-index:40;background:var(--slate-deep);color:#fff;border-bottom:1px solid rgba(255,255,255,.08);}
.steps__inner{display:flex;gap:4px;overflow-x:auto;padding-block:6px;scrollbar-width:none;}
.steps__inner::-webkit-scrollbar{display:none;}
.stepnav{flex:0 0 auto;display:flex;flex-direction:column;justify-content:center;min-height:48px;padding:.3rem .8rem;border-radius:var(--radius-btn);text-decoration:none;color:#fff;border-bottom:3px solid transparent;}
.stepnav:hover{background:rgba(255,255,255,.08);}
.stepnav__rung{font-family:"Montserrat";font-weight:700;font-size:.8rem;white-space:nowrap;}
.stepnav__state{font-size:.72rem;color:rgba(255,255,255,.7);white-space:nowrap;}
.stepnav--open{border-bottom-color:var(--yellow);}
.stepnav--started{border-bottom-color:var(--yellow);}
.stepnav--started .stepnav__state{color:var(--yellow);}
.stepnav--done{border-bottom-color:var(--green);}
.stepnav--done .stepnav__state{color:#9fd3ad;}
.stepnav--locked{color:rgba(255,255,255,.55);}
.stepnav--locked .stepnav__state{color:rgba(255,255,255,.45);}
.stepnav--case{margin-left:auto;}

/* ---------- How it works ---------- */
.howto{padding-bottom:calc(var(--pad) * .6);}
.howto__grid{display:grid;gap:2rem;grid-template-columns:1fr;}
@media(min-width:900px){.howto__grid{grid-template-columns:1.2fr .8fr;align-items:start;}}
.tip{margin-top:1rem;max-width:var(--measure);padding:.8rem 1rem;background:var(--yellow-wash);border-left:4px solid var(--yellow);border-radius:4px;}
.notice{background:var(--slate);color:#fff;border-radius:var(--radius);padding:1.4rem 1.4rem 1.2rem;}
.notice h3{font-family:"Montserrat";font-weight:700;font-size:1.05rem;margin-bottom:.6rem;color:var(--yellow);}
.notice p{font-size:.95rem;color:rgba(255,255,255,.9);margin-bottom:.7rem;}
.notice a{color:#fff;}
.notice__btn{margin:.1rem 0 .9rem;}
.notice__rule{border-top:1px solid rgba(255,255,255,.18);padding-top:.7rem;}
.notice__status.is-warn{background:var(--yellow);color:var(--slate);padding:.6rem .8rem;border-radius:6px;font-weight:700;margin:0;}

/* ---------- A field ---------- */
.field{border-top:1px solid var(--hairline);}
.field__grid{display:grid;gap:1.6rem;grid-template-columns:1fr;}
@media(min-width:980px){
  .field__grid{grid-template-columns:.8fr 1.2fr;gap:3rem;align-items:start;}
  .field__head{position:sticky;top:84px;}
}
.tie{margin-top:1rem;padding:.8rem 1rem;border-left:4px solid var(--green);background:var(--green-wash);border-radius:4px;font-weight:500;max-width:var(--measure);}

.bar{margin-top:1.2rem;border:1px solid var(--hairline);border-radius:var(--radius);padding:1rem 1.1rem;background:var(--white);}
.bar__h{font-family:"Montserrat";font-weight:700;font-size:.9rem;margin-bottom:.5rem;}
.bar p+p{margin-top:.4rem;}
.bar__tag{display:inline-block;min-width:4.4em;font-family:"Montserrat";font-weight:700;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;padding:.15em .5em;border-radius:4px;margin-right:.3rem;text-align:center;}
.bar__tag--weak{background:var(--fill);color:var(--meta);border:1px solid var(--hairline);}
.bar__tag--strong{background:var(--green);color:#fff;}
.trackhelp{margin-top:.8rem;font-size:.95rem;color:var(--meta);max-width:var(--measure);}
/* Worked example, one per track */
.ex{margin-top:1rem;}
.ex__pick{font-size:.92rem;color:var(--meta);}
.ex__box{border:1px solid var(--hairline);border-left:4px solid var(--yellow);border-radius:var(--radius);background:var(--white);}
.ex__box summary{cursor:pointer;list-style:none;padding:.8rem 1.1rem;min-height:48px;display:flex;align-items:center;gap:.6rem;font-family:"Montserrat";font-weight:700;font-size:.92rem;color:var(--slate);}
.ex__box summary::-webkit-details-marker{display:none;}
.ex__box summary::before{content:"+";display:inline-flex;align-items:center;justify-content:center;width:1.4em;height:1.4em;border-radius:4px;background:var(--yellow-wash);color:var(--slate);font-weight:700;flex:0 0 auto;}
.ex__box[open] summary::before{content:"\2212";}
.ex__note{margin:0 1.1rem .6rem;font-size:.85rem;color:var(--meta);}
.ex__list{margin:0 1.1rem 1rem;}
.ex__list dt{font-family:"Montserrat";font-weight:700;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:var(--green-text);margin-top:.7rem;}
.ex__list dd{margin:.15rem 0 0;font-size:.95rem;line-height:1.5;}
@media print{.ex{display:none;}}

.field__work{display:grid;gap:1.4rem;min-width:0;}
.step,.person,.two{border:1px solid var(--hairline);border-radius:var(--radius);padding:1.2rem;background:var(--white);min-width:0;}
.step__h,.two__h{font-family:"Montserrat";font-weight:700;font-size:1.1rem;margin-bottom:.5rem;}
.step>p{margin-bottom:.8rem;}

.prompt{white-space:pre-wrap;overflow-wrap:anywhere;font-family:"Roboto",system-ui,sans-serif;font-size:.88rem;line-height:1.5;background:var(--green-wash);border:1px solid #d4e6da;border-radius:8px;padding:1rem;max-height:22rem;overflow-y:auto;}
.fill{background:var(--yellow-wash);box-shadow:inset 0 -2px 0 var(--yellow);border-radius:2px;padding:0 2px;}
.fill--empty{color:var(--meta);font-style:normal;}
.row{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem;margin-top:.8rem;}
.row__status{font-size:.9rem;color:var(--green-text);font-weight:500;}

.lbl{display:block;font-weight:700;font-size:.95rem;margin:1rem 0 .3rem;}
.lbl--sm{font-size:.85rem;margin-top:.6rem;}
.hint{font-size:.88rem;color:var(--meta);margin:-.1rem 0 .4rem;}
input[type=text],textarea{width:100%;font:inherit;font-size:1rem;color:var(--slate-deep);background:var(--white);border:1px solid #9aa3aa;border-radius:8px;padding:.65rem .8rem;min-height:48px;}
textarea{resize:vertical;line-height:1.5;}
input[type=text]:focus,textarea:focus{border-color:var(--green);}
fieldset{border:0;min-width:0;}
legend.lbl{padding:0;}
.pair{display:grid;grid-template-columns:1fr;gap:0 .8rem;}
@media(min-width:560px){.pair{grid-template-columns:1fr 1fr;}}

.trackpick{display:grid;gap:.5rem;}
.trackpick__opt{display:flex;gap:.7rem;align-items:flex-start;border:1px solid var(--hairline);border-radius:8px;padding:.7rem .8rem;cursor:pointer;min-height:48px;}
.trackpick__opt:hover{border-color:var(--green);}
.trackpick__opt input{margin-top:.25rem;width:20px;height:20px;accent-color:var(--green);flex:0 0 auto;}
.trackpick__opt:has(input:checked){border-color:var(--green);background:var(--green-wash);box-shadow:inset 3px 0 0 var(--green);}
.trackpick__opt.is-off{opacity:.45;cursor:default;}
.trackpick__opt.is-off:hover{border-color:var(--hairline);}
.trackpick__limit{margin:0;font-size:.85rem;color:var(--meta);min-height:1.2em;}
.trackpick__name{display:block;font-family:"Montserrat";font-weight:700;font-size:.92rem;}
.trackpick__shape{display:block;font-size:.88rem;color:var(--meta);line-height:1.45;}

.choice__row{display:flex;flex-wrap:wrap;gap:.5rem;}
.choice__row label{display:flex;align-items:center;gap:.45rem;border:1px solid var(--hairline);border-radius:6px;padding:.45rem .75rem;min-height:44px;font-size:.92rem;cursor:pointer;}
.choice__row label:has(input:checked){border-color:var(--green);background:var(--green-wash);}
.choice__row input{width:18px;height:18px;accent-color:var(--green);}

.box{border:1px solid var(--hairline);border-left:4px solid var(--green);border-radius:8px;padding:.9rem 1rem 1rem;margin-top:1rem;}
.box--accent{border-left-color:var(--yellow);}
.box h4{font-family:"Montserrat";font-weight:700;font-size:1rem;}
.box__ask{font-size:.92rem;color:var(--meta);}
.rules{margin:1.1rem 0 0;padding:.9rem 1rem .9rem 2rem;background:var(--fill);border-radius:8px;font-size:.92rem;}
.rules li+li{margin-top:.5rem;}
.notsure{margin-top:.8rem;min-height:44px;}

.person p{margin-bottom:.6rem;}
.person ol{margin:0 0 .8rem 1.3rem;}
.person li{margin-bottom:.4rem;}

.two{background:var(--fill);}
.two__eyebrow{font-family:"Montserrat";font-weight:700;font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:var(--meta);margin-bottom:.3rem;}
.two .lbl{font-weight:500;margin-top:.2rem;}

/* ---------- Locked fields ---------- */
.field--locked{padding-block:clamp(28px,4vw,44px);background:var(--fill);}
.locked{display:flex;gap:1rem;align-items:flex-start;}
.locked__icon{flex:0 0 auto;width:44px;height:44px;border-radius:50%;background:var(--white);border:1px solid var(--hairline);display:flex;align-items:center;justify-content:center;color:var(--meta);}
.locked__icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.field--locked .eyebrow{color:var(--meta);margin-bottom:.3rem;}
.locked__title{font-family:"Montserrat";font-weight:700;font-size:1.15rem;line-height:1.3;color:var(--slate);}
.locked__rec{color:var(--meta);margin-top:.3rem;max-width:var(--measure);}
.locked__when{margin-top:.4rem;font-weight:700;font-size:.92rem;}

/* ---------- Your case ---------- */
.doc{background:var(--white);border:1px solid var(--hairline);border-radius:var(--radius);padding:clamp(1.1rem,3vw,2rem);margin-top:1.4rem;max-width:760px;box-shadow:0 2px 10px rgba(51,63,72,.06);}
.doc__title{font-family:"Montserrat";font-weight:800;font-size:1.3rem;margin-bottom:.6rem;}
.doc__part{font-family:"Montserrat";font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;color:var(--green-text);margin:1.2rem 0 .4rem;border-top:1px solid var(--hairline);padding-top:1rem;}
.doc__sec{margin-bottom:.9rem;}
.doc__sec h4{font-family:"Montserrat";font-weight:700;font-size:1rem;margin-bottom:.2rem;}
.doc__sec p{font-size:.95rem;overflow-wrap:anywhere;white-space:pre-line;}
.doc__empty{color:var(--meta);}
.keep{margin-top:2rem;max-width:760px;}
.keep h3{font-family:"Montserrat";font-weight:700;font-size:1.05rem;margin:1.2rem 0 .6rem;}
.keep__row{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;}
.keep__note{font-size:.92rem;color:var(--meta);margin-bottom:.6rem;}
.keep__status{margin-top:.8rem;font-weight:500;color:var(--green-text);min-height:1.6em;}

/* ---------- Footer ---------- */
.footer{background:var(--slate-deep);color:rgba(255,255,255,.8);padding-block:40px calc(40px + env(safe-area-inset-bottom));}
.footer__brand{display:flex;align-items:center;gap:.85rem;margin-bottom:1.2rem;}
.footer__brand img{height:48px;width:auto;}
.footer__brand span{font-family:"Montserrat";font-weight:600;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:rgba(255,255,255,.7);border-left:1px solid rgba(255,255,255,.25);padding-left:.85rem;line-height:1.3;}
.footer__note{font-size:.85rem;line-height:1.55;color:rgba(255,255,255,.75);max-width:52em;}
.footer__note+.footer__note{margin-top:.6rem;}
.footer__link{color:#fff;}

/* ---------- Save toast ---------- */
.toast{position:fixed;left:50%;bottom:calc(16px + env(safe-area-inset-bottom));transform:translate(-50%,calc(100% + 48px));visibility:hidden;background:var(--slate-deep);color:#fff;font-size:.88rem;padding:.55rem 1rem;border-radius:6px;box-shadow:0 6px 20px rgba(0,0,0,.25);transition:transform .2s ease-out;z-index:60;pointer-events:none;}
.toast.is-on{transform:translate(-50%,0);visibility:visible;}

@media(max-width:600px){
  :root{font-size:17px;}
  .pbhero__bar{font-size:.62rem;}
  .step,.person,.two{padding:1rem;}
  .keep__row .btn{flex:1 1 100%;}
  .stepnav{padding-inline:.6rem;}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}.toast{transition:none;}}

/* ---------- Print: the assembled case only ---------- */
@media print{
  :root{font-size:11pt;}
  body{color:#000;}
  .skip-link,.steps,.howto,#fields,.keep,.toast,.pbhero__media,.pbhero__scrim,.pbhero__bar,.pbhero__back,.pbhero p,.footer{display:none!important;}
  .pbhero{background:none;color:#000;}
  .pbhero__wordmark{display:none;}
  .pbhero__inner{padding:0;}
  .pbhero h1{font-size:18pt;color:#000;}
  .section,.section--fill{padding:0;background:none;border:0;}
  #case .eyebrow,#case .h2,#case .lead{display:none;}
  .doc{border:0;box-shadow:none;padding:0;margin:0;max-width:none;}
  .doc__title{display:none;}
  .doc__sec{break-inside:avoid;}
}

.step__saying{font-style:italic;color:var(--meta);margin:.25rem 0 .75rem;}

.numhint{margin:0 0 .9rem;}
.numhint__row{margin:0 0 .35rem;padding:.55rem .8rem;border-left:4px solid var(--green);background:var(--green-wash);border-radius:4px;font-size:.92rem;}