@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap");

:root { --ink:#141414; --paper:#EEEEEE; --white:#fff; --blue:#1F6F5F; --indigo:#155447; --muted:#50645F; --soft:#DDF4E6; --line:rgba(31,111,95,.14); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Poppins",sans-serif; }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.announcement { height:56px; padding:0 3.5vw; background:var(--indigo); color:#fff; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; text-transform:uppercase; letter-spacing:.09em; font-size:10px; font-weight:700; }
.announcement span:last-child { color:#6FCF97; }
.announcement-phones a { color:#fff; }
.announcement i { display:inline-block; width:3px; height:3px; margin:0 10px; border-radius:50%; background:currentColor; vertical-align:middle; }
.announcement-social { display:flex; align-items:center; gap:8px; }
.announcement-social > span { display:none; }
.announcement-social a { width:40px; height:40px; position:relative; display:grid; place-items:center; border:1px solid rgba(255,255,255,.24); border-radius:50%; color:#fff; background:rgba(255,255,255,.04); font:700 16px Arial,sans-serif; line-height:1; transition:.2s; }
.announcement-social { justify-self:end; }
.announcement-social a i,.social-links a i { display:none; }
.announcement-social a::before,.social-links a::before { display:block; font-weight:700; line-height:1; text-transform:none; }
.announcement-social a[aria-label="Instagram"]::before,.social-links a[aria-label="Instagram"]::before { content:""; width:18px; height:18px; border:2px solid currentColor; border-radius:5px; }
.announcement-social a[aria-label="Instagram"]::after,.social-links a[aria-label="Instagram"]::after { content:""; width:6px; height:6px; position:absolute; border:2px solid currentColor; border-radius:50%; }
.announcement-social a[aria-label="Facebook"]::before,.social-links a[aria-label="Facebook"]::before { content:"f"; font-size:21px; font-family:Arial,sans-serif; }
.announcement-social a[aria-label="X (Twitter)"]::before,.social-links a[aria-label="X (Twitter)"]::before { content:"X"; font-size:16px; }
.announcement-social a[aria-label="LinkedIn"]::before,.social-links a[aria-label="LinkedIn"]::before { content:"in"; font-size:14px; }
.announcement-social a:hover { background:rgba(255,255,255,.14); transform:translateY(-1px); }
.site-header { height:88px; padding:0 3.5vw; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; position:sticky; top:0; z-index:30; background:rgba(255,255,255,.9); border-bottom:1px solid var(--line); backdrop-filter:blur(18px); }
.brand { display:inline-flex; align-items:center; gap:11px; width:max-content; }
.brand img { width:56px; height:56px; object-fit:contain; mix-blend-mode:multiply; }
.brand span,.footer-brand div { display:flex; flex-direction:column; text-transform:uppercase; line-height:1; }
.brand strong { color:var(--blue); font-size:17px; letter-spacing:.08em; }
.brand small { color:var(--indigo); margin-top:5px; font-size:10px; letter-spacing:.13em; font-weight:700; }
.nav { display:flex; gap:30px; font-size:13px; font-weight:500; }
.nav a { position:relative; padding:8px 0; }
.nav a::after { content:""; position:absolute; left:0; right:100%; bottom:0; height:2px; border-radius:2px; background:var(--blue); transition:right .25s; }
.nav a:hover::after,.nav a.active::after { right:0; }
.menu-button { display:none; }
.desktop-cta { justify-self:end; }
.button { min-height:52px; padding:0 24px; border:0; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; gap:20px; background:var(--blue); color:#fff; box-shadow:0 10px 24px rgba(31,111,95,.22); text-transform:uppercase; letter-spacing:.08em; font-size:11px; font-weight:700; transition:.25s; }
.button:hover { background:var(--indigo); transform:translateY(-2px); }
.button-small { min-height:43px; padding:0 18px; }
.button-light { background:#fff; color:var(--indigo); }
.eyebrow,.section-label { margin:0 0 20px; text-transform:uppercase; letter-spacing:.16em; font-size:11px; font-weight:700; }
.course-hero { min-height:620px; padding:90px 7vw; position:relative; overflow:hidden; display:grid; grid-template-columns:1.45fr .55fr; gap:7vw; align-items:center; color:#fff; background:linear-gradient(135deg,var(--blue),#3FAF8F 52%,var(--indigo)); }
.course-hero::before,.course-hero::after { content:""; position:absolute; border:1px solid rgba(255,255,255,.24); border-radius:50%; }
.course-hero::before { width:520px; height:520px; right:-150px; top:-230px; }
.course-hero::after { width:360px; height:360px; left:-160px; bottom:-220px; background:rgba(255,255,255,.08); }
.hero-copy,.hero-panel { position:relative; z-index:1; }
.hero-copy .eyebrow { color:#DDF4E6; }
.hero-copy h1 { max-width:950px; margin:0; font-size:clamp(54px,7vw,108px); line-height:.94; letter-spacing:-.055em; }
.hero-copy h1 span { color:#EEEEEE; }
.hero-copy > p:last-child { max-width:690px; margin:34px 0 0; color:rgba(255,255,255,.85); font-size:17px; line-height:1.75; }
.hero-panel { padding:20px; border:1px solid rgba(255,255,255,.24); border-radius:28px; background:rgba(255,255,255,.12); box-shadow:0 30px 70px rgba(21,84,71,.22); backdrop-filter:blur(18px); }
.hero-panel div { padding:24px 18px; display:flex; align-items:end; justify-content:space-between; gap:15px; border-bottom:1px solid rgba(255,255,255,.18); }
.hero-panel div:last-child { border:0; }
.hero-panel strong { font-size:42px; line-height:1; }
.hero-panel span { max-width:100px; color:#EEEEEE; text-align:right; font-size:10px; line-height:1.45; text-transform:uppercase; letter-spacing:.1em; }
.catalogue { padding:110px 6vw; }
.catalogue-heading { display:grid; grid-template-columns:1.3fr .7fr; gap:8vw; align-items:end; }
.section-label { color:var(--blue); }
.catalogue h2,.contact-strip h2 { margin:0; font-size:clamp(48px,6vw,84px); line-height:.98; letter-spacing:-.055em; color:var(--indigo); }
.catalogue-heading > p { margin:0; color:var(--muted); line-height:1.8; }
.course-tools { margin:70px 0 20px; padding:18px; display:flex; align-items:center; justify-content:space-between; gap:20px; border:1px solid var(--line); border-radius:22px; background:#fff; box-shadow:0 18px 50px rgba(31,111,95,.07); }
.search-box { min-width:290px; display:flex; align-items:center; gap:10px; padding:0 16px; border-radius:14px; background:var(--paper); }
.search-box > span:not(.sr-only) { color:var(--blue); font-size:25px; transform:rotate(-20deg); }
.search-box input { width:100%; height:48px; border:0; outline:0; color:var(--ink); background:transparent; }
.filter-buttons { display:flex; flex-wrap:wrap; gap:8px; }
.filter-buttons button { min-height:42px; padding:0 16px; border:1px solid var(--line); border-radius:999px; color:var(--indigo); background:#fff; cursor:pointer; font-size:11px; font-weight:600; transition:.2s; }
.filter-buttons button:hover,.filter-buttons button.active { border-color:var(--blue); background:var(--blue); color:#fff; }
.result-count { margin:22px 0 50px; color:var(--muted); font-size:12px; }
.course-group { margin-top:75px; }
.group-heading { margin-bottom:24px; display:grid; grid-template-columns:45px 1fr auto; gap:16px; align-items:center; }
.group-heading > span { color:var(--blue); font-size:11px; font-weight:700; }
.group-heading p { margin:0 0 5px; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.12em; }
.group-heading h3 { margin:0; color:var(--indigo); font-size:clamp(24px,3vw,38px); letter-spacing:-.04em; }
.group-heading > b { padding:9px 13px; border-radius:999px; background:var(--soft); color:var(--indigo); font-size:10px; text-transform:uppercase; letter-spacing:.08em; }
.course-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.course-card { min-height:175px; padding:25px; position:relative; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; border:1px solid var(--line); border-radius:22px; background:#fff; box-shadow:0 12px 32px rgba(31,111,95,.06); transition:.25s; }
.course-card::before { content:""; position:absolute; width:90px; height:90px; right:-45px; top:-45px; border-radius:50%; background:var(--soft); transition:.25s; }
.course-card:hover { border-color:rgba(31,111,95,.5); transform:translateY(-5px); box-shadow:0 20px 42px rgba(31,111,95,.13); }
.course-card:hover::before { width:140px; height:140px; right:-70px; top:-70px; background:#D8F0E2; }
.course-card span { color:var(--blue); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.13em; }
.course-card h4 { max-width:85%; margin:30px 0 0; font-size:17px; line-height:1.45; font-weight:600; }
.course-card b { width:38px; height:38px; position:absolute; right:18px; bottom:18px; display:grid; place-items:center; border-radius:50%; background:var(--soft); color:var(--indigo); transition:.2s; }
.course-card:hover b { background:var(--blue); color:#fff; }
.course-card[hidden],.course-group[hidden] { display:none; }
.empty-state { padding:70px 20px; text-align:center; border:1px dashed var(--line); border-radius:22px; background:#fff; }
.empty-state strong,.empty-state span { display:block; }
.empty-state span { margin-top:8px; color:var(--muted); font-size:13px; }
.contact-strip { padding:85px 8vw; display:flex; align-items:center; justify-content:space-between; gap:50px; color:#fff; background:linear-gradient(120deg,var(--blue),var(--indigo)); }
.contact-strip .eyebrow { color:#EEEEEE; }
.contact-strip h2 { color:#fff; }
.contact-actions { display:flex; flex-direction:column; align-items:flex-start; gap:24px; }
.text-link { padding-bottom:6px; border-bottom:1px solid currentColor; color:#fff; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
footer { padding:70px 6vw 28px; display:grid; grid-template-columns:1.2fr 1fr .8fr 1fr; gap:40px; align-items:start; color:#fff; background:#103F36; }
.footer-brand { display:flex; align-items:center; gap:15px; }
.footer-brand img { width:65px; height:65px; object-fit:contain; border-radius:50%; background:#fff; }
.footer-brand strong { color:#6FCF97; letter-spacing:.08em; }
.footer-brand span { margin-top:4px; font-size:10px; letter-spacing:.12em; }
footer > p { margin:0; color:#EEEEEE; font-size:26px; font-weight:500; }
footer nav { display:grid; grid-template-columns:1fr 1fr; gap:14px; justify-self:end; font-size:12px; }
.footer-social > span { display:none; }
.social-links { display:flex; gap:10px; }
.social-links a { width:40px; height:40px; position:relative; display:grid; place-items:center; border:1px solid rgba(255,255,255,.22); border-radius:50%; color:#fff; background:rgba(255,255,255,.04); font:700 16px Arial,sans-serif; transition:.2s; }
.social-links a:hover { border-color:#1F6F5F; background:#1F6F5F; transform:translateY(-2px); }
.footer-bottom { grid-column:1/-1; margin-top:55px; padding-top:20px; display:flex; justify-content:space-between; border-top:1px solid rgba(255,255,255,.15); color:#EEEEEE; font-size:10px; text-transform:uppercase; letter-spacing:.1em; }

@media (max-width:980px) {
  .announcement { grid-template-columns:1fr auto; }
  .announcement-meta { display:none; }
  .site-header { grid-template-columns:1fr auto; }
  .desktop-cta { display:none; }
  .menu-button { width:46px; height:46px; display:flex; flex-direction:column; justify-content:center; gap:7px; border:0; background:none; }
  .menu-button span { width:25px; height:1px; background:var(--ink); }
  .nav { display:none; position:absolute; top:88px; left:0; right:0; padding:25px 4vw; flex-direction:column; gap:14px; border-bottom:1px solid var(--line); background:#fff; }
  .nav.open { display:flex; }
  .course-hero { grid-template-columns:1fr; padding:85px 7vw; }
  .hero-panel { display:grid; grid-template-columns:repeat(3,1fr); }
  .hero-panel div { padding:15px; display:block; border-right:1px solid rgba(255,255,255,.18); border-bottom:0; }
  .hero-panel div:last-child { border-right:0; }
  .hero-panel span { margin-top:8px; display:block; text-align:left; }
  .course-tools { align-items:stretch; flex-direction:column; }
  .search-box { min-width:0; }
  .course-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:640px) {
  .announcement { padding:0 18px; display:flex; justify-content:center; }
  .announcement { height:104px; padding:8px 18px; flex-direction:column; gap:7px; }
  .announcement-phones { display:block; font-size:9px; }
  .announcement-social { display:flex; justify-self:auto; }
  .site-header { height:76px; padding:0 18px; }
  .brand img { width:45px; height:45px; }
  .brand strong { font-size:14px; }
  .nav { top:76px; }
  .course-hero { min-height:auto; padding:70px 22px; }
  .hero-copy h1 { font-size:51px; }
  .hero-panel { grid-template-columns:1fr; }
  .hero-panel div { display:flex; border-right:0; border-bottom:1px solid rgba(255,255,255,.18); }
  .hero-panel span { margin:0; text-align:right; }
  .catalogue { padding:75px 22px; }
  .catalogue-heading { grid-template-columns:1fr; gap:30px; }
  .catalogue h2,.contact-strip h2 { font-size:46px; }
  .course-tools { margin-top:45px; padding:12px; }
  .filter-buttons button { flex:1 1 auto; }
  .group-heading { grid-template-columns:32px 1fr; }
  .group-heading > b { display:none; }
  .course-grid { grid-template-columns:1fr; }
  .course-card { min-height:155px; }
  .course-card b { top:18px; right:18px; bottom:auto; }
  .contact-strip { padding:70px 22px; align-items:flex-start; flex-direction:column; }
  footer { grid-template-columns:1fr; padding:60px 22px 25px; }
  footer nav { justify-self:start; }
  .footer-bottom { flex-direction:column; gap:12px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none!important; } }
.whatsapp-float { width:64px; height:64px; position:fixed; z-index:1000; right:24px; bottom:24px; display:grid; place-items:center; border:3px solid #fff; border-radius:50%; color:#fff; background:#25d366; box-shadow:0 14px 35px rgba(20,85,46,.3); transition:transform .2s,box-shadow .2s; }
.whatsapp-float img { width:100%; height:100%; display:block; object-fit:contain; border-radius:50%; }
.whatsapp-float span { padding:8px 11px; position:absolute; right:72px; border-radius:8px; color:#fff; background:#183b27; opacity:0; pointer-events:none; font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; transform:translateX(8px); transition:.2s; }
.whatsapp-float:hover { color:#fff; transform:translateY(-3px) scale(1.03); box-shadow:0 18px 42px rgba(20,85,46,.38); }
.whatsapp-float:hover span,.whatsapp-float:focus-visible span { opacity:1; transform:none; }
@media (max-width:640px) { .whatsapp-float { width:56px; height:56px; right:16px; bottom:16px; } .whatsapp-float span { display:none; } }