/* ==========================================================================
   Crimson Services Group, LLC — Design System
   Structure: 1.Tokens 2.Reset 3.Type 4.Layout 5.Header 6.Hero 7.Components
              8.Sections 9.Forms 10.Footer 11.Motion 12.Responsive 13.Print
   ========================================================================== */

/* ---------- 1. TOKENS ---------- */
:root{
  /* brand — sampled from the Crimson Services Group logo suite */
  --crimson:#8B1538;
  --crimson-dk:#6B102A;
  --crimson-lt:#A91D3A;
  --navy:#1E3A5F;
  --navy-dk:#152A45;
  --ink:#0F1B2D;
  --ink-2:#1B2C45;
  --silver:#C0C0C0;
  --silver-lt:#E8E8E8;
  --gold:#C9A227;
  --gold-lt:#E4C766;

  /* neutrals */
  --paper:#FCFBF9;
  --sand:#F3F1EC;
  --sand-2:#E9E5DD;
  --slate:#4A5568;
  --slate-lt:#5A6474;
  --line:rgba(15,27,45,.10);
  --line-2:rgba(15,27,45,.06);
  --white:#fff;

  /* semantic */
  --ok:#1F7A4D;
  --warn:#B45309;

  /* type */
  --serif:"Crimson Pro","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;

  /* spacing / shape */
  --wrap:1200px;
  --wrap-narrow:820px;
  --r-sm:8px;
  --r:14px;
  --r-lg:22px;
  --r-pill:999px;

  /* elevation */
  --sh-1:0 1px 2px rgba(11,18,32,.05), 0 2px 8px rgba(11,18,32,.05);
  --sh-2:0 2px 4px rgba(11,18,32,.04), 0 12px 28px rgba(11,18,32,.09);
  --sh-3:0 4px 8px rgba(11,18,32,.05), 0 28px 60px rgba(11,18,32,.14);
  --sh-crimson:0 10px 30px rgba(139,21,56,.28);

  /* motion */
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
}

/* ---------- 2. RESET ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:132px}
body{
  margin:0;
  background:var(--paper);
  color:var(--slate);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.68;
  font-feature-settings:"kern" 1,"liga" 1,"cv11" 1;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
img,svg,video{max-width:100%;height:auto;display:block}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0}
a{color:var(--crimson);text-decoration:none;transition:color .2s var(--ease)}
a:hover{color:var(--crimson-dk)}
ul{margin:0;padding:0;list-style:none}
hr{border:0;border-top:1px solid var(--line);margin:0}
:focus-visible{outline:2px solid var(--crimson);outline-offset:3px;border-radius:4px}
.topbar :focus-visible,.hero :focus-visible,.page-hero :focus-visible,.on-dark :focus-visible,
.cta :focus-visible,.tool-out :focus-visible,.site-footer :focus-visible,
.call-bar :focus-visible,.skip-link:focus-visible{outline-color:var(--gold-lt)}
/* .to-top is fixed over arbitrary page content, so an offset ring cannot rely on
   the backdrop — draw it directly on the button's own ink body instead. */
.to-top:focus-visible{outline:2px solid var(--gold-lt);outline-offset:-3px;box-shadow:0 0 0 2px rgba(255,255,255,.85),var(--sh-2)}
::selection{background:rgba(139,21,56,.15);color:var(--ink)}

.skip-link{
  position:absolute;left:-9999px;top:0;z-index:999;
  background:var(--ink);color:#fff;padding:12px 20px;border-radius:0 0 var(--r-sm) 0;font-weight:600
}
.skip-link:focus{left:0;color:#fff}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- 3. TYPE ---------- */
h1,h2,h3,h4,h5{
  font-family:var(--serif);
  color:var(--ink);
  margin:0;
  line-height:1.12;
  letter-spacing:-.015em;
  font-weight:700;
}
h1{font-size:clamp(2.4rem,5.4vw,4.1rem);line-height:1.05;letter-spacing:-.025em}
h2{font-size:clamp(1.9rem,3.6vw,2.9rem);letter-spacing:-.02em}
h3{font-size:clamp(1.15rem,1.7vw,1.42rem);letter-spacing:-.012em}
h4{font-size:1.02rem;letter-spacing:-.005em;font-family:var(--sans);font-weight:700}
p{margin:0 0 1.05em}
p:last-child{margin-bottom:0}
strong{color:var(--ink);font-weight:650}
.lead{font-size:clamp(1.06rem,1.55vw,1.24rem);line-height:1.62;color:var(--slate)}
.small{font-size:.875rem;line-height:1.6}
.micro{font-size:.78rem;line-height:1.55;color:var(--slate-lt)}
.serif{font-family:var(--serif)}
.accent{color:var(--crimson)}
.u-gold{
  background-image:linear-gradient(transparent 62%,rgba(201,162,39,.42) 62%);
  background-repeat:no-repeat;padding:0 .06em
}

/* eyebrow */
.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--sans);font-size:.74rem;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;
  color:var(--crimson);margin-bottom:18px
}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--gold);flex:none;border-radius:2px}
.on-dark .eyebrow{color:var(--gold-lt)}
.on-dark .eyebrow::before{background:var(--gold)}

/* ---------- 4. LAYOUT ---------- */
.wrap{width:min(100% - 44px,var(--wrap));margin-inline:auto}
.wrap-narrow{width:min(100% - 44px,var(--wrap-narrow));margin-inline:auto}
.section{padding:clamp(64px,8vw,116px) 0;position:relative}
.section--tight{padding:clamp(48px,5vw,74px) 0}
.section--sand{background:var(--sand)}
.section--paper{background:var(--paper)}
.section--white{background:var(--white)}
.section-head{max-width:760px;margin-bottom:clamp(34px,4vw,56px)}
.section-head--center{margin-inline:auto;text-align:center}
.section-head--center .eyebrow{justify-content:center}
.section-head p{margin-top:18px}

/* dark section */
.on-dark{background:var(--ink);color:rgba(255,255,255,.74);position:relative;overflow:hidden}
.on-dark h1,.on-dark h2,.on-dark h3,.on-dark h4{color:#fff}
.on-dark strong{color:#fff}
.on-dark .lead{color:rgba(255,255,255,.76)}
.on-dark::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(1000px 460px at 12% -12%,rgba(139,21,56,.30),transparent 62%),
    radial-gradient(760px 420px at 92% 108%,rgba(30,58,95,.85),transparent 60%);
}
.on-dark > *{position:relative;z-index:1}

.grid{display:grid;gap:22px}
.g-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,72px);align-items:center}
.split > *{min-width:0}
.stack-sm > * + *{margin-top:12px}
.center{text-align:center}
.mt-s{margin-top:16px}.mt-m{margin-top:28px}.mt-l{margin-top:44px}

/* hairline texture used across dark panels */
.rule-gold{width:52px;height:3px;background:var(--gold);border-radius:3px;margin:0 0 22px}

/* ---------- 5. HEADER ---------- */
.topbar{
  background:var(--ink);color:rgba(255,255,255,.62);
  font-size:.79rem;letter-spacing:.01em;
  border-bottom:1px solid rgba(255,255,255,.07)
}
.topbar .wrap{display:flex;flex-wrap:wrap;gap:8px 26px;align-items:center;padding:9px 0}
.topbar a{color:rgba(255,255,255,.78);display:inline-flex;align-items:center;gap:7px}
.topbar a:hover{color:var(--gold-lt)}
.topbar .tb-spacer{margin-left:auto}
.topbar .tb-tag{color:var(--gold-lt);font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:.7rem}

.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-top:4px solid var(--crimson);
  border-bottom:1px solid var(--line-2);
  box-shadow:0 1px 0 var(--line);
  transition:box-shadow .3s var(--ease),background .3s var(--ease)
}
.site-header.is-stuck{box-shadow:0 1px 0 var(--line),0 10px 30px rgba(11,18,32,.07);background:rgba(255,255,255,.98)}
.nav{display:flex;align-items:center;gap:22px;padding:22px 0;width:min(100% - 44px,var(--wrap));margin-inline:auto}

