/* Google Fonts - loaded via <link> in each HTML file for reliability */

*{margin:0;padding:0;box-sizing:border-box}

:root{
  --ink:#0f0e0c;
  --ink2:#1c1b18;
  --ink3:#252420;
  --cream:#e8e4d9;
  --cream2:#f2efe8;
  --cream3:#faf8f4;
  --sand:#c9c3b0;
  --muted:#7a7669;
  --line:rgba(232,228,217,0.13);
  --line2:rgba(232,228,217,0.07);
  --accent:#e8e4d9;
  --clip:#00d4aa;
}

html{scroll-behavior:smooth}
body{background:#0f0e0c;background:var(--ink);color:#e8e4d9;color:var(--cream);font-family:'EB Garamond',Georgia,serif;font-size:17px;line-height:1.65;overflow-x:hidden}

/* ── TYPOGRAPHY ── */
h1,h2,h3,h4{font-family:'Playfair Display',serif;font-weight:900;line-height:1;color:var(--cream)}
.mono{font-family:'Space Mono',monospace}
.label{font-family:'Space Mono',monospace;font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;color:var(--sand)}
.label-line{display:flex;align-items:center;gap:.75rem}
.label-line::before{content:'';display:block;width:28px;height:1px;background:var(--sand)}

/* ── NAV ── */
nav{display:flex;align-items:center;justify-content:space-between;padding:1.4rem 4rem;border-bottom:1px solid var(--line);position:sticky;top:0;background:#0f0e0c;background:rgba(15,14,12,0.97);backdrop-filter:blur(8px);z-index:200}
.logo-wrap{display:flex;align-items:center;gap:.9rem;text-decoration:none}
.logo-box{border:1.5px solid var(--cream);padding:.3rem .65rem;display:inline-grid;grid-template-columns:1fr 1fr;line-height:1.05;gap:0}
.logo-box span{font-family:'Playfair Display',serif;font-weight:900;font-size:1.25rem;color:var(--cream);display:block;letter-spacing:-.5px}
.logo-side{border-left:1.5px solid var(--sand);padding-left:.7rem;font-family:'Space Mono',monospace;font-size:.46rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sand);line-height:1.5}
.nav-links{display:flex;gap:2.2rem;list-style:none}
.nav-links a{font-family:'Space Mono',monospace;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sand);text-decoration:none;transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:var(--cream)}
.nav-cta{font-family:'Space Mono',monospace;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;background:var(--cream);color:var(--ink);border:none;padding:.55rem 1.5rem;cursor:pointer;transition:opacity .2s}
.nav-cta:hover{opacity:.85}
.nav-hamburger{display:none;background:none;border:none;color:var(--cream);font-size:1.5rem;cursor:pointer}

/* ── BUTTONS ── */
.btn{display:inline-block;font-family:'Space Mono',monospace;font-size:.65rem;letter-spacing:.13em;text-transform:uppercase;padding:.8rem 2rem;cursor:pointer;text-decoration:none;transition:all .2s;border:none}
.btn-primary{background:var(--cream);color:var(--ink)}
.btn-primary:hover{background:var(--cream2)}
.btn-ghost{background:transparent;color:var(--cream);border:1px solid rgba(232,228,217,0.25)}
.btn-ghost:hover{border-color:var(--sand)}
.btn-clip{background:#00c9a7;color:#0a0a0a;font-weight:700}
.btn-clip:hover{background:#00b898}
.btn-full{display:block;width:100%;text-align:center}

/* ── SECTIONS ── */
.section{padding:5.5rem 4rem;border-bottom:1px solid var(--line)}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:3.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--line)}
.section-title{font-size:2.8rem;margin-top:.6rem}
.see-all{font-family:'Space Mono',monospace;font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--sand);text-decoration:none}
.see-all:hover{color:var(--cream)}

