/* PAGE CSS: home
   Enqueued by functions.php when the slug matches.
   Lifted verbatim from the approved static build. */


/* Everything above this line is the shared global stylesheet, identical to
   /global/dakota-global.css. Everything below is homepage-only.
   This marker is not decoration: build_wp_theme.py splits the style block
   here to produce assets/css/page-home.css. Without it the homepage ships
   with no page CSS and every device below the hero renders unstyled. */

/* ---------- Hero ---------- */
.hero{
  position:relative;min-height:100svh;display:flex;align-items:flex-end;
  background:var(--ink-deep);color:var(--cream);overflow:hidden;
}
.hero__media{position:absolute;inset:0;z-index:0;overflow:hidden;background:#0E2531;}
.hero__media img{
  width:100%;height:100%;object-fit:cover;
  /* holds the river bend and the horizon on narrow crops */
  object-position:58% 46%;
}
/* Directional scrim: heavy at left and bottom where the type sits,
   opening up toward the farmstead on the right. Third layer darkens
   the top band so the fixed header stays legible over the sky. */
.hero__media::after{
  content:"";position:absolute;inset:0;
  background:
    /* knocks down the sun so the nav stays legible across the top right */
    radial-gradient(62% 48% at 86% 14%,
      rgba(11,32,43,.58) 0%,
      rgba(11,32,43,.24) 48%,
      rgba(11,32,43,0) 74%),
    linear-gradient(to right,
      rgba(11,32,43,.90) 0%,
      rgba(11,32,43,.76) 32%,
      rgba(11,32,43,.40) 60%,
      rgba(11,32,43,.14) 86%,
      rgba(11,32,43,.08) 100%),
    linear-gradient(to top,
      rgba(11,32,43,.84) 0%,
      rgba(11,32,43,.32) 34%,
      rgba(11,32,43,0) 62%),
    linear-gradient(to bottom,
      rgba(11,32,43,.78) 0%,
      rgba(11,32,43,.40) 16%,
      rgba(11,32,43,.10) 34%,
      rgba(11,32,43,0) 46%);
}
/* top padding clears the fixed bar; min-height lets the section grow instead of compressing */
.hero__in{
  position:relative;z-index:2;width:100%;
  padding-block:calc(var(--barh) + clamp(52px,9vh,108px)) clamp(80px,12vh,144px);
}
.hero__eyebrow{
  font-family:var(--display);font-size:11.5px;text-transform:uppercase;letter-spacing:.28em;
  color:var(--gold);display:flex;align-items:center;gap:14px;margin:0 0 30px;
}
/* three lines: two of the plain clause, then the gold italic on its own */
.hero h1{margin-bottom:36px;max-width:22ch;text-wrap:balance;}
.hero h1 .ital{display:block;}
.hero__foot{display:block;}
/* widened so the sentence sets on three lines; balance evens their length */
.hero__foot .lede{margin:0;max-width:62ch;text-wrap:balance;}
.hero__cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:clamp(30px,3.6vh,44px);}

/* ---------- Statement ---------- */
.statement h2{max-width:19ch;margin-bottom:38px;}
.statement__grid{display:grid;grid-template-columns:125fr 75fr;gap:clamp(36px,6vw,96px);align-items:end;}

/* ---------- Practice ---------- */
.pr__head{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:end;margin-bottom:clamp(48px,6vw,80px);}
.pr__list{border-top:1px solid rgba(244,240,232,.18);}
.pr__row{
  display:grid;grid-template-columns:64px 1fr minmax(0,42ch) 40px;gap:clamp(20px,3vw,48px);
  align-items:baseline;padding-block:clamp(28px,3.4vw,44px);
  border-bottom:1px solid rgba(244,240,232,.18);
  text-decoration:none;color:inherit;transition:background .25s;
}
.pr__row:hover,.pr__row:focus-visible{background:rgba(244,240,232,.045);}
.pr__num{font-family:var(--display);font-size:13px;letter-spacing:.18em;color:var(--gold);}
.pr__name{font-family:var(--display);font-size:clamp(24px,3vw,40px);font-weight:200;line-height:1.08;letter-spacing:-.01em;}
.pr__desc{font-size:16.5px;line-height:1.62;color:rgba(244,240,232,.72);margin:0;max-width:none;}
.pr__arrow{justify-self:end;align-self:center;color:rgba(244,240,232,.45);transition:color .25s,transform .25s;}
.pr__row:hover .pr__arrow{color:var(--gold);transform:translateX(5px);}