.brand{display:flex;align-items:center;gap:16px;flex:0 1 auto;min-width:0}
.brand:hover{color:inherit}
.brand-mark{width:44px;height:44px;flex:none}
.brand-txt{display:flex;flex-direction:column;line-height:1.05;min-width:0}
.brand-name{
  font-family:var(--serif);font-size:1.16rem;font-weight:700;color:var(--ink);
  letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.brand-sub{font-size:.6rem;letter-spacing:.19em;text-transform:uppercase;color:var(--slate-lt);font-weight:600;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* header lockup — the parent brand is the loudest thing on the page */
.site-header .brand-logo{width:88px;height:88px;border-radius:16px;padding:3px}
.site-header .brand-name{
  font-size:clamp(1.5rem,2.5vw,1.95rem);color:var(--crimson);
  font-weight:700;letter-spacing:-.025em;line-height:1.02
}
.site-header .brand-sub{
  font-size:.68rem;letter-spacing:.2em;color:var(--slate);
  margin-top:6px;padding-top:6px;border-top:2px solid var(--gold);
  display:inline-block;align-self:flex-start
}
.site-header .brand:hover .brand-name{color:var(--crimson-dk)}

/* The landing-page lockup gets a dedicated second row for navigation so the
   full company name and mark can lead without competing for horizontal room. */
@media (min-width:1151px){
  .home .nav{
    display:grid;grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"brand actions" "links links";
    gap:8px 28px;padding:10px 0
  }
  .home .brand{grid-area:brand;width:max-content;max-width:100%;gap:24px}
  .home .site-header .brand-logo{
    width:135px;height:135px;padding:4px;border-radius:20px;
    box-shadow:var(--sh-1)
  }
  .home .site-header .brand-name,
  .home .bb-firm{font-size:clamp(2.5rem,3.75vw,3.06rem)}
  .home .site-header .brand-sub{font-size:.72rem;letter-spacing:.21em;margin-top:8px;padding-top:8px}
  .home .nav-links{
    grid-area:links;margin-left:0;justify-content:center;
    padding-top:8px;border-top:1px solid var(--line-2)
  }
  .home .nav-actions{grid-area:actions}
  body:not(.home) .nav{gap:14px;padding:16px 0}
  body:not(.home) .site-header .brand-logo{width:72px;height:72px}
  body:not(.home) .site-header .brand-name{font-size:1.55rem}
  body:not(.home) .site-header .brand-sub{font-size:.62rem;letter-spacing:.13em}
  body:not(.home) .nav-links{gap:0}
  body:not(.home) .nav-links a{padding:10px 8px;font-size:.86rem}
}

/* ---------- BROKERAGE BAND (TREC Rule 1260-02-.12(3)(b)) ----------
   The rule requires the firm name as filed with the Commission, plus the firm
   telephone number, on every advertisement — and requires the firm name to be
   set "in letters the same size or larger" than the licensee's name or the name
   of any team, group, or similar entity. "Crimson Services Group" is the loudest
   name in the header, so O'Neill Property Management is matched to it exactly:
   .bb-firm and .site-header .brand-name share the same clamp(). If you ever
   change one, change the other, or the site falls out of compliance. */
.brokerage-band{background:var(--sand);border-bottom:1px solid var(--sand-2)}
.brokerage-band .wrap{
  display:flex;align-items:center;gap:14px 24px;flex-wrap:wrap;padding:16px 0
}
.bb-lockup{display:flex;align-items:center;gap:15px;min-width:0}
.bb-logo{
  height:56px;width:auto;flex:none;border-radius:8px;
  background:#fff;padding:4px;border:1px solid var(--line)
}
.bb-txt{display:flex;flex-direction:column;min-width:0}
.bb-eyebrow{
  font-size:.64rem;letter-spacing:.19em;text-transform:uppercase;
  font-weight:700;color:var(--slate-lt);margin-bottom:3px
}
.bb-firm{
  font-family:var(--serif);font-weight:700;color:var(--ink);
  font-size:clamp(1.5rem,2.5vw,1.95rem);letter-spacing:-.025em;line-height:1.04
}
.bb-meta{
  margin-left:auto;display:flex;flex-direction:column;gap:2px;
  text-align:right;font-size:.86rem;color:var(--slate)
}
.bb-meta a{font-weight:700;color:var(--crimson)}
.bb-meta .bb-sup{font-size:.76rem;color:var(--slate-lt);max-width:34ch}

.nav-links{display:flex;align-items:center;gap:4px;margin-left:auto;flex:none}
.nav-links > li{position:relative}
.nav-links a{
  display:block;padding:10px 14px;border-radius:var(--r-sm);
  color:var(--ink);font-size:.925rem;font-weight:500;letter-spacing:-.005em;
  transition:background .2s var(--ease),color .2s var(--ease)
}
.nav-links a:hover{background:rgba(11,18,32,.05);color:var(--ink)}
.nav-links a.is-active{color:var(--crimson);font-weight:650}
.nav-links a.is-active::after{
  content:"";display:block;height:2px;width:18px;background:var(--gold);
  border-radius:2px;margin:5px auto -2px
}
.nav-actions{display:flex;align-items:center;gap:12px;flex:none}
.nav-phone{
  font-weight:650;color:var(--ink);font-size:.92rem;white-space:nowrap;
  display:inline-flex;align-items:center;gap:8px
}
.nav-phone:hover{color:var(--crimson)}
.nav-toggle{display:none;width:44px;height:44px;border-radius:var(--r-sm);border:1px solid var(--line);align-items:center;justify-content:center}
.nav-toggle span{display:block;width:19px;height:2px;background:var(--ink);border-radius:2px;position:relative;transition:.25s var(--ease)}
.nav-toggle span::before,.nav-toggle span::after{
  content:"";position:absolute;left:0;width:19px;height:2px;background:var(--ink);border-radius:2px;transition:.25s var(--ease)
}
.nav-toggle span::before{top:-6px}
.nav-toggle span::after{top:6px}
.nav-toggle[aria-expanded="true"] span{background:transparent}
.nav-toggle[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
.nav-toggle[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}

/* ---------- 6. HERO ---------- */
.hero{
  position:relative;background:var(--ink);color:rgba(255,255,255,.8);
  overflow:hidden;isolation:isolate
}
/* Crimson flows through plum into navy for a balanced two-colour field. */
.hero::before{
  content:"";position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(860px 620px at 0% -8%,rgba(185,34,71,.38),transparent 64%),
    radial-gradient(900px 600px at 100% 108%,rgba(30,58,95,.72),transparent 68%),
    radial-gradient(620px 440px at 54% 112%,rgba(201,162,39,.10),transparent 64%),
    linear-gradient(125deg,#73142F 0%,#5B1A37 24%,#3B2945 46%,#243652 68%,#142A46 100%);
}
.hero::after{ /* fine engraved grid — conveys precision/audit */
  content:"";position:absolute;inset:0;z-index:0;opacity:.5;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(90% 78% at 50% 32%,#000 30%,transparent 82%);
  -webkit-mask-image:radial-gradient(90% 78% at 50% 32%,#000 30%,transparent 82%);
}
.hero-inner{position:relative;z-index:2;padding:clamp(72px,10vw,132px) 0 clamp(96px,10vw,148px)}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(34px,5vw,68px);align-items:center}
.hero-grid > *{min-width:0}
.hero-badge{
  display:inline-flex;align-items:center;gap:10px;
  padding:7px 16px 7px 8px;border-radius:var(--r-pill);
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
  font-size:.76rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
  color:rgba(255,255,255,.86);margin-bottom:26px
}
.hero-badge b{
  background:var(--gold);color:var(--ink);font-weight:800;
  padding:3px 9px;border-radius:var(--r-pill);font-size:.68rem;letter-spacing:.08em;
  white-space:nowrap
}
.hero h1{color:#fff;max-width:15ch}
.hero h1 em{font-style:normal;color:var(--gold-lt)}
.hero .lead{margin-top:24px;max-width:56ch;font-size:clamp(1.06rem,1.5vw,1.22rem);color:#fff}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.hero-cred{
  display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:38px;
  padding-top:26px;border-top:1px solid rgba(255,255,255,.12);
  font-size:.86rem;color:rgba(255,255,255,.66)
}
.hero-cred span{display:inline-flex;align-items:center;gap:9px}
.hero-cred svg{flex:none;color:var(--gold)}

/* hero brand panel */
/* cream card floating on the crimson hero */
.hero-panel{
  background:var(--paper);border:1px solid rgba(255,255,255,.5);
  border-radius:var(--r-lg);padding:30px;
  box-shadow:0 30px 70px rgba(0,0,0,.34)
}
.hero-panel h2{font-size:1.05rem;font-family:var(--sans);font-weight:700;color:var(--ink);letter-spacing:.01em}
.hero-panel .micro{color:var(--slate-lt)}
.brand-list{margin-top:20px;display:grid;gap:2px}
.brand-list a{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;
  padding:15px 14px;border-radius:var(--r);color:var(--ink);
  border:1px solid transparent;transition:.25s var(--ease)
}
.brand-list a:hover{background:var(--sand);border-color:var(--line);transform:translateX(3px)}
.bl-logo{
  width:48px;height:48px;border-radius:10px;padding:3px;overflow:hidden;
  display:grid;place-items:center;background:#fff;border:1px solid var(--line);
  box-shadow:var(--sh-1);transition:.25s var(--ease)
}
.bl-logo img{width:100%;height:100%;object-fit:contain;border-radius:6px}
.brand-list a:hover .bl-logo{border-color:rgba(139,21,56,.28);box-shadow:0 5px 14px rgba(15,27,45,.10)}
.bl-name{font-weight:650;font-size:.97rem;color:var(--ink);display:block;line-height:1.3}
.bl-desc{font-size:.79rem;color:var(--slate-lt);display:block}
.bl-arrow{color:rgba(15,27,45,.35);transition:.25s var(--ease)}
.brand-list a:hover .bl-arrow{color:var(--crimson);transform:translateX(3px)}

/* page hero (interior) */
.page-hero{position:relative;background:var(--crimson-dk);overflow:hidden;isolation:isolate}
.page-hero::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(950px 500px at 6% -20%,rgba(196,38,74,.78),transparent 62%),
    radial-gradient(760px 440px at 96% 122%,rgba(21,42,69,.66),transparent 64%),
    linear-gradient(155deg,#9A1937 0%,#8B1538 46%,#5E0E24 100%);
}
.page-hero-inner{position:relative;z-index:1;padding:clamp(52px,6.5vw,92px) 0 clamp(58px,7vw,96px);max-width:840px}
.page-hero h1{color:#fff;font-size:clamp(2.1rem,4.4vw,3.5rem)}
.page-hero .lead{color:rgba(255,255,255,.75);margin-top:20px;max-width:62ch}
.crumbs{font-size:.8rem;color:rgba(255,255,255,.5);margin-bottom:20px;letter-spacing:.02em}
.crumbs a{color:rgba(255,255,255,.72)}
.crumbs a:hover{color:var(--gold-lt)}
.crumbs span{margin:0 8px;opacity:.5}

/* ---------- 7. COMPONENTS ---------- */
/* buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:14px 26px;border-radius:var(--r-pill);
  font-size:.94rem;font-weight:650;letter-spacing:-.005em;
  border:1.5px solid transparent;white-space:nowrap;
  transition:transform .22s var(--ease),box-shadow .22s var(--ease),background .22s var(--ease),color .22s var(--ease),border-color .22s var(--ease)
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn svg{flex:none}
.btn--primary{background:var(--crimson);color:#fff;box-shadow:var(--sh-crimson)}
.btn--primary:hover{background:var(--crimson-dk);color:#fff;box-shadow:0 14px 34px rgba(139,21,56,.36)}
.btn--gold{background:var(--gold);color:var(--ink);box-shadow:0 10px 30px rgba(201,162,39,.3)}
.btn--gold:hover{background:var(--gold-lt);color:var(--ink)}
.btn--ink{background:var(--ink);color:#fff}
.btn--ink:hover{background:var(--ink-2);color:#fff}
.btn--ghost{border-color:var(--line);color:var(--ink);background:rgba(255,255,255,.5)}
.btn--ghost:hover{border-color:var(--ink);color:var(--ink);background:#fff}
.btn--light{border-color:rgba(255,255,255,.3);color:#fff}
.btn--light:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn--sm{padding:10px 19px;font-size:.87rem}
.btn--block{width:100%}

.link-arrow{display:inline-flex;align-items:center;gap:8px;font-weight:650;font-size:.93rem}
.link-arrow svg{transition:transform .25s var(--ease)}
.link-arrow:hover svg{transform:translateX(4px)}

/* chips */
.chips{display:flex;flex-wrap:wrap;gap:9px}
.chip{
  padding:7px 15px;border-radius:var(--r-pill);background:var(--white);
  border:1px solid var(--line);font-size:.83rem;font-weight:550;color:var(--slate);
  transition:.22s var(--ease)
}
.chip:hover{border-color:var(--crimson);color:var(--crimson);transform:translateY(-1px)}
.chip--solid{background:rgba(139,21,56,.07);border-color:rgba(139,21,56,.16);color:var(--crimson-dk)}

/* cards */
.card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:30px 28px;position:relative;overflow:hidden;
  transition:transform .34s var(--ease-out),box-shadow .34s var(--ease-out),border-color .34s var(--ease-out)
}
.card::before{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--crimson),var(--gold));
  transform:scaleX(0);transform-origin:left;transition:transform .42s var(--ease-out)
}
.card:hover{transform:translateY(-5px);box-shadow:var(--sh-2);border-color:transparent}
.card:hover::before{transform:scaleX(1)}
.card h3{margin-bottom:10px}
.card p{font-size:.94rem;color:var(--slate)}
.card-ico{
  width:48px;height:48px;border-radius:13px;display:grid;place-items:center;
  background:linear-gradient(145deg,rgba(139,21,56,.10),rgba(139,21,56,.03));
  color:var(--crimson);margin-bottom:20px;flex:none
}
.card-ico--gold{background:linear-gradient(145deg,rgba(201,162,39,.16),rgba(201,162,39,.05));color:#8A6D12}
.card-ico--navy{background:linear-gradient(145deg,rgba(30,58,95,.10),rgba(30,58,95,.03));color:var(--navy)}
.card--flat{border-radius:var(--r);padding:24px}
.card--flat:hover{transform:none;box-shadow:var(--sh-1);border-color:var(--line)}
.card--dark{
  background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.12);color:rgba(255,255,255,.72)
}
.card--dark p{color:rgba(255,255,255,.68)}
.card--dark:hover{background:rgba(255,255,255,.08);box-shadow:0 24px 50px rgba(0,0,0,.3)}

/* brand cards (home) */
.brand-card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;display:flex;flex-direction:column;
  transition:transform .34s var(--ease-out),box-shadow .34s var(--ease-out)
}
.brand-card:hover{transform:translateY(-6px);box-shadow:var(--sh-3)}
.bc-head{padding:30px 28px 26px;color:#fff;position:relative;overflow:hidden}
.bc-head::after{
  content:"";position:absolute;right:-40px;top:-40px;width:170px;height:170px;border-radius:50%;
  background:rgba(255,255,255,.07)
}
.bc-head--crimson{background:linear-gradient(150deg,var(--crimson) 0%,var(--crimson-dk) 100%)}
.bc-head--gold{background:linear-gradient(150deg,#B8891A 0%,#8A6412 100%)}
.bc-head--navy{background:linear-gradient(150deg,#1B3D6B 0%,var(--navy) 100%)}
.bc-head h3{color:#fff;position:relative;z-index:1;font-size:1.45rem}
.bc-kicker{
  font-size:.68rem;letter-spacing:.17em;text-transform:uppercase;font-weight:700;
  color:rgba(255,255,255,.72);margin-bottom:12px;position:relative;z-index:1
}
.bc-head p{margin:10px 0 0;font-size:.92rem;color:rgba(255,255,255,.84);position:relative;z-index:1}
.bc-body{padding:26px 28px 30px;display:flex;flex-direction:column;flex:1}
.bc-body ul{margin-bottom:24px;flex:1}
.bc-body li{
  display:flex;gap:11px;align-items:flex-start;padding:9px 0;
  border-bottom:1px solid var(--line-2);font-size:.92rem
}
.bc-body li:last-child{border-bottom:0}
.bc-body li svg{flex:none;margin-top:4px;color:var(--ok)}

/* stat strip */
.stats{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line);position:relative;z-index:3}
.stats--float{margin-top:calc(-1 * clamp(46px,5vw,66px));border-radius:var(--r-lg);border:1px solid var(--line);box-shadow:var(--sh-3)}
.stats-row{display:grid;grid-template-columns:repeat(4,1fr)}
.stat{padding:34px 26px;text-align:center;border-right:1px solid var(--line-2)}
.stat:last-child{border-right:0}
.stat-num{
  font-family:var(--serif);font-size:clamp(2rem,3.4vw,2.9rem);font-weight:700;
  color:var(--crimson);line-height:1;letter-spacing:-.03em
}
.stat-lbl{
  margin-top:10px;font-size:.76rem;letter-spacing:.13em;text-transform:uppercase;
  font-weight:650;color:var(--slate-lt)
}
.home .stat-num{color:var(--navy)}

/* feature rows */
.feat{display:flex;gap:17px;align-items:flex-start;padding:20px 0;border-bottom:1px solid var(--line-2)}
.feat:last-child{border-bottom:0}
.feat-ico{
  width:42px;height:42px;border-radius:11px;display:grid;place-items:center;flex:none;
  background:rgba(139,21,56,.08);color:var(--crimson)
}
.feat h4{margin-bottom:4px}
.feat p{font-size:.92rem;margin:0}

/* checklist */
.checks{display:grid;gap:12px}
.checks li{display:flex;gap:12px;align-items:flex-start;font-size:.94rem}
.checks svg{flex:none;margin-top:4px;color:var(--ok)}
.on-dark .checks svg{color:var(--gold)}

/* numbered level cards (RegReady L1–L4) */
.levels{display:grid;gap:20px;counter-reset:lvl}
.level{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:30px 30px 30px 96px;position:relative;
  transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out)
}
.level:hover{transform:translateX(4px);box-shadow:var(--sh-2)}
.level::before{
  counter-increment:lvl;content:"L" counter(lvl);
  position:absolute;left:28px;top:28px;
  width:50px;height:50px;border-radius:14px;display:grid;place-items:center;
  background:linear-gradient(150deg,var(--ink),var(--navy));color:var(--gold-lt);
  font-family:var(--serif);font-size:1.12rem;font-weight:700;letter-spacing:0
}
.level h3{margin-bottom:4px}
.level .lvl-purpose{
  font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  color:var(--crimson);margin-bottom:14px
}
.level p{font-size:.94rem}
.lvl-meta{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:18px}
.lvl-tag{
  font-size:.77rem;font-weight:600;padding:5px 12px;border-radius:var(--r-pill);
  background:var(--sand);color:var(--slate);border:1px solid var(--line-2)
}
.lvl-tag b{color:var(--ink)}

/* pricing */
.plans{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;align-items:stretch}
.plan{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:30px 26px;display:flex;flex-direction:column;position:relative;
  transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out)
}
.plan:hover{transform:translateY(-5px);box-shadow:var(--sh-2)}
.plan--featured{
  border-color:var(--crimson);box-shadow:var(--sh-2);
  background:linear-gradient(180deg,#fff,rgba(139,21,56,.03))
}
.plan-flag{
  position:absolute;top:-13px;left:50%;transform:translateX(-50%);
  background:var(--crimson);color:#fff;font-size:.68rem;font-weight:750;
  letter-spacing:.13em;text-transform:uppercase;padding:6px 15px;border-radius:var(--r-pill);
  white-space:nowrap;box-shadow:var(--sh-crimson)
}
.plan-name{font-family:var(--serif);font-size:1.22rem;color:var(--ink);font-weight:700;letter-spacing:-.015em}
.plan-price{margin:16px 0 4px;font-family:var(--serif);font-size:2.35rem;color:var(--ink);font-weight:700;letter-spacing:-.03em;line-height:1}
.plan-price sup{font-size:1.05rem;font-weight:500;top:-.7em;margin-right:2px}
.plan-per{font-size:.82rem;color:var(--slate-lt)}
.plan-save{
  display:inline-block;margin-top:14px;font-size:.76rem;font-weight:700;letter-spacing:.06em;
  color:var(--ok);background:rgba(31,122,77,.09);padding:5px 12px;border-radius:var(--r-pill)
}
.plan-credits{margin:22px 0;padding:18px 0;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);display:grid;gap:9px}
.plan-credits li{display:flex;justify-content:space-between;font-size:.88rem;gap:12px}
.plan-credits b{color:var(--ink);font-weight:650}
.plan-credits .muted{color:var(--slate-lt)}
.plan .btn{margin-top:auto}

/* tables */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--white);-webkit-overflow-scrolling:touch}
.table-scroll-hint{display:none;color:var(--slate-lt);font-size:.82rem;font-weight:650;margin-bottom:10px}
table{width:100%;border-collapse:collapse;min-width:560px;font-size:.92rem}
thead th{
  background:var(--ink);color:#fff;text-align:left;padding:15px 20px;
  font-size:.74rem;letter-spacing:.13em;text-transform:uppercase;font-weight:700;white-space:nowrap
}
tbody td{padding:15px 20px;border-bottom:1px solid var(--line-2);vertical-align:top}
tbody tr:last-child td{border-bottom:0}
tbody tr:nth-child(even){background:rgba(244,241,235,.5)}
tbody tr:hover{background:rgba(139,21,56,.035)}
td strong,th[scope="row"]{color:var(--ink);font-weight:650}
.t-num{font-variant-numeric:tabular-nums;white-space:nowrap}

/* accordion */
.acc{border:1px solid var(--line);border-radius:var(--r);background:var(--white);overflow:hidden;margin-bottom:12px;transition:box-shadow .25s var(--ease)}
.acc:hover{box-shadow:var(--sh-1)}
.acc.is-open{box-shadow:var(--sh-1);border-color:rgba(139,21,56,.28)}
.acc-q{
  width:100%;display:flex;justify-content:space-between;align-items:center;gap:18px;
  padding:19px 22px;text-align:left;font-weight:600;font-size:1rem;color:var(--ink);
  font-family:var(--sans);transition:color .2s var(--ease)
}
.acc-q:hover{color:var(--crimson)}
.acc.is-open .acc-q{color:var(--crimson)}
.acc-icon{
  width:26px;height:26px;border-radius:50%;border:1.5px solid var(--line);flex:none;
  display:grid;place-items:center;position:relative;transition:.28s var(--ease)
}
.acc-icon::before,.acc-icon::after{content:"";position:absolute;background:currentColor;border-radius:2px;transition:.28s var(--ease)}
.acc-icon::before{width:11px;height:1.8px}
.acc-icon::after{width:1.8px;height:11px}
.acc.is-open .acc-icon{background:var(--crimson);border-color:var(--crimson);color:#fff;transform:rotate(90deg)}
.acc.is-open .acc-icon::after{opacity:0}
.acc-a{max-height:0;overflow:hidden;visibility:hidden;transition:max-height .38s var(--ease),visibility 0s linear .38s}
.acc.is-open .acc-a{visibility:visible;transition:max-height .38s var(--ease),visibility 0s}
.acc-a-inner{padding:0 22px 22px;font-size:.95rem;color:var(--slate);max-width:78ch}

/* testimonials */
.quote-card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:34px 30px 28px;position:relative;
  transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out)
}
.quote-card:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.quote-card::before{
  content:"\201C";position:absolute;top:8px;right:24px;
  font-family:var(--serif);font-size:5.2rem;line-height:1;color:rgba(139,21,56,.10)
}
.quote-card blockquote{margin:0;font-size:1.01rem;line-height:1.6;color:var(--ink);font-family:var(--serif);font-weight:400;letter-spacing:-.01em}
.quote-meta{margin-top:22px;padding-top:18px;border-top:1px solid var(--line-2)}
.quote-name{font-weight:700;color:var(--ink);font-size:.92rem}
.quote-role{font-size:.82rem;color:var(--slate-lt)}
.stars{color:var(--gold);letter-spacing:2px;font-size:.86rem;margin-bottom:14px}

/* alert / callout */
.callout{
  display:flex;gap:20px;align-items:flex-start;
  background:var(--white);border:1px solid var(--line);border-left:4px solid var(--crimson);
  border-radius:var(--r);padding:24px 26px
}
.callout--gold{border-left-color:var(--gold);background:rgba(201,162,39,.05)}
.callout--dark{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);border-left-color:var(--gold);color:rgba(255,255,255,.78)}
.callout h4{margin-bottom:7px}
.callout p{font-size:.93rem;margin:0}
.callout-ico{flex:none;color:var(--crimson)}
.callout--gold .callout-ico{color:#8A6D12}
.callout--dark .callout-ico{color:var(--gold)}

/* resource links */
.res-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.res{
  display:flex;align-items:center;gap:15px;padding:17px 20px;background:var(--white);
  border:1px solid var(--line);border-radius:var(--r);color:var(--ink);
  transition:.26s var(--ease);font-size:.94rem;font-weight:550
}
.res:hover{border-color:var(--crimson);color:var(--crimson);transform:translateX(4px);box-shadow:var(--sh-1)}
.res-ico{
  width:38px;height:38px;border-radius:10px;background:var(--sand);color:var(--crimson);
  display:grid;place-items:center;flex:none;transition:.26s var(--ease)
}
.res:hover .res-ico{background:rgba(139,21,56,.1)}
.res-ext{margin-left:auto;color:var(--slate-lt);flex:none}

/* video cards */
.vid{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out)
}
.vid:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.vid-thumb{
  aspect-ratio:16/9;background:linear-gradient(150deg,var(--ink),var(--navy));
  display:grid;place-items:center;position:relative;overflow:hidden
}
.vid-thumb::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 50% 50%,rgba(139,21,56,.35),transparent 60%)
}
.vid-play{
  width:58px;height:58px;border-radius:50%;background:rgba(255,255,255,.94);
  display:grid;place-items:center;color:var(--crimson);position:relative;z-index:1;
  box-shadow:0 10px 28px rgba(0,0,0,.3);transition:.3s var(--ease)
}
.vid:hover .vid-play{transform:scale(1.09);background:#fff}
.vid-body{padding:22px 24px 24px}
.vid-body h4{margin-bottom:6px}
.vid-body p{font-size:.88rem;margin:0}
.vid-time{
  position:absolute;bottom:12px;right:12px;z-index:1;background:rgba(0,0,0,.65);
  color:#fff;font-size:.72rem;font-weight:600;padding:3px 9px;border-radius:5px
}

/* tools (calculators) */
.tool{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(26px,3.2vw,38px);box-shadow:var(--sh-1)
}
.tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,3.4vw,44px);align-items:start}
.tool-out{
  background:linear-gradient(160deg,var(--ink),var(--navy));border-radius:var(--r);
  padding:28px 26px;color:rgba(255,255,255,.76);position:relative;overflow:hidden
}
.tool-out::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(500px 260px at 90% -20%,rgba(139,21,56,.4),transparent 60%)
}
.tool-out > *{position:relative;z-index:1}
.tool-out h4{font-size:.76rem;letter-spacing:.15em;text-transform:uppercase;color:var(--gold-lt);margin-bottom:8px}
.tool-total{font-family:var(--serif);font-size:clamp(2.1rem,3.6vw,2.9rem);color:#fff;font-weight:700;letter-spacing:-.03em;line-height:1.05}
.tool-lines{margin-top:24px;padding-top:20px;border-top:1px solid rgba(255,255,255,.14);display:grid;gap:11px}
.tool-lines li{display:flex;justify-content:space-between;gap:14px;font-size:.89rem}
.tool-lines b{color:#fff;font-weight:600;font-variant-numeric:tabular-nums}
.tool-lines .tl-total{
  padding-top:12px;margin-top:4px;border-top:1px solid rgba(255,255,255,.14);
  font-weight:700;color:#fff;font-size:.98rem
}
.tool-note{font-size:.76rem;color:rgba(255,255,255,.66);margin-top:20px;line-height:1.55}

/* logo lockup panel */
.logo-panel{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(28px,4vw,46px);display:grid;place-items:center;box-shadow:var(--sh-1)
}
.logo-panel img{max-width:420px;width:100%}

/* map / county visual */
.county-band{background:var(--white);border-bottom:1px solid var(--line);padding:22px 0}
.county-band .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;justify-content:center}
.county-band .cb-label{
  font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--slate-lt)
}

