/* ================================================================
   ACADEMY PREPARATORY — global.css
   Shared base styles: design tokens, reset, utilities, header,
   footer, back-to-top, scroll-reveal, buttons, forms.
   Loaded on every page via wp_enqueue_scripts.
   ================================================================ */

/* ── DESIGN TOKENS ───────────────────────────────────────────── */
:root {
  --primary:         #fcbe15;
  --primary-dark:    #e0a800;
  --primary-pale:    rgba(252,190,21,.12);
  --secondary:       #874667;
  --secondary-light: #a3587e;
  --secondary-dark:  #6b3652;
  --secondary-pale:  rgba(135,70,103,.08);
  --neutral:         #e1e1e1;
  --neutral-mid:     #c8c8c8;
  --white:           #ffffff;
  --text:            #1e1e1e;
  --text-mid:        #444444;
  --text-light:      #6b6b6b;
  --bg:              #fafaf8;
  --bg-alt:          #f3f1ed;
  --success:         #16a34a;
  --error:           #dc2626;
  --radius:          14px;
  --radius-sm:       8px;
  --radius-xs:       5px;
  --shadow-sm:       0 2px 12px rgba(0,0,0,.07);
  --shadow:          0 6px 28px rgba(0,0,0,.09);
  --shadow-lg:       0 16px 52px rgba(0,0,0,.13);
  --shadow-xl:       0 28px 72px rgba(0,0,0,.18);
  --ease:            cubic-bezier(.4,0,.2,1);
  --t:               .32s;
  --transition:      var(--t) var(--ease);
  --header-h:        76px;
  --font:            'Poppins', sans-serif;
  --max-w:           1260px;
}

/* ── RESET ───────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; -webkit-text-size-adjust:100%; }
body { font-family:var(--font); background:var(--bg); color:var(--text); line-height:1.7; overflow-x:hidden; }
img  { display:block; width:100%; height:100%; object-fit:cover; }
a    { text-decoration:none; color:inherit; }
ul   { list-style:none; }
address { font-style:normal; }
button  { font-family:var(--font); cursor:pointer; border:none; background:none; }
.container { width:100%; max-width:var(--max-w); margin:0 auto; padding:0 28px; }
.section   { padding:96px 0; }
.sr-only   { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }

/* ── WORDPRESS ADMIN BAR ─────────────────────────────────────── */
.admin-bar .header { top:32px; }
@media screen and (max-width:782px) { .admin-bar .header { top:46px; } }

/* ── SCROLL REVEAL ───────────────────────────────────────────── */
.reveal { opacity:0; transform:translateY(28px); transition:opacity .6s var(--ease),transform .6s var(--ease); }
.reveal.in { opacity:1; transform:translateY(0); }

/* ── BUTTONS ─────────────────────────────────────────────────── */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:11px 26px; border-radius:50px; font-size:.875rem; font-weight:600; letter-spacing:.025em; border:2px solid transparent; transition:var(--transition); white-space:nowrap; cursor:pointer; font-family:var(--font); }
.btn--lg  { padding:15px 34px; font-size:.95rem; }
.btn--sm  { padding:7px 18px;  font-size:.8rem; }
.btn--primary   { background:var(--primary); color:var(--secondary-dark); border-color:var(--primary); }
.btn--primary:hover { background:var(--primary-dark); border-color:var(--primary-dark); transform:translateY(-2px); box-shadow:0 8px 22px rgba(252,190,21,.38); }
.btn--secondary { background:var(--secondary); color:var(--white); border-color:var(--secondary); }
.btn--secondary:hover { background:var(--secondary-dark); transform:translateY(-2px); box-shadow:var(--shadow); }
.btn--ghost     { background:transparent; color:var(--white); border-color:rgba(255,255,255,.55); }
.btn--ghost:hover { background:rgba(255,255,255,.12); border-color:var(--white); transform:translateY(-2px); }
.btn--white     { background:var(--white); color:var(--secondary); border-color:var(--white); }
.btn--white:hover { background:var(--bg-alt); transform:translateY(-2px); }
.btn--outline-sec { background:transparent; color:var(--secondary); border-color:var(--secondary); }
.btn--outline-sec:hover { background:var(--secondary); color:var(--white); transform:translateY(-2px); }

