/* ==========================================================================
   SOUTHERN WILDLIFE SOLUTIONS
   Mobile-first. Breakpoints scale UP from 390px.

   Design rules:
     - Accent colour is per-section and drawn from habitat: oak russet,
       prairie green, moss, water. Colour encodes content, not decoration.
     - Featured surfaces get surveyor corner brackets, not full borders and
       never a drop shadow.
     - Section markers are index-contour rules: one heavy short segment
       against a longer hairline, the way a topo sheet marks an index line.
     - Radius only on controls. Never on content surfaces.
   ========================================================================== */
:root{
  /* grounds, ordered light to dark so section steps stay small.
     Only the hero and footer use the darkest value. */
  --soil:#171310;        /* darkest: hero, footer */
  --bark:#2C241C;        /* mid-dark warm brown */
  --pine:#25312A;        /* mid-dark green */
  --soil-2:#1E1815; --soil-3:#292019;
  --stone:#EFEAE1;       /* base light, a touch deeper than before */
  --stone-2:#E6DFD2;     /* mid light */
  --paper:#FCFAF5;

  /* hairlines */
  --hair:rgba(21,17,16,.13); --hair-2:rgba(21,17,16,.26);
  --hair-inv:rgba(242,239,232,.12); --hair-inv-2:rgba(242,239,232,.26);

  /* ink */
  --ink:#151110; --ink-soft:#42382F; --ink-mute:#786C5D;
  --ink-inv:#F2EFE8; --ink-inv-soft:rgba(242,239,232,.84); --ink-inv-mute:#A6987F;

  /* habitat palette */
  --oak:#7A3A1B;        /* post oak russet */
  --oak-lift:#92471F;
  --clay:#8E4A2E;
  --prairie:#26382B;    /* deep prairie green */
  --moss:#4A5C45;       /* mixed woodland */
  --bluestem:#C49A56;   /* little bluestem gold */
  --sand:#D8B981;
  --water:#5F818B;      /* drainage */

  --accent:var(--bluestem);   /* overridden per section */

  --d:'Archivo',system-ui,-apple-system,sans-serif;
  --b:'Spectral',Georgia,serif;

  /* radius: controls small, surfaces slightly larger */
  --r:3px; --rc:4px;
  /* warm-tinted, layered. Never one flat grey shadow under everything. */
  --sh-1:0 1px 2px rgba(21,17,16,.05), 0 2px 5px -1px rgba(21,17,16,.04);
  --sh-2:0 1px 2px rgba(21,17,16,.05), 0 5px 14px -3px rgba(21,17,16,.08),
         0 14px 34px -12px rgba(21,17,16,.10);
  --sh-in:inset 0 1px 0 rgba(255,255,255,.7);

  --wide:1220px; --read:64ch;
  --gut:1.25rem;
  --sy:3.75rem;
}
@media(min-width:640px){:root{--gut:2rem;--sy:5rem}}
@media(min-width:1000px){:root{--gut:3.5rem;--sy:7.5rem}}
@media(min-width:1360px){:root{--gut:4rem;--sy:8.5rem}}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}

body{margin:0;background:var(--stone);color:var(--ink);
  font-family:var(--b);font-size:1rem;line-height:1.7;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  padding-bottom:4.6rem}                 /* room for the mobile CTA bar */
@media(min-width:900px){body{padding-bottom:0}}

h1,h2,h3,h4{font-family:var(--d);font-weight:700;letter-spacing:-.03em;line-height:1.05;margin:0}
p{margin:0 0 1.05em}
p:last-child{margin-bottom:0}
a{color:var(--oak);text-decoration:none;border-bottom:1px solid rgba(122,58,27,.26)}
a:hover{border-bottom-color:var(--oak)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
::selection{background:var(--bluestem);color:var(--soil)}

.wrap{max-width:var(--wide);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}
section{padding:var(--sy) 0;position:relative;overflow:hidden}
section > .wrap{position:relative;z-index:1}
.dark{background:var(--soil);color:var(--ink-inv)}
/* Feathered seams. A hard edge between two grounds reads as a jump when
   scrolling; a short gradient at the top of each section reads as a change
   in light instead. */
.dark{background-image:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,0) 16%)}
.seam{background-image:linear-gradient(180deg,rgba(23,19,16,.045),rgba(23,19,16,0) 14%)}
.dark h1,.dark h2,.dark h3,.dark h4{color:var(--ink-inv)}
.prose{max-width:var(--read)}
.prose p{color:var(--ink-soft)}
.dark .prose p{color:var(--ink-inv-soft)}