/* CTA banner */
.cta{
  background:linear-gradient(140deg,var(--crimson-dk) 0%,var(--crimson) 55%,#B8232E 100%);
  border-radius:var(--r-lg);padding:clamp(38px,5vw,62px);text-align:center;color:#fff;
  position:relative;overflow:hidden;box-shadow:var(--sh-3)
}
.cta::before{
  content:"";position:absolute;inset:0;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(70% 80% at 50% 50%,#000,transparent 78%);
  -webkit-mask-image:radial-gradient(70% 80% at 50% 50%,#000,transparent 78%)
}
.cta > *{position:relative;z-index:1}
.cta h2{color:#fff;max-width:20ch;margin-inline:auto}
.cta p{color:rgba(255,255,255,.86);max-width:60ch;margin:18px auto 0}
.cta-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:30px}

/* ---------- 8. SPECIAL SECTIONS ---------- */
.founder{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(30px,5vw,64px);align-items:center}
.founder-media{
  aspect-ratio:4/5;border-radius:var(--r-lg);overflow:hidden;position:relative;
  background:linear-gradient(155deg,var(--ink),var(--navy));display:grid;place-items:center;
  box-shadow:var(--sh-3)
}
.founder-media::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(600px 400px at 30% 10%,rgba(139,21,56,.4),transparent 62%)
}
.founder-initials{
  position:relative;z-index:1;font-family:var(--serif);font-size:clamp(4rem,9vw,6.4rem);
  color:rgba(255,255,255,.9);letter-spacing:-.04em;font-weight:700
}
/* founder portrait fills the frame; the crimson wash sits above it, under the caption */
.founder-media img{
  position:absolute;inset:0;z-index:0;
  width:100%;height:100%;object-fit:cover;object-position:50% 18%
}
.founder-media::before{z-index:1;opacity:.35}
.founder-media::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,transparent 46%,rgba(15,27,45,.6) 100%)
}
.founder-cap{
  position:absolute;left:0;right:0;bottom:0;z-index:2;padding:26px 24px;
  background:linear-gradient(transparent,rgba(0,0,0,.72));color:#fff
}
.founder-cap strong{display:block;color:#fff;font-size:1.05rem}
.founder-cap span{font-size:.82rem;color:rgba(255,255,255,.7)}
.home .founder-cap strong{font-size:clamp(1.3rem,2vw,1.55rem);line-height:1.2}
.creds{display:grid;gap:10px;margin-top:26px}
.cred{
  display:flex;gap:13px;align-items:center;padding:13px 17px;background:var(--white);
  border:1px solid var(--line);border-radius:var(--r);font-size:.92rem
}
.cred svg{flex:none;color:var(--gold)}
.cred b{color:var(--ink)}

/* process timeline */
.timeline{position:relative;display:grid;gap:28px}
.timeline::before{content:"";position:absolute;left:19px;top:12px;bottom:12px;width:2px;background:linear-gradient(var(--crimson),var(--gold));opacity:.32}
.tl{display:grid;grid-template-columns:auto 1fr;gap:22px;position:relative}
.tl-dot{
  width:40px;height:40px;border-radius:50%;background:var(--white);border:2px solid var(--crimson);
  color:var(--crimson);display:grid;place-items:center;font-weight:750;font-size:.9rem;flex:none;z-index:1
}
.on-dark .tl-dot{background:var(--ink);border-color:var(--gold);color:var(--gold)}
.on-dark .timeline::before{background:linear-gradient(var(--gold),rgba(201,162,39,.1))}
.tl h4{margin-bottom:5px}
.tl p{font-size:.93rem;margin:0}

/* who we serve */
.serve{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.serve-item{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r);
  padding:26px 20px;text-align:center;transition:.3s var(--ease-out)
}
.serve-item:hover{transform:translateY(-4px);box-shadow:var(--sh-2);border-color:transparent}
.serve-item .card-ico{margin-inline:auto}
.serve-item h4{margin-bottom:6px}
.serve-item p{font-size:.85rem;margin:0}

/* security grid */
.sec-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.sec-item{
  padding:24px;border-radius:var(--r);background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);transition:.3s var(--ease-out)
}
.sec-item:hover{background:rgba(255,255,255,.09);transform:translateY(-3px)}
.sec-item .card-ico{background:rgba(201,162,39,.14);color:var(--gold-lt);width:42px;height:42px;margin-bottom:16px}
.sec-item h4{color:#fff;margin-bottom:6px;font-size:.97rem}
.sec-item p{font-size:.87rem;color:rgba(255,255,255,.65);margin:0}

/* ---------- 9. FORMS ---------- */
.form-card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(26px,3.2vw,40px);box-shadow:var(--sh-2)
}
.field{margin-bottom:18px}
.field label{
  display:block;font-size:.79rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--slate-lt);margin-bottom:8px
}
.field .req{color:var(--crimson)}
.field input,.field select,.field textarea{
  width:100%;padding:13px 16px;border:1.5px solid var(--line);border-radius:var(--r-sm);
  background:var(--paper);font-size:1rem;color:var(--ink);
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease),background .2s var(--ease)
}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--crimson);background:#fff;box-shadow:0 0 0 4px rgba(139,21,56,.09)
}
.field textarea{resize:vertical;min-height:118px}
.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%234B5566' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:44px}
.field-hint{display:block;margin-top:7px;font-size:.76rem;line-height:1.45;color:var(--slate-lt)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-note{font-size:.78rem;color:var(--slate-lt);margin-top:14px;text-align:center;line-height:1.5}
.form-ok{
  display:none;margin-top:18px;padding:18px 20px;background:rgba(31,122,77,.08);
  border:1px solid rgba(31,122,77,.24);border-radius:var(--r-sm);color:var(--ok);font-weight:600;font-size:.93rem
}
.form-ok.is-visible{display:flex;gap:11px;align-items:flex-start}
.consent{display:flex;gap:11px;align-items:flex-start;font-size:.82rem;color:var(--slate-lt);line-height:1.5}
.consent input{width:auto;flex:none;margin-top:3px;accent-color:var(--crimson)}
.consent-block + .consent-block{margin-top:16px}
.consent-details{margin:6px 0 0 29px;font-size:.78rem;line-height:1.55;color:var(--slate-lt)}
.consent a,.form-note a{color:var(--crimson);text-decoration:underline;text-underline-offset:2px}
.consent a:hover,.form-note a:hover{color:var(--crimson-dk)}
.consent-details a{color:var(--crimson);text-decoration:underline;text-underline-offset:2px}

/* SMS call-to-action and carrier disclosures */
.sms-disclosure{
  margin-top:22px;padding:22px;border:1px solid rgba(139,21,56,.22);
  border-left:4px solid var(--crimson);border-radius:var(--r-sm);background:rgba(139,21,56,.045)
}
.sms-disclosure h3{font-size:1.12rem;margin-bottom:8px}
.sms-disclosure p{font-size:.82rem;line-height:1.62;color:var(--slate);max-width:78ch}
.sms-disclosure a:not(.btn){color:var(--crimson);text-decoration:underline;text-underline-offset:2px}
.sms-disclosure .btn{margin-top:14px}
.sms-disclosure-kicker,.sms-optin-kicker{
  display:block;margin-bottom:6px;color:var(--crimson);font-size:.68rem;font-weight:800;
  letter-spacing:.14em;text-transform:uppercase
}
.sms-steps{margin:12px 0 14px;padding-left:1.2rem;color:var(--slate);font-size:.82rem;line-height:1.58}
.sms-steps li + li{margin-top:8px}
.sms-disclosure-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.sms-text-link{margin-top:14px;font-size:.82rem;font-weight:700}

/* Reviewer-friendly SMS consent card: adjacent to the telephone field and optional. */
.sms-optin-card{
  min-inline-size:0;scroll-margin-top:calc(var(--hdr-h,110px) + 28px);margin:-2px 0 20px;padding:20px;
  border:1.5px solid rgba(139,21,56,.3);border-radius:var(--r-sm);
  background:linear-gradient(145deg,rgba(139,21,56,.055),rgba(201,162,39,.045));
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease),background .2s var(--ease)
}
.sms-optin-card:target,.sms-optin-card:focus-within{
  border-color:var(--crimson);background:rgba(139,21,56,.065);box-shadow:0 0 0 4px rgba(139,21,56,.09)
}
.sms-optin-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:15px}
.sms-optin-head h4{font-size:1rem;line-height:1.3}
.sms-optin-status{
  flex:none;padding:5px 9px;border:1px solid rgba(31,122,77,.26);border-radius:var(--r-pill);
  background:rgba(31,122,77,.08);color:var(--ok);font-size:.66rem;font-weight:800;
  letter-spacing:.05em;text-transform:uppercase;white-space:nowrap
}
.sms-optin-instructions{margin:-2px 0 14px;font-size:.82rem;line-height:1.5;color:var(--slate)}
.sms-optin-control{display:grid;grid-template-columns:20px minmax(0,1fr);gap:11px;align-items:start}
.sms-optin-control input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--crimson)}
.sms-optin-control label{font-size:.84rem;line-height:1.58;color:var(--slate);cursor:pointer}
.sms-optin-control label strong{color:var(--ink)}
.sms-optin-details{margin:9px 0 0 31px;font-size:.76rem;line-height:1.55;color:var(--slate-lt)}
.sms-optin-details a{color:var(--crimson);text-decoration:underline;text-underline-offset:2px}

