/* Site-wide Match night layer. Loaded by every page after its own styles. */

/* Karantina and Heebo are self-hosted (OFL) and preloaded. font-display:
   optional means a font that misses first paint waits for the next page
   instead of swapping in and shifting the layout. */
@font-face { font-family: 'Karantina'; font-style: normal; font-weight: 700; font-display: optional; src: url('/assets/fonts/karantina-700-hebrew.woff2') format('woff2'); unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; }
@font-face { font-family: 'Karantina'; font-style: normal; font-weight: 700; font-display: optional; src: url('/assets/fonts/karantina-700-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Heebo'; font-style: normal; font-weight: 400 700; font-display: optional; src: url('/assets/fonts/heebo-hebrew.woff2') format('woff2'); unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; }
@font-face { font-family: 'Heebo'; font-style: normal; font-weight: 400 700; font-display: optional; src: url('/assets/fonts/heebo-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --mn-ink: #2C1F18;
  --mn-ink-body: #4A3F36;
  --mn-ink-muted: #6B5E54;
  --mn-cream: #F4F3F1;
  --mn-surface: #FFFFFF;
  --mn-gold: #C9A876;
  --mn-bronze: #A8814C;
  --mn-pitch: #5A7A4C;
  --mn-pitch-deep: #4F6C43;
  --mn-night: #1F1612;
  --mn-night-deep: #171310;
  --mn-on-night: rgba(255, 255, 255, 0.86);
  --mn-on-night-muted: rgba(255, 255, 255, 0.6);
  --mn-night-line: rgba(255, 255, 255, 0.14);
  --mn-ease-press: cubic-bezier(0.32, 0.72, 0, 1);
  --mn-chalk: rgba(255, 255, 255, 0.8);
  --mn-line: rgba(44, 31, 24, 0.16);
  --mn-display: 'Karantina', 'Geist', sans-serif;
  --mn-text: 'Geist', -apple-system, BlinkMacSystemFont, sans-serif;
  --mn-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --mn-gutter: clamp(16px, 4vw, 32px);
}
html[lang="he"] {
  --mn-display: 'Karantina', 'Heebo', sans-serif;
  --mn-text: 'Heebo', 'Geist', sans-serif;
  --font: 'Heebo', 'Geist', sans-serif; /* shared.css and page styles read --font */
}
html[lang="he"] body { font-family: var(--mn-text); }

/* ── Layout ── */
.mn-wrap { max-width: 1200px; margin-inline: auto; padding-inline: var(--mn-gutter); }
.mn-section { padding-block: clamp(56px, 9vw, 112px); }
.mn-halfway + .mn-section { padding-top: clamp(24px, 4vw, 48px); }

/* Halfway line with the centre circle: the divider between sections. */
.mn-halfway { position: relative; height: 80px; max-width: 1200px; margin-inline: auto; }
.mn-halfway::before {
  content: ""; position: absolute; inset-inline: var(--mn-gutter); top: 50%;
  border-top: 1.5px solid var(--mn-line);
}
.mn-halfway::after {
  content: ""; position: absolute; top: 50%; left: 50%;
  width: 80px; height: 80px; border: 1.5px solid var(--mn-line); border-radius: 50%;
  transform: translate(-50%, -50%);
}

/* ── Type ── */
.mn-display {
  font-family: var(--mn-display); font-weight: 700; color: var(--mn-ink);
  font-size: clamp(3.75rem, 10vw, 7.5rem); line-height: 0.84; letter-spacing: -0.005em;
}
.mn-h2 {
  font-family: var(--mn-display); font-weight: 700; color: var(--mn-ink);
  font-size: clamp(2.75rem, 7vw, 4.75rem); line-height: 0.9; letter-spacing: -0.003em;
  max-width: 10em; margin-bottom: clamp(28px, 4vw, 48px);
}
.mn-lede {
  font-size: clamp(1.05rem, 1.6vw, 1.25rem); line-height: 1.55; color: var(--mn-ink-body);
  max-width: 34ch; margin: 22px 0 28px;
}
.mn-note { font-size: 0.875rem; color: var(--mn-ink-muted); margin-top: 14px; }

/* ── Links and badges: press feedback, hover only where hover exists ── */
.mn-link {
  font-weight: 600; color: var(--mn-ink);
  text-decoration: underline; text-decoration-color: var(--mn-gold);
  text-decoration-thickness: 2px; text-underline-offset: 5px;
}
body .mn-badges { justify-content: flex-start; flex-direction: row; align-items: center; }
body .store-badge,
.mn-link {
  display: inline-flex;
  transition: transform 120ms var(--mn-ease-out), background-color 200ms var(--mn-ease-out), text-decoration-color 200ms var(--mn-ease-out);
}
body .store-badge:hover { transform: none; }
body .store-badge-primary:hover { box-shadow: var(--shadow-btn); }
body .store-badge-secondary:hover { border-color: var(--divider); background: var(--surface); }
@media (hover: hover) and (pointer: fine) {
  body .store-badge:hover { transform: translateY(-1px); }
  body .store-badge-primary:hover { box-shadow: var(--shadow-raised); }
  body .store-badge-secondary:hover { border-color: var(--bronze); background: var(--surface-soft); }
  .mn-link:hover { text-decoration-color: var(--mn-ink); }
}
body .store-badge:active,
.mn-link:active { transform: scale(0.97); transition-timing-function: cubic-bezier(0.32, 0.72, 0, 1); }

/* ── Footer: plain gaps instead of dot separators ── */
body .footer-links { gap: 8px 22px; }
body .footer-links li::after { content: none; }
body .footer-copy { color: var(--mn-ink-muted); }

/* ── Night ── */
.mn-night { position: relative; background: var(--mn-night); color: var(--mn-on-night); }
.mn-night::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0.07;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23g)'/%3E%3C/svg%3E");
  background-size: 160px 160px;
}
.mn-night > * { position: relative; }
.mn-night > .mn-lights, .mn-night > .mn-final-lines { position: absolute; }
.mn-night .mn-display, .mn-night .mn-h2 { color: #fff; }
.mn-night .mn-lede { color: var(--mn-on-night); }
.mn-night .mn-note { color: var(--mn-on-night-muted); }
.mn-night .mn-link { color: #fff; }
.mn-night .store-badge-primary { background: var(--mn-gold); color: var(--mn-ink); box-shadow: none; }
.mn-night .store-badge-secondary { background: rgba(255, 255, 255, 0.06); color: #fff; border-color: rgba(255, 255, 255, 0.28); }

/* Floodlights: four corner pools with a lamp bank each (lit; the homepage animates them). */
.mn-lights { position: absolute; inset: 0; pointer-events: none; }
.mn-light { position: absolute; inset: 0; }
.mn-light:nth-child(1) { --n: 0; background: radial-gradient(55% 80% at 0% 0%, rgba(255, 241, 210, 0.32), rgba(255, 241, 210, 0) 70%); }
.mn-light:nth-child(2) { --n: 1; background: radial-gradient(55% 80% at 100% 0%, rgba(255, 241, 210, 0.32), rgba(255, 241, 210, 0) 70%); }
.mn-light:nth-child(3) { --n: 2; background: radial-gradient(55% 80% at 0% 100%, rgba(255, 241, 210, 0.2), rgba(255, 241, 210, 0) 70%); }
.mn-light:nth-child(4) { --n: 3; background: radial-gradient(55% 80% at 100% 100%, rgba(255, 241, 210, 0.2), rgba(255, 241, 210, 0) 70%); }
.mn-light::before {
  content: ""; position: absolute; width: 36px; height: 10px;
  background: radial-gradient(circle, #FFF8E6 0 3px, rgba(255, 246, 223, 0.35) 3.5px, transparent 5px) 0 50% / 12px 10px repeat-x;
}
.mn-light:nth-child(1)::before { top: 16px; left: 16px; }
.mn-light:nth-child(2)::before { top: 16px; right: 16px; }
.mn-light:nth-child(3)::before { bottom: 16px; left: 16px; }
.mn-light:nth-child(4)::before { bottom: 16px; right: 16px; }

/* Screens sit in a glass tray */
.mn-frame { display: block; padding: 6px; border-radius: 28px; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.1); box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.12); margin-top: 16px; }
.mn-frame img { display: block; width: 100%; height: auto; border-radius: 22px; border: 0; box-shadow: none; margin: 0; }

@keyframes mn-pop {
  from { opacity: 0; transform: translateY(6px) scale(0.94); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* ── Nav: a floating pill; light text over night sections (body.mn-nav-dark, set by site.js) ── */
.site-nav {
  top: 12px; left: var(--mn-gutter); right: var(--mn-gutter); height: 60px;
  max-width: 1200px; margin-inline: auto; border-radius: 999px; border: 1px solid transparent;
  transition: background-color 200ms var(--mn-ease-out), border-color 200ms var(--mn-ease-out);
}
.site-nav .container { padding: 0 8px 0 18px; }
.site-nav .nav-inner { height: 60px; }
.site-nav.nav-solid { background: rgba(244, 243, 241, 0.82); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-color: rgba(44, 31, 24, 0.08); }
.mn-nav-dark .site-nav.nav-solid { background: rgba(31, 22, 18, 0.72); border-color: rgba(255, 255, 255, 0.08); }
.mn-nav-dark .site-nav .nav-links:not(.open) a { color: rgba(255, 255, 255, 0.82); }
.mn-nav-dark .site-nav .nav-links:not(.open) a:hover { color: #fff; }
.mn-nav-dark .site-nav .nav-login-link, .mn-nav-dark .site-nav .nav-toggle { color: #fff; }
.mn-nav-dark .site-nav .nav-cta .btn-primary { background: var(--mn-gold); color: var(--mn-ink); box-shadow: none; }
.nav-toggle line { transform-origin: 12px 12px; transition: transform 220ms var(--mn-ease-out), opacity 160ms var(--mn-ease-out); }
.nav-toggle[aria-expanded="true"] line:nth-child(1) { transform: translateY(5.25px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] line:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] line:nth-child(3) { transform: translateY(-5.25px) rotate(-45deg); }
.nav-links.open > li { animation: mn-pop 260ms var(--mn-ease-out) calc(var(--k, 0) * 40ms) both; }
.nav-links.open > li:nth-child(2) { --k: 1; } .nav-links.open > li:nth-child(3) { --k: 2; }
.nav-links.open > li:nth-child(4) { --k: 3; } .nav-links.open > li:nth-child(5) { --k: 4; }
.nav-links.open > li:nth-child(6) { --k: 5; } .nav-links.open > li:nth-child(7) { --k: 6; }
.nav-links.open > li:nth-child(n+8) { --k: 7; }

/* ═══ Pages: the families of sections the other pages already use ═══ */

/* Pages that open on a night hero: the hero clears the floating nav itself. */
body:has(:is(.page-hero, .sport-hero, .vs-hero, .hub-hero, .loc-hero, .blog-index-hero, .blog-article-hero)) { padding-top: 0; }
body .site-nav:not(.nav-solid) { background: transparent; border-bottom-color: transparent; }

/* Night heroes: left-aligned, grain, two lit corner floodlights. */
:is(.page-hero, .sport-hero, .vs-hero, .hub-hero, .loc-hero, .blog-index-hero, .blog-article-hero) {
  position: relative; overflow: hidden; text-align: start; color: var(--mn-on-night);
  background:
    radial-gradient(70% 90% at 0% 0%, rgba(255, 241, 210, 0.3), rgba(255, 241, 210, 0) 72%),
    radial-gradient(70% 90% at 100% 0%, rgba(255, 241, 210, 0.3), rgba(255, 241, 210, 0) 72%),
    var(--mn-night);
  padding: calc(72px + clamp(40px, 7vw, 88px)) 0 clamp(48px, 7vw, 88px);
}
:is(.page-hero, .sport-hero, .vs-hero, .hub-hero, .loc-hero, .blog-index-hero, .blog-article-hero, .dl-cta, .about-cta, .vs-cta, .hub-cta, .blog-cta, .bottom-cta)::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0.07;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23g)'/%3E%3C/svg%3E");
  background-size: 160px 160px;
}
:is(.page-hero, .sport-hero, .vs-hero, .hub-hero, .loc-hero, .blog-index-hero, .blog-article-hero, .dl-cta, .about-cta, .vs-cta, .hub-cta, .blog-cta, .bottom-cta) > * { position: relative; }
:is(.page-hero, .sport-hero, .vs-hero, .hub-hero, .loc-hero, .blog-index-hero, .blog-article-hero) h1 {
  font-family: var(--mn-display); font-weight: 700; color: #fff;
  font-size: clamp(3rem, 8vw, 6rem); line-height: 0.88; letter-spacing: -0.005em;
  max-width: 14em; margin-inline: 0; text-align: start;
}
/* p.hero-sub inside :is() lifts this past shared.css ".page-hero p.hero-sub { margin: 0 auto }". */
:is(.page-hero, .sport-hero, .vs-hero, .hub-hero, .loc-hero, .blog-index-hero, .blog-article-hero) :is(p, p.hero-sub) {
  color: var(--mn-on-night); margin-inline: 0 !important; max-width: 40ch; text-align: start;
}
/* No load choreography outside the homepage (shared.css slides .hero-sub in). */
:is(.page-hero, .sport-hero, .vs-hero, .hub-hero, .loc-hero, .blog-index-hero, .blog-article-hero) .hero-sub { animation: none; }
/* !important: 84 templates centre the badges with style="". */
:is(.page-hero, .sport-hero, .vs-hero, .hub-hero, .loc-hero, .blog-index-hero, .blog-article-hero, .dl-cta, .about-cta, .vs-cta, .hub-cta, .blog-cta, .bottom-cta) :is(.store-badges, .about-cta-btns) { justify-content: flex-start !important; align-items: flex-start; }
:is(.page-hero, .sport-hero, .vs-hero, .hub-hero, .loc-hero, .blog-index-hero, .blog-article-hero, .dl-cta, .about-cta, .vs-cta, .hub-cta, .blog-cta, .bottom-cta) .store-badge-primary { background: var(--mn-gold); color: var(--mn-ink); box-shadow: none; }
:is(.page-hero, .sport-hero, .vs-hero, .hub-hero, .loc-hero, .blog-index-hero, .blog-article-hero, .dl-cta, .about-cta, .vs-cta, .hub-cta, .blog-cta, .bottom-cta) .store-badge-secondary { background: rgba(255, 255, 255, 0.06); color: #fff; border-color: rgba(255, 255, 255, 0.28); }

/* Night closing sections: the homepage's chalk pitch lines, four lit floodlights and their lamp banks. */
:is(.dl-cta, .about-cta, .vs-cta, .hub-cta, .blog-cta, .bottom-cta) {
  position: relative; overflow: hidden; text-align: start; color: var(--mn-on-night);
  padding-block: clamp(80px, 12vw, 160px);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 600' preserveAspectRatio='xMidYMid slice'%3E%3Cg fill='none' stroke='rgba(255,255,255,0.16)' stroke-width='2'%3E%3Crect x='40' y='40' width='1120' height='520'/%3E%3Cline x1='600' y1='40' x2='600' y2='560'/%3E%3Ccircle cx='600' cy='300' r='90'/%3E%3Crect x='40' y='170' width='150' height='260'/%3E%3Crect x='1010' y='170' width='150' height='260'/%3E%3C/g%3E%3C/svg%3E") center / cover no-repeat,
    radial-gradient(55% 80% at 0% 0%, rgba(255, 241, 210, 0.3), rgba(255, 241, 210, 0) 70%),
    radial-gradient(55% 80% at 100% 0%, rgba(255, 241, 210, 0.3), rgba(255, 241, 210, 0) 70%),
    radial-gradient(55% 80% at 0% 100%, rgba(255, 241, 210, 0.18), rgba(255, 241, 210, 0) 70%),
    radial-gradient(55% 80% at 100% 100%, rgba(255, 241, 210, 0.18), rgba(255, 241, 210, 0) 70%),
    var(--mn-night);
}
:is(.dl-cta, .about-cta, .vs-cta, .hub-cta, .blog-cta, .bottom-cta)::after {
  content: ""; position: absolute; inset: 16px; pointer-events: none;
  --mn-bank: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='10'%3E%3Cg fill='%23FFF6DF' fill-opacity='.35'%3E%3Ccircle cx='6' cy='5' r='5'/%3E%3Ccircle cx='18' cy='5' r='5'/%3E%3Ccircle cx='30' cy='5' r='5'/%3E%3C/g%3E%3Cg fill='%23FFF8E6'%3E%3Ccircle cx='6' cy='5' r='3'/%3E%3Ccircle cx='18' cy='5' r='3'/%3E%3Ccircle cx='30' cy='5' r='3'/%3E%3C/g%3E%3C/svg%3E");
  background: var(--mn-bank) left top no-repeat, var(--mn-bank) right top no-repeat, var(--mn-bank) left bottom no-repeat, var(--mn-bank) right bottom no-repeat;
}
:is(.dl-cta, .about-cta, .vs-cta, .hub-cta, .blog-cta, .bottom-cta) h2 {
  font-family: var(--mn-display); font-weight: 700; color: #fff;
  font-size: clamp(2.75rem, 8vw, 5.5rem); line-height: 0.9; max-width: 12em; margin-inline: 0; text-align: start;
}
:is(.dl-cta, .about-cta, .vs-cta, .hub-cta, .blog-cta, .bottom-cta) p { color: var(--mn-on-night); margin-inline: 0; max-width: 40ch; text-align: start; }

/* Headings in daylight sections. Specificity (0,1,3) is deliberate: it beats the pages' own
   ".section h2" rules. Anything with its own display size goes in the :not(). */
main h2:not(.mn-h2, .mn-display, .policy h2, :is(.dl-cta, .about-cta, .vs-cta, .hub-cta, .blog-cta, .bottom-cta) h2),
.vs-main h2 {
  font-family: var(--mn-display); font-weight: 700; color: var(--mn-ink);
  font-size: clamp(2.25rem, 5.5vw, 3.75rem); line-height: 0.92; letter-spacing: -0.003em;
}
:is(.section-header, .section-header.centered) { text-align: start; }
:is(.section-header, .section-header.centered) :is(h2, p) { margin-inline: 0; }

/* Removed template habits. */
.section-label { display: none !important; }
.accent { color: inherit !important; }
.reveal, .reveal.visible { opacity: 1 !important; transform: none !important; transition: none !important; }

/* Card rows become ruled lists. */
:is(.pain-card, .solve-card, .topic-card) {
  background: none; border: 0; border-top: 1px solid var(--mn-line); border-radius: 0; box-shadow: none;
  padding: 22px 0 18px;
}
:is(.pain-card, .solve-card, .topic-card):hover { transform: none; box-shadow: none; }
:is(.pain-grid, .solve-grid, .topics-grid) { gap: 0 clamp(24px, 4vw, 48px); }
:is(.pain-card, .solve-card, .topic-card) h3 { font-size: 1.05rem; color: var(--mn-ink); }
.pain-icon { background: none; border: 0; width: auto; height: auto; padding: 0; margin-bottom: 8px; color: var(--mn-bronze); }
.solve-num { display: none; }
/* The features rows are not a sequence, so their 01–04 markers go too. */
.feature-num { display: none; }
/* Support's checklist: a ruled two-column list. */
.include-list { gap: 0 clamp(24px, 4vw, 48px); }
.include-list li { background: none; border: 0; border-top: 1px solid var(--mn-line); border-radius: 0; padding: 14px 0; }

/* Screens sit in the glass tray. */
.screen-phone { background: rgba(44, 31, 24, 0.05); border-radius: 28px; padding: 6px; box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.6), 0 0 0 1px rgba(44, 31, 24, 0.1); }
.screen-phone::before, .screen-phone::after { content: none; }
.screen-phone:hover { transform: none; }
.screen-phone img { border-radius: 22px; }
.screen-phone { max-width: 100%; }
.screen-phone .screen-display { max-width: 100%; height: auto; }
.screen-phone .screen-display img { width: 100%; height: auto; }
@media (max-width: 380px) { .screen-phone .screen-display.lg { width: 196px; } }

/* FAQs: the homepage's plain ruled list. */
:is(.faq-simple, .vs-faq, .hub-faq) :is(details, .vs-faq-item, .hub-faq-item) {
  background: none; border: 0; border-bottom: 1px solid var(--mn-line); border-radius: 0; box-shadow: none;
  padding: 0; margin: 0; overflow: visible;
}
.faq-simple { gap: 0; border-top: 2px solid var(--mn-ink); }
:is(.vs-faq-item, .hub-faq-item) { padding: 20px 0 !important; }
.faq-simple summary { padding: 20px 0; }
.faq-simple .faq-body { padding: 0 0 20px; color: var(--mn-ink-body); }
.faq-simple details[open] .faq-body { animation: mn-settle 220ms var(--mn-ease-out); }
@keyframes mn-settle { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* Comparison tables: daylight, Wapp column marked by a gold rule. */
.vs-table { background: none; box-shadow: none; border-radius: 0; }
.vs-table thead th { background: none; color: var(--mn-ink); border-bottom: 2px solid var(--mn-ink); }
.vs-table tbody tr:nth-child(even) { background: none; }
.vs-table tbody :is(th, td) { border-bottom: 1px solid var(--mn-line); }
.vs-table :is(.vs-wapp-col, .vs-wapp-cell) { background: none; color: var(--mn-ink); border-inline-start: 2px solid var(--mn-gold); }

/* Cross-links, related posts, city links: ruled lists. */
.cross-link { background: none; border: 0; border-bottom: 1px solid var(--mn-line); border-radius: 0; box-shadow: none; padding: 14px 0; }
.cross-link:hover { transform: none; box-shadow: none; }

/* Blog article body: a daylight reading column. */
.blog-content { max-width: 68ch; }

/* More card rows become ruled lists: personas, cities, a city's sports, posts. */
:is(.use-case-item, .loc-card, .hub-sport-card, .blog-card, .related-card) {
  background: none; border: 0; border-top: 1px solid var(--mn-line); border-radius: 0; box-shadow: none;
  padding: 22px 0 18px; margin: 0;
}
:is(.use-case-item, .loc-card, .hub-sport-card, .blog-card, .related-card):hover { transform: none; box-shadow: none; }
:is(.use-case-list, .loc-grid, .blog-grid, .related-grid) { gap: 0 clamp(24px, 4vw, 48px); }
.loc-card h2 { border-bottom: 0; padding-bottom: 0; }
/* body main: one step past the daylight heading rule. */
body main .blog-card h2 { font-size: clamp(1.75rem, 2.6vw, 2.125rem); line-height: 0.95; margin-bottom: 12px; }
.blog-card:hover h2, .related-card:hover h3, .hub-sport-card:hover .hub-sport-name { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
:is(.blog-card-tag, .blog-meta-tag) { background: none; border: 0; padding: 0; border-radius: 0; text-transform: none; letter-spacing: 0; font-weight: 600; }
.blog-card-tag { color: var(--mn-ink); }
.hub-sport-icon { background: none; width: auto; height: auto; color: var(--mn-bronze); }
.hub-sport-arrow { display: none; }

/* Core pages: feature, before/after and contact cards become ruled columns. */
:is(.feature-card, .compare-col, .contact-card) {
  background: none; border: 0; border-top: 1px solid var(--mn-line); border-radius: 0; box-shadow: none;
  padding: 22px 0 18px; text-align: start; align-items: flex-start;
}
:is(.feature-card, .compare-col, .contact-card):hover { transform: none; box-shadow: none; }
:is(.feature-grid, .compare-cols, .contact-grid) { gap: 0 clamp(24px, 4vw, 48px); }
.compare-col:is(.before, .after) { background: none; border: 0; border-top: 2px solid #9B1C1C; }
.compare-col.after { border-top-color: var(--mn-pitch); }
.feature-icon-wrap { background: none; width: auto; height: auto; justify-content: flex-start; }
.contact-email { background: none; border: 0; padding: 0; text-decoration: underline; text-underline-offset: 4px; }
.contact-email:hover { background: none; }
.contact-response { background: none; border: 0; border-top: 1px solid var(--mn-line); border-radius: 0; padding: 18px 0 0; margin-inline: 0; text-align: start; }

/* The day stays on cream between hero and closing: these bands were white or off-white
   (found by sweeping every page; render-site.js checks the sample). */
:is(.solve-section, .sport-faq, .blog-body, .blog-list, .hub-faq, .vs-faq, .banner-b2b, .contact-section, .feature-section, .steps-section, .team-features, .include-section) { background-color: var(--mn-cream); }
.feature-section:is(:nth-child(odd), :nth-child(even)) { background-color: var(--mn-cream); }
.banner-b2b { border-top: 1px solid var(--mn-line); }

/* Mid-page screen and comparison bands join the day: only hero and closing are night. */
:is(.screens-section, .team-screens, .features-compare) { background: var(--mn-cream); }
:is(.screens-section, .team-screens, .compare-heading) :is(h2, p) { text-align: start; margin-inline: 0; }
:is(.team-screens, .compare-heading) p { color: var(--mn-ink-body); }
.screen-caption { background: none; box-shadow: none; padding: 0; }

/* The features comparison table matches the vs tables. */
.comparison-table { box-shadow: none; border-radius: 0; }
.comparison-table thead { background: none; }
.comparison-table thead th, .comparison-table thead th.col-wapp { background: none; color: var(--mn-ink); border-bottom: 2px solid var(--mn-ink); }
.comparison-table tbody tr:is(:nth-child(odd), :nth-child(even)) td { background: none; }
.comparison-table tbody tr { border-bottom: 1px solid var(--mn-line); }
.comparison-table td.good { background: none; border-left: 0; border-inline-start: 2px solid var(--mn-gold); }
[dir="rtl"] .comparison-table td.good { border-right: 0; border-inline-start: 2px solid var(--mn-gold); }

/* City and sport link rows: plain links, not chips (the templates style them with style=""). */
main div:has(> a[style*="border-radius:100px"]) { gap: 10px 22px !important; }
main a[style*="border-radius:100px"] {
  padding: 2px 0 !important; border: 0 !important; border-radius: 0 !important;
  text-decoration: underline !important; text-decoration-color: rgba(44, 31, 24, 0.3) !important; text-underline-offset: 4px;
}

/* Legal pages stay a daylight document; only the headline takes the display face.
   .legal-doc marks privacy and terms (reset-password shares .main-wrapper and stays as it is). */
:is(.legal-doc .container, .policy-head) h1, .error-title {
  font-family: var(--mn-display); font-weight: 700; letter-spacing: 0;
  font-size: clamp(2.75rem, 7vw, 4.5rem); line-height: 0.92;
}
.legal-doc .container :is(h1, .last-updated) { text-align: start; }

/* Cross-links: on the reading edge; the uppercase eyebrow reads as a plain label (style="" in 70 templates). */
.cross-links .container { text-align: start !important; }
.cross-links-inner { justify-content: flex-start; }
.cross-links .container > p { text-transform: none !important; letter-spacing: 0 !important; font-size: 1rem !important; color: var(--mn-ink) !important; }

/* The open mobile menu's download button: light text on its dark fill (.nav-links a made it ink). */
.nav-links.open a.btn-primary { color: #fff; }

@media (prefers-reduced-motion: reduce) {
  .nav-links.open > li { animation: none; }
  .nav-toggle line { transition: none; }
  .faq-simple details[open] .faq-body { animation: none; }
  body .store-badge,
  .mn-link { transition: none; }
}