/* Haul & Nest: shared styles for every page (header, footer, content pages, forms).
   The home page adds its own hero and picker styles inline. */
@font-face{font-family:"Shrikhand";src:url(../fonts/shrikhand-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url(../fonts/barlow-condensed-latin-800-normal.woff2) format("woff2");font-weight:800;font-display:swap}
@font-face{font-family:"Barlow";src:url(../fonts/barlow-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Barlow";src:url(../fonts/barlow-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Barlow";src:url(../fonts/barlow-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}

:root{
  --lake:#1D5FB4; --deep:#0C2F6B; --grove:#2F8A3C; --grove-dk:#17572A;
  --orange:#F7801E; --sun:#FFC928; --sky:#9ED8F2; --mist:#EDF6FB; --white:#FFFFFF;
  --tote:#1E2230; --ink-soft:#3A5683; --line:#BFD6EA; --error:#B3261E;
  --display:"Shrikhand","Cooper Black",Georgia,serif;
  --text:"Barlow",system-ui,sans-serif;
  --notch:14px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--mist);color:var(--deep);font:400 1.125rem/1.55 var(--text);overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:4px solid var(--orange);outline-offset:3px}
.wrap{width:min(1080px,100% - 32px);margin-inline:auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*{transition:none !important;animation:none !important}}

/* crate-label frame */
.label{
  --cut:polygon(var(--notch) 0,calc(100% - var(--notch)) 0,100% var(--notch),100% calc(100% - var(--notch)),calc(100% - var(--notch)) 100%,var(--notch) 100%,0 calc(100% - var(--notch)),0 var(--notch));
  clip-path:var(--cut);background:var(--deep);padding:8px;
}
.label > .rule{clip-path:var(--cut);background:var(--sun);padding:5px}
.label > .rule > .face{clip-path:var(--cut);position:relative;background:var(--white)}

/* buttons: flat print look, hard offset */
.btn{display:inline-flex;align-items:center;justify-content:center;font:700 1.15rem/1.1 var(--text);text-decoration:none;color:var(--deep);background:var(--sun);
  border:3px solid var(--deep);padding:15px 22px 14px;box-shadow:5px 5px 0 var(--deep);cursor:pointer;border-radius:0;white-space:nowrap;min-height:52px}
.btn:hover{background:#FFD95C}
.btn:active{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--deep)}
.btn.dark{background:var(--deep);color:var(--sun);box-shadow:5px 5px 0 var(--orange)}
.btn.dark:hover{background:var(--grove)}

/* ---------- header and nav ---------- */
.site-head{background:var(--lake);color:var(--white);position:relative;z-index:30}
.site-head .wrap{display:flex;align-items:center;gap:14px;min-height:64px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;margin-right:auto}
.brand svg{width:38px;height:38px;flex:none}
.brand span{font:400 1.4rem/1 var(--display);color:var(--sun);text-shadow:2px 2px 0 var(--deep)}
.nav-links{display:none;list-style:none;margin:0;padding:0;gap:4px}
.nav-links a{display:block;padding:10px 12px;font:600 1.02rem/1 var(--text);text-decoration:none;color:#E6F0FB}
.nav-links a:hover,.nav-links a[aria-current=page]{color:var(--sun);text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:2px}
.nav-cta{min-height:44px;padding:10px 16px 9px;font-size:1.02rem;box-shadow:4px 4px 0 var(--deep)}
.menu{position:static}
.menu summary{list-style:none;cursor:pointer;font:700 1rem/1 var(--text);color:var(--white);padding:12px 10px;border:2px solid #A9C7EA;min-height:44px;display:flex;align-items:center;gap:8px}
.menu summary::-webkit-details-marker{display:none}
.menu summary::before{content:"";width:18px;height:12px;background:linear-gradient(var(--white) 0 2px,transparent 2px 5px,var(--white) 5px 7px,transparent 7px 10px,var(--white) 10px 12px)}
.menu[open] summary{background:var(--deep);border-color:var(--deep)}
.menu ul{list-style:none;margin:0;padding:8px 16px 16px;position:absolute;left:0;right:0;top:100%;background:var(--deep);border-bottom:4px solid var(--sun)}
.menu li a{display:block;padding:14px 4px;font:700 1.15rem/1.2 var(--text);color:var(--white);text-decoration:none;border-bottom:1px solid #2A4C86}
.menu li:last-child a{border-bottom:0;color:var(--sun)}
@media (min-width:900px){
  .nav-links{display:flex}
  .menu{display:none}
}
@media (max-width:420px){
  .brand span{font-size:1.2rem;white-space:nowrap}
  .menu summary{font-size:0;gap:0;padding:12px 12px}
  .brand svg{width:32px;height:32px}
  .nav-cta{padding:9px 12px 8px;font-size:.98rem}
}

/* ---------- footer ---------- */
.site-foot{background:var(--deep);color:#C9D8EF;padding:44px 0 34px;font-size:1rem}
.site-foot .cols{display:grid;grid-template-columns:1fr;gap:28px}
.site-foot h2{font:700 1.05rem/1.2 var(--text);color:var(--sun);margin:0 0 10px}
.site-foot ul{list-style:none;margin:0;padding:0}
.site-foot li{margin:0 0 8px}
.site-foot a{color:#E6F0FB}
.site-foot a:hover{color:var(--sun)}
.foot-brand b{display:block;font:400 1.6rem/1.1 var(--display);color:var(--sun);margin-bottom:8px}
.foot-brand p{margin:0 0 6px}
.foot-base{margin-top:30px;padding-top:18px;border-top:2px solid #234682;font-size:.95rem;color:#9FB6DA}
@media (min-width:760px){.site-foot .cols{grid-template-columns:1.2fr 1fr 1.4fr}.foot-towns ul{columns:2;column-gap:20px}}

/* ---------- content pages ---------- */
.page-hero{background:var(--lake);padding:22px 0 30px}
.page-hero .label > .rule > .face{background:var(--sky)}
.page-hero .face{padding:26px 22px 26px;display:grid;grid-template-columns:1fr;gap:18px;align-items:center}
.page-hero h1{font:400 clamp(2rem,6vw,3.1rem)/1.06 var(--display);margin:0;color:var(--deep);max-width:20ch}
.page-hero .lede{margin:12px 0 0;font:600 1.15rem/1.45 var(--text);max-width:52ch}
.page-hero .hero-art{width:150px;justify-self:start}
.page-hero .hero-cta{margin-top:18px;display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center}
.page-hero .note{font:600 .98rem/1.35 var(--text);color:var(--deep);max-width:36ch}
@media (min-width:760px){.page-hero .face{grid-template-columns:1fr auto;padding:34px 38px}.page-hero .hero-art{width:190px;justify-self:end}}

.section{padding:56px 0}
.section + .section{border-top:2px solid #CFE2F1}
.section h2{font:400 clamp(1.7rem,4.2vw,2.4rem)/1.1 var(--display);margin:0 0 14px}
.section h3{font:700 1.25rem/1.25 var(--text);margin:26px 0 6px}
.prose{max-width:66ch}
.prose p{margin:0 0 14px}
.prose ul{margin:0 0 16px;padding-left:1.2em}
.prose li{margin-bottom:6px}
.prose li::marker{color:var(--orange)}
.two{display:grid;grid-template-columns:1fr;gap:34px}
@media (min-width:860px){.two{grid-template-columns:1.2fr .8fr;gap:56px}}

.facts{margin:0;padding:0;list-style:none;border-top:3px solid var(--deep)}
.facts li{display:flex;justify-content:space-between;gap:16px;padding:12px 2px;border-bottom:2px solid var(--line);margin:0}
.facts li b{font-weight:700}
.facts li span{text-align:right}

.packs-mini{list-style:none;margin:16px 0 0;padding:0;border-top:3px solid var(--deep)}
.packs-mini li{display:grid;grid-template-columns:1fr auto;gap:2px 16px;align-items:baseline;padding:14px 4px;border-bottom:2px solid var(--line);margin:0}
.packs-mini .n{font:700 1.25rem/1.2 var(--text)}
.packs-mini .c{grid-column:1;color:var(--ink-soft);font-size:1rem}
.packs-mini .p{grid-row:1 / span 2;grid-column:2;font:700 2rem/1 var(--text)}
.packs-mini a{color:var(--lake);font-weight:700;font-size:1rem}
.small{font-size:1rem;color:var(--ink-soft)}

.faq-list{margin:6px 0 0;border-top:3px solid var(--deep)}
.faq-list details{border-bottom:2px solid var(--line)}
.faq-list summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:center;padding:16px 2px;font:700 1.15rem/1.3 var(--text)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"+";flex:none;width:32px;height:32px;display:grid;place-items:center;background:var(--sun);border:2px solid var(--deep);font:700 1.3rem/1 var(--text)}
.faq-list details[open] summary::after{content:"\2212"}
.faq-list .a{padding:0 2px 18px;max-width:66ch}
.faq-list .a p{margin:0 0 10px}
.faq-group{margin-top:40px}
.faq-group:first-of-type{margin-top:10px}
.faq-group h2{font:400 1.6rem/1.1 var(--display);margin:0 0 6px}

.town-grid{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:1fr;gap:16px}
@media (min-width:700px){.town-grid{grid-template-columns:1fr 1fr}}
.town-grid a{display:block;text-decoration:none;background:var(--white);border:3px solid var(--deep);padding:18px 18px 16px;height:100%}
.town-grid a:hover{background:#FFF8DD}
.town-grid b{display:block;font:400 1.5rem/1.1 var(--display);margin-bottom:6px}
.town-grid span{display:block;color:var(--ink-soft);font-size:1rem}
.town-grid em{display:inline-block;margin-top:10px;font:700 .95rem/1 var(--text);font-style:normal;background:var(--mist);border:2px solid var(--deep);padding:6px 8px}
.town-grid .ext em{background:#FFF1E2}

.cta-band{padding:56px 0 64px}
.cta-band .label > .rule > .face{background:var(--sun)}
.cta-band .face{padding:30px 24px;text-align:center}
.cta-band h2{font:400 clamp(1.8rem,4.6vw,2.6rem)/1.08 var(--display);margin:0 0 8px}
.cta-band p{margin:0 auto 20px;max-width:46ch;font-weight:600}
.cta-band .btn{background:var(--deep);color:var(--sun);box-shadow:5px 5px 0 var(--orange)}
.cta-band .btn:hover{background:var(--grove)}

.crumbs{font-size:.95rem;margin:0 0 10px;color:var(--deep)}
.crumbs a{color:var(--deep)}