:root{
  --paper:#F4EAD3;
  --paper-light:#FBF5E4;
  --ink:#43302E;
  --brown:#4A3220;
  --rust:#B5502F;
  --rust-dark:#96421F;
  --teal:#2F6E6A;
  --mustard:#DFA93F;
  --green:#2E6B34;
  color-scheme: light only;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{overflow-x:clip}
body{
  background:
    radial-gradient(ellipse 600px 300px at 15% 0%, rgba(181,80,47,.07), transparent 70%),
    radial-gradient(ellipse 700px 340px at 90% 100%, rgba(47,110,106,.06), transparent 70%),
    var(--paper);
  color:var(--ink);
  font-family:"Nunito Sans",system-ui,sans-serif;
  line-height:1.55;
}
img{display:block;max-width:100%}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}

/* masthead */
.masthead{background:linear-gradient(180deg,#BC5A34,#AC4E2B);color:var(--paper-light);box-shadow:0 2px 0 rgba(74,50,32,.35)}
.masthead-in{display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;padding-top:1.1rem;padding-bottom:1rem}
.brand-row{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;width:100%}
.wordmark{font-family:"Alfa Slab One",serif;font-size:clamp(1.7rem,4.2vw,2.9rem);letter-spacing:.045em;text-transform:uppercase;color:var(--paper-light);text-decoration:none;text-shadow:2px 2px 0 rgba(74,50,32,.35);white-space:nowrap}
.masthead-tag{font-family:"Rokkitt",serif;font-weight:800;text-transform:uppercase;letter-spacing:.06em;line-height:1.15;font-size:clamp(.78rem,1.5vw,.98rem);color:rgba(251,245,228,.92)}

/* hamburger menu */
.menu-btn{display:flex;flex-direction:column;justify-content:center;gap:5px;width:46px;height:46px;padding:10px;background:rgba(251,245,228,.14);border:2px solid rgba(251,245,228,.65);border-radius:6px;cursor:pointer;flex:none}
.menu-btn span{display:block;height:3px;background:var(--paper-light);border-radius:2px;transition:transform .18s ease,opacity .18s ease}
.menu-btn:hover{background:rgba(251,245,228,.28)}
.menu-btn.open span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.menu-btn.open span:nth-child(2){opacity:0}
.menu-btn.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.menu-panel{background:var(--paper-light);border-bottom:3px double rgba(74,50,32,.45);box-shadow:0 14px 18px rgba(74,50,32,.20);animation:drop .16s ease}
@keyframes drop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.menu-list{list-style:none;padding-top:.4rem;padding-bottom:.4rem}
.menu-list li{border-bottom:1px solid rgba(74,50,32,.16)}
.menu-list li:last-child{border-bottom:none}
.menu-list a{display:block;padding:.72rem .4rem;font-family:"Rokkitt",serif;font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:1.08rem;color:var(--brown);text-decoration:none}
.menu-list a.active{color:var(--rust);box-shadow:inset 4px 0 0 var(--rust);padding-left:.8rem}
.menu-list a:hover{color:var(--rust);background:rgba(181,80,47,.07)}

/* postcard chrome */
.postcard{background:var(--paper-light);border:1px solid rgba(74,50,32,.25);border-radius:6px;box-shadow:0 10px 24px rgba(74,50,32,.22), 0 2px 5px rgba(74,50,32,.18);padding:10px}
.wrap.page{padding-top:28px;padding-bottom:3rem}

/* hero */
.hero-card{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:1.5rem;padding:2rem 2rem 1.6rem;transform:rotate(-.5deg)}
.hero-text{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:.9rem;padding-left:.5rem}
.kicker{font-family:"Rokkitt",serif;font-weight:800;font-style:italic;text-transform:uppercase;letter-spacing:.04em;color:var(--rust);font-size:clamp(1.05rem,2.2vw,1.5rem)}
.hero-text h1{font-family:"Alfa Slab One",serif;font-weight:400;text-transform:uppercase;line-height:1.08;color:var(--brown);font-size:clamp(1.9rem,4vw,3rem)}
.lede{font-size:1.05rem;color:#5c4633;max-width:38ch}
.btn{display:inline-block;background:var(--rust);color:#FFF7E8;font-family:"Rokkitt",serif;font-weight:800;text-transform:uppercase;letter-spacing:.09em;font-size:1rem;text-decoration:none;padding:.65rem 1.5rem;border-radius:4px;box-shadow:2px 3px 0 rgba(74,50,32,.55)}
.btn:hover{background:var(--rust-dark)}
.hero-art{border:1px solid rgba(74,50,32,.3);border-radius:4px;overflow:hidden;align-self:center}
.hero-art img{width:100%;height:auto}
.postmark{position:absolute;top:14px;left:44%;width:104px;height:104px;border:2.5px solid rgba(74,50,32,.5);border-radius:50%;color:rgba(74,50,32,.65);font-family:"Rokkitt",serif;font-weight:600;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(-11deg);line-height:1.5;pointer-events:none}
.postmark strong{font-size:.95rem;letter-spacing:.2em}

/* story cards */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.7rem;margin-top:2.6rem}
.story-card{padding:10px 10px 12px}
.tilt-l{transform:rotate(-1.1deg)}
.tilt-r{transform:rotate(.7deg)}
.tilt-l2{transform:rotate(-.5deg)}
.card-img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:3px;border:1px solid rgba(74,50,32,.3)}
.story-card h2{font-family:"Alfa Slab One",serif;font-weight:400;text-transform:uppercase;line-height:1.16;font-size:1.32rem;color:var(--brown);padding:.85rem .3rem 0}
.story-card h2 .t-rust{color:var(--rust)}
.story-card h2.t-teal{color:var(--teal)}
.story-card h2.t-green{color:var(--green)}
.caption{font-family:"Rokkitt",serif;font-weight:600;font-size:.98rem;color:#5c4633;padding:.7rem .3rem 0}

/* postcard note */
.note-card{margin-top:2.6rem;padding:1.6rem 2rem;transform:rotate(.4deg)}
.note-hand{font-family:"Caveat Brush",cursive;font-size:1.5rem;color:var(--rust);margin-bottom:.4rem}
.note-body{font-family:"Rokkitt",serif;font-weight:600;font-size:1.05rem;color:#5c4633;max-width:75ch}
.note-sign{color:var(--rust-dark)}

/* cards as links */
.card-link{text-decoration:none;color:inherit;display:block}
.card-link:hover h2{color:var(--rust)}

/* article */
.crumbs{font-family:"Rokkitt",serif;font-weight:600;font-size:.92rem;color:#7A6A55;margin-bottom:1.4rem}
.crumbs a{color:var(--rust-dark);text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.post-head{max-width:760px}
.post-head h1{font-family:"Alfa Slab One",serif;font-weight:400;text-transform:uppercase;line-height:1.1;color:var(--brown);font-size:clamp(1.8rem,4.4vw,2.9rem);margin:.4rem 0 .8rem}
.standfirst{font-family:"Rokkitt",serif;font-weight:600;font-size:1.15rem;color:#5c4633;line-height:1.5}
.meta-row{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin-top:1.1rem;font-family:"Rokkitt",serif;font-weight:600;color:#7A6A55;font-size:.95rem}
.stamp-standing{margin-left:auto;border:2.5px solid var(--rust);color:var(--rust);font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:.78rem;padding:.3rem .7rem;border-radius:4px;transform:rotate(-3deg);background:rgba(181,80,47,.06)}
.post-hero{margin:1.8rem 0 2.2rem;transform:rotate(-.4deg)}
.post-hero img{width:100%;height:auto;border-radius:3px}
.post-hero figcaption{font-family:"Caveat Brush",cursive;font-size:1.15rem;color:#5c4633;padding:.55rem .3rem .1rem}
.prose{max-width:720px;font-size:1.06rem;line-height:1.7;color:#453729}
.prose p{margin-bottom:1.15rem}
.prose h2{font-family:"Rokkitt",serif;font-weight:800;font-size:1.45rem;color:var(--rust-dark);margin:2rem 0 .7rem;line-height:1.25}
.prose blockquote{font-family:"Caveat Brush",cursive;font-size:1.6rem;line-height:1.3;color:var(--teal);border-left:4px solid var(--mustard);padding:.2rem 0 .2rem 1.1rem;margin:1.8rem 0}
.illo{margin:2rem 0;transform:rotate(.4deg)}
.illo:nth-of-type(even){transform:rotate(-.4deg)}
.illo img{width:100%;height:auto;border-radius:3px}
.illo figcaption{font-family:"Caveat Brush",cursive;font-size:1.15rem;color:#5c4633;padding:.55rem .3rem .1rem}
.gtk{max-width:720px;margin-top:2.4rem;padding:1.4rem 1.7rem;transform:rotate(.3deg)}
.gtk h2{font-family:"Rokkitt",serif;font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:1.15rem;color:var(--rust-dark);margin-bottom:.7rem}
.gtk ul{list-style:none}
.gtk li{padding:.45rem 0 .45rem 1.4rem;position:relative;font-size:.99rem;color:#5c4633;border-bottom:1px dashed rgba(74,50,32,.25)}
.gtk li:last-child{border-bottom:none}
.gtk li::before{content:"»";position:absolute;left:.2rem;color:var(--rust);font-weight:800}
.more-stops{margin-top:3rem}
.more-stops>h2{font-family:"Alfa Slab One",serif;font-weight:400;text-transform:uppercase;color:var(--brown);font-size:1.5rem}
.more-stops .cards{margin-top:1.4rem;grid-template-columns:repeat(2,1fr);max-width:760px}
.more-stops h3{font-family:"Alfa Slab One",serif;font-weight:400;text-transform:uppercase;line-height:1.16;font-size:1.15rem;color:var(--brown);padding:.85rem .3rem 0}
.more-stops h3.t-teal{color:var(--teal)}
.more-stops h3.t-green{color:var(--green)}

/* footer */
.site-footer{border-top:3px double rgba(74,50,32,.45);padding:1.6rem 0 2rem;text-align:center}
.footer-nav{display:flex;gap:.55rem 2rem;justify-content:center;flex-wrap:wrap;margin-bottom:.7rem}
.footer-nav a{font-family:"Rokkitt",serif;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--brown);text-decoration:none;font-size:1rem}
.footer-nav a:hover{color:var(--rust)}
.copyright{font-size:.88rem;color:#7A6A55}

/* responsive */
@media (max-width:640px){
  .wrap{padding-left:16px;padding-right:16px}
  .brand-row{gap:.7rem;max-width:100%}
  .wordmark{font-size:1.32rem;letter-spacing:.02em}
  .menu-btn{width:40px;height:40px;padding:8px}
  .masthead-tag{font-size:.72rem}
  .masthead-in{padding-top:.85rem;padding-bottom:.8rem}
  .hero-card{transform:none}
}
@media (max-width:860px){
  .more-stops .cards{grid-template-columns:repeat(2,1fr);gap:14px;padding:0;margin-left:auto;margin-right:auto;width:100%}
  .more-stops .story-card{transform:none}
  .hero-card{grid-template-columns:1fr;padding:1.4rem 1.2rem}
  .postmark{display:none}
  .cards{grid-template-columns:1fr;max-width:460px;margin-left:auto;margin-right:auto}
  .masthead-in{gap:.3rem}
}

.answer-block{margin:0 0 1.6rem;padding:1.1rem 1.3rem}
.answer-block .answer-h{font-family:Rokkitt,Georgia,serif;font-size:1.15rem;color:#B5502F;margin:0 0 .4rem;text-transform:uppercase;letter-spacing:.04em}
.answer-block p{margin:0;font-size:1.05rem;line-height:1.55}
.faq-block{margin:2.2rem 0 0;padding-top:1.4rem;border-top:2px dashed #B5502F55}
.faq-block h2{font-family:Rokkitt,Georgia,serif;color:#7A4A21;margin:0 0 1rem}
.faq-item{margin:0 0 1.1rem}
.faq-item h3{font-family:Rokkitt,Georgia,serif;font-size:1.12rem;margin:0 0 .3rem;color:#33302A}
.faq-item p{margin:0;line-height:1.55}

.real-thing{margin:2.2rem 0 0;padding:1rem 1rem .8rem}
.real-thing .real-tag{font-family:Rokkitt,Georgia,serif;text-transform:uppercase;letter-spacing:.06em;color:#B5502F;font-size:.95rem;margin:.1rem 0 .6rem}
.real-thing img{width:100%;height:auto;display:block}
.real-thing figcaption{font-family:'Caveat Brush',cursive;font-size:1.05rem;color:#5A4632;margin-top:.55rem;line-height:1.35}
.real-thing figcaption .credit{font-family:'Nunito Sans',sans-serif;font-size:.78rem;color:#7A6A55;display:block;margin-top:.25rem}
.real-thing figcaption .credit a{color:#B5502F}