/* =====================================================================
   RN Home Office — shared skin (public site + member portal)
   Style language: dark sticky header, dark hero bands with soft glows, bold Inter
   headings with tight tracking, flat brand-red buttons, white cards with soft
   shadows and a gentle lift. Colours stay brand red + black (+ gold).
   Loaded AFTER each page's own <style>. Visual layer only: type, colour, depth,
   radii, buttons, fields and motion. Layout (widths, grids, spacing) is untouched.
   Remove the <link> to this file to turn the skin off.
   ===================================================================== */

:root{
  --navy:#0b0809;--navy2:#171011;--navy3:#241a1c;      /* brand black ramp */
  --accent:#e34054;--accent2:#cf3347;--accent-soft:#fdeef0;
  --paper:#f7f5f4;
  --line:#e6e0dd;
  --line2:#f0ebe8;
  --mut:#7a7175;
  --serif:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;   /* no serif: Inter throughout */
  --sh:0 1px 2px rgba(24,17,19,.06),0 4px 16px rgba(24,17,19,.07);
  --sh2:0 12px 40px rgba(24,17,19,.16);
  --shadow-sm:var(--sh);
  --shadow-md:0 2px 4px rgba(24,17,19,.05),0 14px 32px -14px rgba(24,17,19,.22);
  --shadow-lg:var(--sh2);
  --ease:cubic-bezier(.2,.7,.2,1);
  --red-hi:var(--accent);--red-lo:var(--accent2);
}

html{scroll-behavior:smooth;}
body{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.6;}
::selection{background:rgba(227,64,84,.2);}

/* ---------- Typography: bold Inter headings, tight tracking ---------- */
h1,h2,.pname,.mstop .t,.hc-wrap h1,.hc-wrap h2,.head h1{font-family:var(--serif);font-weight:800;letter-spacing:-.025em;}
h1{line-height:1.1;letter-spacing:-.03em;}
.amt .now{font-family:var(--serif);font-weight:800;letter-spacing:-.03em;}
.lbl,.mlab{letter-spacing:.07em;}
.eyebrow{letter-spacing:.12em;}
/* one consistent page-title size across the member portal and the board/directory bands */
.msbody h1,.msbody .head h1,.msbody .h2,.band-in h1{font-family:var(--serif);font-weight:800;font-size:27px;letter-spacing:-.025em;line-height:1.15;}