/* ---- Topographic grounds ------------------------------------------------ */
.topo-ink,.topo-gold{position:relative}
.topo-ink::before,.topo-gold::before{content:'';position:absolute;inset:0;z-index:0;
  pointer-events:none;background-repeat:no-repeat;background-position:center;background-size:cover}
.topo-ink::before{background-image:url("topo-ink.svg");opacity:.09}
.topo-gold::before{background-image:url("topo-gold.svg");opacity:.18}
.topo-gold.deep::before{opacity:.26}
.shift-1::before{background-position:22% 64%}
.shift-2::before{background-position:76% 18%}
.shift-3::before{background-position:48% 88%}

/* ---- Index-contour section marker --------------------------------------
   Heavy short segment + long hairline: how a topo sheet marks an index
   contour. Replaces the single plain rule that repeated every section.    */
.idx{display:flex;align-items:center;gap:.4rem;margin-bottom:1.1rem}
.idx i{display:block;height:2.5px;width:1.75rem;background:var(--accent)}
.idx s{display:block;height:1px;width:2.25rem;background:var(--hair-2);text-decoration:none}
.dark .idx s{background:var(--hair-inv-2)}
.idx b{font-family:var(--d);font-size:.68rem;font-weight:700;letter-spacing:.09em;
  color:var(--accent);margin-left:.15rem}

/* ---- Header ------------------------------------------------------------- */
header{background:var(--soil);border-bottom:1px solid var(--hair-inv);position:relative;z-index:40}
header .bar{display:flex;align-items:center;gap:1rem;padding-top:.95rem;padding-bottom:.95rem}
.mark{font-family:var(--d);font-weight:800;font-size:1rem;letter-spacing:-.022em;
  line-height:1.15;color:var(--ink-inv);border:0;display:block}
.mark span{display:none}
@media(min-width:560px){
  .mark{font-size:1.12rem}
  .mark span{display:block;font-family:var(--b);font-weight:400;font-style:italic;
    font-size:.76rem;letter-spacing:0;color:var(--bluestem);margin-top:.24rem}
}
@media(min-width:1000px){.mark{font-size:1.22rem}}

/* Click-to-call in the header. This market calls more than it fills in forms. */
.tel{font-family:var(--d);font-size:.8rem;font-weight:700;color:var(--bluestem);
  border:1px solid rgba(194,154,86,.4);border-radius:var(--r);padding:.45rem .7rem;
  white-space:nowrap;transition:background .16s}
.tel:hover{background:rgba(194,154,86,.13);color:var(--sand)}
@media(max-width:459px){.tel{display:none}}
header nav{margin-left:auto;display:flex;align-items:center;gap:1.15rem}
header nav a{font-family:var(--d);font-size:.78rem;font-weight:500;color:var(--ink-inv-mute);border:0}
header nav a:hover{color:var(--ink-inv)}
header nav a.only{color:var(--bluestem)}
.navfull{display:none}
@media(min-width:900px){
  header .bar{padding-top:1.2rem;padding-bottom:1.2rem}
  .navfull{display:flex;gap:1.5rem;align-items:center}
  header nav a.only{display:none}
}

/* ---- Hero --------------------------------------------------------------- */
.hero{background:var(--soil);color:var(--ink-inv);padding:3rem 0 3.25rem;--accent:var(--bluestem)}
/* Brand lockup: name first, what we do second, headline third. */
.lockup{margin-bottom:1.5rem}
.lockup .bar{display:block;width:2.25rem;height:2.5px;background:var(--bluestem);margin-bottom:1rem}
.lockup .brand{font-family:var(--d);font-weight:800;font-size:1.28rem;letter-spacing:-.028em;
  color:var(--ink-inv);margin:0;line-height:1.1}
.lockup .what{font-family:var(--d);font-weight:600;font-size:.74rem;letter-spacing:.075em;
  color:var(--bluestem);margin:.5rem 0 0;line-height:1.4}