/* ── SECTION CHROME ──────────────────────────────────────────── */
.section-label { display:inline-block; background:var(--secondary-pale); color:var(--secondary); font-size:.7rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; padding:5px 14px; border-radius:50px; margin-bottom:14px; }
.section-label--light { background:rgba(255,255,255,.15); color:var(--white); }
.section-title { font-size:clamp(1.75rem,3.2vw,2.6rem); font-weight:800; line-height:1.18; color:var(--text); margin-bottom:14px; }
.section-title--light { color:var(--white); }
.section-title em { font-style:normal; color:var(--secondary); }
.section-desc { font-size:1rem; color:var(--text-light); max-width:580px; margin:0 auto; }
.section-desc--light { color:rgba(255,255,255,.7); }
.section-header { text-align:center; margin-bottom:56px; }
.breadcrumb { display:flex; align-items:center; gap:8px; font-size:.76rem; font-weight:500; color:rgba(255,255,255,.6); margin-bottom:22px; }
.breadcrumb a { color:rgba(255,255,255,.6); transition:color var(--transition); }
.breadcrumb a:hover { color:var(--primary); }
.breadcrumb span:last-child { color:var(--primary); }

/* ================================================================
   SHARED HEADER
   ================================================================ */
.header { position:fixed; top:0; left:0; right:0; z-index:1000; height:var(--header-h); transition:background var(--transition),box-shadow var(--transition),height var(--transition); }
.header.scrolled { background:var(--white); box-shadow:0 2px 24px rgba(0,0,0,.1); height:62px; }
.header__inner { display:flex; align-items:center; height:100%; gap:20px; }

/* Logo */
.logo { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.logo__emblem { flex-shrink:0; }
.logo__text { display:flex; flex-direction:column; line-height:1.18; }
.logo__name { font-size:.97rem; font-weight:800; color:var(--white); transition:color var(--transition); }
.logo__sub  { font-size:.66rem; font-weight:500; color:rgba(255,255,255,.7); letter-spacing:.1em; text-transform:uppercase; transition:color var(--transition); }
.header.scrolled .logo__name { color:var(--secondary); }
.header.scrolled .logo__sub  { color:var(--text-light); }
.logo__name--light { color:var(--white)!important; }
.logo__sub--light  { color:rgba(255,255,255,.6)!important; }
.logo__emblem img {
  width: 40px;   /* adjust size here */
  height: auto;  /* keeps proportion */
  display: block;
}

/* Nav */
.nav { margin-left:auto; }
.nav__list { display:flex; align-items:center; gap:2px; }
.nav__item { position:relative; }
.nav__item--active > .nav__link,
.nav__item--active > .nav__link--drop { color:var(--primary)!important; }
/* Active page: show the underline indicator permanently */
.nav__item--active > .nav__link::after,
.nav__item--active > .nav__link--drop::after { transform:translateX(-50%) scaleX(1); }
.nav__link, .nav__link--drop { display:flex; align-items:center; gap:4px; padding:8px 9px; font-size:.79rem; font-weight:500; color:rgba(255,255,255,.88); border-radius:var(--radius-xs); transition:var(--transition); background:none; border:none; white-space:nowrap; cursor:pointer; position:relative; }
.nav__link::after, .nav__link--drop::after { content:''; position:absolute; bottom:3px; left:50%; transform:translateX(-50%) scaleX(0); width:calc(100% - 22px); height:2px; background:var(--primary); border-radius:2px; transition:transform var(--transition); }
.nav__link:hover, .nav__link--drop:hover { color:var(--white); }
.nav__link:hover::after, .nav__link--drop:hover::after { transform:translateX(-50%) scaleX(1); }
.header.scrolled .nav__link, .header.scrolled .nav__link--drop { color:var(--text-mid); }
.header.scrolled .nav__link:hover, .header.scrolled .nav__link--drop:hover { color:var(--secondary); }
.nav__chevron { font-size:.7rem; transition:transform var(--transition); display:inline-block; }
.nav__item--dropdown:hover .nav__chevron,
.nav__item--dropdown.open .nav__chevron { transform:rotate(180deg); }

/* Dropdown */
.dropdown { position:absolute; top:100%; left:50%; transform:translateX(-50%) translateY(-10px); min-width:220px; background:var(--white); border-radius:var(--radius); box-shadow:0 12px 40px rgba(0,0,0,.14),0 2px 8px rgba(0,0,0,.06); border:1px solid rgba(0,0,0,.07); padding-top:8px; opacity:0; pointer-events:none; visibility:hidden; transition:opacity .22s var(--ease),transform .22s var(--ease),visibility .22s; z-index:9999; }
.dropdown::before { content:''; position:absolute; top:0; left:50%; transform:translateX(-50%); width:12px; height:8px; background:var(--white); clip-path:polygon(50% 0%,0% 100%,100% 100%); }
.nav__item--dropdown:hover > .dropdown,
.nav__item--dropdown.open > .dropdown { opacity:1; transform:translateX(-50%) translateY(0); pointer-events:auto; visibility:visible; }
.dropdown__list { padding:6px 0; }
.dropdown__list li a { display:block; padding:9px 20px; font-size:.82rem; font-weight:500; color:var(--text-mid); white-space:nowrap; transition:background var(--transition),color var(--transition),padding-left var(--transition); }
.dropdown__list li a:hover { background:var(--secondary-pale); color:var(--secondary); padding-left:26px; }

/* Hamburger */
.hamburger { display:none; flex-direction:column; justify-content:center; gap:5px; width:44px; height:44px; cursor:pointer; margin-left:8px; padding:8px; flex-shrink:0; }
.hamburger span { display:block; height:2px; background:var(--white); border-radius:2px; transition:var(--transition); }
.header.scrolled .hamburger span { background:var(--text); }
.hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity:0; transform:scaleX(0); }
.hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
.header__cta { flex-shrink:0; }

