/* À Mesa — site (Home B / Angular direction) shared styles.
   Linked by every page after styles.css (which provides the brand tokens). */

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink-950);color:var(--text);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.disp{font-family:var(--font-display);text-transform:uppercase;letter-spacing:-.015em;line-height:.9}
.wrap{max-width:1240px;margin:0 auto;padding:0 40px}
.eyebrow{font-family:var(--font-sans);text-transform:uppercase;font-weight:600;letter-spacing:.28em;font-size:12px;color:var(--accent-text)}

/* angled buttons (Vale-style parallelogram) */
.btn{position:relative;display:inline-flex;align-items:center;gap:10px;font-family:var(--font-sans);font-weight:700;text-transform:uppercase;letter-spacing:.09em;font-size:13px;padding:15px 30px;cursor:pointer;transition:all var(--dur-fast) var(--ease-out);border:0;clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%)}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-hover)}
.btn-ghost{background:#fff;color:var(--ink-950)}
.btn-ghost:hover{background:var(--ghost)}
.btn-out{background:transparent;color:#fff;box-shadow:inset 0 0 0 2px var(--line-strong);clip-path:none}
.btn-out:hover{box-shadow:inset 0 0 0 2px #fff}

/* announcement */
.anno{background:var(--accent);color:#fff;font-size:12px;position:relative;z-index:50}
.anno .wrap{display:flex;align-items:center;justify-content:center;gap:12px;padding:9px 40px;text-align:center}
.anno .lbl{font-weight:800;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}
.anno .txt{opacity:.9}

/* header */
header.site{position:sticky;top:0;z-index:40;background:rgba(8,8,15,.9);backdrop-filter:blur(12px)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:40px;padding:16px 40px}
header.site .logo{height:34px;width:auto}
nav.main{display:flex;align-items:center;gap:26px;margin:0 auto}
nav.main a{font-size:12.5px;color:var(--text);text-transform:uppercase;letter-spacing:.14em;font-weight:600;transition:color var(--dur-fast);white-space:nowrap}
nav.main a:hover,nav.main a[aria-current="page"]{color:var(--accent-text)}
.navcta{display:flex;align-items:center;gap:16px}
.burger{display:none;background:var(--accent);border:0;color:#fff;font-size:20px;cursor:pointer;width:44px;height:44px}

/* mobile drawer */
.drawer{position:fixed;inset:0;z-index:60;background:rgba(8,8,14,.98);backdrop-filter:blur(6px);display:none;flex-direction:column;padding:26px}
.drawer.open{display:flex}
.drawer .x{align-self:flex-end;background:none;border:0;color:#fff;font-size:32px;cursor:pointer;line-height:1}
.drawer nav{display:flex;flex-direction:column;gap:6px;margin-top:20px}
.drawer nav a{font-family:var(--font-display);text-transform:uppercase;font-size:34px;color:#fff;padding:10px 0;border-bottom:1px solid var(--line-soft)}
.drawer nav a:active{color:var(--accent-text)}
.drawer .btn{margin-top:28px;justify-content:center}

/* ---- internal page hero (compact banner) ---- */
.page-hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line-soft)}
.page-hero .bg{position:absolute;inset:0;z-index:0}
.page-hero .bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05) brightness(.55)}
.page-hero .scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(8,8,14,.55),rgba(8,8,14,.9))}
.page-hero .wedge{position:absolute;left:0;bottom:0;width:52%;height:90px;background:var(--accent);z-index:2;clip-path:polygon(0 45%,100% 0,100% 100%,0 100%)}
.page-hero .content{position:relative;z-index:3;padding:96px 0 92px}
.page-hero h1{margin:16px 0 0;font-size:82px;color:#fff}
.page-hero p{margin:20px 0 0;font-size:18px;line-height:1.6;color:#e7e7ec;max-width:52ch}
.crumbs{font-size:11px;text-transform:uppercase;letter-spacing:.2em;color:var(--text-muted);margin-bottom:6px}
.crumbs a:hover{color:var(--accent-text)}

/* section helpers */
section.pad{padding:100px 0}
.shead h2{font-size:48px;color:#fff;margin:14px 0 0}
.shead p{font-size:17px;line-height:1.65;color:var(--text-muted);margin:20px 0 0;max-width:60ch}
.lead{font-size:19px;line-height:1.7;color:var(--text);max-width:60ch}
.muted{color:var(--text-muted)}

/* schedule rows (shared) */
.sched{display:flex;flex-direction:column}
.srow{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:22px 0;border-bottom:1px solid var(--line)}
.srow:first-child{border-top:1px solid var(--line)}
.srow .d{font-family:var(--font-display);text-transform:uppercase;font-size:24px;color:#fff}
.srow .h{font-size:16px;color:var(--accent-text);font-weight:700;letter-spacing:.05em}
.srow .p{font-size:12px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.14em}

/* footer */
footer.site{background:#05050a;padding:76px 0 40px}
footer.site .top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
footer.site .logo{height:40px;margin-bottom:20px}
footer.site .bio{font-size:14px;line-height:1.6;color:var(--text-muted);max-width:32ch}
footer.site h5{font-family:var(--font-sans);text-transform:uppercase;letter-spacing:.2em;font-size:11px;color:var(--text-faint);margin:0 0 18px}
footer.site .fnav a{display:block;font-size:14px;color:var(--text);padding:6px 0;transition:color var(--dur-fast)}
footer.site .fnav a:hover{color:var(--accent-text)}
footer.site .bottom{display:flex;align-items:center;justify-content:space-between;margin-top:56px;padding-top:26px;border-top:1px solid var(--line-soft);font-size:12px;color:var(--text-faint);flex-wrap:wrap;gap:14px}
footer.site .social{display:flex;gap:20px}
footer.site .social a{text-transform:uppercase;letter-spacing:.14em;font-size:11px}
footer.site .social a:hover{color:var(--accent-text)}

@media(max-width:1024px){
  .page-hero h1{font-size:60px}
  .shead h2{font-size:38px}
  footer.site .top{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  .wrap{padding:0 22px}
  nav.main,.navcta .btn{display:none}
  .burger{display:flex;align-items:center;justify-content:center}
  .page-hero h1{font-size:44px}
  .page-hero .content{padding:64px 0 60px}
  section.pad{padding:64px 0}
  .anno .txt{display:none}
  footer.site .top{grid-template-columns:1fr}
}