#aftt-tpl{
  /* Scales every rem on the page at once — the type ramp keeps its
     proportions, everything just gets ~7% larger. Percentage, not px,
     so a reader's own browser font-size setting still applies. */

  /* Brand — orange, white, neutral grays. Nothing else. */
  --paper:#FFFFFF;
  --surface:#F5F5F5;
  --surface-2:#FAFAFA;
  --ink:#1A1A1A;
  --ink-2:#454545;
  --muted:#737373;
  --line:#E5E5E5;
  --line-2:#D4D4D4;
  --orange:#FF7D00;
  --orange-ink:#FF7D00;   /* brand orange only: Carrick does not use a darker orange (2026-10-06) */
  --orange-soft:#FFF4E9;
  --gray:#5C5C5C;         /* the single hover state for everything interactive */
  --gray-light:#8E8E8E;   /* quiet structural marks — numbers, expanders, day labels */

  --wrap:1180px;
  --wrap-text:70ch;
  --r:6px;

  --f-display:"Archivo","Helvetica Neue",Arial,sans-serif;
  --f-body:"Cabin","Helvetica Neue",Arial,sans-serif;
}

#aftt-tpl *, #aftt-tpl *::before, #aftt-tpl *::after{box-sizing:border-box}
#aftt-tpl{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--f-body);font-size:2.037rem;line-height:1.72;
  -webkit-font-smoothing:antialiased;
}
#aftt-tpl img{display:block;max-width:100%}
#aftt-tpl a{color:var(--orange);text-underline-offset:3px;text-decoration-thickness:1px}
#aftt-tpl a:hover{color:var(--gray)}
#aftt-tpl :focus-visible{outline:2px solid var(--orange);outline-offset:3px}

#aftt-tpl h1, #aftt-tpl h2, #aftt-tpl h3, #aftt-tpl h4{font-family:var(--f-display);margin:0;line-height:1.14;letter-spacing:-0.02em;text-wrap:balance}
/* h1 rem values divided by 1.07 so the headline renders at its previous size */
#aftt-tpl h1{font-size:clamp(3.835rem,5.4vw,6.232rem);font-weight:800;line-height:1.05}
#aftt-tpl h2{font-size:clamp(2.91rem,3vw,4.023rem);font-weight:700;color:var(--ink)}
#aftt-tpl h3{font-size:2.054rem;font-weight:700;line-height:1.3;color:var(--orange)}
#aftt-tpl h4{font-size:1.746rem;font-weight:700}
#aftt-tpl p{margin:0}

#aftt-tpl .wrap{width:min(100% - 4.28rem,var(--wrap));margin-inline:auto}
#aftt-tpl .stack{display:flex;flex-direction:column}
#aftt-tpl .s-2{gap:1.712rem}#aftt-tpl .s-3{gap:2.739rem}#aftt-tpl .s-4{gap:4.109rem}#aftt-tpl .s-5{gap:5.992rem}
#aftt-tpl .narrow{max-width:var(--wrap-text)}
#aftt-tpl .section{padding-block:clamp(3.42rem,4.5vw,5.56rem)}
#aftt-tpl .tint{background:var(--surface)}

#aftt-tpl .eyebrow{
  display:block;
  font:700 1.335rem/1 var(--f-display);letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted);
}
#aftt-tpl .lede{font-size:2.037rem;color:var(--ink-2);line-height:1.68}

/* ---------------------------------------------------------------
   IMAGE SLOTS — every .slot becomes a real <img>. Toggle "Image specs"
   in the sticky nav to see the dimensions and alt text for each one.
   --------------------------------------------------------------- */
