/* ==========================================================================
 Oklahoma Homestead Law, brand system
 Palette per approved brand board. Navy leads; Sky Blue and Warm Tan are
 decorative only (2.28:1 and 1.69:1 on cream, below the text threshold).
 ========================================================================== */

:root{
 --okhl-navy:#102D45;
 --okhl-sky-blue:#6FA8DC;
 --okhl-prairie-blue:#3F6F9F;
 --okhl-warm-tan:#D8B98B;
 --okhl-buffalo-brown:#8A5A3B;
 --okhl-olive-green:#7A8762;
 --okhl-soft-cream:#F7F3E8;

 /* Darkened steps for text use only. Brand hues above are never altered. */
 --prairie-700:#2F5478;
 --buffalo-700:#6B452D;
 --olive-700:#5C6749;

 --surface:var(--okhl-soft-cream);
 --raised:#FFFDF7;
 --sunken:#EFE9DA;
 --border:#DDD3BD;
 --text:var(--okhl-navy);
 --text-muted:var(--olive-700);
 --link:var(--prairie-700);

 --font-display:'Heritage Slab','Zilla Slab','Roboto Slab',Georgia,serif;
 --font-serif:'Merriweather',Georgia,'Times New Roman',serif;
 --font-body:'Lato','Source Sans 3',system-ui,-apple-system,sans-serif;

 --measure:68ch; --wrap:76rem;
 --s1:.25rem;--s2:.5rem;--s3:.75rem;--s4:1rem;--s6:1.5rem;--s8:2rem;--s12:3rem;--s16:4rem;
}

*,*::before,*::after{box-sizing:border-box}

/* ==========================================================================
   BRAND ASSET RULE, theme level.
   Logos and brand marks are artwork, not photography. They are never cropped
   to fill a container. If a mark needs more room, the container grows.
     PHOTOGRAPHY  may use object-fit:cover
     LOGOS/MARKS  use object-fit:contain, and never a cover utility
   ========================================================================== */
.brand img,
.site-foot__brand,
.hero__mark,
.story-teaser__mark,
img[src*="/images/brand/"],
img[src*="/images/favicon/"]{
  object-fit:contain;
  object-position:center;
  max-width:100%;
  height:auto;
}
/* No ancestor of a brand mark may clip it. */
.brand,.site-foot__brand,.hero__mark,.story-teaser__mark{overflow:visible}


html{font-size:100%}
body{margin:0;background:var(--surface);color:var(--text);
 font-family:var(--font-body);font-size:1.0625rem;line-height:1.65;-webkit-text-size-adjust:100%}
.wrap{width:min(100% - 2rem,var(--wrap));margin-inline:auto}
img{max-width:100%;height:auto}

h1,h2,h3,h4{font-family:var(--font-display);color:var(--okhl-navy);
 line-height:1.15;letter-spacing:-.01em;margin:0 0 var(--s4)}
h1{font-size:clamp(2rem,5vw,3rem);margin-top:var(--s6)}
h2{font-size:clamp(1.4rem,3vw,1.9rem);margin-top:var(--s12)}
h3{font-size:1.25rem;margin-top:var(--s8)}
p,li,dd{max-width:var(--measure)}
a{color:var(--link)}a:hover{color:var(--okhl-navy)}

.skip{position:absolute;left:-9999px}
.skip:focus{left:var(--s4);top:var(--s4);z-index:100;background:var(--raised);
 padding:var(--s3) var(--s4);border:2px solid var(--okhl-navy);border-radius:4px}
:where(a,button,input,select,[tabindex]):focus-visible{
 outline:3px solid var(--okhl-prairie-blue);outline-offset:2px}

/* ---------- Header ---------- */
.site-head{background:var(--okhl-soft-cream);border-bottom:3px solid var(--okhl-warm-tan)}
.site-head__in{display:flex;flex-wrap:wrap;gap:var(--s4);align-items:center;
 justify-content:space-between;padding:var(--s4) 0 var(--s3)}
