/* ============================================================
   FIELD TRIP — BRAND THEME LAYER  ·  ft-brand.css
   Loaded last on every page, so it re-themes the existing kit
   without touching page markup.

   The system: DARK is the brand surface (masthead, heroes, CTA
   bands, footers), LIGHT is the working surface (cards, tables,
   hotel tiers, seat maps). One accent, spent sparingly.
   ============================================================ */

:root{
  --ground-top:#8A1A16;
  --ground-base:#220D0C;
  --hole:#160706;
  --red:#C8312A;
  --red-dark:#A82720;
  --cream:#F6F1E9;
  --ink:#1A1A1A;
  --ink70:#4A4340;
  --ink45:#8A807C;
  --line:#E4DAD5;
  --line-soft:#F0E8E4;
  --warm-grey:#6E5450;
  --bone:#FAF6F3;

  --c100:#F6F1E9;
  --c88:rgba(246,241,233,.88);
  --c62:rgba(246,241,233,.62);
  --c50:rgba(246,241,233,.50);
  --c35:rgba(246,241,233,.35);
  --c22:rgba(246,241,233,.22);
  --c12:rgba(246,241,233,.12);

  --grad:linear-gradient(150deg,#8A1A16 0%,#220D0C 72%);
}

html body{background:#fff;color:var(--ink)}

/* ─────────────────────────────────────────────
   1 · MASTHEAD
   ───────────────────────────────────────────── */
body header{
  background:var(--grad);
  border-bottom:1px solid rgba(246,241,233,.14);
  box-shadow:none;
}
body header .nav{padding:18px 28px}
body .logo .txt b{color:var(--c100)}
body .logo .txt b .tp{color:var(--red)}
body .logo .txt small{color:var(--c50);letter-spacing:.42em}
body .cross{color:var(--red)}
body .cross circle[fill]:not([fill="none"]){fill:currentColor}
body .cross circle[stroke],body .cross line{stroke:currentColor}

body nav.links a{color:var(--c62);letter-spacing:.14em;padding-bottom:3px;
  border-bottom:1.5px solid transparent;transition:color .18s,border-color .18s}
body nav.links a:hover{color:var(--c100);border-bottom-color:var(--red)}
body .btn-contact{
  background:var(--red);color:var(--cream)!important;border-radius:0;
  border:1.5px solid var(--red);padding:10px 22px;
}
body .btn-contact:hover{background:transparent;border-color:var(--cream);color:var(--cream)!important}
body .menu-toggle span{background:var(--c88)}

/* about / contact / faq use a slimmer bar */
body .bar{background:var(--grad);border-bottom:1px solid rgba(246,241,233,.14)}
body .bar b{color:var(--c100)}
body .bar small{color:var(--c50)}
body .bar nav a,body .bar a{color:var(--c62)}
body .bar nav a:hover{color:var(--c100)}

/* ─────────────────────────────────────────────
   2 · HEROES  (.hero home · .phero detail · .thero tour)
   ───────────────────────────────────────────── */
body .hero,body .phero,body .thero{background:var(--ground-base);color:var(--cream)}
body .hero-bg,body .phero-bg,body .thero-bg{
  background-color:var(--ground-base);
  background-blend-mode:multiply;
  filter:none;
}
body .hero-bg{background-image:linear-gradient(150deg,rgba(138,26,22,.74) 0%,rgba(34,13,12,.93) 72%),url("img/hero.jpg");
  background-size:cover;background-position:center}
/* detail heroes keep their own inline photo; this lays the ground over it */
body .phero-bg::after,body .thero-bg::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(150deg,rgba(138,26,22,.70) 0%,rgba(34,13,12,.93) 72%);
}
body .phero-bg,body .thero-bg{position:absolute}

body .hero-inner,body .phero-inner,body .thero-inner{padding-bottom:0}
body .hero-inner{padding:78px 28px 0}
body .phero-inner,body .thero-inner{padding-top:60px;padding-bottom:0}

/* corner brackets — quieter */
body .hero .brackets::before,body .hero .brackets::after,
body .phero .brackets::before,body .phero .brackets::after,
body .thero .brackets::before,body .thero .brackets::after{border-color:var(--c22)}

/* eyebrow / kicker */
body .eyebrow,body .kicker,body .hero .eyb,body .ft-faq .eyb{
  font-family:'Barlow Condensed',sans-serif;font-weight:600;
  letter-spacing:.26em;text-transform:uppercase;opacity:1;color:var(--c62);
}
body .hero .eyebrow,body .phero .kicker,body .thero .eyebrow{color:var(--c62)}
body .kicker b{color:var(--red)}
body .rule-sm{background:var(--red)}

body .hero h1,body .phero h1,body .thero h1{color:var(--c100);line-height:.9}
body .hero h1 span,body .phero h1 span,body .thero h1 span{color:var(--red)}
body .hero p,body .phero p,body .thero p{color:var(--c88);opacity:1;max-width:36em}
body .phero .meta,body .thero .meta{color:var(--c62)}
body .phero .meta em,body .phero .venue{color:var(--c88);font-style:normal}
body .thero .meta .k{color:var(--c50);letter-spacing:.2em}
body .thero .meta .v{color:var(--c88)}

/* the one perforation: closes every hero */
body .hero-inner::after,body .phero-inner::after,body .thero-inner::after{
  content:"";display:block;margin-top:54px;
  border-top:1.6px dashed var(--c35);
}
body .hero .hero-inner,body .phero .phero-inner,body .thero .thero-inner{position:relative}
body .hero,body .phero,body .thero{padding-bottom:34px;overflow:visible;position:relative}
/* tear-notches, half off each edge, in the page colour */
body .hero::before,body .hero::after,
body .phero::before,body .phero::after,
body .thero::before,body .thero::after{
  content:"";position:absolute;bottom:17px;width:34px;height:34px;
  border-radius:50%;background:#fff;z-index:6;
}
body .hero::before,body .phero::before,body .thero::before{left:-17px}
body .hero::after,body .phero::after,body .thero::after{right:-17px}

/* hero buttons — square, one solid */
body .cta-primary,body .hero-cta a:first-child{
  background:var(--red);color:var(--cream);border-radius:0;
  border:1.5px solid var(--red);letter-spacing:.16em;
}
body .cta-primary:hover,body .hero-cta a:first-child:hover{background:var(--cream);border-color:var(--cream);color:var(--ground-base)}
body .cta-ghost{border:1.5px solid var(--c35);color:var(--c88);border-radius:0;letter-spacing:.16em;padding:14px 28px}
body .cta-ghost:hover{background:transparent;border-color:var(--cream);color:var(--c100)}

/* ─────────────────────────────────────────────
   3 · SPORT SUB-NAV
   ───────────────────────────────────────────── */
body .sportbar{background:var(--hole);border-bottom:1px solid rgba(246,241,233,.12)}
body .sportbar a{color:var(--c62);letter-spacing:.16em;border-bottom:2px solid transparent}
body .sportbar a:hover{color:var(--c100);border-color:var(--red)}

/* ─────────────────────────────────────────────
   4 · SECTIONS ON THE WORKING SURFACE
   ───────────────────────────────────────────── */
body section.sport,body section.matches,body section.blk,body main{background:#fff}
body .blk.bone,body .band.bone{background:var(--bone)}
body .sport-head h2,body .sec-head h2,body h2.blk,body main h2{color:var(--ink)}
body .sport-head .count,body .sec-head .count{color:var(--red);letter-spacing:.2em}
body .sport-rule,body .sec-rule{height:1.6px;background:var(--ink);margin:12px 0 34px}
body .lede{color:var(--ground-top)}
body h3.tag{color:var(--ink);letter-spacing:.1em}
body .smallprint,body .fineprint,body .disclaimer,body .mapnote,body .inc-note{color:var(--ink45)}

/* ─────────────────────────────────────────────
   5 · TICKET CARDS
   ───────────────────────────────────────────── */
body .tcard{
  background:#fff;border:1px solid var(--line);border-radius:0;
  box-shadow:none;transition:transform .18s,border-color .18s;
}
body .tcard:hover{transform:translateY(-4px);box-shadow:none;border-color:var(--warm-grey)}
body .tcard .top{background:var(--ground-base)}
body .tcard .top .brackets::before,body .tcard .top .brackets::after{border-color:rgba(246,241,233,.6)}
body .tcard .perf{border-top:1.5px dashed rgba(246,241,233,.6)}
body .tcard .notch{background:#fff}
body .tcard .title-over b{text-shadow:0 3px 14px rgba(0,0,0,.6)}
body .tcard .title-over .series{border-color:rgba(246,241,233,.6);letter-spacing:.18em}
body .tcard .stub{padding:16px 18px 18px}
body .tcard .stub .r{border-bottom:.6px solid var(--line)}
body .tcard .stub .r .k{color:var(--ink45);letter-spacing:.18em}
body .tcard .stub .r .v{color:var(--ink)}
body .tcard .stub .mt{color:var(--ink)}
body .tcard .stub .mt .series{color:var(--red);border-color:var(--red);letter-spacing:.16em}
body .tcard .actions a{border-radius:0;letter-spacing:.14em;padding:11px 6px}
body .a-info,body .a-enq{background:var(--red);color:#fff;border:1.5px solid var(--red)}
body .a-info:hover,body .a-enq:hover{background:var(--ink);border-color:var(--ink)}
body .a-fact{border:1.5px solid var(--line);color:var(--ink70)}
body .a-fact:hover{background:var(--ink);border-color:var(--ink);color:#fff}
body .tag-soon{background:var(--red);color:#fff;letter-spacing:.16em}

/* ─────────────────────────────────────────────
   6 · HOTEL / PACKAGE TIERS  — priority in a left border
   ───────────────────────────────────────────── */
body .tier{
  background:#fff;border:1px solid var(--line);border-left:2.6px solid var(--warm-grey);
  border-radius:0;box-shadow:none;overflow:hidden;
}
body .tier.lead{border-left-color:var(--red)}
body .tier .head{background:var(--bone);border-bottom:1px solid var(--line);color:var(--ink)}
body .tier.lead .head{background:var(--bone);color:var(--ink)}
body .tier .head b{color:var(--ink)}
body .tier.lead .head b{color:var(--red)}
body .tier .head small{color:var(--ink45);letter-spacing:.2em}
body .tier .from{color:var(--ink);font-family:'Anton',sans-serif;letter-spacing:.5px}
body .tier.lead .from{color:var(--red)}
body .tier .from small{color:var(--ink45);letter-spacing:.18em;font-family:'Barlow Condensed',sans-serif}
body .tier .hotel{color:var(--ink70)}
body .tier .hotel b,body .tier .hotel strong{color:var(--ink)}
body .tier .body a{background:var(--red);color:#fff;border-radius:0;border:1.5px solid var(--red)}
body .tier .body a:hover{background:var(--ink);border-color:var(--ink)}
body .tier .body a b,body .tier .body a:hover b{color:#fff}
body .tier .cats div{border-bottom:.6px solid var(--line)}
body .tier .cats div b{color:var(--ink)}
body .tier .cats div span,body .tier .cats div small{color:var(--ink45)}
body .hpic{border:1px solid var(--line);border-radius:0}
body .hdesc{color:var(--ink70)}

/* package cards on the tournament pages */
body .pkg{background:#fff;border:1px solid var(--line);border-left:2.6px solid var(--warm-grey);border-radius:0;box-shadow:none}
body .pkg.feat{border-left-color:var(--red)}
body .pkg .ph{background:var(--bone);color:var(--ink);border-bottom:1px solid var(--line)}
body .pkg.feat .ph{background:var(--bone);color:var(--red)}
body .pkg .price{font-family:'Anton',sans-serif;color:var(--ink);letter-spacing:.5px}
body .pkg.feat .price{color:var(--red)}
body .pkg .price small{color:var(--ink45)}
body .pkg .enq{background:var(--red);color:#fff;border-radius:0}
body .pkg .enq:hover{background:var(--ink)}

/* ─────────────────────────────────────────────
   7 · TABLES & DAY-BY-DAY  — three rule weights, no fourth
   ───────────────────────────────────────────── */
body .sched,body table.sched{border-collapse:collapse}
body .sched th,body table.sched th{
  background:transparent;color:var(--ink45);border-bottom:.9px solid var(--ink);
  letter-spacing:.22em;padding:0 16px 10px 0;text-align:left;
}
body .sched td,body table.sched td{
  background:transparent;border-bottom:.6px solid var(--line);color:var(--ink70);padding:13px 16px 13px 0;
}
body table.sched tr:hover td{background:var(--bone)}
body .sched td:first-child,body .sched td.n{color:var(--ink);font-family:'Barlow Condensed',sans-serif;
  font-weight:700;letter-spacing:.12em;text-transform:uppercase}
body .sched tr.grp td,body .grp-row td{background:var(--bone);color:var(--ink)}
body .grp-row.eng td,body .grp-row.ko td{background:var(--cream)}
body .fx-name{color:var(--ink)}

body .days .day{border-bottom:.6px solid var(--line);background:transparent}
body .day .n{color:var(--red);font-family:'Barlow Condensed',sans-serif;font-weight:700;letter-spacing:.12em}
body .day .t{color:var(--ink70)}

/* included / on-request rows */
body .inc .i{border-bottom:.6px solid var(--line);background:transparent}
body .inc .i b{color:var(--ink)}
body .inc .i span.ar{color:var(--red)}
body .inc .i em{font-style:normal;font-family:'Barlow Condensed',sans-serif;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;font-size:12px;padding:5px 11px;border-radius:0}
body .inc .i em.inc-yes{background:var(--red);color:var(--cream)}
body .inc .i em.inc-req{background:transparent;border:1px solid var(--line);color:var(--ink45)}

/* asides, maps, add-ons */
body .aside{background:var(--bone);border:1px solid var(--line);border-radius:0;box-shadow:none}
body .aside .line{border-bottom:.6px solid var(--line)}
body .aside .shot .brackets::before,body .aside .shot .brackets::after{border-color:rgba(246,241,233,.6)}
body .addons li{border-bottom:.6px solid var(--line)}
body .addons li span{color:var(--red)}
body .mapbox,body .mapimg{border:1px solid var(--line);border-radius:0}
body .stats{border-top:1.6px solid var(--ink);border-bottom:.9px solid var(--line)}
body .stat{background:transparent;border:0;border-radius:0}
body .stat .k,body .stat span{color:var(--ink45);letter-spacing:.24em}
body .stat .v,body .stat b{color:var(--ink);font-family:'Anton',sans-serif;letter-spacing:.5px}
body .box{background:var(--cream);border:0;border-left:2.6px solid var(--ground-top);border-radius:0}
body .box .lbl{color:var(--ground-top);letter-spacing:.2em}

/* ─────────────────────────────────────────────
   8 · DARK CTA BANDS
   ───────────────────────────────────────────── */
body .band,body .enq-cta{background:var(--grad);color:var(--cream);border:0}
body .band::after{display:none}
body .band h2,body .enq-cta h3{color:var(--c100)}
body .band p,body .enq-cta p{color:var(--c88)}
body .band a.cta,body .enq-cta a{background:var(--red);color:var(--cream);border-radius:0;border:1.5px solid var(--red);letter-spacing:.16em}
body .band a.cta:hover,body .enq-cta a:hover{background:var(--cream);border-color:var(--cream);color:var(--ground-base)}
body .cta{border-radius:0;letter-spacing:.14em}
body .cta.line{border:1.5px solid currentColor}

body .tournav a{border-radius:0;border:1px solid var(--line);color:var(--ink70);letter-spacing:.14em}
body .tournav a.on,body .tournav a:hover{background:var(--red);border-color:var(--red);color:#fff}
body .backbar{background:var(--bone);border-bottom:1px solid var(--line)}
body .backbtn{border-radius:0;border:1px solid var(--line);color:var(--ink70)}
body .backbtn:hover{background:var(--ink);border-color:var(--ink);color:#fff}
body .factbtn{border-radius:0;border:1.5px solid var(--line);color:var(--ink70)}
body .factbtn:hover{background:var(--ink);border-color:var(--ink);color:#fff}

/* breadcrumb — the transition between surfaces */
body .crumb{background:var(--bone);border-bottom:1px solid var(--line);color:var(--ink45);
  letter-spacing:.16em}
body .crumb a{color:var(--ink45)}
body .crumb a:hover{color:var(--red)}
body .crumb .here{color:var(--ink)}

/* ─────────────────────────────────────────────
   9 · ENQUIRY — the one cream band
   ───────────────────────────────────────────── */
body .enq,body .footpanel{background:var(--cream)}
body .enq h2,body .footpanel h2,body .foot h2{color:var(--ink)}
body .enq p,body .sub-lead{color:var(--ink70)}
body .enq .contacts a,body .contact-line{color:var(--ground-top)}
body .socials a{color:var(--ink)}
body .socials a:hover{color:var(--red)}
body .field label{color:var(--ink45);letter-spacing:.22em}
body .field input,body .field select,body .field textarea{
  border-radius:0;border:1px solid #D6C9C3;background:#fff;
}
body .field input:focus,body .field select:focus,body .field textarea:focus{
  border-color:var(--red);box-shadow:none;outline:2px solid rgba(200,49,42,.25);outline-offset:0;
}
body .signup{background:var(--red);color:var(--cream);border-radius:0;letter-spacing:.16em}
body .signup:hover{background:var(--ink)}
body .thanks{border-radius:0;border:0;border-left:2.6px solid var(--red);background:#fff;color:var(--ink)}

/* ─────────────────────────────────────────────
   10 · FAQ
   ───────────────────────────────────────────── */
body .ft-faq{background:var(--bone);border-top:1px solid var(--line)}
body .ft-faq h2{color:var(--ink)}
body .ft-faq details{border-bottom:.6px solid var(--line);border-radius:0;background:transparent}
body .ft-faq summary{color:var(--ink);font-family:'Barlow Condensed',sans-serif;font-weight:700;letter-spacing:.06em}
body .ft-faq summary::after{color:var(--red)}
body .ft-faq p{color:var(--ink70)}

/* ─────────────────────────────────────────────
   11 · FOOT
   ───────────────────────────────────────────── */
body .totop{background:var(--hole);color:var(--c62);letter-spacing:.2em}
body .totop:hover{color:var(--red)}
body .ft-foot{background:var(--grad);color:var(--c62);border-top:0}
body .ft-foot h4{color:var(--c100);font-family:'Barlow Condensed',sans-serif;letter-spacing:.2em}
body .ft-foot a{color:var(--c62)}
body .ft-foot a:hover{color:var(--c100)}
body .ft-foot li{color:var(--c62)}
body .ft-foot .wordmark{color:var(--c100)}
body .ft-foot .tag{color:var(--c50);letter-spacing:.26em}
body .ft-foot .legal{border-top:.6px solid var(--c22);color:var(--c50)}
body .ft-foot .legal strong{color:var(--c88)}
body .ft-foot .reg{color:var(--c35)}
body footer.baseline{background:var(--hole);color:var(--c50)}

/* ─────────────────────────────────────────────
   12 · DETAIL — focus, selection, tabular figures
   ───────────────────────────────────────────── */
body :focus-visible{outline:2px solid var(--red);outline-offset:2px}
body ::selection{background:var(--red);color:var(--cream)}
body .from,body .price,body .stat .v,body .sched td{font-variant-numeric:tabular-nums}

@media (max-width:640px){
  body .hero-inner{padding:54px 28px 0}
  body .hero-inner::after,body .phero-inner::after,body .thero-inner::after{margin-top:38px}
}

/* ─────────────────────────────────────────────
   13 · BUILD YOUR TRIP — the one literal ticket
   ───────────────────────────────────────────── */
body .ftlogo .txt b{color:var(--c100)}
body .ftlogo .txt b .tp{color:var(--red)}
body .ftlogo .txt small{color:var(--c50);letter-spacing:.42em}
body .crosshair{color:var(--red)}
body header .eyebrow{color:var(--c62)}
body header h1{color:var(--c100)}
body header p.lede{color:var(--c88)}
body .hdr-brackets::before,body .hdr-brackets::after{border-color:var(--c22)}

body .step{background:#fff;border:1px solid var(--line);border-radius:0;box-shadow:none}
body .step.locked{opacity:.5}
body .step-no{color:var(--red);font-family:'Anton',sans-serif}
body .step-hd{border-bottom:1.6px solid var(--ink)}
body .step-hd h2{color:var(--ink)}
body .step-hd .hint{color:var(--ink45);letter-spacing:.18em}
body .note{color:var(--ink45)}

body .opt,body .hcard{
  background:#fff;border:1px solid var(--line);border-left:2.6px solid var(--line);
  border-radius:0;box-shadow:none;
}
body .opt:hover,body .hcard:hover{border-color:var(--warm-grey);box-shadow:none}
body .opt[aria-pressed="true"],body .hcard[aria-pressed="true"]{
  background:var(--bone);border-color:var(--warm-grey);border-left-color:var(--red);box-shadow:none;
}
body .opt .ttl,body .hbody .ttl{color:var(--ink);font-family:'Barlow Condensed',sans-serif;
  font-weight:700;letter-spacing:.08em;text-transform:uppercase}
body .opt .sub,body .hbody .sub,body .opt .kv,body .hbody .kv{color:var(--ink70)}
body .opt .amt,body .hprice{color:var(--ink);font-family:'Anton',sans-serif;letter-spacing:.5px}
body .opt[aria-pressed="true"] .amt,body .hcard[aria-pressed="true"] .hprice{color:var(--red)}
body .opt .amt small,body .hprice small{color:var(--ink45);font-family:'Barlow Condensed',sans-serif;
  letter-spacing:.18em}
body .opt.disabled{opacity:.6}
body .mapwrap,body .hgal img,body .mapimg{border-radius:0}
body .mapwrap{border:1px solid var(--line)}
body .mapwrap .mtop{background:var(--bone);border-bottom:1px solid var(--line);color:var(--ink)}
body .mapwrap .mtop button{border-radius:0;border:1px solid var(--line);color:var(--ink70);background:#fff}
body .rate .rt b{color:var(--ink)}
body .rate .rt span{color:var(--ink45)}
body .rowline{border-color:var(--line)}
body .counter button,body .seg button{border-radius:0;border:1px solid var(--line);background:#fff;color:var(--ink)}
body .counter button:hover,body .seg button:hover{border-color:var(--warm-grey)}
body .seg button[aria-pressed="true"]{background:var(--red);border-color:var(--red);color:#fff}
body .inp input,body .inp textarea{border-radius:0;border:1px solid #D6C9C3}
body .inp input:focus,body .inp textarea:focus{border-color:var(--red);box-shadow:none;
  outline:2px solid rgba(200,49,42,.25)}

/* the summary stub */
body .stub{background:var(--grad);border-radius:0;box-shadow:none;color:var(--c88)}
body .stub .admit{border:1.5px solid var(--c35);color:var(--c88);letter-spacing:.3em}
body .stub h3{color:var(--c100)}
body .stub .meta{color:var(--c62)}
body .sumwrap .perf{border-top:1.6px dashed var(--c35)}
body .sumwrap .perf::before,body .sumwrap .perf::after{background:#fff}
body .sumbody{background:var(--grad);color:var(--c88)}
body .li .l{color:var(--c50)}
body .li .l em{color:var(--c35);font-style:normal}
body .li .r{color:var(--c88);font-variant-numeric:tabular-nums}
body .li.tot{border-top:.6px solid var(--c22)}
body .li.tot .l{color:var(--c62)}
body .li.tot .r{color:var(--c100);font-family:'Anton',sans-serif;letter-spacing:.5px}
body .dep{background:rgba(0,0,0,.22);border-radius:0}
body .dep .dr b{color:var(--c100)}
body .dep .fine{color:var(--c50)}
body .empty{color:var(--c50)}
body .sumwrap .cta{background:var(--red);color:var(--cream);border-radius:0;border:1.5px solid var(--red);
  letter-spacing:.16em}
body .sumwrap .cta:hover{background:var(--cream);border-color:var(--cream);color:var(--ground-base)}
body .sumwrap .cta.ghost{background:transparent;border-color:var(--c35);color:var(--c88)}
body .sumwrap .cta.ghost:hover{border-color:var(--cream);color:var(--c100);background:transparent}
body .mbar{background:var(--grad);border-top:1px solid var(--c22)}
body .mbar .mt{color:var(--c50)}
body .mbar .mv{color:var(--c100);font-family:'Anton',sans-serif}
body .mbar button{background:var(--red);color:var(--cream);border-radius:0;border:0}
body .modal{border-radius:0}
body .modal .mh{border-bottom:1.6px solid var(--ink)}
body .modal .mh h3{color:var(--ink)}
body .chk .cn{color:var(--ink)}
body .chk .cd{color:var(--ink70)}
body .step footer,body .shell footer{background:transparent}

/* ─────────────────────────────────────────────
   14 · CARDS WHOSE ARTWORK CARRIES ITS OWN DEVICES
   The branded 4:5 tiles already have corner brackets, a perforation and the
   cream Field Trip bar baked in. Drawing the card's own on top doubles them.
   ───────────────────────────────────────────── */
body .tcard .top.ft-art .brackets::before,
body .tcard .top.ft-art .brackets::after,
body .tcard .top.ft-art .perf,
body .tcard .top.ft-art .notch{display:none}
body .tcard .top.ft-art .title-over{bottom:14%}

/* aside "The Ground" shot — same artwork, same doubling */
body .aside .shot .brackets::before,
body .aside .shot .brackets::after{display:none}

/* legibility scrim for overlay titles on branded artwork — stops above the
   artwork's own cream Field Trip bar so that bar stays clean */
body .tcard .top.ft-art::after{
  content:"";position:absolute;left:0;right:0;bottom:8.5%;height:56%;
  z-index:1;pointer-events:none;
  background:linear-gradient(to top,rgba(24,9,8,.86) 0%,rgba(24,9,8,.5) 34%,rgba(24,9,8,.12) 66%,transparent 100%);
}
body .tcard .top.ft-art .title-over{z-index:3}

/* ─────────────────────────────────────────────
   15 · TOUR CARDS — title into the empty top block
   The m_sa_* tiles carry their subject in the lower two-thirds and leave the
   top third empty. Sitting the title at the foot buried the players; moving it
   into that empty block uses the space and leaves the photograph clear.
   ───────────────────────────────────────────── */
body section.matches .tcard .top.ft-art .title-over{top:22px;bottom:auto;z-index:3}
body section.matches .tcard .top.ft-art .title-over b{font-size:clamp(20px,2.3vw,27px)}
body section.matches .tcard .top.ft-art::after{
  /* scrim now falls from the top, and still stops clear of the cream bar */
  top:0;bottom:auto;height:42%;
  background:linear-gradient(to bottom,rgba(24,9,8,.82) 0%,rgba(24,9,8,.42) 46%,transparent 100%);
}

/* contrast belt-and-braces: the stub is a working surface, always */
body .tcard,body .tcard .stub{background:#fff}
body .tcard .stub,body .tcard .stub .v,body .tcard .stub .r .v{color:var(--ink)}
body .tcard .stub .k,body .tcard .stub .r .k{color:var(--ink45)}

/* per-tile override: artwork that already fills the top keeps its title at the
   foot, where the frame is quieter */
body section.matches .tcard .top.ft-art.art-foot .title-over{top:auto;bottom:14%}
body section.matches .tcard .top.ft-art.art-foot::after{
  top:auto;bottom:8.5%;height:56%;
  background:linear-gradient(to top,rgba(24,9,8,.86) 0%,rgba(24,9,8,.5) 34%,rgba(24,9,8,.12) 66%,transparent 100%);
}
