/* Technique: Focus Frame by Izzy, Framer Marketplace (Free, Limited licence) https://www.framer.com/marketplace/components/focus-frame/ */
/* Technique: Spotlight Bento Grid by Omer Mirza, Framer Marketplace (Free, Limited licence) https://www.framer.com/marketplace/components/spotlight-bento-grid/ */
/* Technique: Chapters Timeline by Framer, Framer Marketplace (Free, Limited licence) https://www.framer.com/marketplace/components/chapters-timeline/ */
/* Technique: Modern FAQ Accordion by Andrzej Gawłowski, Framer Marketplace (Free, Limited licence) https://www.framer.com/marketplace/components/modern-faq-accordion/ */
/* Layout refs (structure only, no template code/copy/images): Lessonring template by John Nicholson; Codepunk template by Dream Studio; Scribbled template by Suraj Kale; Gamekeep template by John Nicholson; DevFolios template by Anayatul Islam; Website Designer template by SoloFoundry; all Framer Marketplace (Free, Limited licence). Full lines: CREDITS.md */
/* people_students_v1 · People > Students (PEOPLE_SPEC_v1 §A + SITE_PAGES_COMMON_v1 + Designer padding rule 06:23; template: study_tour_v1). Layout only: no text, no ::before/::after words (new labels OFF).
   Resource Bank picks per RESOURCE_BANK_PICKS_v1 §3A (code technique only, no preview images, no new art). Credits: CREDITS.md.
   Rhythm: sections 72 desktop / 40 phone; caps met by trimming inner margins; no section edge below 72 / 40. */