#aftt-tpl .slot{
  position:relative;overflow:hidden;background:var(--surface);
  background-image:
    linear-gradient(203deg,rgba(255,125,0,.10),transparent 55%),
    repeating-linear-gradient(169deg,#E0E0E0 0 9%,#CFCFCF 9% 17%,#E9E9E9 17% 26%,#C4C4C4 26% 36%,#DBDBDB 36% 50%,#B5B5B5 50% 64%,#9E9E9E 64% 100%);
}
#aftt-tpl .slot::after{
  content:attr(data-spec);position:absolute;left:10px;bottom:10px;right:10px;
  font:600 11px/1.4 var(--f-body);letter-spacing:.06em;text-transform:uppercase;
  background:rgba(26,26,26,.86);color:#fff;padding:6px 9px;border-radius:3px;
  opacity:0;transition:opacity .18s;pointer-events:none;
}
#aftt-tpl.specs .slot::after{opacity:1}
#aftt-tpl .r-32{aspect-ratio:3/2}
#aftt-tpl .r-43{aspect-ratio:4/3}
#aftt-tpl .r-11{aspect-ratio:1/1}

/* ---------- BREADCRUMB — sits below the hero, above the H1.
     Orange, hovering to black, matching the site's nav link behaviour. ---------- */
#aftt-tpl .crumbs{font-size:1.489rem;font-weight:600;color:var(--orange);line-height:1.5}
#aftt-tpl .crumbs a{color:var(--orange);text-decoration:none}
#aftt-tpl .crumbs a:hover{color:var(--gray)}
#aftt-tpl .crumbs .sep{padding-inline:0.685rem;opacity:.5}
#aftt-tpl .crumbs .here{opacity:.7}
#aftt-tpl .updated{font-size:1.421rem;color:var(--muted)}

/* ---------- FULL-BLEED HERO — no overlay, nothing on top of the photo ---------- */
#aftt-tpl .hero-img{width:100%;aspect-ratio:4/1;background:var(--surface)}
#aftt-tpl .hero-img .slot{width:100%;height:100%;aspect-ratio:auto}
#aftt-tpl .hero-caption{
  padding-block:1.198rem;font-size:1.421rem;color:var(--muted);font-style:italic;
  border-bottom:1px solid var(--line);
}
#aftt-tpl .title-block{padding-block:clamp(2.14rem,3vw,3.21rem) clamp(2.14rem,2.5vw,3.21rem)}
#aftt-tpl .title-block h1{max-width:16ch}

/* ---------- AT-A-GLANCE FACTS (horizontal) ---------- */
#aftt-tpl .facts{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--surface-2)}
/* min() in every track stops a fixed minimum from forcing horizontal scroll
   on narrow phones — the column can always collapse to the container width. */
#aftt-tpl .facts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(158px,100%),1fr))}
#aftt-tpl .fact{padding:2.311rem 2.311rem;border-left:1px solid var(--line)}
#aftt-tpl .fact:first-child{border-left:0;padding-left:0}
#aftt-tpl .fact dt{font:700 1.267rem/1 var(--f-display);letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-bottom:0.942rem}
#aftt-tpl .fact dd{margin:0;font-family:var(--f-display);font-size:1.917rem;font-weight:700;line-height:1.35;letter-spacing:-.01em}

/* ---------- STICKY NAV ---------- */
#aftt-tpl .subnav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
#aftt-tpl .subnav-in{display:flex;gap:0;overflow-x:auto;padding-block:0.942rem;align-items:center;scrollbar-width:thin}
#aftt-tpl .subnav a{
  flex:0 0 auto;font:600 1.489rem/1 var(--f-body);color:var(--muted);text-decoration:none;
  padding:0.942rem 0.257rem;margin-right:1.969rem;white-space:nowrap;transition:color .14s;
  border-bottom:2px solid transparent;
}
#aftt-tpl .subnav a:hover{color:var(--ink)}
#aftt-tpl .subnav a.on{color:var(--ink);border-bottom-color:var(--orange)}
#aftt-tpl .spec-toggle{
  flex:0 0 auto;margin-left:auto;font:700 1.233rem/1 var(--f-body);letter-spacing:.07em;text-transform:uppercase;
  background:transparent;border:1.5px solid var(--line-2);color:var(--muted);
  padding:0.856rem 1.284rem;border-radius:999px;cursor:pointer;transition:.14s;
}
#aftt-tpl .spec-toggle:hover{background:var(--gray);border-color:var(--gray);color:#FFFFFF}
#aftt-tpl.specs .spec-toggle{background:var(--gray);border-color:var(--gray);color:#FFFFFF}

