/* =========================================================================
   «Лад» — a music shop and school as a night-club poster / music magazine.

   A dark hall, brass and velvet; a huge italic Playfair; instruments cut
   out on black that cross the columns and the headlines; a running poster
   strip on velvet; capsule buttons that press like piano keys. No paper,
   no frames, no ruled lines: depth is a warm spot of light behind the
   instrument. Brass is for prices, buttons and numbers only.

   1. Fonts   2. Design settings   3. Tokens   4. Base   5. Buttons & forms
   6. Header   7. Footer   8. Section heads   9. Own blocks
   10. Shared blocks   11. Shop   12. Motion   13. Phones
   ========================================================================= */

/* 1. Fonts — Playfair Display and Golos Text ship with the template (OFL,
   licences in assets/fonts); Onest is the parent's. */
@font-face { font-family: 'Lad Playfair'; font-style: normal; font-display: swap; font-weight: 400 900; src: url(../fonts/playfair-display-cyrillic-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Lad Playfair'; font-style: normal; font-display: swap; font-weight: 400 900; src: url(../fonts/playfair-display-latin-wght-normal.woff2) format('woff2-variations'); 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+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Lad Playfair'; font-style: italic; font-display: swap; font-weight: 400 900; src: url(../fonts/playfair-display-cyrillic-wght-italic.woff2) format('woff2-variations'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Lad Playfair'; font-style: italic; font-display: swap; font-weight: 400 900; src: url(../fonts/playfair-display-latin-wght-italic.woff2) format('woff2-variations'); 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+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Lad Golos'; font-style: normal; font-display: swap; font-weight: 400 900; src: url(../fonts/golos-text-cyrillic-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Lad Golos'; font-style: normal; font-display: swap; font-weight: 400 900; src: url(../fonts/golos-text-latin-wght-normal.woff2) format('woff2-variations'); 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+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Lad Onest'; font-style: normal; font-display: swap; font-weight: 100 900; src: url(/themes/default/assets/fonts/onest-cyrillic-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Lad Onest'; font-style: normal; font-display: swap; font-weight: 100 900; src: url(/themes/default/assets/fonts/onest-latin-wght-normal.woff2) format('woff2-variations'); 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+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* 2. The owner's design settings (theme.json → design.controls). Core
   prints the chosen values as :root{--lad-…} after this file. */
:root {
    --lad-velvet: #8e1f2b;
    --lad-brass: #c9a04a;
    --lad-hall: #100f14;
    --lad-font-display: 'Lad Playfair', 'Playfair Display', Georgia, 'Times New Roman', serif;
    --lad-font-body: 'Lad Golos', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
    --lad-radius: 20px;
}

/* 3. Tokens. */
html.lad {
    --hall: var(--lad-hall);
    --stage: color-mix(in srgb, var(--lad-hall) 90%, #fff 10%);
    --stage-2: color-mix(in srgb, var(--lad-hall) 82%, #fff 18%);
    --ivory: #f2eadb;
    --ivory-2: rgb(242 234 219 / 0.72);
    --ivory-3: rgb(242 234 219 / 0.5);
    --brass: var(--lad-brass);
    --brass-2: color-mix(in srgb, var(--lad-brass) 80%, #fff);
    --velvet: var(--lad-velvet);
    --ld-line: rgb(242 234 219 / 0.12);
    --ld-r: var(--lad-radius);
    --ld-display: var(--lad-font-display);
    --ld-body: var(--lad-font-body);

    --paper: var(--hall);
    --c-bg: var(--hall);
    --c-surface: var(--stage);
    --c-surface-sunk: var(--stage-2);
    --c-text: var(--ivory);
    --c-text-strong: #fff8ea;
    --c-text-muted: var(--ivory-2);
    --c-text-faint: var(--ivory-3);
    --c-border: var(--ld-line);
    --c-border-strong: rgb(242 234 219 / 0.3);
    --c-accent: var(--brass);
    --c-accent-hover: var(--brass-2);
    --c-accent-soft: color-mix(in srgb, var(--brass) 14%, transparent);
    --c-accent-contrast: #17110a;
    --c-link: var(--brass);
    --c-link-hover: #fff;
    --c-mark: var(--brass);
    --c-mark-text: var(--brass);
    --c-mark-soft: color-mix(in srgb, var(--brass) 16%, transparent);
    --c-slab: var(--velvet);
    --c-slab-text: #f7e8dc;
    --c-slab-muted: #e2c2b8;
    --c-danger: #ff8b82;
    --c-success: #7ccf95;

    --font-ui: var(--ld-body);
    --font-display: var(--ld-display);
    --font-prose: var(--ld-body);
    --fw-heading: 400;
    --tr-tight: -0.02em;
    --tr-snug: -0.01em;
    --r-xs: 12px;
    --r-sm: 16px;
    --r-md: var(--ld-r);
    --r-lg: var(--ld-r);
    --r-btn: 999px;
    --card-radius: var(--ld-r);
    --card-bg: var(--stage);
    --card-border: 1px solid transparent;
    --w-container: 70rem;
    --w-wide: 80rem;
    --shadow-lift: none;
    color-scheme: dark;
}

/* Section tones: soft = the stage, dark = the hall itself, primary = velvet, accent = brass. */
.lad .cms-tone-soft { --section-bg: var(--stage); --c-bg: var(--stage); --c-surface: var(--stage-2); --c-surface-sunk: var(--hall); }
.lad .cms-tone-dark, .lad .cms-on-dark { --section-bg: var(--hall); }
.lad .cms-tone-primary { --section-bg: var(--velvet); --c-bg: var(--velvet); --c-surface: color-mix(in srgb, var(--velvet) 80%, #000); --c-text: #fbeee4; --c-text-muted: #ecd0c4; --c-accent: #f1d391; }
.lad .cms-tone-accent { --section-bg: var(--brass); --c-bg: var(--brass); --c-surface: color-mix(in srgb, var(--brass) 82%, #000); --c-text: #17110a; --c-text-strong: #0e0a05; --c-text-muted: rgb(23 17 10 / .75); --c-accent: #17110a; --c-accent-contrast: var(--brass); --c-link: #17110a; }
.lad .cms-on-light { --c-bg: var(--hall); --c-surface: var(--stage); }

/* 4. Base */
html.lad, .lad body { background: var(--hall); color: var(--ivory); }
.lad body { font-family: var(--ld-body); font-size: 1.0625rem; line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: clip; }
.lad ::selection { background: var(--brass); color: #17110a; }
.lad :focus-visible { outline: 2px solid var(--brass); outline-offset: 3px; border-radius: 999px; }
.lad h1, .lad h2, .lad h3, .lad h4 { font-family: var(--ld-display); font-weight: 400; letter-spacing: var(--tr-tight); line-height: 1; color: var(--c-text-strong); text-wrap: balance; }
.lad p { text-wrap: pretty; }
.lad a { text-underline-offset: 0.2em; }

/* Kicker: Golos 13px, 600, capitals. */
.ld-eyebrow, .ld-caps { font-family: var(--ld-body); font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--brass); margin: 0 0 1.2rem; }

/* 5. Buttons & forms — capsules that press like piano keys. */
.lad .cms-btn { border-radius: 999px; font-family: var(--ld-body); font-size: 0.9375rem; font-weight: 600; letter-spacing: 0.02em; padding: 0.9em 1.8em; border: 1.5px solid transparent; box-shadow: 0 0 0 rgb(201 160 74 / 0); transition: transform .12s, box-shadow .2s, background-color .2s, color .2s; }
.lad .cms-btn:hover { transform: translateY(2px); box-shadow: 0 6px 18px -6px rgb(201 160 74 / 0.6); }
.lad .cms-btn:active { transform: translateY(3px); box-shadow: none; }
.lad .cms-btn--primary { background: var(--brass); border-color: var(--brass); color: #17110a; }
.lad .cms-btn--primary:hover { background: var(--brass-2); border-color: var(--brass-2); color: #17110a; }
.lad .cms-btn--ghost { background: transparent; border-color: rgb(242 234 219 / .45); color: var(--ivory); }
.lad .cms-btn--ghost:hover { background: var(--ivory); color: #17110a; border-color: var(--ivory); }
.lad .cms-btn--link { padding: .4em .2em; border: 0; background: none; color: var(--ivory); text-decoration: underline; text-decoration-color: var(--brass); text-decoration-thickness: 2px; text-underline-offset: .35em; box-shadow: none; }
.lad .cms-btn--link:hover { color: var(--brass); transform: none; box-shadow: none; background: none; }
.lad .cms-tone-accent .cms-btn--primary { background: #17110a; color: var(--brass); border-color: #17110a; }

.lad .cms-form__label { font-size: .8125rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ivory-2); }
.lad input[type="text"], .lad input[type="tel"], .lad input[type="email"], .lad input[type="number"], .lad input[type="search"], .lad input[type="date"], .lad select, .lad textarea,
.lad .cms-form__input { background: var(--stage); border: 1.5px solid transparent; border-radius: 999px; font-family: var(--ld-body); color: var(--ivory); padding: .85rem 1.3rem; box-shadow: none; }
.lad textarea, .lad textarea.cms-form__input { border-radius: 20px; }
.lad .cms-form__input:focus, .lad input:focus, .lad select:focus, .lad textarea:focus { border-color: var(--brass); box-shadow: 0 0 0 3px rgb(201 160 74 / .2); outline: 0; }
.lad .cms-form__input::placeholder { color: var(--ivory-3); }
.lad .cms-form__req { color: var(--brass); }
.lad .cms-form__success { border: 1px solid var(--brass); background: var(--c-mark-soft); border-radius: 20px; }

/* 6. Header — a dark capsule floating over the hall; a velvet ribbon above. */
.ld-hdr.site-header { background: transparent; color: var(--ivory); border: 0; box-shadow: none; }
.ld-hdr .hdr-row--top { background: var(--velvet); color: #f7e3d6; border: 0; font-size: .8125rem; font-weight: 500; }
.ld-hdr .hdr-row--top a, .ld-hdr .hdr-row--top .hdr-text { color: #fbeee4; }
html.lad[data-lad-ribbon="off"] .ld-hdr .hdr-row--top { display: none; }
.ld-hdr .hdr-row--main { background: transparent; border: 0; padding: .7rem 0; }
.ld-hdr .hdr-row--main .hdr-row__inner { background: color-mix(in srgb, var(--stage) 92%, transparent); border: 1px solid var(--ld-line); border-radius: 999px; padding: .35rem .5rem .35rem 1.3rem; min-height: 4rem; backdrop-filter: blur(10px); }
html.lad[data-lad-header="plain"] .ld-hdr .hdr-row--main .hdr-row__inner { background: transparent; border-color: transparent; backdrop-filter: none; }
.ld-hdr .hdr-logo { gap: .6rem; color: var(--brass); }
.ld-hdr .hdr-logo__name { font-family: var(--ld-display); font-size: 1.9rem; font-weight: 900; font-style: italic; letter-spacing: -.01em; color: var(--c-text-strong); line-height: 1; }
.ld-mark { color: var(--brass); flex: none; }
.ld-hdr .hdr-logo__tagline { font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: var(--ivory-3); }
.ld-hdr .hdr-nav__list { flex-wrap: nowrap; gap: .15rem; }
.ld-hdr .hdr-nav__link { font-family: var(--ld-body); font-size: .9375rem; font-weight: 600; color: var(--ivory); padding: 0 1rem; border-radius: 999px; }
.ld-hdr .hdr-nav__link > span { background-image: none; padding: 0; }
.ld-hdr .hdr-nav__item:hover > .hdr-nav__link, .ld-hdr .hdr-nav__link[aria-current="page"], .ld-hdr .hdr-nav__link.is-active { background: rgb(242 234 219 / .1); color: #fff; }
.ld-hdr .hdr-sub { background: var(--stage-2); border: 1px solid var(--ld-line); border-radius: 20px; box-shadow: 0 24px 40px -20px #000; padding: .5rem; }
.ld-hdr .hdr-sub__link { border-radius: 999px; font-size: .9375rem; color: var(--ivory); }
.ld-hdr .hdr-sub__link:hover { background: rgb(242 234 219 / .1); color: var(--brass); }
.ld-hdr .hdr-phone__number { font-family: var(--ld-display); font-size: 1.25rem; font-weight: 400; font-style: italic; color: var(--brass); }
.ld-hdr .hdr-phone__caption { font-size: .75rem; color: var(--ivory-3); }
.ld-hdr .hdr-icon-btn, .ld-hdr .hdr-burger { color: var(--ivory); border-radius: 999px; background: transparent; border-color: var(--ld-line); }
.ld-drawer.hdr-drawer { background: var(--hall); color: var(--ivory); }
.ld-drawer .hdr-dmenu__link { font-family: var(--ld-display); font-size: 1.9rem; font-style: italic; color: var(--ivory); }
.ld-drawer .hdr-drawer__phone { font-family: var(--ld-display); font-size: 1.5rem; font-style: italic; color: var(--brass); }
.ld-drawer .hdr-drawer__line { color: var(--ivory-2); }

/* 7. Footer — the hall after the show: a giant italic wordmark. */
.ld-wrap { width: min(100% - 2.4rem, var(--w-wide)); margin-inline: auto; }
.ld-ftr.site-footer { position: relative; background: var(--hall); color: var(--ivory-2); border: 0; margin-top: 5rem; padding: 0; overflow: hidden; }
.ld-ftr.site-footer::before { content: ''; position: absolute; left: 50%; top: -10rem; width: 60rem; height: 24rem; transform: translateX(-50%); background: radial-gradient(closest-side, rgb(201 160 74 / .1), transparent); pointer-events: none; }
.ld-ftr__band { padding-block: 2rem; background: var(--stage); }
.ld-ftr__band-inner { display: grid; gap: 1.2rem; grid-template-columns: 1fr; }
@media (min-width: 52rem) { .ld-ftr__band-inner { grid-template-columns: 1fr 1fr; align-items: center; } }
.ld-ftr__band-title { font-family: var(--ld-display); font-style: italic; font-size: 2.4rem; color: var(--c-text-strong); }
.ld-ftr__band-lead { margin: .4rem 0 0; }
.ld-ftr__main { position: relative; display: grid; gap: 2.6rem; padding-block: 4rem 2.4rem; grid-template-columns: 1fr; }
@media (min-width: 62rem) { .ld-ftr__main { grid-template-columns: minmax(16rem, 6fr) 7fr; gap: 4rem; } }
.ld-ftr__brand { display: inline-flex; align-items: center; gap: .8rem; color: var(--brass); text-decoration: none; margin-bottom: 1.2rem; }
.ld-ftr__mark { width: 3rem; height: 3rem; }
.ld-ftr__name { font-family: var(--ld-display); font-style: italic; font-weight: 900; font-size: clamp(4rem, 2.5rem + 7vw, 9rem); line-height: .85; color: var(--c-text-strong); letter-spacing: -.03em; }
.ld-ftr__logo { max-height: 3.2rem; width: auto; }
.ld-ftr__lead { max-width: 28rem; font-size: .9375rem; }
.ld-ftr__grid { display: grid; gap: 2rem 2.4rem; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; }
@media (min-width: 52rem) { .ld-ftr__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ld-ftr__title { font-family: var(--ld-body); font-size: .8125rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--brass); margin: 0 0 1rem; }
.ld-ftr__menu { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.ld-ftr__menu a { color: var(--ivory); text-decoration: none; font-size: 1rem; }
.ld-ftr__menu a:hover { color: var(--brass); }
.ld-ftr__contacts { font-style: normal; display: grid; gap: .5rem; }
.ld-ftr__phone { margin: 0; }
.ld-ftr__phone a { font-family: var(--ld-display); font-style: italic; font-size: 1.9rem; color: var(--brass); text-decoration: none; }
.ld-ftr__phone span { display: block; font-size: .8125rem; color: var(--ivory-3); }
.ld-ftr__line { margin: 0; font-size: .9375rem; }
.ld-ftr__line a { color: var(--ivory); }
.ld-ftr__line--muted { color: var(--ivory-3); }
.ld-ftr__socials { display: flex; gap: .5rem; margin-top: 1.2rem; }
.ld-ftr .site-socials__link { border: 1px solid var(--ld-line); border-radius: 999px; color: var(--ivory); background: var(--stage); }
.ld-ftr .site-socials__link:hover { background: var(--brass); color: #17110a; }
.ld-ftr__bottom { background: var(--velvet); }
.ld-ftr__bottom-inner { display: flex; flex-wrap: wrap; gap: .6rem 2rem; justify-content: space-between; padding-block: 1.1rem; font-size: .8125rem; color: #f0d7cb; }
.ld-ftr__bottom-inner p { margin: 0; }
.ld-ftr__links { list-style: none; margin: 0; padding: 0; display: flex; gap: 1.4rem; flex-wrap: wrap; }
.ld-ftr__links a { color: #fbeee4; }
.ld-ftr .site-footer__slot { margin-inline-start: auto; }

/* 8. Section heads — a huge italic brass number, then the headline. */
.lad .site-main { counter-reset: ld-sec; }
.lad .cms-section:not(:has(.ld-hero)):not(.cms-section--in-column) { counter-increment: ld-sec; }
.lad .cms-section__head { position: relative; max-width: 54rem; margin-bottom: clamp(1.8rem, 1rem + 2.4vw, 3.2rem); }
.lad .cms-section__head--center { margin-inline: auto; }
.lad .cms-section__title { font-family: var(--ld-display); font-size: clamp(2.5rem, 1.2rem + 5.5vw, 5.5rem); font-weight: 400; letter-spacing: -.025em; line-height: .98; color: var(--c-text-strong); }
.lad h1.cms-section__title { font-size: clamp(3.2rem, 1.6rem + 7vw, 8rem); font-style: italic; font-weight: 900; line-height: .9; }
.lad .cms-section__subtitle { font-size: 1.0625rem; color: var(--ivory-2); max-width: 38rem; margin-top: 1.1rem; }
html.lad[data-lad-numerals="on"] .cms-section:not(:has(.ld-hero)):not(.cms-section--in-column) .cms-section__head::before {
    content: '№ ' counter(ld-sec, decimal-leading-zero); display: block; margin-bottom: .5rem;
    font-family: var(--ld-display); font-style: italic; font-weight: 900; font-size: clamp(2.2rem, 1.4rem + 3.4vw, 4.6rem); line-height: .85; color: var(--brass); letter-spacing: -.02em;
}
html.lad[data-lad-density="airy"] .cms-section { padding-block: clamp(3.5rem, 2rem + 6vw, 8rem); }
.lad .cms-section--in-column .cms-section__head::before { display: none; }

/* 9. Own blocks */
/* 9a. Cover — a magazine page: three columns 5/2/5, the headline over all of them, the instrument across. */
.ld-hero { position: relative; overflow: hidden; background: var(--hall); padding-top: clamp(1rem, 4vw, 3rem); }
.ld-hero__inner { position: relative; width: min(100% - 2.4rem, var(--w-wide)); margin-inline: auto; display: grid; gap: 0 clamp(1rem, 2.4vw, 2.5rem); grid-template-columns: 1fr; padding-bottom: 2.5rem; }
@media (min-width: 62rem) {
    .ld-hero__inner { grid-template-columns: minmax(0, 5fr) minmax(0, 2fr) minmax(0, 5fr); grid-template-rows: auto 1fr; min-height: 36rem; padding-bottom: 3.5rem; }
    .ld-hero__title { grid-column: 1 / -1; grid-row: 1; }
    .ld-hero__text { grid-column: 1; grid-row: 2; align-self: end; padding-top: 1.5rem; }
    .ld-hero__issue { grid-column: 2; grid-row: 2; align-self: end; border-left: 1px solid var(--ld-line); padding-left: 1.2rem; }
    .ld-hero__cut { grid-column: 3; grid-row: 1 / span 2; }
}
.ld-hero__title { position: relative; z-index: 1; font-family: var(--ld-display); font-style: italic; font-weight: 900; font-size: clamp(4rem, 1rem + 9vw, 9.5rem); line-height: .88; letter-spacing: -.035em; margin: 0 0 1.5rem; color: var(--c-text-strong); max-width: 11ch; text-wrap: balance; }
@media (min-width: 62rem) { .ld-hero__title { max-width: 9.5em; } }
.ld-hero__lead { font-size: 1.125rem; color: var(--ivory-2); max-width: 30rem; margin: 0 0 1.8rem; }
.ld-hero__actions { display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; }
.ld-hero__note { margin: 1.6rem 0 0; font-size: .875rem; color: var(--ivory-3); max-width: 26rem; }
.ld-hero__issue { margin-top: 2rem; }
.ld-hero__ptitle { margin: 0 0 .8rem; font-size: .8125rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--brass); }
.ld-lead-list { list-style: none; margin: 0; padding: 0; counter-reset: ld-lead; }
.ld-lead-list li { counter-increment: ld-lead; padding: .65rem 0; border-top: 1px solid var(--ld-line); }
.ld-lead-list li:first-child { border-top: 0; }
.ld-lead-list li::before { content: '0' counter(ld-lead); font-family: var(--ld-display); font-style: italic; font-weight: 900; font-size: 1.4rem; color: var(--brass); margin-right: .5rem; }
.ld-lead-list__name { font-family: var(--ld-display); font-style: italic; font-size: 1.3rem; color: var(--ivory); text-decoration: none; }
a.ld-lead-list__name:hover { color: var(--brass); }
.ld-lead-list__aside { display: block; font-size: .8125rem; color: var(--ivory-3); }
.ld-hero__cut { position: relative; margin: 0; min-height: 22rem; pointer-events: none; }
.ld-hero__glow { position: absolute; z-index: 0; inset: 5% -10% 0 -10%; background: radial-gradient(closest-side, rgb(201 160 74 / .14), transparent 75%); }
.ld-hero__cut img { position: absolute; right: -4%; top: -7%; height: 112%; width: auto; max-width: none; mix-blend-mode: lighten; z-index: 2; transform: rotate(-9deg); transform-origin: 60% 55%; }
.ld-hero__caption { position: absolute; right: 0; bottom: 0; font-size: .8125rem; color: var(--ivory-3); max-width: 14rem; text-align: right; }
@media (max-width: 61.99rem) {
    .ld-hero__cut { order: 2; height: 25rem; min-height: 0; margin: 1rem 0 .5rem; }
    .ld-hero__cut img { right: 50%; transform: translateX(50%) rotate(-8deg); top: 0; height: 100%; }
    .ld-hero__text { order: 3; } .ld-hero__issue { order: 4; }
}
.ld-ticker { position: relative; z-index: 3; background: var(--velvet); color: #fbeee4; overflow: hidden; }
html.lad[data-lad-marquee="off"] .ld-ticker { display: none; }
.ld-ticker__track { display: flex; width: max-content; animation: ld-run 48s linear infinite; }
.ld-ticker:hover .ld-ticker__track { animation-play-state: paused; }
.ld-ticker__list { display: flex; flex: none; margin: 0; padding: 0; list-style: none; }
.ld-ticker__list li { white-space: nowrap; padding: .85rem 0; font-size: .9375rem; font-weight: 600; letter-spacing: .04em; }
.ld-ticker__list li::after { content: '♪'; margin: 0 1.6rem; color: var(--brass); }
@keyframes ld-run { to { transform: translateX(-50%); } }

/* 9b. Course programme — magazine notes: a huge italic number, a headline, three lines, the price on the right. */
.ld-prog { display: grid; gap: clamp(1.6rem, 1rem + 3vw, 4rem); grid-template-columns: 1fr; }
@media (min-width: 62rem) { .ld-prog--photo { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); } .ld-prog__plate { position: sticky; top: 7rem; align-self: start; } }
.ld-prog__plate, .ld-room__plate { margin: 0; }
.ld-prog__mount, .ld-room__mount { display: block; border-radius: var(--ld-r); overflow: hidden; background: var(--stage); }
.ld-prog__mount img, .ld-room__mount img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.ld-room__mount img { aspect-ratio: 3 / 2; }
.ld-prog__caption { margin-top: .8rem; font-size: .8125rem; color: var(--ivory-3); }
.ld-prog__list { list-style: none; margin: 0; padding: 0; counter-reset: ld-course; display: grid; gap: 1rem; }
@media (min-width: 52rem) { .ld-prog__list { grid-template-columns: 1fr 1fr; } .ld-prog__item:nth-child(even) { transform: translateY(2.4rem); } }
.ld-prog__item { counter-increment: ld-course; position: relative; background: var(--stage); border-radius: var(--ld-r); padding: 1.6rem 1.6rem 1.5rem; display: flex; flex-direction: column; overflow: hidden; }
.ld-prog__item::before { content: '0' counter(ld-course); font-family: var(--ld-display); font-style: italic; font-weight: 900; font-size: 5rem; line-height: .8; color: var(--brass); opacity: .95; letter-spacing: -.04em; margin-bottom: .8rem; }
.ld-prog__row { display: flex; align-items: baseline; justify-content: space-between; gap: .8rem; }
.ld-prog__dots { display: none; }
.ld-prog__title { font-size: clamp(1.8rem, 1.3rem + 1.4vw, 2.5rem); margin: 0; font-style: italic; font-weight: 700; }
.ld-prog__title a { color: inherit; text-decoration: none; }
.ld-prog__title a:hover { color: var(--brass); }
.ld-prog__price { font-family: var(--ld-display); font-style: italic; font-size: 1.5rem; color: var(--brass); white-space: nowrap; line-height: 1; text-align: right; order: 3; }
.ld-prog__price small { display: block; font-family: var(--ld-body); font-style: normal; font-size: .75rem; color: var(--ivory-3); margin-top: .25rem; }
.ld-prog__meta { margin: .6rem 0 0; font-size: .8125rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--ivory-3); }
.ld-prog__text { margin: .8rem 0 0; color: var(--ivory-2); }
.ld-prog__link { margin-top: auto; padding-top: 1rem; font-size: .9375rem; font-weight: 600; color: var(--ivory); text-decoration: none; }
.ld-prog__link:hover { color: var(--brass); }
.ld-prog__actions { margin-top: 3.4rem; }

/* 9c. Concert bills — an evening poster: a giant brass date, the title in italics, the pieces, a key-shaped link. */
.ld-conc__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.ld-bill { display: grid; gap: 1rem 2rem; grid-template-columns: 1fr; padding: 1.8rem; background: var(--stage); border-radius: var(--ld-r); }
@media (min-width: 52rem) { .ld-bill { grid-template-columns: 9rem minmax(0, 1fr) minmax(12rem, 16rem); align-items: start; } .ld-bill--photo { grid-template-columns: 9rem minmax(0, 1fr) minmax(16rem, 22rem); } }
.ld-bill__date { display: flex; align-items: baseline; gap: .6rem; }
@media (min-width: 52rem) { .ld-bill__date { display: block; } }
.ld-bill__day { display: block; font-family: var(--ld-display); font-style: italic; font-weight: 900; font-size: clamp(4.5rem, 3rem + 4vw, 7rem); line-height: .8; color: var(--brass); letter-spacing: -.04em; }
.ld-bill__month { font-size: .8125rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--ivory-2); }
.ld-bill__when { margin: 0 0 .5rem; font-size: .8125rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--ivory-3); }
.ld-bill__title { font-size: clamp(1.9rem, 1.4rem + 1.6vw, 2.9rem); margin: 0 0 1rem; font-style: italic; font-weight: 700; }
.ld-bill__pieces { list-style: none; margin: 0; padding: 0; color: var(--ivory-2); font-size: .9375rem; }
.ld-bill__pieces li { padding: .3rem 0; }
.ld-bill__pieces li::before { content: '♪ '; color: var(--brass); }
.ld-bill__photo { display: block; margin-bottom: 1rem; border-radius: 16px; overflow: hidden; }
.ld-bill__photo img { display: block; width: 100%; aspect-ratio: 10 / 7; object-fit: cover; }
.ld-bill__place { margin: 0; font-weight: 600; }
.ld-bill__price { margin: .2rem 0 1rem; font-family: var(--ld-display); font-style: italic; font-size: 1.3rem; color: var(--brass); }
.ld-bill__link { display: inline-block; padding: .65em 1.4em; border-radius: 999px; border: 1.5px solid var(--brass); font-size: .9375rem; font-weight: 600; color: var(--brass); text-decoration: none; transition: transform .12s, background-color .2s, color .2s; }
.ld-bill__link:hover { background: var(--brass); color: #17110a; transform: translateY(2px); }
.ld-conc__actions { margin-top: 2rem; }

/* 9d. Rehearsal rooms */
.ld-rooms { display: grid; gap: clamp(2rem, 1rem + 3vw, 3.6rem); grid-template-columns: 1fr; align-items: start; }
@media (min-width: 62rem) { .ld-rooms { grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); } .ld-rates { position: sticky; top: 7rem; } }
.ld-rooms__list { display: grid; gap: 1.4rem; }
.ld-room { display: grid; gap: 0; grid-template-columns: 1fr; background: var(--stage); border-radius: var(--ld-r); overflow: hidden; }
@media (min-width: 40rem) { .ld-room { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); } }
.ld-room__mount { border-radius: 0; height: 100%; }
.ld-room__mount img { height: 100%; aspect-ratio: auto; min-height: 14rem; }
.ld-room__body { padding: 1.6rem; }
.ld-room__title { font-size: 2.2rem; margin: 0; font-style: italic; font-weight: 700; }
.ld-room__area { margin: .4rem 0 1rem; font-size: .8125rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--brass); }
.ld-room__equip { list-style: none; padding: 0; margin: 0; color: var(--ivory-2); font-size: .9375rem; }
.ld-room__equip li { padding: .25rem 0 .25rem 1.3rem; position: relative; }
.ld-room__equip li::before { content: '♪'; position: absolute; left: 0; color: var(--brass); }
.ld-rates { background: var(--velvet); color: #fbeee4; border-radius: var(--ld-r); padding: 2rem 1.8rem; }
.ld-rates__title { font-size: 2.4rem; margin: 0 0 1rem; font-style: italic; font-weight: 700; color: #fff; }
.ld-rates__list { list-style: none; margin: 0 0 1rem; padding: 0; }
.ld-rates__list li { display: flex; align-items: baseline; justify-content: space-between; gap: .8rem; padding: .7rem 0; border-top: 1px solid rgb(255 255 255 / .18); }
.ld-rates__dots { display: none; }
.ld-rates__label { font-size: .9375rem; }
.ld-rates__price { font-family: var(--ld-display); font-style: italic; font-size: 1.5rem; color: #f1d391; white-space: nowrap; }
.ld-rates__note { font-size: .875rem; color: #ecd0c4; }
.ld-rates__actions { margin-top: 1.2rem; }

/* 10. Shared blocks */
/* Schedule — the programme of the evening: time in brass, the class, a capsule for the category. */
html.lad .cms-block--schedule .cms-schedule__filter { gap: .5rem; margin-bottom: 1.6rem; }
html.lad .cms-block--schedule .cms-schedule__chip { background: var(--stage); border: 1.5px solid transparent; border-radius: 999px; font-size: .9375rem; font-weight: 600; color: var(--ivory); padding: .55rem 1.2rem; }
html.lad .cms-block--schedule .cms-schedule__chip[aria-pressed="true"] { background: var(--brass); color: #17110a; }
html.lad .cms-block--schedule .cms-schedule__week { gap: .7rem; }
html.lad .cms-block--schedule .cms-schedule__day { background: var(--stage); border: 0; border-radius: var(--ld-r); padding: .5rem; }
html.lad .cms-block--schedule .cms-schedule__day.is-today { background: var(--stage-2); box-shadow: inset 0 0 0 1.5px var(--brass); }
html.lad .cms-block--schedule .cms-schedule__day-title { margin: 0; padding: .7rem .6rem; border: 0; font-family: var(--ld-display); font-size: 1.1rem; overflow-wrap: normal; hyphens: none; font-style: italic; font-weight: 700; text-transform: lowercase; color: var(--ivory); }
html.lad .cms-block--schedule .cms-schedule__day.is-today .cms-schedule__day-title { color: var(--brass); }
html.lad .cms-block--schedule .cms-schedule__list { padding: .2rem; gap: .4rem; }
html.lad .cms-block--schedule .cms-schedule__item { background: var(--hall); border: 0; border-radius: 16px; padding: .75rem .85rem; box-shadow: none; }
html.lad .cms-block--schedule .cms-schedule__time { font-family: var(--ld-display); font-style: italic; font-size: 1.25rem; font-weight: 700; color: var(--brass); }
html.lad .cms-block--schedule .cms-schedule__time svg { display: none; }
html.lad .cms-block--schedule .cms-schedule__title { font-family: var(--ld-body); font-size: .9375rem; font-weight: 600; color: var(--c-text-strong); line-height: 1.3; }
html.lad .cms-block--schedule .cms-schedule__meta { color: var(--ivory-2); font-size: .8125rem; }
html.lad .cms-block--schedule .cms-schedule__category { display: inline-block; background: transparent; border: 1px solid var(--ld-line); border-radius: 999px; padding: .1rem .7rem; color: var(--ivory-2); font-size: .75rem; font-weight: 600; }
html.lad .cms-block--schedule .cms-schedule__note { color: var(--brass); font-size: .8125rem; }
html.lad .cms-block--schedule .cms-schedule__item.is-highlight { box-shadow: inset 0 0 0 1.5px var(--brass); }
html.lad .cms-block--schedule .cms-schedule__none { color: var(--ivory-3); }

/* Pricing table — tiles on the stage; the featured tile is brass. */
html.lad .cms-ptable__plan-inner, html.lad .cms-ptable__card { border-radius: var(--ld-r); box-shadow: none; background: var(--stage); border: 0; }
html.lad .cms-ptable__name { font-family: var(--ld-display); font-size: 1.8rem; font-style: italic; font-weight: 700; }
html.lad .cms-ptable__amount { font-family: var(--ld-display); font-style: italic; font-weight: 900; font-size: clamp(2.4rem, 1.8rem + 1.8vw, 3.4rem); color: var(--brass); letter-spacing: -.02em; }
html.lad .cms-ptable__period { color: var(--ivory-2); }
html.lad .cms-ptable__old { color: var(--ivory-3); }
html.lad .cms-ptable__badge { background: var(--velvet); color: #fbeee4; border-radius: 999px; font-size: .75rem; font-weight: 600; padding-inline: .9rem; }
html.lad .cms-ptable__plan.is-featured .cms-ptable__plan-inner, html.lad .cms-ptable__card.is-featured { background: var(--brass); color: #17110a; --c-text: #17110a; --c-text-strong: #0e0a05; --c-text-muted: rgb(23 17 10 / .75); --c-text-faint: rgb(23 17 10 / .6); --c-accent: #17110a; --c-accent-contrast: var(--brass); --c-border: rgb(23 17 10 / .25); }
html.lad .cms-ptable__plan.is-featured .cms-ptable__amount, html.lad .cms-ptable__card.is-featured .cms-ptable__amount { color: #0e0a05; }
html.lad .cms-ptable__group { font-family: var(--ld-display); font-size: 1.4rem; font-style: italic; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--brass); }
html.lad .cms-ptable__mark--yes { color: var(--brass); }
html.lad .cms-ptable__note { font-size: .875rem; color: var(--ivory-3); }

/* Teachers and services — a teacher is a still life on the stage, a service a magazine note. */
.lad .svc-card { background: var(--stage); border: 0; border-radius: var(--ld-r); box-shadow: none; padding: 1.2rem; }
.lad .svc-card__media { border-radius: 16px; overflow: hidden; }
.lad .svc-card__title { font-family: var(--ld-display); font-size: 1.8rem; font-style: italic; font-weight: 700; }
.lad .svc-card__badge, .lad .svc-badge { background: var(--velvet); color: #fbeee4; border-radius: 999px; font-size: .75rem; font-weight: 600; }
.lad .svc-card__price, .lad .svc-card__amount { font-family: var(--ld-display); font-style: italic; font-size: 1.4rem; color: var(--brass); }
.lad .team-card { background: var(--stage); border: 0; border-radius: var(--ld-r); box-shadow: none; overflow: hidden; }
.lad .team-card__photo { border-radius: 0; background: radial-gradient(closest-side, rgb(201 160 74 / .16), transparent); }
.lad .team-card__photo img { border-radius: 0; transition: transform .5s; }
.lad .team-card:hover .team-card__photo img { transform: scale(1.04); }
.lad .team-card__name { font-family: var(--ld-display); font-size: 1.6rem; font-style: italic; font-weight: 700; }
.lad .team-card__position { font-size: .8125rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ivory-3); }
.lad .team-card__badge { background: var(--velvet); color: #fbeee4; border-radius: 999px; }

.lad .cms-faq details, .lad .cms-faq__item { border: 0; border-radius: 20px; background: var(--stage); margin-bottom: .6rem; }
.lad .cms-faq summary { font-family: var(--ld-display); font-size: 1.4rem; font-style: italic; font-weight: 700; }
/* A review is a pull-quote: huge italics across two columns. */
.lad .cms-testimonial, .lad .cms-quote { background: transparent; border: 0; border-radius: 0; box-shadow: none; padding: 0; }
.lad .cms-testimonial blockquote, .lad .cms-quote blockquote, .lad .cms-testimonial__quote { font-family: var(--ld-display); font-style: italic; font-weight: 400; font-size: clamp(1.4rem, 1rem + 1.4vw, 2.2rem); line-height: 1.2; color: var(--ivory); }
.lad .cms-testimonial blockquote::before, .lad .cms-quote blockquote::before { content: '“'; display: block; font-weight: 900; font-size: 4.5rem; line-height: .6; color: var(--brass); }
.lad .cms-stat__value { font-family: var(--ld-display); font-style: italic; font-weight: 900; color: var(--brass); }

/* 11. Shop — an instrument cut out on a dark tile with a warm spot of light. */
.lad .shop-card { background: var(--stage); border: 0; border-radius: var(--ld-r); box-shadow: none; padding: 0; overflow: hidden; transition: transform .2s; position: relative; }
.lad .shop-card:hover { transform: translateY(-4px); }
.lad .shop-card__media, .lad .shop-card__image { border-radius: 0; background: radial-gradient(closest-side at 50% 55%, rgb(201 160 74 / .16), transparent 80%), var(--hall); }
.lad .shop-card__media img { mix-blend-mode: lighten; }
.lad .shop-card__body { padding: 1rem 1.2rem 1.2rem; }
.lad .shop-card__brand { font-size: .75rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--brass); }
.lad .shop-card__title { font-family: var(--ld-body); font-size: 1.0625rem; font-weight: 600; line-height: 1.25; letter-spacing: 0; }
.lad .shop-card__sku { font-size: .75rem; color: var(--ivory-3); }
.lad .shop-price, .lad .shop-card__price { font-family: var(--ld-display); font-style: italic; font-weight: 700; font-size: 1.7rem; color: var(--brass); }
.lad .shop-price--old, .lad .shop-price del { color: var(--ivory-3); font-weight: 400; }
.lad .shop-sticker, .lad .shop-badge { border-radius: 999px; font-size: .75rem; font-weight: 600; background: var(--velvet); color: #fbeee4; }
.lad .shop-sticker--new { background: var(--brass); color: #17110a; }
.lad .shop-card__btn, .lad .shop-btn { border-radius: 999px; font-size: .9375rem; font-weight: 600; }
html.lad[data-lad-cards="flat"] .shop-card { background: transparent; }
.lad .shop-chip, .lad .shop-swatch { border-radius: 999px; }
.lad .shop-filter__title, .lad .shop-filters__title { font-family: var(--ld-display); font-size: 1.3rem; font-style: italic; }
.lad .shop-card__quick, .lad .shop-card .shop-toggle { border-radius: 999px; }

/* 12. Motion — one running strip, key-press buttons; reduced motion gets a static row. */
@media (prefers-reduced-motion: reduce) {
    .ld-ticker__track { animation: none; flex-wrap: wrap; width: auto; }
    .ld-ticker__list[aria-hidden="true"] { display: none; }
    .ld-ticker__list { flex-wrap: wrap; padding-inline: 1rem; }
    .lad .cms-btn, .lad .shop-card, .lad .team-card__photo img { transition: none; }
    .lad .cms-btn:hover, .lad .shop-card:hover { transform: none; }
}

/* 13. Phones */
@media (max-width: 40rem) {
    .ld-hdr .hdr-row--main .hdr-row__inner { padding-left: 1rem; }
    .ld-hdr .hdr-logo__name { font-size: 1.6rem; }
    .ld-hero__title { font-size: clamp(3.4rem, 17vw, 4.6rem); }
    .ld-bill { padding: 1.3rem; }
    .ld-prog__item::before { font-size: 4rem; }
    .ld-ftr__phone a { font-size: 1.6rem; }
}
