/* Haul & Nest: postcard layer (Oct 2026).
   Loads after site.css and the home page's inline styles. Turns the flat crate-label
   look into a 1950s Florida travel poster: cream paper, rounded postcard frames,
   cream-and-red lettering with a navy drop, deep grove-green banners. */
:root{
  --paper:#F5E9CF; --paper-dk:#E9D7AE; --cream:#FFF3D6; --red:#E2512A; --forest:#0F4A2A;
  --cond:"Barlow Condensed","Arial Narrow",sans-serif;
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .25 0 0 0 0 .1 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
body{background:var(--paper) var(--grain);color:var(--deep)}

/* ---------- postcard frames replace the notched crate labels ---------- */
.label{clip-path:none;border-radius:22px;background:var(--forest);padding:7px;box-shadow:0 10px 0 -2px rgba(12,47,107,.18)}
.label > .rule{clip-path:none;border-radius:16px;background:var(--cream);padding:4px}
.label > .rule > .face{clip-path:none;border-radius:13px;overflow:hidden}

/* ---------- headings: cream letters, red edge, navy drop ---------- */
h2,.section h2,.cta-band h2,.faq-group h2{
  color:var(--cream);letter-spacing:.025em;
  -webkit-text-stroke:5px var(--red);paint-order:stroke fill;
  text-shadow:4px 4px 0 var(--deep),5px 5px 0 var(--deep),6px 6px 0 var(--deep);
  transform:rotate(-1.5deg);transform-origin:left center;display:block;width:fit-content;max-width:100%;
  font-size:clamp(2.1rem,4.8vw,3.1rem);padding:4px 6px 6px 2px;
}
.faq-group h2{font-size:1.8rem;-webkit-text-stroke-width:4px}
.kicker{display:block;margin:0 0 10px;font:800 .95rem/1 var(--cond);letter-spacing:.24em;text-transform:uppercase;color:var(--grove-dk)}
.kicker::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--orange);margin-right:10px;vertical-align:1px}