/* ---------- BUTTONS / CHIPS ---------- */
#aftt-tpl .btn{
  display:inline-flex;align-items:center;justify-content:center;gap:0.856rem;
  font-family:var(--f-display);font-weight:700;font-size:1.661rem;
  padding:1.507rem 2.568rem;border-radius:var(--r);border:2px solid transparent;
  text-decoration:none;cursor:pointer;transition:.16s;
}
#aftt-tpl .btn-primary{background:var(--orange);color:#FFFFFF;border-color:var(--orange)}
#aftt-tpl .btn-ghost{background:transparent;color:var(--orange);border-color:var(--orange)}
#aftt-tpl .btn-primary:hover{background:var(--gray);border-color:var(--gray);color:#FFFFFF}
#aftt-tpl .btn-ghost:hover{background:var(--orange);color:#FFFFFF;border-color:var(--orange)}
#aftt-tpl .btn-row{display:flex;flex-wrap:wrap;gap:1.284rem}

#aftt-tpl .chip{
  font:700 1.455rem/1 var(--f-body);padding:0.993rem 1.712rem;border-radius:999px;
  border:1.5px solid var(--line-2);background:var(--paper);color:var(--ink-2);cursor:pointer;transition:.14s;
}
#aftt-tpl .chip:hover{background:var(--gray);border-color:var(--gray);color:#FFFFFF}
#aftt-tpl .chip[aria-pressed="true"]{background:var(--gray);border-color:var(--gray);color:#FFFFFF}

/* ---------- INTRO WITH SIDE PHOTOS ---------- */
#aftt-tpl .intro-split{
  display:grid;gap:clamp(2.996rem,4vw,5.564rem);
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:start;
}
#aftt-tpl .photo-pair{display:grid;grid-template-columns:1fr 1fr;gap:1.712rem}
#aftt-tpl .photo-pair figure{margin:0;display:flex;flex-direction:column;gap:0.856rem}
#aftt-tpl .photo-pair .slot{border-radius:var(--r);aspect-ratio:3/4;transition:transform .35s ease}
#aftt-tpl .photo-pair figure:hover .slot{transform:scale(1.02)}
#aftt-tpl .photo-pair figcaption{font-size:1.404rem;color:var(--muted);line-height:1.4}
/* Below this the text column gets too narrow to read — stack it. */
@media (max-width:860px){
  #aftt-tpl .intro-split{grid-template-columns:1fr}
  #aftt-tpl .photo-pair .slot{aspect-ratio:4/3}
}

/* ---------- ESSENTIAL: FEATURED PHOTO CARDS ---------- */
#aftt-tpl .ess-featured{display:grid;gap:2.739rem;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr))}
#aftt-tpl .ess-featured a{display:flex;flex-direction:column;gap:1.198rem;text-decoration:none;color:inherit}
#aftt-tpl .ess-featured .slot{border-radius:var(--r);aspect-ratio:4/5;transition:transform .35s ease}
#aftt-tpl .ess-featured a:hover .slot{transform:scale(1.02)}
#aftt-tpl .ess-featured a:hover h3{color:var(--gray)}
#aftt-tpl .ess-featured a:hover .been{background:var(--gray)}
#aftt-tpl .ess-featured h3{font-size:1.917rem}
#aftt-tpl .ess-featured p{font-size:1.592rem;color:var(--muted);line-height:1.56}
#aftt-tpl .ess-more{font:700 1.318rem/1 var(--f-display);letter-spacing:.13em;text-transform:uppercase;color:var(--muted);
  padding-top:0.856rem;border-top:1px solid var(--line-2)}

