/** Shopify CDN: Minification failed

Line 777:24 Unexpected ";"

**/
/* ═══════════════════════════════════════════════════════════════════
   THE POSTMARK SYSTEM — Matrix Forex travel guides
   Generated by build_css.py from the prototype stylesheets. Edit the
   prototype and re-run rather than patching this file by hand.
   Sources: postmark.css, country.css, hub.css, footer.css, plus the
   inline <style> blocks in japan.html and japan-tohoku.html.
   ═══════════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════════════
   THE POSTMARK SYSTEM — Matrix Forex travel guides
   Prototype stylesheet. Tokens mirror assets/theme.css so this ports
   to Liquid without a redesign of the design system.
   ═══════════════════════════════════════════════════════════════════════ */


/* Postmark tokens. Everything the theme already defines (--g, --gd, --ink,
   --cream, --H, --B, --max, --r ...) is deliberately NOT redeclared here —
   assets/theme.css stays the single source of truth. Scoped to .tg so the
   travel guides cannot leak paper colours into the rest of the store. */
.tg{
  --paper:#f4f1e4;        /* card stock, lighter than page cream */
  --paper-edge:#ded8c2;   /* deckled edge / rule colour */
  --frank:#9a4b33;        /* franking ink — oxblood, postmarks only */
  --ease:cubic-bezier(.2,.7,.2,1);
  --S:'Yellowtail',cursive;   /* the "Greetings from" flourish */
}


.tg{
  background:var(--cream); color:var(--ink);
  font-family:var(--B); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

/* paper grain — pure CSS, zero extra requests */
.grain{position:relative}
.grain::after{
  content:''; position:absolute; inset:0; pointer-events:none; z-index:2;
  opacity:.22; mix-blend-mode:multiply; border-radius:inherit;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}

.pm-wrap{max-width:var(--max); margin:0 auto; padding:0 24px}
.pm-wrap--narrow{max-width:860px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ── type ─────────────────────────────────────────────────────────────── */
.eyebrow{
  font-family:var(--H); font-weight:700; font-size:13px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--gm); display:inline-block; margin-bottom:14px;
}
.eyebrow--light{color:var(--g)}
.tg h1,.tg h2,.tg h3{font-family:var(--H); font-weight:800; line-height:1.03;
  letter-spacing:-.01em; margin:0; text-transform:none}
.h-xl{font-size:clamp(40px,6vw,76px); text-transform:uppercase; font-weight:900; letter-spacing:-.02em}
.h-lg{font-size:clamp(30px,4vw,50px); text-transform:uppercase; font-weight:900}
.h-md{font-size:clamp(22px,2.4vw,32px)}
.lede{font-size:clamp(16px,1.5vw,19px); line-height:1.7; color:var(--g5); max-width:62ch}
.pm-acc{color:var(--gm)}

/* ── buttons ──────────────────────────────────────────────────────────── */
.btn{
  display:inline-flex; align-items:center; gap:8px; text-decoration:none;
  font-family:var(--H); font-weight:700; font-size:15px; letter-spacing:.05em;
  text-transform:uppercase; padding:13px 24px; border-radius:50px;
  border:1.5px solid transparent; cursor:pointer; transition:.2s var(--ease);
}
.pm-btn-g{background:var(--g); color:var(--gd)}
.pm-btn-g:hover{background:var(--wht); transform:translateY(-2px)}
.pm-btn-out{border-color:rgba(255,255,255,.28); color:var(--wht)}
.pm-btn-out:hover{border-color:var(--g); background:rgba(2,227,117,.12)}
.btn-dark{background:var(--gd); color:var(--g)}
.btn-dark:hover{transform:translateY(-2px)}

/* ═══════════════════════════════════════════════════════════════════════
   THE POSTCARD — full-bleed, the photo IS the card. Practical copy lives
   in a caption below the card so the object itself stays uncluttered.
   ═══════════════════════════════════════════════════════════════════════ */
.pc{position:relative; min-width:0; display:flex; flex-direction:column; gap:16px; text-decoration:none}

.pc__card{
  position:relative; background:var(--paper); padding:9px; border-radius:5px;
  box-shadow:0 1px 2px rgba(0,52,27,.12), 0 12px 30px -14px rgba(0,52,27,.34);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease);
  transform-origin:50% 85%;
}
.pc:hover .pc__card,.pc:focus-visible .pc__card{
  transform:translateY(-9px) rotate(-1.2deg);
  box-shadow:0 2px 5px rgba(0,52,27,.14), 0 38px 64px -24px rgba(0,52,27,.46);
}
.pc:focus-visible{outline:none}
.pc:focus-visible .pc__card{outline:2.5px solid var(--gm); outline-offset:4px}

.pc__photo{position:relative; overflow:hidden; border-radius:2px; aspect-ratio:3/2; background:var(--gd)}
.pc__photo img{
  width:100%; height:100%; object-fit:cover;
  /* warm film grade — keeps colour but pulls 13 unrelated photos into one voice */
  filter:saturate(1.06) contrast(1.05) sepia(.08) brightness(1.04);
  transition:filter .55s var(--ease), transform .8s var(--ease);
}
.pc:hover .pc__photo img{filter:saturate(1.16) contrast(1.03) sepia(0) brightness(1.06); transform:scale(1.045)}

/* legibility scrim — the top third of a photo is where the lettering sits */
.pc__scrim{
  position:absolute; inset:0; z-index:1; border-radius:2px;
  background:
    linear-gradient(180deg, rgba(12,26,16,.52) 0%, rgba(12,26,16,.14) 40%, rgba(12,26,16,0) 64%),
    linear-gradient(0deg, rgba(12,26,16,.34) 0%, rgba(12,26,16,0) 28%);
}
/* aged paper cast, ties every card to the same stock */
.pc__photo::after{
  content:''; position:absolute; inset:0; z-index:2; pointer-events:none; border-radius:2px;
  background:
    radial-gradient(90% 70% at 50% 38%, rgba(255,206,128,.20) 0%, rgba(255,196,110,0) 68%),
    radial-gradient(125% 95% at 50% 45%, rgba(60,34,10,0) 55%, rgba(60,34,10,.22) 100%);
  mix-blend-mode:soft-light;
}

/* ── the lettering ── */
.pc__greet{position:absolute; z-index:4; left:20px; top:15px; right:96px}
.pc__hi{
  display:block; font-family:var(--S); font-size:17px; color:rgba(255,255,255,.9);
  line-height:1; margin-bottom:1px; transform:rotate(-2deg); transform-origin:0 50%;
  text-shadow:0 2px 8px rgba(0,20,10,.6);
}
.pc__name{
  font-family:var(--S); font-weight:400; font-size:clamp(30px,3.4vw,42px); line-height:.94;
  color:var(--wht); letter-spacing:-.005em; margin:0;
  text-shadow:0 3px 14px rgba(0,20,10,.55), 0 1px 2px rgba(0,20,10,.4);
}
.pc__sub{
  display:block; margin-top:7px; font-family:var(--H); font-weight:700; font-size:11px;
  letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.88);
  text-shadow:0 1px 6px rgba(0,20,10,.7);
}

