/* Ranch Q — one stylesheet, mobile-first. */
:root{
  --rust:#B5552F; --rust-d:#8F3F20; --alfalfa:#567F3B; --ink:#2B2218; --ink-2:#4A3E31;
  --puppy:#D8B98E; --sand:#EFE6D6; --cream:#F7F1E6; --paper:#FFFDF8;
  --muted:#5C4F42; --faint:#8C7B68; --line:#D9CDB8; --dark-faint:#CDBFA9;
  --max:1280px; --pad:20px; --r:22px;
}
@media (min-width:860px){ :root{ --pad:40px; } }
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ margin:0; background:var(--cream); color:var(--ink); font-family:Figtree,system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:17px; line-height:1.55; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
img{ max-width:100%; }
a{ color:var(--rust); text-decoration:none; }
a:hover{ color:var(--rust-d); }
h1,h2,h3,.display{ font-family:"Young Serif",Georgia,"Times New Roman",serif; font-weight:400; letter-spacing:-.01em;
  margin:0; line-height:1.08; text-wrap:pretty; }
p{ margin:0; text-wrap:pretty; }
.hand{ font-family:Caveat,"Bradley Hand","Segoe Script",cursive; }
.wrap{ width:100%; max-width:var(--max); margin:0 auto; padding-inline:var(--pad); }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.skip:focus{ position:fixed; left:12px; top:12px; z-index:100; width:auto; height:auto; clip:auto;
  background:var(--ink); color:var(--cream); padding:10px 16px; border-radius:8px; }
:focus-visible{ outline:3px solid var(--rust); outline-offset:3px; }

h1{ font-size:clamp(38px,7.2vw,64px); }
h2{ font-size:clamp(30px,5vw,46px); }
h3{ font-size:clamp(21px,2.4vw,26px); }
.lede{ font-size:clamp(17px,2vw,19px); line-height:1.6; color:var(--muted); }
.eyebrow{ font-size:13px; letter-spacing:.14em; text-transform:uppercase; font-weight:700; color:var(--rust); }
.eyebrow.green{ color:var(--alfalfa); }
.eyebrow.gold{ color:var(--puppy); }
.credit{ font-size:12px; color:var(--faint); line-height:1.4; }

.btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:52px; padding:12px 26px;
  border:0; border-radius:999px; font:inherit; font-weight:600; font-size:16px; background:var(--rust); color:#FFF8EE;
  cursor:pointer; text-align:center; transition:transform .2s,box-shadow .2s,background .2s; }