/* ---------- ESSENTIAL [DEST] ---------- */
#aftt-tpl .essential{display:grid;gap:0;counter-reset:x}
#aftt-tpl .essential > .wp-block-group__inner-container > div{
  counter-increment:x;display:grid;grid-template-columns:5.136rem 1fr;gap:2.14rem;
  padding:2.397rem 0;border-top:1px solid var(--line);
}
#aftt-tpl .essential > .wp-block-group__inner-container > div:last-child{border-bottom:1px solid var(--line)}
#aftt-tpl .essential > .wp-block-group__inner-container > div::before{
  content:counter(x,decimal-leading-zero);
  font-family:var(--f-display);font-size:1.798rem;font-weight:800;color:var(--gray-light);padding-top:0.257rem;
}
#aftt-tpl .essential h3{margin-bottom:0.514rem}
#aftt-tpl .essential p{font-size:1.712rem;color:var(--ink-2);line-height:1.65;max-width:74ch}
#aftt-tpl .been{
  display:inline-block;font:700 1.198rem/1 var(--f-body);letter-spacing:.09em;text-transform:uppercase;
  color:#FFFFFF;background:var(--orange);padding:0.514rem 0.856rem;border-radius:3px;
  margin-left:0.856rem;vertical-align:2px;white-space:nowrap;
}

/* ---------- FULL-BLEED PHOTO BAND ---------- */
#aftt-tpl .band{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;background:var(--paper)}
#aftt-tpl .band figure{margin:0;position:relative;overflow:hidden}
#aftt-tpl .band .slot{aspect-ratio:4/3;transition:transform .45s ease}
#aftt-tpl .band figure:hover .slot{transform:scale(1.04)}
#aftt-tpl .band figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:2.568rem 1.541rem 1.37rem;
  font:600 1.472rem/1.35 var(--f-body);color:#fff;
  background:linear-gradient(to top,rgba(26,26,26,.78),transparent);
  opacity:0;transition:opacity .25s;
}
#aftt-tpl .band figure:hover figcaption, #aftt-tpl .band figure:focus-within figcaption{opacity:1}
@media (max-width:760px){#aftt-tpl .band{grid-template-columns:repeat(2,1fr)}}

/* ---------- GUIDE GRID ---------- */
#aftt-tpl .filters{display:flex;flex-wrap:wrap;gap:0.942rem;align-items:center}
#aftt-tpl .filter-label{font:700 1.318rem/1 var(--f-display);letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-right:0.685rem}
#aftt-tpl .result-count{font-size:1.541rem;color:var(--muted);font-weight:600}
#aftt-tpl .guides{display:grid;gap:3.424rem 2.996rem;grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr))}
/* Fixed-count rows (the three "next" hubs) use auto-fit so no empty track opens up. */
#aftt-tpl .guides.three{grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr))}
#aftt-tpl .guide{display:flex;flex-direction:column;gap:1.37rem;text-decoration:none;color:inherit}
#aftt-tpl .guide[hidden]{display:none}
#aftt-tpl .guide .slot{border-radius:var(--r);transition:transform .35s ease}
#aftt-tpl .guide:hover .slot{transform:scale(1.02)}
#aftt-tpl .guide:hover h3{color:var(--gray)}
#aftt-tpl .guide p{font-size:1.626rem;color:var(--muted);line-height:1.6}
#aftt-tpl .terms{display:flex;flex-wrap:wrap;gap:0.599rem}
#aftt-tpl .term{
  font:700 1.267rem/1 var(--f-body);letter-spacing:.04em;padding:0.616rem 0.993rem;border-radius:3px;
  background:var(--surface);color:var(--ink-2);
}
#aftt-tpl .term.pri{background:var(--orange);color:#FFFFFF}
#aftt-tpl .guide:hover .term.pri{background:var(--gray)}
#aftt-tpl .empty{padding:3.424rem 0;color:var(--muted)}