/* ── COURSE CARDS ── */
.courses-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line)}
.course-card{border-right:1px solid var(--line);padding:0;cursor:pointer;transition:background .2s;position:relative;display:flex;flex-direction:column}
.course-card:last-child{border-right:none}
.course-card:hover{background:rgba(232,228,217,0.04)}
.course-thumb{width:100%;aspect-ratio:4/3;overflow:hidden;position:relative}
.course-thumb svg{width:100%;height:100%;display:block}
.course-body{padding:1.8rem 1.6rem;flex:1;display:flex;flex-direction:column}
.course-badge{font-family:'Space Mono',monospace;font-size:.52rem;letter-spacing:.15em;text-transform:uppercase;padding:.2rem .6rem;border:1px solid var(--line);color:var(--sand);display:inline-block;margin-bottom:1.2rem}
.course-badge.free{border-color:var(--cream);color:var(--cream)}
.course-num{font-family:'Playfair Display',serif;font-size:3rem;font-weight:900;color:rgba(232,228,217,0.07);line-height:1;position:absolute;top:.8rem;right:1rem}
.course-name{font-family:'Playfair Display',serif;font-size:1.15rem;font-weight:700;color:var(--cream);margin-bottom:.35rem;line-height:1.2}
.course-desc{color:var(--muted);font-size:.85rem;line-height:1.6;margin-bottom:1rem;flex:1}
.course-footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:1rem;margin-top:auto}
.course-lessons{font-family:'Space Mono',monospace;font-size:.55rem;color:var(--muted);letter-spacing:.08em}
.course-price{font-family:'Playfair Display',serif;font-size:1.15rem;font-weight:900;color:var(--cream)}

/* ── MEMBERSHIP ── */
.plans-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);background:var(--line)}
.plan{background:var(--ink2);padding:2.5rem 2.2rem}
.plan.featured{background:var(--cream);color:var(--ink)}
.plan-name{font-family:'Space Mono',monospace;font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:.8rem}
.plan.featured .plan-name{color:#5a5650}
.plan-price{font-family:'Playfair Display',serif;font-size:4rem;font-weight:900;line-height:1;color:var(--cream)}
.plan.featured .plan-price{color:var(--ink)}
.plan-period{font-family:'Space Mono',monospace;font-size:.58rem;color:var(--muted);margin-bottom:2rem;letter-spacing:.1em}
.plan-features{list-style:none;display:flex;flex-direction:column;gap:.8rem;margin-bottom:2rem}
.plan-features li{font-size:.88rem;color:var(--muted);display:flex;align-items:flex-start;gap:.6rem;line-height:1.4}
.plan.featured .plan-features li{color:var(--ink2)}
.plan-features li::before{content:'—';color:var(--sand);flex-shrink:0}
.plan.featured .plan-features li::before{color:#9a9590}

/* ── CHATBOT ── */
.chatbot-bubble{position:fixed;bottom:2rem;right:2rem;z-index:500}
.chat-btn{width:60px;height:60px;background:var(--cream);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.5rem;transition:transform .2s}
.chat-btn:hover{transform:scale(1.08)}
.chat-window{display:none;position:absolute;bottom:75px;right:0;width:340px;background:var(--ink2);border:1px solid var(--line);flex-direction:column;max-height:480px}
.chat-window.open{display:flex}
.chat-header{background:var(--ink3);padding:1rem 1.2rem;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}
.chat-header-name{font-family:'Playfair Display',serif;font-size:1rem;font-weight:700}
.chat-header-sub{font-family:'Space Mono',monospace;font-size:.52rem;letter-spacing:.1em;color:var(--sand);margin-top:.1rem}
.chat-close{background:none;border:none;color:var(--muted);cursor:pointer;font-size:1.2rem}
.chat-messages{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.75rem;min-height:200px}
.msg{padding:.65rem .9rem;font-size:.88rem;line-height:1.5;max-width:88%}
.msg-bot{background:var(--ink3);color:var(--cream);align-self:flex-start}
.msg-user{background:var(--cream);color:var(--ink);align-self:flex-end}
.chat-input-wrap{border-top:1px solid var(--line);display:flex}
.chat-input{flex:1;background:transparent;border:none;padding:.85rem 1rem;color:var(--cream);font-family:'EB Garamond',serif;font-size:.95rem;outline:none}
.chat-input::placeholder{color:var(--muted)}
.chat-send{background:var(--cream);color:var(--ink);border:none;padding:.85rem 1.1rem;cursor:pointer;font-family:'Space Mono',monospace;font-size:.65rem}

/* ── FORMS ── */
.form-group{margin-bottom:1.4rem}
.form-label{font-family:'Space Mono',monospace;font-size:.58rem;letter-spacing:.15em;text-transform:uppercase;color:var(--sand);display:block;margin-bottom:.5rem}
.form-input,.form-select,.form-textarea{width:100%;background:var(--ink2);border:1px solid var(--line);color:var(--cream);padding:.8rem 1rem;font-family:'EB Garamond',serif;font-size:1rem;outline:none;transition:border-color .2s}
.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--sand)}
.form-input::placeholder{color:var(--muted)}
.form-textarea{resize:vertical;min-height:100px}
.form-select option{background:var(--ink2)}