.btn:hover{ transform:translateY(-2px); box-shadow:0 12px 26px -8px rgba(181,85,47,.6); color:#FFF8EE; }
.btn:disabled{ opacity:.6; cursor:progress; transform:none; box-shadow:none; }
.btn.ghost{ background:transparent; color:var(--ink); box-shadow:inset 0 0 0 1.5px var(--ink); }
.btn.ghost:hover{ color:var(--ink); box-shadow:inset 0 0 0 1.5px var(--ink),0 12px 26px -12px rgba(43,34,24,.5); }
.btn.light{ background:var(--cream); color:var(--ink); }
.btn.light:hover{ color:var(--ink); }
.btn.on-rust{ background:transparent; color:#FFF8EE; box-shadow:inset 0 0 0 1.5px #FFF8EE; }
.btn.sm{ min-height:44px; padding:10px 20px; font-size:15px; }
.btn.full{ width:100%; }

/* header */
.site-head{ position:sticky; top:0; z-index:40; background:rgba(247,241,230,.92); backdrop-filter:blur(10px);
  border-bottom:1px solid transparent; transition:border-color .2s,box-shadow .2s; }
.site-head.stuck{ border-bottom-color:var(--line); box-shadow:0 6px 20px -18px rgba(43,34,24,.9); }
.head-in{ display:flex; align-items:center; justify-content:space-between; gap:24px; padding-block:14px; }
.brand{ display:inline-flex; align-items:center; gap:11px; color:var(--ink); flex:none; }
.brand-name{ display:flex; flex-direction:column; line-height:1; }
.brand-name b{ font-family:"Young Serif",Georgia,serif; font-weight:400; font-size:26px; letter-spacing:.02em; }
.brand-name span{ font-size:11px; letter-spacing:.16em; text-transform:uppercase; font-weight:600; color:var(--faint); margin-top:3px; }
.nav{ display:none; align-items:center; gap:26px; }
.nav a{ font-size:15px; font-weight:500; color:var(--ink); padding:8px 2px; border-bottom:2px solid transparent; }
.nav a:hover,.nav a[aria-current=page]{ color:var(--rust); border-bottom-color:var(--rust); }
.head-cta{ display:none; }
.burger{ display:inline-flex; align-items:center; justify-content:center; width:48px; height:48px; border:1.5px solid var(--ink);
  border-radius:999px; background:none; cursor:pointer; color:var(--ink); }
.menu{ border-top:1px solid var(--line); background:var(--cream); }
.menu ul{ list-style:none; margin:0; padding:8px var(--pad) 20px; display:flex; flex-direction:column; }
.menu a{ display:block; padding:14px 0; font-size:18px; font-weight:600; color:var(--ink); border-bottom:1px solid var(--line); }
.menu .btn{ margin-top:16px; }
@media (min-width:1040px){ .nav,.head-cta{ display:flex; } .burger{ display:none; } .menu{ display:none !important; } }

/* motion — content is visible by default; only a JS-flagged page hides it to animate in */
.js-anim .rise{ opacity:0; transform:translateY(24px); }
.js-anim .rise.in{ opacity:1; transform:none; transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1); }
.js-anim .rise.d1.in{ transition-delay:.1s; } .js-anim .rise.d2.in{ transition-delay:.2s; }
.js-anim .rise.d3.in{ transition-delay:.3s; } .js-anim .rise.d4.in{ transition-delay:.42s; }
.kb{ animation:kb 24s ease-in-out infinite alternate; transform-origin:55% 45%; }
@keyframes kb{ from{ transform:scale(1);} to{ transform:scale(1.08);} }
.float{ animation:float 6s ease-in-out infinite; }
@keyframes float{ 0%,100%{ transform:translateY(0) rotate(-3deg);} 50%{ transform:translateY(-10px) rotate(-3deg);} }
.marquee{ background:var(--sand); padding:16px 0; overflow:hidden; }
.marquee.dark{ background:var(--ink); }
.mq-track{ display:flex; width:max-content; align-items:center; animation:mq 40s linear infinite; }
.mq-track>*{ flex:none; white-space:nowrap; }
.mq-track .display{ font-size:20px; }
.dot{ width:8px; height:8px; border-radius:999px; background:var(--rust); margin:0 24px; }
@keyframes mq{ to{ transform:translateX(-50%);} }
.draw{ stroke-dasharray:1; stroke-dashoffset:1; animation:draw 1.4s cubic-bezier(.5,0,.2,1) forwards; }
.draw.late{ animation-delay:.85s; animation-duration:1s; }
@keyframes draw{ to{ stroke-dashoffset:0;} }
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .js-anim .rise{ opacity:1; transform:none; } .kb,.float,.mq-track,.draw{ animation:none; } .draw{ stroke-dashoffset:0; }
}