/* ---------- ROUTES (tabs) ---------- */
#aftt-tpl .tabs{display:flex;gap:0.599rem;flex-wrap:wrap;border-bottom:1px solid var(--line);margin-bottom:2.996rem}
#aftt-tpl .tab{
  font:700 1.592rem/1 var(--f-body);background:transparent;border:0;cursor:pointer;
  padding:1.455rem 1.883rem;color:var(--muted);border-bottom:3px solid transparent;margin-bottom:-1px;
}
#aftt-tpl .tab:hover{color:var(--ink)}
#aftt-tpl .tab[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--orange)}
#aftt-tpl .panel[hidden]{display:none}
#aftt-tpl .days{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
#aftt-tpl .day{background:var(--paper);padding:2.14rem 2.397rem;display:grid;grid-template-columns:11.128rem 1fr;gap:2.054rem}
#aftt-tpl .day .d{font:700 1.318rem/1.6 var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:var(--gray-light)}
#aftt-tpl .day h4{margin-bottom:0.428rem}
#aftt-tpl .day p{font-size:1.644rem;color:var(--ink-2);line-height:1.62}

/* ---------- WEATHER ---------- */
#aftt-tpl .chart-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:2.739rem}
#aftt-tpl .scroll-hint{display:none;font-size:1.455rem;color:var(--muted);margin-top:1.198rem}
#aftt-tpl .chart-head{display:flex;justify-content:space-between;align-items:flex-start;gap:2.14rem;flex-wrap:wrap;margin-bottom:1.712rem}
#aftt-tpl .legend{display:flex;gap:2.397rem;flex-wrap:wrap;font-size:1.489rem;font-weight:700;color:var(--ink-2);margin-bottom:1.712rem}
#aftt-tpl .chart-head .legend{margin-bottom:0;flex:1 1 34.24rem}
/* Unit switch. Reads as a pair of filter chips, so it spends no extra orange. */
#aftt-tpl .unit-toggle{display:inline-flex;flex:none;border:1.5px solid var(--line-2);border-radius:999px;overflow:hidden}
#aftt-tpl .unit{
  font:700 1.455rem/1 var(--f-body);padding:0.942rem 1.626rem;border:0;cursor:pointer;transition:.14s;
  background:var(--paper);color:var(--ink-2);
}
#aftt-tpl .unit + .unit{border-left:1.5px solid var(--line-2)}
#aftt-tpl .unit:hover{background:var(--gray);color:#FFFFFF}
#aftt-tpl .unit[aria-pressed="true"]{background:var(--gray);color:#FFFFFF}
#aftt-tpl .legend i{display:inline-block;width:13px;height:13px;border-radius:2px;margin-right:0.77rem;vertical-align:-2px}
#aftt-tpl .seasons{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(215px,100%),1fr));gap:2.054rem;margin-top:2.996rem}
#aftt-tpl .seasons div{border-left:3px solid var(--line-2);padding-left:1.712rem}
#aftt-tpl .seasons div.pick{border-left-color:var(--orange)}
#aftt-tpl .seasons h4{margin-bottom:0.479rem}
#aftt-tpl .seasons p{font-size:1.592rem;color:var(--muted);line-height:1.6}

/* ---------- WHERE TO STAY ---------- */
#aftt-tpl .stay{display:grid;gap:2.568rem;grid-template-columns:repeat(auto-fit,minmax(min(255px,100%),1fr))}
#aftt-tpl .stay article{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column}
#aftt-tpl .stay .slot{aspect-ratio:16/9}
#aftt-tpl .stay .body{padding:2.311rem;display:flex;flex-direction:column;gap:0.942rem}
#aftt-tpl .stay ul{margin:0.428rem 0 0;padding-left:1.798rem;font-size:1.592rem;color:var(--ink-2);line-height:1.65}
#aftt-tpl .points{
  background:var(--ink);color:#fff;border-radius:var(--r);padding:clamp(2.568rem,3vw,3.852rem);
  display:grid;gap:2.568rem;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));align-items:center;
}
#aftt-tpl .points h3{color:#fff;font-size:2.568rem}
#aftt-tpl .points p{color:rgba(255,255,255,.82);font-size:1.712rem}
#aftt-tpl .points .eyebrow{color:var(--orange)}
#aftt-tpl .points ul{list-style:none;margin:0;padding:0;display:grid;gap:1.027rem;font-size:1.661rem}
#aftt-tpl .points li{display:grid;grid-template-columns:2.226rem 1fr;gap:0.856rem;color:rgba(255,255,255,.9)}
#aftt-tpl .points li::before{content:"→";color:var(--orange);font-weight:700}