/* ── NOTIFICATION ── */
.notif{display:none;position:fixed;top:1.5rem;right:1.5rem;background:var(--cream);color:var(--ink);padding:1rem 1.5rem;z-index:1000;font-family:'Space Mono',monospace;font-size:.7rem;letter-spacing:.1em;max-width:320px;border-left:4px solid #00c9a7}
.notif.show{display:block;animation:slideIn .3s ease}
@keyframes slideIn{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}

/* ── FOOTER ── */
footer{padding:4rem;background:var(--ink2);border-top:1px solid var(--line);display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:3rem}
.footer-logo-box{border:1.5px solid var(--sand);padding:.3rem .65rem;display:inline-grid;grid-template-columns:1fr 1fr;line-height:1.05;margin-bottom:.8rem}
.footer-logo-box span{font-family:'Playfair Display',serif;font-weight:900;font-size:1.1rem;color:var(--cream);display:block}
.footer-tagline{font-family:'Space Mono',monospace;font-size:.52rem;letter-spacing:.1em;color:var(--muted);line-height:1.6;margin-top:.4rem}
.footer-col h4{font-family:'Space Mono',monospace;font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--sand);margin-bottom:1.2rem;font-weight:400}
.footer-col a{display:block;color:var(--muted);text-decoration:none;font-size:.88rem;margin-bottom:.6rem;transition:color .2s}
.footer-col a:hover{color:var(--cream)}
.footer-social{display:flex;gap:1rem;margin-top:1rem}
.footer-social a{color:var(--muted);font-size:.88rem;text-decoration:none;font-family:'Space Mono',monospace;font-size:.6rem;letter-spacing:.1em;transition:color .2s}
.footer-social a:hover{color:var(--cream)}
.footer-bottom{grid-column:1/-1;border-top:1px solid var(--line);padding-top:1.5rem;display:flex;justify-content:space-between;align-items:center}
.footer-copy{font-family:'Space Mono',monospace;font-size:.55rem;letter-spacing:.1em;color:var(--muted)}

/* ── HERO STATS ── */
.hero-stats{display:flex;gap:3rem;margin-top:3rem;padding-top:2rem;border-top:1px solid var(--line)}
.hstat-num{font-family:'Playfair Display',serif;font-size:2.5rem;font-weight:900;color:var(--cream);line-height:1}
.hstat-label{font-family:'Space Mono',monospace;font-size:.55rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:.3rem}

/* ── EVENTS / MASTERCLASS ── */
.event-card{background:var(--ink2);border:1px solid var(--line);padding:2rem;display:grid;grid-template-columns:auto 1fr auto;gap:2rem;align-items:center;margin-bottom:1px;transition:background .2s}
.event-card:hover{background:var(--ink3)}
.event-date-box{text-align:center;min-width:64px}
.event-day{font-family:'Playfair Display',serif;font-size:2.5rem;font-weight:900;line-height:1;color:var(--cream)}
.event-month{font-family:'Space Mono',monospace;font-size:.55rem;letter-spacing:.18em;text-transform:uppercase;color:var(--sand)}
.event-title{font-family:'Playfair Display',serif;font-size:1.3rem;font-weight:700;color:var(--cream);margin-bottom:.3rem}
.event-meta{font-family:'Space Mono',monospace;font-size:.58rem;letter-spacing:.1em;color:var(--muted)}
.event-badge{font-family:'Space Mono',monospace;font-size:.55rem;letter-spacing:.12em;text-transform:uppercase;padding:.3rem .8rem;border:1px solid var(--line);color:var(--sand)}
.event-badge.free{border-color:#00c9a7;color:#00c9a7}

/* ── RESPONSIVE ── */
@media(max-width:900px){
  nav{padding:1rem 1.5rem}
  .nav-links{display:none}
  .section{padding:3.5rem 1.5rem}
  .courses-grid{grid-template-columns:1fr 1fr}
  .course-card:nth-child(2){border-right:none}
  .course-card:nth-child(3){border-right:1px solid var(--line)}
  .course-card:nth-child(4){border-right:none}
  footer{grid-template-columns:1fr 1fr;gap:2rem;padding:2.5rem 1.5rem}
  .footer-bottom{flex-direction:column;gap:1rem;text-align:center}
  .plans-grid{grid-template-columns:1fr}
  .nav-hamburger{display:block}
}
@media(max-width:600px){
  .courses-grid{grid-template-columns:1fr}
  .course-card{border-right:none!important;border-bottom:1px solid var(--line)}
  footer{grid-template-columns:1fr}
  .chat-window{width:300px}
}