/* ---------- buttons: rounded enamel-sign buttons ---------- */
.btn{border-radius:12px;background:var(--sun);color:var(--deep);border:3px solid var(--deep);box-shadow:0 5px 0 var(--deep);font-weight:700}
.btn:hover{background:#FFD95C}
.btn:active{transform:translateY(3px);box-shadow:0 2px 0 var(--deep)}
.btn.dark,.cta-band .btn,form .btn{background:var(--red);color:var(--cream);border-color:var(--deep);box-shadow:0 5px 0 var(--deep)}
.btn.dark:hover,.cta-band .btn:hover,form .btn:hover{background:#C8431F}
.book-link{border-radius:10px;background:var(--red);color:var(--cream);border-color:var(--deep);box-shadow:0 4px 0 var(--deep)}
.book-link:hover{background:#C8431F}

/* ---------- header and footer ---------- */
.site-head{background:var(--deep);border-bottom:5px solid var(--sun)}
.brand span{color:var(--cream);text-shadow:2px 2px 0 var(--red)}
.nav-links a{color:var(--cream)}
.nav-links a:hover,.nav-links a[aria-current=page]{color:var(--sun)}
.nav-cta{box-shadow:0 4px 0 #061B40}
.menu summary{border-radius:10px;border-color:#5C7DB3}
.menu ul{border-bottom-color:var(--sun)}
.site-foot,footer{background:var(--forest) var(--grain);color:#D8E6D2;border-top:6px solid var(--sun)}
.site-foot h2{-webkit-text-stroke:0;padding:0;font:800 1rem/1.2 var(--cond);letter-spacing:.18em;text-transform:uppercase;color:var(--sun);text-shadow:none;transform:none}
.site-foot a{color:var(--cream)}
.foot-brand b{color:var(--cream);text-shadow:2px 2px 0 var(--red)}
.foot-base{border-top-color:#2C6A45;color:#B5CDB0}

/* ---------- green poster banner (used under the hero) ---------- */
.ribbon{background:var(--forest) var(--grain);color:var(--cream);border-block:5px solid var(--sun);overflow:hidden}
.ribbon p{margin:0;padding:14px 0;text-align:center;font:800 clamp(.95rem,2.4vw,1.35rem)/1.3 var(--cond);letter-spacing:.22em;text-transform:uppercase}
.ribbon b{color:var(--sun);font-weight:800;padding:0 .5em}

/* ---------- home hero: the poster badge ---------- */
.hero{background:radial-gradient(120% 90% at 50% 0%, #FFF8E6 0%, var(--paper) 60%) , var(--paper);padding:26px 0 34px}
.poster-wrap{position:relative;max-width:1120px;margin:0 auto}
.poster-img{width:100%;height:auto;display:block;filter:drop-shadow(0 14px 10px rgba(12,47,107,.22))}
.seal-stamp{position:absolute;left:91%;top:55.6%;width:14.5%;transform:translate(-50%,-50%) rotate(-10deg);filter:drop-shadow(0 4px 3px rgba(12,47,107,.35));transition:transform .25s}
.seal-stamp:hover{transform:translate(-50%,-50%) rotate(-4deg) scale(1.05)}
.seal-stamp svg{width:100%;height:auto}
@media (prefers-reduced-motion: no-preference){
  .seal-stamp{animation:stamp .6s cubic-bezier(.3,1.6,.5,1) .6s both}
  @keyframes stamp{from{opacity:0;transform:translate(-50%,-50%) rotate(-30deg) scale(1.6)}to{opacity:1;transform:translate(-50%,-50%) rotate(-10deg)}}
}
@media (prefers-reduced-motion: no-preference){
  .poster .sunrise{animation:pRise 1.8s cubic-bezier(.2,.7,.2,1) .15s both}
  .poster .rays{animation:pFade 1.6s ease .5s both}
  .poster .wordmark{animation:pPop .9s cubic-bezier(.3,1.5,.5,1) .25s both;transform-box:fill-box;transform-origin:center}
  @keyframes pRise{from{transform:translateY(120px)}to{transform:none}}
  @keyframes pFade{from{opacity:0}to{opacity:.55}}
  @keyframes pPop{from{opacity:0;scale:.92}to{opacity:1;scale:1}}
}
.hero-copy{display:flex;align-items:center;justify-content:space-between;gap:20px 34px;max-width:1040px;margin:26px auto 0;padding:0 6px}
.hero-copy h1{margin:0;font:400 clamp(2rem,4.2vw,2.9rem)/1.08 var(--display);color:var(--deep);max-width:30ch}
.hero-copy h1 span{display:block;font:600 clamp(1.05rem,1.8vw,1.2rem)/1.45 var(--text);color:#3B4E72;margin-top:10px;max-width:46ch}
.hero-copy .cta-stack{align-items:flex-end}
.hero-copy .cta-note{color:var(--ink-soft)}
@media (max-width:760px){
  .hero{padding:14px 0 26px}
  .hero-copy{flex-direction:column;align-items:stretch;margin-top:18px}
  .hero-copy .cta-stack{align-items:stretch}
  .hero-copy .btn{text-align:center}
  .hero-copy .cta-note{text-align:left;max-width:none}
}

/* ---------- home sections ---------- */
section + section,.how,.where-sec,.section + .section{border-top:0}
.packs{background:transparent}
.how{background:linear-gradient(var(--paper-dk),var(--paper-dk)) top/100% 0 no-repeat}
.lede,.terms,.steps p,.gift p,.small{color:#3B4E72}
.sizes label{border-radius:10px;background:var(--cream)}
.sizes label:hover{background:#FFE9B0}
.sizes input:checked + label{background:var(--deep);color:var(--sun)}
.pack-list{border-top:4px solid var(--forest)}
.pack-list li{border-bottom:2px dashed #C9B07C;border-radius:10px}
.pack-list li.pick{background:var(--sun);border-bottom:2px solid var(--deep);box-shadow:inset 0 0 0 3px var(--deep)}
.pack-list .price{color:var(--red)}
.pack-list li.pick .price{color:var(--deep)}
.picker.label > .rule > .face{background:linear-gradient(#8FD0F0,#CDEBF8 70%,#E9F6EC)}
.steps li::before{background:var(--red);color:var(--cream);box-shadow:0 0 0 4px var(--paper),0 0 0 7px var(--deep)}
.steps h3{color:var(--deep)}
.tote-note{border-top:3px dotted #C9B07C}
.town-list li::before{background:var(--red)}
.gift h3{color:var(--red)}
.gift svg{border-radius:12px;overflow:hidden}

/* signup: sky-blue poster panel with a sunburst */
.signup{background:
  repeating-conic-gradient(from -90deg at 50% 110%, rgba(255,244,194,.22) 0 5deg, transparent 5deg 12deg),
  linear-gradient(#1F78C8,#6CC0EC);}
.signup .label > .rule > .face{background:var(--cream) var(--grain)}
.signup h2{margin-inline:auto;transform:rotate(-1.5deg);transform-origin:center}
.list-form label{color:var(--cream);text-shadow:0 2px 0 rgba(12,47,107,.5)}
.list-row input,input[type=email]{border-radius:10px}

/* ---------- inner pages ---------- */
.page-hero{background:
  repeating-conic-gradient(from -90deg at 50% 120%, rgba(255,244,194,.24) 0 5deg, transparent 5deg 12deg),
  linear-gradient(#1F78C8,#6CC0EC 80%);padding:28px 0 36px}
.page-hero .label > .rule > .face{background:var(--cream) var(--grain)}
.page-hero h1{color:var(--deep)}
.crumbs a{color:var(--deep)}
.facts{border-top:4px solid var(--forest)}
.facts li,.packs-mini li,.faq-list details{border-bottom:2px dashed #C9B07C}
.packs-mini{border-top:4px solid var(--forest)}
.packs-mini .p{color:var(--red)}
.faq-list{border-top:4px solid var(--forest)}
.faq-list summary::after{border-radius:50%;background:var(--sun)}
.town-grid a{background:var(--cream);border-radius:16px;box-shadow:0 5px 0 var(--deep)}
.town-grid a:hover{background:#FFE9B0}
.town-grid b{color:var(--red)}
.town-grid em{border-radius:8px;background:#fff}
.cta-band .label > .rule > .face{background:var(--sun) var(--grain)}
.cta-band h2{margin-inline:auto;transform-origin:center}
.prose li::marker{color:var(--red)}
@media (max-width:520px){.ribbon p{letter-spacing:.12em;font-size:.86rem}}

/* ---------- painted art pieces ---------- */
.truck-art{position:relative;border-radius:10px;overflow:hidden}
.truck-art img{width:100%;height:auto;display:block}
.count-badge{position:absolute;left:12px;top:12px;background:var(--red);color:var(--cream);border:3px solid var(--cream);outline:3px solid var(--deep);border-radius:999px;padding:8px 16px 7px;font:800 1.15rem/1 var(--cond);letter-spacing:.12em;text-transform:uppercase;transform:rotate(-4deg)}
.count-badge b{font:400 1.7rem/1 var(--display);letter-spacing:0;margin-right:4px;vertical-align:-2px}
.picker.label > .rule > .face{background:var(--cream) var(--grain);padding:14px 14px 18px}
.tote-photo{width:220px;height:auto;flex:none;border-radius:14px;border:6px solid var(--cream);outline:4px solid var(--forest);transform:rotate(-2deg);box-shadow:0 8px 0 rgba(12,47,107,.18)}
.gift{grid-template-columns:240px 1fr}
.gift-card{position:relative;border-radius:14px;overflow:hidden;border:6px solid var(--cream);outline:4px solid var(--forest);transform:rotate(2deg);box-shadow:0 8px 0 rgba(12,47,107,.18)}
.gift-card img{width:100%;height:auto;display:block}
.gift-card span{position:absolute;left:0;right:0;top:8px;text-align:center;font:400 1.75rem/1 var(--display);color:var(--cream);-webkit-text-stroke:4px var(--red);paint-order:stroke fill;text-shadow:3px 3px 0 var(--deep)}
.snap{margin:0;background:var(--cream);padding:10px 10px 12px;border-radius:6px;box-shadow:0 10px 18px rgba(12,47,107,.25);transform:rotate(3deg)}
.snap img{width:100%;height:auto;display:block;border-radius:3px}
.page-hero .hero-art{width:220px}
@media (min-width:760px){.page-hero .hero-art{width:260px}}
@media (max-width:640px){.tote-photo{width:180px}.gift{grid-template-columns:1fr}.gift-card{max-width:280px}.page-hero .hero-art{width:170px}}
.signup .seal{width:130px;margin:-4px auto 6px;transform:rotate(-8deg)}

/* ---------- merged from the ChatGPT preview ---------- */
.price-chip{margin:12px 0 0;display:inline-block;background:var(--cream);border:2px dashed var(--red);border-radius:12px;padding:8px 14px;font:600 1rem/1.4 var(--text);color:var(--deep)}
.price-chip b{font:400 1.25rem/1 var(--display);color:var(--red);margin-right:4px}
.sched-card{margin-top:28px;background:var(--deep) var(--grain);color:var(--cream);border-radius:16px;padding:22px 22px 18px;box-shadow:7px 7px 0 var(--sun);max-width:440px}
.sched-card .kicker{color:var(--sun)}
.sched-card .kicker::before{background:var(--sun)}
.sched-card h3{font:400 1.7rem/1.1 var(--display);margin:0 0 10px;color:var(--cream)}
.sched-card dl{margin:0}
.sched-card dl>div{border-bottom:1px solid rgba(255,243,214,.25);padding:10px 0}
.sched-card dt{font-weight:700}
.sched-card dd{margin:2px 0 0;color:var(--sun);font-weight:700}
.sched-card p{margin:12px 0 0;font-size:.98rem;color:#DCE6F5}

/* ---------- readability (Chad review, Oct 11) ---------- */
/* FAQ group headings and phone-size section headings: same Shrikhand, no outline or tilt */
.faq-group h2{color:var(--deep);-webkit-text-stroke:0;text-shadow:2px 2px 0 var(--sun);transform:none;padding:0}
@media (max-width:640px){
  h2,.section h2,.cta-band h2{color:var(--deep);-webkit-text-stroke:0;text-shadow:2px 2px 0 var(--sun);transform:none;font-size:clamp(1.8rem,8vw,2.2rem);padding:0}
  .signup h2,.cta-band h2{margin-inline:auto}
}
@media (max-width:480px){.cta-more{display:none}.site-head .wrap{gap:8px}}
@media (max-width:640px){.seal-stamp{left:88%;width:15%}}
.hero{overflow-x:clip}

.founding{margin:10px 0 0;font:600 1rem/1.4 var(--text);color:var(--deep)}
.founding b{color:var(--red)}