/* GP Coaching site styles. Tokens live in design-tokens.css. */

/* Base */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:110px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body);font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
button{font:inherit;-webkit-tap-highlight-color:transparent}
p{margin:0 0 1em}
h1,h2,h3{font-family:var(--display);font-weight:300;letter-spacing:-.02em;color:var(--text-strong);margin:0;text-wrap:balance}
[hidden]{display:none!important}
::selection{background:var(--gold);color:var(--bg)}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.wrap{width:min(var(--max),100% - 2*var(--gutter));margin-inline:auto}
.accent{color:inherit} /* headings stay one colour; the span only sets the line break */
.muted{color:var(--muted)}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip-link{position:fixed;z-index:100;left:16px;top:12px;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;background:var(--gold);color:var(--bg);font-weight:700}
.skip-link:focus{width:auto;height:auto;overflow:visible;clip-path:none;padding:14px 18px}
.ui-icon{width:14px;height:14px;stroke:currentColor;stroke-width:1.5;fill:none;flex-shrink:0}

/* Labels */
.eyebrow{font-family:var(--body);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin:0}
.eyebrow{display:flex;align-items:center;gap:12px}
.eyebrow::before{content:'';width:24px;height:1px;background:currentColor;flex-shrink:0}

/* Buttons */
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:20px;min-height:52px;padding:15px 22px;background:var(--gold);border:1px solid var(--gold);border-radius:var(--radius);color:#0b0a08;font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;transition:background-color .2s,border-color .2s}
.button:hover{background:var(--gold-hover);border-color:var(--gold-hover)}
.button.outline{background:transparent;color:var(--text);border-color:var(--line-strong)}
.button.outline:hover{background:var(--surface-raised);border-color:var(--gold)}

/* Logo artwork: originals are unchanged; viewports hide only surplus black canvas. */

/* Header */
.top{position:sticky;top:0;z-index:30;background:rgba(8,8,7,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:32px;min-height:72px}
.brand{display:flex;align-items:center;gap:12px;min-height:44px;white-space:nowrap;font-family:var(--display);font-size:21px;letter-spacing:.03em;color:var(--text-strong);text-decoration:none}
.brand img{width:36px;height:36px}
.navlinks{display:flex;gap:32px;margin-left:auto;font-size:15px;color:var(--muted)}
.navlinks a,.mobile-menu a,.footer a{transition:color .18s}
.navlinks a:hover,.mobile-menu a:hover,.footer a:hover{color:var(--gold)}
.nav-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
.navlinks+.nav-actions{margin-left:0}
.nav-apply{min-height:42px;padding:0 20px;gap:12px;font-size:13px}
.cta-short{display:none}
.menu{min-height:44px;padding:10px 14px;background:none;border:1px solid var(--line-strong);border-radius:var(--radius);color:var(--text);font-size:12px;letter-spacing:.06em;cursor:pointer}
.mobile-menu{padding-block:4px 20px}
.mobile-menu a{display:flex;align-items:center;min-height:52px;border-bottom:1px solid var(--line);font-size:15px}

/* Hero */
.hero{padding:72px 0 0}
.hero-grid{display:grid;grid-template-columns:1.45fr 1fr;gap:56px;align-items:center}
.hero h1{font-size:clamp(46px,6.2vw,88px);line-height:1.04;letter-spacing:-.035em;margin:26px 0;max-width:12ch}
.hero h1 .accent{display:block}
.intro{font-size:18px;line-height:1.75;color:var(--muted);max-width:540px;margin-bottom:34px}
.actions{display:flex;flex-wrap:wrap;gap:12px}

/* Sections */

.faq p{color:var(--muted);font-size:15px;line-height:1.75}

.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:64px}

.step{padding-top:24px;border-top:1px solid var(--line)}
.step h3{font-size:25px;margin:28px 0 10px}
.step p:last-child{margin:0}

.faq details{border-bottom:1px solid var(--line)}
.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:44px;padding:20px 0;cursor:pointer;list-style:none;font-size:17px;color:var(--text-strong)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';color:var(--gold);font-size:24px;line-height:1;flex-shrink:0}
.faq details[open] summary::after{content:'\2212'}
.faq summary:hover{color:var(--gold)}
.faq p{margin:0;padding:0 40px 24px 0}