/* ── stamp ── */
.pc__stamp{
  position:absolute; top:14px; right:14px; z-index:8;
  width:56px; height:66px; background:var(--paper);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:1px; padding:5px 3px; text-align:center;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.42));
  --pr:3.1px; --ps:8.2px;
  -webkit-mask:
    radial-gradient(var(--pr) at 50% 0,   #0000 97%, #000) 0 0 / var(--ps) 100%,
    radial-gradient(var(--pr) at 50% 100%,#0000 97%, #000) 0 0 / var(--ps) 100%,
    radial-gradient(var(--pr) at 0 50%,   #0000 97%, #000) 0 0 / 100% var(--ps),
    radial-gradient(var(--pr) at 100% 50%,#0000 97%, #000) 0 0 / 100% var(--ps);
  -webkit-mask-composite:source-in;
  mask:
    radial-gradient(var(--pr) at 50% 0,   #0000 97%, #000) 0 0 / var(--ps) 100%,
    radial-gradient(var(--pr) at 50% 100%,#0000 97%, #000) 0 0 / var(--ps) 100%,
    radial-gradient(var(--pr) at 0 50%,   #0000 97%, #000) 0 0 / 100% var(--ps),
    radial-gradient(var(--pr) at 100% 50%,#0000 97%, #000) 0 0 / 100% var(--ps);
  mask-composite:intersect;
}
.pc__stamp b{font-family:var(--H); font-weight:900; font-size:23px; line-height:1; color:var(--gd)}
.pc__stamp i{display:block; width:17px; height:1px; background:var(--paper-edge); margin:2px 0 1px}
.pc__stamp span{font-family:var(--H); font-weight:700; font-size:9px; letter-spacing:.12em; color:var(--gm)}

/* ── postmark + wavy cancellation lines ── */
.pc__cancel{
  position:absolute; top:4px; right:2px; z-index:6; width:172px; height:90px;
  opacity:.62; pointer-events:none;
}
.pc__cancel .ring{fill:none; stroke:var(--frank); stroke-width:1.7}
.pc__cancel .hair{fill:none; stroke:var(--frank); stroke-width:1.1}
.pc__cancel .wave{fill:none; stroke:var(--frank); stroke-width:1.3; stroke-linecap:round; opacity:.85}
.pc__cancel text{fill:var(--frank); font-family:var(--H); font-weight:700}

/* ── bottom-left tab: the one fact worth stamping on the card ── */
.pc__badge{
  position:absolute; left:14px; bottom:14px; z-index:5; max-width:60%;
  background:rgba(246,243,232,.94); padding:8px 12px; text-align:center;
  --pr:2.6px; --ps:7.4px;
  -webkit-mask:
    radial-gradient(var(--pr) at 50% 0,   #0000 97%, #000) 0 0 / var(--ps) 100%,
    radial-gradient(var(--pr) at 50% 100%,#0000 97%, #000) 0 0 / var(--ps) 100%;
  -webkit-mask-composite:source-in;
  mask:
    radial-gradient(var(--pr) at 50% 0,   #0000 97%, #000) 0 0 / var(--ps) 100%,
    radial-gradient(var(--pr) at 50% 100%,#0000 97%, #000) 0 0 / var(--ps) 100%;
  mask-composite:intersect;
}
.pc__badge b{
  display:block; font-family:var(--H); font-weight:900; font-size:13.5px; line-height:1.1;
  letter-spacing:.03em; text-transform:uppercase; color:var(--frank);
}
.pc__badge span{
  display:block; font-family:var(--H); font-weight:600; font-size:9.5px; letter-spacing:.13em;
  text-transform:uppercase; color:var(--g5); margin-top:2px;
}

/* ── caption below the card ── */
.pc__cap{display:flex; flex-direction:column; gap:9px; padding:0 3px; flex:1}
.pc__blurb{font-size:14.5px; line-height:1.6; color:var(--g5); margin:0; flex:1}
.pc__meta{
  display:flex; gap:8px; flex-wrap:wrap; padding-top:11px;
  border-top:1px solid var(--paper-edge); font-size:12px; color:var(--g4);
}
.pc__meta b{color:var(--g5); font-weight:700}
.pc__go{
  font-family:var(--H); font-weight:800; font-size:14px; letter-spacing:.07em;
  text-transform:uppercase; color:var(--gm); display:inline-flex; align-items:center; gap:7px;
}
.pc:hover .pc__go{gap:11px}
.pc__go svg{transition:transform .25s var(--ease)}
.pc:hover .pc__go svg{transform:translateX(3px)}

/* ═══════════════════════════════════════════════════════════════════════
   REGION MAP
   ═══════════════════════════════════════════════════════════════════════ */
.map{display:grid; grid-template-columns:minmax(0,1fr) 420px; gap:40px; align-items:start}
.map__stage{position:relative}
.map svg.jp{width:100%; max-width:560px; height:auto; display:block; margin:0 auto; overflow:visible}
.jp .rg{
  fill:#123f28; stroke:var(--cream); stroke-width:2.2; stroke-linejoin:round;
  cursor:pointer; transition:fill .22s var(--ease), transform .22s var(--ease);
  transform-origin:center; transform-box:fill-box;
}
.jp .rg:hover{fill:var(--gm)}
.jp .rg.is-on{fill:var(--g)}
/* a region only takes a pointer cursor once its guide is actually published */
.jp .rg{cursor:default}
.jp .rg.is-live{cursor:pointer}
.jp .pin circle{fill:var(--frank); stroke:var(--cream); stroke-width:1.6; transition:r .2s var(--ease), fill .2s}
.jp .pin.is-on circle{r:6; fill:var(--gm)}
.jp .pin.is-on text{fill:var(--gd); font-weight:700}
.jp .pin text{font-family:var(--B); font-weight:500; font-size:12.5px; fill:var(--g5);
  paint-order:stroke; stroke:var(--cream); stroke-width:3.4; dominant-baseline:middle}
.jp .pin--left   text{text-anchor:end;   transform:translate(-7px,0)}
.jp .pin--right  text{text-anchor:start; transform:translate(7px,0)}
.jp .pin--bottom text{text-anchor:middle;transform:translate(0,14px)}
.jp .hit{fill:transparent; stroke:none; cursor:pointer}
.jp .hit:focus-visible{outline:none}
.jp .hit:focus-visible + .rg,
.jp .rg:focus-visible{stroke:var(--gd); stroke-width:3.4}
.jp .lbl{
  font-family:var(--H); font-weight:700; font-size:15px; fill:var(--gd);
  pointer-events:none; paint-order:stroke; stroke:var(--cream); stroke-width:3.5;
  opacity:.9; transition:opacity .2s;
}
.jp .lbl.is-on{fill:var(--gd); opacity:1}
.jp .inset{fill:none; stroke:var(--g4); stroke-width:1.2; stroke-dasharray:5 4; opacity:.5}
.jp .inset-lbl{font-family:var(--H); font-weight:600; font-size:11px; letter-spacing:.14em; fill:var(--g4)}

/* ── status pills ── */
.pill{
  display:inline-block;
  font-family:var(--H); font-weight:700; font-size:11.5px; letter-spacing:.1em;
  text-transform:uppercase; padding:6px 12px; border-radius:50px; white-space:nowrap;
}
.pill--cost {background:var(--gl);  color:var(--gd)}
.pill--card {background:var(--gl);  color:var(--gd)}
.pill--cash {background:#f6ecd9;    color:#7a5216}
.pill--mixed{background:#eeeadb;    color:var(--g5)}
.pill--when {background:#eeead9;    color:var(--g5)}

/* ── floating region card ── */
.map__panel{position:static}
.rc{
  display:block; background:var(--paper); border:1px solid var(--paper-edge);
  border-radius:6px; overflow:hidden; text-decoration:none; color:inherit;
  box-shadow:0 2px 6px rgba(0,52,27,.06), 0 20px 44px -22px rgba(0,52,27,.30);
}
a.rc.is-live{transition:transform .25s var(--ease), box-shadow .25s var(--ease)}
a.rc.is-live:hover{transform:translateY(-3px); box-shadow:0 3px 8px rgba(0,52,27,.08), 0 30px 56px -22px rgba(0,52,27,.40)}
a.rc.is-live:focus-visible{outline:2.5px solid var(--gm); outline-offset:3px}

.rc__art{position:relative; background:var(--gd); aspect-ratio:16/9; overflow:hidden;
  display:flex; align-items:center; justify-content:center}
.rc__art img{width:100%; height:100%; object-fit:cover;
  filter:saturate(1.06) contrast(1.05) sepia(.08) brightness(1.04)}
/* fallback art: the region's own outline, so the card is never wrong about itself */
.rc__shape{width:66%; height:66%; overflow:visible}
.rc__shape path{fill:var(--g); opacity:.92}
.rc__art::after{content:''; position:absolute; inset:0;
  background:radial-gradient(80% 70% at 50% 40%, rgba(2,227,117,.10), rgba(0,0,0,.24))}

.rc__flag{
  position:absolute; z-index:2; left:12px; bottom:12px;
  font-family:var(--H); font-weight:700; font-size:10.5px; letter-spacing:.14em;
  text-transform:uppercase; padding:5px 10px; border-radius:50px;
  background:rgba(246,243,232,.9); color:var(--g5);
}
.rc__flag--live{background:var(--g); color:var(--gd)}

.rc__body{padding:20px 22px 22px}
.rc__kana{font-size:12.5px; color:var(--g4); letter-spacing:.2em; margin:0 0 2px}
.rc__name{font-family:var(--H); font-weight:900; font-size:34px; text-transform:uppercase;
  color:var(--gd); line-height:1; margin:0 0 6px}
.rc__tag{font-size:14.5px; line-height:1.5; color:var(--g5); margin:0 0 14px}
.rc__prefs{font-size:12.5px; line-height:1.55; color:var(--g4); margin:0 0 14px;
  padding-bottom:14px; border-bottom:1px solid var(--paper-edge)}
.rc__prefs span{display:block; font-family:var(--H); font-weight:700; font-size:10.5px;
  letter-spacing:.16em; text-transform:uppercase; color:var(--gm); margin-bottom:3px}
.rc__pills{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px}
.rc__note{font-size:13.5px; line-height:1.6; color:var(--g5); margin:0 0 14px}
.rc__cta{font-family:var(--H); font-weight:800; font-size:14px; letter-spacing:.06em;
  text-transform:uppercase; color:var(--gm); display:inline-flex; align-items:center; gap:7px}
.rc__cta--off{color:var(--g4); font-weight:700}
a.rc.is-live:hover .rc__cta{gap:11px}

/* every region is rendered server-side; JS only toggles visibility */
.rgn[hidden],.rc[hidden]{display:none}
.map__all{margin-top:20px}
.map__hint{font-size:13px; color:var(--g4); margin:14px 0 0; text-align:center}

/* ═══════════════════════════════════════════════════════════════════════
   IMAGE SLOT — one component, every image on the guides goes through it.
   Contract: the slot reserves its space from the ratio, so an empty slot and
   a filled slot occupy identical layout. Adding a photo can never reflow
   the page. Every slot is optional and degrades to a designed empty state.
   ═══════════════════════════════════════════════════════════════════════ */
.slot{position:relative; overflow:hidden; background:var(--gd); border-radius:4px}
.slot--wide  {aspect-ratio:21/9}
.slot--band  {aspect-ratio:16/9}
.slot--card  {aspect-ratio:3/2}
.slot--tall  {aspect-ratio:4/5}
.slot img{
  width:100%; height:100%; object-fit:cover; display:block;
  object-position:var(--focal,center);
  filter:saturate(1.06) contrast(1.05) sepia(.08) brightness(1.04);
}
/* warm cast — the same grade as the postcards, so mixed sources still cohere */
.slot::after{content:''; position:absolute; inset:0; pointer-events:none; mix-blend-mode:soft-light;
  background:radial-gradient(80% 70% at 50% 38%, rgba(255,206,128,.18) 0%, rgba(255,196,110,0) 70%)}

/* empty state: not a broken image, a deliberate placeholder holding the space */
.slot--empty{background:linear-gradient(160deg,#123f28,#0a2616)}
.slot--empty::before{
  content:attr(data-empty); position:absolute; inset:0; display:flex;
  align-items:center; justify-content:center; text-align:center; padding:16px;
  font-family:var(--H); font-weight:700; font-size:11.5px; letter-spacing:.16em;
  text-transform:uppercase; color:rgba(255,255,255,.30);
}
.slot__credit{
  position:absolute; z-index:2; right:0; bottom:0; left:0; padding:18px 10px 6px;
  font-size:10px; letter-spacing:.04em; color:rgba(255,255,255,.8); text-align:right;
  /* scrim — a bare text-shadow disappears over a bright, busy photo */
  background:linear-gradient(0deg, rgba(0,0,0,.55), rgba(0,0,0,0));
}
/* inline figures caption their credit instead of overlaying it */
.fig .slot__credit{display:none}
.fig figcaption i{font-style:normal; color:var(--g3); display:block; margin-top:3px; font-size:11.5px}

/* ═══════════════════════════════════════════════════════════════════════
   CITY CARDS — the "where to go" layer. Portrait-leaning and stamp-marked
   so they never read as the landscape postcards. auto-fit means a country
   can carry 4 or 8 without touching the CSS.
   ═══════════════════════════════════════════════════════════════════════ */
.cities{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:22px; margin-top:36px}
.city{
  display:flex; flex-direction:column; background:var(--paper); border:1px solid var(--paper-edge);
  border-radius:5px; overflow:hidden; text-decoration:none; color:inherit;
  box-shadow:0 1px 2px rgba(0,52,27,.06), 0 12px 28px -18px rgba(0,52,27,.28);
  transition:transform .28s var(--ease), box-shadow .28s var(--ease), border-color .28s;
}
a.city:hover{transform:translateY(-5px); border-color:rgba(2,227,117,.45);
  box-shadow:0 2px 5px rgba(0,52,27,.09), 0 30px 54px -22px rgba(0,52,27,.40)}
a.city:focus-visible{outline:2.5px solid var(--gm); outline-offset:3px}

.city__art{position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--gd)}
.city__art img{width:100%; height:100%; object-fit:cover;
  filter:saturate(1.06) contrast(1.05) sepia(.08) brightness(1.02); transition:transform .6s var(--ease)}
a.city:hover .city__art img{transform:scale(1.045)}
.city__art .slot__credit{display:none}
.city__art--empty{background:linear-gradient(160deg,#123f28,#0a2616)}
.city__art--empty::before{content:attr(data-empty); position:absolute; inset:0; display:flex;
  align-items:center; justify-content:center; font-family:var(--H); font-weight:700;
  font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.28)}
.city__art::after{content:''; position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(8,26,16,.55) 0%, rgba(8,26,16,0) 45%)}

/* the region stamp doubles as the bridge back to the map below */
.city__stamp{
  position:absolute; z-index:2; top:12px; right:12px; transform:rotate(-7deg);
  border:1.5px solid rgba(246,243,232,.85); border-radius:2px; padding:4px 9px;
  font-family:var(--H); font-weight:800; font-size:10.5px; letter-spacing:.18em;
  text-transform:uppercase; color:rgba(246,243,232,.92);
  background:rgba(10,30,18,.32); backdrop-filter:blur(2px);
}
.city__name{
  position:absolute; z-index:2; left:16px; bottom:12px; margin:0;
  font-family:var(--H); font-weight:900; font-size:34px; line-height:1;
  text-transform:uppercase; color:var(--wht); text-shadow:0 2px 12px rgba(0,20,10,.6);
}

.city__body{padding:18px 20px 20px; display:flex; flex-direction:column; gap:11px; flex:1}
.city__hook{margin:0; font-family:var(--H); font-weight:700; font-size:17px; color:var(--gd); line-height:1.22}
.city__known{margin:0; font-size:13.5px; line-height:1.6; color:var(--g5)}
.city__stats{display:flex; gap:8px; flex-wrap:wrap; padding-top:12px; border-top:1px solid var(--paper-edge)}
.city__stat{display:flex; flex-direction:column; gap:1px}
.city__stat span{font-family:var(--H); font-weight:700; font-size:10px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--g4)}
.city__stat b{font-family:var(--H); font-weight:800; font-size:16px; color:var(--gd)}
.city__stat + .city__stat{margin-left:auto; text-align:right}
.city__money{margin:0; font-size:13px; line-height:1.6; color:var(--g5);
  padding:11px 13px; background:var(--gl); border-radius:4px}
.city__money b{color:var(--gd)}
/* remittance hook — only rendered where it is genuinely true */
.city__uni{margin:0; font-size:12.5px; line-height:1.55; color:var(--g5);
  padding:11px 13px; background:#f4efe0; border-radius:4px; border-left:2.5px solid var(--frank)}
.city__uni b{display:block; font-family:var(--H); font-weight:800; font-size:11px;
  letter-spacing:.14em; text-transform:uppercase; color:var(--frank); margin-bottom:3px}
.city__go{margin-top:auto; padding-top:4px; font-family:var(--H); font-weight:800; font-size:13.5px;
  letter-spacing:.06em; text-transform:uppercase; color:var(--gm); display:inline-flex; align-items:center; gap:7px}
.city__go--off{color:var(--g4); font-weight:700}
.city__credit{margin:10px 0 0; font-size:10.5px; line-height:1.4; color:var(--g3); letter-spacing:.02em}

/* ── inline figure inside long-form prose ── */
.fig{margin:26px 0 28px}
.fig .slot{border-radius:5px}
.fig figcaption{margin-top:9px; font-size:12.5px; line-height:1.55; color:var(--g4)}
.fig figcaption b{display:block; color:var(--g5); font-weight:600; margin-bottom:1px}
/* breakout: pushes past the measure for emphasis, clamped so it never overflows */
.fig--wide{margin-left:min(-90px,0px); margin-right:min(-90px,0px)}
@media(max-width:900px){.fig--wide{margin-left:0; margin-right:0}}

/* ── data tables (shared: country + region pages) ── */
.tablewrap{overflow-x:auto; margin-top:26px}
.dtable{width:100%; border-collapse:collapse; background:var(--paper); font-size:14.5px; min-width:560px}
.dtable caption{text-align:left; font-family:var(--H); font-weight:700; font-size:15px;
  color:var(--g4); padding-bottom:12px; letter-spacing:.03em}
.dtable th,.dtable td{padding:13px 16px; text-align:left; border-bottom:1px solid var(--paper-edge)}
.dtable thead th{font-family:var(--H); font-weight:700; font-size:12px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--wht); background:var(--gd)}
.dtable tbody th{font-family:var(--H); font-weight:800; font-size:16px; color:var(--gd)}
.dtable tbody tr:hover{background:#eeead9}
.dtable em{font-family:var(--B); font-style:normal; font-size:11px; font-weight:500;
  color:var(--gm); letter-spacing:.06em; text-transform:uppercase}

/* ── sections ─────────────────────────────────────────────────────────── */
.pm-sec{padding:76px 0}
.pm-sec--tight{padding:52px 0}
.pm-sec--paper{background:#f1eee1}
.sec__head{margin-bottom:40px}

/* ── FAQ ──────────────────────────────────────────────────────────────── */
.faq{border-top:1px solid var(--paper-edge)}
.faq__row{border-bottom:1px solid var(--paper-edge)}
.faq__q{
  width:100%; background:none; border:0; text-align:left; cursor:pointer;
  padding:22px 44px 22px 0; position:relative;
  font-family:var(--H); font-weight:700; font-size:20px; color:var(--gd); line-height:1.25;
}
.faq__q::after{
  content:'+'; position:absolute; right:8px; top:50%; transform:translateY(-50%);
  font-size:26px; font-weight:400; color:var(--gm); transition:transform .25s var(--ease);
}
.faq__row.is-open .faq__q::after{transform:translateY(-50%) rotate(45deg)}
.faq__a{max-height:0; overflow:hidden; transition:max-height .35s var(--ease)}
.faq__a p{margin:0 0 22px; font-size:15.5px; line-height:1.72; color:var(--g5); max-width:70ch}

/* ═══════════════════════════════════════════════════════════════════════
   ATLAS — continent panels shaded by cash-to-cashless
   ═══════════════════════════════════════════════════════════════════════ */
.at-tabs{display:flex; gap:8px; margin-top:28px; flex-wrap:wrap}
.at-tab{font-family:var(--H); font-weight:700; font-size:13px; letter-spacing:.07em;
  text-transform:uppercase; padding:10px 18px; border-radius:50px; cursor:pointer; transition:.18s;
  border:1.5px solid var(--paper-edge); background:transparent; color:var(--g5)}
.at-tab:hover{border-color:var(--gm); color:var(--gd)}
.at-tab.is-on{background:var(--gd); color:var(--g); border-color:var(--gd)}
.at-months{display:flex; gap:5px; flex-wrap:wrap; margin-top:12px}
.at-mo{font-family:var(--H); font-weight:700; font-size:12px; letter-spacing:.05em;
  text-transform:uppercase; padding:7px 11px; border-radius:5px; cursor:pointer; transition:.15s;
  border:1.5px solid var(--paper-edge); background:transparent; color:var(--g4); min-width:44px}
.at-mo:hover{border-color:var(--gm); color:var(--gd)}
.at-mo.is-on{background:var(--gm); color:#fff; border-color:var(--gm)}
.at-profiles{display:flex; gap:7px; margin-top:11px; flex-wrap:wrap}
.at-prof{font-family:var(--H); font-weight:700; font-size:12.5px; letter-spacing:.06em;
  text-transform:uppercase; padding:9px 15px; border-radius:5px; cursor:pointer; transition:.16s;
  border:1.5px solid var(--paper-edge); background:transparent; color:var(--g4)}
.at-prof:hover{border-color:var(--gm); color:var(--gd)}
.at-prof.is-on{background:var(--gm); color:#fff; border-color:var(--gm)}
.at-cur{transition:none}
.at-legend__note{margin:10px 0 0; font-size:11.5px; line-height:1.5; color:var(--g4)}
.at-card__rows{margin:0 0 16px; display:flex; flex-direction:column; gap:9px}
.at-card__rows div{display:flex; justify-content:space-between; gap:12px; align-items:baseline}
.at-card__rows dt{font-family:var(--H); font-weight:700; font-size:10.5px; letter-spacing:.14em;
  text-transform:uppercase; color:rgba(255,255,255,.45)}
.at-card__rows dd{margin:0; font-size:13.5px; color:var(--wht); text-align:right}
.at-cy{transition:fill .35s var(--ease), stroke .18s, filter .18s}

.atlas{display:grid; grid-template-columns:minmax(0,1fr) 290px; gap:30px; align-items:start; margin-top:36px}
.atlas__maps{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; align-items:start}
.at-panel{margin:0}
.at-panel{position:relative}
.at-panel svg{width:100%; height:auto; display:block; background:#f2efe2;
  border:1px solid var(--paper-edge); border-radius:6px; cursor:grab; touch-action:none}
.at-panel svg.is-dragging{cursor:grabbing}
.at-zoom{position:absolute; top:10px; right:10px; display:flex; flex-direction:column; gap:4px; z-index:2}
.at-zoom button{width:28px; height:28px; border-radius:5px; cursor:pointer; font:700 15px/1 var(--H);
  border:1px solid var(--paper-edge); background:rgba(250,248,240,.94); color:var(--gd); transition:.15s}
.at-zoom button:hover{border-color:var(--gm); color:var(--gm)}
.at-zoom button:disabled{opacity:.35; cursor:default}
.at-zoom button{display:flex; align-items:center; justify-content:center}
.at-zoom button svg{width:13px; height:13px; display:block}
.at-panel figcaption{font-family:var(--H); font-weight:700; font-size:11px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--g4); margin-top:9px}

.at-ctx{fill:#e9e4d5; stroke:#cdc6b2; stroke-width:.6; vector-effect:non-scaling-stroke}
.at-cy{stroke:#7e8f82; stroke-width:.7; cursor:pointer; vector-effect:non-scaling-stroke;
  transition:stroke .18s, filter .18s}
.at-cy:hover,.at-cy.is-on{stroke:var(--gd); stroke-width:1.6; filter:brightness(1.12)}
.at-cy:focus-visible{outline:none; stroke:var(--gd); stroke-width:2.2}
.at-cur{font-family:var(--H); font-weight:800; font-size:16px; fill:var(--gd); pointer-events:none;
  paint-order:stroke; stroke:rgba(255,255,255,.85); stroke-width:3.6}
.at-pin{cursor:pointer}
.at-pin circle{fill:var(--frank); stroke:#f4f1e4; stroke-width:1.5; transition:r .18s}
.at-pin:hover circle,.at-pin.is-on circle{r:6}
.at-pin text{font-family:var(--H); font-weight:700; font-size:14px; fill:var(--gd);
  paint-order:stroke; stroke:#f4f1e4; stroke-width:3.6}
/* the Schengen zone is a state, not a country — it only appears on request */
.at-schengen{opacity:0; transition:opacity .3s var(--ease); pointer-events:none}
.at-schengen.is-on{opacity:1}
.at-sch{fill:rgba(2,227,117,.18); stroke:var(--gm); stroke-width:.7; stroke-dasharray:3 2;
  vector-effect:non-scaling-stroke}

.atlas__side{display:flex; flex-direction:column; gap:16px}
.at-detail{background:var(--gd); border-radius:6px; padding:22px; min-height:238px;
  display:flex; flex-direction:column; justify-content:center}
.at-detail__hint{margin:0; font-size:13.5px; line-height:1.55; color:rgba(255,255,255,.5)}
.at-card__cur{font-family:var(--H); font-weight:800; font-size:12px; letter-spacing:.16em;
  color:var(--g); display:block; margin-bottom:6px}
.at-card h3{font-family:var(--H); font-weight:900; font-size:26px; text-transform:uppercase;
  color:var(--wht); line-height:1; margin:0 0 8px}
.at-card__band{margin:0 0 14px; font-size:14px; color:rgba(255,255,255,.72)}
.at-card__go{font-family:var(--H); font-weight:800; font-size:13.5px; letter-spacing:.06em;
  text-transform:uppercase; color:var(--g); text-decoration:none}
.at-card__go:hover{color:var(--wht)}

.at-legend{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:7px}
.at-legend li{display:flex; align-items:center; gap:9px; font-size:12.5px; color:var(--g5)}
.at-legend i{width:16px; height:16px; border-radius:3px; flex-shrink:0;
  border:1px solid rgba(0,52,27,.12)}
.at-sch-btn{font-family:var(--H); font-weight:700; font-size:12px; letter-spacing:.06em;
  text-transform:uppercase; padding:11px 14px; border-radius:5px; cursor:pointer; text-align:left;
  border:1.5px solid var(--paper-edge); background:transparent; color:var(--g5); transition:.18s}
.at-sch-btn:hover{border-color:var(--gm); color:var(--gd)}
.at-sch-btn[aria-pressed="true"]{background:var(--gd); color:var(--g); border-color:var(--gd)}

/* the map lights the matching postcard above — two views, one system */
.pc.is-lit .pc__card{transform:translateY(-9px) rotate(-1.2deg);
  box-shadow:0 2px 5px rgba(0,52,27,.14), 0 38px 64px -24px rgba(0,52,27,.46)}
.pc.is-dim{opacity:.42; transition:opacity .25s var(--ease)}

@media(max-width:1000px){
  .atlas{grid-template-columns:1fr}
  .atlas__maps{grid-template-columns:1fr}
}

/* ── page-level image credits: present and complete, but visually minor ── */
.credits{padding-top:4px; padding-bottom:34px}
.credits h2{font-family:var(--H); font-weight:700; font-size:11px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--g4); margin-bottom:12px}
.credits h2 em{font-family:var(--B); font-style:normal; font-weight:400; font-size:11px;
  letter-spacing:0; text-transform:none; color:var(--g3)}
.credits ul{margin:0; padding:0; list-style:none;
  columns:3; column-gap:34px; font-size:10.5px; line-height:1.5}
.credits li{break-inside:avoid; margin-bottom:6px; color:var(--g3)}
.credits li a{display:block; color:var(--g4); text-decoration:none;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.credits li a:hover{color:var(--gm); text-decoration:underline}
.credits li span{display:block; color:var(--g3)}
@media(max-width:900px){.credits ul{columns:2}}
@media(max-width:560px){.credits ul{columns:1}}

/* ── responsive ───────────────────────────────────────────────────────── */
@media(max-width:1000px){
  .map{grid-template-columns:1fr; gap:28px}
}
@media(max-width:640px){
  .pm-sec{padding:52px 0}
  .pm-wrap{padding:0 18px}
  .pc__name{font-size:27px}
}
@media(prefers-reduced-motion:reduce){
  .tg *{transition-duration:.01ms !important; animation-duration:.01ms !important}
  .pc:hover{transform:none}
}

.at-card__cur{letter-spacing:.1em}
.at-card__pay{margin:0 0 14px; font-size:12.5px; color:rgba(255,255,255,.55)}
.at-card__rows dd{font-family:var(--H); font-weight:800; font-size:16px}



/* ── theme-reset neutraliser ──────────────────────────────────────────────
   assets/theme.css resets margins to 0, uppercases h1–h5 and strips list
   markers store-wide. The prototype was authored against browser defaults, so
   restore them here — scoped to .tg, and written at element specificity (0,1,1)
   so every component rule further down still wins. Ordering matters: this block
   must come before the components, never after. */
.tg p{margin:0 0 1em}
.tg ul,.tg ol{list-style:revert; margin:0 0 1em; padding-left:1.35em}
.tg li{margin:0 0 .35em}
.tg dl,.tg dd,.tg dt{margin:0}
.tg h4,.tg h5,.tg h6{font-family:var(--H); text-transform:none; margin:0}
.tg table{border-collapse:collapse}
.tg button{font-family:inherit}
/* the design does want caps on the display sizes — two classes beats one
   class + one element, so these re-assert over the neutraliser above */
.tg .h-xl,.tg .h-lg{text-transform:uppercase}


/* ── country guide ──────────────────────────────────────────────── */
/* Shared country-guide styles — one sheet for all 13 guides. */
.chero{position:relative; min-height:min(72vh,660px); display:flex; align-items:flex-end;
  background:var(--gd); overflow:hidden; isolation:isolate}
.chero__img{position:absolute; inset:0; z-index:0}
.chero__img img{width:100%; height:100%; object-fit:cover; filter:saturate(1.06) contrast(1.05) sepia(.08) brightness(1.04)}
.chero__img::after{content:''; position:absolute; inset:0; mix-blend-mode:soft-light;
  background:
    radial-gradient(70% 60% at 50% 34%, rgba(255,206,128,.22) 0%, rgba(255,196,110,0) 70%),
    radial-gradient(120% 95% at 50% 45%, rgba(60,34,10,0) 58%, rgba(60,34,10,.24) 100%)}
.chero__scrim{position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg,rgba(0,30,15,.74) 0%,rgba(0,32,16,.42) 38%,rgba(0,40,20,.94) 100%)}
.chero__in{position:relative; z-index:2; padding:60px 0 52px; width:100%}
.chero__greet{display:block; font-family:var(--S); font-size:clamp(24px,2.6vw,34px);
  color:var(--g); line-height:1; margin-bottom:6px; transform:rotate(-1.5deg);
  transform-origin:0 50%; text-shadow:0 2px 10px rgba(0,20,10,.5)}
.chero h1{color:var(--wht); max-width:20ch; margin-bottom:16px}
.chero__sub{color:rgba(255,255,255,.78); font-size:clamp(15px,1.6vw,19px); max-width:56ch; line-height:1.65}
.chero__meta{display:flex; gap:26px; flex-wrap:wrap; margin:26px 0 24px; padding-top:22px;
  border-top:1px solid rgba(255,255,255,.16)}
.chero__meta div{display:flex; flex-direction:column; gap:3px}
.chero__meta dt{font-family:var(--H); font-weight:600; font-size:11.5px; letter-spacing:.16em;
  text-transform:uppercase; color:rgba(255,255,255,.5)}
.chero__meta dd{margin:0; font-family:var(--H); font-weight:800; font-size:19px; color:var(--g)}

.anchors{position:sticky; top:0; z-index:20; background:var(--gd); border-bottom:1px solid rgba(255,255,255,.1)}
.anchors__row{display:flex; gap:6px; overflow-x:auto; padding:11px 0; scrollbar-width:none}
.anchors__row::-webkit-scrollbar{display:none}
.anchors a{white-space:nowrap; text-decoration:none; font-family:var(--H); font-weight:600;
  font-size:13px; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,.62);
  padding:7px 13px; border-radius:50px; transition:.18s}
.anchors a:hover{color:var(--wht); background:rgba(255,255,255,.09)}

.facts{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:34px}
.fact{background:var(--paper); border:1px solid var(--paper-edge); border-radius:4px; padding:22px}
.fact h3{font-size:17px; color:var(--gd); margin-bottom:6px}
.fact p{margin:0; font-size:14px; line-height:1.6; color:var(--g5)}

.meter{margin-top:36px; background:var(--paper); border:1px solid var(--paper-edge);
  border-radius:4px; padding:26px 28px}
.meter__top{display:flex; justify-content:space-between; align-items:baseline; margin-bottom:14px; gap:12px; flex-wrap:wrap}
.meter__lbl{font-family:var(--H); font-weight:700; font-size:16px; color:var(--gd)}
.meter__band{font-family:var(--H); font-weight:800; font-size:13px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--gm); background:var(--gl); padding:5px 12px; border-radius:50px}
.meter__track{height:9px; border-radius:50px; background:#e2ddc9; overflow:hidden}
.meter__fill{height:100%; border-radius:50px; background:linear-gradient(90deg,var(--gm),var(--g))}
.meter__ends{display:flex; justify-content:space-between; font-size:12px; color:var(--g4); margin-top:8px}
.meter__cap{font-size:14px; line-height:1.6; color:var(--g5); margin:14px 0 0}

.costs{width:100%; border-collapse:collapse; background:var(--paper); margin-top:8px}
.costs th,.costs td{padding:14px 18px; border-bottom:1px solid var(--paper-edge); font-size:15px}
.costs th{text-align:left; font-family:var(--B); font-weight:500; color:var(--g5)}
.costs td{text-align:right; font-family:var(--H); font-weight:800; font-size:19px; color:var(--gd)}

.prose{max-width:90ch}
.prose__h{color:var(--gd); margin:44px 0 14px; scroll-margin-top:76px}
.prose__h:first-child{margin-top:0}
.prose p{font-size:16.5px; line-height:1.78; color:var(--g5); margin:0 0 17px}
.layout{display:grid; grid-template-columns:minmax(0,1fr) 240px; gap:48px; align-items:start}
.toc{position:sticky; top:76px; border-left:2px solid var(--paper-edge); padding-left:26px; margin-left:14px}
.toc b{display:block; font-family:var(--H); font-weight:700; font-size:11.5px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--g4); margin-bottom:12px}
.toc a{display:block; font-family:var(--H); font-weight:600; font-size:15px; letter-spacing:.02em;
  line-height:1.3; color:var(--g5); text-decoration:none; padding:7px 0; transition:.15s}
.toc a:hover{color:var(--gm)}

.cta{background:var(--gd); border-radius:8px; padding:56px 40px; text-align:center}
.cta h2{color:var(--wht); margin-bottom:12px}
.cta p{color:rgba(255,255,255,.7); max-width:52ch; margin:0 auto 26px}
.ctarow{display:flex; gap:12px; justify-content:center; flex-wrap:wrap}
@media(max-width:1000px){.layout{grid-template-columns:1fr} .toc{display:none}
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.facts{grid-template-columns:1fr}}


/* ── country map + city pins ──────────────────────────────────────────── */
.cmap{display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:34px; align-items:start; margin-top:34px}
.cm{width:100%; height:auto; display:block; background:#f2efe2;
  border:1px solid var(--paper-edge); border-radius:6px}
.cm-land{fill:#1d6b42; stroke:#f2efe2; stroke-width:.8; vector-effect:non-scaling-stroke}
.cm-pin{cursor:pointer}
.cm-pin circle{fill:var(--frank); stroke:#f2efe2; stroke-width:1.8; transition:r .18s var(--ease)}
.cm-pin text{font-family:var(--H); font-weight:700; font-size:13px; fill:var(--gd);
  paint-order:stroke; stroke:#f2efe2; stroke-width:3.4; pointer-events:none}
.cm-pin:hover circle,.cm-pin.is-on circle{r:8; fill:var(--g)}
.cm-pin:focus-visible circle{r:8; stroke:var(--gd); stroke-width:2.6}
.cmap__list{display:flex; flex-direction:column; gap:8px}
.cm-card{display:flex; flex-direction:column; gap:2px; text-align:left; cursor:pointer;
  background:var(--paper); border:1.5px solid var(--paper-edge); border-radius:5px;
  padding:13px 15px; transition:.18s var(--ease)}
.cm-card:hover,.cm-card.is-on{border-color:var(--gm); background:var(--gl)}
.cm-card__n{font-family:var(--H); font-weight:800; font-size:17px; color:var(--gd)}
.cm-card__h{font-size:13px; line-height:1.5; color:var(--g5)}
@media(max-width:900px){.cmap{grid-template-columns:1fr; gap:22px}}

/* map sits below the city cards as the supporting view, so it gets full width */
.cmap--wide{margin-top:30px}
.cmap--wide .cm{max-width:620px; margin:0 auto}




/* ── hub ────────────────────────────────────────────────────────── */
/* Travel-guide hub: hero, postcard rack, search and filters. */

.pm-hero{background:var(--gd); color:var(--wht); padding:96px 0 104px; position:relative; overflow:hidden}
.pm-hero__bg{position:absolute; inset:0; z-index:0}
.pm-hero__bg img{width:100%; height:100%; object-fit:cover; object-position:center;
  filter:saturate(.72) contrast(1.04) brightness(.9)}
.pm-hero__bg::after{content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,40,21,.62), rgba(0,40,21,.48) 42%, rgba(0,40,21,.86))}
.pm-hero__in{position:relative; z-index:1; text-align:center}
.crumb{font-size:13px; color:rgba(255,255,255,.5); margin-bottom:20px}
.crumb a{color:inherit; text-decoration:none} .crumb a:hover{color:var(--g)}
.pm-hero h1{color:var(--wht); margin-bottom:18px}
.pm-hero .lede{color:rgba(255,255,255,.72); margin:0 auto 30px; text-align:center}
.pm-hero__cta{display:flex; gap:12px; justify-content:center; flex-wrap:wrap}
.tools{display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin:34px 0 0}
.search{position:relative; flex:0 1 380px}
.search input{width:100%; padding:14px 20px 14px 46px; border-radius:50px; font-size:15px;
  font-family:var(--B); border:1.5px solid rgba(255,255,255,.2); background:rgba(255,255,255,.07); color:var(--wht)}
.search input::placeholder{color:rgba(255,255,255,.45)}
.search input:focus{outline:none; border-color:var(--g); background:rgba(255,255,255,.11)}
.search svg{position:absolute; left:17px; top:50%; transform:translateY(-50%); color:var(--g)}
.filters{display:flex; gap:8px}
.fbtn{font-family:var(--H); font-weight:700; font-size:13px; letter-spacing:.08em; text-transform:uppercase;
  padding:13px 20px; border-radius:50px; cursor:pointer; transition:.2s;
  border:1.5px solid rgba(255,255,255,.2); background:transparent; color:rgba(255,255,255,.8)}
.fbtn:hover{border-color:var(--g)}
.fbtn.is-on{background:var(--g); color:var(--gd); border-color:var(--g)}
/* minmax(0,1fr) — plain 1fr is minmax(auto,1fr) and the image's min-content
   contribution blows the first track out to full width */
.rack{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:34px 30px}
.empty{text-align:center; color:var(--g4); padding:40px 0}
.why{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px}
.why a{background:var(--paper); border:1px solid var(--paper-edge); border-radius:4px; padding:24px;
  text-decoration:none; display:block; transition:.22s var(--ease)}
.why a:hover{transform:translateY(-3px); box-shadow:0 18px 40px -18px rgba(0,52,27,.3)}
.why h3{font-size:18px; color:var(--gd); margin-bottom:6px}
.why p{font-size:13.5px; line-height:1.6; color:var(--g5); margin:0}
.ctaband{background:var(--gd); padding:76px 0; text-align:center; position:relative; overflow:hidden}
.ctaband h2{color:var(--wht); margin-bottom:12px}
.ctaband p{color:rgba(255,255,255,.7); max-width:52ch; margin:0 auto 26px}
@media(max-width:1000px){.rack{grid-template-columns:repeat(2,minmax(0,1fr))} .why{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.rack{grid-template-columns:1fr} .why{grid-template-columns:1fr}}


/* ── closing CTA ────────────────────────────────────────────────── */
/* footer.css minus its .site-footer rules: layout/theme.liquid already
   renders the real site footer on every page. */
.closing{background:#faf8f2; padding:56px 0 62px}
.closing__card{background:var(--gd); border-radius:26px; padding:56px 40px; text-align:center}
.closing__card h2{color:var(--wht); margin-bottom:12px}
.closing__card p{color:rgba(255,255,255,.72); max-width:56ch; margin:0 auto 26px; font-size:15.5px; line-height:1.65}
.closing__cta{display:flex; gap:14px; justify-content:center; flex-wrap:wrap}
.closing__trust{font-size:12.5px !important; color:rgba(255,255,255,.45) !important; margin:26px auto 0 !important; max-width:70ch !important}
@media(max-width:900px){
  .closing__card{padding:42px 24px; border-radius:18px}
}

/* ── Japan only: photo bands, region-map chips, the wide data table ─ */
.band{max-width:var(--max); margin:0 auto; padding:0 24px}
.band .slot{border-radius:6px}
.band__cap{font-size:12.5px; color:var(--g4); margin:10px 2px 0; letter-spacing:.01em}
text-transform:uppercase; color:var(--g); display:block; margin-bottom:12px}
.answer__body{font-size:clamp(17px,1.9vw,22px); line-height:1.6; margin:0; max-width:70ch; color:rgba(255,255,255,.94)}
.answer__body b{color:var(--g); font-weight:600}
.map__chips{display:flex; flex-wrap:wrap; gap:7px; margin-top:20px; justify-content:center}
.rchip{font-family:var(--H); font-weight:700; font-size:12.5px; letter-spacing:.07em; text-transform:uppercase; padding:8px 15px; border-radius:50px; cursor:pointer; transition:.18s; border:1.5px solid var(--paper-edge); background:var(--paper); color:var(--g5)}
.rchip:hover{border-color:var(--gm); color:var(--gd)}
.rchip[aria-pressed="true"]{background:var(--gd); color:var(--g); border-color:var(--gd)}
.rchip:focus-visible{outline:2.5px solid var(--gm); outline-offset:2px}
.tablewrap{overflow-x:auto; margin-top:44px}
.dtable{width:100%; border-collapse:collapse; background:var(--paper); font-size:14.5px; min-width:620px}
.dtable caption{text-align:left; font-family:var(--H); font-weight:700; font-size:15px; color:var(--g4); padding-bottom:12px; letter-spacing:.03em}
.dtable th, .dtable td{padding:13px 16px; text-align:left; border-bottom:1px solid var(--paper-edge)}
.dtable thead th{font-family:var(--H); font-weight:700; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--wht); background:var(--gd)}
.dtable tbody th{font-family:var(--H); font-weight:800; font-size:16px; color:var(--gd)}
.dtable tbody tr:hover{background:#eeead9}

/* ── Tohoku region page only ────────────────────────────────────── */
.tg--tohoku .chero{position:relative; min-height:min(62vh,540px); display:flex; align-items:flex-end; background:var(--gd); overflow:hidden; isolation:isolate}
.tg--tohoku .chero__photo{position:absolute; inset:0; z-index:0}
.tg--tohoku .chero__photo img{width:100%; height:100%; object-fit:cover; filter:saturate(1.06) contrast(1.05) sepia(.08) brightness(1.04)}
.tg--tohoku .chero__scrim{position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,rgba(0,30,15,.74) 0%,rgba(0,32,16,.42) 38%,rgba(0,40,20,.94) 100%)}
.tg--tohoku .chero::after{content:''; position:absolute; inset:0; z-index:1; background:radial-gradient(60% 70% at 78% 42%, rgba(2,227,117,.16), rgba(2,227,117,0) 70%)}
.tg--tohoku .chero__art{position:absolute; z-index:0; right:5%; top:50%; transform:translateY(-50%); height:132%; opacity:.5; display:flex; align-items:center}
.tg--tohoku .chero__art svg{height:100%; width:auto; overflow:visible}
.tg--tohoku .chero__art path{fill:none; stroke:var(--g); stroke-width:2.2; stroke-linejoin:round; opacity:.85}
.tg--tohoku .chero__in{position:relative; z-index:2; padding:54px 0 46px; width:100%}
.tg--tohoku .chero__greet{display:block; font-family:var(--S); font-size:clamp(22px,2.4vw,32px); color:var(--g); line-height:1; margin-bottom:4px; transform:rotate(-1.5deg); transform-origin:0 50%; text-shadow:0 2px 10px rgba(0,20,10,.5)}
.tg--tohoku .chero h1{color:var(--wht); margin-bottom:14px}
.tg--tohoku .chero__sub{color:rgba(255,255,255,.8); font-size:clamp(15px,1.6vw,19px); max-width:56ch; line-height:1.65}
.tg--tohoku .chero__meta{display:flex; gap:26px; flex-wrap:wrap; margin:24px 0 0; padding-top:20px; border-top:1px solid rgba(255,255,255,.16)}
.tg--tohoku .chero__meta div{display:flex; flex-direction:column; gap:3px}
.tg--tohoku .chero__meta dt{font-family:var(--H); font-weight:600; font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.5)}
.tg--tohoku .chero__meta dd{margin:0; font-family:var(--H); font-weight:800; font-size:18px; color:var(--g)}
.tg--tohoku .anchors{position:sticky; top:0; z-index:20; background:var(--gd); border-bottom:1px solid rgba(255,255,255,.1)}
.tg--tohoku .anchors__row{display:flex; gap:6px; overflow-x:auto; padding:11px 0; scrollbar-width:none}
.tg--tohoku .anchors__row::-webkit-scrollbar{display:none}
.tg--tohoku .anchors a{white-space:nowrap; text-decoration:none; font-family:var(--H); font-weight:600; font-size:13px; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,.62); padding:7px 13px; border-radius:50px; transition:.18s}
.tg--tohoku .anchors a:hover{color:var(--wht); background:rgba(255,255,255,.09)}
.tg--tohoku .lead{font-size:clamp(17px,1.9vw,21px); line-height:1.65; color:var(--g5); max-width:66ch; margin:0 0 18px}
.tg--tohoku .lead b{color:var(--gd); font-weight:700}
.tg--tohoku .pfmap{display:grid; grid-template-columns:300px minmax(0,1fr); gap:40px; align-items:start; margin-top:34px}
.tg--tohoku .pfsvg{width:100%; height:auto; display:block}
.tg--tohoku .pf{fill:#123f28; stroke:var(--cream); stroke-width:2.4; stroke-linejoin:round; transition:fill .2s}
.tg--tohoku .pf:hover{fill:var(--gm)}
.tg--tohoku .pflbl{font-family:var(--H); font-weight:700; font-size:15px; fill:var(--wht); paint-order:stroke; stroke:#123f28; stroke-width:3.4; pointer-events:none}
.tg--tohoku .places{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-top:34px}
.tg--tohoku .place{background:var(--paper); border:1px solid var(--paper-edge); border-radius:5px; overflow:hidden}
.tg--tohoku .place__txt{padding:20px 22px 22px}
.tg--tohoku .place__p{font-family:var(--H); font-weight:700; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--gm); display:block; margin-bottom:5px}
.tg--tohoku .place h3{font-size:21px; color:var(--gd); margin-bottom:7px}
.tg--tohoku .place p{margin:0; font-size:14px; line-height:1.62; color:var(--g5)}
.tg--tohoku .calc{margin-top:32px}
.tg--tohoku .calc__controls{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; background:var(--gd); border-radius:6px 6px 0 0; padding:26px 28px}
.tg--tohoku .calc__controls label{display:flex; flex-direction:column; gap:7px; font-family:var(--H); font-weight:700; font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.6)}
.tg--tohoku .calc__controls input, .tg--tohoku .calc__controls select{font-family:var(--B); font-size:15px; padding:11px 13px; border-radius:6px; border:1.5px solid rgba(255,255,255,.18); background:rgba(255,255,255,.07); color:var(--wht)}
.tg--tohoku .calc__controls select option{color:#111}
.tg--tohoku .calc__chk{grid-column:1/-1; flex-direction:row !important; align-items:center; gap:10px !important; text-transform:none !important; letter-spacing:.02em !important; font-size:13.5px !important; color:rgba(255,255,255,.8) !important}
.tg--tohoku .calc__chk input{width:17px; height:17px; accent-color:var(--g)}
.tg--tohoku .calc__out{background:#0a2616; border-radius:0 0 6px 6px; padding:24px 28px 26px; display:flex; gap:44px; flex-wrap:wrap; align-items:flex-end}
.tg--tohoku .calc__out div{display:flex; flex-direction:column; gap:3px}
.tg--tohoku .calc__out span{font-family:var(--H); font-weight:600; font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.5)}
.tg--tohoku .calc__out b{font-family:var(--H); font-weight:900; font-size:clamp(30px,3.6vw,44px); color:var(--g); line-height:1}
.tg--tohoku .calc__note{flex:1; min-width:240px; margin:0; font-size:12.5px; line-height:1.6; color:rgba(255,255,255,.55)}
.tg--tohoku .calc__note a{color:var(--g)}
.tg--tohoku .know{margin-top:30px; border-top:1px solid var(--paper-edge)}
.tg--tohoku .know__row{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.6fr); gap:30px; padding:22px 0; border-bottom:1px solid var(--paper-edge)}
.tg--tohoku .know__row h3{font-size:19px; color:var(--gd)}
.tg--tohoku .know__row p{margin:0; font-size:15px; line-height:1.68; color:var(--g5)}
.tg--tohoku .up{background:var(--paper); border:1px solid var(--paper-edge); border-radius:6px; padding:26px 28px; margin-top:12px}
.tg--tohoku .up h2{font-size:20px; color:var(--gd); margin-bottom:6px}
.tg--tohoku .up p{font-size:14px; color:var(--g5); margin:0 0 16px}
.tg--tohoku .up__grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px}
.tg--tohoku .up__grid a{display:block; padding:13px 15px; border:1.5px solid var(--paper-edge); border-radius:5px; text-decoration:none; font-family:var(--H); font-weight:700; font-size:13.5px; letter-spacing:.03em; color:var(--gd); transition:.18s}
.tg--tohoku .up__grid a:hover{border-color:var(--gm); background:var(--gl)}
.tg--tohoku .up__grid span{display:block; font-family:var(--B); font-weight:400; font-size:12px; color:var(--g4); margin-top:3px}
.tg--tohoku .cta{background:var(--gd); border-radius:8px; padding:52px 40px; text-align:center}
.tg--tohoku .cta h2{color:var(--wht); margin-bottom:12px}
.tg--tohoku .cta p{color:rgba(255,255,255,.7); max-width:52ch; margin:0 auto 24px}
.tg--tohoku .ctarow{display:flex; gap:12px; justify-content:center; flex-wrap:wrap}
@media(max-width:1000px){
  .tg--tohoku .pfmap{grid-template-columns:1fr; gap:26px}
  .tg--tohoku .places{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tg--tohoku .up__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tg--tohoku .know__row{grid-template-columns:1fr; gap:8px}
}
@media(max-width:640px){
  .tg--tohoku .places{grid-template-columns:1fr}
  .tg--tohoku .calc__controls{grid-template-columns:1fr}
  .tg--tohoku .calc__out{gap:24px}
}

/* ── Port tweaks (appended so they win the cascade) ───────────────────────── */

/* Hero overlays: neutral dark instead of brand-green, so the photo reads
   naturally (like the postcards) while the text stays legible. */
.chero__scrim{background:linear-gradient(180deg,rgba(12,14,16,.62) 0%,rgba(12,14,16,.18) 42%,rgba(8,10,12,.9) 100%)}
.pm-hero__bg::after{background:linear-gradient(180deg,rgba(12,14,16,.6),rgba(12,14,16,.34) 42%,rgba(8,10,12,.84))}
.pm-hero__bg img{filter:saturate(.92) contrast(1.04) brightness(.95)}
.tg--tohoku .chero::after{background:linear-gradient(180deg,rgba(12,14,16,.55) 0%,rgba(12,14,16,.15) 40%,rgba(8,10,12,.9) 100%)}

/* Hero: buy button + live-rate link */
.chero__cta{display:flex; align-items:center; gap:18px 22px; flex-wrap:wrap}
.chero__rate{color:#fff; font-family:var(--H); font-weight:700; font-size:14px; letter-spacing:.04em;
  text-transform:uppercase; text-decoration:none; opacity:.9; border-bottom:1.5px solid rgba(255,255,255,.4);
  padding-bottom:2px; transition:color .15s, border-color .15s}
.chero__rate:hover{color:var(--g); border-color:var(--g); opacity:1}

/* Internal-links section: money tools grid + related-guides row */
.tg-links{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px}
.tg-link{display:flex; flex-direction:column; gap:4px; padding:18px 20px; text-decoration:none;
  background:var(--paper); border:1px solid var(--paper-edge); border-radius:12px; color:var(--ink);
  transition:transform .18s var(--ease), box-shadow .18s var(--ease), border-color .18s}
.tg-link b{font-family:var(--H); font-weight:800; font-size:17px; letter-spacing:-.01em; color:var(--gd)}
.tg-link span{font-size:13.5px; line-height:1.5; color:var(--g5)}
.tg-link:hover{transform:translateY(-2px); border-color:var(--gm);
  box-shadow:0 2px 6px rgba(0,52,27,.06), 0 18px 40px -22px rgba(0,52,27,.4)}
.tg-related{margin:26px 0 0; font-size:15px; color:var(--g5); line-height:2}
.tg-related__lbl{font-family:var(--H); font-weight:700; font-size:12.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--g4); margin-right:10px}
.tg-related a{color:var(--gm); text-decoration:none; border-bottom:1px solid transparent; padding:2px 0}
.tg-related a:not(:last-child){margin-right:16px}
.tg-related a:hover{border-color:var(--gm)}
@media(max-width:820px){.tg-links{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.chero__cta{flex-direction:column; align-items:flex-start; gap:15px}}
@media(max-width:520px){.tg-links{grid-template-columns:1fr}}


/* ═══ Vintage postcard-collage hero (hub) ═════════════════════════════════ */
.tgh-hero{position:relative; overflow:hidden; min-height:900px; padding:56px 24px 46px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:40px;
  color:#f4edda; isolation:isolate;
  background:
    radial-gradient(90% 55% at 50% 4%, rgba(120,180,140,.16) 0%, rgba(120,180,140,0) 60%),
    radial-gradient(140% 120% at 50% 42%, rgba(0,0,0,0) 42%, rgba(0,0,0,.42) 100%),
    linear-gradient(168deg, #234735 0%, #1a3628 46%, #142a20 100%), #17301f}
.tgh-hero::before{content:''; position:absolute; inset:0; pointer-events:none; opacity:.5; mix-blend-mode:screen; z-index:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='600'%3E%3Cg fill='none' stroke='%23e8dcc0' stroke-opacity='.06' stroke-width='1'%3E%3Cpath d='M0 150 Q600 90 1200 150M0 300 Q600 240 1200 300M0 450 Q600 390 1200 450'/%3E%3Cpath d='M200 0 Q140 300 200 600M480 0 Q440 300 480 600M720 0 Q760 300 720 600M1000 0 Q1060 300 1000 600'/%3E%3C/g%3E%3C/svg%3E"); background-size:cover}
.tgh-hero::after{content:''; position:absolute; inset:0; pointer-events:none; opacity:.5; mix-blend-mode:soft-light; z-index:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}
.tgh-frame{position:absolute; inset:16px; border:1.5px solid rgba(240,235,215,.16); border-radius:6px; pointer-events:none; z-index:4}
.tgh-frame::before{content:''; position:absolute; inset:5px; border:1px solid rgba(240,235,215,.09); border-radius:3px}
.tgh-compass{position:absolute; z-index:1; width:340px; height:340px; right:-70px; bottom:-70px; opacity:.06; color:#f4edda; pointer-events:none}
.tgh-compass svg{width:100%; height:100%}
.tgh-flight{position:absolute; top:74px; left:50%; transform:translateX(-50%); width:min(1180px,94%); height:120px; pointer-events:none; opacity:.5; z-index:2}
.tgh-flight path{fill:none; stroke:#b9c9a8; stroke-width:2; stroke-dasharray:2 7; stroke-linecap:round}
.tgh-plane{fill:#d7e0c9}
.tgh-cards{position:absolute; inset:0; z-index:3}
.tgh-card{position:absolute; width:214px; background:#f4edda; padding:10px 10px 38px; border-radius:3px;
  box-shadow:0 3px 5px rgba(0,0,0,.3), 0 26px 44px -18px rgba(0,0,0,.6); transition:transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s}
.tgh-card img{display:block; width:100%; height:150px; object-fit:cover; border-radius:1px; filter:sepia(.32) saturate(1.18) contrast(1.02) brightness(1.02)}
.tgh-card figcaption{position:absolute; left:0; right:0; bottom:8px; text-align:center; font-family:var(--S); font-size:24px; color:#39332a; line-height:1}
.tgh-card:hover{transform:translateY(-6px) scale(1.02); z-index:20; box-shadow:0 5px 8px rgba(0,0,0,.32), 0 40px 64px -20px rgba(0,0,0,.7)}
.tgh-c1{top:36px;  left:2%;    transform:rotate(-8deg)}
.tgh-c2{top:326px; left:-.6%;  transform:rotate(4.5deg)}
.tgh-c3{top:632px; left:1.5%;  transform:rotate(-5deg)}
.tgh-c4{top:46px;  right:2.5%; transform:rotate(7deg)}
.tgh-c5{top:340px; right:-.6%; transform:rotate(-4deg)}
.tgh-c6{top:632px; right:2%;   transform:rotate(6deg)}
.tgh-stamp{position:absolute; z-index:6; opacity:.82}
.tgh-stamp svg{width:100%; height:100%}
.tgh-ink{fill:none; stroke:#e9dcbe; stroke-width:2.2}
.tgh-stamp text{fill:#e9dcbe; font-family:var(--H); font-weight:700; letter-spacing:1px; text-transform:uppercase}
.tgh-pm{width:100px; height:100px}
.tgh-s1{top:170px; left:20.5%; transform:rotate(-12deg)}
.tgh-s2{top:172px; right:18.5%; transform:rotate(10deg)}
.tgh-s3{top:520px; right:15%; transform:rotate(-8deg); opacity:.5}
.tgh-seal{position:absolute; z-index:6; width:84px; height:84px; top:640px; left:50%; transform:translateX(-260px) rotate(-6deg); opacity:.5}
.tgh-center{position:relative; z-index:5; width:min(690px,92%); text-align:center; margin:0 auto}
.tgh-crumb{font-size:14.5px; color:rgba(232,224,200,.6); margin-bottom:22px; font-weight:500; letter-spacing:.02em}
.tgh-crumb a{color:rgba(232,224,200,.85); text-decoration:none}
.tgh-crumb a:hover{color:#fff}
.tgh-crumb .sep{margin:0 8px; color:rgba(232,224,200,.4)}
.tgh-eyebrow{display:inline-flex; align-items:center; gap:9px; padding:9px 20px; border-radius:50px;
  border:1.5px solid rgba(78,224,140,.4); background:rgba(20,45,32,.5); color:#4ee08c;
  font-weight:400; font-size:12.5px; letter-spacing:.14em; text-transform:uppercase;
  font-family:'Special Elite',var(--H),monospace}
.tgh-hero h1{font-family:var(--H); font-weight:900; text-transform:uppercase; margin:26px 0 0;
  font-size:clamp(50px,7.6vw,96px); line-height:.88; letter-spacing:-.005em; color:#f4edda;
  text-shadow:0 2px 24px rgba(0,0,0,.35)}
.tgh-acc{color:#4ee08c; display:block}
.tgh-divider{display:flex; align-items:center; justify-content:center; gap:14px; margin:24px 0 22px; color:rgba(232,224,200,.35)}
.tgh-divider::before,.tgh-divider::after{content:''; height:1.5px; width:78px; background:linear-gradient(90deg,transparent,rgba(232,224,200,.4))}
.tgh-divider::after{background:linear-gradient(90deg,rgba(232,224,200,.4),transparent)}
.tgh-divider svg{width:26px; height:26px; color:#4ee08c}
.tgh-lede{font-size:18px; line-height:1.62; color:rgba(240,235,220,.82); max-width:566px; margin:0 auto; font-weight:400}
.tgh-cta{display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin:34px 0 26px}
.tgh-btn{display:inline-flex; align-items:center; gap:10px; padding:15px 26px; border-radius:50px;
  font-weight:600; font-size:15.5px; text-decoration:none; cursor:pointer; transition:.2s; border:1.5px solid transparent; font-family:var(--B)}
.tgh-btn svg{width:18px; height:18px}
.tgh-btn-g{background:#35c877; color:#08301c; box-shadow:0 12px 28px -8px rgba(53,200,119,.5); font-weight:700}
.tgh-btn-g:hover{background:#4ee08c; transform:translateY(-2px)}
.tgh-btn-o{background:rgba(240,235,215,.06); border-color:rgba(240,235,215,.28); color:#f4edda}
.tgh-btn-o:hover{border-color:#4ee08c; color:#4ee08c; transform:translateY(-2px)}
.tgh-search{display:flex; align-items:center; gap:12px; background:#f4edda; border:1px solid rgba(0,0,0,.06);
  border-radius:50px; padding:6px 8px 6px 22px; max-width:566px; margin:0 auto;
  box-shadow:0 3px 5px rgba(0,0,0,.2), 0 22px 44px -18px rgba(0,0,0,.5)}
.tgh-globe{color:#8a9689; flex:none}
.tgh-search input{flex:1; border:0; outline:0; font-family:var(--B); font-size:16px; color:#132a20; background:transparent; padding:12px 0}
.tgh-search input::placeholder{color:#8a9689}
.tgh-search button{flex:none; width:46px; height:46px; border:0; border-radius:50%; background:#35c877; color:#08301c; cursor:pointer; display:grid; place-items:center}
.tgh-trust{position:relative; z-index:5; margin:0 auto; width:min(800px,92%);
  background:linear-gradient(180deg,#f6efdd,#f0e7d0); border:1px solid rgba(0,0,0,.06); border-radius:16px;
  box-shadow:0 3px 6px rgba(0,0,0,.2), 0 30px 60px -30px rgba(0,0,0,.6); display:grid; grid-template-columns:repeat(4,1fr)}
.tgh-trust__it{display:flex; gap:11px; align-items:flex-start; padding:16px 17px; position:relative}
.tgh-trust__it:not(:last-child)::after{content:''; position:absolute; right:0; top:22%; height:56%; width:1px; background:rgba(0,0,0,.08)}
.tgh-trust__ic{flex:none; width:36px; height:36px; border-radius:10px; background:#e4f4e9; color:#0c7a44; display:grid; place-items:center}
.tgh-trust__ic svg{width:18px; height:18px}
.tgh-trust__t{font-family:var(--H); font-weight:700; font-size:15px; line-height:1.05; color:#132a20; text-transform:uppercase; letter-spacing:.01em}
.tgh-trust__s{font-size:11.5px; color:#6d7a6a; margin-top:3px}
/* region filter pills, relocated under the rack heading */
#rack .filters{display:inline-flex; gap:9px; justify-content:center; margin-top:20px}
@media(max-width:1300px){.tgh-card{width:192px} .tgh-c1,.tgh-c2,.tgh-c3{left:-2.5%} .tgh-c4,.tgh-c5,.tgh-c6{right:-2.5%} .tgh-compass{display:none}}
@media(max-width:900px){.tgh-cards,.tgh-stamp,.tgh-flight,.tgh-seal,.tgh-frame{display:none}
  .tgh-hero{min-height:0; padding:48px 20px; gap:30px} .tgh-trust{grid-template-columns:1fr 1fr}
  .tgh-trust__it:nth-child(2)::after{display:none}}

