@font-face{font-family:"Caladea";src:url("fonts/Caladea-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Caladea";src:url("fonts/Caladea-Italic.ttf") format("truetype");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Caladea";src:url("fonts/Caladea-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Poppins";src:url("fonts/Poppins-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"Poppins";src:url("fonts/Poppins-Medium.ttf") format("truetype");font-weight:500;font-display:swap}

:root{
  --paper:#FFFFFF; --ink:#000000; --soft:#4A4A4A; --muted:#6E6E6E; --line:#E3E3E3; --band:#F4F2EE;
  --serif:"Caladea","Palatino Linotype",Palatino,Georgia,serif;
  --sans:"Poppins",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.125rem/1.7 var(--serif);-webkit-text-size-adjust:100%}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.skip{position:absolute;left:-999px;top:0}
.skip:focus{left:1rem;top:1rem;background:#fff;padding:.5rem 1rem;z-index:10}
.wrap{width:min(100% - 2.5rem,76rem);margin-inline:auto}
.narrow{width:min(100% - 2.5rem,40rem);margin-inline:auto}

/* masthead */
.masthead{border-top:5px solid var(--ink);text-align:center;padding-top:1.6rem}
.tagline{font:400 .78rem/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin:0}
.wordmark{display:inline-block;font:700 clamp(2.6rem,7vw,4.8rem)/1 var(--serif);letter-spacing:-.015em;text-decoration:none;margin:.55rem 0 1.1rem}
.nav{border-top:1px solid var(--line);border-bottom:1px solid var(--ink);display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem 2.2rem;padding:.85rem 1rem}
.nav a{font:500 .74rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;text-decoration:none}
.nav a:hover{text-decoration:underline;text-underline-offset:.35em}

/* labels */
.kicker{font:500 .72rem/1.2 var(--sans);letter-spacing:.16em;text-transform:uppercase;margin:0 0 .7rem}
.byline{font:400 .78rem/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:1rem 0 0}

/* hero story */
.hero{padding-top:2.2rem}
.hero-img{aspect-ratio:21/9;overflow:hidden}
.hero-img img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.hero-text{text-align:center;max-width:46rem;margin:2rem auto 0}
.hero-text h1{font:700 clamp(2.3rem,5.5vw,4.2rem)/1.04 var(--serif);letter-spacing:-.015em;margin:0 0 1rem;text-wrap:balance}
.hero-text h1 a{text-decoration:none}
.hero-text h1 a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.12em}
.dek{font:italic 400 1.3rem/1.55 var(--serif);color:var(--soft);margin:0}

/* sections */
.section{padding-block:clamp(3rem,7vw,5rem)}
.section-head{display:flex;align-items:baseline;gap:1.2rem;border-top:1px solid var(--ink);padding-top:.9rem;margin-bottom:2rem}
.section-head h2{font:500 .8rem/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;margin:0}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2.4rem}
.card a{text-decoration:none}
.card .ph{aspect-ratio:4/5;overflow:hidden;margin-bottom:1rem;background:var(--band)}
.card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.card a:hover .ph img{transform:scale(1.03)}
@media (prefers-reduced-motion:reduce){.card .ph img{transition:none}}
.card h3{font:700 1.55rem/1.15 var(--serif);margin:0 0 .5rem}
.card a:hover h3{text-decoration:underline;text-underline-offset:.12em}
.card p{font-size:1.02rem;line-height:1.55;color:var(--soft);margin:0}

