/* 260820_SecSys lively recruitment visual refresh */
:root {
  --header-height:72px; --content-width:1200px;
  --ink:#12324a; --muted:#587083; --blue:#168fc8; --blue-bright:#087fbe;
  --sky:#69d2f0; --sky-soft:#eaf9ff; --cyan:#63e7ea; --yellow:#ffd83d;
  --pink:#ff648b; --orange:#ff8b55; --cream:#fffaf0; --line:#cce8f2;
  --surface-soft:#f5fbfd; --radius:28px; --shadow-card:0 20px 48px rgba(18,50,74,.12);
}
body { background:var(--surface-soft); color:var(--ink); font-family:"Noto Sans TC", "Microsoft JhengHei", sans-serif; }
body::selection { background:var(--yellow); color:var(--ink); }
.skip-link { position:fixed; z-index:999; top:8px; left:8px; padding:10px 14px; transform:translateY(-150%); background:#fff; color:var(--ink); font-weight:800; }
.skip-link:focus { transform:translateY(0); }
a:focus-visible,button:focus-visible { outline:3px solid var(--yellow); outline-offset:4px; }
.button { display:inline-flex; min-height:58px; align-items:center; justify-content:center; gap:12px; padding:15px 26px; border:2px solid transparent; border-radius:999px; font-size:1.125rem; font-weight:900; box-shadow:0 9px 0 rgba(18,50,74,.14); transition:transform .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease; }
.button:hover { background:var(--ink); color:var(--yellow); transform:translateY(-3px); box-shadow:0 12px 0 rgba(18,50,74,.12); }
.button-primary { background:var(--yellow); color:var(--ink); }
.button-secondary { border-color:#fff; background:#fff; color:var(--blue-bright); }
.button-inverse { border-color:var(--ink); background:#fff; color:var(--ink); }
section.section-host .section-kicker,section.offer-section .section-kicker { color:var(--pink); font-size:.75rem; }
section.section-host .section-title { max-width:900px; color:var(--ink); }
section.section-host .section-lead { max-width:860px; color:var(--muted); }
section.section-host .section-head { text-align:center; }
section.section-host .section-title,section.section-host .section-lead { margin-inline:auto; }
.card-index { margin:0; color:var(--blue-bright); font-size:.9rem; font-weight:600; letter-spacing:.08em; }
.reveal { opacity:1; transform:translateY(24px); transition:transform .65s ease; }
.reveal.is-visible { transform:none; }
header.site-header { position:sticky; z-index:100; top:0; border-bottom:1px solid rgba(18,50,74,.12); background:rgba(255,255,255,.94); color:var(--ink); backdrop-filter:blur(14px); }
header.site-header .nav-inner { display:flex; width:min(1380px,calc(100% - 40px)); min-height:var(--header-height); align-items:center; gap:26px; margin-inline:auto; }
header.site-header .brand { flex:0 0 auto; color:var(--blue-bright); font-weight:900; letter-spacing:.04em; }
header.site-header .brand span { margin-left:8px; color:var(--ink); font-size:.875rem; letter-spacing:0; }
header.site-header nav { display:flex; align-items:center; gap:24px; margin-left:auto; }
header.site-header nav a { padding:8px 10px; border-radius:999px; font-size:.875rem; font-weight:800; transition:background .2s ease,color .2s ease; }
header.site-header nav a:hover { background:var(--ink); color:var(--yellow); }
header.site-header .nav-cta { flex:0 0 auto; padding:9px 18px; border-radius:999px; background:var(--yellow); color:var(--ink); font-weight:900; box-shadow:0 5px 0 rgba(18,50,74,.14); }
header.site-header .nav-cta:hover { background:var(--ink); color:var(--yellow); }
/* 暫停顯示導覽列時，同步取消 sticky 主視覺與錨點的 header 預留高度。 */
html.site-header-hidden { --header-height:0px; }
html.site-header-hidden header.site-header { display:none; }
section.hero-section { position:relative; isolation:isolate; overflow:hidden; background:linear-gradient(110deg,#168dca 0%,#249bd5 56%,#39aede 100%); color:#fff; }
section.hero-section .hero-grid,section.learning-path-section::before { position:absolute; z-index:-1; inset:0; opacity:.28; background-image:linear-gradient(rgba(255,255,255,.46) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.46) 1px,transparent 1px); background-size:44px 44px; }
section.hero-section .hero-grid { z-index:0; opacity:1; background-image:linear-gradient(rgba(255,255,255,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.13) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px); background-size:24px 24px,24px 24px,120px 120px,120px 120px; }
section.hero-section .hero-cyber-icons { position:absolute; z-index:0; inset:0; width:100%; height:100%; color:#fff; opacity:.15; pointer-events:none; }
section.hero-section .hero-cyber-icons .cyber-icon { fill:none; stroke:currentColor; stroke-width:6.5; stroke-linecap:round; stroke-linejoin:round; }
section.hero-section .hero-cyber-icons .cyber-icon path,section.hero-section .hero-cyber-icons .cyber-icon circle,section.hero-section .hero-cyber-icons .cyber-icon rect { vector-effect:non-scaling-stroke; }
section.hero-section .hero-cyber-icons .cyber-icon--shield,section.hero-section .hero-cyber-icons .cyber-icon--circuit { opacity:.8; }
section.hero-section .hero-layout { position:relative; z-index:1; display:grid; width:min(1380px,calc(100% - 40px)); min-height:760px; grid-template-columns:.92fr 1.08fr; align-items:center; gap:60px; margin-inline:auto; padding-block:70px 82px; }
section.hero-section .eyebrow { display:inline-block; margin:0 0 18px; padding:7px 13px; border-radius:999px; background:#fff; color:var(--blue-bright); font-size:.875rem; font-weight:900; letter-spacing:.16em; }


section.hero-section h1 { margin:0; color:#fff; font-size:clamp(2.6rem,4.5vw,4.6rem); line-height:1.28; font-weight:600; letter-spacing:-.04em; -webkit-text-stroke:.65px currentColor; text-shadow:0 4px 0 rgba(18,50,74,.13); }
section.hero-section h1 em { display:inline-block; margin-top:8px; padding:4px 12px 8px; border-radius:12px 28px 12px 12px; background:var(--yellow); color:var(--ink); font-style:normal; white-space:nowrap; text-shadow:none; }
section.hero-section .hero-lead { max-width:660px; margin:26px 0 0; color:#fff; font-size:1.2rem; line-height:1.9; font-weight:400; }
section.hero-section .hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
section.hero-section .hero-stats { display:flex; margin:42px 0 0; }
section.hero-section .hero-stats div { display:flex; width:150px; min-width:118px; min-height:96px; flex:0 1 150px; flex-direction:column; justify-content:center; padding:8px 20px; border-left:3px solid rgba(255,255,255,.82); }
section.hero-section .hero-stats div:first-child { border-left:0; } 



section.hero-section .hero-stats dt { color:#fff; font-size:2.25rem; line-height:1; font-weight:900; }
section.hero-section .hero-stats dd { margin:8px 0 0; color:#fff; font-size:1rem; line-height:1.35; font-weight:400; white-space:nowrap; }
section.hero-section .hero-collage { --student-card-width:280px; --student-card-height:470px; position:relative; min-height:580px; }
section.hero-section .student-slide { position:absolute; z-index:0; inset:0; opacity:0; transition:opacity .72s ease; }
section.hero-section .student-slide.is-active { z-index:1; opacity:1; }
section.hero-section .photo-frame { position:absolute; width:var(--student-card-width); height:var(--student-card-height); overflow:visible; margin:0; border:0; border-radius:120px; }
section.hero-section .photo-frame::before { position:absolute; z-index:0; inset:0; border:7px solid #fff; border-radius:inherit; background:linear-gradient(145deg,rgba(255,255,255,.34),rgba(255,255,255,0) 44%,rgba(18,50,74,.12)),var(--frame-bg); box-shadow:0 28px 48px rgba(7,58,94,.3),0 10px 18px rgba(7,58,94,.2); content:""; }
section.hero-section .photo-frame::after { position:absolute; z-index:3; inset:0; border:7px solid #fff; border-radius:inherit; box-shadow:inset 5px 6px 7px rgba(255,255,255,.2),inset -6px -8px 9px rgba(18,50,74,.12),inset 0 0 0 2px rgba(255,255,255,.42); pointer-events:none; content:""; }
section.hero-section .student-portrait-clip { position:absolute; z-index:1; inset:0; overflow:hidden; border-radius:inherit; }
section.hero-section .student-portrait { position:absolute; bottom:-2%; left:50%; width:auto; max-width:none; height:115%; object-fit:contain; object-position:center bottom; transform:translateX(-50%); transform-origin:center bottom; }
section.hero-section .student-portrait--head { z-index:4; clip-path:inset(0 0 74% 0); }
section.hero-section .student-portrait--01 { bottom:-16%; left:48%; height:132%; }
section.hero-section .student-portrait--02 { bottom:-16%; height:126%; }
section.hero-section .student-portrait--03 { bottom:-28%; height:142%; }
section.hero-section .student-portrait--04 { bottom:-34%; height:145%; }
section.hero-section .student-portrait--05 { bottom:-16%; height:126%; }
section.hero-section .student-slide--three .photo-frame--one { --frame-bg:var(--pink); z-index:3; top:20%; left:0px; transform:rotate(-.6deg); }
section.hero-section .student-slide--three .photo-frame--two { --frame-bg:var(--yellow); z-index:1; top:2%; left:52%; margin-left:calc(var(--student-card-width) / -2); transform:rotate(.5deg); }
section.hero-section .student-slide--three .photo-frame--three { --frame-bg:#fff7e2; z-index:2; top:22%; right:-20px; transform:rotate(.7deg); }
section.hero-section .student-slide--two .photo-frame--one { --frame-bg:var(--pink); z-index:2; top:16%; left:9%; transform:rotate(-.7deg); }
section.hero-section .student-slide--two .photo-frame--two { --frame-bg:var(--yellow); z-index:3; top:4%; right:9%; transform:rotate(.7deg); }
section.hero-section .hero-marquee { position:absolute; z-index:0; right:0; bottom:0; left:0; overflow:hidden; height:clamp(76px,7.5vw,110px); color:#fff;
   opacity:.10; pointer-events:none; }
section.hero-section .hero-marquee-track { display:flex; align-items:flex-end; width:max-content; min-height:100%; will-change:transform; animation:hero-marquee-scroll 40s linear infinite; }
section.hero-section .hero-marquee-track span { flex:0 0 auto; padding-right:.35em; font-size:clamp(3.5rem,6vw,8rem); line-height:1.12; font-weight:900; letter-spacing:-.035em; white-space:nowrap; }
@keyframes hero-marquee-scroll { from{transform:translate3d(0,0,0)} to{transform:translate3d(-50%,0,0)} }







section.questions-section { background:#fff; }
section.questions-section .photo { border-radius:var(--radius);overflow: hidden; margin: 0 0 30px;height: 480px;}
section.questions-section .photo img{width: 100%;}
section.questions-section .questions-grid { position:absolute; z-index:-1; inset:0; background-image:linear-gradient(rgba(18,50,74,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(18,50,74,.035) 1px,transparent 1px),linear-gradient(rgba(18,50,74,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(18,50,74,.055) 1px,transparent 1px); background-size:24px 24px,24px 24px,120px 120px,120px 120px; }



section.questions-section .question-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
section.questions-section .question-card { min-height:270px; padding:32px; border:2px solid var(--ink); border-radius:var(--radius); background:#fff; box-shadow:8px 8px 0 var(--yellow); }
section.questions-section .question-card:nth-child(2) { box-shadow:8px 8px 0 var(--pink); }
section.questions-section .question-card:nth-child(3) { box-shadow:8px 8px 0 var(--sky); }
section.questions-section .question-card h3 { margin:22px 0 14px; font-size:1.25rem; line-height:1.45; }
section.questions-section .question-card>p:last-child { margin:0; color:var(--muted);font-size:1.125rem; }
section.learning-path-section { background:var(--sky-soft); }
section.learning-path-section::before { opacity:.18; background-image:linear-gradient(rgba(22,143,200,.28) 1px,transparent 1px),linear-gradient(90deg,rgba(22,143,200,.28) 1px,transparent 1px); }
section.learning-path-section .path-summary { display:inline-flex; margin:24px 0 0; padding:10px 18px; border:2px solid var(--ink); border-radius:999px; background:var(--yellow); color:var(--ink); font-weight:400; }
section.learning-path-section .path-list { display:grid; width:min(1120px,100%); margin:48px auto 0; gap:30px; }
section.learning-path-section .path-group { --path-accent:var(--pink); position:relative; display:grid; grid-template-columns:260px minmax(0,1fr); overflow:visible; border:2px solid var(--ink); border-radius:28px; background:rgba(255,255,255,.42); box-shadow:8px 8px 0 rgba(18,50,74,.1);overflow: hidden;  }
section.learning-path-section .path-group--foundation { --path-accent:var(--pink); }
section.learning-path-section .path-group--defense { --path-accent:var(--sky); }
section.learning-path-section .path-group--career { --path-accent:#9dc36f; }
section.learning-path-section .path-group::after { position:absolute; z-index:2; bottom:-46px; left:50%; width:38px; height:38px; background:url("../images/down-arrow.svg") center/contain no-repeat; content:""; transform:translateX(-50%); }


.arrow {width: 50px;margin: 0 auto;}
.arrow img{width: img;}
section.learning-path-section .path-group-label { display:flex; align-items:center; padding:20px; border-radius:25px 0 0 25px; background:var(--path-accent); color:var(--ink); font-size:1.45rem; line-height:1.45; font-weight:600;justify-content: center; }
section.learning-path-section .path-group-cards { display:grid; padding:15px 30px;background-color: #fff;}
section.learning-path-section .path-card { --path-accent:var(--pink); position:relative; display:grid; min-height:140px; grid-template-columns:58px minmax(0,1fr); grid-template-rows:auto auto; column-gap:16px; overflow:visible; border:0; border-bottom:1px solid rgba(18,50,74,.16); border-radius:0; background:transparent; box-shadow:none; }
section.learning-path-section .path-card:last-child { border-bottom:0; }
section.learning-path-section .path-card--foundation { --path-accent:var(--pink); }
section.learning-path-section .path-card--defense { --path-accent:#109dcb; }
section.learning-path-section .path-card--career { --path-accent:#6e9b38; }
section.learning-path-section .path-card-main { display:contents; }
section.learning-path-section .path-icon { display:grid; grid-column:1; grid-row:1 / span 2; width:50px; height:50px; place-items:center; align-self:center; border:0; border-radius:0; background:transparent; box-shadow:none; }
section.learning-path-section .path-icon img { display:block; width:50px; height:50px; }
section.learning-path-section .path-card-main>div { display:block; grid-column:2; grid-row:1; align-self:end; padding:18px 14px 0 0; color:var(--muted); }
section.learning-path-section .path-no,
section.learning-path-section .path-label { display:inline-block; margin:0; padding:3px 6px; background:rgba(29, 66, 95, 0.1); color:inherit; font-size:1rem; line-height:1.3; font-weight:600; vertical-align:middle; white-space:nowrap; }
section.learning-path-section .path-no { display:inline-block; margin:0; padding:3px 0 3px 9px; border-radius:5px 0 0 5px; background:rgba(29, 66, 95, 0.1); color:inherit; font-size:1rem; line-height:1.3; font-weight:600; vertical-align:middle; white-space:nowrap; }
section.learning-path-section .path-no::after { content:" / "; }
section.learning-path-section .path-label { padding-right:9px; border-radius:0 5px 5px 0; letter-spacing:.12em; }
section.learning-path-section .path-card h3 { grid-column:1/-1; margin:8px 0 0; color:var(--path-accent); font-size:1.5rem; line-height:1.4; }
section.learning-path-section .path-card-copy { display:flex; grid-column:2; grid-row:2; align-items:center; padding:8px 14px 18px 0; }
section.learning-path-section .path-card-copy p { margin:0; color:var(--muted); line-height:1.8; font-weight:400; font-size: 1.125rem;}
section.section-host.stories-section { background-color:#168dca; background-image:linear-gradient(rgba(255,255,255,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.13) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(110deg,#168dca 0%,#249bd5 56%,#39aede 100%); background-size:24px 24px,24px 24px,120px 120px,120px 120px,auto; color:#fff; }
section.stories-section .section-head--light .section-title { color:#fff; }
section.stories-section .section-kicker { color:var(--yellow); }
section.stories-section .section-lead { color:rgba(255,255,255,.88); }
@media (min-width:769px) { section.stories-section .section-title { max-width:1120px; white-space:nowrap; } }
section.stories-section .student-stand-row { overflow:visible; margin:18px 0 0; padding:72px 16px 36px; }
section.stories-section .student-stand-track { display:flex; width:100%; max-width:1180px; align-items:flex-start; justify-content:center; margin-inline:auto; padding-inline:8px; }
section.stories-section .student-stand { --stand-bg:var(--pink); --stand-offset:0px; position:relative; z-index:1; display:block; min-width:0; max-width:250px; flex:1 1 0; margin:0; padding:0; border:0; background:transparent; color:#fff; transform:translateY(var(--stand-offset)); }
section.stories-section .student-stand+.student-stand { margin-left:-28px; }
section.stories-section .student-stand:nth-child(odd) { --stand-offset:-20px; }
section.stories-section .student-stand:nth-child(2) { --stand-bg:var(--yellow); --stand-offset:18px; z-index:2; }
section.stories-section .student-stand:nth-child(3) { --stand-bg:var(--sky); --stand-offset:-38px; z-index:3; }
section.stories-section .student-stand:nth-child(4) { --stand-bg:var(--orange); --stand-offset:18px; z-index:2; }
section.stories-section .student-stand:nth-child(5) { --stand-bg:#789653; --stand-offset:-8px; }
section.stories-section .student-stand-frame { position:relative; display:block; overflow:hidden; width:100%; aspect-ratio:.66; margin-inline:auto; padding:0; border:6px solid #fff; border-radius:999px; appearance:none; background:var(--stand-bg); color:inherit; font:inherit; }
section.stories-section .student-stand-trigger { cursor:pointer; }
section.stories-section .student-stand-trigger:hover,section.stories-section .student-stand-trigger[aria-pressed="true"] { box-shadow:0 0 0 5px var(--yellow),0 12px 24px rgba(5,55,91,.3); }
section.stories-section .student-stand-trigger:focus-visible { outline:5px solid var(--yellow); outline-offset:5px; }
section.stories-section .student-stand-frame::after { position:absolute; z-index:2; right:0; bottom:0; left:0; height:40%; background:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,.82)); content:""; pointer-events:none; }
section.stories-section .student-stand-frame img { position:absolute; z-index:1; top:0; left:54%; width:auto; max-width:none; height:120%; transform:translateX(-50%); object-fit:contain; object-position:center top; pointer-events:none; }
section.stories-section .student-stand-name { position:absolute; z-index:3; right:12px; bottom:18px; left:12px; display:block; padding:8px 10px; color:#fff; font-size:1rem; line-height:1.2; font-weight:900; letter-spacing:.08em; text-align:center; text-shadow:0 2px 2px rgba(0,0,0,.95),0 0 7px rgba(0,0,0,.82); }

section.stories-section .story-list { position:relative; width:95%; max-width:1380px; margin-inline:auto; padding:34px 0 44px; }
section.stories-section .story-list.story-list--fallback { display:grid; max-width:1120px; gap:38px; }
section.stories-section .story-list .owl-stage-outer { overflow:hidden; padding:0 0 38px; }
section.stories-section .story-list .owl-stage { display:flex; align-items:stretch; }
section.stories-section .story-list .owl-item { display:flex; opacity:1; transform:none; }
section.stories-section .story-list .owl-item.center { z-index:2; }
section.stories-section .story-list .owl-item>.story-card { width:calc(100% - 4px); height:100%; margin-inline:2px; }
section.stories-section .story-list .owl-nav { position:absolute; z-index:5; top:50%; right:-26px; left:-26px; display:flex; justify-content:space-between; pointer-events:none; transform:translateY(-50%); }
section.stories-section .story-list .owl-nav button { display:grid; width:52px; height:52px; place-items:center; margin:0; border:2px solid #fff; border-radius:50%; background:rgba(5,55,91,.74); color:#fff; font:900 1.45rem/1 Arial,sans-serif; box-shadow:0 5px 0 rgba(18,50,74,.3); cursor:pointer; pointer-events:auto; }
section.stories-section .story-list .owl-nav button:hover { background:var(--yellow); color:var(--ink); }
section.stories-section .story-list .owl-nav button:focus-visible { outline:4px solid var(--yellow); outline-offset:4px; }
section.stories-section .story-list .owl-dots { display:flex; justify-content:center; gap:9px; margin-top:18px; }
section.stories-section .story-list .owl-dot { width:13px; height:13px; padding:0; border:2px solid #fff; border-radius:50%; background:transparent; }
section.stories-section .story-list .owl-dot.active { background:var(--yellow); }
section.stories-section .story-card { position:relative; display:grid; overflow:hidden; min-height:450px; grid-template-columns:minmax(300px,.36fr) minmax(0,.64fr); gap:0; border:2px solid var(--ink); border-radius:48px; background:#fff; color:var(--ink); box-shadow:rgba(18, 50, 74, 0.16) 8px 8px 0px; scroll-margin-top:calc(var(--header-height) + 18px); }
section.stories-section .story-card:focus-visible { outline:5px solid var(--yellow); outline-offset:6px; }
section.stories-section .story-card figure { position:relative; display:flex; width:100%; height:100%; min-height:400px; align-items:flex-end; justify-content:center; overflow:hidden; margin:0; }
section.stories-section .story-card figure::before { display:none; }
section.stories-section .story-card figure img { position:absolute; z-index:1; top:5%; left:50%; width:auto; max-width:none; height:120%; object-fit:contain; object-position:center top; transform:translateX(-50%); }
section.stories-section .story-card--yurou figure { background:var(--pink); }
section.stories-section .story-card--boyuan figure { background:var(--yellow); }
section.stories-section .story-card--group { grid-template-columns:minmax(340px,.4fr) minmax(0,.6fr); }
section.stories-section .story-card--group figure { background:linear-gradient(90deg,var(--sky) 0 50%,var(--orange) 50%); }
section.stories-section .story-card--group figure img { top:0%; left:-18%; width:auto; height:110%; transform:none; }
section.stories-section .story-card--group figure img+img { right:-18%; left:auto; margin-left:0; }
section.stories-section .story-card--text figure { background:#789653; }
section.stories-section .story-body { position:relative; align-self:center; padding:30px; background:#fff; color:var(--ink); }
section.stories-section .story-body::after { display:none; }
section.stories-section .story-meta { margin:8px 0 20px; color:var(--muted); font-size:.9rem; }
section.stories-section .story-card h3 {font-size:1.5rem; line-height:1.2;margin: 0; }
section.stories-section .story-card h4 { margin:10px 0 ;font-size:1.2rem; line-height:1.4;margin: 0; }
section.stories-section .story-card P { font-size:1.125rem;margin: 10px 0;  }
section.stories-section blockquote { margin:0 0 20px; padding:16px 18px; border-left:5px solid var(--pink); background:#fff6d9; font-size:1.2rem; font-weight:600; }
section.stories-section .story-link { display:inline-flex; align-items:center; margin-top:18px; padding:10px 18px; border:2px solid var(--ink); border-radius:999px; background:var(--ink); color:#fff; font-size:1rem; font-weight:800; line-height:1.4; }
section.stories-section .story-link:hover,section.stories-section .story-link:focus-visible { background:var(--yellow); color:var(--ink); text-decoration:none; }
section.support-section { background:#fff; }
section.support-section .support-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
section.support-section .support-card { position:relative; overflow:hidden; min-height:340px; padding:34px; border:2px solid var(--ink); border-radius:18px 48px 18px 18px; background:var(--sky); color:var(--ink); box-shadow:8px 8px 0 rgba(18,50,74,.16); }
section.support-section .support-card:nth-child(2) { background:var(--yellow); }
section.support-section .support-card:nth-child(3) { background:var(--pink); color:var(--ink); }
section.support-section .support-number { position:absolute; right:12px; bottom:-48px; color:rgba(255,255,255,.34); font-size:clamp(3.25rem,11vw,9rem); font-weight:900; }
section.support-section .support-card h3 { position:relative; margin:30px 0 14px; font-size:1.5rem; }
section.support-section .support-card>p:last-child { position:relative; margin:0; color:inherit; }
section.support-section .support-card .card-index { color:var(--ink); }
section.support-section .support-card:nth-child(3) .card-index { color:var(--ink); }
section.offer-section { position:relative; overflow:hidden; padding:104px 0; background:var(--yellow); color:var(--ink); text-align:center; }
section.offer-section::before,section.offer-section::after { position:absolute; border-radius:50%; content:""; }
section.offer-section::before { top:-120px; left:-70px; width:290px; height:290px; background:var(--pink); }
section.offer-section::after { right:-100px; bottom:-160px; width:340px; height:340px; background:var(--sky); }
section.offer-section .offer-layout { position:relative; z-index:1; max-width:920px; }
section.offer-section .section-kicker { color:var(--ink); }
section.offer-section h2 { margin:10px 0 20px; font-size:clamp(2.1rem,4.3vw,4.5rem); line-height:1.2; }
section.offer-section .offer-layout>p:not(.section-kicker) { max-width:720px; margin:0 auto; font-size:1.3rem; }
section.offer-section .offer-actions { display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin-top:30px; }
section.offer-section .button-primary { background:var(--blue-bright); color:#fff; }

@media (min-width:769px) {
  section.hero-section { position:sticky; z-index:0; top:var(--header-height); }
  main>section:not(.hero-section) { position:relative; z-index:1; }
  section.questions-section { box-shadow:0 -18px 36px rgba(18,50,74,.12); }
}
@media (max-width:1024px) {
  section.hero-section .hero-layout { min-height:700px; grid-template-columns:1fr .8fr; gap:24px; }
  section.hero-section .hero-collage { --student-card-width:165px; --student-card-height:270px; min-height:480px; }
  section.learning-path-section .path-card { grid-template-columns:58px minmax(0,1fr); }
  section.learning-path-section .path-icon { width:50px; height:50px; }
  section.learning-path-section .path-icon img { width:42px; height:42px; }
  section.support-section .support-grid { grid-template-columns:1fr; }
  section.support-section .support-card { min-height:250px; }
}
@media (max-width:768px) {
  header.site-header nav { display:none; }
  header.site-header .nav-inner { gap:14px; }
  header.site-header .brand span { display:none; }
  header.site-header .nav-cta { margin-left:auto; }
  section.questions-section .photo { height:auto; }
  section.hero-section .hero-layout { grid-template-columns:1fr; padding-block:54px; }
  section.hero-section .hero-collage { --student-card-width:200px; --student-card-height:320px; min-height:460px; }
  section.hero-section .hero-marquee { bottom:0; height:70px; }
  section.hero-section .hero-marquee-track span { font-size:clamp(2.25rem,10vw,3.25rem); }
  section.questions-section .question-grid { grid-template-columns:1fr; }
  section.questions-section .question-card { min-height:auto; }
  section.learning-path-section .path-card { grid-template-columns:58px minmax(0,1fr); }
  section.learning-path-section .path-card-copy { padding:8px 0 18px; }
  section.stories-section .student-stand-row { display:none; }
  section.stories-section .story-list .owl-stage-outer { padding-block:18px 26px; }
  section.stories-section .story-list .owl-nav { top:198px; right:-8px; left:-8px; }
  section.stories-section .story-list .owl-nav button { width:44px; height:44px; }
  section.stories-section .story-card,section.stories-section .story-card--group,section.stories-section .story-card--text { min-height:0; grid-template-columns:1fr; gap:0; background:#fff; }
  section.stories-section .story-card figure { height:360px; min-height:0; border-bottom:2px solid var(--ink); }
  section.stories-section .story-card--group figure img { left:-20%; height:120%; }
  section.stories-section .story-card--group figure img+img { right:-26%; left:auto; }
  section.stories-section .story-body { padding:38px 28px 42px; }

  section.stories-section .story-card figure img { top: 2%; height: 120%; }


  
  section.support-section .support-number { bottom: 2px; }


  footer#Footer .footer-inner { flex-direction:column; align-items:flex-start; gap:8px; }
  footer#Footer a { margin-left:0; }
}
@media (max-width:480px) {
  section.hero-section h1 { font-size:2.25rem; }
  section.hero-section .hero-stats { display:grid; grid-template-columns:repeat(3,1fr); }
  section.hero-section .hero-stats div { width:auto; min-width:0; padding-inline:8px; }
  section.hero-section .hero-collage { --student-card-width:126px; --student-card-height:220px; min-height:350px; }
  section.hero-section .photo-frame { border-radius:46px; }
  section.hero-section .photo-frame::before,section.hero-section .photo-frame::after { border-width:5px; }
  section.hero-section .student-slide--three .photo-frame--one { top:20%; left:32px; }
  section.hero-section .student-slide--three .photo-frame--two { top:3%; left:50%; }
  section.hero-section .student-slide--three .photo-frame--three { top:22%; right:4px; }
  section.hero-section .student-slide--two .photo-frame--one { top:17%; left:7%; }
  section.hero-section .student-slide--two .photo-frame--two { top:4%; right:7%; }
  section.hero-section .hero-actions .button,section.offer-section .offer-actions .button { width:100%; }
  section.learning-path-section .path-summary { border-radius:14px; font-size:.875rem; }
  section.learning-path-section .path-list { gap:50px; }
  section.learning-path-section .path-group { grid-template-columns:1fr; }
  section.learning-path-section .path-group-label { min-height:72px; padding:18px 22px; border-radius:25px 25px 0 0;}
  section.learning-path-section .path-group-cards { padding:14px; }
  section.learning-path-section .path-card { grid-template-columns:50px minmax(0,1fr); }
  section.learning-path-section .path-card-copy { padding:8px 0 18px; }
  section.stories-section .story-card { border-radius:34px; }
  section.stories-section .story-card figure { height:420px; }
  section.stories-section .story-list .owl-nav { top:270px; }
  section.stories-section .story-body { padding:32px 22px 36px; }
}
@media (prefers-reduced-motion:reduce) { .reveal{opacity:1;transform:none;transition:none} section.stories-section .story-list .owl-item{transition:none} section.hero-section .hero-marquee-track{animation:none;transform:none} }