/* ---------- South Dakota ---------- */
/* centred against the taller left column rather than top-aligned */
.sd__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,104px);align-items:center;}
/* two lines: plain clause, then the gold italic beneath it */
.sd__grid h2{font-size:clamp(31px,4.3vw,57px);margin-bottom:34px;}
.sd__grid h2 .ital{display:block;}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,3.4vw,48px);}
.stat{border-top:1px solid var(--stone);padding-top:20px;}
.dark .stat,.deep .stat{border-top-color:rgba(244,240,232,.24);}
.stat b{
  display:block;font-family:var(--display);font-weight:200;
  /* sized for WORDS, not short figures. this block previously held $906B and
     1983, where 66px was right. 'Perpetual' at 66px ran 237px wide in a 242px
     cell, filling it edge to edge. 40px leaves it at 144px. */
  font-size:clamp(28px,3.0vw,40px);line-height:1.05;color:var(--gold);margin-bottom:12px;letter-spacing:-.01em;
}
.stat span{font-size:15.5px;line-height:1.55;display:block;color:var(--slate);}
.dark .stat span,.deep .stat span{color:rgba(244,240,232,.68);}

/* ---------- Standard ---------- */
/* sized to hold on a single line at full width; wraps naturally below ~900px */
.std__title{font-size:clamp(26px,3.9vw,52px);max-width:none;}
.std{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--stone);border:1px solid var(--stone);margin-top:clamp(48px,6vw,72px);}
.std__cell{background:var(--cream);padding:clamp(30px,3.4vw,46px);}
/* sized so the longest of the four holds a single line at two-column widths */
.std__cell h3{margin:0 0 16px;font-size:clamp(16px,1.75vw,21px);line-height:1.3;}
.std__cell p{font-size:16.5px;margin:0;color:rgba(23,55,70,.82);}

/* ---------- Counsel feature ---------- */
.feat{position:relative;overflow:hidden;}
.feat__grid{display:grid;grid-template-columns:92fr 108fr;gap:0;align-items:stretch;}
.feat__media{position:relative;background:#1B3B49;min-height:clamp(420px,58vw,720px);overflow:hidden;}
.feat__media img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  /* favours the upper body so the face holds size in a tall panel */
  object-position:52% 10%;
  filter:saturate(.90) contrast(1.03);
}
/* settles the warm daylight into the navy panel and grounds the bottom edge */
.feat__media::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(to bottom, rgba(16,41,53,0) 52%, rgba(16,41,53,.55) 100%),
    linear-gradient(to right, rgba(16,41,53,.18) 0%, rgba(16,41,53,0) 45%);
}
.feat__body{padding:clamp(48px,6vw,96px) clamp(32px,5vw,88px);display:flex;flex-direction:column;justify-content:center;}
.pull{
  font-family:var(--display);font-weight:200;font-style:italic;
  font-size:clamp(20px,2.25vw,29px);line-height:1.28;color:var(--gold);
  margin:0 0 34px;max-width:none;letter-spacing:-.01em;
}
/* each sentence holds its own line, and still wraps cleanly on small screens */
.pull span{display:block;text-wrap:balance;}
.creds{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:38px;padding-top:34px;border-top:1px solid rgba(244,240,232,.2);}
.creds dt{font-family:var(--display);font-size:10.5px;text-transform:uppercase;letter-spacing:.22em;color:var(--gold);margin:0 0 10px;}
.creds dd{margin:0;font-size:15.5px;line-height:1.5;color:rgba(244,240,232,.8);}