/* ---------- FAQ ---------- */
#aftt-tpl .faq details{border-bottom:1px solid var(--line)}
#aftt-tpl .faq details:first-of-type{border-top:1px solid var(--line)}
#aftt-tpl .faq summary{
  cursor:pointer;list-style:none;padding:2.054rem 4.708rem 2.054rem 0;position:relative;
  font-family:var(--f-display);font-weight:700;font-size:1.883rem;line-height:1.35;
}
#aftt-tpl .faq summary::-webkit-details-marker{display:none}
/* The +/− is centred on one point with margin offsets rather than fixed `top`
   values, so it stays aligned at any font size and on multi-line questions. */
#aftt-tpl .faq summary::after{content:"";position:absolute;right:8px;top:2.654rem;margin-top:-1px;width:14px;height:2px;background:var(--gray-light)}
#aftt-tpl .faq summary::before{content:"";position:absolute;right:14px;top:2.654rem;margin-top:-7px;width:2px;height:14px;background:var(--gray-light);transition:transform .22s}
#aftt-tpl .faq details[open] summary::before{transform:scaleY(0)}
#aftt-tpl .faq summary:hover{color:var(--gray)}
#aftt-tpl .faq .a{padding:0 4.708rem 2.397rem 0;color:var(--ink-2);font-size:1.712rem;max-width:72ch}

/* ---------- OPT-IN ---------- */
#aftt-tpl .optin{background:var(--surface);border-radius:var(--r);padding:clamp(2.996rem,4vw,4.708rem)}
#aftt-tpl .optin-grid{display:grid;gap:3.852rem;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));align-items:center}
#aftt-tpl .form{display:flex;flex-direction:column;gap:1.198rem;max-width:400px}
#aftt-tpl .form input{
  font-family:var(--f-body);font-size:1.712rem;padding:1.455rem 1.712rem;border-radius:var(--r);
  border:1.5px solid var(--line-2);background:var(--paper);color:var(--ink);
}
#aftt-tpl .form input:focus{border-color:var(--orange);outline:none}
#aftt-tpl .form .fine{font-size:1.37rem;color:var(--muted);line-height:1.5}
#aftt-tpl .checklist{list-style:none;margin:0.514rem 0 0;padding:0;display:grid;gap:1.027rem;font-size:1.695rem}
#aftt-tpl .checklist li{display:grid;grid-template-columns:2.226rem 1fr;gap:0.856rem;color:var(--ink-2)}
#aftt-tpl .checklist li::before{content:"✓";color:var(--gray);font-weight:700}

/* ---------- MAP + NEXT ---------- */
#aftt-tpl .map{aspect-ratio:16/8;border:1px solid var(--line);border-radius:var(--r);
  background:radial-gradient(circle at 33% 38%,rgba(255,125,0,.13),transparent 44%),
             radial-gradient(circle at 68% 62%,rgba(26,26,26,.06),transparent 46%),var(--surface);
  display:grid;place-items:center;text-align:center;padding:3.424rem;color:var(--muted);font-size:1.592rem}
/* "Where to go next" reuses .guides / .guide — same tile, four more photo slots. */

/* ============================== MOBILE ==============================
   A caption that only appears on hover is invisible on a touch screen,
   so the photo-band captions are always shown where there is no pointer. */
@media (max-width:900px){
  #aftt-tpl .wrap{width:min(100% - 3.424rem,var(--wrap))}
}