/* blocks */
section{ padding-block:clamp(56px,8vw,96px); }
section.tight{ padding-block:clamp(40px,5vw,64px); }
.band{ background:var(--sand); }
.band.dark{ background:var(--ink); color:var(--cream); }
.band.dark h1,.band.dark h2,.band.dark h3{ color:var(--cream); }
.band.dark p{ color:var(--dark-faint); }
.stack{ display:flex; flex-direction:column; gap:22px; }
.stack.sm{ gap:14px; }
.row{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
.grid{ display:grid; gap:22px; grid-template-columns:1fr; }
@media (min-width:720px){ .g2{ grid-template-columns:repeat(2,minmax(0,1fr)); } .g3{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1040px){ .g3{ grid-template-columns:repeat(3,minmax(0,1fr)); } .g4{ grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media (min-width:720px) and (max-width:1039px){ .g4{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.split{ display:grid; gap:clamp(32px,5vw,64px); grid-template-columns:1fr; align-items:center; }
@media (min-width:960px){ .split{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .split.wide-l{ grid-template-columns:1.15fr .85fr; } .split.wide-r{ grid-template-columns:.85fr 1.15fr; } }
.head-row{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:24px; }

.card{ background:var(--paper); border-radius:var(--r); box-shadow:0 1px 0 rgba(43,34,24,.05),0 14px 34px -20px rgba(43,34,24,.28);
  transition:transform .25s,box-shadow .25s; }
.card.pad{ padding:clamp(24px,3vw,32px); }
.card.lift:hover{ transform:translateY(-4px); box-shadow:0 24px 44px -22px rgba(43,34,24,.4); }
.band.dark .card{ background:#3A2F24; }
.shot{ position:relative; border-radius:var(--r); overflow:hidden; background:var(--sand); }
.shot img{ display:block; width:100%; height:100%; object-fit:cover; }
.shot.tall{ aspect-ratio:4/5; } .shot.sq{ aspect-ratio:1/1; } .shot.wide{ aspect-ratio:16/10; }
.shot.pano{ aspect-ratio:16/9; }
@media (min-width:960px){ .shot.pano{ aspect-ratio:64/9; } }
.shot .cap{ position:absolute; left:14px; right:14px; bottom:12px; color:#F7F1E6; font-size:12px; line-height:1.4;
  background:rgba(43,34,24,.66); padding:5px 9px; border-radius:6px; display:inline-block; width:fit-content; }
.shot .hand-cap{ position:absolute; left:18px; bottom:16px; font-size:26px; color:#F7F1E6; text-shadow:0 2px 12px rgba(0,0,0,.5); }
.ph{ display:flex; align-items:center; justify-content:center; text-align:center; border:2px dashed #B79C7A; border-radius:18px;
  background:repeating-linear-gradient(135deg,#EFE6D6 0 12px,#F5EDDF 12px 24px); color:#6B5A48; font-size:14px;
  font-weight:600; line-height:1.4; padding:18px; min-height:200px; }
.tile{ border-radius:18px; overflow:hidden; aspect-ratio:4/5; }
.tile img{ display:block; width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.tile:hover img{ transform:scale(1.05); }
.chip{ display:inline-flex; align-items:center; min-height:36px; padding:6px 14px; border-radius:999px; background:var(--sand);
  color:var(--ink); font-size:14px; font-weight:600; }
.chip.on{ background:var(--ink); color:var(--cream); }
.note{ display:inline-flex; align-items:center; gap:8px; padding:6px 12px; border-radius:8px; background:#FCEFD6;
  color:#7A4A12; font-size:13px; font-weight:600; }
.stat b{ display:block; font-family:"Young Serif",Georgia,serif; font-weight:400; font-size:clamp(34px,4vw,44px); line-height:1; }
.stat span{ display:block; margin-top:8px; font-size:14px; line-height:1.4; }
.stats{ display:grid; gap:24px; grid-template-columns:repeat(2,minmax(0,1fr)); }
@media (min-width:960px){ .stats.s4{ grid-template-columns:repeat(4,minmax(0,1fr)); } .stats.s3{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.check{ display:flex; gap:12px; align-items:flex-start; font-size:16px; color:#3F3427; }
.check svg{ flex:none; margin-top:3px; }
.tl-item{ display:grid; grid-template-columns:88px 1fr; gap:16px; padding:24px 0; border-top:1px solid var(--line); }
@media (min-width:720px){ .tl-item{ grid-template-columns:120px 24px 1fr; gap:24px; } }
.tl-year{ font-family:"Young Serif",Georgia,serif; font-size:28px; color:var(--rust); line-height:1; }
.tl-dot{ display:none; width:14px; height:14px; border-radius:999px; background:var(--rust); margin-top:7px;
  box-shadow:0 0 0 5px var(--cream),0 0 0 6.5px var(--line); }
@media (min-width:720px){ .tl-dot{ display:block; } }
.qa{ padding:24px 0; border-top:1px solid var(--line); }
.qa:last-child{ border-bottom:1px solid var(--line); }
.cta{ border-radius:30px; background:var(--rust); color:#FFF8EE; padding:clamp(36px,5vw,64px); position:relative; overflow:hidden;
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:32px; }
.cta h2{ color:#FFF8EE; } .cta p{ color:#FBE3D2; }
.cta.green{ background:var(--alfalfa); } .cta.green p{ color:#DCE8CF; }
.cta-mark{ position:absolute; right:6%; top:-30%; width:340px; opacity:.14; pointer-events:none; }

/* forms */
form{ margin:0; }
.field{ display:flex; flex-direction:column; gap:6px; }
.field.wide{ grid-column:1/-1; }
.field label{ font-size:13px; font-weight:700; letter-spacing:.02em; color:var(--muted); }
.field input,.field select,.field textarea{ width:100%; min-height:50px; border-radius:12px; border:1.5px solid var(--line);
  background:#fff; padding:12px 14px; font:inherit; font-size:16px; color:var(--ink); }
.field textarea{ min-height:112px; resize:vertical; }
.field input:focus,.field select:focus,.field textarea:focus{ border-color:var(--rust); outline:none;
  box-shadow:0 0 0 3px rgba(181,85,47,.18); }
.field .hint{ font-size:12px; color:var(--faint); }
.fields{ display:grid; gap:16px; grid-template-columns:1fr; }
@media (min-width:640px){ .fields.two{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.opts{ display:flex; flex-wrap:wrap; gap:8px; }
.opt input{ position:absolute; opacity:0; width:0; height:0; }
.opt span{ display:inline-flex; align-items:center; min-height:40px; padding:8px 14px; border-radius:999px; background:var(--sand);
  font-size:14px; font-weight:600; cursor:pointer; border:1.5px solid transparent; }
.opt input:checked+span{ background:var(--ink); color:var(--cream); }
.opt input:focus-visible+span{ outline:3px solid var(--rust); outline-offset:2px; }
.agree{ display:flex; gap:12px; align-items:flex-start; font-size:15px; color:#3F3427; }
.agree input{ width:20px; height:20px; flex:none; margin-top:3px; accent-color:var(--rust); }
.form-msg{ display:none; padding:14px 16px; border-radius:12px; font-size:15px; font-weight:600; }
.form-msg.ok{ display:block; background:#E4EFD8; color:#33521E; }
.form-msg.err{ display:block; background:#FBE0D6; color:#8F3F20; }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* section 0..05 numbering */
.sec-num{ font-family:"Young Serif",Georgia,serif; font-size:40px; color:var(--rust); line-height:1; }
.app-sec{ display:grid; gap:24px; grid-template-columns:1fr; padding:36px 0; border-top:1px solid var(--line); }
@media (min-width:960px){ .app-sec{ grid-template-columns:300px 1fr; gap:48px; padding:44px 0; } }

/* footer */
.site-foot{ background:var(--ink); color:var(--dark-faint); padding:64px 0 32px; }
.foot-grid{ display:grid; gap:32px; grid-template-columns:1fr; }
@media (min-width:640px){ .foot-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1040px){ .foot-grid{ grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:40px; } }
.site-foot a{ color:var(--cream); } .site-foot a:hover{ color:var(--puppy); }
.foot-col{ display:flex; flex-direction:column; gap:10px; }
.foot-col .eyebrow{ margin-bottom:4px; }
.social{ display:flex; gap:12px; margin-top:8px; }
.social a{ display:inline-flex; width:44px; height:44px; border-radius:999px; border:1.5px solid var(--ink-2);
  align-items:center; justify-content:center; }
.foot-base{ display:flex; flex-wrap:wrap; gap:10px; justify-content:space-between; margin-top:44px; padding-top:20px;
  border-top:1px solid var(--ink-2); font-size:13px; color:var(--faint); }