@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
:root{--navy:#10213b;--blue:#197da0;--cyan:#64cedb;--ink:#172841;--muted:#738195;--line:#e3eaf0;--paper:#f4f8fa}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font:14px/1.65 "Inter",Arial,sans-serif;color:var(--ink)}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}.header{height:78px;position:sticky;top:0;z-index:10;background:#fff;border-bottom:1px solid #e8eef2;display:flex;align-items:center;gap:30px;padding:0 clamp(20px,5vw,80px)}.brand{width:185px;flex:none}.brand img{width:100%;max-height:48px;object-fit:contain;object-position:left}.header nav{display:flex;justify-content:center;align-items:center;gap:clamp(14px,2.2vw,32px);flex:1}.header nav a,.login{font-size:12px;color:#526176;white-space:nowrap}.header nav a:hover,.header nav .active{color:var(--blue)}.actions{display:flex;gap:15px;align-items:center;white-space:nowrap}.btn{display:inline-flex;align-items:center;gap:17px;background:var(--cyan);color:#102b40;padding:13px 19px;border-radius:3px;font-size:12px;font-weight:700;transition:.2s}.btn:hover{transform:translateY(-2px);background:#82dce5}.btn b{font-size:17px}.btn.small{padding:9px 13px}.menu{display:none;border:0;background:transparent;font-size:23px;color:var(--navy)}
.hero{min-height:590px;height:min(67vw,690px);max-height:720px;position:relative;display:flex;align-items:center;padding:60px clamp(25px,9vw,140px);color:white;overflow:hidden;background:#101d33}.hero-bg{position:absolute;inset:0;background:url('assets/shipdesignshipbuilding.jpg') center 47%/cover;animation:zoom 22s ease-in-out infinite alternate}.shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,19,37,.94),rgba(7,19,37,.78) 38%,rgba(7,19,37,.25) 82%),linear-gradient(0deg,rgba(7,19,37,.6),transparent 55%)}@keyframes zoom{to{transform:scale(1.07)}}.hero-copy{position:relative;max-width:620px;z-index:1}.eyebrow{font-size:10px;letter-spacing:.17em;font-weight:700;color:#a7dfe7;display:flex;align-items:center;gap:10px}.eyebrow i{width:26px;height:2px;background:var(--cyan)}.eyebrow.dark{color:#62758a}.eyebrow.dark i{background:var(--blue)}.kicker{margin:23px 0 7px;color:#d0e0e9;font-size:14px}.hero h1{font-size:clamp(40px,5.2vw,68px);line-height:1.06;letter-spacing:-.045em;font-weight:600;margin:0}.hero h1 em,.calendar h2 em,.testimonials h2 em{font-style:normal;color:#76d4df}.intro{max-width:465px;font-size:15px;color:#d0dbe5;line-height:1.8;margin:20px 0 26px}.hero-buttons{display:flex;align-items:center;gap:26px;flex-wrap:wrap}.text-btn{font-size:12px;color:white}.text-btn:hover{color:var(--cyan)}.meta{margin-top:37px;font-size:10px;letter-spacing:.06em;color:#c3d0dc}.hero-count{position:absolute;right:6vw;bottom:34px;font-size:11px;color:#bfccd8}.hero-count b{font-size:18px;color:white}.hero-count span{display:inline-block;width:55px;height:2px;background:linear-gradient(90deg,var(--cyan) 33%,#637286 33%);vertical-align:middle;margin-left:10px}
.intro-strip{display:flex;align-items:center;gap:28px;padding:28px clamp(25px,9vw,140px);background:#f6fafb;border-bottom:1px solid var(--line)}.intro-strip>span{font-size:10px;color:var(--blue);font-weight:700;letter-spacing:.14em;white-space:nowrap}.intro-strip p{margin:0;flex:1;color:#637185;font-size:13px}.intro-strip strong{color:#253a52;font-weight:600}.intro-strip>a,.row-head>a,.more{font-size:11px;white-space:nowrap}.intro-strip>a:hover,.row-head>a:hover,.more:hover{color:var(--blue)}
.section{padding:78px clamp(22px,7vw,108px)}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:22px}.section h2,.section-head h2{font-size:clamp(28px,3.3vw,40px);letter-spacing:-.035em;line-height:1.15;color:var(--navy);margin:12px 0 8px;font-weight:600}.section-head p,.sub{font-size:13px;color:#7b8797;margin:0}.arrows{display:flex;gap:8px}.arrows button{width:39px;height:39px;border-radius:50%;border:1px solid #dce5eb;background:white;color:var(--navy);font-size:18px}.arrows button:hover{background:var(--navy);color:white}.row-head{display:flex;align-items:center;justify-content:space-between;margin:26px 0 14px}.row-head h3{font-size:17px;color:var(--navy);margin:0;font-weight:600}.track{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(240px,1fr);gap:17px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 17px;scrollbar-width:thin;scrollbar-color:#cbd9e0 transparent}.course{border:1px solid #e3eaf0;min-width:0;scroll-snap-align:start;background:white;transition:transform .2s,box-shadow .2s}.course:hover{transform:translateY(-4px);box-shadow:0 14px 30px #10253b17}.photo{height:160px;position:relative;overflow:hidden;background:#e9eff2}.photo img{width:100%;height:100%;object-fit:cover;transition:transform .3s}.course:hover .photo img{transform:scale(1.05)}.photo:after{content:"";position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#07182d88)}.photo label{position:absolute;bottom:12px;left:12px;z-index:1;background:#0d243bd9;color:#e8f6f7;padding:4px 7px;font-size:8px;letter-spacing:.1em}.photo>b{position:absolute;right:12px;top:12px;z-index:1;background:#ffffffed;width:29px;height:29px;border-radius:50%;display:grid;place-items:center;font-size:15px}.course-copy{padding:16px 16px 0}.course-copy small{color:var(--blue);font-size:9px;letter-spacing:.13em;font-weight:700}.course-copy h3{font-size:16px;line-height:1.35;color:var(--navy);margin:7px 0;min-height:44px;font-weight:600}.course-copy p{font-size:11px;color:#7b8796;line-height:1.65;min-height:37px;margin:0 0 15px}.course-copy footer{border-top:1px solid #e8edf1;padding:11px 0;display:flex;justify-content:space-between;font-size:10px;color:#53657a}.course-copy footer strong{font-size:15px;color:var(--blue)}
.calendar{min-height:410px;background:var(--navy);color:white;position:relative;display:grid;grid-template-columns:1fr 1fr;overflow:hidden}.calendar-photo{position:relative;min-height:410px;background:url('assets/shipdesignshipbuilding.jpg') center/cover}.calendar-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#101d3622,#101d36cc)}.calendar-copy{align-self:center;position:relative;margin-left:-65px;padding:60px 45px 65px;max-width:570px}.calendar h2,.testimonials h2{font-size:clamp(32px,3.6vw,45px);line-height:1.12;margin:15px 0;color:white;letter-spacing:-.03em}.calendar-copy p{font-size:13px;color:#c6d3df;line-height:1.8;max-width:390px;margin:0 0 22px}.calendar-mark{position:absolute;right:6vw;bottom:20px;font-size:9px;letter-spacing:.14em;color:#9aafc1}.calendar-mark b{font-size:24px;color:white;letter-spacing:0}
.areas{background:#f5f8fa}.areas h2{margin-top:12px}.area-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 30px;margin-top:27px}.area-grid>a{display:flex;gap:18px;align-items:flex-start;border-top:1px solid #dce5eb;padding:23px 0}.area-grid small{color:var(--blue);font-size:10px;padding-top:5px}.area-grid div{flex:1}.area-grid h3{font-size:17px;color:var(--navy);margin:0 0 4px}.area-grid p{font-size:12px;color:#7b8797;margin:0}.area-grid b{font-size:18px;color:#657f92}.area-grid a:hover b{color:var(--blue)}
.testimonials{background:#11243e;color:white;padding:74px clamp(22px,7vw,108px)}.testimonial-head{display:flex;justify-content:space-between;align-items:flex-end}.testimonials h2{margin-bottom:0}.quotes{margin-top:36px;max-width:930px;min-height:225px}.quote{display:none;grid-template-columns:45px 1fr;gap:17px}.quote.active{display:grid;animation:appear .25s ease}@keyframes appear{from{opacity:.3;transform:translateY(4px)}to{opacity:1;transform:none}}.quote-mark{font:65px/1 Georgia,serif;color:var(--cyan)}blockquote{font-size:clamp(18px,2.1vw,25px);line-height:1.5;margin:3px 0 25px;color:#f2f6fa}.person{display:flex;align-items:center;gap:12px}.person img{width:48px;height:48px;border-radius:50%;object-fit:cover;background:white}.person p{margin:0}.person strong,.person span,.person small{display:block}.person strong{font-size:12px}.person span{font-size:10px;color:#c2cfdb}.person small{font-size:10px;color:#78d3df;margin-top:3px}.dots{display:flex;gap:7px;margin:15px 0 0 62px}.dots button{width:6px;height:6px;border:0;border-radius:10px;background:#50647b;padding:0}.dots button.chosen{width:23px;background:var(--cyan)}
.news .section-head{align-items:center}.news-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:28px}.news-card{display:grid;grid-template-columns:40% 1fr;border:1px solid #e3eaf0;min-height:170px;transition:box-shadow .2s}.news-card:hover{box-shadow:0 10px 25px #10253b12}.news-card img{width:100%;height:100%;min-height:170px;object-fit:cover}.news-card>div{padding:18px}.news-card small{font-size:8px;letter-spacing:.13em;color:var(--blue);font-weight:700}.news-card h3{font-size:14px;line-height:1.45;color:var(--navy);margin:8px 0 14px}.news-card b{font-size:10px;color:#4c657b}
.enquiry{background:#eaf6f8;padding:45px clamp(22px,7vw,108px);display:flex;align-items:center;justify-content:space-between;gap:20px}.enquiry h2{font-size:32px;line-height:1.15;color:var(--navy);margin:11px 0}.enquiry p{font-size:12px;color:#718092;margin:0}.footer{background:#fafcfd;border-top:1px solid #e5edf1}.footer-grid{padding:45px clamp(22px,7vw,108px);display:grid;grid-template-columns:1.6fr 1fr 1fr 1.5fr;gap:32px}.footer-brand>img:first-child{width:175px;max-height:50px;object-fit:contain;object-position:left}.footer p{font-size:11px;color:#7b8795;line-height:1.8;max-width:270px}.footer-brand .anniversary{width:78px;height:78px;object-fit:contain}.footer h3{font-size:12px;color:var(--navy);margin:4px 0 14px}.footer a{display:block;font-size:11px;color:#6e7d8e;margin:8px 0}.footer a:hover{color:var(--blue)}.footer-bottom{padding:16px clamp(22px,7vw,108px);border-top:1px solid #e5edf1;display:flex;justify-content:space-between;gap:15px;font-size:10px;color:#8a96a3}
@media(min-width:1250px){.track{grid-auto-columns:calc((100% - 68px)/4)}}@media(max-width:980px){.header{gap:16px}.brand{width:150px}.header nav{gap:13px}.login{display:none}.track{grid-auto-columns:minmax(235px,31%)}.intro-strip{gap:18px}}@media(max-width:760px){.header{height:70px;padding:0 17px;gap:12px}.brand{width:150px;margin-right:auto}.menu{display:block;order:3}.header nav{display:none;position:absolute;top:70px;left:0;right:0;background:white;border-bottom:1px solid var(--line);padding:18px 23px;flex-direction:column;align-items:flex-start}.header nav.open{display:flex}.actions{margin-left:auto}.actions .btn{padding:9px 12px}.hero{height:590px;min-height:0;padding:45px 24px}.hero h1{font-size:43px}.shade{background:linear-gradient(90deg,#071325eb,#0713258a),linear-gradient(0deg,#07132599,transparent)}.intro-strip{padding:24px;align-items:flex-start;flex-direction:column;gap:10px}.section{padding:55px 21px}.section-head h2,.section h2{font-size:30px}.track{grid-auto-columns:78%}.calendar{grid-template-columns:1fr}.calendar-photo{min-height:210px;max-height:210px}.calendar-photo:after{background:linear-gradient(0deg,#101d36,transparent)}.calendar-copy{margin:0;padding:30px 24px 65px}.calendar h2{font-size:35px}.area-grid{grid-template-columns:1fr}.testimonials{padding:55px 21px}.testimonial-head{align-items:flex-start}.testimonials h2{font-size:30px}.quotes{min-height:300px}.quote{grid-template-columns:28px 1fr;gap:10px}.quote-mark{font-size:48px}blockquote{font-size:19px}.person img{width:42px;height:42px}.dots{margin-left:38px}.news-grid{grid-template-columns:1fr}.news-card{grid-template-columns:37% 1fr}.news-card>div{padding:13px}.news-card h3{font-size:13px}.enquiry{padding:35px 23px;align-items:flex-start;flex-direction:column}.enquiry h2{font-size:29px}.footer-grid{grid-template-columns:1fr 1fr;padding:36px 23px;gap:22px}.footer-brand{grid-column:1/-1}.footer-bottom{padding:15px 23px;flex-direction:column;gap:5px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important;transition:none!important}}


/* Version 1 refinement: professional maritime training, Inter typography, lighter eDash-friendly palette */
body { font-size: 16px; line-height: 1.65; }
.header nav a, .login { font-size: 14px; }
.btn { font-size: 14px; }
.text-btn { font-size: 14px; }
.eyebrow { font-size: 12px; }
.kicker { font-size: 16px; }
.hero { min-height: 520px; height: min(58vw, 620px); max-height: 640px; }
.hero-bg { animation: none; }
.shade {
  background:
    linear-gradient(90deg, rgba(12,35,57,.82) 0%, rgba(12,35,57,.64) 42%, rgba(12,35,57,.16) 100%),
    linear-gradient(0deg, rgba(12,35,57,.22), transparent 58%);
}
.hero h1 { font-size: clamp(42px, 4.8vw, 64px); }
.intro { font-size: 17px; max-width: 520px; }
.meta { font-size: 12px; }
.intro-strip { padding-top: 24px; padding-bottom: 24px; }
.intro-strip > span { font-size: 12px; }
.intro-strip p { font-size: 15px; }
.intro-strip > a, .row-head > a, .more { font-size: 13px; }
.section-head p, .sub { font-size: 16px; }
.row-head h3 { font-size: 19px; }
.track { grid-auto-columns: minmax(255px, 1fr); }
.photo { height: 175px; }
.photo label { font-size: 10px; }
.course-copy { padding: 18px 18px 0; }
.course-copy small { font-size: 11px; }
.course-copy h3 { font-size: 19px; min-height: 52px; }
.course-copy p { font-size: 14px; min-height: 46px; }
.course-copy footer { font-size: 13px; }
.calendar { background: #eaf4f7; color: var(--ink); }
.calendar-photo:after { background: linear-gradient(90deg, rgba(16,29,54,.08), rgba(16,29,54,.22)); }
.calendar-copy { padding-top: 54px; padding-bottom: 58px; }
.calendar h2 { color: var(--navy); }
.calendar h2 em { color: var(--blue); }
.calendar-copy p { color: #52677a; font-size: 16px; }
.calendar .eyebrow { color: #52677a; }
.calendar-mark { color: #536a7e; }
.calendar-mark b { color: var(--navy); }
.areas { background: #f5f8fa; }
.area-grid h3 { font-size: 19px; }
.area-grid p { font-size: 15px; }
.testimonials { background: #edf5f8; color: var(--ink); }
.testimonials h2 { color: var(--navy); }
.testimonials h2 em { color: var(--blue); }
blockquote { color: #30465c; font-size: clamp(19px, 2vw, 25px); }
.person strong { font-size: 14px; color: var(--navy); }
.person span { font-size: 13px; color: #5e7184; }
.person small { font-size: 12px; color: var(--blue); }
.quote-mark { color: var(--blue); }
.dots button { background: #a7bac7; }
.dots button.chosen { background: var(--blue); }
.news-card small { font-size: 10px; }
.news-card h3 { font-size: 17px; }
.news-card b { font-size: 13px; }
.enquiry h2 { font-size: 36px; }
.enquiry p { font-size: 15px; }
.footer p { font-size: 13px; }
.footer h3 { font-size: 14px; }
.footer a { font-size: 13px; }
.footer-bottom { font-size: 12px; }
@media (max-width: 760px) {
  .hero { min-height: 500px; height: auto; padding-top: 65px; padding-bottom: 65px; }
  .hero h1 { font-size: clamp(38px, 9vw, 52px); }
  .intro { font-size: 16px; }
  .intro-strip p { font-size: 14px; }
  .section-head p, .sub { font-size: 15px; }
  .track { grid-auto-columns: minmax(245px, 82vw); }
  .calendar-copy { margin-left: 0; padding: 35px 25px 70px; }
  .calendar-copy p { font-size: 15px; }
  .area-grid p { font-size: 14px; }
  .footer p, .footer a { font-size: 13px; }
}


/* Final eDash-aligned refinement: functional hero carousel and course rail */
.hero { padding: 0; display: block; }
.hero-slides, .hero-slide { position: absolute; inset: 0; }
.hero-slide { display: flex; align-items: center; padding: 60px clamp(25px, 9vw, 140px); opacity: 0; visibility: hidden; transition: opacity .45s ease, visibility .45s; }
.hero-slide.active { opacity: 1; visibility: visible; z-index: 1; }
.hero-slide .hero-bg { position: absolute; inset: 0; background-position: center 47%; background-size: cover; background-repeat: no-repeat; }
.hero-slide .shade { position: absolute; inset: 0; }
.hero-slide .hero-copy { position: relative; z-index: 1; }
.hero-controls { position: absolute; z-index: 3; right: clamp(22px, 6vw, 90px); bottom: 26px; display: flex; align-items: center; gap: 12px; }
.hero-controls > button { width: 34px; height: 34px; border-radius: 50%; border: 1px solid rgba(255,255,255,.65); background: rgba(255,255,255,.94); color: var(--navy); font-size: 17px; }
.hero-controls > button:hover, .hero-controls > button:focus-visible { background: var(--cyan); }
.hero-count { position: static; color: #eef5f8; font-size: 12px; min-width: 56px; text-align: center; }
.hero-count b { font-size: 19px; }
.hero-count span { color: #e0e9ee; font-size: 12px; }
.hero-dots { display: flex; align-items: center; gap: 6px; }
.hero-dots button { width: 7px; height: 7px; padding: 0; border: 0; border-radius: 8px; background: #c2d1dc; }
.hero-dots button.active { width: 22px; background: var(--cyan); }
.hero-slide .hero-copy { max-width: 670px; }
.hero-slide[aria-hidden="true"] .hero-copy a { pointer-events: none; }
.track { grid-auto-columns: minmax(255px, 1fr); scrollbar-width: none; -ms-overflow-style: none; scroll-padding-inline: 2px; overscroll-behavior-x: contain; }
.track::-webkit-scrollbar { display: none; }
.arrows button:disabled { opacity: .35; cursor: default; background: #f7fafb; color: #8c9ba9; }
.arrows button:disabled:hover { background: #f7fafb; color: #8c9ba9; }
.course { height: 100%; display: flex; flex-direction: column; }
.course-copy { display: flex; flex: 1; flex-direction: column; }
.course-copy footer { margin-top: auto; }
.areas { background: #f5f8fa; }
.area-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.area-grid > a { background: #fff; border: 1px solid #e0e9ee; padding: 22px 18px; gap: 12px; min-height: 150px; transition: box-shadow .2s, transform .2s; }
.area-grid > a:hover { transform: translateY(-2px); box-shadow: 0 8px 24px #10253b0d; }
.area-grid > a > div { min-width: 0; }
.area-grid h3 { font-size: 17px; }
.area-grid p { font-size: 14px; }
.calendar { border-top: 1px solid #e3edf1; border-bottom: 1px solid #e3edf1; }
.testimonials { background: #edf5f8; color: var(--ink); }
.testimonials h2 { color: var(--navy); }
.testimonials h2 em { color: var(--blue); }
blockquote { color: #30465c; }
.person strong { color: var(--navy); }
.person span { color: #5e7184; }
.person small { color: var(--blue); }
.quote-mark { color: var(--blue); }
.dots button { background: #a7bac7; }
.dots button.chosen { background: var(--blue); }
@media (min-width: 1250px) { .track { grid-auto-columns: calc((100% - 51px) / 4); } }
@media (max-width: 980px) {
  .area-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero-slide { padding-left: clamp(25px, 6vw, 70px); padding-right: clamp(25px, 6vw, 70px); }
}
@media (max-width: 760px) {
  .hero { height: 590px; min-height: 0; }
  .hero-slide { padding: 45px 24px 80px; }
  .hero-slide .hero-copy { max-width: 100%; }
  .hero-controls { right: 18px; bottom: 16px; gap: 7px; }
  .hero-controls > button { width: 30px; height: 30px; }
  .hero-count b { font-size: 17px; }
  .hero-dots { gap: 4px; }
  .track { grid-auto-columns: minmax(245px, 82vw); }
  .area-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-slide { transition: none; }
  .course, .area-grid > a { transition: none; }
}

/* Keep the hero counter's total as text, not the decorative progress line used in Version 1. */
.hero-count span { display: inline; width: auto; height: auto; background: none; vertical-align: baseline; margin: 0; color: #e0e9ee; }


/* Alternate dark concept: Netflix-inspired dark surfaces, retaining eDash blue/cyan accents and layout */
:root {
  --navy: #eaf2f8;
  --blue: #2699bd;
  --cyan: #64cedb;
  --ink: #e6eef5;
  --muted: #a6b5c4;
  --line: #2b4054;
  --paper: #0b1725;
}
html, body { background: #0b1725; color: #e6eef5; }
body { color: #e6eef5; }
.header { background: #0c1a2a; border-bottom-color: #263a4d; box-shadow: 0 2px 14px rgba(0,0,0,.16); }
.header nav a, .login { color: #c2d0dc; }
.header nav a:hover, .header nav .active { color: var(--cyan); }
.menu { color: #eaf2f8; }
.btn { background: var(--cyan); color: #092238; }
.btn:hover { background: #83dce5; }
.hero { background: #0b1725; }
.hero-slide .shade {
  background: linear-gradient(90deg, rgba(7,18,31,.92), rgba(7,18,31,.76) 40%, rgba(7,18,31,.35) 83%),
              linear-gradient(0deg, rgba(7,18,31,.48), transparent 58%);
}
.hero h1 { color: #f2f7fb; }
.hero h1 em { color: #64cedb; }
.hero .kicker, .hero .intro { color: #d0dce6; }
.text-btn { color: #f0f6fa; }
.text-btn:hover { color: var(--cyan); }
.meta { color: #bdcbd7; }
.hero-controls > button { background: #172a3e; color: #f3f8fb; border-color: #466078; }
.hero-controls > button:hover, .hero-controls > button:focus-visible { background: var(--cyan); color: #092238; }
.hero-count { color: #c6d3de; }
.hero-count b { color: #f4f8fb; }
.hero-count span { color: #aabac8; }
.intro-strip { background: #102338; border-bottom-color: #2b4054; }
.intro-strip > span { color: #64cedb; }
.intro-strip p { color: #c0ceda; }
.intro-strip strong { color: #f0f5f9; }
.intro-strip > a, .row-head > a, .more { color: #d4e1eb; }
.intro-strip > a:hover, .row-head > a:hover, .more:hover { color: var(--cyan); }
.section { background: #0b1725; }
.section h2, .section-head h2 { color: #f0f6fa; }
.section-head p, .sub { color: #aab9c7; }
.eyebrow.dark { color: #9cb0c1; }
.eyebrow.dark i { background: var(--cyan); }
.row-head h3 { color: #eaf2f8; }
.arrows button { background: #172a3e; border-color: #344b60; color: #eaf2f8; }
.arrows button:hover { background: var(--cyan); color: #092238; }
.arrows button:disabled, .arrows button:disabled:hover { background: #122235; color: #63778a; border-color: #283d51; }
.course { background: #14263a; border-color: #2b4054; box-shadow: 0 5px 18px rgba(0,0,0,.12); }
.course:hover { border-color: #3e728b; box-shadow: 0 14px 32px rgba(0,0,0,.28); }
.course-copy h3 { color: #f0f6fa; }
.course-copy p { color: #b8c7d4; }
.course-copy small { color: #79d2de; }
.course-copy footer { color: #c8d5df; border-top-color: #2c4257; }
.photo label { background: #153d55; color: #a5edf2; }
.photo b { background: rgba(8,22,36,.85); color: #eff8fb; }
.track { scrollbar-color: #36556a transparent; }
.course-rail-actions { display: flex; align-items: center; gap: 18px; }
.course-rail-actions > a { font-size: 13px; white-space: nowrap; }
.course-rail-actions > a:hover { color: var(--cyan); }
#courseAutoplayToggle { border: 1px solid #344b60; border-radius: 4px; background: #14263a; color: #d8e4ed; padding: 8px 11px; font-size: 12px; }
#courseAutoplayToggle:hover, #courseAutoplayToggle:focus-visible { background: #203b53; border-color: #5b91a6; }
.areas { background: #102338; border-top: 1px solid #263d52; border-bottom: 1px solid #263d52; }
.area-grid > a { background: #14263a; border-color: #2b4054; }
.area-grid > a:hover { box-shadow: 0 8px 24px rgba(0,0,0,.24); border-color: #3d7189; }
.area-grid > a > small { color: #64cedb; }
.area-grid h3 { color: #eff6fa; }
.area-grid p { color: #b5c4d1; }
.area-grid > a > b { color: #73d2de; }
.calendar { background: #102338; border-color: #263d52; }
.calendar-photo:after { background: linear-gradient(90deg, rgba(7,18,31,.36), rgba(7,18,31,.82)); }
.calendar h2 { color: #f1f6fa; }
.calendar h2 em { color: #64cedb; }
.calendar-copy p { color: #c0cfda; }
.calendar .eyebrow { color: #a8bac8; }
.calendar-mark { color: #a9bdcb; }
.calendar-mark b { color: #eaf2f8; }
.testimonials { background: #0d1c2c; color: #e6eef5; border-bottom: 1px solid #263d52; }
.testimonials h2 { color: #f1f6fa; }
.testimonials h2 em { color: #64cedb; }
blockquote { color: #d3dee7; }
.person strong { color: #f1f6fa; }
.person span { color: #aebfcd; }
.person small { color: #64cedb; }
.quote-mark { color: #64cedb; }
.dots button { background: #50677a; }
.dots button.chosen { background: #64cedb; }
.news { background: #0b1725; }
.news-card { background: #14263a; border: 1px solid #2b4054; }
.news-card h3 { color: #edf4f8; }
.news-card small { color: #7dd3df; }
.news-card p { color: #b8c7d4; }
.news-card b { color: #dce8ef; }
.news-card:hover { border-color: #3e728b; box-shadow: 0 12px 28px rgba(0,0,0,.22); }
.enquiry { background: #16344a; color: #eaf2f8; }
.enquiry .eyebrow { color: #a8dce4; }
.enquiry h2 { color: #f3f8fb; }
.enquiry p { color: #c4d3de; }
.footer { background: #081321; color: #c4d1dc; border-top: 1px solid #26394b; }
.footer h3 { color: #eff5f9; }
.footer a { color: #b5c4d0; }
.footer a:hover { color: #64cedb; }
.footer p { color: #a8b8c6; }
.footer-bottom { border-top-color: #26394b; color: #91a4b4; }
@media (max-width: 760px) {
  .header nav { background: #0c1a2a; border-color: #263a4d; }
  .course-rail-actions { gap: 9px; flex-wrap: wrap; justify-content: flex-end; }
  .course-rail-actions > a { font-size: 12px; }
  #courseAutoplayToggle { padding: 7px 9px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .hero-slide { transition: none; }
}


/* Gradient refinement inspired by eDash: indigo foundations with blue-violet feature bands */
:root {
  --edash-indigo: #211f3b;
  --edash-violet: #30284d;
  --edash-blue: #3434db;
  --edash-purple: #6538ed;
  --edash-cyan: #64cedb;
}
html, body { background: #211f3b; }
.header { background: #17172d; border-bottom-color: #34304f; }
.hero { position: relative; overflow: hidden; }
.hero-slides { position: absolute; inset: 0; }
.hero-slide { position: absolute; inset: 0; }
.hero-slide .shade {
  background:
    linear-gradient(90deg, rgba(20,18,47,.90) 0%, rgba(27,24,65,.72) 42%, rgba(27,24,65,.22) 100%),
    linear-gradient(0deg, rgba(19,17,43,.55), transparent 60%);
}
.hero h1 em { color: #8c83ff; }
.hero .eyebrow i { background: linear-gradient(90deg, #3434db, #8b55f6); }
.btn { background: linear-gradient(105deg, #3434db 0%, #6538ed 100%); color: #fff; }
.btn:hover { background: linear-gradient(105deg, #4949e9 0%, #7b51f4 100%); }
.hero-controls > button:hover, .hero-controls > button:focus-visible { background: linear-gradient(120deg, #3434db, #6538ed); color: #fff; }
.hero-dots button.active { background: linear-gradient(90deg, #3434db, #8a5cf6); }
.intro-strip { background: linear-gradient(105deg, #29244a 0%, #32255b 58%, #3b2b70 100%); border-color: #403565; }
.section { background: #211f3b; }
.courses { background: #211f3b; }
.course { background: linear-gradient(155deg, #30284d 0%, #292441 100%); border-color: #40365f; }
.course:hover { border-color: #7866ef; box-shadow: 0 14px 32px rgba(9,6,32,.42), 0 0 0 1px rgba(119,97,239,.14); }
.photo label { background: linear-gradient(105deg, #3434db, #6538ed); color: #fff; }
.photo b { background: rgba(28,24,58,.92); }
.arrows button:hover { background: linear-gradient(120deg, #3434db, #6538ed); color: #fff; }
.areas {
  background: linear-gradient(108deg, #3434db 0%, #4d38e8 48%, #6538ed 100%);
  border: 0;
}
.areas .eyebrow.dark, .areas .section-head p { color: #e2ddff; }
.areas .eyebrow.dark i { background: #8ee8f0; }
.areas .section-head h2, .areas h2 { color: #fff; }
.area-grid > a {
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.20);
  box-shadow: 0 8px 24px rgba(20,10,88,.10);
  backdrop-filter: blur(4px);
}
.area-grid > a:hover { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.42); }
.area-grid h3, .area-grid p, .area-grid > a > b, .area-grid > a > small { color: #fff; }
.calendar { background: #292542; border-color: #40365f; }
.calendar h2 em { color: #8b83ff; }
.testimonials { background: linear-gradient(135deg, #211f3b 0%, #29234b 55%, #302455 100%); border-bottom-color: #40365f; }
.quote-mark { color: #8d7aff; }
.dots button.chosen { background: linear-gradient(90deg, #3434db, #8b55f6); }
.news { background: #211f3b; }
.news-card { background: #30284d; border-color: #40365f; }
.news-card:hover { border-color: #7664e8; box-shadow: 0 12px 28px rgba(7,5,26,.32); }
.news-card small { color: #9b8dff; }
.enquiry { background: linear-gradient(105deg, #3434db 0%, #6538ed 100%); color: #fff; }
.enquiry .eyebrow, .enquiry p { color: #e7e2ff; }
.enquiry h2 { color: #fff; }
.enquiry .btn { background: #fff; color: #30284d; }
.footer { background: #17172d; border-top-color: #383252; }
.footer-bottom { border-top-color: #383252; }
.row-head > a, .intro-strip > a, .more { color: #c9c1ff; }
.row-head > a:hover, .intro-strip > a:hover, .more:hover { color: #8ee8f0; }
.track { scroll-behavior: smooth; scroll-snap-type: x mandatory; }
.course { scroll-snap-align: start; }
@media (prefers-reduced-motion: reduce) {
  .track { scroll-behavior: auto; }
}


/* Palette refinement after comparing the current preview with the eDash reference:
   richer red-violet-indigo gradients, less grey-blue wash, and selective gradient bands. */
:root {
  --edash-red: #f02d50;
  --edash-red-deep: #c91f55;
  --edash-violet: #6639ed;
  --edash-indigo: #282b9b;
  --edash-night: #19172f;
  --edash-surface: #292441;
}

/* Keep the maritime photo legible; use a richer red-indigo wash on the text side. */
.header { background: #17152d; border-bottom-color: #3c294d; }
.hero { background: #19172f; }
.hero-slide .shade {
  background:
    linear-gradient(104deg,
      rgba(37, 23, 66, .97) 0%,
      rgba(75, 28, 91, .88) 24%,
      rgba(50, 31, 111, .70) 49%,
      rgba(31, 35, 104, .34) 76%,
      rgba(25, 23, 59, .24) 100%),
    linear-gradient(0deg, rgba(20, 18, 43, .50), transparent 58%);
}
.hero h1 em { color: #a69aff; }
.hero .eyebrow i { background: linear-gradient(90deg, var(--edash-red), var(--edash-violet)); }
.btn {
  background: linear-gradient(108deg, var(--edash-red) 0%, #8736d9 48%, var(--edash-indigo) 100%);
  color: #fff;
}
.btn:hover {
  background: linear-gradient(108deg, #ff4262 0%, #954af0 48%, #393dc5 100%);
}
.hero-controls > button:hover, .hero-controls > button:focus-visible {
  background: linear-gradient(120deg, var(--edash-red), var(--edash-violet), var(--edash-indigo));
  color: #fff;
}
.hero-dots button.active { background: linear-gradient(90deg, var(--edash-red), var(--edash-violet), var(--edash-indigo)); }

/* Intro strip: distinct, saturated eDash-like transition between hero and courses. */
.intro-strip {
  background: linear-gradient(105deg, #39204f 0%, #4b286f 28%, #4130a7 67%, #3034a8 100%);
  border-color: #563a85;
}
.intro-strip > span { color: #ff8ea2; }
.intro-strip strong { color: #fff; }

/* Courses remain dark and readable; add visible red/violet cues instead of blue-only accents. */
.section, .courses, .news { background: #211e39; }
.course {
  background: linear-gradient(155deg, #302744 0%, #28233f 100%);
  border-color: #463354;
}
.course:hover {
  border-color: #a14be5;
  box-shadow: 0 14px 32px rgba(8, 5, 28, .42), 0 0 0 1px rgba(240, 45, 80, .17);
}
.photo label { background: linear-gradient(105deg, var(--edash-red), #8b35d8 52%, var(--edash-indigo)); color: #fff; }
.arrows button:hover { background: linear-gradient(120deg, var(--edash-red), var(--edash-violet)); color: #fff; }
.row-head > a, .intro-strip > a, .more { color: #d8c8ff; }
.row-head > a:hover, .intro-strip > a:hover, .more:hover { color: #ff8ea2; }

/* Feature band is intentionally the strongest red-indigo gradient on the page. */
.areas {
  background: linear-gradient(112deg,
    #e92d55 0%,
    #b42ed1 26%,
    #6938e9 58%,
    #3433c8 100%);
  border: 0;
}
.areas .eyebrow.dark, .areas .section-head p { color: #fff0f5; }
.areas .eyebrow.dark i { background: #fff; }
.areas .section-head h2, .areas h2 { color: #fff; }
.area-grid > a {
  background: rgba(24, 19, 62, .22);
  border: 1px solid rgba(255, 255, 255, .25);
  box-shadow: 0 8px 24px rgba(34, 9, 65, .14);
  backdrop-filter: blur(4px);
}
.area-grid > a:hover { background: rgba(255, 255, 255, .13); border-color: rgba(255, 255, 255, .52); }
.area-grid h3, .area-grid p, .area-grid > a > b, .area-grid > a > small { color: #fff; }

/* Keep other sections dark but vary the undertone so the page doesn't look flat. */
.calendar { background: linear-gradient(115deg, #29213f, #29264f); border-color: #4d345f; }
.calendar h2 em { color: #ff7f9b; }
.testimonials { background: linear-gradient(125deg, #201d39 0%, #2d2048 52%, #35245d 100%); border-bottom-color: #49345f; }
.quote-mark { color: #ff6f8c; }
.dots button.chosen { background: linear-gradient(90deg, var(--edash-red), var(--edash-violet)); }
.news-card { background: linear-gradient(155deg, #302744 0%, #29223f 100%); border-color: #463354; }
.news-card:hover { border-color: #9b4bde; box-shadow: 0 12px 28px rgba(7, 5, 26, .32); }
.news-card small { color: #ff8ca4; }

/* Strong gradient enquiry band with a clear CTA; footer stays quiet and dark. */
.enquiry {
  background: linear-gradient(108deg, #e92d55 0%, #9a32d8 42%, #3935c9 100%);
  color: #fff;
}
.enquiry .eyebrow, .enquiry p { color: #fff0f5; }
.enquiry h2 { color: #fff; }
.enquiry .btn { background: #fff; color: #35234e; }
.enquiry .btn:hover { background: #f4efff; }
.footer { background: #17152d; border-top-color: #3b2b4d; }
.footer-bottom { border-top-color: #3b2b4d; }

/* Small coral accents balance the purple palette without making the UI neon. */
.course-copy small, .meta { color: #ff91a7; }
.area-grid > a > small { color: #fff; }
@media (max-width: 760px) {
  .hero-slide .shade {
    background:
      linear-gradient(100deg, rgba(37, 23, 66, .94), rgba(60, 28, 91, .78) 58%, rgba(31, 35, 104, .50)),
      linear-gradient(0deg, rgba(20, 18, 43, .48), transparent 60%);
  }
}


/* Final eDash-aligned finishing pass: solid typography and consistent button treatments. */
/* Heading text remains white; colour accents belong to backgrounds/buttons, not the lettering. */
.hero h1,
.hero h1 em,
.section h2,
.section h2 em,
.calendar h2,
.calendar h2 em,
.testimonials h2,
.testimonials h2 em,
.enquiry h2,
.enquiry h2 em {
  color: #ffffff !important;
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
}

/* Primary action buttons: solid eDash-inspired coral/red, no gradient or glow. */
.btn,
.header .btn,
.enquiry .btn {
  background: #f52e45 !important;
  background-image: none !important;
  color: #ffffff !important;
  border: 1px solid #f52e45 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
}
.btn:hover,
.header .btn:hover,
.enquiry .btn:hover {
  background: #d9233a !important;
  background-image: none !important;
  color: #ffffff !important;
  border-color: #d9233a !important;
  box-shadow: none !important;
}
.btn:focus-visible,
.header .btn:focus-visible,
.enquiry .btn:focus-visible {
  outline: 3px solid #ffffff;
  outline-offset: 3px;
}

/* Secondary actions use the understated text/outline treatment. */
.text-btn {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.45);
  box-shadow: none !important;
  color: #ffffff !important;
}
.text-btn:hover {
  background: rgba(255,255,255,.08) !important;
  border-color: #ffffff;
  color: #ffffff !important;
}
.hero .text-btn { padding: 14px 18px; border-radius: 4px; }

/* Keep the eDash-inspired gradient treatment on selected section backgrounds only. */
.intro-strip,
.areas,
.enquiry {
  background-image: linear-gradient(108deg, #e92d55 0%, #8e32c8 48%, #3433c8 100%);
}
.areas .section-head h2,
.areas .section-head p,
.areas .area-grid h3,
.areas .area-grid p,
.areas .area-grid > a > small,
.areas .area-grid > a > b {
  color: #ffffff;
}

/* Do not apply gradient colour to course titles, labels, links or body copy. */
.course-copy h3,
.course-copy p,
.row-head h3,
.section-head h2,
.news-card h3,
.news-card p,
.news-card b,
.news-card small {
  -webkit-text-fill-color: initial;
  background: none;
}


/* Multi-page prototype styles; retains the source homepage's Inter and eDash-inspired button treatment */
.page-banner{padding:56px clamp(22px,7vw,108px) 52px;background:linear-gradient(115deg,#f4f8fa 0%,#fff 54%,#f1f5fa 100%);border-bottom:1px solid var(--line)}
.breadcrumb{font-size:11px;color:#718096;margin-bottom:20px}.breadcrumb a{color:var(--blue)}
.page-banner h1{font-size:clamp(32px,4vw,48px);letter-spacing:-.04em;line-height:1.12;color:var(--navy);margin:0 0 12px;font-weight:600}
.page-banner p{max-width:760px;font-size:14px;color:#65758a;margin:0}
.catalog-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:28px}
.filters{border:1px solid var(--line);padding:21px;background:#fff;align-self:start}.filters h3{margin:0 0 14px;color:var(--navy);font-size:16px}
.filters label{display:block;font-size:11px;color:#526176;margin:14px 0 6px}
.filters input,.filters select,.searchbar input{width:100%;border:1px solid #d9e2e9;background:#fff;border-radius:3px;padding:11px;font:inherit;font-size:12px;color:var(--ink)}
.filter-chips{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.chip{border:1px solid #d8e3e9;background:#fff;color:#506176;border-radius:3px;padding:7px 11px;font-size:10px;cursor:pointer}
.chip.active,.chip:hover{background:var(--navy);border-color:var(--navy);color:#fff}
.catalog-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}.catalog-top p{font-size:11px;color:#718096;margin:0}.searchbar{max-width:330px;width:100%}
.course-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}
.course-grid .course{display:block}.course-grid .photo{height:145px}.course-grid .course-copy h3{min-height:60px}.course-grid .course-copy p{min-height:55px}
.course[hidden]{display:none!important}.empty-state{padding:30px;text-align:center;border:1px dashed #cdd8e0;color:#718096;grid-column:1/-1}
.detail-hero{background:linear-gradient(115deg,#101d33 0%,#1d2c4c 58%,#30214b 100%);color:white;padding:46px clamp(22px,7vw,108px);display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);gap:40px;align-items:center}
.detail-hero .breadcrumb{color:#c6d3e0}.detail-hero .breadcrumb a{color:#72d4df}.detail-hero h1{font-size:clamp(32px,4.1vw,50px);line-height:1.12;letter-spacing:-.04em;margin:12px 0 15px;font-weight:600}
.detail-hero .detail-lead{font-size:14px;color:#d3dce6;max-width:700px}.detail-image{width:100%;height:270px;object-fit:cover;border-radius:3px}
.detail-tags{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}.detail-tags span{font-size:9px;border:1px solid #526780;border-radius:2px;padding:6px 9px;color:#e1eaf2;letter-spacing:.04em}
.detail-actions{display:flex;gap:13px;align-items:center;flex-wrap:wrap;margin-top:23px}.btn-outline{display:inline-flex;align-items:center;padding:12px 18px;border:1px solid #91a4b8;color:white;border-radius:3px;font-size:11px;font-weight:600}
.detail-body{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:32px}
.content-panel{border:1px solid var(--line);padding:27px;background:#fff;margin-bottom:19px}.content-panel h2{font-size:22px;color:var(--navy);margin:0 0 14px}.content-panel h3{font-size:15px;color:var(--navy);margin:22px 0 8px}
.content-panel p,.content-panel li{font-size:12px;color:#64748b;line-height:1.85}
.course-summary{border:1px solid var(--line);padding:23px;background:#f6fafb;align-self:start}.course-summary h3{font-size:17px;color:var(--navy);margin:0 0 15px}
.summary-row{padding:12px 0;border-bottom:1px solid #e1e8ed;display:flex;justify-content:space-between;gap:12px;font-size:11px}.summary-row span{color:#758398}.summary-row strong{text-align:right;color:#263b53;font-weight:600}
.site-footer{background:#101d33;color:#d5dfe8;padding:43px clamp(22px,7vw,108px);display:grid;grid-template-columns:2fr 1fr 1fr;gap:34px}
.site-footer>div{display:flex;flex-direction:column;align-items:flex-start;gap:9px}.site-footer p{max-width:340px;font-size:11px;color:#aab8c8}.site-footer strong{color:white;font-size:12px;margin-bottom:6px}.site-footer a{font-size:11px;color:#c0cbd7}.site-footer a:hover{color:#65d0dd}
.footer-logo{max-width:180px;max-height:45px;object-fit:contain;background:#fff}.copyright{background:#0b1627;color:#9eafc1;text-align:center;font-size:10px;padding:13px}
@media(max-width:1000px){.catalog-layout{grid-template-columns:1fr}.filters{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;align-items:end}.filters h3{grid-column:1/-1}.course-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.detail-hero{grid-template-columns:1fr}.detail-image{height:250px}.detail-body{grid-template-columns:1fr}.course-summary{order:-1}}
@media(max-width:650px){.filters{display:block}.course-grid{grid-template-columns:1fr}.catalog-top{align-items:flex-start;flex-direction:column}.searchbar{max-width:none}.site-footer{grid-template-columns:1fr}.detail-hero{padding-top:34px;padding-bottom:34px}.detail-image{height:205px}.content-panel{padding:19px}}


/* Accessibility/contrast correction for the light content panels inside the dark theme.
   The dark theme overrides global palette variables, so light panels must use explicit
   dark text colours rather than the light-valued --navy / --ink variables. */
.page-banner {
  background: linear-gradient(115deg, #f4f8fa 0%, #ffffff 54%, #f1f5fa 100%);
  color: #172841;
}
.page-banner h1 { color: #172841 !important; }
.page-banner p { color: #526176 !important; }
.page-banner .breadcrumb { color: #65758a !important; }
.page-banner .breadcrumb a { color: #197da0 !important; }

.filters {
  background: #ffffff !important;
  border-color: #dce5eb !important;
  color: #172841 !important;
}
.filters h3 { color: #172841 !important; }
.filters label { color: #526176 !important; }
.filters input,
.filters select,
.searchbar input {
  background: #ffffff !important;
  color: #263b53 !important;
  border-color: #cbd8e2 !important;
}
.filters input::placeholder,
.searchbar input::placeholder { color: #738195 !important; opacity: 1; }
.chip {
  background: #ffffff;
  color: #526176;
  border-color: #d8e3e9;
}
.chip.active,
.chip:hover {
  background: #211f3b !important;
  border-color: #211f3b !important;
  color: #ffffff !important;
}
.catalog-top p,
.empty-state { color: #65758a !important; }

.content-panel {
  background: #ffffff !important;
  color: #263b53 !important;
  border-color: #dce5eb !important;
}
.content-panel h2,
.content-panel h3 { color: #172841 !important; }
.content-panel p,
.content-panel li { color: #526176 !important; }
.course-summary {
  background: #f6fafb !important;
  color: #263b53 !important;
  border-color: #dce5eb !important;
}
.course-summary h3 { color: #172841 !important; }
.summary-row { border-bottom-color: #dce5eb !important; }
.summary-row span { color: #65758a !important; }
.summary-row strong { color: #263b53 !important; }

@media (max-width: 760px) {
  .filters { background: #ffffff !important; }
}