@media (max-width:640px){
  #aftt-tpl{font-size:1.935rem}
  #aftt-tpl .hero-img{aspect-ratio:2/1}
  #aftt-tpl .title-block{padding-block:2.14rem 1.99rem}
  #aftt-tpl .section{padding-block:3.21rem}

  /* Five facts read better stacked than crammed two-up */
  #aftt-tpl .facts-grid{grid-template-columns:1fr}
  #aftt-tpl .fact{border-left:0;border-top:1px solid var(--line);padding:1.883rem 0}
  #aftt-tpl .fact:first-child{border-top:0}

  #aftt-tpl .day{grid-template-columns:1fr;gap:0.514rem}
  #aftt-tpl .essential > .wp-block-group__inner-container > div{grid-template-columns:3.766rem 1fr;gap:1.455rem}

  /* Touch targets: everything tappable clears ~44px */
  #aftt-tpl .subnav a{padding:1.233rem 0.257rem;margin-right:2.397rem}
  #aftt-tpl .chip{padding:1.233rem 1.798rem}
  #aftt-tpl .btn{width:100%;padding:1.712rem 2.397rem}
  #aftt-tpl .btn-row{gap:1.113rem}
  #aftt-tpl .faq summary{padding:2.226rem 4.109rem 2.226rem 0}

  /* Reclaim the padding these were spending on a phone */
  #aftt-tpl .chart-card{padding:1.883rem}
  #aftt-tpl .points{padding:2.397rem}
  #aftt-tpl .optin{padding:2.397rem}
  #aftt-tpl .guides{gap:3.424rem 2.14rem}

  /* A full-width 4:5 portrait is ~490px tall on a phone — four of them is a
     very long scroll. Landscape keeps the photo substantial and scannable. */
  #aftt-tpl .ess-featured .slot{aspect-ratio:3/2}

  /* The chart scrolls sideways in its own container; say so. */
  #aftt-tpl .scroll-hint{display:block}
}

@media (max-width:380px){
  /* Two portraits side by side stop being readable below this */
  #aftt-tpl .photo-pair{grid-template-columns:1fr}
  #aftt-tpl .photo-pair .slot{aspect-ratio:4/3}
}