.brand{display:inline-block;line-height:0}
.brand__horizontal{width:clamp(240px,27vw,340px);height:auto;display:block}
.brand__stacked{width:160px;height:auto;display:none}
@media(max-width:34rem){
 .brand__horizontal{display:none}
 .brand__stacked{display:block}
}
.nav{display:flex;flex-wrap:wrap;gap:var(--s4)}
.nav a{color:var(--okhl-navy);text-decoration:none;font-size:.95rem;font-weight:600;
 padding:var(--s1) 0;border-bottom:2px solid transparent}
.nav a:hover,.nav a:focus-visible{border-bottom-color:var(--okhl-sky-blue)}
.cta{display:inline-block;background:var(--okhl-prairie-blue);color:#fff;font-weight:700;
 padding:var(--s2) var(--s4);border-radius:4px;text-decoration:none;font-size:.9rem}
.cta:hover{background:var(--okhl-navy);color:#fff}

.crumbs ol{display:flex;flex-wrap:wrap;gap:var(--s2);list-style:none;padding:var(--s4) 0 0;
 margin:0;font-size:.9rem;color:var(--olive-700)}
.crumbs li+li::before{content:"/";margin-right:var(--s2);color:var(--okhl-warm-tan)}
.lede{font-family:var(--font-serif);font-size:1.15rem;line-height:1.65;color:var(--okhl-navy)}

/* ---------- Hero ---------- */
.hero{background:var(--okhl-navy);color:var(--okhl-soft-cream);padding:var(--s12) 0;
 border-bottom:4px solid var(--okhl-warm-tan)}
.hero__in{display:grid;gap:var(--s8);align-items:center}
@media(min-width:52rem){.hero__in{grid-template-columns:1.25fr .75fr}}
.hero h1{color:var(--okhl-soft-cream);max-width:18ch;margin-top:0}
.hero__lede{font-family:var(--font-serif);font-size:1.15rem;color:#E8E2D2;max-width:52ch}
.hero__mark{justify-self:center;width:min(100%,340px);height:auto;display:block}
.hero__ctas{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s6)}
.hero__ctas a{display:inline-block;padding:var(--s3) var(--s6);border-radius:4px;
 text-decoration:none;font-weight:700}
.btn-primary{background:var(--okhl-warm-tan);color:#3A2A18}
.btn-primary:hover{background:#E8CDA4;color:#3A2A18}
.btn-ghost{border:2px solid var(--okhl-sky-blue);color:var(--okhl-sky-blue)}
.btn-ghost:hover{background:var(--okhl-sky-blue);color:var(--okhl-navy)}

/* ---------- Icon cards ---------- */
.cards{list-style:none;padding:0;display:grid;gap:var(--s4);
 grid-template-columns:repeat(auto-fill,minmax(16rem,1fr))}
.cards li{max-width:none}
.cards a{display:block;height:100%;padding:var(--s6);background:var(--raised);
 border:1px solid var(--border);border-top:3px solid var(--okhl-warm-tan);
 border-radius:6px;text-decoration:none;
 box-shadow:0 1px 2px rgba(16,45,69,.05)}
.cards a:hover{border-color:var(--okhl-prairie-blue);border-top-color:var(--okhl-prairie-blue)}
.cards strong{display:block;font-family:var(--font-display);font-size:1.2rem;
  color:var(--okhl-navy);line-height:1.2}
.cards span{display:block;color:var(--olive-700);font-size:.95rem;margin-top:var(--s2)}
.cards em{display:block;font-style:normal;color:var(--prairie-700);font-weight:700;
 font-size:.9rem;margin-top:var(--s3)}
/* External destination, stated in words. Never carried by an icon or colour. */
.cards__ext{display:block;color:var(--olive-700);font-size:.8125rem;
 margin-top:var(--s2)}


/* ---------- Jurisdiction callout ---------- */
.juris{background:var(--raised);border:1px solid var(--border);
 border-left:6px solid var(--okhl-prairie-blue);border-radius:6px;
 padding:var(--s6);margin:var(--s8) 0}
.juris__h{font-size:1.15rem;margin:0 0 var(--s4)}
.juris__list{margin:0}
.juris__row{display:grid;gap:var(--s1);padding:var(--s3) 0;border-top:1px solid var(--border)}
.juris__row:first-child{border-top:0;padding-top:0}
.juris__row dt{font-weight:700;color:var(--buffalo-700)}
.juris__row dd{margin:0}
.juris__note{display:block;font-size:.9rem;color:var(--olive-700);margin-top:var(--s1)}
@media(min-width:40rem){.juris__row{grid-template-columns:17rem 1fr;gap:var(--s4);align-items:baseline}}
.juris--home{border-left-color:var(--okhl-buffalo-brown)}

/* ---------- Source status ---------- */
.badge{display:inline-block;font-size:.75rem;font-weight:700;letter-spacing:.02em;
 padding:.15rem .5rem;border-radius:3px;white-space:nowrap}
.badge--primary{background:#E6EFE4;color:#2C5233}
.badge--officialguidance,.badge--official-guidance{background:#F7EED8;color:var(--buffalo-700)}
.badge--researchresource,.badge--research-resource{background:#E3ECF5;color:var(--prairie-700)}
.badge--conflict{background:#F7E4E0;color:#8C2F22}

.sources{margin-top:var(--s12);padding-top:var(--s6);border-top:2px solid var(--okhl-warm-tan)}
.sources__list{list-style:none;padding:0}
.sources__item{max-width:var(--measure);padding:var(--s3) 0;border-bottom:1px solid var(--border)}
.sources__cite{font-family:var(--font-serif);font-size:.9rem;color:var(--olive-700)}
.sources__meta{display:block;font-size:.85rem;color:var(--olive-700)}
.reviewed{font-size:.9rem;color:var(--olive-700)}

.official-src__label{display:block;font-size:.75rem;font-weight:700;letter-spacing:.08em;
 text-transform:uppercase;color:var(--olive-700);margin-bottom:var(--s1)}

/* ---------- Upcoming change ---------- */
.upcoming{background:#F7EEE4;border:1px solid var(--okhl-buffalo-brown);border-radius:6px;
 padding:var(--s6);margin:var(--s8) 0}
.upcoming--live{background:#E6EFE4;border-color:#2C5233}
.upcoming__flag{margin:0 0 var(--s2);font-size:.8rem;font-weight:700;text-transform:uppercase;
 letter-spacing:.06em;color:var(--buffalo-700)}
.upcoming--live .upcoming__flag{color:#2C5233}
.upcoming__title{margin-top:0}
.upcoming__grid{display:grid;gap:var(--s6)}
.upcoming__col h4{font-family:var(--font-body);font-size:.9rem;text-transform:uppercase;
 letter-spacing:.04em;color:var(--olive-700);margin-bottom:var(--s2)}
.upcoming__measure{font-size:.9rem;color:var(--olive-700);margin-bottom:0}
@media(min-width:44rem){.upcoming__grid{grid-template-columns:1fr 1fr}}

/* ---------- Story teaser ---------- */
.story-teaser{background:var(--raised);border-top:3px solid var(--okhl-warm-tan);
 border-bottom:3px solid var(--okhl-warm-tan);padding:var(--s12) 0;margin:var(--s16) 0}
.story-teaser__in{display:grid;gap:var(--s8);align-items:center}
@media(min-width:52rem){.story-teaser__in{grid-template-columns:1fr 320px}}
.story-teaser h2{margin-top:0;font-size:clamp(1.8rem,4vw,2.5rem)}
.story-teaser__sub{font-family:var(--font-serif);font-size:1.15rem;color:var(--okhl-navy)}
.story-teaser__mark{justify-self:center;width:min(100%,300px);height:auto;display:block}

/* ---------- Timeline ---------- */
.tl{list-style:none;padding:0;margin:var(--s8) 0;border-left:3px solid var(--okhl-warm-tan)}
.tl li{max-width:none;position:relative;padding:0 0 var(--s8) var(--s8)}
.tl li::before{content:"";position:absolute;left:-9px;top:.45rem;width:15px;height:15px;
 border-radius:50%;background:var(--okhl-prairie-blue);border:3px solid var(--surface)}
.tl__year{display:block;font-family:var(--font-display);font-size:1.3rem;color:var(--okhl-navy)}
.tl__title{display:block;font-weight:700;color:var(--buffalo-700);margin:var(--s1) 0}
.tl p{margin:var(--s2) 0 0}

/* ---------- Stats ---------- */
.stats{display:grid;gap:var(--s4);margin:var(--s8) 0;
 grid-template-columns:repeat(auto-fit,minmax(13rem,1fr))}
.stat{background:var(--okhl-navy);color:var(--okhl-soft-cream);border-radius:6px;
 padding:var(--s6);text-align:center}
.stat b{display:block;font-family:var(--font-display);font-size:clamp(1.8rem,5vw,2.6rem);
 line-height:1.1;color:var(--okhl-warm-tan)}
.stat span{display:block;font-size:.95rem;margin-top:var(--s2);color:#E8E2D2;max-width:none}

/* ---------- Misc ---------- */
.warn{background:var(--raised);border-left:6px solid var(--okhl-buffalo-brown);
 padding:var(--s4) var(--s6);margin:var(--s8) 0;border-radius:0 6px 6px 0}
.warn p{margin:0}
.callout{background:var(--sunken);border:2px solid var(--okhl-prairie-blue);border-radius:6px;
 padding:var(--s6);margin:var(--s8) 0}
.callout h2,.callout h3{margin-top:0}
.pending{background:var(--sunken);border:1px dashed var(--okhl-buffalo-brown);
 border-radius:6px;padding:var(--s6);margin:var(--s4) 0}
.pending p{margin-top:0}.pending p:last-child{margin-bottom:0}
.resources{list-style:none;padding:0}
.resources li{padding:var(--s3) 0;border-bottom:1px solid var(--border);max-width:var(--measure)}
.resources li span{display:block;font-size:.9rem;color:var(--olive-700);margin-top:var(--s1)}
.note-small{font-size:.9rem;color:var(--olive-700);max-width:var(--measure)}
.related{padding-left:1.1rem}.related li{margin-bottom:var(--s2)}
.offices__row{padding:var(--s3) 0;border-bottom:1px solid var(--border)}
.offices__row dt{font-weight:700}
.offices__row dd{margin:var(--s1) 0 0;display:flex;flex-wrap:wrap;gap:var(--s4)}
.cmp{border-collapse:collapse;width:100%;max-width:var(--measure);margin:var(--s6) 0}
.cmp caption{text-align:left;font-size:.9rem;color:var(--olive-700);padding-bottom:var(--s2)}
.cmp th,.cmp td{text-align:left;padding:var(--s3);border-bottom:1px solid var(--border);vertical-align:top}
.cmp thead th{border-bottom:2px solid var(--okhl-warm-tan);font-family:var(--font-body);
 font-size:.9rem;text-transform:uppercase;letter-spacing:.04em;color:var(--olive-700)}
.cmp tbody th{font-weight:700;width:9rem}
.steps{padding-left:1.3rem}.steps li{margin-bottom:var(--s3)}

/* ---------- County finder ---------- */
.county-motif{display:block;margin:var(--s6) auto;max-width:520px;width:100%}
.finder{margin:var(--s6) 0;display:none}
.finder--on{display:block}
.finder__label{display:block;font-size:.9rem;font-weight:700;color:var(--olive-700);margin-bottom:var(--s2)}
.finder__input{width:min(100%,26rem);font-family:var(--font-body);font-size:1.0625rem;
 padding:var(--s3) var(--s4);border:2px solid var(--border);border-radius:6px;
 background:var(--raised);color:var(--okhl-navy)}
.finder__input:focus{border-color:var(--okhl-prairie-blue);outline:none;
 box-shadow:0 0 0 3px rgba(63,111,159,.25)}
.finder__count{font-size:.9rem;color:var(--olive-700);margin:var(--s2) 0 0}
.finder__empty{background:var(--sunken);border:1px dashed var(--okhl-buffalo-brown);
 border-radius:6px;padding:var(--s4);max-width:var(--measure)}
.county-grid{list-style:none;padding:0;display:grid;gap:var(--s2);
 grid-template-columns:repeat(auto-fill,minmax(11rem,1fr))}
.county-grid li{max-width:none}
.county-grid li[hidden]{display:none}
.county-grid a{display:block;padding:var(--s3);background:var(--raised);
 border:1px solid var(--border);border-radius:4px;text-decoration:none;font-weight:600}
.county-grid a:hover{border-color:var(--okhl-prairie-blue);background:#fff}
.county-grid small{display:block;color:var(--olive-700);font-size:.8rem;font-weight:400}

/* ---------- Footer ----------
   Light sage, derived from Olive Green #7A8762 tinted into Soft Cream.
   Not navy: the stacked logo is navy typography and vanished on a dark band.
   Not plain cream either: the footer needs to read as a distinct region.
   #DFE4D0 sits 1.17x off the page background, which is enough to register as
   a change of surface without becoming a heavy block. Navy on it: 10.88:1. */
:root{--okhl-footer:#DFE4D0}
.site-foot{margin-top:var(--s16);padding:var(--s12) 0;
  background:var(--okhl-footer);color:var(--okhl-navy);
  border-top:1px solid #C9D1B8}
.site-foot__in{display:grid;gap:var(--s8);align-items:start}
@media(min-width:52rem){.site-foot__in{grid-template-columns:230px 1fr}}
.site-foot__brand{width:min(100%,210px);height:auto;display:block}
.site-foot a{color:var(--prairie-700);font-weight:600}
.site-foot a:hover{color:var(--okhl-navy)}
.foot-nav{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s6);margin:0 0 var(--s6);
  font-size:.95rem;padding:0;list-style:none}
/* Disclaimer: subordinate, comfortable, not a wall of text. */
.disclaimer{font-size:.875rem;line-height:1.7;color:var(--olive-700);max-width:58ch;margin:0}
.nonaffil{font-size:.8125rem;line-height:1.7;color:var(--olive-700);max-width:58ch;
  border-top:1px solid #C9D1B8;padding-top:var(--s4);margin-top:var(--s4)}
.site-foot__meta{font-size:.8125rem;color:var(--olive-700);margin-top:var(--s4)}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{
 animation-duration:.01ms!important;transition-duration:.01ms!important}}
@media print{.site-head,.nav,.skip,.hero__ctas{display:none}body{background:#fff;color:#000}}

/* Definition-list wrapper used by form tables and clerk blocks */
.offices{margin:var(--s4) 0}
.offices__ver{font-size:.85rem;color:var(--olive-700)}

.visually-hidden-h{position:absolute;width:1px;height:1px;padding:0;margin:-1px;
 overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- Editorial figure (maps, reference images) ----------
   Informational, not decorative. Never cropped, never object-fit:cover.
   Breaks the reading measure so labels stay legible. */
.figure{margin:var(--s12) 0;background:var(--raised);border:1px solid var(--border);
  border-top:3px solid var(--okhl-olive-green);border-radius:8px;padding:var(--s6)}
@media(min-width:70rem){
  .figure--wide{width:min(100vw - 4rem, 68rem);margin-left:50%;transform:translateX(-50%)}
}
.figure__eyebrow{font-size:.75rem;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--olive-700);margin:0 0 var(--s2)}
.figure__frame{background:#fff;border:1px solid var(--border);border-radius:6px;
  padding:var(--s3);overflow:visible}
.figure__frame img{display:block;width:100%;height:auto;object-fit:contain;border-radius:3px}
.figure figcaption{margin-top:var(--s4);max-width:none}
.figure__cap{font-size:.9rem;color:var(--okhl-navy);margin:0 0 var(--s2);max-width:74ch}
.figure__src{font-size:.8125rem;line-height:1.65;color:var(--olive-700);margin:0;max-width:74ch}
.figure__note{margin-top:var(--s4);padding-top:var(--s4);border-top:1px solid var(--border)}
.figure__note h3{font-family:var(--font-body);font-size:.9rem;text-transform:uppercase;
  letter-spacing:.05em;color:var(--buffalo-700);margin:0 0 var(--s2)}
.figure__note p{font-size:.875rem;line-height:1.7;color:var(--olive-700);max-width:74ch;margin:0 0 var(--s3)}
.figure__note p:last-child{margin-bottom:0}
@media(max-width:40rem){.figure{padding:var(--s4)}.figure__frame{padding:var(--s2)}}

/* Related-page links inside a legislative change card. Navigation from
   "what changed" to "what it means for my property". */
.upcoming__related{margin:var(--s4) 0 0;padding-top:var(--s3);
 border-top:1px solid var(--border);font-size:.9rem;color:var(--olive-700)}
.upcoming__related a{font-weight:700}