/* ============================================================
   Beso Provider Hub — shared.css
   Common styles included by every page.
   Page-specific styles remain in each page's <style> block.
   ============================================================ */

/* RESET */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}

/* TOKENS */
:root{
  --white:#FFFFFF;--off-white:#F8F6F3;--surface:#F2EEE9;--border:#E4DDD6;
  --text-dark:#1C1917;--text-mid:#57534E;--text-light:#A8A29E;
  --purple:#7B3FA0;--purple-deep:#5A2D7A;--purple-soft:#EDE4F5;
  --gold:#C8A97E;--gold-light:#F5EFE6;--ink:#100E0C;
}

/* BASE */
html{scroll-behavior:smooth;}
body{font-family:'Outfit',sans-serif;background:var(--white);color:var(--text-dark);overflow-x:hidden;}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:200;height:68px;display:flex;align-items:center;padding:0 80px;background:rgba(255,255,255,0.93);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);transition:box-shadow 0.3s;}
.nav-inner{width:100%;max-width:1280px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;}
.nav-logo{text-decoration:none;display:flex;flex-direction:column;line-height:1.15;}
.nav-logo span:first-child{font-family:'Cormorant Garamond',serif;font-size:1.2rem;font-weight:500;color:var(--text-dark);}
.nav-logo span:last-child{font-size:0.58rem;font-weight:600;letter-spacing:0.22em;text-transform:uppercase;color:var(--purple);}
.nav-links{display:flex;align-items:center;gap:30px;list-style:none;}
.nav-links a{font-size:0.79rem;font-weight:500;color:var(--text-mid);text-decoration:none;transition:color 0.2s;}
.nav-links a:hover,.nav-links a.active{color:var(--purple);}
.nav-cta{background:var(--purple)!important;color:var(--white)!important;padding:9px 22px!important;border-radius:2px!important;font-size:0.74rem!important;letter-spacing:0.05em!important;}
.nav-cta:hover{background:var(--purple-deep)!important;}

/* LAYOUT */
.container{max-width:1280px;margin:0 auto;padding:0 80px;}

/* TYPOGRAPHY HELPERS */
.kicker{font-size:0.65rem;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;color:var(--purple);}
/* courses.html uses .label — same visual purpose */
.label{font-size:0.7rem;font-weight:600;letter-spacing:0.18em;text-transform:uppercase;color:var(--purple);}
/* display serif used on courses.html */
.display{font-family:'Cormorant Garamond',serif;font-weight:300;line-height:1.05;letter-spacing:-0.01em;}
.gold-rule{width:40px;height:1px;background:var(--gold);margin:18px 0;}

/* BUTTONS */
.btn-primary{display:inline-flex;align-items:center;gap:10px;background:var(--purple);color:var(--white);padding:14px 32px;border-radius:2px;font-size:0.8rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;text-decoration:none;transition:background 0.25s,transform 0.2s;}
.btn-primary:hover{background:var(--purple-deep);transform:translateY(-1px);}
.btn-outline{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);color:var(--text-dark);padding:13px 28px;border-radius:2px;font-size:0.78rem;font-weight:500;letter-spacing:0.07em;text-transform:uppercase;text-decoration:none;transition:all 0.2s;}
.btn-outline:hover{border-color:var(--purple);color:var(--purple);}
.btn-gold{display:inline-flex;align-items:center;gap:9px;background:var(--gold);color:var(--ink);padding:13px 30px;border-radius:2px;font-size:0.76rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;text-decoration:none;transition:opacity 0.2s;}
.btn-gold:hover{opacity:0.88;}
.btn-ink{display:inline-flex;align-items:center;gap:9px;background:var(--ink);color:var(--white);padding:13px 30px;border-radius:2px;font-size:0.76rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;text-decoration:none;transition:opacity 0.2s;}
.btn-ink:hover{opacity:0.82;}
.btn-ghost{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);color:var(--text-dark);padding:12px 26px;border-radius:2px;font-size:0.74rem;font-weight:500;letter-spacing:0.07em;text-transform:uppercase;text-decoration:none;transition:all 0.2s;}
.btn-ghost:hover{border-color:var(--purple);color:var(--purple);}
.btn-ghost-light{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,0.22);color:rgba(255,255,255,0.72);padding:12px 26px;border-radius:2px;font-size:0.74rem;font-weight:500;letter-spacing:0.07em;text-transform:uppercase;text-decoration:none;transition:all 0.2s;}
.btn-ghost-light:hover{border-color:rgba(255,255,255,0.6);color:var(--white);}