main > section.band,main > section.hl-band{padding-top:72px!important;padding-bottom:72px!important}
main > section.hero{padding-top:72px!important;padding-bottom:72px!important}
main .sec-head{margin-bottom:32px}
main .sec-head h2{margin-bottom:0}
main > section > .wrap > :first-child{margin-top:0!important}
main > section.band > .wrap > :last-child,main > section.band > .wrap > :last-child > :last-child,main > section.band > .wrap > :last-child > :last-child > :last-child{margin-bottom:0!important}
main .intro > :first-child{margin-top:0!important}
main figure.photo figcaption:empty{display:none}
h1,h2,h3,h4{text-wrap:balance} main p,main li{text-wrap:pretty}
/* tones: hero/hl white, #3 white, #4 paper, #5 white, #6 paper, #7 WHITE (spec: shows the edge in the 6-7-8 paper run), #8 paper, FAQ white, #10 paper, contact mist */
main > section.ps-white{background:#fff!important}
/* frosted cards (C3) */
main .ps-g4 > li,main .ps-g3 > .card,main .ps-rail > li,main .ps-bento > li,main .ps-pair > li,main .ps-card,main .ps-cta,main #before-you-begin details.qa{
  background:rgba(255,255,255,.66)!important;border:1px solid #D6DCE8!important;border-radius:22px!important;box-shadow:0 8px 24px rgba(20,32,74,.08)!important;
  backdrop-filter:saturate(160%) blur(18px);-webkit-backdrop-filter:saturate(160%) blur(18px)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  main .ps-g4 > li,main .ps-g3 > .card,main .ps-rail > li,main .ps-bento > li,main .ps-pair > li,main .ps-card,main .ps-cta,main #before-you-begin details.qa{background:#fff!important}}
/* focus-frame: outer frame + 8px mat + 1px line, outer radius 22, inner radius 14 (as the component's inner/outer radius pair); warm grade unchanged */
.ps-frame{position:relative;border:1px solid #D6DCE8;border-radius:22px;padding:8px!important;background:rgba(255,255,255,.66);box-shadow:0 8px 24px rgba(20,32,74,.08);overflow:hidden}
.ps-frame img{border-radius:14px;display:block;width:100%}
.ps-courses figure.cv-fig{border:1px solid #D6DCE8;border-radius:18px;padding:8px;background:#fff;overflow:hidden}
.ps-courses figure.cv-fig img{border-radius:12px}
/* 2 · highlights */
.ps-g4{gap:24px!important}
.ps-g4 > li{padding:20px 20px!important}
/* 3 · course cards: cover pinned to the bottom so cards line up */
.ps-courses > .card{display:flex;flex-direction:column;padding:24px 24px 16px!important}
.ps-courses > .card > figure.photo{margin:16px 0 0!important;margin-top:auto!important;padding-top:16px}
.ps-skills > .card{padding:24px!important;display:flex;flex-direction:column;justify-content:center}
main .card > :last-child,.ps-card > :last-child,.ps-cta > :last-child{margin-bottom:0!important}
/* 5 · chapters-timeline rail: live numbers (v-path counters) on a navy line with milestone dots */
ol.ps-rail{border-top:0!important;padding:0!important;margin:0 0 32px!important;position:relative;gap:16px!important}
ol.ps-rail > li{padding:20px!important;min-height:44px;position:relative}
ol.ps-rail > li::before{color:#4A5578!important;font:700 13px/1 var(--font-d)!important;letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px!important}
.ps-process .l-tools{margin:0}
/* 7 · spotlight bento: six title tiles, pointer glow on hover devices only */
ul.ps-bento{list-style:none;padding:0;margin:0 0 24px!important;display:grid;gap:24px}
ul.ps-bento > li,.ps-g4 > li{position:relative;overflow:hidden}
ul.ps-bento > li{padding:28px 24px!important;min-height:44px;display:flex;align-items:center;margin:0!important}
ul.ps-bento > li::after,.ps-g4 > li::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(220px circle at var(--mx,50%) var(--my,50%),rgba(37,54,121,.06),transparent 70%)}
@media (hover:hover) and (min-width:769px){ul.ps-bento:hover > li::after,.ps-g4:hover > li::after{opacity:1}}
html.rm-user ul.ps-bento > li::after,html.rm-user .ps-g4 > li::after{display:none}
@media (prefers-reduced-motion:reduce){ul.ps-bento > li::after,.ps-g4 > li::after{display:none}}
ul.ps-bento > li .li-t{font-size:20px}
#six-pathways .intro > p:last-child{margin:0}
/* 8 · two value cards */
ul.ps-pair{list-style:none;padding:0!important;margin:0!important;display:grid;gap:24px}
ul.ps-pair > li{padding:24px!important;margin:0!important}
ul.ps-pair > li::before{display:none!important}
.ps-card,.ps-cta{padding:24px}
.ps-cta .btn-row{margin-bottom:0}
/* 9 · FAQ rows (modern-faq-accordion skin): row card + plus icon (pure CSS, no text) */
#before-you-begin .faq{display:grid;gap:12px}
#before-you-begin details.qa{padding:0!important;margin:0!important;overflow:hidden}
#before-you-begin details.qa > summary{list-style:none;position:relative;min-height:56px;padding:16px 56px 16px 20px!important;display:flex;align-items:center;cursor:pointer;font-weight:700}
#before-you-begin details.qa > summary::-webkit-details-marker{display:none}
#before-you-begin details.qa > summary::after{content:"";position:absolute;right:20px;top:50%;width:16px;height:16px;margin-top:-8px;
  background:linear-gradient(#253679,#253679) center/16px 2px no-repeat,linear-gradient(#253679,#253679) center/2px 16px no-repeat;transition:transform .3s}
#before-you-begin details.qa[open] > summary::after{transform:rotate(45deg)}
#before-you-begin details.qa .ans{padding:0 20px 16px}
#before-you-begin details.qa .ans > :last-child{margin-bottom:0}
@media (prefers-reduced-motion:reduce){#before-you-begin details.qa > summary::after,ul.ps-bento > li::after{transition:none}}
html.rm-user #before-you-begin details.qa > summary::after{transition:none}
@media (min-width:769px){
  .ps-g4{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .ps-g3{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:24px!important;align-items:stretch;width:100%!important;max-width:none!important}
  main .ps-g3 > .card:last-child{grid-column:auto!important;width:auto!important;justify-self:stretch!important}
  /* 5 · rail 6 across, then text 5 / photo 7 */
  #how-a-project-develops .intro{max-width:none;display:grid;grid-template-columns:5fr 7fr;gap:24px;align-items:center}
  #how-a-project-develops .intro > ol.ps-rail{grid-column:1 / -1;grid-template-columns:repeat(3,minmax(0,1fr))!important}
  ol.ps-rail > li{border-top:2px solid rgba(37,54,121,.35)!important} /* static timeline line (no scroll-linked progress) */
  ol.ps-rail > li > strong{display:block}
  #how-a-project-develops .intro > .photo{margin:0;max-width:none}
  #how-a-project-develops .intro > .photo img{height:340px;object-fit:cover}
  /* 6 · 5/7; 9 · FAQ 5/7; contact 5/7 */
  #human-thinking-comes-first .wrap,#before-you-begin .wrap{display:grid;grid-template-columns:5fr 7fr;gap:24px;align-items:start}
  #contact .wrap{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
  #human-thinking-comes-first .wrap > .sec-head,#before-you-begin .wrap > .sec-head,#contact .wrap > .sec-head{margin-bottom:0}
  #human-thinking-comes-first .intro,#before-you-begin .faq,#contact .intro{max-width:none;margin:0}
  /* 7 · bento 3×2 */
  #six-pathways .intro{max-width:none}
  ul.ps-bento{grid-template-columns:repeat(3,minmax(0,1fr))}
  /* 8 · 6/6 */
  #what-you-get .intro{max-width:none}
  ul.ps-pair{grid-template-columns:1fr 1fr}
  /* 10 · 8-col centred CTA card */
  #your-next-idea-starts-here .wrap > .sec-head{text-align:center;max-width:calc(8/12*100%);margin-left:auto;margin-right:auto}
  .ps-cta{max-width:calc(8/12*100%)!important;margin-left:auto!important;margin-right:auto!important;text-align:center}
  .ps-cta .btn-row{justify-content:center}
}
@media (max-width:768px){
  main > section.band,main > section.hl-band{padding-top:40px!important;padding-bottom:40px!important}
  main > section.hero{padding-top:40px!important;padding-bottom:40px!important}
  main .sec-head{margin-bottom:24px}
    .hero .ps-frame{padding:6px!important}
  .hero .ps-frame img{max-height:260px;object-fit:cover}
  main [data-mobswipe]{align-items:stretch;--mobswipe-w:82%}
  main .ps-g3[data-mobswipe]{width:100%!important;max-width:100%!important}
  main [data-mobswipe] > *{height:auto}
  ul.ps-g4{--mobswipe-w:82%} /* Designer 10:40: content cards 82% */
  ol.ps-rail,ul.ps-bento{--mobswipe-w:40%;margin-bottom:16px!important}
  ol.ps-rail > li,ul.ps-bento > li{min-width:140px!important} /* Designer 10:04: one-word cards 40%, min 140px */
  ol.ps-rail > li strong,ul.ps-bento .li-t{white-space:nowrap}
  main [data-mobswipe]{padding-bottom:12px!important}
  main > section .wrap .mobswipe-dots{margin-bottom:-8px!important}
  .ps-process .photo{margin:16px 0 0!important}
  ul.ps-pair{grid-template-columns:1fr;gap:12px}
  .ps-card,.ps-cta,ul.ps-pair > li{padding:20px!important}
  main .ps-g3 > .card{padding:20px 20px 12px!important}
}
/* inner trims (Designer 06:23): cut text leading at section edges (Chrome text-box) */
main > section.band .sec-head h2{text-box:trim-both cap alphabetic}
main > section.band .wrap p:last-child{text-box:trim-end cap alphabetic}
/* no 56/32 floors: RESOURCE_BANK_PICKS A-sp = 72/40 on every section, fit by trimming inner space only */
/* course cards: the live stretched title link covers the whole card (cover frame sits under it) */
.ps-courses > .card{position:relative}
.ps-courses > .card a.stretch::after{z-index:3;border-radius:22px}
.ps-courses > .card a.stretch:focus-visible{outline:none}
.ps-courses > .card:has(a.stretch:focus-visible){outline:3px solid #253679;outline-offset:3px}
/* live Ted tip (v219 teddy-nudge): taps to 44 (A-tap), page-local override, text and behaviour unchanged */
.tn-ok,.tn-hide{min-height:44px!important;min-width:44px!important;display:inline-flex!important;align-items:center;justify-content:center}
.tn-x{min-width:44px!important;min-height:44px!important}
/* QA M1 (Growth 11:56): the course shelf's 26px bottom pad + 13px shelf made a 170px card-to-heading gap at desktop.
   Shelf now sits right under the cards (pad 13) and the shelf block pulls up 15, so card edge -> next heading = 144. Section padding stays 72. */
@media (min-width:769px){
  main > section.band > .wrap > .ps-courses.grid.shelf,main > section.band > .wrap > :last-child.ps-courses{padding-bottom:13px!important;margin-bottom:-15px!important}
}
/* QA M2 (Growth 11:56): the existing title link's ::after covers the whole card at every width (stated here, not inherited from site.css),
   so the tap target is the full card (>=44). One link per card, nothing else inside to block. Card focus ring as above. */
.ps-courses > .card{position:relative}
.ps-courses > .card a.stretch::after{content:"";position:absolute;inset:0;z-index:3;border-radius:22px}