/* shop */
.shop{background:var(--band)}
.products{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem)}
.product{display:grid;grid-template-columns:minmax(0,11rem) 1fr;gap:1.6rem;align-items:start}
.product img{box-shadow:0 18px 30px -18px rgba(0,0,0,.45)}
.product h3{font:700 1.6rem/1.15 var(--serif);margin:0 0 .6rem}
.product p{font-size:1.02rem;line-height:1.55;color:var(--soft);margin:0 0 1rem}
.price{font:700 1.3rem/1 var(--serif);margin:0 0 1rem}
.btn{display:inline-block;font:500 .75rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;padding:1rem 1.5rem;background:var(--ink);color:#fff;text-decoration:none;border:1px solid var(--ink)}
.btn:hover{background:#fff;color:var(--ink)}
.btn-ghost{background:transparent;color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:#fff}
.todo{background:#FFF0A8;padding:0 .25em}

/* about */
.about{text-align:center}
.about .lead{font:400 clamp(1.4rem,2.6vw,1.85rem)/1.45 var(--serif);margin:0 0 1.2rem}
.about p{color:var(--soft)}

/* newsletter band */
.band{background:var(--ink);color:#fff;text-align:center}
.band h2{font:700 clamp(1.9rem,4vw,2.8rem)/1.1 var(--serif);margin:0 0 .8rem}
.band p{color:#CFCFCF;margin:0 0 1.6rem}
.band .btn{background:#fff;color:var(--ink);border-color:#fff}
.band .btn:hover{background:transparent;color:#fff}

/* footer */
.site-footer{padding-block:2.4rem 3rem;text-align:center;font:400 .8rem/1.6 var(--sans);color:var(--muted)}
.site-footer .wordmark{font-size:1.6rem;margin:0 0 .8rem}
.site-footer p{margin:0 auto .5rem;max-width:44rem}

/* article */
.article-head{text-align:center;padding-top:clamp(2.5rem,6vw,4rem)}
.article-head h1{font:700 clamp(2.4rem,6vw,4.6rem)/1.03 var(--serif);letter-spacing:-.015em;margin:0 auto 1.1rem;max-width:52rem;text-wrap:balance}
.article-hero{margin:2.5rem auto 0;width:min(100% - 2.5rem,76rem)}
.article-hero img{width:100%;aspect-ratio:16/9;object-fit:cover}
figcaption{font:400 .76rem/1.5 var(--sans);color:var(--muted);margin-top:.55rem}
.prose{padding-block:2.5rem 1rem}
.prose p{margin:0 0 1.2rem}
.prose > p:first-of-type::first-letter{float:left;font:700 4.6rem/.8 var(--serif);padding:.35rem .6rem 0 0}
.prose h2{font:700 clamp(1.7rem,3vw,2.2rem)/1.15 var(--serif);margin:3rem 0 1rem}
.notice{font:400 .86rem/1.55 var(--sans);color:var(--soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:.9rem 0;margin:1.8rem auto 0;max-width:40rem}
.pull{font:italic 400 1.6rem/1.4 var(--serif);text-align:center;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);padding:1.4rem 0;margin:2.5rem 0}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:1rem;width:min(100% - 2.5rem,60rem);margin:2.5rem auto}
.duo img{width:100%;aspect-ratio:4/5;object-fit:cover}
.table-scroll{overflow-x:auto;margin:1.5rem 0 2rem}
table{border-collapse:collapse;width:100%;min-width:34rem;font:400 1rem/1.4 var(--serif)}
th{font:500 .7rem/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase;text-align:left;border-bottom:1px solid var(--ink);padding:.7rem .8rem .7rem 0}
td{border-bottom:1px solid var(--line);padding:.85rem .8rem .85rem 0;vertical-align:top}
td a{font:500 .72rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase}
.endcard{text-align:center;border-top:1px solid var(--ink);padding-top:2rem;margin-top:3rem}
.endcard h2{margin-top:0}

@media (max-width:56rem){
  .grid{grid-template-columns:1fr 1fr}
  .products{grid-template-columns:1fr}
}
@media (max-width:38rem){
  .grid{grid-template-columns:1fr}
  .hero-img{aspect-ratio:4/3}
  .product{grid-template-columns:7.5rem 1fr;gap:1.1rem}
  .nav{gap:.6rem 1.3rem}
  .duo{grid-template-columns:1fr}
}

/* keep labels consistent inside cards and products */
.card .kicker,.product .kicker{font:500 .72rem/1.2 var(--sans);letter-spacing:.16em;color:var(--ink);margin:0 0 .7rem}
.product .price{font:700 1.3rem/1 var(--serif);color:var(--ink)}
.article-hero{width:min(100% - 2.5rem,52rem)}
.article-hero img{aspect-ratio:3/2}

/* wide figures and lists in articles */
.wide-fig{width:min(100% - 2.5rem,60rem);margin:2.5rem auto}
.wide-fig img{width:100%;aspect-ratio:16/9;object-fit:cover}
.prose ul,.prose ol{padding-left:1.3rem;margin:0 0 1.4rem}
.prose li{margin-bottom:.5rem}
.prose h3{font:700 1.3rem/1.25 var(--serif);margin:2rem 0 .5rem}
.head-actions{margin-top:1.6rem}
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;width:min(100% - 2.5rem,60rem);margin:2.5rem auto}
.trio img{width:100%;aspect-ratio:4/5;object-fit:cover}
@media (max-width:38rem){.trio{grid-template-columns:1fr}}

/* route map (loads only on request) */
.map-block{width:min(100% - 2.5rem,60rem);margin:1.5rem auto 2.5rem}
.map{height:30rem;background:var(--band);border:1px solid var(--line);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:1.5rem;gap:1rem}
.map.is-live{display:block;padding:0}
.map.is-live .leaflet-tile-pane{filter:grayscale(1) contrast(1.05) brightness(1.03)}
.map p{font:400 .85rem/1.5 var(--sans);color:var(--soft);max-width:30rem;margin:0}
.map .btn{cursor:pointer}
.map .btn[disabled]{opacity:.6;cursor:default}
.pin span{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:#000;color:#fff;font:500 12px/1 var(--sans);border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.35)}
.pin-sight span{width:14px;height:14px;background:#fff;border:2px solid #000;box-shadow:none}
.leaflet-popup-content{font:400 .9rem/1.45 var(--serif)}
.leaflet-popup-content strong{font-family:var(--serif)}
.map-legend{display:grid;grid-template-columns:1fr 1fr;gap:.2rem 2rem;margin:1.2rem 0 0;padding:0;list-style:none;font:400 .95rem/1.5 var(--serif)}
.map-legend li{display:flex;gap:.7rem;align-items:baseline;padding:.35rem 0;border-bottom:1px solid var(--line)}
.map-legend b{font:500 .75rem/1 var(--sans);background:#000;color:#fff;border-radius:50%;min-width:1.5rem;height:1.5rem;display:inline-flex;align-items:center;justify-content:center}
.map-key{font:400 .78rem/1.5 var(--sans);color:var(--muted);margin:.8rem 0 0}
@media (max-width:38rem){.map{height:22rem}.map-legend{grid-template-columns:1fr}}