/* Privacy policy and SMS terms */
.legal-layout{display:grid;grid-template-columns:minmax(190px,250px) minmax(0,1fr);gap:clamp(30px,5vw,70px);align-items:start}
.legal-toc{
  position:sticky;top:calc(var(--hdr-h,110px) + 24px);padding:24px;border:1px solid var(--line);
  border-radius:var(--r);background:var(--white);box-shadow:var(--sh-1)
}
.legal-toc h2{font-family:var(--sans);font-size:.75rem;letter-spacing:.13em;text-transform:uppercase;margin-bottom:12px}
.legal-toc a{display:block;padding:7px 0;color:var(--slate);font-size:.88rem}
.legal-toc a:hover{color:var(--crimson)}
.legal-copy{min-width:0}
.legal-copy .effective-date{font-size:.86rem;color:var(--slate-lt);margin-bottom:28px}
.legal-copy section{scroll-margin-top:calc(var(--hdr-h,110px) + 24px);padding:0 0 34px;margin:0 0 34px;border-bottom:1px solid var(--line-2)}
.legal-copy section:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.legal-copy h2{font-size:clamp(1.35rem,2.3vw,1.8rem);margin-bottom:14px}
.legal-copy h3{font-family:var(--sans);font-size:1rem;margin:22px 0 8px}
.legal-copy p,.legal-copy li{color:var(--slate);line-height:1.72}
.legal-copy ul{padding-left:1.25rem;margin:12px 0 0;list-style:disc}
.legal-copy li + li{margin-top:8px}
.legal-copy a{color:var(--crimson);text-decoration:underline;text-underline-offset:2px}
.legal-callout{padding:20px 22px;border-radius:var(--r-sm);background:var(--sand);border-left:4px solid var(--gold);margin:20px 0}
.legal-callout strong{display:block;margin-bottom:5px}
.legal-callout p{margin:0}