/* Footer */
.footer{background:#000;padding:56px 0 28px;border-top:1px solid var(--line)}

.footer-bottom{display:flex;justify-content:space-between;gap:18px;padding-top:22px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
.footer-bottom a{display:inline-flex;align-items:center;min-height:44px;min-width:44px;color:var(--muted)}

/* Apply page */

.legal a:not(.button){color:var(--gold);text-decoration:underline;text-underline-offset:4px}

/* Legal page */
.legal{max-width:780px;padding:72px 0 96px}
.legal h1{font-size:clamp(46px,6vw,70px);line-height:1.05;margin:24px 0 32px}
.legal h1 .accent{display:block}
.legal h2{font-size:30px;margin:44px 0 14px}
.legal p,.legal li{font-size:16px;color:var(--muted);line-height:1.8}
.legal strong{color:var(--text)}
.legal ul{padding-left:20px;margin:0 0 1em}
.legal li{margin-bottom:6px}
.legal .button{margin-top:28px}
.updated{font-size:14px!important}

/* The menu button is only for narrow screens; wide screens show the inline links. */
@media (min-width:851px){.menu{display:none}}

/* Tablet */
@media (max-width:1050px){
  .nav{gap:20px}
  .navlinks{gap:18px;font-size:12px}
  .brand{width:180px}
  .hero-grid{gap:32px}

}

/* Small tablet and phone: menu replaces inline links */
@media (max-width:850px){
  html{scroll-padding-top:90px}
  .nav{min-height:80px}
  .brand{width:160px}
  .js .navlinks{display:none}
  .navlinks{margin-left:auto}
  .hero{padding-top:44px}
  .hero-grid{grid-template-columns:1fr;gap:36px}

  .principles{grid-template-columns:1fr;gap:0;margin-top:40px}

}

/* Phone */
@media (max-width:540px){
  .nav{min-height:72px}
  .brand{width:132px}
  .nav-actions{gap:8px}
  .nav-apply{padding-inline:14px}
  .nav-apply .cta-full{display:none}
  .nav-apply .cta-short{display:inline}
  .hero{padding-top:32px}
  .hero h1{font-size:clamp(42px,12vw,56px);margin:20px 0}
  .intro{font-size:17px}
  .actions{display:grid}
  .actions .button{width:100%}

  .step{display:grid;grid-template-columns:96px minmax(0,1fr);gap:6px 16px;padding:22px 0}

  .step h3{margin:0;font-size:25px}

  .faq summary{font-size:16px}
  .faq p{padding-right:0}

  .footer-bottom{flex-direction:column;gap:6px}
  .legal{padding:48px 0 72px}
  .legal h2{font-size:26px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* Thank-you page */
.thanks{max-width:720px;padding:96px 0 120px}
.thanks h1{font-size:clamp(46px,6vw,72px);line-height:1.04;letter-spacing:-.035em;margin:24px 0}
.thanks h1 .accent{display:block}
.thanks p{color:var(--muted);font-size:17px;max-width:52ch}
.thanks .actions{margin-top:36px}

/* Thank-you page: next steps */
.thanks .thanks-sub{font-size:30px;margin:52px 0 16px}
.next-steps{margin:0;padding:0;list-style:none;counter-reset:n;max-width:60ch}
.next-steps li{counter-increment:n;position:relative;padding:16px 0 16px 44px;border-top:1px solid var(--line);color:var(--muted);font-size:16px;line-height:1.7}
.next-steps li:last-child{border-bottom:1px solid var(--line)}
.next-steps li::before{content:counter(n);position:absolute;left:0;top:16px;color:var(--gold);font-weight:700;font-size:13px}
.next-steps strong{color:var(--text)}
.thanks .thanks-note{margin-top:32px;font-size:15px}
.thanks-note a{color:var(--text);text-decoration:underline;text-underline-offset:3px}

/* Free guide sign-up */
.guide-form{margin-top:40px;max-width:640px}
.guide-fields{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-bottom:32px}
.field-label{display:block;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.line{display:block;width:100%;padding:8px 0 10px;background:transparent;border:0;border-bottom:1px solid var(--field-line,#7d6850);border-radius:0;font-family:var(--display);font-weight:300;font-size:26px;line-height:1.3;color:var(--text-strong);transition:border-color .2s}
.line:focus{outline:none;border-color:var(--gold)}
.guide-small{margin-top:24px;font-size:13px!important;color:var(--muted);line-height:1.7;max-width:60ch}
.guide-small a{color:var(--text);text-decoration:underline;text-underline-offset:3px}
@media (max-width:640px){.guide-fields{grid-template-columns:1fr}}

/* Free guide article */
.guide .byline{margin:-12px 0 28px;font-size:14px!important;color:var(--muted)}
.toc{margin:36px 0 12px;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.toc-title{margin:0 0 8px;font-size:14px!important;color:var(--text)!important}
.toc ol{margin:0;padding-left:22px}
.toc li{margin:0;font-size:16px}
.legal .toc a{display:inline-flex;align-items:center;min-height:40px;color:var(--text);text-decoration-color:var(--line-strong)}
.legal .toc a:hover{color:var(--text-strong);text-decoration-color:var(--gold)}
.legal .pdf-link{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:15px}
.guide-mid{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;margin:48px 0 8px;padding:28px 32px;background:var(--surface);border-radius:var(--radius)}
.guide-mid p{flex:1 1 320px;margin:0;color:var(--text)!important}
.legal .guide-mid .button{margin-top:0}
.guide h2[id]{scroll-margin-top:96px}

/* Training starter guide */
.guide .guide-print{margin:8px 0 8px}
.guide-table{overflow-x:auto;margin:8px 0 16px}
.guide-table table{width:100%;border-collapse:collapse;font-size:15px}
.guide-table th{text-align:left;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);padding:10px 12px 10px 0;border-bottom:1px solid var(--line-strong)}
.guide-table td{padding:12px 12px 12px 0;border-bottom:1px solid var(--line);color:var(--muted);vertical-align:top}
.guide-table td:first-child{color:var(--text)}
.guide-cta{margin-top:56px;padding:32px;border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface)}
.guide-cta h2{margin-top:0}
.guide-cta .button{margin-top:8px}
@media print{
  body{background:#fff;color:#111}
  .top,.footer,.skip-link,.guide-print,.guide-cta .actions,.toc,.guide-mid,.byline{display:none!important}
  .legal{padding:0;max-width:none}
  .legal h1,.legal h2,.legal strong,.guide-table td:first-child{color:#111}
  .legal p,.legal li,.guide-table td{color:#333}
  .guide-cta{background:none;border-color:#999}
  .eyebrow,.guide-table th{color:#7a5a32}
}

/* Small phones: keep the header on one line; the menu already links to Apply */
.brand img{mix-blend-mode:lighten}
@media (max-width:520px){
  .brand{font-size:19px}
  .nav-actions:has(.menu:not([hidden])) .nav-apply{display:none}
  .navlinks+.nav-actions{margin-left:auto}
}