
:root{--ink:#f2f2f2;--bg:#000;--teal:#8fd0d0;--teal-d:#6fb5b5;--max:1100px}
*{margin:0;padding:0;box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:'IM Fell DW Pica',Georgia,serif;line-height:1.45;font-size:19px;font-weight:400}
h1,h2,h3,h4,nav.site a,.brandline{font-family:'IM Fell DW Pica',Georgia,serif}
a{color:var(--teal)}
img{max-width:100%;height:auto}
.wrap{max-width:var(--max);margin:0 auto;padding:0 1.2rem}
header.site{text-align:center;padding:3rem 1rem 1rem}
header.site img.brand{max-width:640px;width:100%}
nav.site{margin:2rem auto 0;background:var(--teal);max-width:960px;display:flex;flex-wrap:wrap;justify-content:center}
nav.site a{color:#111;text-decoration:none;padding:.85rem 1.1rem;display:block;font-size:1.05rem}
nav.site a:hover{background:var(--teal-d)}
main.wrap{padding:2.5rem 1.2rem 5rem;max-width:760px}
main.wide{max-width:var(--max)}
h1,h2,h3,h4{line-height:1.3;margin:1.7em 0 .7em;font-weight:normal;letter-spacing:.02em}
h1{font-size:2.2rem}h2{font-size:1.7rem}h3{font-size:1.35rem}
p{margin:0 0 1.2em}
ul,ol{margin:0 0 1.2em 1.4em}
li{margin-bottom:.3em}
blockquote{border-left:3px solid var(--teal);padding:.4rem 1rem;margin:1.4em 0;font-style:italic;color:#ddd}
figure{margin:1.8em 0;text-align:center}
figcaption{font-size:.85em;color:#999;margin-top:.5em}
hr{border:0;border-top:1px solid #2a2a2a;margin:3em 0}
table{border-collapse:collapse;width:100%;margin:1.4em 0}
td,th{border:1px solid #3a3a3a;padding:.55em .75em}
video{margin:1.2em 0;background:#111}
iframe{margin:1.2em 0}
footer.site{border-top:1px solid #2a2a2a;margin-top:4rem;padding:2.5rem 1rem;text-align:center;color:#8a8a8a;font-size:.9em}
footer.site a{color:var(--teal)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.8rem;margin:2.5rem 0}
.card{border:1px solid #262626;background:#0a0a0a;text-decoration:none;color:var(--ink);display:block;transition:border-color .2s}
.card img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.card .pad{padding:1.1rem 1.3rem}
.card h3{margin:.1em 0 .5em;font-size:1.15rem}
.card p{font-size:.9em;color:#aaa;margin:0}
.card:hover{border-color:var(--teal)}
@media(max-width:640px){nav.site a{padding:.65rem .7rem;font-size:.95rem}header.site{padding:1.5rem .5rem .5rem}}

/* --- Navigation system: dropdowns, mobile menu, compact subpage header --- */
header.site.home{padding:2.2rem 1rem .6rem}
header.site.home nav.site{margin:1rem auto 0}
.nav-toggle{display:none}
nav.site ul.menu{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;justify-content:center}
nav.site li{margin:0;position:relative}
nav.site .has-sub{display:flex;align-items:center}
nav.site .sub-toggle{background:none;border:0;color:#111;cursor:pointer;font-size:.85rem;padding:.6rem .55rem;line-height:1;font-family:inherit}
nav.site .submenu{display:none;position:absolute;top:100%;left:0;min-width:250px;z-index:60;background:var(--teal);box-shadow:0 10px 24px rgba(0,0,0,.55);margin:0;padding:0;list-style:none}
nav.site .has-sub.open>.submenu{display:block}
nav.site .submenu li{display:block;margin:0}
nav.site .submenu a{padding:.85rem 1.2rem;text-align:left}
header.compact nav.site a{font-size:.95rem;padding:.7rem .8rem}
nav.site a:focus-visible,nav.site button:focus-visible{outline:2px solid #111;outline-offset:2px}
main a:focus-visible,.card:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
header.compact{padding-top:1.5rem}
.compact-bar{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;max-width:1100px;margin:0 auto;padding:0 1.2rem}
.compact-brand img{display:block;width:250px;height:auto}
header.compact nav.site{margin:0;max-width:none}
.brandline{position:relative;border-top:1px solid #4a4a4a;margin:1.6rem 1.2rem 0;max-width:1100px}
.brandline::after{content:'';position:absolute;left:50%;top:-7px;transform:translateX(-50%);width:12px;height:12px;border:1px solid #6a6a6a;border-radius:50%;background:#000}
@media(min-width:1140px){.brandline{margin-left:auto;margin-right:auto}}

/* --- Blog cards: original borderless look with Read More button --- */
.card{border:0;background:transparent}
.card .pad{padding:1rem 0 0}
.card .more{display:inline-block;margin-top:.9rem;background:#00ffef;color:#08312f;padding:.45rem 1.05rem;border-radius:4px;font-size:.95rem;line-height:1.4}
.card:hover .more{background:#8ffcf4}
.wrap.wide{padding-top:1.6rem}

@media(max-width:1080px){
  .nav-toggle{display:block;width:100%;background:var(--teal);color:#111;border:0;padding:.95rem 1rem;font-family:'IM Fell DW Pica',Georgia,serif;font-size:1.15rem;cursor:pointer;min-height:44px}
  nav.site ul.menu{display:none;flex-direction:column;width:100%}
  nav.site.menu-open ul.menu{display:flex}
  nav.site li{width:100%;text-align:center}
  nav.site .has-sub{flex-wrap:wrap;justify-content:center}
  nav.site .submenu{position:static;box-shadow:none;flex-basis:100%}
  nav.site .submenu a{padding:.85rem 1rem}
  .compact-bar{flex-wrap:wrap;justify-content:center;row-gap:1rem}
  header.compact nav.site{width:100%}
}

/* --- Editorial page layouts: two columns, responsive media, shop embed --- */
.cols{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:start;margin:1.5rem 0}
.video16{position:relative;width:100%;aspect-ratio:16/9;margin:1.2em 0;background:#111}
.video16 iframe,.video16 video{position:absolute;inset:0;width:100%;height:100%;border:0;margin:0}
.teal{color:var(--teal)}
.shop-embed{width:100%;min-height:4200px;border:0;display:block}

/* Contact: centred layout with country card grid */
.contact-page{text-align:center}
.contact-page h2{color:var(--teal);font-weight:normal;margin-bottom:.2em}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.8rem;margin:2.5rem 0}
.contact-grid a{display:block}
.contact-grid img{width:100%;display:block}

/* Bookstore: charcoal editorial panel with outlined buttons */
.bookstore{background:#1a1a1a;padding:2.5rem 2rem}
.store-brand{color:#2e2e2e;font-size:2.6rem;text-align:center;margin:0;font-family:'IM Fell DW Pica',Georgia,serif}
.store-title{color:#b0413e;text-align:center;font-size:2rem;letter-spacing:.06em;margin:.2em 0 .4em;font-family:'IM Fell DW Pica',Georgia,serif}
.store-tag{text-align:center}
.store-rule{border:0;border-top:1px solid #b0413e;margin:1.6rem 0 2.2rem}
.book-entry h2{text-align:center;font-size:1.7rem;margin:.4em 0 .2em}
.book-entry .subtitle{text-align:center;color:#ddd;margin-bottom:1.6rem}
.book-row{display:grid;grid-template-columns:300px 1fr;gap:2rem;align-items:start}
.book-row img{width:100%;max-width:300px;display:block}
.book-row .desc,.book-pair .desc{font-size:.95em}
.book-buttons{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1.2rem}
.btn-outline{display:inline-block;border:1px solid #8a5a5a;color:#f2f2f2;padding:.55rem 1.2rem;text-transform:uppercase;letter-spacing:.08em;font-size:.85rem;text-decoration:none}
.btn-outline:hover{border-color:#cb1e22;color:#fff}
.book-lang{color:#2e2e2e;text-align:center;font-size:1.2rem;margin:.6em 0}
.book-pair{display:grid;grid-template-columns:1fr 1fr;gap:2rem}
.book-pair img{width:100%;display:block}
.coming-soon{color:#2e2e2e;font-size:2rem;text-align:center;letter-spacing:.05em}
.book-divider{border:0;border-top:1px solid #2a2a2a;margin:2.5rem 0}

@media(max-width:900px){.cols{grid-template-columns:1fr}}
@media(max-width:800px){
  .book-row{grid-template-columns:1fr}
  .book-row img{margin:0 auto}
  .book-pair{grid-template-columns:1fr}
  .bookstore{padding:1.5rem 1.2rem}
}
@media(max-width:640px){
  .contact-grid{grid-template-columns:1fr}
  .shop-embed{min-height:6800px}
}

/* Body size on small screens; image width utilities; teal CTA buttons */
@media(max-width:640px){body{font-size:18px}}
.img-400{max-width:400px}.img-430{max-width:430px}.img-480{max-width:480px}
.btn-teal{display:inline-block;background:var(--teal);color:#111;padding:.8rem 2.2rem;text-decoration:none;margin:.3rem .5rem .3rem 0}
.btn-teal:hover{background:var(--teal-d)}
.cta-row{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1rem}

/* Whole training plan is a link to the online class */
a.schedule-link{display:block;text-decoration:none;color:inherit;cursor:pointer}
a.schedule-link:hover .ml-schedule-container{outline:1px solid #B48C2C;outline-offset:4px}

/* Terms and Conditions page */
.terms h2,.terms h3{color:var(--teal);font-weight:normal}
.terms h3{font-size:1.15rem;margin-top:1.6em}
.terms li{margin-bottom:.45em}
.terms-footer{margin-top:2.5rem;color:#aaa;font-size:.95em}

/* Contact page: bigger type, tighter lines */
.contact-page{font-size:21px;line-height:1.35}
.contact-page p{margin-bottom:.55em}
.contact-grid{margin:2rem 0}