/* contact info block */
.ci{display:grid;gap:2px}
.ci-item{display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-bottom:1px solid var(--line-2)}
.ci-item:last-child{border-bottom:0}
.ci-ico{
  width:42px;height:42px;border-radius:11px;background:var(--white);border:1px solid var(--line);
  display:grid;place-items:center;color:var(--crimson);flex:none
}
.ci-label{font-size:.74rem;letter-spacing:.13em;text-transform:uppercase;font-weight:700;color:var(--slate-lt)}
.ci-val{font-size:1.02rem;font-weight:600;color:var(--ink);display:block;margin-top:3px;word-break:break-word}
a.ci-val:hover{color:var(--crimson)}

/* ---------- 10. FOOTER ---------- */
.site-footer{background:var(--ink);color:rgba(255,255,255,.6);position:relative;overflow:hidden}
.site-footer::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(900px 400px at 8% 0%,rgba(139,21,56,.22),transparent 60%)
}
.footer-top{position:relative;z-index:1;display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:44px;padding:clamp(52px,6vw,80px) 0 clamp(38px,4vw,52px)}
.footer-brand .brand-name{color:#fff}
.footer-brand .brand-sub{color:rgba(255,255,255,.5)}
.footer-brand p{font-size:.9rem;margin-top:20px;max-width:38ch;color:rgba(255,255,255,.6)}
.footer-contact{margin-top:22px;display:grid;gap:9px;font-size:.9rem}
.footer-contact a{color:rgba(255,255,255,.82);display:inline-flex;gap:10px;align-items:center}
.footer-contact a:hover{color:var(--gold-lt)}
.footer-col h4{
  color:#fff;font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;
  margin-bottom:18px;font-family:var(--sans);font-weight:700
}
.footer-col a{display:block;padding:6px 0;color:rgba(255,255,255,.62);font-size:.9rem}
.footer-col a:hover{color:var(--gold-lt);transform:translateX(3px)}
.footer-col a{transition:color .2s var(--ease),transform .2s var(--ease)}
.footer-bottom{
  position:relative;z-index:1;border-top:1px solid rgba(255,255,255,.1);
  padding:24px 0;display:flex;flex-wrap:wrap;gap:12px 26px;align-items:center;
  font-size:.82rem;color:rgba(255,255,255,.48)
}
.footer-bottom .fb-links{margin-left:auto;display:flex;gap:22px;flex-wrap:wrap}
.footer-bottom a{color:rgba(255,255,255,.6)}
.footer-bottom a:hover{color:var(--gold-lt)}
.footer-legal{
  position:relative;z-index:1;border-top:1px solid rgba(255,255,255,.07);
  padding:20px 0 30px;font-size:.76rem;color:rgba(255,255,255,.74);line-height:1.6;max-width:100ch
}

/* back to top */
.to-top{
  position:fixed;right:22px;bottom:22px;z-index:90;width:46px;height:46px;border-radius:50%;
  background:var(--ink);color:#fff;display:grid;place-items:center;box-shadow:var(--sh-2);
  opacity:0;visibility:hidden;transform:translateY(12px);transition:.3s var(--ease)
}
.to-top.is-visible{opacity:1;visibility:visible;transform:translateY(0)}
.to-top:hover{background:var(--crimson);color:#fff}

/* ---------- 11. MOTION ---------- */
.js [data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
.js [data-reveal].is-in{opacity:1;transform:none}
[data-reveal]{opacity:1;transform:none}
.js [data-reveal][data-delay="1"]{transition-delay:.08s}
.js [data-reveal][data-delay="2"]{transition-delay:.16s}
.js [data-reveal][data-delay="3"]{transition-delay:.24s}
.js [data-reveal][data-delay="4"]{transition-delay:.32s}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important;transition-duration:.001ms !important}
  .acc-a{transition-delay:0s !important}
  .js [data-reveal]{opacity:1;transform:none}
}

/* ---------- 12. RESPONSIVE ---------- */
@media (max-width:1080px){
  .hero-grid{grid-template-columns:1fr;gap:44px}
  .hero-panel{max-width:560px}
  .serve{grid-template-columns:repeat(3,1fr)}
  .footer-top{grid-template-columns:1.4fr 1fr 1fr;gap:34px}
  .footer-col:last-child{grid-column:span 3;display:grid;grid-template-columns:repeat(4,1fr);gap:0 20px}
  .footer-col:last-child h4{grid-column:1/-1}
}
@media (max-width:1150px){
  html{scroll-padding-top:104px}
  .nav{padding:16px 0}
  .site-header .brand-logo{width:52px;height:52px}
  .site-header .brand-name{font-size:clamp(1.2rem,3.6vw,1.5rem)}
  .home .site-header .brand-logo{width:85px;height:85px}
  .home .site-header .brand-name,
  .home .bb-firm{font-size:2.06rem}
  .nav .brand{flex:1 1 auto;overflow:hidden}
  .nav .brand-logo{flex:none}
  .nav .brand-txt{flex:1 1 0;width:0;overflow:hidden}
  .nav .brand-sub{max-width:100%}
  .nav-links{
    position:fixed;left:0;right:0;top:100%;bottom:auto;
    max-height:var(--drawer-max,calc(100dvh - 170px));
    overscroll-behavior:contain;
    flex-direction:column;align-items:stretch;gap:0;background:var(--paper);
    padding:14px 22px 32px;border-top:1px solid var(--line);
    transform:translateY(-6px);opacity:0;visibility:hidden;overflow-y:auto;
    transition:transform .3s var(--ease),opacity .3s var(--ease),visibility 0s linear .3s;
    box-shadow:0 20px 40px rgba(11,18,32,.12)
  }
  .nav-links.is-open{transform:none;opacity:1;visibility:visible;transition-delay:0s}
  .nav-links a{padding:15px 6px;border-bottom:1px solid var(--line-2);border-radius:0;font-size:1.02rem}
  .nav-links a.is-active::after{display:none}
  .nav-links li:last-child a{border-bottom:0}
  .nav-toggle{display:flex;flex:0 0 44px;margin-left:auto}
  .nav-actions .btn{display:none}
  .nav-phone{display:none}
}
@media (max-width:940px){
  .split,.founder,.tool-grid{grid-template-columns:1fr;gap:34px}
  .legal-layout{grid-template-columns:1fr}
  .legal-toc{position:static}
  .founder-media{aspect-ratio:4/5;max-width:420px;margin-inline:auto}
  .g-3,.g-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .plans{grid-template-columns:repeat(2,1fr);gap:24px}
  .sec-grid{grid-template-columns:repeat(2,1fr)}
  .stats-row{grid-template-columns:repeat(2,1fr)}
  .stat{border-bottom:1px solid var(--line-2)}
  .stat:nth-child(2){border-right:0}
  .stat:nth-child(3),.stat:nth-child(4){border-bottom:0}
  .stats--float{margin-top:-30px}
}
@media (max-width:720px){
  body{font-size:16px}
  .wrap,.wrap-narrow{width:calc(100% - 36px)}
  .topbar .wrap{justify-content:center;text-align:center;gap:6px 16px;font-size:.74rem}
  .topbar .tb-spacer{margin-left:0}
  .g-2,.g-3,.g-4,.serve,.res-list,.plans,.sec-grid{grid-template-columns:1fr}
  .field-row{grid-template-columns:1fr}
  .level{padding:78px 24px 26px}
  .level::before{top:24px;left:24px}
  .footer-top{grid-template-columns:1fr;gap:32px}
  .footer-col:last-child{grid-column:auto;grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;align-items:flex-start}
  .footer-bottom .fb-links{margin-left:0;gap:16px}
  .hero-cred{gap:8px 16px;font-size:.8rem}
  .hero-cta{display:grid;grid-template-columns:1fr}
  .hero-cta .btn{width:100%}
  .hero-panel{width:100%;padding:26px 18px}
  .brand-list a{grid-template-columns:auto minmax(0,1fr) auto;gap:10px;padding:14px 8px}
  .consent input{width:18px;height:18px;margin-top:1px}
  .sms-optin-head{display:block}
  .sms-optin-status{display:inline-block;margin-top:10px;white-space:normal}
  .btn{max-width:100%;padding:13px 22px;white-space:normal;text-align:center}
  .nav{padding:13px 0;gap:12px}
  .site-header .brand-logo{width:46px;height:46px}
  .site-header .brand-name{font-size:1.12rem}
  .site-header .brand-sub{font-size:.625rem;letter-spacing:.12em;padding-top:4px;margin-top:4px;border-top-width:1.5px}
  .home .nav .brand{gap:8px}
  .home .site-header .brand-logo{width:70px;height:70px}
  .home .site-header .brand-name,
  .home .bb-firm{font-size:1.6rem}
  .home .site-header .brand-name{
    white-space:normal;overflow:visible;text-overflow:clip;line-height:1
  }
  .home .site-header .brand-sub{font-size:.625rem;letter-spacing:.1em}
  /* .bb-firm shares brand-name's clamp, so it tracks down with it automatically */
  .brokerage-band .wrap{padding:10px 0;gap:8px 10px}
  .bb-logo{height:44px}
  .bb-meta{margin-left:0;text-align:left;flex-basis:100%;font-size:.8rem;line-height:1.5}
  .page-hero .logo-tile{height:132px;padding:14px}
  .page-hero .logo-tile img{max-height:104px;max-width:220px}
  .cred-mark{flex:1 1 100%}
  .cta-actions .btn{width:100%}
}
@media (max-width:480px){
  .topbar .wrap{gap:3px 16px;padding:7px 0}
  .topbar a{min-height:28px}
}
@media (max-width:400px){
  .site-header .brand-sub{display:none}
}

/* ---------- 13. PRINT ---------- */
@media print{
  .site-header,.topbar,.to-top,.nav-toggle,.cta,.site-footer{display:none !important}
  body{background:#fff;color:#000;font-size:11pt}
  .on-dark,.hero,.page-hero{background:#fff !important;color:#000 !important}
  .on-dark h1,.on-dark h2,.hero h1,.page-hero h1{color:#000 !important}
  .card,.plan,.level{break-inside:avoid;box-shadow:none;border:1px solid #ccc}
  a{color:#000;text-decoration:underline}
}

/* ---------- 14. BRAND MARKS & DISCLOSURES (added) ---------- */
.brand-logo{
  width:46px;height:46px;flex:none;border-radius:11px;object-fit:contain;
  background:#fff;padding:2px;border:1px solid var(--line-2)
}
.footer-brand .brand-logo{border-color:rgba(255,255,255,.16)}

/* logo tile — brand jpgs sit on their own white card.
   The three brand marks have different aspect ratios (Crimson Solutions is 3:2,
   the other two are square), so the tile owns the box and the image is contained
   inside it. That keeps the three cards optically level instead of one running short. */
.logo-tile{
  background:#fff;border-radius:var(--r);padding:14px;display:grid;place-items:center;
  border:1px solid var(--line);box-shadow:var(--sh-1)
}
.logo-tile img{width:auto;max-width:100%;height:auto;border-radius:8px;object-fit:contain}
.on-dark .logo-tile{border-color:rgba(255,255,255,.18)}

/* page-hero lockup — the brand mark should be the first thing that lands */
.page-hero .logo-tile{
  padding:20px;height:170px;width:fit-content;
  box-shadow:0 18px 44px rgba(0,0,0,.28)
}
.page-hero .logo-tile img{max-height:130px;max-width:300px}

/* brand cards on the home page — fixed tile box so all three line up */
.bc-head .logo-tile{
  background:rgba(255,255,255,.96);border:0;padding:12px;
  box-shadow:0 10px 26px rgba(0,0,0,.22);
  height:112px;width:132px
}
.bc-head .logo-tile img{max-height:88px;max-width:108px}

/* Keep the home-page brand panels aligned without clipping wrapped copy. */
@media (min-width:721px){
  #companies .bc-head{min-height:376px}
}
@media (min-width:1100px){
  #companies .bc-head{min-height:352px}
}
@supports (grid-template-rows:subgrid){
  @media (min-width:721px){
    #companies .brand-card{
      display:grid;grid-template-rows:subgrid;grid-row:span 2;row-gap:0
    }
    #companies .bc-head{min-height:0}
  }
}

/* credentials & affiliations band — certification marks + brokerage lockup */
.cred-band{background:var(--white);border-bottom:1px solid var(--line)}
.cred-band .wrap{padding:30px 0}
.cred-band-head{
  font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700;
  color:var(--slate-lt);margin-bottom:20px
}
.cred-marks{display:flex;flex-wrap:wrap;gap:16px;align-items:stretch}
.cred-mark{
  display:flex;align-items:center;gap:15px;
  background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--crimson);
  border-radius:var(--r);padding:15px 20px;flex:1 1 260px;min-width:0
}
.cred-mark img{max-height:56px;width:auto;flex:none;border-radius:4px}
/* NNA badge is square artwork and carries its own lockup — give it a little more room
   and no rounding, so their mark is not altered. */
.nna-badge{flex:none;display:block;line-height:0}
.nna-badge img{max-height:72px;width:auto;border-radius:0}
.cred-mark-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.cred-mark-txt b{font-size:.94rem;color:var(--ink);line-height:1.3}
.cred-mark-txt span{font-size:.78rem;color:var(--slate-lt);line-height:1.4}
/* text stand-in for a certification seal until the official artwork is dropped in */
.cred-seal{
  flex:none;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;
  background:var(--ink);color:var(--gold-lt);border:2px solid var(--gold);
  font-family:var(--serif);font-weight:700;font-size:1.02rem;letter-spacing:.02em;line-height:1
}
.cred-mark .realtor-logo,.disc .realtor-logo{
  width:68px;height:auto;max-height:none;border-radius:0;flex:none
}

/* affiliation / licence strip */
.disclosure{background:var(--sand);border-top:1px solid var(--line)}
.disclosure-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.disc{
  background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:20px 22px;
  display:flex;flex-direction:column;gap:4px
}
.disc--flag{border-left:4px solid var(--crimson)}
.disc-label{font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;font-weight:700;color:var(--slate-lt)}
.disc-val{font-size:1.05rem;font-weight:700;color:var(--navy);line-height:1.3}
a.disc-val:hover{color:var(--crimson)}
.disc-note{font-size:.76rem;color:var(--slate-lt);margin-top:2px}
.disc-logo{margin-top:10px;max-height:46px;width:auto}

/* broker line repeated in every footer (TREC) */
.broker-line{
  display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;
  font-size:.82rem;color:rgba(255,255,255,.76)
}
.broker-line strong{color:rgba(255,255,255,.9);font-weight:650}
.broker-line a{color:var(--gold-lt)}

/* T.C.A. 8-16-201(a)(1) requires this notice verbatim and in "conspicuous size"
   on every advertisement of notary services by a non-attorney notary. The statute
   names no point size, so it is set larger and heavier than the surrounding legal
   text and boxed, rather than folded into the fine print. Omission is a deceptive
   act under 8-16-203 / 47-18-104 — do not shrink, reword, or delete it. */
.notary-notice{
  margin:16px 0 0;padding:14px 18px;
  border:1.5px solid var(--gold);border-radius:var(--r-sm);
  background:rgba(201,162,39,.09);
  font-size:.92rem;font-weight:700;line-height:1.45;letter-spacing:.015em;
  color:#fff
}

.eho-line{
  display:flex;align-items:flex-start;gap:11px;margin:14px 0 0;
  font-size:.78rem;line-height:1.5;color:rgba(255,255,255,.68)
}
.eho-mark{
  flex:none;width:30px;height:30px;border-radius:4px;display:grid;place-items:center;
  border:1.5px solid rgba(255,255,255,.6);color:rgba(255,255,255,.85);
  font-size:.56rem;font-weight:800;letter-spacing:.04em
}

/* mobile sticky call bar */
.call-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:95;display:none;
  background:var(--crimson);color:#fff;padding:3px 16px;
  box-shadow:0 -6px 22px rgba(15,27,45,.24)
}
.call-bar a{
  color:#fff;display:flex;align-items:center;justify-content:center;gap:10px;
  min-height:44px;font-weight:700;font-size:.98rem
}
/* These must stay last in the file: the base .disclosure-grid rule above is
   unconditional, so its responsive overrides have to come after it to win. */
@media (max-width:940px){
  .disclosure-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:720px){
  .call-bar{display:block}
  body{padding-bottom:58px}
  .to-top{bottom:74px}
  .disclosure-grid{grid-template-columns:1fr}
  .page-hero .logo-tile{height:132px;padding:14px}
  .page-hero .logo-tile img{max-height:104px;max-width:220px}
  .table-scroll-hint{display:block}
}