/* ================================================================
   SHARED FOOTER
   ================================================================ */
.footer { background:#180c14; }
.footer__top { padding:76px 0 56px; }
.footer__top-inner { display:grid; grid-template-columns:1.8fr 1fr 1fr 1fr 1.4fr; gap:36px; }
.footer__brand .logo { margin-bottom:18px; }
.footer__tagline { font-size:.83rem; color:rgba(255,255,255,.5); line-height:1.72; max-width:240px; margin-bottom:24px; }
.footer__socials { display:flex; gap:8px; }
.footer__social { width:36px; height:36px; border-radius:var(--radius-xs); background:rgba(255,255,255,.07); color:rgba(255,255,255,.65); display:flex; align-items:center; justify-content:center; transition:var(--transition); }
.footer__social:hover { transform:translateY(-3px); }
.footer__social--fb:hover  { background:#1877f2; color:var(--white); }
.footer__social--ig:hover  { background:linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888); color:var(--white); }
.footer__social--li:hover  { background:#0a66c2; color:var(--white); }
.footer__social--yt:hover  { background:#ff0000; color:var(--white); }
.footer__col-title { font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--white); margin-bottom:16px; }
.footer__col-title--spaced { margin-top:28px; }
.footer__links { display:flex; flex-direction:column; gap:8px; }
.footer__links a { font-size:.82rem; color:rgba(255,255,255,.5); transition:color var(--transition),padding-left var(--transition); }
.footer__links a:hover { color:var(--primary); padding-left:4px; }
.footer__address { display:flex; flex-direction:column; gap:12px; margin-bottom:20px; }
.footer__contact-item { display:flex; align-items:flex-start; gap:10px; font-size:.82rem; color:rgba(255,255,255,.5); }
.footer__contact-icon { flex-shrink:0; margin-top:2px; color:var(--primary); }
.footer__hours-label { display:block; font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--primary); margin-bottom:2px; }
.footer__cta-btn { width:100%; justify-content:center; margin-top:4px; }
.footer__bottom { border-top:1px solid rgba(255,255,255,.07); padding:22px 0; }
.footer__bottom-inner { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; }
.footer__bottom p { font-size:.78rem; color:rgba(255,255,255,.3); }
.footer__legal { display:flex; gap:20px; }
.footer__legal a { font-size:.78rem; color:rgba(255,255,255,.3); transition:color var(--transition); }
.footer__legal a:hover { color:var(--primary); }

/* ================================================================
   BACK TO TOP
   ================================================================ */
.back-to-top { position:fixed; bottom:32px; right:32px; width:52px; height:52px; z-index:997; cursor:pointer; display:flex; align-items:center; justify-content:center; opacity:0; transform:translateY(14px); transition:opacity .3s ease,transform .3s ease; pointer-events:none; }
.back-to-top.visible { opacity:1; transform:translateY(0); pointer-events:auto; }
.back-to-top:hover { transform:translateY(-2px)!important; }
.btt__ring { position:absolute; inset:0; transform:rotate(-90deg); }
.btt__track { fill:var(--white); stroke:var(--neutral-mid); stroke-width:3; filter:drop-shadow(0 2px 8px rgba(0,0,0,.14)); }
.btt__fill  { fill:none; stroke:var(--primary); stroke-width:3; stroke-linecap:round; stroke-dasharray:138.23; stroke-dashoffset:138.23; transition:stroke-dashoffset .12s linear; }
.btt__arrow { position:relative; z-index:2; font-size:1.05rem; color:var(--secondary); font-weight:700; }

/* ================================================================
   WORDPRESS CONTENT AREA
   ================================================================ */
.wp-default-content { padding-top:calc(var(--header-h) + 60px); padding-bottom:80px; min-height:70vh; }
.wp-caption { max-width:100%; }
.wp-caption-text { font-size:.85rem; color:var(--text-light); text-align:center; margin-top:6px; }
.alignleft   { float:left;  margin-right:20px; margin-bottom:10px; }
.alignright  { float:right; margin-left:20px;  margin-bottom:10px; }
.aligncenter { display:block; margin:0 auto; }

/* ================================================================
   RESPONSIVE — GLOBAL
   ================================================================ */
@media (max-width:1140px) {
  .footer__top-inner { grid-template-columns:1fr 1fr 1fr; }
  .footer__brand { grid-column:span 3; }
}
@media (max-width:1080px) {
  /* Shrink nav links so CTA button stays visible on smaller desktops */
  .nav__list { gap:0; }
  .nav__link, .nav__link--drop { padding:7px 7px; font-size:.75rem; }
  .header__cta { padding:9px 16px; font-size:.8rem; }
  .btn--primary.header__cta { padding:9px 18px; font-size:.8rem; }
}
@media (max-width:860px) {
  .footer__top-inner { grid-template-columns:1fr 1fr; }
  .footer__brand, .footer__col--contact { grid-column:span 2; }
}
@media (max-width:768px) {
  :root { --header-h:62px; }
  .section { padding:68px 0; }
  .container { padding:0 18px; }
  /* Always show a solid background on mobile — header starts transparent on desktop hero
     but on mobile there is no hero overlay, so it must always be opaque & sticky */
  .header {
    position: fixed;
    background: var(--white);
    box-shadow: 0 2px 16px rgba(0,0,0,.10);
  }
  .header .logo__name { color: var(--secondary); }
  .header .logo__sub  { color: var(--text-light); }
  .header .hamburger span { background: var(--text); }
  .header .nav__link,
  .header .nav__link--drop { color: var(--text); }
  .nav {
    position:fixed; top:var(--header-h); left:0; right:0;
    background:var(--white); box-shadow:0 8px 30px rgba(0,0,0,.14);
    padding:12px 0 20px; max-height:calc(100vh - var(--header-h));
    overflow-y:auto; transform:translateY(-8px); opacity:0;
    pointer-events:none; transition:opacity var(--transition), transform var(--transition);
    z-index:999;
  }
  .nav.open { transform:translateY(0); opacity:1; pointer-events:auto; }
  .nav__list { flex-direction:column; gap:0; padding:0 8px; }
  .nav__item { border-bottom:1px solid var(--neutral); }
  .nav__item:last-child { border-bottom:none; }
  .nav__link, .nav__link--drop { display:flex; width:100%; padding:13px 16px; color:var(--text); font-size:.9rem; border-radius:0; justify-content:space-between; }
  .nav__link::after, .nav__link--drop::after { display:none; }
  .dropdown { position:static!important; transform:none!important; box-shadow:none!important; border:none!important; border-radius:0!important; background:var(--bg-alt); opacity:1!important; visibility:visible!important; pointer-events:auto!important; padding-top:0!important; max-height:0; overflow:hidden; transition:max-height .35s var(--ease)!important; }
  .dropdown::before { display:none!important; }
  .nav__item--dropdown.open > .dropdown { max-height:440px; }
  .dropdown__list li a { padding:10px 32px; font-size:.83rem; }
  .hamburger { display:flex; }
  .header__cta { display:none; }
  .footer__top-inner { grid-template-columns:1fr; }
  .footer__brand, .footer__col--contact { grid-column:span 1; }
  .footer__bottom-inner { flex-direction:column; align-items:flex-start; }
  .back-to-top { bottom:18px; right:18px; }
  /* Ensure hero content on ALL pages clears the fixed header on mobile */
  .hero__content { padding-top: calc(var(--header-h) + 32px) !important; }
  /* Hamburger: extra right spacing so it's not flush with screen edge */
  .hamburger { margin-right:4px; }
}

/* WordPress/theme safeguard: hidden elements must never display until JS removes hidden */
[hidden] { display: none !important; }