@media (prefers-reduced-motion:reduce){#aftt-tpl *{transition-duration:.01ms !important;scroll-behavior:auto !important}}


/* Wrapper resets: the template no longer styles <body>, so it isolates itself here. */
#aftt-tpl{box-sizing:border-box;max-width:100%}
#aftt-tpl *{box-sizing:border-box}
#aftt-tpl p{margin:0}
#aftt-tpl img{display:block;max-width:100%}

/* The theme declares body,p{font-family;color} directly. A direct rule on an
   element always beats an inherited value, however specific the ancestor, so
   these have to be restated inside the scope rather than left to inherit. */
#aftt-tpl p,#aftt-tpl li,#aftt-tpl dd,#aftt-tpl dt,#aftt-tpl span,#aftt-tpl a,#aftt-tpl summary,
#aftt-tpl figcaption,#aftt-tpl label,#aftt-tpl input,#aftt-tpl button,#aftt-tpl td,#aftt-tpl th,#aftt-tpl div,#aftt-tpl ol,#aftt-tpl ul,#aftt-tpl blockquote{font-family:var(--f-body)}
#aftt-tpl h1,#aftt-tpl h2,#aftt-tpl h3,#aftt-tpl h4{font-family:var(--f-display)}
#aftt-tpl p,#aftt-tpl li,#aftt-tpl dd,#aftt-tpl dt{color:inherit;line-height:inherit}

/* ---------------------------------------------------------------
   ADDITIVE PATCH — native-blocks full page pattern compatibility.
   Everything above this line is unchanged from the original scoped
   stylesheet; everything below fills gaps the block editor's markup
   exposes that the original static mockup never needed.
   --------------------------------------------------------------- */

/* Real WordPress <img> tags now sit inside every .slot figure (the
   mockup only ever showed a placeholder background on a bare div). */
#aftt-tpl .slot img{width:100%;height:100%;object-fit:cover;display:block}

/* The hero image block carries "hero-img-slot" (wrapper + slot collapsed
   into one <figure> by the block editor, instead of the mockup's nested
   divs), so it needs its own sizing rule mirroring .hero-img. */
#aftt-tpl .hero-img-slot{width:100%;aspect-ratio:4/1;background:var(--surface)}
@media (max-width:640px){
  #aftt-tpl .hero-img-slot{aspect-ratio:2/1}
}

/* The facts strip uses paragraph blocks (fact-label / fact-value) since
   Group blocks can't emit literal <dl>/<dt>/<dd> — same look as .fact dt/dd. */
#aftt-tpl .fact-label{font:700 1.267rem/1 var(--f-display);letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-bottom:0.942rem}
#aftt-tpl .fact-value{margin:0;font-family:var(--f-display);font-size:1.917rem;font-weight:700;line-height:1.35;letter-spacing:-.01em}

/* Where-to-stay cards are Group blocks (className "stay-card") rather than
   <article> — .stay .slot and .stay .body already match through nesting,
   only the card chrome itself needs restating. */
#aftt-tpl .stay-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column}

/* WordPress's "ink-2" text-color slug has no theme.json palette entry to
   resolve against, so has-ink-2-color does nothing without this rule. */
#aftt-tpl .has-ink-2-color{color:var(--ink-2)}

/* The Query Loop's own <ul class="wp-block-post-template guides"> renders
   each post as a plain <li> rather than the hand-authored <a class="guide">
   card, so it needs the same flex-column stacking restated on the <li>. */
#aftt-tpl .wp-block-post-template.guides{list-style:none;margin:0;padding:0}
#aftt-tpl .wp-block-post-template.guides > li{display:flex;flex-direction:column;gap:1.37rem}
#aftt-tpl .wp-block-post-template.guides .wp-block-post-featured-image{margin:0}
#aftt-tpl .wp-block-post-template.guides .wp-block-post-featured-image a{display:block}

#aftt-tpl .wp-block-group__inner-container{display:contents}

#aftt-tpl .essential > .wp-block-group__inner-container > div::before{grid-row:1/-1}
#aftt-tpl .essential h3,#aftt-tpl .essential p{grid-column:2}

#aftt-tpl .day .d{grid-column:1;grid-row:1/-1}
#aftt-tpl .day h4,#aftt-tpl .day p:not(.d){grid-column:2}

/* Guide invitation band (between the intro and the photo band, same on every hub) */
#aftt-tpl .invite{background:var(--surface);padding:clamp(2.8rem,5vw,4.4rem) 0;text-align:center}
#aftt-tpl .invite .eyebrow{margin:0 0 .7rem}
#aftt-tpl .invite h2{margin:0 auto .6rem;max-width:24ch}
#aftt-tpl .invite .invite-p{margin:0 auto;max-width:48ch;font-size:clamp(1.8rem,2vw,2rem);color:var(--ink-2)}

/* Embeds fit their column (Google My Maps code carries a fixed width="800") */
#aftt-tpl iframe{max-width:100%}
#aftt-tpl .map-embed iframe{display:block;width:100%;border:0}


/* "AftT tested" pill on route titles (2026-10-15) */
.tested{display:inline-flex;align-items:center;height:22px;padding:0 10px;margin-left:8px;border-radius:999px;box-shadow:inset 0 0 0 1.5px #ff7d00;color:#ff7d00;font-family:'Cabin',sans-serif;font-weight:600;font-size:12px;line-height:1;letter-spacing:.04em;text-transform:none;white-space:nowrap;vertical-align:middle;position:relative;top:-1px}

/* 2026-10-30 Carrick: every photo caption italic, site-wide */
#aftt-tpl figcaption,#aftt-tpl .wp-block-image figcaption,#aftt-tpl .slot figcaption{font-style:italic!important}