/* ---------- Advisors ---------- */
/* wheat watermark in Stone, a shade off the cream. sits behind the copy, not against it */
.adv{position:relative;overflow:hidden;}
.adv::before{
  content:"";position:absolute;z-index:0;pointer-events:none;
  left:calc(var(--gut) * -0.22);bottom:17%;
  /* lifted off the lower edge and sized by height, so it clears both section boundaries */
  height:min(78%,560px);aspect-ratio:451/758;width:auto;
  background:url("/assets/images/mark-wheat.png") left bottom / contain no-repeat;
  opacity:.42;
}
.adv .wrap{position:relative;z-index:1;}
.adv__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,104px);align-items:center;}
/* two lines: plain clause, then the gold italic beneath it */
.adv__grid h2{font-size:clamp(31px,4.3vw,57px);}
.adv__grid h2 .ital{display:block;}

/* ---------- Insights ---------- */
.ins__head{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:end;margin-bottom:clamp(44px,5vw,72px);}
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--stone);border:1px solid var(--stone);}
.post{background:var(--cream);padding:clamp(28px,3vw,40px);text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:16px;transition:background .22s;}
.post:hover,.post:focus-visible{background:#EEE8DC;}
.post time{font-family:var(--display);font-size:10.5px;text-transform:uppercase;letter-spacing:.22em;color:var(--gold);}
.post h3{font-size:22px;}
.post p{font-size:16px;color:rgba(23,55,70,.78);margin:0;}

/* ---------- Close ---------- */
.close{text-align:center;position:relative;overflow:hidden;background:var(--ink-deep);}
.close__media{position:absolute;inset:0;z-index:0;}
.close__media img{width:100%;height:100%;object-fit:cover;object-position:52% 58%;filter:saturate(.86);}
/* warm wood and a bright window need a firmer wash under centred type */
.close__media::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(rgba(11,32,43,.80),rgba(11,32,43,.80)),
    radial-gradient(94% 82% at 50% 50%,
      rgba(11,32,43,0) 0%,
      rgba(11,32,43,.20) 60%,
      rgba(11,32,43,.46) 100%);
}
.close .wrap{position:relative;z-index:2;}
/* the eyebrow inherits the 64ch paragraph measure, so it needs the full width to centre against */
.close .eyebrow{display:block;text-align:center;max-width:none;width:100%;text-indent:.28em;}
.close h2{max-width:17ch;margin:0 auto 32px;}
.close .lede{margin:0 auto 40px;}
.close__row{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;}
.close__note{font-size:15.5px;color:rgba(244,240,232,.6);margin:32px auto 0;max-width:52ch;}

/* ---------- Footer ---------- */
.foot{background:var(--ink-deep);color:rgba(244,240,232,.72);padding-block:clamp(64px,7vw,96px) 44px;font-size:15.5px;}
.foot a{color:rgba(244,240,232,.72);text-decoration:none;}
.foot a:hover{color:var(--cream);}
.foot__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:clamp(32px,4vw,64px);margin-bottom:56px;}
.foot h4{font-family:var(--display);font-weight:400;font-size:10.5px;text-transform:uppercase;letter-spacing:.24em;color:var(--gold);margin:0 0 20px;}
.foot ul{list-style:none;margin:0;padding:0;}
.foot li{margin-bottom:11px;}
.foot__legal{border-top:1px solid rgba(244,240,232,.16);padding-top:30px;font-size:13px;line-height:1.65;color:rgba(244,240,232,.52);}
.foot__legal p{max-width:none;margin-bottom:1em;}
.foot__credit{margin-top:22px;font-size:12.5px;}

/* ---------- Reveal ---------- */
.rev{opacity:0;transform:translateY(20px);transition:opacity .85s cubic-bezier(.22,.61,.36,1),transform .85s cubic-bezier(.22,.61,.36,1);}
.rev.is-in{opacity:1;transform:none;}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px;}