/* ---------- Header: dark, sticky, translucent ---------- */
.nav{
  position:sticky;top:0;z-index:100;
  background:rgba(11,8,9,.94)!important;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:none!important;
}
.nav-links a{border-radius:8px;transition:background .18s,color .18s;}
.nav-links a:hover{background:rgba(255,255,255,.08);}
.nav-links a.on{border-bottom:0!important;background:rgba(255,255,255,.1);}
.nav-right a{background:var(--accent)!important;border-radius:9px;box-shadow:none;transition:transform .18s var(--ease),box-shadow .18s,background .18s;}
.nav-right a:hover{background:var(--accent2)!important;box-shadow:0 6px 18px rgba(227,64,84,.35);transform:translateY(-1px);}
.nav-panel{background:#14100f!important;}

/* ---------- Dark hero band (directory / board title area) ---------- */
.band{
  background:radial-gradient(800px 380px at 92% -30%,rgba(227,64,84,.28),transparent 60%),radial-gradient(520px 360px at -8% 130%,rgba(201,168,76,.16),transparent 60%),var(--navy);
  border-bottom:0;color:#fff;
}
.band h1{color:#fff;}
.band .sub{color:rgba(255,255,255,.74);}
.band .sub a{color:#fff;}

/* ---------- Surfaces: white cards, soft shadow, gentle lift ---------- */
.card,.pcard,.rcard,.jcard,.job,.railcard,.col,.cmp,.cmp-card,.steps .step,.price,.box,.ctable,.hero-card{
  border-color:var(--line);border-radius:14px;box-shadow:var(--sh);
}
.hero-card{border-radius:18px;box-shadow:0 40px 80px -36px rgba(0,0,0,.6),0 0 0 1px rgba(24,17,19,.05);}
.col.feat,.price.feat,.cmp-card.feat{box-shadow:0 22px 50px -26px rgba(201,168,76,.7);}
.ctable,.cmp{overflow:hidden;}
.rcard,.jcard,.job{transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s;}
.rcard:hover,.jcard:hover,.job:hover{transform:translateY(-3px);box-shadow:var(--sh2);border-color:#e3cfd3;}

/* ---------- Buttons: flat brand red, lift + glow on hover ---------- */
.btn,.btn-search,.jbtn{border-radius:10px;font-weight:600;letter-spacing:0;transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .18s,border-color .18s,color .18s;}
.btn:hover,.jbtn:hover{transform:translateY(-1px);}
.btn:active,.jbtn:active{transform:none;}
.btn-red,.btn-search,.jred,.genbtn{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:none;}
.btn-red:hover,.btn-search:hover,.jred:hover,.genbtn:hover{background:var(--accent2);border-color:var(--accent2);box-shadow:0 6px 18px rgba(227,64,84,.38);}
.jgold{background:var(--gold,#c9a84c);box-shadow:none;}
.jgold:hover{background:#b7952f;box-shadow:0 6px 18px rgba(201,168,76,.4);}
.btn-ghost,.jout{box-shadow:none;}

/* ---------- Chips, tags, pills ---------- */
.tag{border-radius:100px;padding-left:10px;padding-right:10px;background:#faf7f5;border-color:#ece4e0;}
.pill,.fchip,.chip,.pband{border-radius:100px;}
.chip,.fchip{transition:background .15s,border-color .15s,color .15s,box-shadow .15s;}

/* ---------- Form fields ---------- */
.fld input,.fld select,.fld textarea,.mfield,textarea,select{border-radius:10px;border-color:#dfd8d5;transition:border-color .15s,box-shadow .15s;}
.fld input:focus,.fld select:focus,.fld textarea:focus,.mfield:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px rgba(227,64,84,.12);}
.searchbox,.jsel{border-radius:12px;border-color:#dfd8d5;box-shadow:var(--sh);transition:border-color .15s,box-shadow .15s;}
.searchbox:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px rgba(227,64,84,.12),var(--sh);}
.searchbox input,.searchbox input:focus{box-shadow:none;outline:none;}

/* ---------- Dialogs ---------- */
.modal,.okbox{border-radius:18px;box-shadow:var(--sh2);}
.ov,.okwrap{backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);}

/* ---------- Member portal shell ---------- */
.msside{background:#000;border-right-color:rgba(255,255,255,.06);}
.mssec{letter-spacing:.14em;color:rgba(255,255,255,.4);}
.msn{border-radius:10px;transition:background .18s,color .18s;}
.mstop{
  background:rgba(11,8,9,.94)!important;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:none!important;
}
.mstop .t{font-size:18px;color:#fff;}
.mstop-links a:hover{background:rgba(255,255,255,.1);}
.mstop .lo{background:var(--accent);border-radius:9px;box-shadow:none;transition:background .18s,box-shadow .18s,transform .18s var(--ease);}
.mstop .lo:hover{background:var(--accent2);box-shadow:0 6px 18px rgba(227,64,84,.35);transform:translateY(-1px);}
.msfoot .av{box-shadow:0 0 0 2px rgba(255,255,255,.14);}
.ms-freebanner{background:#fff8e6;}
/* desktop-only active-item treatment (mobile recolours it for the menu panel) */
@media (min-width:821px){
  .msn.on{background:var(--accent);box-shadow:0 8px 18px -10px rgba(227,64,84,.9);}
}
/* the mobile menu panel was red; keep it dark to match the header */
@media (max-width:820px){
  .msnav-panel{background:#14100f!important;box-shadow:0 14px 30px rgba(0,0,0,.35)!important;}
  .msn.on{background:rgba(227,64,84,.9)!important;}
  .mshamb span{background:#fff;}
}

/* ---------- Footer ---------- */
footer{background:#000;}

/* ---------- File pickers ---------- */
input[type=file]{font-family:inherit;color:var(--mut);max-width:100%;cursor:pointer;}
input[type=file]::file-selector-button{
  margin-right:14px;padding:9px 18px;border:1px solid #dfd8d5;border-radius:10px;
  background:#fff;color:var(--ink,#181113);font-family:inherit;font-size:12.5px;font-weight:600;
  cursor:pointer;box-shadow:var(--sh);
  transition:border-color .15s,color .15s,background .15s,box-shadow .15s,transform .15s var(--ease);
}
input[type=file]:hover::file-selector-button{border-color:var(--accent);color:var(--accent);background:var(--accent-soft);}
input[type=file]:active::file-selector-button{transform:translateY(1px);}
input[type=file]:focus-visible{outline:none;}
input[type=file]:focus-visible::file-selector-button{border-color:var(--accent);box-shadow:0 0 0 4px rgba(227,64,84,.12);}
input[type=file]:disabled{opacity:.55;cursor:default;}
input[type=file]:disabled::file-selector-button{cursor:default;}

/* ---------- Public top bar: larger logo and menu on desktop, identical on every page ---------- */
@media (min-width:1000px){
  .nav-in{height:76px;gap:34px;max-width:1280px;padding-left:28px;padding-right:28px;}
  .nav-links{flex:1;justify-content:flex-end;gap:6px;}
  .nav-in img{height:50px;}
  .nav-links a{font-size:15px;font-weight:500;padding:10px 14px;letter-spacing:0;}
  /* the current page's link keeps the same box as the others (some pages add their own bottom padding/underline to .on) */
  .nav-links a.on{padding:10px 14px!important;border-bottom:0!important;}
  .nav-right a{font-size:14.5px;padding:11px 22px;}
}
.nav-links a,.nav-links a:hover,.nav-links a.on{color:#fff;}

/* ---------- Respect reduced-motion ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .rcard,.jcard,.job,.btn,.jbtn,.nav-right a,.mstop .lo{transition:none;}
  .rcard:hover,.jcard:hover,.job:hover,.btn:hover,.jbtn:hover,.nav-right a:hover,.mstop .lo:hover{transform:none;}
}

/* ---------- Marketing Suite dropdown (public top bar) ---------- */
.nav-dd{position:relative;display:flex;align-items:center;}
.nav-dd .dd-top{display:inline-flex;align-items:center;gap:7px;}
.nav-dd .dd-chev{transition:transform .2s var(--ease);opacity:.8;}
.nav-dd:hover .dd-chev,.nav-dd:focus-within .dd-chev{transform:rotate(180deg);}
.dd-menu{position:absolute;top:100%;right:0;z-index:120;min-width:320px;margin-top:10px;padding:8px;background:#14100f;border:1px solid rgba(255,255,255,.1);border-radius:14px;box-shadow:0 24px 50px -16px rgba(0,0,0,.65);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .18s var(--ease),transform .18s var(--ease),visibility 0s linear .18s;}
.dd-menu::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px;}
.nav-dd:hover .dd-menu,.nav-dd:focus-within .dd-menu{opacity:1;visibility:visible;transform:none;transition-delay:0s;}
.nav-links .dd-menu a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:10px;font-size:14px;line-height:1.35;white-space:normal;}
.nav-links .dd-menu a:hover{background:rgba(255,255,255,.08);}
.dd-menu .dd-ic{flex:none;width:36px;height:36px;border-radius:10px;background:rgba(227,64,84,.16);border:1px solid rgba(227,64,84,.3);color:#ff8d9b;display:flex;align-items:center;justify-content:center;}
.dd-menu b{display:block;font-weight:700;color:#fff;font-size:14px;}
.dd-menu small{display:block;font-size:12px;font-weight:400;color:rgba(255,255,255,.62);margin-top:1px;}
.nav-panel a.sub{padding-left:30px!important;font-weight:600;font-size:13.5px!important;opacity:.92;}
@media (prefers-reduced-motion:reduce){.dd-menu,.nav-dd .dd-chev{transition:none;}}

/* ---------- Shared public menu (inc/site-nav.php, 23 Oct): "Log in" dropdown on the right ---------- */
.nav-right .nav-login .dd-menu{min-width:300px;}
.nav-right .nav-login .dd-menu a{display:flex;align-items:center;gap:12px;padding:12px 14px!important;border-radius:10px;background:none!important;font-size:14px;line-height:1.35;white-space:normal;box-shadow:none!important;transform:none!important;}
.nav-right .nav-login .dd-menu a:hover{background:rgba(255,255,255,.08)!important;}
.nav-links .dd-top.on{color:#fff;}
@media (max-width:640px){.nav-right .nav-login .dd-menu{display:none;}.nav-right .nav-login .dd-chev{display:none;}}