@media(min-width:640px){
  .lockup{margin-bottom:1.9rem}
  .lockup .brand{font-size:1.55rem}
  .lockup .what{font-size:.8rem}
}
@media(min-width:1000px){
  .lockup{margin-bottom:2.2rem}
  .lockup .brand{font-size:1.85rem}
  .lockup .what{font-size:.86rem;letter-spacing:.085em}
}

.hero h1{font-size:2.05rem;font-weight:800;letter-spacing:-.034em;max-width:22ch}
.hero .sub{font-size:1.02rem;color:var(--ink-inv-soft);margin-top:1.25rem;
  font-weight:300;line-height:1.62;max-width:52ch}
.hero .acts{display:flex;flex-direction:column;gap:.6rem;margin-top:1.9rem}
.hero .acts .btn{width:100%;text-align:center}
.hero .meta{margin-top:2.4rem;border-top:1px solid var(--hair-inv)}
.hero .meta div{padding:.9rem 0;border-bottom:1px solid var(--hair-inv);
  display:flex;align-items:baseline;gap:.7rem}
.hero .meta b{font-family:var(--d);font-size:.74rem;font-weight:700;letter-spacing:.05em;
  color:var(--bluestem);flex:0 0 4.6rem}
.hero .meta span{font-size:.92rem;color:var(--ink-inv-soft)}
@media(min-width:640px){
  .hero{padding:4.5rem 0 4rem}
  .hero h1{font-size:2.9rem}
  .hero .sub{font-size:1.14rem;margin-top:1.5rem}
  .hero .acts{flex-direction:row;gap:.75rem}
  .hero .acts .btn{width:auto}
}
@media(min-width:1000px){
  .hero{padding:7rem 0 5.5rem}
  .hero h1{font-size:4.4rem;letter-spacing:-.038em}
  .hero .sub{font-size:1.3rem;margin-top:1.75rem}
  .hero .meta{display:flex;gap:0 3.5rem;margin-top:3.25rem}
  .hero .meta div{border-bottom:0;display:block;padding:1.4rem 0 0}
  .hero .meta b{display:block;margin-bottom:.3rem}
}
@media(min-width:1360px){.hero h1{font-size:4.9rem}}

.reveal{opacity:0;transform:translateY(12px);animation:rise .75s cubic-bezier(.19,.72,.26,1) forwards}
.reveal.d1{animation-delay:.08s}.reveal.d2{animation-delay:.17s}.reveal.d3{animation-delay:.26s}
@keyframes rise{to{opacity:1;transform:none}}

/* ---- Buttons ------------------------------------------------------------ */
.btn{font-family:var(--d);font-size:.88rem;font-weight:600;border:1px solid transparent;
  border-radius:var(--r);box-shadow:var(--sh-1);padding:.9rem 1.4rem;cursor:pointer;display:inline-block;
  transition:background .16s,border-color .16s,color .16s}