/* ---------- Responsive ---------- */
/* collapse to the menu button before the nav would ever wrap */
@media (max-width:1260px){
  .nav{
    display:none;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:0;
    background:var(--cream);border-bottom:1px solid var(--stone);
    padding:10px var(--gut) 26px;
  }
  .nav.is-open{display:flex;}
  .nav a{width:100%;padding:15px 0;font-size:12px;border-bottom:1px solid var(--stone);border-top:0;}
  .nav a:hover,.nav a:focus-visible{border-bottom-color:var(--stone);}
  .navtoggle{
    display:inline-flex;align-items:center;background:none;border:0;cursor:pointer;
    font-family:var(--display);font-size:11.5px;text-transform:uppercase;letter-spacing:.22em;
    color:var(--cream);padding:10px 0;order:2;
  }
  .nav-cta{order:1;font-size:12px;min-height:42px;padding:3px 22px 0;}
  .masthead.is-stuck .navtoggle{color:var(--ink);}
}
@media (max-width:1080px){
  .statement__grid,.sd__grid,.adv__grid,.feat__grid{grid-template-columns:1fr;}
  .posts{grid-template-columns:1fr 1fr;}
  .pr__row{grid-template-columns:48px 1fr 32px;}
  .pr__desc{grid-column:2 / -1;margin-top:14px;}
  .feat__media{min-height:380px;}
}
@media (max-width:780px){
  body{font-size:17px;}
  :root{--barh:88px;}
  /* the footer's three columns overflow a 390px viewport by ~9px.
     the homepage collapsed it via a page-CSS rule, so every other page
     kept the overflow. it belongs here, in global. */
  .foot__grid{grid-template-columns:1fr;}
  .brand__desc{display:none;}
  .nav-cta{font-size:11px;min-height:40px;padding:2px 18px 0;letter-spacing:.09em;text-indent:.09em;}
  .masthead__right{gap:14px;}
  .std,.posts,.foot__grid,.stats,.creds{grid-template-columns:1fr;}
  .pr__head,.ins__head{grid-template-columns:1fr;}
  .hero__cta .btn,.close__row .btn{width:100%;justify-content:center;}
  .adv::before{display:none;}
  }
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .rev{opacity:1;transform:none;transition:none;}
  *{animation-duration:.001ms!important;transition-duration:.001ms!important;}
}
/* phones. the brand lockup, the CTA and the menu toggle all sit on one line,
   and at 390 the logo ran THROUGH the Contact button by 22px on every page.
   the logo carries its tagline as part of the image, so it cannot be trimmed
   the way .brand__desc is; it has to come down in size. 26px clears from
   360 upward with 16px of daylight at 390. measured, do not raise it without
   re-checking at 360. */
@media (max-width:480px){
  .brand img{height:32px;}
  .nav-cta{font-size:10px;min-height:44px;padding:2px 13px 0;letter-spacing:.06em;text-indent:.06em;}
  .masthead__right{gap:10px;}
}

/* ---------- Touch targets ----------
   A finger is about 9mm across. Anything under roughly 44px square is
   genuinely hard to hit, and these were all measured under it on a phone:
   the logo link at 26px tall, the menu toggle at 32, the CTA at 36, and the
   phone and email links in the contact rail at 20.
   The fix is padding and hit area, not size: none of these gets visually
   bigger, they just become reliably tappable. */
@media (hover:none){
  .brand{padding-block:9px;}
  .navtoggle{min-height:44px;min-width:44px;padding-inline:4px;}
  /* the rail's phone and email links are inline text; inline-block lets them
     take vertical padding so the tap area reaches the full line height */
  .rail__v a{display:inline-block;padding-block:11px;}
  .rail__row{padding-block:14px;}
  /* the consent box: the label is already clickable via for=, but the box
     itself must be hittable too */
  .consent input{width:22px;height:22px;margin-top:1px;}
  .consent{gap:15px;}
}