/* ===== source: css/hero.css ===== */
/* =========================================================
   HERO - home page hero banner and quick links
   ========================================================= */

/* =========================================================
   HERO
   ========================================================= */

.hero {
    position: relative;
    overflow: hidden;
    color: #fff;
    padding: 70px 0 40px;

    background:
       
        
        url("../../images/hero/security_hero.webp") center top / 100% auto no-repeat;
}
.hero-media {
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 62%;
  -webkit-mask-image: linear-gradient(
    to right,
    transparent,
    #000 30%
  );
  mask-image: linear-gradient(
    to right,
    transparent,
    #000 30%
  );
}

.hero-media .media,
.hero-media .imgreq {
  height: 100%;
  border: 0;
  background: transparent;
}

.hero-media .imgreq {
  justify-content: flex-end;
  padding-right: 12%;
  color: #8a90a0;
}

.hero-in1 {
  position: relative;
  z-index: 1;
}

.hero h1 {
  text-transform: uppercase;
  line-height: 1;
  margin: 14px 0 18px;
}

.hero h1 b {
  color: #ff2b32;
}

.hero-p {
  max-width: 470px;
  color: #d3d7de;
  font-size: 15px;
}

.hero .btns {
  margin: 26px 0 34px;
}

.quick {
  display: flex;
  gap: 30px;
  flex-wrap: wrap;
  font-size: 12px;
}

.quick a {
  color: #d3d7de;
  border-bottom: 2px solid transparent;
  padding: 2px 0;
}

.quick a:hover {
  color: #fff;
  border-color: var(--red);
}

/* ===== source: css/media.css ===== */
/* =========================================================
   MEDIA - image wrappers and [IMAGE REQUIRED] placeholders (shared)
   ========================================================= */

/* =========================================================
   MEDIA
   ========================================================= */

.media {
  position: relative;
  overflow: hidden;
  background: linear-gradient(
    135deg,
    #1b1e26,
    #3a4256
  );
}

.media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s;
}

.imgreq {
  width: 100%;
  height: 100%;
  min-height: 110px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 10px;
  font-size: 11.5px;
  line-height: 1.35;
  color: #b3b8c2;
  border: 0;
}

.imgreq small {
  display: block;
  margin-top: 4px;
  font-size: 10px;
  color: #8a90a0;
  word-break: break-all;
}

/* ===== source: css/courses.css ===== */
/* =========================================================
   COURSES - course grid, course cards, filters, course page content blocks (SIA Courses hub + course pages)
   ========================================================= */

/* =========================================================
   HEADS / FILTERS
   ========================================================= */

.head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 16px;
  flex-wrap: wrap;
}

.filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 4px 0 26px;
}

.filters button {
  border: 1px solid var(--line);
  background: var(--card);
  color: var(--ink);
  border-radius: 4px;
  padding: 8px 14px;
  font: 600 12.5px var(--f-body);
  cursor: pointer;
  display: inline-block;
  transition: .2s;
}

.filters button:hover {
  border-color: var(--red);
}

.filters button.on {
  background: var(--red);
  border-color: var(--red);
  color: #fff;
}

.empty {
  text-align: center;
  color: var(--mut);
  padding: 30px;
}


/* ===== source: css/emergency-premium.css ===== */

