/* =====================================================================
   THEME — ites-shenzhen. Everything specific to this fair lives here.
   Mood: a turned steel ring, a red-anodised knurled ring and curls of
   brass swarf on a pale straw bench, the colours of brass and tempered
   tool steel, under the site's own red. One red on the page (the brand
   red of the shared header, and the anodised ring in the photo), kept for
   actions, numbers and link hover; the show hours are drawn in dark
   bronze, solid, because the dates are confirmed.
   ===================================================================== */
:root{
  --g-fair-red:#D71920; --g-fair-red-ink:#B3131A; --g-fair-red-soft:#FBE9E9;
  --g-straw-1:#F7F5E9; --g-straw-2:#EDE8D1; --g-straw-3:#D2C9A5; --g-brass:#A1925E; --g-bronze:#504423; --g-floor:#D7CFA7;
  /* hero backdrop: pale straw, the height-only field of hero-*.webp (it does not change across the frame, so nothing has to line up) */
  --g-hero-bg:linear-gradient(180deg,#EDE8D2 0%,#EBE6CF 10%,#E9E4CB 20%,#E7E1C6 30%,#E5DFC2 40%,#E3DCBE 50%,#E1DAB9 60%,#DED7B5 70%,#DCD4B0 80%,#DAD1AB 90%,var(--g-floor) 100%);
  /* single column: the photo sits below the copy and deepens on its own, so the copy area stays at the photo's top colour */
  --g-hero-bg-m:linear-gradient(180deg,#EEE9D4 0%,#EDE8D2 100%);
  --g-display:"Bricolage Grotesque","Manrope","Readex Pro",system-ui,sans-serif;
  --g-hero-shadow:0 30px 60px -36px rgba(80,68,35,.5);
}
/* 900–1179 px: the copy column leaves too little room for a photo as tall as the hero (the rings would sit under the lede),
   so the photo keeps its own 16:9 shape beside the copy and fades out on all four sides into the same straw */
@media(min-width:900px) and (max-width:1179px){
  .cf-hero .hero-art{top:47%;bottom:auto;width:62%;aspect-ratio:16/9;transform:translateY(-50%)}
  .cf-hero .hero-art img{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%),linear-gradient(180deg,transparent 0,#000 16%,#000 84%,transparent 100%);-webkit-mask-composite:source-in;
    mask-image:linear-gradient(90deg,transparent 0,#000 30%),linear-gradient(180deg,transparent 0,#000 16%,#000 84%,transparent 100%);mask-composite:intersect}
}

/* =====================================================================
   SKELETON — shared by every fair page. Reads only the tokens above.
   ===================================================================== */
:root{
  --g-paper:#FAF8F4; --g-paper-2:#F2EFE8; --g-white:#FFFFFF; --g-ink:#171614; --g-soft:#3E3B36; --g-muted:#726D65; --g-faint:#A8A39A; --g-line:#E5E0D6; --g-line-2:#D1CBBF;
  --g-sans:"Manrope","Readex Pro",system-ui,-apple-system,"Segoe UI",sans-serif;
  --g-wrap:1120px; --g-r:12px; --g-r-s:8px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--g-paper);color:var(--g-ink);font:16px/1.65 var(--g-sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--g-fair-red-ink)}a:hover{color:var(--g-fair-red)}
img{display:block;max-width:100%}
.wrap{max-width:var(--g-wrap);margin:0 auto;padding:0 16px}
@media(min-width:900px){.wrap{padding:0 32px}}
h1,h2,h3{margin:0;font-family:var(--g-display);font-weight:700;letter-spacing:-.02em;line-height:1.1;font-variation-settings:"opsz" 96}
.small{font-size:13px;color:var(--g-muted)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
:focus-visible{outline:2px solid var(--g-fair-red);outline-offset:3px;border-radius:2px}

/* eyebrow, numbers */
.cf-eyebrow{display:inline-flex;align-items:center;gap:10px;line-height:1.35;font:800 11.5px/1.3 var(--g-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--g-muted)}
.cf-eyebrow::before{content:"";width:18px;height:1.5px;background:var(--g-fair-red);flex:none}
.cf-num{font:700 13px/1 var(--g-display);color:var(--g-fair-red);letter-spacing:.04em}

/* ---------- hero ---------- */
.cf-hero{position:relative;overflow:hidden;background:var(--g-hero-bg);color:var(--g-ink)}
.cf-hero .wrap{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr);padding-top:44px;padding-bottom:124px}
.hero-copy{max-width:600px}
.cf-hero .cf-crumbs{font-size:13px;color:var(--g-bronze);margin:0 0 22px;opacity:.9}.cf-hero .cf-crumbs a{color:inherit;text-decoration:none}.cf-hero .cf-crumbs a:hover{text-decoration:underline}
.cf-hero .cf-eyebrow{color:var(--g-bronze)}
.cf-hero h1{font-size:clamp(36px,5.2vw,62px);line-height:1;margin:16px 0 0}
.cf-hero h1 .sub{display:block;font-size:.42em;font-weight:500;letter-spacing:-.005em;color:var(--g-bronze);margin-top:14px;line-height:1.25}
.cf-hero .cf-lede{font-size:clamp(16px,1.35vw,18.5px);color:var(--g-soft);max-width:560px;margin:22px 0 0}
.cf-hero .acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.cf-hero .trust{font-size:13px;color:var(--g-bronze);margin:22px 0 0;opacity:.95}
.hero-art{position:absolute;top:0;inset-inline-end:0;bottom:0;width:min(58%,840px);z-index:0}
.hero-art img{width:100%;height:100%;object-fit:cover;object-position:100% center;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%);mask-image:linear-gradient(90deg,transparent 0,#000 30%)}
@media(max-width:899px){
  .cf-hero{background:var(--g-hero-bg-m)}
  .cf-hero .wrap{padding-top:28px;padding-bottom:0}
  .hero-art{position:relative;width:auto;height:min(80vw,440px);margin:6px -16px 0}
  .hero-art img{object-position:100% 45%;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 18%);mask-image:linear-gradient(180deg,transparent 0,#000 18%)}
  .cf-hero h1{font-size:clamp(34px,10vw,46px)}
}
@media(max-width:640px){.cf-hero .acts .cf-btn{flex:1 1 100%}}

/* buttons */
.cf-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:var(--g-r-s);padding:13px 20px;font:800 15px/1.2 var(--g-sans);text-decoration:none;transition:transform .15s ease,background .15s ease,border-color .15s ease;cursor:pointer}
.cf-btn:active{transform:translateY(1px)}
.cf-btn.primary{background:var(--g-fair-red);color:#fff;box-shadow:0 10px 24px -14px rgba(215,25,32,.6)}.cf-btn.primary:hover{background:var(--g-fair-red-ink);color:#fff}
.cf-btn.ghost{background:rgba(255,255,255,.92);color:var(--g-ink);border:1px solid rgba(23,22,20,.16)}.cf-btn.ghost:hover{border-color:var(--g-ink);color:var(--g-ink)}
.cf-btn .chev{width:14px;height:14px;flex:none}
.cf-btn.block{display:flex;width:100%}

/* ---------- stats band: the organiser's figures for the 2026 show ---------- */
.cf-stats{position:relative;z-index:2;margin-top:-52px}
.cf-stats .cf-band{background:var(--g-white);border:1px solid var(--g-line);border-radius:var(--g-r);box-shadow:var(--g-hero-shadow);display:grid;grid-template-columns:repeat(3,1fr);overflow:hidden}
.cf-stats .st{padding:22px 22px 20px;border-inline-start:1px solid var(--g-line);display:flex;flex-direction:column}
.cf-stats .st:first-child{border-inline-start:0}
.cf-stats b{display:block;font:700 clamp(26px,2.8vw,36px)/1 var(--g-display);letter-spacing:-.03em;color:var(--g-fair-red);font-variant-numeric:tabular-nums}
.cf-stats b small{font-size:.5em;font-weight:600;letter-spacing:0;color:var(--g-muted);margin-inline-start:5px}
.cf-stats span{display:block;font-size:13px;color:var(--g-muted);margin-top:8px;line-height:1.4}
.cf-stats .cap{font-size:12.5px;color:var(--g-muted);margin:10px 4px 0}
/* under 640 px each figure is a row: number left, line right */
@media(max-width:899px){.cf-stats{margin-top:-22px}.cf-stats .st{padding:16px 14px 14px}}
@media(max-width:640px){.cf-stats .cf-band{grid-template-columns:1fr}.cf-stats .st{display:grid;grid-template-columns:136px minmax(0,1fr);align-items:baseline;column-gap:12px;border-inline-start:0;border-top:1px solid var(--g-line);padding:13px 16px}.cf-stats .st:first-child{border-top:0}.cf-stats b{font-size:26px}.cf-stats span{margin-top:0}}

/* ---------- schedule: the four show days hour by hour; Saturday closes at 15:00 and the afternoon goes to a workshop ---------- */
.sched{padding:60px 0 12px}
.sched h2{font-size:clamp(24px,2.6vw,32px);margin-bottom:18px}
.rail{border:1px solid var(--g-line);border-radius:var(--g-r);padding:18px 22px 20px;background:var(--g-white);--g-lab:92px}
.rail-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.rail-top b{font:700 17px var(--g-display);letter-spacing:-.01em}
.rail-top .venue{margin-inline-start:auto;font-size:12.5px;color:var(--g-muted)}
.rail-note{margin:8px 0 0;font-size:14px;color:var(--g-soft);max-width:72ch;line-height:1.5}
/* one label column + eleven hour columns, 8:00 to 19:00; every row and the legs use the same grid */
.hrs,.day,.legs{display:grid;grid-template-columns:var(--g-lab) repeat(11,minmax(0,1fr));column-gap:0}
.hrs{list-style:none;margin:22px 0 8px;padding:0}
.hrs li{grid-row:1;font:500 11.5px/1 var(--g-display);color:var(--g-faint);font-variant-numeric:tabular-nums;transform:translateX(-50%);white-space:nowrap}
.hrs li.on{color:var(--g-ink);font-weight:700}
.day{align-items:center;padding:4px 0}
.day .dl{grid-column:1;font:700 13px/1 var(--g-sans);color:var(--g-ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.day .dl i{font-style:normal;font-weight:600;color:var(--g-muted);margin-inline-end:5px}
.day::before{content:"";grid-column:2/-1;grid-row:1;align-self:center;border-top:1px dashed var(--g-straw-3)}
.bar{grid-row:1;position:relative;z-index:1;height:30px;border-radius:5px;display:flex;align-items:center;justify-content:center;font:800 12px/1 var(--g-sans);letter-spacing:.02em;white-space:nowrap;overflow:hidden;font-variant-numeric:tabular-nums}
.bar.fair{background:var(--g-bronze);color:#fff;transform-origin:left center;animation:grow .7s cubic-bezier(.2,.7,.2,1) .12s both}
.day:nth-of-type(2) .bar.fair{animation-delay:.18s}.day:nth-of-type(3) .bar.fair{animation-delay:.24s}.day:nth-of-type(4) .bar.fair{animation-delay:.3s}
/* the afternoon after the show: dashed, open on the right */
.bar.tail{background:var(--g-straw-1);border:1.5px dashed var(--g-brass);border-inline-end:0;border-radius:0 0 0 0;color:var(--g-bronze);font-weight:700;letter-spacing:0;justify-content:flex-start;padding-inline-start:12px;margin-inline-start:4px;animation:fade .6s ease .6s both}
.bar.tail::after{content:"";position:absolute;top:-2px;bottom:-2px;inset-inline-end:0;width:40%;background:linear-gradient(90deg,rgba(255,255,255,0),var(--g-white) 90%)}
.bar.tail > span{position:relative;z-index:1}
@keyframes grow{from{transform:scaleX(.2);opacity:0}to{transform:none;opacity:1}}
.legs{margin:18px 0 0;padding:18px 0 0;border-top:1px solid var(--g-line)}
.leg{min-width:0;padding-inline-end:24px}
.leg .k{display:block;font:800 11px/1.3 var(--g-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--g-muted)}
.leg .d{display:block;font:700 clamp(20px,2.2vw,26px)/1.1 var(--g-display);letter-spacing:-.02em;color:var(--g-ink);margin:8px 0 6px;font-variant-numeric:tabular-nums}
.leg p{margin:0;font-size:14.5px;color:var(--g-soft);line-height:1.5}
@media(max-width:760px){.legs{display:block}.leg{padding:14px 0 0;margin-top:14px;border-top:1px solid var(--g-line)}.leg:first-child{padding-top:0;margin-top:0;border-top:0}}
@media(max-width:640px){.rail{padding:14px 14px 16px;--g-lab:50px}.rail-top .venue{margin-inline-start:0;flex-basis:100%}.hrs{margin-top:18px}.hrs li{font-size:10.5px}.hrs li span{display:none}.day .dl{font-size:12px}.day .dl i{display:block;margin:0 0 3px;font-size:10px;letter-spacing:.04em;text-transform:uppercase}.bar{height:30px;font-size:10.5px}.bar.tail{padding-inline-start:6px;font-size:10px;white-space:normal;line-height:1.1}}
/* on the narrowest phones the dashed afternoon keeps its shape and the leg below names it */
@media(max-width:359px){.bar.tail > span{display:none}}

.facts{margin:16px 0 0;border:1px solid var(--g-line);border-radius:var(--g-r);padding:6px 22px;display:grid;grid-template-columns:1fr 1fr;column-gap:40px;background:var(--g-white)}
.facts div{display:grid;grid-template-columns:96px 1fr;gap:14px;padding:12px 0;border-top:1px solid var(--g-line);font-size:14.5px}
.facts div:nth-child(-n+2){border-top:0}
.facts dt{color:var(--g-muted);font-weight:700;font-size:12.5px;letter-spacing:.04em;text-transform:uppercase;padding-top:2px}
.facts dd{margin:0;color:var(--g-soft)}
.facts dd .small{display:block;margin-top:2px}
.facts .foot{grid-column:1/-1;border-top:1px solid var(--g-line);padding:12px 0 10px;font-size:12.5px;color:var(--g-muted);display:block}
@media(max-width:899px){.facts{grid-template-columns:1fr;padding:4px 18px}.facts div:nth-child(2){border-top:1px solid var(--g-line)}.facts div{grid-template-columns:96px 1fr}}

/* ---------- body: prose + booking aside ---------- */
.body{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:56px;align-items:start;padding-top:56px;padding-bottom:24px}
@media(max-width:959px){.body{grid-template-columns:1fr;gap:40px}}
.sec{padding:22px 0 10px;border-top:1px solid var(--g-line)}
.sec:first-child{border-top:0;padding-top:0}
.sec .cf-num{display:block;margin-bottom:10px}
.sec h2{font-size:clamp(24px,2.6vw,32px);margin-bottom:12px;max-width:32ch}
.sec p{color:var(--g-soft);font-size:16.5px;max-width:68ch;margin:0 0 14px}

/* the two names of one show, side by side like two nameplates */
.names{display:grid;grid-template-columns:minmax(0,1fr) 28px minmax(0,1fr);align-items:stretch;margin:6px 0 18px;max-width:560px}
.cf-plate{border:1px solid var(--g-straw-3);border-radius:8px;background:var(--g-straw-1);padding:12px 16px 13px;min-width:0}
.cf-plate .k{display:block;font:800 10.5px/1.3 var(--g-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--g-bronze)}
.cf-plate b{display:block;font:700 26px/1.05 var(--g-display);letter-spacing:-.02em;color:var(--g-ink);margin:6px 0 4px}
.cf-plate b small{font:500 15px/1 system-ui,sans-serif;letter-spacing:0;color:var(--g-muted);margin-inline-start:8px}
.cf-plate span{display:block;font-size:13.5px;color:var(--g-soft);line-height:1.4}
.names .to{align-self:center;justify-self:center;width:14px;height:14px;color:var(--g-brass)}
[dir=rtl] .names .to{transform:scaleX(-1)}
@media(max-width:400px){.cf-plate{padding:11px 12px}.cf-plate b{font-size:22px}.cf-plate b small{display:block;margin:5px 0 0}.names{grid-template-columns:minmax(0,1fr) 22px minmax(0,1fr)}}

.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:4px 0 18px;padding:0;list-style:none;counter-reset:s}
.steps li{counter-increment:s;background:var(--g-straw-1);border:1px solid var(--g-straw-2);border-radius:10px;padding:12px 14px 12px 44px;position:relative;font-size:14px;color:var(--g-soft);line-height:1.45}
.steps li::before{content:counter(s,decimal-leading-zero);position:absolute;inset-inline-start:14px;top:12px;font:700 13px/1.5 var(--g-display);color:var(--g-fair-red)}
.steps li b{display:block;color:var(--g-ink);font-weight:800;font-size:13.5px}
@media(max-width:640px){.steps{grid-template-columns:1fr}}

/* the spec terms that have to come across exactly, grouped */
.specs{margin:2px 0 20px;border-top:1px solid var(--g-line)}
.specs > div{display:grid;grid-template-columns:112px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--g-line)}
.specs .lbl{font:800 11px/1.3 var(--g-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--g-bronze);padding-top:6px}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin:0}
.tags span{font-size:13px;font-weight:600;color:var(--g-soft);background:var(--g-straw-1);border:1px solid var(--g-straw-2);border-radius:6px;padding:4px 9px;line-height:1.45}
@media(max-width:560px){.specs > div{grid-template-columns:1fr;gap:8px}.specs .lbl{padding-top:0}}

/* one list for every stand: the questions down the side, a column for each supplier, filled in at the booth and compared in the evening */
.cmp{width:100%;border-collapse:separate;border-spacing:0;margin:0 0 20px;border:1px solid var(--g-line);border-radius:10px;background:var(--g-white);overflow:hidden;font-size:14px}
.cmp caption{caption-side:top;text-align:start;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--g-muted);padding:2px 0 10px}
.cmp th,.cmp td{padding:9px 12px;border-top:1px solid var(--g-line);text-align:start;vertical-align:top;line-height:1.4}
.cmp thead th{border-top:0;background:var(--g-straw-1);font:800 10.5px/1.3 var(--g-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--g-bronze);padding-top:10px;padding-bottom:9px}
.cmp tbody th{font-weight:600;color:var(--g-soft);width:52%}
.cmp td{border-inline-start:1px solid var(--g-line);position:relative}
.cmp td::after{content:"";position:absolute;inset-inline-start:12px;inset-inline-end:12px;bottom:10px;border-bottom:1px dotted var(--g-straw-3)}
.cmp thead th + th{border-inline-start:1px solid var(--g-line);text-align:center}
/* on a phone the supplier columns show only their number (the caption names them); the word stays for screen readers */
@media(max-width:480px){.cmp thead th span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}
@media(max-width:560px){.cmp{font-size:13px}.cmp caption{caption-side:top;text-align:start;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--g-muted);padding:2px 0 10px}
.cmp th,.cmp td{padding:8px 8px}.cmp tbody th{width:auto}.cmp thead th{font-size:9.5px;letter-spacing:.06em}.cmp td{width:17%}.cmp td::after{inset-inline-start:8px;inset-inline-end:8px}}

.route{display:grid;grid-template-columns:repeat(4,minmax(0,170px));gap:14px;margin:6px 0 20px;padding:0;list-style:none;position:relative;max-width:722px}
.route::before{content:"";position:absolute;inset-inline-start:12px;inset-inline-end:12px;top:11px;height:2px;background:repeating-linear-gradient(90deg,var(--g-brass) 0 8px,transparent 8px 14px);opacity:.7}
.route li{position:relative;padding-top:30px}
.route li::before{content:"";position:absolute;inset-inline-start:0;top:2px;width:20px;height:20px;border-radius:50%;background:var(--g-white);border:5px solid var(--g-fair-red);box-sizing:border-box}
.route li.here::before{background:var(--g-bronze);border-color:var(--g-bronze)}
.route b{display:block;font:700 18px/1.1 var(--g-display);letter-spacing:-.02em}
.route small{display:block;font-size:12px;color:var(--g-muted);letter-spacing:.04em;text-transform:uppercase;font-weight:700;margin:3px 0 5px}
.route span{font-size:14px;color:var(--g-soft);display:block;line-height:1.45}
.route-lbl{display:block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--g-muted);margin:4px 0 10px}
@media(max-width:640px){.route{grid-template-columns:1fr;gap:16px;padding-inline-start:34px}.route::before{inset-inline-start:9px;inset-inline-end:auto;top:8px;bottom:8px;width:2px;height:auto;background:repeating-linear-gradient(180deg,var(--g-brass) 0 8px,transparent 8px 14px)}.route li{padding-top:0}.route li::before{inset-inline-start:-34px;top:0}}

/* aside */
aside{position:sticky;top:16px}
.book{background:var(--g-white);border:1px solid var(--g-line);border-radius:var(--g-r);overflow:hidden;box-shadow:0 24px 50px -40px rgba(23,22,20,.5)}
.book-head{background:var(--g-fair-red);color:#fff;padding:18px 20px 16px}
.book-head .cf-eyebrow{color:#fff;opacity:.9}.book-head .cf-eyebrow::before{background:#fff}
.book-head strong{display:block;font:700 20px/1.15 var(--g-display);letter-spacing:-.02em;margin-top:8px}
.book-head span{display:block;font-size:13px;opacity:.9;margin-top:4px}
.book-body{padding:16px 20px 20px}
.rates{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:14px}
/* a long language name (in any page language) pushes its price onto a second line instead of out of the box */
.rates li{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;column-gap:6px;padding:7px 0;border-bottom:1px solid var(--g-line);font-size:13.5px;color:var(--g-soft);min-width:0}
.rates li b{margin-inline-start:auto;font:700 14.5px var(--g-display);color:var(--g-ink);font-variant-numeric:tabular-nums;letter-spacing:-.01em;white-space:nowrap}
.rates li b small{font:600 10.5px var(--g-sans);color:var(--g-muted);margin-inline-start:2px}
.book .small{margin:12px 0 0}
.book .acts{margin-top:14px;display:grid;gap:8px}
.book .cf-btn.ghost{background:var(--g-white)}
@media(max-width:959px){aside{position:static}}
@media(max-width:400px){.rates{column-gap:12px}}

/* ---------- FAQ ---------- */
.faqs{padding:12px 0 8px}
.faqs h2{font-size:clamp(24px,2.6vw,32px);margin-bottom:14px}
.qa{border-top:1px solid var(--g-line)}
.qa:last-of-type{border-bottom:1px solid var(--g-line)}
.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;font-weight:800;font-size:16px;color:var(--g-ink)}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"";flex:none;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--g-line-2);background:
  linear-gradient(var(--g-fair-red),var(--g-fair-red)) center/10px 1.5px no-repeat,
  linear-gradient(var(--g-fair-red),var(--g-fair-red)) center/1.5px 10px no-repeat;transition:transform .25s ease}
.qa[open] summary::after{transform:rotate(45deg)}
.qa p{margin:0 0 18px;color:var(--g-soft);max-width:68ch;font-size:15.5px}

/* ---------- other fairs ---------- */
.others{padding:40px 0 72px}
.others h2{font-size:clamp(22px,2.4vw,28px);margin-bottom:10px}
.cf-list{list-style:none;padding:0;margin:0;border-top:1px solid var(--g-line)}
.cf-list li{border-bottom:1px solid var(--g-line);padding:14px 0;display:grid;grid-template-columns:170px 1fr;gap:16px;align-items:baseline}
.cf-list .when{font:700 15px var(--g-display);font-variant-numeric:tabular-nums;color:var(--g-ink);letter-spacing:-.01em}
.cf-list a{color:var(--g-ink);font-weight:700;text-decoration:none}.cf-list a:hover{color:var(--g-fair-red)}
.cf-list .meta{font-size:13.5px;color:var(--g-muted);display:block}
@media(max-width:560px){.cf-list li{grid-template-columns:1fr;gap:2px}}

/* ---------- mobile booking bar ---------- */
.mbar{display:none}
@media(max-width:959px){
  .mbar{display:flex;gap:8px;position:fixed;inset-inline-start:0;inset-inline-end:0;bottom:0;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(250,248,244,.96);backdrop-filter:saturate(1.4) blur(8px);border-top:1px solid var(--g-line);z-index:9}
  .mbar a{flex:1;text-align:center;border-radius:var(--g-r-s);padding:13px 8px;font:800 15px/1.2 var(--g-sans);text-decoration:none}
  .mbar .b{background:var(--g-fair-red);color:#fff;flex:1.4}.mbar .w{border:1px solid var(--g-line-2);color:var(--g-ink);background:var(--g-white)}
  body.has-mbar footer{padding-bottom:96px}
}

/* ---------- entrance motion ---------- */
.hero-copy > *{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
.hero-copy > :nth-child(2){animation-delay:.06s}.hero-copy > :nth-child(3){animation-delay:.12s}.hero-copy > :nth-child(4){animation-delay:.18s}.hero-copy > :nth-child(5){animation-delay:.24s}.hero-copy > :nth-child(6){animation-delay:.3s}
.hero-art{animation:fade 1s ease both}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

[dir=rtl] .hero-art img{transform:scaleX(-1)}