/* CITIES SERVED */
.cities-served{font-size:0.82rem;font-weight:300;color:var(--text-light);line-height:1.75;margin-top:12px;border-top:1px solid var(--border);padding-top:12px;}
.cities-served a{color:var(--purple);text-decoration:none;border-bottom:1px solid rgba(123,63,160,0.2);}
.cities-served a:hover{border-color:var(--purple);}

/* FOOTER */
footer{background:var(--ink);color:var(--white);padding:64px 0 32px;}
.footer-inner{max-width:1280px;margin:0 auto;padding:0 80px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:48px;padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,0.07);margin-bottom:32px;}
.fbrand-name{font-family:'Cormorant Garamond',serif;font-size:1.25rem;font-weight:500;color:var(--white);}
.fbrand-tag{font-size:0.56rem;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold);margin-top:3px;}
.fbrand-desc{margin-top:16px;font-size:0.8rem;font-weight:300;color:rgba(255,255,255,0.4);line-height:1.8;}
.fcol-head{font-size:0.6rem;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);margin-bottom:18px;}
.fcol ul{list-style:none;display:flex;flex-direction:column;gap:9px;}
.fcol ul a{font-size:0.8rem;font-weight:300;color:rgba(255,255,255,0.45);text-decoration:none;transition:color 0.2s;}
.fcol ul a:hover{color:var(--white);}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;}
.footer-copy{font-size:0.72rem;color:rgba(255,255,255,0.48);}
.footer-legal{display:flex;gap:22px;}
.footer-legal a{font-size:0.7rem;color:rgba(255,255,255,0.48);text-decoration:none;}
.footer-legal a:hover{color:rgba(255,255,255,0.55);}

/* HAMBURGER BUTTON */
.nav-hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;padding:8px;background:none;border:none;cursor:pointer;flex-shrink:0;}
.nav-hamburger span{display:block;width:22px;height:1.5px;background:var(--text-dark);transition:transform 0.25s,opacity 0.2s;}
.nav-hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg);}
.nav-hamburger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav-hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg);}

/* MOBILE NAV PANEL */
.mobile-nav{display:none;position:fixed;top:68px;left:0;right:0;z-index:199;background:var(--white);border-bottom:1px solid var(--border);padding:16px 24px 24px;box-shadow:0 8px 24px rgba(0,0,0,0.08);}
.mobile-nav.is-open{display:block;}
.mobile-nav ul{list-style:none;display:flex;flex-direction:column;gap:0;}
.mobile-nav ul li a{display:block;font-size:0.9rem;font-weight:500;color:var(--text-mid);text-decoration:none;padding:13px 0;border-bottom:1px solid var(--border);transition:color 0.2s;}
.mobile-nav ul li:last-child a{border-bottom:none;}
.mobile-nav ul li a:hover,.mobile-nav ul li a.active{color:var(--purple);}
.mobile-nav ul li a.nav-cta{color:var(--purple);font-weight:600;}

/* RESPONSIVE — nav & container only (page sections handled per-page) */
@media(max-width:1024px){
  nav{padding:0 40px;}
  .container{padding:0 40px;}
  .footer-inner{padding:0 40px;}
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px;}
}
@media(max-width:640px){
  nav{padding:0 24px;}
  .nav-links{display:none;}
  .nav-hamburger{display:flex;}
  .container{padding:0 24px;}
  .footer-inner{padding:0 24px;}
  .footer-grid{grid-template-columns:1fr;}
}