.btn.p{background:var(--bluestem);color:var(--soil);border-color:var(--bluestem)}
.btn.p:hover{background:var(--sand);border-color:var(--sand)}
.btn.s{background:transparent;border-color:var(--hair-inv-2);color:var(--ink-inv)}
.btn.s:hover{border-color:var(--ink-inv);background:rgba(242,239,232,.07)}
.btn.oak{background:var(--oak);color:#fff;border-color:var(--oak)}
.btn.oak:hover{background:var(--oak-lift);border-color:var(--oak-lift)}
@media(min-width:640px){.btn{font-size:.9rem;padding:.92rem 1.55rem}}

/* ---- Sticky mobile CTA -------------------------------------------------- */
.mcta{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;gap:.55rem;
  box-shadow:inset 0 2.5px 0 var(--bluestem);
  align-items:center;background:rgba(21,17,16,.97);backdrop-filter:blur(10px);
  border-top:1px solid var(--hair-inv);
  padding:.7rem var(--gut) calc(.7rem + env(safe-area-inset-bottom))}
.mcta .lab{font-family:var(--d);font-size:.7rem;font-weight:600;color:var(--ink-inv-mute);
  line-height:1.25;flex:1}
.mcta .lab b{display:block;color:var(--ink-inv);font-size:.78rem;font-weight:700}
.mcta .btn{padding:.72rem 1.05rem;font-size:.82rem;flex:0 0 auto}
@media(min-width:900px){.mcta{display:none}}

/* ---- Section heads ------------------------------------------------------ */
.shead{margin-bottom:2rem}
.shead h2{font-size:1.62rem}
.shead .sd{font-family:var(--b);font-size:.98rem;color:var(--ink-mute);
  margin-top:.7rem;font-style:italic;font-weight:300;max-width:46ch}
.dark .shead .sd{color:var(--ink-inv-mute)}
@media(min-width:640px){.shead{margin-bottom:2.5rem}.shead h2{font-size:2.15rem}.shead .sd{font-size:1.08rem}}
@media(min-width:1000px){.shead{margin-bottom:3rem}.shead h2{font-size:2.85rem}.shead .sd{font-size:1.14rem;margin-top:.9rem}}

/* ---- Service cards: surveyor brackets, no shadow ------------------------ */
.svc{display:grid;gap:1.1rem;grid-template-columns:1fr}
@media(min-width:1000px){.svc{grid-template-columns:1.08fr 1fr;gap:1.75rem}}
.card{position:relative;background:var(--paper);padding:1.6rem 1.4rem;
  border-top:2.5px solid var(--accent);border-radius:0 0 var(--rc) var(--rc);
  box-shadow:var(--sh-2),var(--sh-in)}
.card::before,.card::after{content:'';position:absolute;width:15px;height:15px;
  border:1.5px solid var(--accent);opacity:1}
.card::before{left:-1px;top:-2.5px;width:18px;height:18px;border-right:0;border-bottom:0}
.card::after{right:-1px;bottom:-1px;width:18px;height:18px;border-left:0;border-top:0}
@media(min-width:640px){.card{padding:2.1rem 1.9rem}}
@media(min-width:1000px){.card{padding:2.6rem 2.4rem}}
.card .tag{font-family:var(--d);font-size:.7rem;font-weight:700;letter-spacing:.07em;
  color:var(--accent);margin-bottom:.65rem}
.card h3{font-size:1.32rem;margin-bottom:.7rem}
.card p{font-size:.96rem;color:var(--ink-soft)}
.card ul{list-style:none;margin:1.4rem 0 0;padding:0;border-top:1px solid var(--hair)}
.card li{font-size:.9rem;color:var(--ink-soft);padding:.6rem 0;border-bottom:1px solid var(--hair);
  display:flex;gap:.65rem;align-items:flex-start}
.card li::before{content:'';flex:0 0 auto;width:5px;height:5px;margin-top:.62em;
  background:var(--accent)}
.card .aside{font-size:.88rem;color:var(--ink-mute);font-style:italic;margin-top:1.15rem}
@media(min-width:640px){.card h3{font-size:1.5rem}}
@media(min-width:1000px){.card h3{font-size:1.75rem}}

/* ---- Principles --------------------------------------------------------- */
.prin{border-top:1px solid var(--hair-inv)}
.prin.light{border-top-color:var(--hair)}
.prin.light > div{border-bottom-color:var(--hair)}
.prin.light p{color:var(--ink-soft)}
.prin > div{padding:1.6rem 0;border-bottom:1px solid var(--hair-inv);
  border-left:2.5px solid transparent;padding-left:0;transition:border-color .2s}
.prin h3{font-size:1.1rem;letter-spacing:-.024em;margin-bottom:.5rem}
.prin h3::before{content:'';display:inline-block;width:.55rem;height:1px;
  background:var(--accent);vertical-align:middle;margin-right:.6rem}
.prin p{font-size:.95rem;color:var(--ink-inv-soft);margin:0;max-width:58ch}
@media(min-width:900px){
  .prin > div{padding:2.15rem 0;display:grid;gap:.5rem 3.5rem;grid-template-columns:23rem 1fr;align-items:start}
  .prin h3{font-size:1.2rem;margin-bottom:0}
}

/* ---- Team: shared practice, not split job descriptions ----------------- */
.team{background:var(--paper);border-top:2.5px solid var(--accent);
  border-radius:0 0 var(--rc) var(--rc);box-shadow:var(--sh-2),var(--sh-in);
  padding:1.5rem 1.3rem}
@media(min-width:640px){.team{padding:2.1rem 1.9rem}}
@media(min-width:1000px){.team{padding:2.6rem 2.4rem}}
.team .lede{font-size:1.02rem;color:var(--ink-soft);max-width:58ch}
.bios{display:grid;grid-template-columns:1fr;gap:1.3rem;margin:1.5rem 0 0}
@media(min-width:700px){.bios{grid-template-columns:1fr 1fr;gap:2.5rem}}
.bios h3{font-size:1.16rem;margin-bottom:.4rem}
.bios h3::after{content:'';display:block;width:1.75rem;height:2px;
  background:var(--accent);margin-top:.5rem}
.bios p{font-size:.94rem;color:var(--ink-soft);margin:0}
.caps{list-style:none;margin:1.6rem 0 0;padding:1.4rem 0 0;border-top:1px solid var(--hair);
  display:grid;grid-template-columns:1fr;gap:0}
@media(min-width:700px){.caps{grid-template-columns:1fr 1fr;gap:0 2.5rem}}
.caps li{font-size:.92rem;color:var(--ink-soft);padding:.55rem 0;
  border-bottom:1px solid var(--hair);display:flex;gap:.65rem;align-items:flex-start}
.caps li::before{content:'';flex:0 0 auto;width:5px;height:5px;margin-top:.62em;background:var(--accent)}

/* ---- Regions/* ---- Regions: colour-coded by habitat ---------------------------------- */
.regions{list-style:none;margin:1.5rem 0 0;padding:0;border-top:1px solid var(--hair-inv)}
.regions li{padding:1.15rem 0 1.15rem 1.05rem;border-bottom:1px solid var(--hair-inv);
  position:relative}
.regions li::before{content:'';position:absolute;left:0;top:1.15rem;bottom:1.15rem;
  width:2.5px;background:var(--rc,var(--bluestem))}
.regions b{font-family:var(--d);font-size:.96rem;font-weight:600;color:var(--ink-inv);
  display:block;margin-bottom:.28rem;letter-spacing:-.016em}
.regions span{font-size:.9rem;color:var(--ink-inv-mute);display:block}
.regions em{display:block;font-size:.82rem;color:var(--ink-inv-mute);opacity:.75;margin-top:.35rem}
@media(min-width:900px){
  .regions{display:grid;grid-template-columns:1fr 1fr;gap:0 3.5rem}
  .regions li{padding:1.3rem 0 1.3rem 1.2rem}
  .regions li::before{top:1.3rem;bottom:1.3rem}
  .regions b{font-size:1.02rem}
}

/* ---- FAQ: a real accordion component ---------------------------------- */
.faqgroup{margin-bottom:1.75rem}
.faqgroup > h3{font-family:var(--d);font-size:.76rem;font-weight:700;letter-spacing:.07em;
  color:var(--accent);margin-bottom:.7rem}
.acc{background:var(--paper);border:1px solid var(--hair);border-radius:var(--rc);
  box-shadow:var(--sh-1);overflow:hidden}
.acc details + details{border-top:1px solid var(--hair)}
.acc summary{cursor:pointer;list-style:none;position:relative;display:block;
  padding:1.05rem 3rem 1.05rem 1.1rem;
  font-family:var(--d);font-size:.95rem;font-weight:600;letter-spacing:-.014em;
  color:var(--ink);transition:background .16s,color .16s}
.acc summary::-webkit-details-marker{display:none}
.acc summary:hover{background:var(--stone);color:var(--oak)}
/* plus / minus, drawn so it reads as a control rather than a chevron */
.acc summary::before,.acc summary::after{content:'';position:absolute;right:1.15rem;
  top:50%;background:var(--accent);transition:transform .2s,opacity .2s}
.acc summary::before{width:11px;height:1.5px;transform:translateY(-50%)}
.acc summary::after{width:1.5px;height:11px;transform:translateY(-50%) translateX(-4.75px)}
.acc details[open] summary::after{opacity:0;transform:translateY(-50%) translateX(-4.75px) rotate(90deg)}
.acc details[open] summary{background:var(--stone);color:var(--ink)}
.acc details[open]{background:linear-gradient(to bottom,var(--stone) 0,var(--paper) 64px)}
.acc .a{padding:.2rem 1.1rem 1.25rem;max-width:var(--read)}
.acc .a p{font-size:.94rem;color:var(--ink-soft);margin-bottom:.75em}
.acc .a p:last-child{margin-bottom:0}
.acc .a a{font-weight:500}
@media(min-width:640px){
  .acc summary{font-size:1.01rem;padding:1.2rem 3.25rem 1.2rem 1.4rem}
  .acc .a{padding:.25rem 1.4rem 1.45rem}
  .faqgroup{margin-bottom:2.25rem}
}

/* ---- Contact ------------------------------------------------------------ */
.contact{background:var(--prairie);color:var(--ink-inv);--accent:var(--sand)}
.contact h1,.contact h2{color:var(--ink-inv)}
.contact .shead .sd{color:rgba(242,239,232,.74)}
.cgrid{display:grid;gap:2rem;grid-template-columns:1fr}
@media(min-width:920px){.cgrid{grid-template-columns:1fr 1.08fr;gap:4.5rem}}
.cinfo p{color:rgba(242,239,232,.84);font-size:.97rem}
.cinfo dl{margin:1.6rem 0 0;display:grid;gap:0;border-top:1px solid var(--hair-inv)}
.cinfo dl > div{padding:.95rem 0;border-bottom:1px solid var(--hair-inv)}
.cinfo dt{font-family:var(--d);font-size:.72rem;font-weight:600;letter-spacing:.05em;
  color:rgba(242,239,232,.55)}
.cinfo dd{margin:.28rem 0 0;font-family:var(--d);font-size:1rem;font-weight:600}
.cinfo dd a{color:var(--sand);border-bottom-color:rgba(216,185,129,.35)}

form{position:relative;background:var(--paper);color:var(--ink);
  padding:1.4rem 1.25rem;border-top:2.5px solid var(--sand);
  border-radius:0 0 var(--rc) var(--rc);box-shadow:var(--sh-2),var(--sh-in)}
form::after{content:'';position:absolute;right:0;bottom:0;width:15px;height:15px;
  border:1.5px solid var(--sand);border-left:0;border-top:0;opacity:.75}
@media(min-width:640px){form{padding:2rem 1.85rem}}
@media(min-width:1000px){form{padding:2.4rem 2.2rem}}
.fld{margin-bottom:1.1rem}
.fld:last-of-type{margin-bottom:1.6rem}
label{display:block;font-family:var(--d);font-size:.78rem;font-weight:600;
  margin-bottom:.35rem;color:var(--ink)}
label .opt{font-family:var(--b);font-weight:400;font-style:italic;color:var(--ink-mute);font-size:.82rem}
input,textarea,select{width:100%;font-family:var(--b);font-size:1rem;color:var(--ink);background:#fff;
  border:1px solid var(--hair-2);border-radius:var(--r);padding:.72rem .78rem;line-height:1.5;
  transition:border-color .15s,box-shadow .15s}
textarea{min-height:5.6rem;resize:vertical}
input:focus,textarea:focus,select:focus{border-color:var(--oak);outline:none;
  box-shadow:0 0 0 3px rgba(122,58,27,.1)}
input::placeholder,textarea::placeholder{color:#A99B89}
.row2{display:grid;gap:0 1rem;grid-template-columns:1fr}
@media(min-width:520px){.row2{grid-template-columns:1fr 1fr}}
form .btn{width:100%}
form .fine{font-size:.84rem;color:var(--ink-mute);margin-top:.9rem;font-style:italic}
.hp{position:absolute;left:-9999px}

/* ---- Footer ------------------------------------------------------------- */
footer{background:var(--soil);color:var(--ink-inv-mute);padding:2.5rem 0;font-size:.85rem;
  border-top:1px solid var(--hair-inv)}
footer .top{display:grid;gap:1.75rem;grid-template-columns:1fr;
  padding-bottom:1.75rem;border-bottom:1px solid var(--hair-inv)}
@media(min-width:780px){footer .top{grid-template-columns:1.5fr 1fr 1fr;gap:2.5rem}}
footer h4{font-family:var(--d);font-size:.72rem;font-weight:600;letter-spacing:.06em;
  color:var(--bluestem);margin-bottom:.75rem}
footer ul{list-style:none;margin:0;padding:0}
footer li{padding:.25rem 0}
footer a{color:var(--ink-inv-mute);border-bottom-color:rgba(166,152,127,.24)}
footer a:hover{color:var(--ink-inv)}
footer .blurb{font-size:.9rem;color:var(--ink-inv-mute);max-width:40ch;line-height:1.62}
footer .base{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;padding-top:1.5rem;font-size:.78rem}
footer .base .r{margin-left:auto}