/* Raines shared brand layer (Oct 2026). Source of truth: DESIGN-SYSTEM.md.
   Layout, type and shapes: dylanraines.com. Colors: the raineshq.com logo swoosh (/images/raines-swoosh.png),
   a violet #8101fc to indigo #433dfb to blue #038cfc gradient. */
:root{
  --ink:#15131f;--paper:#f6f5fb;--cream:#f6f5fb;--green:#4b1fc4;--forest:#2b1a8f;--dark:#120e2a;--night:#0f0c24;
  --lime:#e9e4fb;--sage:#e9e4fb;--mist:#efecfb;--line:#dddaee;--muted:#5b5870;--eyebrow:#5a2ad0;--mint:#b9c2ff;--leaf:#8fd0ff;
  --violet:#8101fc;--indigo:#433dfb;--blue:#038cfc;--primary:#6a0fd6;--blue-text:#005fc2;--blue-tint:#dde9fd;--violet-tint:#efe4fd;--swoosh:linear-gradient(90deg,#8101fc 0%,#433dfb 50%,#038cfc 100%);
  --radius:24px;--radius-sm:16px;--radius-input:10px;--gap:8px;
  --font-body:'DM Sans',Arial,sans-serif;--font-display:'Manrope','DM Sans',Arial,sans-serif;
}
html{scroll-padding-top:120px}
body{background:var(--cream);color:var(--ink);font-family:var(--font-body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:var(--font-body)}
h1,h2,h3,h4,.path-art,.rh-amount,.rh-price-strip strong,.history-year{font-family:var(--font-display)!important;letter-spacing:-.05em;font-weight:700}
h1{line-height:1.06}h2{line-height:1.1}h3{letter-spacing:-.035em;line-height:1.18}
em{color:var(--violet);font-style:normal}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.eyebrow{font-family:var(--font-body);letter-spacing:.17em;font-weight:800;font-size:12px;color:var(--eyebrow)}
.tiny-dot{background:var(--eyebrow)}
.skip:focus{z-index:300}

/* ---------- header: dylanraines.com shape (sticky, 24px radius, 8px inset), LIGHT so the live black-text logo reads ---------- */
.site-header{position:sticky;top:var(--gap);z-index:100;margin:var(--gap) var(--gap) 0;background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:var(--radius);min-height:84px;display:flex;align-items:center;gap:22px;padding:0 clamp(20px,3vw,44px);box-shadow:0 6px 24px rgba(21,19,31,.05)}
.site-menu{flex:1;display:flex;align-items:center;justify-content:space-between;gap:20px;min-width:0}
.nav-links{display:flex;align-items:center;gap:clamp(14px,1.9vw,30px);margin-left:auto;margin-right:auto}
.nav-links a{font-weight:600;font-size:15px;color:#2d2a40;text-decoration:none;white-space:nowrap;padding:8px 0;border-bottom:2px solid transparent}
.nav-links a:hover{color:var(--green)}
.nav-links a.active{color:var(--ink);border-bottom-color:var(--green)}
.nav-links .nav-mobile-only{display:none}
.nav-tools{display:flex;align-items:center;gap:18px;flex:none}
.nav-phone{display:inline-flex;align-items:center;gap:7px;color:#2d2a40;font-weight:600;font-size:14px;white-space:nowrap}
.nav-phone:hover{color:var(--green)}
.site-header .account-links{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--muted)}
.site-header .account-links a{color:var(--ink);font-weight:600;border:0;padding:0;text-decoration:none}
.site-header .account-links a:hover{color:var(--green)}
.site-header .account-badge{display:inline-flex;align-items:center;gap:9px;color:var(--ink);font-weight:600;font-size:14px}
.site-header .account-badge img,.site-header .account-initial{width:32px;height:32px;border-radius:50%;object-fit:cover;background:var(--sage);color:var(--ink);display:grid;place-items:center;font-weight:800}
.nav-cta{display:inline-flex;align-items:center;gap:8px;background:var(--forest);color:#fff!important;padding:12px 20px;border-radius:50px;font-weight:800;font-size:14px;white-space:nowrap;text-decoration:none;transition:transform .2s,background .2s}
.nav-cta:hover{transform:translateY(-2px);background:#3a24b0}
.site-header .menu-toggle{display:none;margin-left:auto;background:none;border:0;color:var(--ink);cursor:pointer;width:44px;height:44px;align-items:center;justify-content:center}
.menu-icon,.menu-icon:before,.menu-icon:after{display:block;width:22px;height:2px;background:currentColor;border-radius:2px;position:relative;transition:transform .2s}
.menu-icon:before,.menu-icon:after{content:"";position:absolute;left:0}
.menu-icon:before{top:-7px}.menu-icon:after{top:7px}
.menu-toggle[aria-expanded=true] .menu-icon{background:transparent}
.menu-toggle[aria-expanded=true] .menu-icon:before{transform:translateY(7px) rotate(45deg)}
.menu-toggle[aria-expanded=true] .menu-icon:after{transform:translateY(-7px) rotate(-45deg)}
@media (max-width:1240px){.nav-phone span{display:none}.nav-links{gap:18px}}
@media (max-width:1080px){
  .site-header{min-height:72px;flex-wrap:wrap;padding:0 18px 0 24px}
  .site-header .menu-toggle{display:flex}
  .site-menu{display:none;position:absolute;top:calc(100% + 6px);left:0;right:0;background:#fff;border:1px solid var(--line);border-radius:20px;padding:14px 22px 22px;flex-direction:column;align-items:stretch;max-height:calc(100dvh - 100px);overflow:auto;box-shadow:0 20px 40px rgba(21,19,31,.14)}
  .site-menu.is-open{display:flex}
  .nav-links{flex-direction:column;align-items:stretch;gap:0;margin:0}
  .nav-links a,.nav-links .nav-mobile-only{display:block;padding:13px 4px;border-bottom:1px solid var(--line);font-size:17px;color:var(--ink)}
  .nav-links a.active{border-bottom-color:var(--line);color:var(--green)}
  .nav-tools{flex-direction:column;align-items:stretch;gap:14px;padding-top:16px}
  .nav-phone span{display:inline}.nav-phone{padding:4px}
  .site-header .account-links{padding:4px}
  .nav-cta{justify-content:center;padding:15px 20px;font-size:15px}
}

/* ---------- logo: exact live raineshq.com lockup (values measured from raineshq.com, Oct 17 2026) ---------- */
.site-header .wordmark,.site-footer .wordmark{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:none;font-family:Geologica,Arial,sans-serif;letter-spacing:normal;text-decoration:none;color:#171a39}
.site-header .wordmark-name,.site-footer .wordmark-name{font-family:Geologica,Arial,sans-serif;font-weight:700;letter-spacing:-.045em;line-height:1;white-space:nowrap;color:#171a39}
.site-header .wordmark .wordmark-swoosh img,.site-footer .wordmark .wordmark-swoosh img{width:110.248%;max-width:none;height:auto;position:absolute;top:-50.2273%;left:-6.41892%}
.site-header .wordmark{width:88.75px;gap:8px}
.site-header .brand-lockup{gap:3px}
.site-header .wordmark-name{font-size:25px}
.site-footer .wordmark{width:180px;gap:12px}
.site-footer .brand-lockup{gap:5px}
.site-footer .wordmark-name{font-size:50px}
@media (max-width:1080px){.site-header .wordmark{width:61.875px;gap:6px}.site-header .brand-lockup{gap:2px}.site-header .wordmark-name{font-size:17.5px}}
@media (max-width:540px){.site-footer .wordmark{width:150px;gap:10px}.site-footer .wordmark-name{font-size:42px}}

/* ---------- buttons and links (dylanraines.com .btn) ---------- */
.button,.btn{border-radius:100px!important;font-weight:800;font-size:15px;gap:12px;min-height:52px;padding:15px 25px;line-height:1.25;text-decoration:none}
.button.dark,.btn-dark{background:var(--forest);color:#fff;border-color:var(--forest)}
.button.dark:hover,.btn-dark:hover{background:#3a24b0}
.button.light,.btn-light{background:#fff;color:#15131f;border-color:#fff}
.button.light:hover,.btn-light:hover{background:#fff}
.button.outline,.btn-outline{border:1px solid #9d97c4;background:transparent;color:var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;transition:transform .2s}
.btn:hover{transform:translateY(-2px)}
.text-link{font-weight:800;color:#4a12b5;border-bottom:1px solid #c9c2ec;gap:10px}
.text-link:hover{border-bottom-color:#4a12b5}
.field input,.field textarea,.field select,.form-box input:not([type=checkbox]):not([type=radio]),.form-box textarea,.form-box select{border-radius:var(--radius-input)!important;border:1px solid #7d75ad;background:#fff;font-family:var(--font-body)}
.form-box{background:var(--mist);border-radius:var(--radius);padding:clamp(24px,3vw,40px)}
.form-box .button{width:auto}

/* ---------- home hero (dylanraines.com .hero: full-bleed photo, dark gradient, white type) ---------- */
.hero{position:relative;margin:var(--gap);border-radius:var(--radius);overflow:hidden;background:#1a1440;color:#fff;display:flex;align-items:center;min-height:min(760px,calc(100vh - 110px));grid-template-columns:none}
.hero-image{position:absolute;inset:0;min-height:0!important;max-height:none!important;background:#1a1440}
.hero-image img{object-position:70% 35%}
.hero-image:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,8,32,.88) 0%,rgba(11,8,32,.72) 42%,rgba(11,8,32,.18) 100%)}
.hero-image .image-note{display:none}
.hero-copy{position:relative;z-index:1;max-width:900px;padding:80px clamp(24px,6vw,100px) 36px}
.hero h1{color:#fff;font-size:clamp(46px,6vw,92px);margin:22px 0 24px;max-width:820px}
.hero h1 em{color:var(--mint)}
.hero .eyebrow{color:var(--mint)}.hero .tiny-dot{background:var(--mint)}
.hero-copy>p{color:#ece9fa;max-width:600px;font-size:clamp(17px,1.5vw,21px)}
.hero-copy>p.hero-service-line{font-size:15px;color:#d4d0ee}
.hero .button.dark{background:#fff;color:#15131f;border-color:#fff}
.hero .text-link,.hero .rh-hero-call{color:#fff;border-bottom-color:rgba(255,255,255,.45)}
.hero-foot{color:#c3bfdf;font-size:10px}
@media (max-width:760px){
  .hero{min-height:700px;align-items:flex-end}
  .hero-image:after{background:linear-gradient(0deg,rgba(11,8,32,.94) 30%,rgba(11,8,32,.35) 100%)}
  .hero-image img{object-position:62% center}
  .hero-copy{padding:60px 24px 30px}
  .hero h1{font-size:clamp(40px,11vw,56px)}
  .hero-actions .button{width:100%}
}

/* ---------- surfaces (24px radius, white cards on cream) ---------- */
.section{position:relative}
.path-card,.project-card,.service-card,.blog-card,.learn-card,.portal-card,.rh-price-card,.rh-price-strip a,.local-area-grid a,.hub-event,.post,.empty-state,.rh-events article,.rh-quests a,.rh-stats a,.rh-stats div,.member-list>*,.support-desk,.booking-selection,.booking-form,.quiz-shell,.summary,.invoice-editor,.portal-banner,.service-detail{border-radius:var(--radius)}
.path-card,.project-card,.blog-card,.learn-card,.rh-price-card,.rh-price-strip a,.local-area-grid a{overflow:hidden}
.project-card,.rh-price-card,.rh-price-strip a,.blog-card,.learn-card{border:0;background:#fff}
.project-art,.blog-card-art,.news-card-art,.learn-visual{border-radius:0}
.path-card.green{background:var(--green)}
.path-card.lime{background:var(--sage)}
.path-card.sand{background:#dde9fd}
.path-card.pink{background:#efe4fd}
.rh-price-card.rh-featured{background:var(--forest);color:#fff}
.rh-price-card.rh-featured p,.rh-price-card.rh-featured .rh-from{color:#dcd9f0}
.rh-price-card.rh-featured .rh-amount{color:#fff}
.rh-price-card.rh-featured .button.dark{background:#fff;color:#15131f}
.local-area-grid a{background:#fff;padding:28px}
.meet-dylan{background:var(--mist);margin:0 var(--gap);border-radius:var(--radius)}
.meet-dylan-photo img{border-radius:var(--radius)}
.meet-dylan-lead{color:var(--green)!important}
.about-portrait img,.portrait img{border-radius:var(--radius)}
.page-intro{border-bottom:0;padding-top:clamp(60px,8vw,110px)}
.page-intro p{color:var(--muted)}
.belief-strip,.mission{border-radius:var(--radius)}

/* closing call to action: dark panel (dylanraines.com .dark-panel) */
.closing{background:var(--dark);color:#fff;margin:var(--gap);border-radius:var(--radius)}
.closing em{color:var(--mint)}
.closing .eyebrow{color:var(--mint)}
.closing-circle,.closing-circle:before,.closing-circle:after{border-color:#2c2552}

/* ---------- footer: dylanraines.com structure, light sage panel (the live logo has black text) ---------- */
.site-footer{background:var(--mist);color:var(--ink);border:1px solid var(--line);border-radius:var(--radius);margin:var(--gap);padding:65px clamp(24px,5vw,80px) 25px}
.site-footer a{color:var(--ink);text-decoration:none}
.site-footer a:hover{color:var(--green)}
.footer-main{display:flex;justify-content:space-between;gap:48px;align-items:flex-start}
.footer-intro{display:flex;flex-direction:column;align-items:flex-start}
.footer-intro p{font:600 22px/1.35 var(--font-display);letter-spacing:-.02em;color:var(--muted);margin:22px 0 26px;max-width:380px}
.footer-intro .btn{background:var(--forest);color:#fff!important}
.site-footer .footer-links{display:grid;grid-template-columns:repeat(3,minmax(150px,1fr));gap:30px 48px;margin:0;font-size:15px}
.footer-col{display:flex;flex-direction:column;gap:10px}
.footer-col a{padding:0;margin:0;line-height:1.5}
.footer-col h2{font:800 12px/1.4 var(--font-body)!important;letter-spacing:.17em!important;text-transform:uppercase;color:var(--eyebrow);margin:0 0 6px}
.site-footer .footer-service-area{color:var(--muted);font-size:14px;margin:48px 0 0;max-width:none}
.site-footer .footer-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px;border-top:1px solid #d3cfe8;margin-top:22px;padding-top:20px;color:var(--muted);font-size:13px}
.site-footer .footer-bottom a,.site-footer .footer-bottom span{margin:0;padding:0}
.footer-legal{display:flex;flex-wrap:wrap;gap:18px}
@media (max-width:900px){.footer-main{flex-direction:column}.site-footer .footer-links{grid-template-columns:1fr 1fr;width:100%}}
@media (max-width:560px){.site-footer{padding:44px 24px 24px}.site-footer .footer-links{grid-template-columns:1fr}.site-footer .footer-bottom{flex-direction:column;align-items:flex-start}}

/* ---------- mobile quick contact bar ---------- */
@media (max-width:760px){
  .rh-mobilebar{left:8px;right:8px;bottom:8px;border-radius:20px;background:#0f0c24;border:0;box-shadow:0 10px 30px #0005;padding:7px}
  .rh-mobilebar a{color:#e8e6f5;border-radius:14px}
  .rh-mobilebar a.rh-mb-book{background:#fff;color:#15131f}
  body{padding-bottom:84px}
}

/* ---------- app chrome (portal, admin, community) ---------- */
.portal-sidebar,.admin-sidebar{border-radius:var(--radius)}
.portal-pill,.status{border-radius:100px}
.rh-staging{top:auto;bottom:96px;right:16px;background:#d6ff5b;color:#111}
@media (min-width:761px){.rh-staging{bottom:16px}}

/* ---------- booking flag (Worker sets html[data-booking-off] when BOOKING_ENABLED is not "true") ---------- */
html[data-booking-off] [data-booking="on"]{display:none!important}
html:not([data-booking-off]) [data-booking="off"]{display:none!important}

/* refinements */
.rh-price-card.rh-featured .button.outline{border-color:rgba(255,255,255,.5);color:#fff;background:transparent}
.rh-price-card.rh-featured .button.outline svg{stroke:#fff}
.hero-copy>p.hero-service-line{color:#dcd9f0}
@media (max-width:760px){.hero-image:after{background:linear-gradient(0deg,rgba(11,8,32,.95) 45%,rgba(11,8,32,.45) 100%)}}
button.text-link{background:none;border:0;border-bottom:1px solid #c9c2ec;border-radius:0;padding:6px 0;font:800 14px/1.3 var(--font-body);color:#4a12b5;cursor:pointer}
.hero .hero-service-line{color:#dcd9f0!important}
@media (max-width:760px){.hero-image:after{background:linear-gradient(0deg,rgba(11,8,32,.95) 0%,rgba(11,8,32,.82) 60%,rgba(11,8,32,.5) 100%)}}

/* swoosh palette details */
.text-link:hover,.site-footer a:hover,.nav-links a:hover,.nav-phone:hover,.site-header .account-links a:hover{color:var(--primary)}
.nav-links a.active{border-bottom-color:var(--violet)}
.path-card.green{color:#fff}
::selection{background:#d9d0fd;color:var(--ink)}