:root{--efa-red:#e50914;--efa-black:#0b0b0b;--efa-white:#f7f7f7;--efa-ink:#171717;--efa-gray:#626262}
html:has(.emergency-page){scroll-behavior:smooth;overflow-x:hidden}
.emergency-page{background:#f4f4f4;color:var(--efa-ink);overflow-x:hidden}
.emergency-page .page-head.course-head{position:relative;overflow:hidden;background:linear-gradient(110deg,rgba(0,0,0,.9),rgba(0,0,0,.62)),url('../../images/hero/security_hero.webp') center/cover no-repeat;color:#fff;border-bottom:4px solid var(--efa-red);padding:95px 0}
.emergency-page .page-head.course-head:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(229,9,20,.18),transparent 55%);pointer-events:none}
.emergency-page .page-head .wrap{position:relative;z-index:2}
.emergency-page .page-head h1{font-size:clamp(42px,6vw,74px);letter-spacing:-.04em}
.emergency-page .section{padding:82px 0;background:#f7f7f7}
.emergency-page .section.alt{background:#000000;color:#fff}
.emergency-page .section h2{letter-spacing:-.025em}
.emergency-page .section h2:after{content:'';display:block;width:70px;height:3px;background:var(--efa-red);margin-top:14px;box-shadow:0 0 14px rgba(229,9,20,.45)}
.emergency-page .lead,.emergency-page .section p{color:#666;line-height:1.8}
.emergency-page .section.alt p,.emergency-page .section.alt li{color:#c9c9c9}
.emergency-page .grid3 .card{background:#fff;border:1px solid #ddd;border-radius:16px;box-shadow:0 18px 45px rgba(0,0,0,.08);transition:transform .35s,box-shadow .35s,border-color .35s;overflow:hidden}
.emergency-page .grid3 .card:hover{transform:translateY(-8px);border-color:var(--efa-red);box-shadow:0 24px 55px rgba(0,0,0,.14)}
.emergency-page .badge{background:var(--efa-red)!important;color:#fff!important}
.emergency-page .media{background:#0c0c0c!important;border-radius:18px;overflow:hidden;box-shadow:0 20px 55px rgba(0,0,0,.18);border:1px solid #ddd;padding:8px}
.emergency-page .efa-photo{display:block;width:100%;height:360px;object-fit:cover;border-radius:12px;filter:saturate(.92) contrast(1.06);transition:transform .7s ease,filter .4s ease}
.emergency-page .media:hover .efa-photo{transform:scale(1.045);filter:saturate(1.05) contrast(1.08)}
.emergency-page .tbl-wrap{background:#fff;border:1px solid #ddd;border-radius:16px;overflow:hidden;box-shadow:0 18px 45px rgba(0,0,0,.1)}
.emergency-page .tbl th{background:#111;color:#fff}.emergency-page .tbl td{background:#fff;color:#444}
.emergency-page .section.alt .tbl-wrap{background:#151515;border-color:#333}.emergency-page .section.alt .tbl td{background:#151515;color:#ddd;border-color:#333}.emergency-page .section.alt .tbl th{background:var(--efa-red)}
.emergency-page .faq-item{border:1px solid #ddd!important;background:#fff!important;border-radius:10px!important;margin-bottom:10px;box-shadow:0 8px 24px rgba(0,0,0,.05)}
.emergency-page .faq-item button{font-weight:800;transition:background .25s,color .25s}.emergency-page .faq-item button:hover{background:#111;color:#fff!important}
.emergency-page .ready{background:linear-gradient(110deg,#111,#222 60%,#0a0a0a)!important;color:#fff;border-top:3px solid var(--efa-red)}
.emergency-page .ready p{color:#bbb}

.emergency-page .btn.r {
    background: var(--efa-red) !important;
    
}

.emergency-page .btn.r:hover {
    box-shadow: 0 12px 30px rgba(229, 9, 20, 0.35);
    transform: translateY(-2px);
    transition: all 0.25s ease;
}

/* CENTER BOOKING BUTTON */
.emergency-page .section.alt .center-t {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 0 auto;
}

.emergency-page .section.alt .btn.r {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin: 0 auto;
}

.emergency-page .btn.dark{background:#111!important;color:#fff!important}.emergency-page .btn.dark:hover{background:var(--efa-red)!important}
.emergency-page .eyebrow{color:var(--efa-red)!important;font-weight:900;letter-spacing:.12em}.emergency-page .policy{background:#111}.emergency-page .policy.alt2{background:#050505}
.efa-reveal{opacity:0;transform:translateY(28px);transition:opacity .75s ease,transform .75s ease}.efa-reveal.visible{opacity:1;transform:none}
@media(max-width:700px){.emergency-page .section{padding:60px 0}.emergency-page .page-head.course-head{padding:75px 0 65px}.emergency-page .efa-photo{height:270px}}
@media(prefers-reduced-motion:reduce){.efa-reveal{opacity:1;transform:none;transition:none}.emergency-page .efa-photo,.emergency-page .grid3 .card{transition:none}}



/* ===== Emergency First Aid hero ===== */
.efa-hero{position:relative;overflow:hidden;isolation:isolate;background:#000;color:#fff}
.efa-hero::before{content:"";position:absolute;z-index:-2;right:-10%;top:10%;width:60vw;height:60vw;max-width:760px;max-height:760px;border-radius:50%;background:radial-gradient(circle,rgba(230,10,25,.28),transparent 65%);animation:efaGlow 1.1s ease-in-out infinite}
.efa-hero .two{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}

/* ECG line */
.efa-hero .ecg{position:absolute;z-index:-1;left:0;right:0;bottom:9%;width:100%;height:120px;opacity:.9}
.efa-hero .ecg-line{fill:none;stroke:#e50914;stroke-width:2.5;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:.28 1;stroke-dashoffset:.28;filter:drop-shadow(0 0 6px rgba(229,9,20,.8));animation:efaSweep 3.6s linear 1.2s infinite}

/* Headline */
.efa-hero h1{margin:0 0 20px;line-height:.95}
.efa-hero .ln{display:block;overflow:hidden;padding-bottom:.06em}
.efa-hero .ln>span{display:block;transform:translateY(110%);animation:efaRise .8s cubic-bezier(.2,.8,.2,1) forwards}
.efa-hero .ln:nth-child(1)>span{animation-delay:.1s}
.efa-hero .ln:nth-child(2)>span{animation-delay:.25s;color:#e50914}
.efa-hero .ln:nth-child(3)>span{animation-delay:.4s}

.efa-hero .hero-p,.efa-hero .btns{opacity:0;animation:efaFade .7s ease .85s forwards}
.efa-hero .btns{animation-delay:1s}
.efa-hero .btn.r{transition:transform .2s ease,box-shadow .2s ease}
.efa-hero .btn.r:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(229,9,20,.45)}

/* Photo */
.efa-visual{position:relative}
.efa-hero .media{position:relative;overflow:hidden;border-radius:18px;border:1px solid rgba(255,255,255,.25);transform:rotate(1.5deg);animation:efaTilt 1s ease .3s forwards}
.efa-hero .media::after{content:"";position:absolute;inset:0;background:#251314;transform-origin:right;animation:efaWipe .9s cubic-bezier(.7,0,.2,1) .5s forwards}
.efa-hero .efa-photo{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;transform:scale(1.12);animation:efaZoom 1.8s ease .5s forwards}

/* CPR badge */
.efa-beat{position:absolute;left:-28px;bottom:-22px;display:flex;gap:12px;align-items:center;padding:12px 18px;background:#fff;color:#000;border-radius:12px;font-size:.85rem;line-height:1.25;box-shadow:0 10px 30px rgba(0,0,0,.5);opacity:0;transform:translateY(14px);animation:efaFade .6s ease 1.5s forwards}
.efa-beat b{font-size:1.15rem}
.efa-beat .dot{width:14px;height:14px;border-radius:50%;background:#e50914;animation:efaBeat .545s ease-in-out infinite}

/* Animations */
@keyframes efaRise{to{transform:none}}
@keyframes efaFade{to{opacity:1;transform:none}}
@keyframes efaWipe{to{transform:scaleX(0)}}
@keyframes efaZoom{to{transform:scale(1)}}
@keyframes efaTilt{to{transform:rotate(0)}}
@keyframes efaSweep{from{stroke-dashoffset:.28}to{stroke-dashoffset:-1}}
@keyframes efaGlow{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes efaBeat{0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(229,9,20,.6)}50%{transform:scale(1.25);box-shadow:0 0 0 9px rgba(229,9,20,0)}}

/* Responsive */
@media (max-width:860px){
  .efa-hero .two{grid-template-columns:1fr;gap:36px}
  .efa-beat{left:12px}
  .efa-hero .ecg{bottom:4%;height:80px}
}
@media (prefers-reduced-motion:reduce){
  .efa-hero *,.efa-hero::before{animation:none!important}
  .efa-hero .ln>span,.efa-hero .hero-p,.efa-hero .btns,.efa-beat{opacity:1;transform:none}
  .efa-hero .media::after{display:none}
  .efa-hero .efa-photo{transform:none}
  .efa-hero .ecg-line{stroke-dasharray:none}
}
/* NOTE: delete the old .efa-about / .efa-sia CSS before pasting this */

/* ===== Section 1 : WHITE ===== */
.fa-intro{position:relative;overflow:hidden;background:#f6f6f6;color:#111;padding:90px 0}
.fa-intro-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:50px;padding-bottom:22px;border-bottom:2px solid #111;position:relative}
.fa-intro-head::after{content:"";position:absolute;left:0;bottom:-2px;height:2px;width:100%;background:#e50914;transform-origin:left;animation:faLine 1.2s cubic-bezier(.7,0,.2,1) both}
.fa-intro-head h2{margin:0}
.fa-chip{padding:8px 18px;border:1.5px solid #111;border-radius:50px;font-size:.85rem;font-weight:600}

.fa-intro-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:center}
.fa-photo{position:relative;margin:0}
.fa-photo img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:200px 200px 16px 16px;box-shadow:0 24px 50px rgba(0,0,0,.2)}
.fa-ring{position:absolute;right:-34px;bottom:30px;width:128px;height:128px;border-radius:50%;background:#e50914;color:#fff;display:grid;place-items:center;box-shadow:0 12px 30px rgba(229,9,20,.45)}
.fa-ring svg{position:absolute;inset:0;width:100%;height:100%;animation:faSpin 14s linear infinite}
.fa-ring text{fill:#fff;font-size:11px;font-weight:600}
.fa-plus{position:relative;width:30px;height:30px}
.fa-plus::before,.fa-plus::after{content:"";position:absolute;background:#fff;border-radius:2px}
.fa-plus::before{left:12px;top:0;width:6px;height:30px}
.fa-plus::after{left:0;top:12px;width:30px;height:6px}
.fa-plus{animation:faBeat .9s ease-in-out infinite}

.fa-block{padding:26px 0;border-bottom:1px solid #d9d9d9}
.fa-block:first-child{padding-top:0}
.fa-block:last-child{border-bottom:0}
.fa-block h3{margin:0 0 12px;font-size:1.35rem}
.fa-block p{margin:0;line-height:1.85;color:#333}

.fa-tickets{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:70px}
.fa-ticket{position:relative;display:flex;align-items:center;gap:28px;padding:28px 34px;background:#fff;border:2px solid #111;border-radius:16px;overflow:hidden;transition:transform .35s ease,box-shadow .35s ease,color .35s ease}
.fa-ticket::before{content:"";position:absolute;inset:0;background:#111;transform:translateY(101%);transition:transform .45s cubic-bezier(.7,0,.2,1)}
.fa-ticket>*{position:relative;z-index:1}
.fa-ticket:hover{transform:translateY(-6px);box-shadow:8px 8px 0 #e50914;color:#fff}
.fa-ticket:hover::before{transform:none}
.fa-big{font-size:5.5rem;font-weight:900;line-height:1;color:transparent;-webkit-text-stroke:2px #e50914;padding-right:28px;border-right:2px dashed #bbb}
.fa-ticket:hover .fa-big{color:#e50914}
.fa-ticket h3{margin:0 0 6px;font-size:1.25rem}
.fa-ticket p{margin:0;line-height:1.6;opacity:.8}

/* ===== Section 2 : BLACK ===== */
.fa-sia{position:relative;overflow:hidden;background:#0a0a0a;color:#fff;padding:90px 0}
.fa-sia::before{content:"";position:absolute;left:-150px;top:-150px;width:480px;height:480px;border-radius:50%;background:radial-gradient(circle,rgba(229,9,20,.28),transparent 70%);animation:faGlow 3s ease-in-out infinite;pointer-events:none}
.fa-sia-title{max-width:780px;margin:0 0 60px;font-size:clamp(1.9rem,4vw,3rem);line-height:1.1}
.fa-sia-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:70px;align-items:start}

.fa-steps{position:relative;list-style:none;margin:0;padding:0 0 0 46px}
.fa-steps::before,.fa-steps::after{content:"";position:absolute;left:11px;top:6px;bottom:6px;width:3px;border-radius:3px}
.fa-steps::before{background:rgba(255,255,255,.18)}
.fa-steps::after{background:#e50914;transform-origin:top}
.fa-step{position:relative;margin-bottom:44px}
.fa-step:last-child{margin-bottom:0}
.fa-node{position:absolute;left:-46px;top:2px;width:25px;height:25px;border-radius:50%;background:#0a0a0a;border:3px solid #e50914;box-shadow:0 0 0 6px rgba(229,9,20,.15)}
.fa-node::after{content:"";position:absolute;inset:4px;border-radius:50%;background:#e50914;animation:faBeat 1.1s ease-in-out infinite}
.fa-step h3{margin:0 0 10px;font-size:1.3rem;line-height:1.3}
.fa-step p{margin:0;line-height:1.85;opacity:.82}

.fa-card{position:sticky;top:100px;background:#fff;color:#111;border-radius:20px;overflow:hidden;box-shadow:0 30px 60px rgba(0,0,0,.5)}
.fa-card-img{overflow:hidden}
.fa-card-img img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .8s ease}
.fa-card:hover .fa-card-img img{transform:scale(1.07)}
.fa-card-body{padding:24px 26px 28px}
.fa-price{display:flex;align-items:center;gap:16px;padding-bottom:16px;border-bottom:1px dashed #bbb}
.fa-price b{font-size:2.6rem;line-height:1;color:#e50914}
.fa-price span{font-size:.9rem;font-weight:600;line-height:1.3}
.fa-venue{margin:14px 0 20px;font-size:.9rem;opacity:.7}
.fa-btn{position:relative;overflow:hidden;display:block;text-align:center;padding:15px 20px;background:#e50914;color:#fff;font-weight:700;border-radius:10px;text-decoration:none;transition:transform .25s ease,box-shadow .25s ease}
.fa-btn::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:rgba(255,255,255,.35);transform:skewX(-25deg);animation:faShine 3.5s ease-in-out 1.5s infinite}
.fa-btn:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(229,9,20,.5)}

/* ===== Scroll animations (CSS only) ===== */
@supports (animation-timeline:view()){
  .fa-rv{animation:faRv linear both;animation-timeline:view();animation-range:entry 0% entry 45%}
  .fa-ticket.fa-rv:nth-child(2){animation-range:entry 10% entry 55%}
  .fa-photo.fa-rv{animation:none}
  .fa-photo img{animation:faReveal linear both;animation-timeline:view();animation-range:entry 0% entry 70%}
  .fa-steps::after{animation:faGrow linear both;animation-timeline:view();animation-range:entry 20% cover 70%}
}

@keyframes faRv{from{opacity:0;transform:translateY(46px)}to{opacity:1;transform:none}}
@keyframes faReveal{from{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0)}}
@keyframes faGrow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes faLine{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes faSpin{to{transform:rotate(360deg)}}
@keyframes faBeat{0%,100%{transform:scale(1)}50%{transform:scale(1.18)}}
@keyframes faGlow{0%,100%{opacity:.5}50%{opacity:1}}
@keyframes faShine{0%{left:-60%}35%,100%{left:130%}}

/* ===== Responsive ===== */
@media (max-width:860px){
  .fa-intro,.fa-sia{padding:60px 0}
  .fa-intro-grid,.fa-tickets,.fa-sia-grid{grid-template-columns:1fr;gap:40px}
  .fa-tickets{gap:18px;margin-top:44px}
  .fa-photo img{aspect-ratio:4/4.2}
  .fa-ring{right:10px;width:104px;height:104px}
  .fa-big{font-size:4rem;padding-right:20px}
  .fa-ticket{padding:22px}
  .fa-card{position:static}
}
@media (prefers-reduced-motion:reduce){
  .fa-intro *,.fa-sia *,.fa-sia::before{animation:none!important;transition:none!important}
}
/* ===== Course details (light background) ===== */
.cd-sec{position:relative;overflow:hidden;background:#f6f6f6;color:#111;padding:90px 0}
.cd-sec::before{content:"";position:absolute;right:-160px;top:-160px;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(229,9,20,.12),transparent 70%);pointer-events:none}

.cd-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:28px;align-items:stretch}

/* Price card */
.cd-price{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:44px 40px;background:#0a0a0a;color:#fff;border-radius:22px;box-shadow:0 26px 50px rgba(0,0,0,.25)}
.cd-label{margin:0 0 10px;font-size:.95rem;font-weight:700;color:#e50914}
.cd-amt{font-size:clamp(4rem,8vw,6.5rem);font-weight:900;line-height:1;letter-spacing:-.03em}
.cd-amt small{display:block;margin-bottom:6px;font-size:1rem;font-weight:600;letter-spacing:0;opacity:.7}
.cd-sub{margin:18px 0 0;line-height:1.6;opacity:.8}
.cd-pulse{position:absolute;right:-60px;bottom:-60px;width:200px;height:200px;border-radius:50%;border:2px solid #e50914;opacity:.7;animation:cdPulse 2.4s ease-out infinite}
.cd-pulse::after{content:"";position:absolute;inset:-2px;border-radius:50%;border:2px solid #e50914;animation:cdPulse 2.4s ease-out .8s infinite}

/* Fact cards */
.cd-facts{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.cd-fact{position:relative;overflow:hidden;padding:26px 26px 24px;background:#fff;border:1px solid #e1e1e1;border-radius:16px;transition:transform .35s ease,box-shadow .35s ease}
.cd-fact::before{content:"";position:absolute;left:0;top:0;height:4px;width:100%;background:#e50914;transform:scaleX(.18);transform-origin:left;transition:transform .5s cubic-bezier(.7,0,.2,1)}
.cd-fact:hover{transform:translateY(-6px);box-shadow:0 18px 38px rgba(0,0,0,.12)}
.cd-fact:hover::before{transform:scaleX(1)}
.cd-fact dt{margin:6px 0 10px;font-size:1.05rem;font-weight:800}
.cd-fact dd{margin:0;line-height:1.7;color:#444}




/* Scroll reveal (CSS only) */
@supports (animation-timeline:view()){
  .cd-rv{animation:cdRv linear both;animation-timeline:view();animation-range:entry 0% entry 45%}
  .cd-fact.cd-rv:nth-child(even){animation-range:entry 8% entry 53%}
  .cd-chips li{animation:cdPop linear both;animation-timeline:view();animation-range:entry 0% entry 60%}
}

@keyframes cdRv{from{opacity:0;transform:translateY(46px)}to{opacity:1;transform:none}}
@keyframes cdPop{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}
@keyframes cdPulse{0%{transform:scale(.6);opacity:.8}100%{transform:scale(1.5);opacity:0}}

/* Responsive */
@media (max-width:860px){
  .cd-sec{padding:60px 0}
  .cd-grid,.cd-facts{grid-template-columns:1fr}
  .cd-price{padding:34px 28px}
  .cd-loc{padding:26px 22px;margin-top:34px}
}
@media (prefers-reduced-motion:reduce){
  .cd-sec *,.cd-sec::before{animation:none!important;transition:none!important}
}
/* ===== Course content - model 2 ===== */
.cm-sec{overflow:hidden}

/* Black top band */
.cm-top{position:relative;overflow:hidden;background:#0a0a0a;color:#fff;padding:80px 0 120px;clip-path:polygon(0 0,100% 0,100% 82%,0 100%)}
.cm-top::before{content:"";position:absolute;right:-120px;top:-120px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(229,9,20,.3),transparent 70%);animation:cmGlow 3s ease-in-out infinite;pointer-events:none}
.cm-top-grid{display:flex;justify-content:space-between;align-items:center;gap:40px;flex-wrap:wrap}
.cm-top h2{position:relative;flex:1 1 520px;margin:0;padding-bottom:20px;line-height:1.1}
.cm-top h2::after{content:"";position:absolute;left:0;bottom:0;width:90px;height:4px;background:#e50914;transform-origin:left;animation:cmLine 1s cubic-bezier(.7,0,.2,1) both}
.cm-badge{position:relative;display:grid;place-items:center;width:170px;height:170px;border-radius:50%;background:#e50914;text-align:center;box-shadow:0 0 0 10px rgba(229,9,20,.18);animation:cmFloat 3s ease-in-out infinite}
.cm-badge b{display:block;font-size:3rem;line-height:1}
.cm-badge span{display:block;margin-top:-26px;font-size:.8rem;font-weight:600}
.cm-intro{max-width:820px;margin:34px 0 0;line-height:1.85;opacity:.8}

/* Light bottom */
.cm-body{background:#f6f6f6;color:#111;padding:20px 0 90px}
.cm-sub{margin:0 0 28px;font-size:1.4rem}

.cm-list{list-style:none;margin:0;padding:0;counter-reset:cm}
.cm-list li{position:relative;overflow:hidden;display:grid;grid-template-columns:90px 1fr 40px;align-items:center;gap:10px;padding:20px 24px;border-bottom:1px solid #d9d9d9;transition:padding .35s ease,color .35s ease}
.cm-list li::before{content:"";position:absolute;inset:0;background:#0a0a0a;transform:scaleY(0);transform-origin:bottom;transition:transform .4s cubic-bezier(.7,0,.2,1)}
.cm-list li>*{position:relative;z-index:1}
.cm-list li:hover{padding-left:40px;color:#fff}
.cm-list li:hover::before{transform:scaleY(1)}
.cm-n{font-size:2.2rem;font-weight:900;line-height:1;color:transparent;-webkit-text-stroke:1.5px #e50914;transition:color .3s ease}
.cm-list li:hover .cm-n{color:#e50914}
.cm-list p{margin:0;font-size:1.1rem;font-weight:600}
.cm-list i{justify-self:end;width:14px;height:14px;border-top:3px solid #e50914;border-right:3px solid #e50914;transform:rotate(45deg);transition:transform .35s ease}
.cm-list li:hover i{transform:translateX(-8px) rotate(45deg)}

/* Booking block */
.cm-book{display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;margin-top:50px;padding:34px 38px;background:#fff;border:2px solid #111;border-radius:20px;box-shadow:10px 10px 0 #e50914}
.cm-book p{flex:1 1 480px;margin:0;line-height:1.8}
.cm-btn{position:relative;overflow:hidden;display:inline-block;padding:15px 32px;background:#e50914;color:#fff;font-weight:700;border-radius:10px;text-decoration:none;transition:transform .25s ease,box-shadow .25s ease}
.cm-btn::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:rgba(255,255,255,.35);transform:skewX(-25deg);animation:cmShine 3.5s ease-in-out 1.5s infinite}
.cm-btn:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(229,9,20,.5)}

/* Scroll reveal (CSS only) */
@supports (animation-timeline:view()){
  .cm-rv{animation:cmRv linear both;animation-timeline:view();animation-range:entry 0% entry 45%}
}

@keyframes cmRv{from{opacity:0;transform:translateX(-40px)}to{opacity:1;transform:none}}
@keyframes cmLine{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes cmGlow{0%,100%{opacity:.5}50%{opacity:1}}
@keyframes cmFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes cmShine{0%{left:-60%}35%,100%{left:130%}}

/* Responsive */
@media (max-width:860px){
  .cm-top{padding:60px 0 90px}
  .cm-badge{width:130px;height:130px}
  .cm-badge b{font-size:2.3rem}
  .cm-badge span{margin-top:-18px}
  .cm-list li{grid-template-columns:60px 1fr 24px;padding:16px 14px}
  .cm-n{font-size:1.6rem}
  .cm-list p{font-size:1rem}
  .cm-book{padding:24px 22px;box-shadow:6px 6px 0 #e50914}
  .cm-body{padding-bottom:60px}
}
@media (prefers-reduced-motion:reduce){
  .cm-sec *,.cm-top::before{animation:none!important;transition:none!important}
}
  /* ===== FAQ compact (light, 2 columns) ===== */
.fx-sec{position:relative;overflow:hidden;background:#f6f6f6;color:#111;padding:56px 0 64px}

/* Header in one row */
.fx-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:28px;padding-bottom:18px;border-bottom:2px solid #111;position:relative}
.fx-head::after{content:"";position:absolute;left:0;bottom:-2px;height:2px;width:100%;background:#e50914;transform-origin:left;animation:fxLine 1.2s cubic-bezier(.7,0,.2,1) both}
.fx-tag{margin:0 0 8px;font-size:.85rem;font-weight:700;color:#e50914}
.fx-head h2{margin:0;line-height:1.1}
.fx-btn{position:relative;overflow:hidden;display:inline-block;padding:12px 24px;background:#0a0a0a;color:#fff;font-weight:700;border-radius:10px;text-decoration:none;transition:background .25s ease,transform .25s ease,box-shadow .25s ease}
.fx-btn::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:rgba(255,255,255,.3);transform:skewX(-25deg);animation:fxShine 3.5s ease-in-out 1.5s infinite}
.fx-btn:hover{background:#e50914;transform:translateY(-3px);box-shadow:0 10px 24px rgba(229,9,20,.4)}

/* Two columns, tight gaps */
.fx-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}
.fx-item{position:relative;overflow:hidden;background:#fff;border:1px solid #dcdcdc;border-radius:12px;transition:background .35s ease,color .35s ease,border-color .35s ease,box-shadow .35s ease}
.fx-item:hover{border-color:#e50914}
.fx-item[open]{background:#0a0a0a;color:#fff;border-color:#0a0a0a;box-shadow:6px 6px 0 #e50914}

.fx-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:14px 16px;font-weight:700;font-size:.97rem;line-height:1.35}
.fx-item summary::-webkit-details-marker{display:none}
.fx-item summary:focus-visible{outline:2px solid #e50914;outline-offset:-2px}
.fx-item summary::before{content:"?";flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#e50914;color:#fff;font-size:.9rem;font-weight:800;transition:transform .35s ease}
.fx-item[open] summary::before{transform:rotate(360deg)}
.fx-item summary::after{content:"";flex:none;margin-left:auto;width:9px;height:9px;border-right:2.5px solid currentColor;border-bottom:2.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .35s ease}
.fx-item[open] summary::after{transform:rotate(225deg)}

.fx-ans{padding:0 16px 16px 56px}
.fx-item[open] .fx-ans{animation:fxOpen .4s ease both}
.fx-ans p{margin:0 0 8px;font-size:.93rem;line-height:1.65;opacity:.88}
.fx-ans p:last-child{margin-bottom:0}
.fx-ans ul{margin:0 0 8px;padding:0;list-style:none;display:grid;gap:6px}
.fx-ans li{position:relative;padding-left:18px;font-size:.93rem;line-height:1.6}
.fx-ans li::before{content:"";position:absolute;left:0;top:.6em;width:7px;height:7px;border-radius:50%;background:#e50914}

/* Scroll reveal (CSS only) */
@supports (animation-timeline:view()){
  .fx-rv{animation:fxRv linear both;animation-timeline:view();animation-range:entry 0% entry 40%}
}

@keyframes fxRv{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes fxOpen{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes fxLine{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes fxShine{0%{left:-60%}35%,100%{left:130%}}

/* Responsive */
@media (max-width:860px){
  .fx-sec{padding:40px 0 48px}
  .fx-grid{grid-template-columns:1fr}
  .fx-head{margin-bottom:20px}
  .fx-ans{padding:0 16px 16px 16px}
  .fx-item[open]{box-shadow:4px 4px 0 #e50914}
}
@media (prefers-reduced-motion:reduce){
  .fx-sec *{animation:none!important;transition:none!important}
}