/* Real Wolf Pack brand layer. Load LAST, after legacy page and booking styles.
   Ocean #6CB8E4 is provisional. Never recolor official logo image files. */
:root {
  color-scheme: light;
  --ocean:#6CB8E4; --ocean-soft:#EAF5FC; --navy:#14283F;
  --ink:#253241; --muted:#4A5868; --line:#DDE3EA; --mist:#F5F7FA;
  --paper:#FFFFFF; --cta:#F5821F; --on-navy:#C9D6E3; --navy-line:#3E5470;
  --font:"Roboto",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --blue:var(--ocean); --blue-dark:var(--navy); --dark:var(--navy);
  --orange:var(--cta); --sand:var(--ocean-soft); --gray:var(--line);
  --text:var(--ink); --charcoal:var(--ink);
  --shadow:0 8px 24px rgb(20 40 63 / 6%);
}
html { scroll-padding-top:100px; }
body::before { background:none!important; }
body { background:var(--paper); color:var(--ink); font-family:var(--font); font-size:18px; line-height:1.55; }
button,input,select,textarea { font-family:var(--font); }
img,video { max-width:100%; }
.wrap { width:min(1200px,calc(100% - 40px)); }
:where(.hero-copy,.hero-text-col,.card,.feature-card,.footer-col,.booking-card) { min-width:0; }
h1,h2,h3 { color:var(--navy); text-wrap:balance; letter-spacing:-.025em; }
h1 { font-size:clamp(40px,4.8vw,64px); font-weight:900; line-height:1.05; }
h2 { font-size:clamp(30px,3.5vw,44px); font-weight:900; line-height:1.12; }
h3 { font-size:clamp(20px,2vw,24px); font-weight:700; line-height:1.25; }
h1 em,h2 em,h1 .ai-word { color:var(--navy); font-style:normal; }
p { line-height:1.55; }
:where(p.lead,.hero p.hero-description,.hero p.intro) { font-size:clamp(18px,1.8vw,20px); max-width:70ch; color:var(--muted); }
a { color:var(--navy); text-underline-offset:.2em; }
:where(a,button,input,select,textarea,summary):focus-visible { outline:3px solid var(--navy); outline-offset:4px; }
:where(.site-footer,.community,.note,.side-panel) :focus-visible { outline-color:var(--ocean); }
[hidden] { display:none!important; }
:where(.eyebrow,.kicker,.card-label,.label,.booking-eyebrow) { color:var(--navy); font-size:14px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.eyebrow { display:flex; align-items:center; gap:10px; }
.eyebrow::before { content:""; flex:0 0 32px; height:5px; background:var(--ocean); border-radius:3px; }
.eyebrow .dot { display:none; }
:where(.micro,.small,.caption,figcaption) { color:var(--muted); font-size:14px; }
:where(.hero,.section,.start-section,.community,.final-cta) { padding-block:64px; }
.hero h1 { font-size:clamp(40px,4.8vw,64px)!important; line-height:1.05!important; font-weight:900; letter-spacing:-.025em; }
.hero p.hero-description,.hero p.lead,.hero p.intro { font-size:clamp(18px,1.8vw,20px); line-height:1.55; }
:where(.hero,.start-section,.reassurance,.stats-bento,.ecosystem-banner) { background:var(--paper); background-image:none; }
.start-section,.reassurance { background:var(--mist); border-color:var(--line); }
:where(.card,.feature-card,.track-card,.path-panel,.table-card,.booking-card) { background:var(--paper); background-image:none; border:1px solid var(--line); border-radius:18px; box-shadow:none; }
:where(.card,.feature-card,.track-card):hover { border-color:var(--ocean); box-shadow:var(--shadow); transform:none; }
:where(.detail,.recommendation,.pillar-box,.ecosystem-banner) { background:var(--ocean-soft); color:var(--navy); border-color:var(--line); border-radius:16px; }
:where(.pill,.cred-badge,.credentials span,.meta span,.chip,.filter-btn,.card-thumb-tag) { background:var(--ocean-soft); color:var(--navy); border-color:var(--line); border-radius:999px; font-weight:700; }
.filter-btn.active { background:var(--ocean); color:var(--navy); }
body .button,body .btn,body .btn-primary,body .booking-button,body .btn-nav-primary {
 display:inline-flex; align-items:center; justify-content:center; gap:10px;
 min-height:48px; padding:16px 24px; border:2px solid transparent; border-radius:16px;
 background:var(--cta); background-image:none; color:var(--navy)!important;
 font-size:20px; font-weight:900; line-height:1.25; text-decoration:none;
 text-align:center; box-shadow:none; cursor:pointer; transition:filter .15s ease;
}
:where(.button,.btn,.btn-primary,.booking-button,.btn-nav-primary):hover { filter:brightness(.96); transform:none; box-shadow:none; }
body .button.blue,body .btn.blue { background:var(--ocean); color:var(--navy)!important; }
body .button.secondary,body .btn.sand,body .btn-secondary,body .btn-nav-outline {
 display:inline-flex; justify-content:center; align-items:center; min-height:48px;
 padding:14px 24px; border:2px solid var(--navy); border-radius:16px;
 background:var(--paper); color:var(--navy)!important; font-size:20px; font-weight:700; text-decoration:none;
}
:where(.watch-link,.booking-link) { color:var(--navy); font-weight:700; display:inline-block; padding-block:10px; min-height:44px; }
:where(.check input,.choices input) { accent-color:var(--navy); }
:where(input:not([type=checkbox]):not([type=radio]),select,textarea) { min-height:44px; border-color:var(--line); border-radius:12px; }
:where(summary,.filter-btn) { min-height:44px; }
/* Light, clear public navigation. The JJ mark is James's identity, not an eXp logo. */
.site-header { background:var(--paper); border-bottom:1px solid var(--line); backdrop-filter:none; padding-block:12px; }
.brand-link,.brand-text strong { color:var(--navy); }
.brand-text small { color:var(--muted); }
.brand-monogram { background:var(--ocean); border:0; color:var(--navy); box-shadow:none; border-radius:14px; }
.brand-monogram span { color:var(--navy); }
.site-nav a,.nav-link-direct,.nav-drop-btn { color:var(--navy); font-size:15px; }
.site-nav a:hover,.site-nav a.active,.nav-link-direct:hover,.nav-link-direct.active,.nav-drop-btn:hover { color:var(--navy); text-decoration:underline; }
.nav-toggle { min-width:44px; min-height:44px; justify-content:center; align-items:center; }
.nav-toggle span { background:var(--navy); }
.nav-actions .btn-nav-outline,.nav-actions .btn-nav-primary { font-size:15px!important; padding:12px 16px; }
.nav-drop-menu { background:var(--paper); border:1px solid var(--line); box-shadow:var(--shadow); backdrop-filter:none; }
.drop-item strong { color:var(--navy); }
.drop-item small { color:var(--muted); font-size:13px; }
.drop-item:hover { background:var(--ocean-soft); }
.drop-item:hover strong { color:var(--navy); }
.nav-drop-btn { min-height:44px; }
.nav-drop-menu { display:none; }
.nav-dropdown:hover .nav-drop-menu,.nav-dropdown:focus-within .nav-drop-menu,.nav-dropdown.is-open .nav-drop-menu { display:flex; opacity:1; visibility:visible; transform:none; }
/* Navy is reserved for intentional bands and the footer, not the whole page. */
:where(.community,.note,.side-panel,.bento-vip-card,.primary-feature) { background:var(--navy); background-image:none; color:var(--paper); border-color:var(--navy-line); box-shadow:none; }
:where(.community,.note,.side-panel,.bento-vip-card,.primary-feature) :where(h2,h3,strong) { color:var(--paper); }
:where(.community,.note,.side-panel,.bento-vip-card,.primary-feature) :where(p,small,.micro) { color:var(--on-navy); }
:where(.community,.note,.side-panel,.bento-vip-card,.primary-feature) .eyebrow { color:var(--on-navy); }
:where(.community,.note,.side-panel) a:not(.button):not(.btn) { color:var(--paper); }
.site-footer { background:var(--navy); color:var(--paper); border-top:1px solid var(--navy-line); margin-top:64px; }
.site-footer .footer-brand strong,.site-footer h4 { color:var(--paper); }
.site-footer .footer-col h4::after { background:var(--ocean); }
.site-footer :where(.footer-bio,.footer-col ul a,.disclaimer,.copyright,.footer-contact) { color:var(--on-navy); font-size:14px; }
.footer-contact a { color:var(--paper); display:inline-block; padding-block:6px; overflow-wrap:anywhere; }
.site-footer .footer-col ul a { color:var(--on-navy); display:inline-block; min-height:44px; padding-block:10px; }
.site-footer .footer-col ul { gap:0; }
.site-footer .footer-col ul a:hover { color:var(--paper); }
.footer-bottom { border-color:var(--navy-line); }
.site-footer .footer-bottom .disclaimer,.site-footer .footer-bottom .copyright { color:var(--on-navy); font-size:14px; line-height:1.55; }
html.rwp-nav-ready .nav-dropdown .nav-drop-menu { display:none; }
html.rwp-nav-ready .nav-dropdown.is-open .nav-drop-menu { display:flex; opacity:1; visibility:visible; transform:none; }
.footer-badges span { background:var(--navy-line); color:var(--on-navy); border-color:var(--navy-line); }
/* Remove legacy orange glows and green status chips without changing photo pixels. */
:where([class*="hero-stage-card"],.guide-portrait-card,.community-stage-card) { border:1px solid var(--line); box-shadow:none; border-radius:18px!important; }
:where(.hero-stage-badge,.str-tag,.audit-tag,.comp-tag,.calc-tag,.vip-tag,.train-tag,.faq-tag,.fl-tag,.guide-location-tag,.community-network-tag) { background:var(--ocean-soft); color:var(--navy); border-color:var(--line); backdrop-filter:none; }
:where(.hero-stage-badge,.community-network-tag) :where(.live-dot,.pulse-dot) { background:var(--navy); box-shadow:none; animation:none; }
.hero-overlay-pill.accent strong { color:var(--paper); }
.hero-overlay-pill { background:var(--navy); }
.stat-cell.highlight,.stats-bento .stat-cell { background:var(--mist); border-color:var(--line); }
.stat-cell strong,.stat-cell.highlight strong { color:var(--navy); }
.stat-cell span,.stat-cell.highlight span { color:var(--muted); }
.booking-hero { background:var(--ocean); border-bottom:1px solid var(--line); color:var(--navy); }
.booking-hero :where(h1,h1 span,.booking-eyebrow,.booking-lead,.booking-hero-note) { color:var(--navy); }
.booking-button { border-radius:16px; }
.booking-topics li::before { color:var(--navy); }
.booking-card { border-radius:18px; }
/* Homepage resource and authentic author portrait. */
.brand-resource { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:40px; align-items:center; background:var(--ocean-soft); border:1px solid var(--line); border-radius:20px; padding:40px; margin-block:40px 64px; }
.brand-resource h2 { margin-block:12px 20px; }
.brand-resource p { max-width:65ch; }
.brand-resource .button { margin-top:16px; }
.brand-resource-art { background:var(--ocean); color:var(--navy); padding:32px; border-radius:18px; }
.brand-resource-art ol { margin:20px 0 0; padding-left:24px; }
.brand-resource-art li { margin-top:12px; font-weight:700; }
.brand-portrait { width:100%; height:auto; display:block; object-fit:cover; object-position:center 25%; border-radius:18px; }
.brand-portrait-card { margin:0; background:var(--mist); padding:16px; border:1px solid var(--line); border-radius:20px; }
.brand-portrait-card figcaption { padding:14px 8px 4px; }
.brand-portrait-card strong { display:block; color:var(--navy); }
.brand-signature { font-size:clamp(26px,3vw,36px); font-weight:900; color:var(--navy); }
.site-footer { display:block; text-align:left; }
body .start-section { background:var(--mist); color:var(--ink); }
body .start-section :where(h2,p) { color:var(--navy); }
body .reassurance { background:var(--ocean-soft); color:var(--navy); }
body .cred-badge.highlight { background:var(--ocean-soft); color:var(--navy); }
body .eyebrow,body .card-label { color:var(--navy); }
body .side-panel,body .note { background:var(--navy); box-shadow:none; border-radius:18px; }
body .pillar-box,body .ecosystem-banner { background:var(--ocean-soft); border-color:var(--line); }
@media(min-width:1081px) { .site-nav { gap:8px; } .nav-drop-btn,.nav-link-direct { padding-inline:8px; } }
@media(max-width:1080px) {
 html:not(.rwp-nav-ready) .header-inner { flex-wrap:wrap; }
 html:not(.rwp-nav-ready) .site-nav { display:flex; position:static; width:100%; max-height:none; }
 html:not(.rwp-nav-ready) .nav-toggle { display:none; }
 html:not(.rwp-nav-ready) .nav-drop-menu { display:flex; }
 .site-nav { background:var(--paper); border-bottom:1px solid var(--line); max-height:calc(100dvh - 80px); overflow-y:auto; backdrop-filter:none; }
 .site-nav .nav-drop-btn { background:var(--mist); }
 .site-nav .nav-drop-menu { display:none; }
 .site-nav .nav-dropdown.is-open .nav-drop-menu { display:flex; }
 .site-nav .nav-link-direct { font-size:17px; min-height:44px; }
}
@media(max-width:899px) {
 :where(.hero,.section,.start-section,.community,.final-cta) { padding-block:40px; }
 .hero h1 { font-size:clamp(40px,6vw,44px)!important; }
 .brand-resource { grid-template-columns:minmax(0,1fr); padding:24px 20px; gap:24px; }
 .brand-resource-art { padding:24px; }
}
@media(max-width:600px) {
 :where(.button,.btn,.btn-primary,.btn-secondary,.booking-button) { width:100%; }
 .header-inner { gap:12px; }
 .brand-text strong { font-size:14px; }
 .brand-text small { font-size:10px; }
 .card,.feature-card,.track-card { padding:24px 20px; }
 .site-footer { padding-top:40px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; } }