/* /in-season/ pages. Sits on top of styles/sub.css (cream ground, Fraunces, DM Sans labels).
   Colours are the app's: peak green, starting gold, ending orange. Arches echo the app's recipe cards. */
.in-page{
  --peak:#4F7B45;--peak-soft:#B9D1AE;--start:#D9A93A;--end:#D07A3A;--none:rgba(27,24,22,.07);
  --arch:90px 90px 12px 12px;
}
.in-head h1{max-width:20ch}
.in-head h1 .punch{display:inline;margin:0}
.in-head .answer{margin-top:22px;max-width:62ch;font-size:clamp(1.12rem,1.02rem + .45vw,1.35rem);line-height:1.5;font-weight:500;color:var(--ink)}
.acts-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}

/* month arches */
.arches{list-style:none;margin:8px 0 36px;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
@media (min-width:900px){.arches{grid-template-columns:repeat(12,1fr);gap:12px}}
.arches a{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:2px;text-decoration:none;aspect-ratio:3/4;padding:0 6px 14px;background:var(--paper);border-radius:var(--arch);box-shadow:inset 0 0 0 1.5px var(--rule);transition:transform .35s var(--spring),background .25s,box-shadow .25s}
.arches a:hover{transform:translateY(-4px);box-shadow:inset 0 0 0 1.5px var(--peak)}
.arches .a-m{font-family:var(--ui);font-weight:700;font-size:.8125rem;letter-spacing:.08em;text-transform:uppercase}
.arches .a-n{font-weight:900;font-size:1.6rem;line-height:1}
.arches .a-n small{display:block;font-family:var(--ui);font-weight:500;font-size:.6875rem;letter-spacing:0;color:var(--pencil);margin-top:3px}
.arches li.now a{background:var(--green);color:var(--green-ink);box-shadow:none}
.arches li.now small{color:#C9DDB8}

/* legend */
.legend{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin:0 0 22px;font-family:var(--ui);font-size:.8125rem;color:var(--pencil)}
.key{display:inline-flex;align-items:center;gap:7px}
.key i{width:18px;height:18px;border-radius:5px;display:inline-block}
.legend-pips{flex-basis:100%}
@media (min-width:700px){.legend-pips{flex-basis:auto;margin-left:6px}}

.tag{display:inline-block;font-family:var(--ui);font-size:.6875rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:3px 9px;border-radius:999px;white-space:nowrap}
.t-peak{background:var(--peak);color:#fff}
.t-starting{background:#F4E2A8;color:#6B4E0A}
.t-ending{background:#F2CDB0;color:#7A3E10}
.t-around{background:var(--none);color:var(--ink-soft)}

/* month page */
.month-intro{font-size:clamp(1.05rem,1rem + .3vw,1.2rem);line-height:1.6;max-width:62ch;margin:6px 0 26px;color:var(--ink-soft)}
.cook{margin:40px 0 0;padding:20px 24px;background:var(--paper);border-radius:var(--arch);border-radius:20px;box-shadow:inset 0 0 0 1.5px var(--rule);max-width:62ch}
.cook p{margin-top:8px}
.also{font-family:var(--ui);font-size:.9375rem;line-height:1.7;color:var(--ink-soft);margin:18px 0 0;max-width:none}
.also b{display:block;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--pencil);margin-bottom:2px}
.also a{text-decoration:none;border-bottom:1px solid var(--rule)}
.also i{font-style:normal;margin-right:.35em}
.grp{margin-top:34px}
.grp h2{font-weight:900;font-size:clamp(1.6rem,1.3rem + 1vw,2.2rem);display:flex;align-items:baseline;gap:10px;padding-bottom:10px;border-bottom:1.5px solid var(--ink)}
.grp h2 small{font-family:var(--ui);font-size:.875rem;font-weight:500;color:var(--pencil)}
.items{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:0 40px}
@media (min-width:760px){.items{grid-template-columns:1fr 1fr}}
@media (min-width:1100px){.items{grid-template-columns:1fr 1fr 1fr}}
.it{padding:16px 0 14px;border-bottom:1px solid var(--rule);break-inside:avoid}
.it-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.it-top b{font-weight:700;font-size:1.1875rem}
.it-top a{text-decoration:none;border-bottom:1.5px solid var(--peak-soft)}
.it-top a:hover{border-bottom-color:var(--peak)}
.it-note{font-family:var(--ui);font-size:.875rem;line-height:1.45;color:var(--ink-soft);margin:5px 0 9px}
.north{display:block;color:var(--pencil);margin-top:2px}

.pips{display:inline-grid;grid-template-columns:repeat(12,1fr);gap:2px;width:100%;max-width:240px}
.pips i{height:9px;border-radius:2px;background:var(--none)}
.pips .p-peak{background:var(--peak)}
.pips .p-in{background:var(--peak-soft)}
.pips .here{outline:2px solid var(--ink);outline-offset:1px;border-radius:2px}

.ph-box{margin:26px 0;padding:16px 18px;border:1.5px dashed rgba(27,24,22,.3);border-radius:14px;font-family:var(--ui);font-size:.9375rem;color:var(--ink-soft);background:rgba(255,253,248,.6)}
.ph-box code{font-size:.8125rem}
.monthnav{display:flex;justify-content:space-between;gap:12px;margin:44px 0 28px;font-family:var(--ui);font-weight:600}
.monthnav a{padding:10px 16px;border-radius:999px;text-decoration:none;box-shadow:inset 0 0 0 1.5px var(--rule)}
.monthnav a:hover{box-shadow:inset 0 0 0 1.5px var(--ink)}
.region,.method{font-family:var(--ui);font-size:.875rem;line-height:1.55;color:var(--ink-soft);max-width:70ch}
.region{margin-top:12px}
.method{margin:28px 0 80px}
.in-cta{margin-top:40px}
.print-title{display:none}

/* year grid */
.gridwrap{overflow-x:auto;margin:0 calc(var(--gutter) * -1);padding:0 var(--gutter) 6px;-webkit-overflow-scrolling:touch}
table.year{border-collapse:separate;border-spacing:0;width:100%;min-width:640px;font-family:var(--ui)}
table.year thead th{position:sticky;top:0;background:var(--cream);font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:10px 0 8px;z-index:2}
table.year thead a{text-decoration:none;display:block;padding:4px 0;border-radius:var(--arch);text-align:center}
table.year thead th.now a{background:var(--green);color:var(--green-ink)}
table.year thead a:hover{background:var(--cream-deep)}
table.year th[scope=row]{text-align:left;font-weight:500;font-size:.9375rem;padding:0 12px 0 0;white-space:nowrap;position:sticky;left:0;background:var(--cream);z-index:1;width:150px}
table.year th[scope=row] a{text-decoration:none;border-bottom:1.5px solid var(--peak-soft)}
table.year tbody td{padding:2.5px 1.5px;height:24px}
table.year tbody td::before{content:"";display:block;height:19px;border-radius:5px;background:var(--none)}
table.year tbody td.c-peak::before{background:var(--peak)}
table.year tbody td.c-in::before{background:var(--peak-soft)}
table.year td.now{background:rgba(63,94,57,.07)}
table.year .grp-row th{text-align:left;font-family:var(--display);font-weight:900;font-size:1.5rem;padding:28px 0 8px;border-bottom:1.5px solid var(--ink);position:static;background:none}
table.year .grp-row{break-after:avoid}
.legend .c-peak{background:var(--peak)}.legend .c-in{background:var(--peak-soft)}.legend .c-off{background:var(--none)}

/* item page */
.barfig{margin:0 0 40px;padding:26px clamp(14px,3vw,32px) 22px;background:var(--paper);border-radius:24px;box-shadow:inset 0 0 0 1.5px var(--rule)}
.bar{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(3px,1vw,10px);align-items:end}
.bar a{display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none;height:170px;justify-content:flex-end}
.bar .arch{display:block;width:100%;height:var(--h);border-radius:var(--arch);background:var(--none);transition:transform .35s var(--spring)}
.bar .b-peak .arch{background:var(--peak)}
.bar .b-in .arch{background:var(--peak-soft)}
.bar .b-off .arch{height:12%}
.bar a:hover .arch{transform:translateY(-3px)}
.bar .bm{font-family:var(--ui);font-size:.6875rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--pencil)}
.bar li.now .bm{color:var(--ink);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px}
.bar-note{font-family:var(--ui);font-size:.8125rem;color:var(--pencil);margin-top:16px}
.item-cols{display:grid;grid-template-columns:minmax(0,1fr);gap:40px}
@media (min-width:900px){.item-cols{grid-template-columns:minmax(0,1fr) 300px}.item-cols.no-guide{grid-template-columns:minmax(0,1fr)}}
.guide{margin-bottom:28px}
.guide h2{font-weight:900;font-size:1.5rem;margin-bottom:8px}
.guide p{max-width:60ch}
.dinners{padding-left:1.1em}.dinners li{margin-bottom:8px}
.side h2{font-weight:900;font-size:1.25rem;margin-bottom:10px}
.mini{list-style:none;padding:0;margin:0 0 20px;display:flex;flex-wrap:wrap;gap:8px}
.mini li{font-family:var(--ui);font-size:.875rem;padding:5px 12px;border-radius:999px;background:var(--paper);box-shadow:inset 0 0 0 1.5px var(--rule)}
.mini a{text-decoration:none}

/* hub */
.now-card{margin:0 0 24px;padding:26px clamp(18px,3vw,36px);background:var(--green);color:var(--green-ink);border-radius:24px}
.now-card h2{font-weight:900;font-size:1.5rem;margin-bottom:10px}
.now-card p{font-size:1.125rem;max-width:62ch;margin-bottom:16px}
.now-card .btn{background:var(--cream);color:var(--ink)}
.sec{font-weight:900;font-size:1.75rem;margin:20px 0 14px}
.countries{list-style:none;padding:0;margin:0 0 30px;display:grid;gap:14px;grid-template-columns:1fr}
@media (min-width:760px){.countries{grid-template-columns:repeat(3,1fr)}}
.country{background:var(--paper);border-radius:var(--arch);box-shadow:inset 0 0 0 1.5px var(--rule);overflow:hidden}
.country>a,.country.soon{display:flex;flex-direction:column;gap:6px;padding:40px 22px 24px;text-decoration:none;min-height:150px;justify-content:flex-end}
.country b{font-weight:900;font-size:1.5rem}
.country span{font-family:var(--ui);font-size:.875rem;color:var(--ink-soft)}
.country.soon{opacity:.55}
.country>a:hover{background:var(--cream-deep)}

/* ----- print: one tidy A4 sheet for the fridge ----- */
@page{size:A4;margin:11mm}
@media print{
  html,body{background:#fff!important}
  body{font-size:9pt;line-height:1.3;color:#000}
  .nav,.frill,.foot,.endcard,.acts-row,.monthnav,.arches,.ph-box,.crumbs,.head .meta,.head .label,.region,.legend-pips,.sr-only:not(table *){display:none!important}
  .in-head{padding:0!important}
  .in-head h1{display:none}
  .wrap{max-width:none;padding:0}
  .cook{display:none}
  .month-intro{font-size:8.5pt;margin:0 0 6pt;max-width:none}
  .print-title{display:flex!important;justify-content:space-between;align-items:baseline;border-bottom:2pt solid #000;padding-bottom:4pt;margin-bottom:6pt}
  .print-title b{font-family:var(--display);font-weight:900;font-size:17pt}
  .print-title span{font-family:var(--ui);font-size:8pt;color:#555}
  .in-head .answer{display:none}
  .in-year .in-head .answer{display:block;font-size:8pt;margin:0 0 5pt;font-weight:400;max-width:none}
  .legend{margin:0 0 6pt;font-size:7.5pt}
  .tag{border:.6pt solid #000;background:none!important;color:#000!important;padding:0 4pt;font-size:6pt}
  .t-peak{background:#000!important;color:#fff!important}
  .month-print,.in-page:not(.in-year) .wrap>section.grp{break-inside:auto}
  .grp{margin-top:7pt}
  .grp h2{font-size:12pt;padding-bottom:2pt;border-bottom:1pt solid #000}
  .items{grid-template-columns:repeat(3,1fr)!important;gap:0 14pt}
  .it{padding:3pt 0 2.5pt}
  .it-top b{font-size:9.5pt}
  .it-note{display:none}
  .also{font-size:7.5pt;line-height:1.35;margin:4pt 0 0}
  .also b{display:inline;font-size:6.5pt;margin-right:4pt}
  .it .pips{max-width:none;margin-top:2pt}
  .pips i{height:5pt;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .p-peak,.p-in,.c-peak::before,.c-in::before,.t-peak{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .method{margin:8pt 0 0;font-size:6.5pt;max-width:none}
  .method b{display:none}
  .gridwrap{overflow:visible;margin:0;padding:0}
  table.year{min-width:0;font-size:7pt}
  table.year thead th{position:static;background:none;font-size:6.5pt;padding:2pt 0}
  table.year th[scope=row]{position:static;font-size:6.3pt;line-height:1;padding:0;width:90pt;background:none}
  table.year tbody td{height:auto;padding:.1pt 1pt;line-height:1}
  table.year tbody td::before{height:4.4pt;border-radius:1.5pt;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  table.year .grp-row th{font-size:9pt;padding:3pt 0 1pt}
  table.year td.now,table.year thead th.now a{background:none!important;color:#000!important}
  .in-item .head{padding-bottom:8pt!important}
  .in-item .head h1{display:block;font-size:22pt}
}

/* promo on the hub for the pick-your-own calendar */
.cal-promo{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 28px;margin:0 0 28px;padding:22px clamp(18px,3vw,32px);background:var(--paper);border-radius:20px;box-shadow:inset 0 0 0 1.5px var(--rule)}
.cal-promo h2{font-weight:900;font-size:1.4rem}
.cal-promo p{font-family:var(--ui);font-size:.9375rem;color:var(--ink-soft);max-width:52ch;margin-top:4px}