@import url("https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@500;600;700;800&family=Zen+Kaku+Gothic+New:wght@400;500;700;900&display=swap");

:root {
  color: #2b211d;
  background: #fbf8ef;
  font-family: "Zen Kaku Gothic New", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-synthesis: none;
  --ivory: #fbf8ef;
  --paper: #ffffff;
  --ink: #2b211d;
  --teal: #275945;
  --turquoise: #5e9277;
  --red: #d63b2c;
  --yellow: #efc75e;
  --muted: #706a62;
  --line: #e5dfd2;
  --serif: "Shippori Mincho", "Yu Mincho", "Hiragino Mincho ProN", serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; min-height: 100vh; background: var(--ivory); color: var(--ink); -webkit-font-smoothing: antialiased; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
main { display: flex; flex-direction: column; overflow-x: clip; }
.section-shell { width: min(1180px, calc(100% - 56px)); margin-inline: auto; }

.hero { position: relative; width: min(1504px, 100%); margin-inline: auto; background: #032238; }
.hero-picture, .hero-picture img { display: block; width: 100%; }
.hero-form-wrap { position: absolute; z-index: 2; top: 36.2%; right: .65%; width: 27.35%; height: 62.8%; }
.invitation-form { height: 100%; display: flex; flex-direction: column; gap: clamp(7px, .6vw, 12px); padding: clamp(14px, 1.05vw, 22px); background: #fffaf0; border: 2px solid #c99d45; border-radius: 12px; box-shadow: 0 12px 34px rgb(0 0 0 / .18); }
.form-speed { display: grid; grid-template-columns: auto 1fr; align-items: baseline; padding: 9px 12px 11px; color: #fff; background: var(--red); border-radius: 8px; text-align: center; line-height: 1; }
.form-speed span { font-size: clamp(15px, 1.2vw, 22px); font-weight: 900; }
.form-speed strong { font-family: var(--serif); font-size: clamp(23px, 2vw, 36px); letter-spacing: -.04em; }
.form-speed small { grid-column: 1 / -1; margin-top: 8px; font-size: clamp(13px, .9vw, 17px); font-weight: 800; color: #fff3ca; }
.invitation-form label { display: grid; gap: 4px; font-weight: 900; font-size: clamp(12px, .88vw, 16px); }
.invitation-form label small { font-weight: 500; }
.invitation-form input { width: 100%; min-height: clamp(36px, 3.35vw, 56px); padding: 9px 12px; background: #fff; border: 1.5px solid #c6b99f; border-radius: 5px; outline: none; }
.invitation-form input:focus { border-color: var(--turquoise); box-shadow: 0 0 0 3px rgb(40 169 162 / .18); }
.submit-invitation { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 9px; min-height: clamp(52px, 5.6vw, 82px); margin-top: auto; padding: 8px 13px; color: #fff; background: #08793f; border: 3px solid #f2d77f; border-radius: 15px; cursor: pointer; box-shadow: 0 7px 0 #033d27, 0 12px 20px rgb(7 59 35 / .28); transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.submit-invitation:hover { background: #096937; transform: translateY(-2px); box-shadow: 0 9px 0 #033d27, 0 16px 24px rgb(7 59 35 / .24); }
.submit-invitation:active { transform: translateY(4px); box-shadow: 0 3px 0 #033d27; }
.submit-invitation b { display: grid; place-items: center; width: clamp(42px, 4vw, 60px); aspect-ratio: 1; margin-left: -9px; background: var(--red); border: 2px solid #fff; border-radius: 50%; font-size: clamp(14px, 1.15vw, 20px); }
.submit-invitation span { font-family: var(--serif); font-size: clamp(15px, 1.45vw, 25px); font-weight: 900; line-height: 1.22; }
.form-note { margin: 7px 0 0; text-align: center; font-weight: 800; font-size: clamp(11px, .85vw, 15px); }
.invitation-success { height: 100%; display: grid; place-content: center; justify-items: center; gap: 10px; padding: 24px; background: #fffaf0; border: 2px solid #c99d45; border-radius: 12px; text-align: center; }
.invitation-success > span { display: grid; place-items: center; width: 56px; aspect-ratio: 1; border-radius: 50%; background: var(--turquoise); color: #fff; }
.invitation-success strong { font-size: clamp(20px, 2vw, 30px); }
.invitation-success p { margin: 0; }
.invitation-success button { border: 0; background: none; color: var(--teal); text-decoration: underline; cursor: pointer; }

.page-index { position: sticky; top: 0; z-index: 20; display: grid; grid-template-columns: repeat(6, 1fr); width: 100%; background: rgb(255 253 247 / .97); border-bottom: 1px solid #e4e7e1; box-shadow: 0 8px 24px rgb(11 70 85 / .07); backdrop-filter: blur(10px); }
.page-index a { position: relative; display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 64px; padding: 8px 12px; font-size: 13px; font-weight: 800; }
.page-index a + a::before { content: ""; position: absolute; left: 0; width: 1px; height: 20px; background: #d8dfdc; }
.page-index b { display: grid; place-items: center; width: 26px; aspect-ratio: 1; border-radius: 50%; color: #fff; background: var(--teal); font-size: 11px; }
.page-index a:hover { color: var(--turquoise); }

.overview { position: relative; display: grid; grid-template-columns: 1.08fr .92fr; margin-top: 74px; margin-bottom: 110px; background: #fff; box-shadow: 0 24px 80px rgb(11 70 85 / .12); }
.overview-image { position: relative; min-height: 540px; overflow: hidden; }
.overview-image img { width: 100%; height: 100%; object-fit: cover; object-position: 56% center; }
.overview-image small { position: absolute; left: 16px; bottom: 14px; padding: 5px 8px; color: #fff; background: rgb(11 70 85 / .84); font-size: 10px; }
.overview-panel { position: relative; padding: 56px 52px 48px; background: #fff; }
.eyebrow, .section-heading > p, .gift-intro > p:first-child, .campaign-copy > p, .media-copy > p, .access-intro > p { margin: 0 0 15px; color: var(--turquoise); font-family: Arial, sans-serif; font-size: 12px; font-weight: 900; letter-spacing: .18em; }
.overview-panel h1 { margin: 0 0 34px; font-family: var(--serif); font-size: clamp(34px, 3vw, 50px); line-height: 1.35; letter-spacing: -.04em; }
.overview-facts { display: grid; gap: 14px; }
.overview-facts > div { display: grid; grid-template-columns: 32px 86px 1fr; align-items: center; gap: 9px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.overview-facts svg { color: var(--turquoise); }
.overview-facts span { color: var(--muted); font-size: 12px; font-weight: 800; }
.overview-facts strong { font-family: var(--serif); font-size: 17px; line-height: 1.45; }
.overview-facts strong span { display: inline-grid; place-items: center; width: 22px; aspect-ratio: 1; margin: 0 5px; color: #fff; background: var(--teal); border-radius: 50%; font-size: 10px; }
.venue-scale { display: grid; grid-template-columns: 1fr auto; align-items: end; margin: 26px 0 22px; padding: 18px 20px; background: #e5f7f4; }
.venue-scale > span { grid-column: 1 / -1; font-size: 12px; font-weight: 800; }
.venue-scale strong { font-family: var(--serif); font-size: 42px; color: var(--teal); }
.venue-scale strong small { font-size: 18px; }
.venue-scale b { margin-bottom: 8px; padding: 6px 9px; color: var(--teal); background: var(--yellow); border-radius: 999px; font-size: 12px; }
.text-link, .solid-link { display: inline-flex; align-items: center; gap: 8px; font-weight: 900; }
.text-link { padding-bottom: 5px; color: var(--teal); border-bottom: 2px solid var(--turquoise); }

.section-heading { max-width: 720px; }
.section-heading.center { margin-inline: auto; text-align: center; }
.section-heading h2 { margin: 0; font-family: var(--serif); font-size: clamp(36px, 4vw, 58px); line-height: 1.25; letter-spacing: -.045em; }
.section-heading h2 em { color: var(--red); font-style: normal; }
.section-heading > span { display: block; margin-top: 20px; color: var(--muted); line-height: 1.9; }

.gift-section { padding: 94px 0; color: #fff; background: var(--teal); }
.gift-section .section-shell { display: grid; grid-template-columns: .7fr 1.3fr; gap: 58px; align-items: center; }
.gift-intro > p:first-child { color: #78e0d7; }
.gift-intro > span { display: inline-block; margin-bottom: 20px; padding: 7px 12px; color: var(--teal); background: var(--yellow); font-weight: 900; transform: rotate(-2deg); }
.gift-intro h2 { margin: 0 0 22px; font-family: var(--serif); font-size: clamp(42px, 4vw, 62px); line-height: 1.2; }
.gift-intro > p:not(:first-child) { max-width: 430px; color: #cde0e3; line-height: 1.9; }
.solid-link { margin-top: 20px; padding: 15px 20px; color: var(--teal); background: #fff; border-radius: 999px; transition: transform .2s ease; }
.solid-link:hover { transform: translateX(4px); }
.gift-picker { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.gift-picker button { position: relative; min-width: 0; padding: 0 0 18px; overflow: hidden; color: var(--ink); background: #fff; border: 3px solid transparent; border-radius: 16px; text-align: left; cursor: pointer; transition: transform .25s ease, border-color .25s ease; }
.gift-picker button:hover { transform: translateY(-6px); }
.gift-picker button.selected { border-color: var(--yellow); transform: translateY(-6px); }
.gift-picker img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.gift-picker strong, .gift-picker small { display: block; padding-inline: 14px; }
.gift-picker strong { margin-top: 14px; font-size: 15px; line-height: 1.45; }
.gift-picker small { margin-top: 5px; color: var(--muted); line-height: 1.4; }
.gift-number { position: absolute; z-index: 2; top: 9px; left: 9px; display: grid; place-items: center; width: 34px; aspect-ratio: 1; border-radius: 50%; color: var(--teal); background: var(--yellow); font-weight: 900; }
.gift-check { position: absolute; right: 10px; bottom: 10px; display: grid; place-items: center; width: 25px; aspect-ratio: 1; color: #fff; background: var(--turquoise); border-radius: 50%; opacity: 0; }
.gift-picker button.selected .gift-check { opacity: 1; }
.gift-picker > p { grid-column: 1 / -1; margin: 10px 0 0; color: #cde0e3; text-align: right; font-size: 12px; }
.gift-picker > p strong { display: inline; padding: 0; color: #fff; }

.daily-section { padding-block: 110px; }
.daily-title-row { display: grid; grid-template-columns: 1fr 180px; align-items: center; gap: 40px; }
.sale-seal { justify-self: end; display: grid; grid-template-columns: auto 1fr; place-content: center; width: 150px; aspect-ratio: 1; color: #fff; background: var(--red); border: 8px solid var(--yellow); border-radius: 50%; text-align: center; box-shadow: 0 0 0 6px var(--red); transform: rotate(4deg); }
.sale-seal span { align-self: end; font-weight: 900; }
.sale-seal strong { grid-row: span 2; font-family: Georgia, serif; font-size: 65px; line-height: .8; }
.sale-seal strong small { font-size: 22px; }
.sale-seal b { font-size: 24px; }
.daily-tabs { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; margin: 48px 0 20px; }
.daily-tabs button { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 64px; background: #fff; border: 1px solid var(--line); border-radius: 10px; cursor: pointer; }
.daily-tabs button strong { font-family: Georgia, serif; font-size: 20px; }
.daily-tabs button span { display: grid; place-items: center; min-width: 25px; min-height: 25px; padding: 0 4px; border-radius: 50%; color: var(--teal); background: #e5f7f4; font-size: 10px; font-weight: 900; }
.daily-tabs button[aria-selected="true"] { color: #fff; background: var(--red); border-color: var(--red); transform: translateY(-4px); }
.daily-tabs button[aria-selected="true"] span { color: var(--red); background: #fff; }
.daily-products { display: grid; grid-template-columns: 1.4fr .6fr; gap: 18px; }
.daily-feature { display: grid; grid-template-columns: 1.15fr .85fr; min-height: 520px; overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: 18px; box-shadow: 0 18px 50px rgb(11 70 85 / .1); }
.daily-image { min-width: 0; background: #eef2f0; }
.daily-image img { width: 100%; height: 100%; object-fit: cover; }
.daily-copy { display: flex; flex-direction: column; padding: 42px 34px 32px; }
.daily-copy > p { margin: 0 0 20px; color: var(--red); font-size: 12px; font-weight: 900; letter-spacing: .12em; }
.daily-copy h3 { margin: 0 0 8px; font-family: var(--serif); font-size: 36px; }
.daily-copy > span { font-weight: 800; }
.daily-copy > small { margin-top: 8px; color: var(--muted); }
.price-row { margin-top: auto; padding-top: 30px; border-top: 1px solid var(--line); }
.price-row span { display: block; color: var(--muted); font-size: 12px; }
.price-row strong { display: block; margin-top: 6px; color: var(--red); font-family: Georgia, serif; font-size: 42px; }
.price-row strong small, .supporting-products strong small { margin-left: 5px; font-family: sans-serif; font-size: 10px; }
.discount-row { display: flex; gap: 8px; margin-top: 10px; }
.discount-row b, .discount-row span, .supporting-products article b { padding: 6px 9px; color: #fff; background: var(--red); border-radius: 4px; font-size: 12px; }
.discount-row span { background: var(--teal); }
.supporting-products { display: grid; gap: 12px; }
.supporting-products article { position: relative; display: grid; grid-template-columns: 46% 54%; min-height: 158px; overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: 14px; }
.supporting-products img { width: 100%; height: 100%; object-fit: cover; }
.supporting-products article > div { position: relative; padding: 18px 14px; }
.supporting-products p { margin: 0 0 7px; color: var(--red); font-weight: 900; }
.supporting-products p span { font-size: 10px; }
.supporting-products h3 { margin: 0 0 14px; font-size: 15px; }
.supporting-products strong { display: block; color: var(--red); font-family: Georgia, serif; font-size: 21px; }
.supporting-products article b { position: absolute; right: 10px; bottom: 10px; }
.product-disclaimer { margin: 18px 0 0; color: var(--muted); font-size: 11px; text-align: right; }

.brand-section { padding-block: 105px; color: #fff; background: var(--teal); }
.brand-section .section-heading > p { color: #79dfd6; }
.brand-section .section-heading > span { color: #c4d8dc; }
.brand-filters { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin: 40px 0 28px; }
.brand-filters button { padding: 10px 18px; color: #fff; background: transparent; border: 1px solid #5e8791; border-radius: 999px; cursor: pointer; }
.brand-filters button.selected { color: var(--teal); background: var(--turquoise); border-color: var(--turquoise); font-weight: 900; }
.brand-cloud { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; min-height: 270px; }
.brand-logo { display: grid; place-items: center; min-height: 92px; padding: 12px; overflow: hidden; background: #fff; border: 1px solid rgb(255 255 255 / .3); border-radius: 10px; box-shadow: 0 10px 30px rgb(0 0 0 / .15); animation: brand-arrive .7s cubic-bezier(.2, .8, .2, 1) both; animation-delay: var(--brand-delay); }
.brand-logo img { width: 100%; height: 58px; object-fit: contain; }
@keyframes brand-arrive { from { opacity: 0; filter: blur(9px); transform: translate(var(--brand-x, 0), -80px) rotate(-3deg) scale(.82); } to { opacity: 1; filter: blur(0); transform: none; } }
.brand-logo:nth-child(3n + 1) { --brand-x: -90px; }
.brand-logo:nth-child(3n + 2) { --brand-x: 40px; }
.brand-logo:nth-child(3n) { --brand-x: 100px; }
.brand-note { margin: 24px 0 0; color: #b9d1d5; font-size: 11px; text-align: center; }

.campaign-section { display: grid; grid-template-columns: .8fr 1.2fr; gap: 50px; align-items: stretch; margin-block: 110px; }
.campaign-copy { padding: 54px; color: #fff; background: var(--red); }
.campaign-copy > p { color: #ffd6dd; }
.campaign-copy h2 { margin: 0 0 24px; font-family: var(--serif); font-size: clamp(36px, 4vw, 56px); }
.campaign-copy strong { display: inline-block; margin-bottom: 22px; padding: 9px 15px; color: var(--red); background: var(--yellow); font-size: 22px; }
.campaign-copy span { display: block; line-height: 1.9; }
.campaign-visual { position: relative; min-height: 420px; overflow: hidden; }
.campaign-visual > img { width: 100%; height: 100%; object-fit: cover; }
.campaign-visual > div { position: absolute; right: 24px; bottom: 24px; display: grid; grid-template-columns: auto 1fr; gap: 5px 11px; min-width: 260px; padding: 20px; color: var(--teal); background: rgb(255 255 255 / .94); }
.campaign-visual svg { grid-row: 1 / 3; }
.campaign-visual b { font-size: 18px; }
.campaign-visual span { font-size: 12px; }

.benefit-section { padding-bottom: 120px; }
.benefit-title { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 30px; }
.benefit-count { display: grid; justify-items: center; padding: 16px 22px; color: var(--teal); background: var(--yellow); transform: rotate(2deg); }
.benefit-count b { font-family: Georgia, serif; font-size: 42px; line-height: 1; }
.benefit-count small { font-weight: 900; }
.benefit-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; margin-top: 42px; }
.benefit-grid article { position: relative; min-height: 230px; padding: 30px 26px; background: #fff; border: 1px solid var(--line); border-radius: 14px; }
.benefit-grid article svg { color: var(--turquoise); }
.benefit-number { position: absolute; right: 18px; top: 14px; color: #dbe9e7; font-family: Georgia, serif; font-size: 28px; }
.benefit-grid h3 { margin: 20px 0 8px; font-family: var(--serif); font-size: 23px; }
.benefit-grid p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.75; }
.expand-benefits { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 12px; width: min(560px, 100%); margin: 28px auto 0; padding: 13px 18px; color: #fff; background: var(--red); border: 0; border-radius: 999px; cursor: pointer; text-align: left; box-shadow: 0 10px 26px rgb(215 25 45 / .2); }
.expand-benefits span { font-size: 11px; }
.expand-benefits strong { font-size: 16px; }
.expand-benefits svg { transition: transform .2s ease; }
.expand-benefits svg.rotate { transform: rotate(180deg); }

.story-section { padding-block: 110px; background: #e8f6f4; }
.story-grid { display: grid; grid-template-columns: 1.3fr .7fr; gap: 16px; margin-top: 50px; }
.story-grid article { position: relative; overflow: hidden; background: #fff; }
.story-grid article > img { width: 100%; height: 250px; object-fit: cover; }
.story-grid article:nth-child(2) > img { content: url("../images/venue-overview.png"); object-position: 96% 28%; }
.story-grid article:nth-child(3) > img { content: url("../images/venue-overview.png"); object-position: 40% 45%; }
.story-grid article > div { padding: 24px; }
.story-grid article p { margin: 0 0 12px; color: var(--turquoise); font-size: 11px; font-weight: 900; letter-spacing: .12em; }
.story-grid article h3 { margin: 0 0 12px; font-family: var(--serif); font-size: 25px; line-height: 1.45; }
.story-grid article span { display: block; color: var(--muted); line-height: 1.8; }
.story-feature { grid-row: span 2; }
.story-grid .story-feature > img { height: 430px; }
.story-grid .story-feature > div { padding: 36px; }
.story-grid .story-feature h3 { font-size: 38px; }
.story-grid a { display: inline-flex; align-items: center; gap: 4px; margin-top: 20px; color: var(--teal); font-weight: 900; }

.service-section { padding-block: 110px; }
.service-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 46px; }
.service-grid article { min-height: 450px; background: #fff; border: 1px solid var(--line); }
.service-grid article > img { width: 100%; height: 230px; object-fit: cover; }
.service-grid article:nth-child(1) > img { content: url("../images/advisory-clean.png"); }
.service-grid article:nth-child(2) > img { content: url("../images/curtain-clean.png"); }
.service-grid article > div { padding: 28px; }
.service-grid svg { color: var(--turquoise); }
.service-grid h3 { margin: 16px 0 12px; font-family: var(--serif); font-size: 27px; }
.service-grid p, .service-grid span { color: var(--muted); line-height: 1.8; }
.service-grid .repair-card { position: relative; color: #fff; background: var(--teal); }
.repair-card > div { position: absolute; inset: auto 0 0; padding: 42px; }
.repair-card svg, .repair-card p { color: var(--yellow); }
.repair-card h3 { font-size: 36px; }
.repair-card span { color: #c9dadd; }

.media-section { padding-block: 100px; color: #fff; background: #112f38; }
.media-section .section-shell { display: grid; grid-template-columns: .72fr 1.28fr; gap: 70px; align-items: center; }
.media-copy > p { color: #7cddd6; }
.media-copy h2 { margin: 0; font-family: var(--serif); font-size: clamp(36px, 4vw, 54px); line-height: 1.3; }
.media-copy span { display: block; margin-top: 20px; color: #b9ccd0; line-height: 1.85; }
.video-story { display: grid; grid-template-columns: 1.1fr .9fr; overflow: hidden; background: #fff; color: var(--ink); }
.video-story > button { position: relative; min-height: 380px; padding: 0; border: 0; cursor: pointer; overflow: hidden; }
.video-story > button img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.video-story > button img { content: url("https://i.ytimg.com/vi/9xtJyz6HwF4/hqdefault.jpg"); }
.video-story > button:hover img { transform: scale(1.03); }
.video-story > button span { position: absolute; inset: 0; margin: auto; display: grid; place-items: center; width: 72px; height: 72px; color: #fff; background: var(--red); border-radius: 50%; }
.video-story > div { padding: 34px; }
.video-story > div p { margin: 0 0 18px; color: var(--turquoise); font-size: 11px; font-weight: 900; letter-spacing: .12em; }
.video-story h3 { margin: 0 0 16px; font-family: var(--serif); font-size: 30px; }
.video-story > div span { color: var(--muted); line-height: 1.8; }
.video-story > div button { display: flex; align-items: center; gap: 8px; margin-top: 28px; padding: 0 0 6px; color: var(--teal); background: none; border: 0; border-bottom: 2px solid var(--turquoise); font-weight: 900; cursor: pointer; }

.voice-faq { display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; padding-block: 110px; }
.voice-faq .section-heading h2 { font-size: 38px; }
.voices article { padding: 24px 0; border-bottom: 1px solid var(--line); }
.voices article > span { color: var(--turquoise); font-size: 11px; font-weight: 900; }
.voices article h3 { margin: 8px 0; font-family: var(--serif); font-size: 21px; }
.voices article p { margin: 0; color: var(--muted); line-height: 1.7; }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 23px 0; font-weight: 900; cursor: pointer; list-style: none; }
.faq summary::-webkit-details-marker { display: none; }
.faq details[open] summary svg { transform: rotate(180deg); }
.faq summary svg { flex: 0 0 auto; transition: transform .2s ease; }
.faq details p { margin: -8px 0 24px; padding-right: 46px; color: var(--muted); line-height: 1.8; }

.access-section { padding-block: 100px; background: #dff3f0; }
.access-section .section-shell { display: grid; grid-template-columns: .62fr 1.38fr; gap: 70px; }
.access-intro h2 { margin: 0; font-family: var(--serif); font-size: clamp(38px, 4vw, 56px); line-height: 1.35; }
.access-intro span { display: block; margin-top: 20px; color: var(--muted); line-height: 1.8; }
.venue-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.venue-cards article { padding: 34px; background: #fff; border-radius: 14px; }
.venue-cards article > span { display: inline-block; padding: 5px 9px; color: #fff; background: var(--teal); font-size: 11px; font-weight: 900; }
.venue-cards h3 { margin: 18px 0 14px; font-family: var(--serif); font-size: 25px; }
.venue-cards p, .venue-cards li { color: var(--muted); line-height: 1.7; }
.venue-cards ul { padding-left: 20px; }
.venue-cards a { display: flex; align-items: center; justify-content: space-between; margin-top: 24px; padding: 13px 15px; color: #fff; background: var(--teal); font-weight: 900; font-size: 13px; }

.final-cta { display: flex; align-items: center; justify-content: center; gap: 80px; padding: 54px 28px; color: #fff; background: var(--red); }
.final-cta p { margin: 0 0 8px; color: #ffd1d8; font-size: 11px; font-weight: 900; letter-spacing: .18em; }
.final-cta h2 { margin: 0; font-family: var(--serif); font-size: 36px; }
.final-cta span { display: block; margin-top: 8px; color: #ffd8de; }
.final-cta a { display: flex; align-items: center; gap: 12px; padding: 18px 24px; color: var(--teal); background: var(--yellow); border-radius: 999px; font-weight: 900; box-shadow: 0 7px 0 #8d101f; }
footer { padding: 42px 24px 120px; color: #bdd0d4; background: #082e39; text-align: center; font-size: 12px; line-height: 1.8; }

.music-player { position: fixed; z-index: 45; left: 18px; bottom: 18px; display: grid; grid-template-columns: 58px auto; max-width: 370px; color: #fff; background: var(--teal); border: 1px solid rgb(255 255 255 / .24); border-radius: 14px; box-shadow: 0 14px 40px rgb(0 0 0 / .25); overflow: hidden; }
.music-player > img { width: 58px; height: 58px; object-fit: cover; }
.music-main { display: flex; align-items: center; gap: 10px; min-width: 250px; padding: 9px 15px; color: #fff; background: transparent; border: 0; text-align: left; cursor: pointer; }
.music-main > span { display: grid; }
.music-main small { color: #91e1da; font-size: 8px; letter-spacing: .12em; }
.music-main strong { font-size: 13px; }
.music-embed { grid-column: 1 / -1; width: 100%; height: 82px; }
.music-embed iframe { width: 100%; height: 100%; border: 0; }
.mobile-sticky { display: none; }

.video-modal { position: fixed; z-index: 100; inset: 0; display: grid; place-items: center; padding: 50px; background: rgb(0 24 31 / .92); }
.video-modal iframe { width: min(1000px, 100%); aspect-ratio: 16 / 9; border: 0; }
.video-modal > button { position: absolute; top: 22px; right: 22px; display: grid; place-items: center; width: 44px; aspect-ratio: 1; color: #fff; background: transparent; border: 1px solid #fff; border-radius: 50%; cursor: pointer; }

@media (max-width: 1100px) {
  .section-shell { width: min(100% - 36px, 980px); }
  .brand-cloud { grid-template-columns: repeat(5, 1fr); }
  .overview-panel { padding: 42px 34px; }
  .gift-section .section-shell { gap: 38px; }
  .gift-picker { grid-template-columns: repeat(2, 1fr); }
  .daily-products { grid-template-columns: 1fr; }
  .supporting-products { grid-template-columns: repeat(3, 1fr); }
  .supporting-products article { grid-template-columns: 1fr; }
  .supporting-products img { height: 140px; }
  .media-section .section-shell { gap: 35px; }
}

@media (min-width: 1101px) {
  .supporting-products.daily-carousel-track { grid-template-columns: 1fr; }
}

@media (max-width: 899px) {
  .section-shell { width: min(100% - 28px, 680px); }
  .hero { background: #071c2f; }
  .hero-picture { display: block; width: 100%; height: min(140vw, 650px); overflow: hidden; }
  .hero-picture img { width: 100%; height: auto; object-fit: cover; object-position: top center; }
  .hero-form-wrap { position: static; width: 100%; height: auto; padding: 0 14px 24px; background: #870d12; }
  .invitation-form.compact { height: auto; max-width: 620px; margin-inline: auto; padding: 18px; border-radius: 14px; }
  .form-speed { padding: 12px; }
  .form-speed span { font-size: 18px; }
  .form-speed strong { font-size: 31px; }
  .form-speed small { font-size: 15px; }
  .invitation-form label { font-size: 14px; }
  .invitation-form input { min-height: 52px; }
  .submit-invitation { min-height: 72px; }
  .submit-invitation b { width: 52px; font-size: 16px; }
  .submit-invitation span { font-size: 21px; }
  .page-index { grid-template-columns: repeat(6, max-content); justify-content: start; overflow-x: auto; }
  .page-index a { min-height: 56px; padding: 7px 13px; }
  .overview { display: flex; flex-direction: column; margin-top: 44px; margin-bottom: 70px; }
  .overview-image { min-height: 300px; order: 2; }
  .overview-panel { padding: 34px 24px; }
  .overview-panel h1 { font-size: 35px; }
  .overview-facts > div { grid-template-columns: 28px 74px 1fr; }
  .gift-section { padding: 70px 0; }
  .gift-section .section-shell { grid-template-columns: 1fr; }
  .gift-intro { text-align: center; }
  .gift-intro > p:not(:first-child) { margin-inline: auto; }
  .daily-section { padding-block: 80px; }
  .daily-title-row { grid-template-columns: 1fr 120px; }
  .sale-seal { width: 105px; border-width: 5px; box-shadow: 0 0 0 4px var(--red); }
  .sale-seal strong { font-size: 44px; }
  .sale-seal b { font-size: 17px; }
  .daily-tabs { overflow-x: auto; grid-template-columns: repeat(6, minmax(100px, 1fr)); padding-bottom: 8px; }
  .daily-feature { grid-template-columns: 1fr; }
  .daily-image { min-height: 330px; }
  .supporting-products { grid-template-columns: 1fr 1fr; }
  .brand-cloud { grid-template-columns: repeat(3, 1fr); }
  .campaign-section { grid-template-columns: 1fr; margin-block: 80px; }
  .campaign-copy { padding: 38px; }
  .benefit-grid { grid-template-columns: repeat(2, 1fr); }
  .story-grid { grid-template-columns: 1fr; }
  .story-feature { grid-row: auto; }
  .story-grid .story-feature > img { height: 320px; }
  .service-grid { grid-template-columns: 1fr 1fr; }
  .service-grid .repair-card { grid-column: 1 / -1; min-height: 360px; }
  .media-section .section-shell { grid-template-columns: 1fr; }
  .video-story { grid-template-columns: 1fr; }
  .video-story > button { min-height: 300px; }
  .voice-faq { grid-template-columns: 1fr; gap: 70px; }
  .access-section .section-shell { grid-template-columns: 1fr; }
  .final-cta { flex-direction: column; gap: 28px; text-align: center; }
  .music-player { bottom: 78px; }
  .mobile-sticky { position: fixed; z-index: 40; left: 10px; right: 10px; bottom: 10px; display: none; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; min-height: 58px; padding: 8px 14px 8px 8px; color: #fff; background: var(--red); border: 2px solid #fff; border-radius: 999px; box-shadow: 0 10px 32px rgb(71 10 17 / .38); font-weight: 900; }
  .mobile-sticky.visible { display: grid; }
  .mobile-sticky b { display: grid; place-items: center; width: 42px; aspect-ratio: 1; color: var(--red); background: var(--yellow); border-radius: 50%; }
}

@media (max-width: 620px) {
  .section-shell { width: calc(100% - 24px); }
  .section-heading h2 { font-size: 35px; }
  .section-heading > span { font-size: 14px; }
  .page-index a { font-size: 11px; }
  .overview-image { min-height: 230px; }
  .overview-panel { padding: 30px 18px; }
  .overview-panel h1 { font-size: 29px; }
  .overview-facts > div { grid-template-columns: 26px 1fr; gap: 5px 10px; }
  .overview-facts > div > strong { grid-column: 2; font-size: 15px; }
  .venue-scale strong { font-size: 34px; }
  .gift-picker { gap: 8px; }
  .gift-picker strong, .gift-picker small { padding-inline: 10px; }
  .gift-picker strong { font-size: 13px; }
  .gift-picker small { font-size: 10px; }
  .daily-title-row { grid-template-columns: 1fr; }
  .sale-seal { justify-self: start; }
  .daily-feature { min-height: 0; }
  .daily-image { min-height: 260px; }
  .daily-copy { padding: 26px 20px 24px; }
  .daily-copy h3 { font-size: 30px; }
  .price-row strong { font-size: 38px; }
  .supporting-products { grid-template-columns: 1fr; }
  .supporting-products article { grid-template-columns: 42% 58%; }
  .supporting-products img { height: 170px; }
  .brand-section { padding-block: 78px; }
  .brand-cloud { grid-template-columns: repeat(2, 1fr); gap: 7px; }
  .brand-logo { min-height: 78px; padding: 8px; }
  .brand-logo img { height: 48px; }
  .campaign-copy { padding: 30px 22px; }
  .campaign-visual { min-height: 310px; }
  .campaign-visual > div { right: 12px; bottom: 12px; min-width: 230px; }
  .benefit-title { grid-template-columns: 1fr; }
  .benefit-count { justify-self: start; }
  .benefit-grid { grid-template-columns: 1fr; }
  .benefit-grid article { min-height: 0; }
  .story-section, .service-section { padding-block: 78px; }
  .story-grid .story-feature > img { height: 270px; }
  .story-grid .story-feature > div { padding: 24px; }
  .story-grid .story-feature h3 { font-size: 30px; }
  .service-grid { grid-template-columns: 1fr; }
  .service-grid .repair-card { grid-column: auto; }
  .media-section { padding-block: 76px; }
  .video-story > button { min-height: 230px; }
  .voice-faq { padding-block: 78px; }
  .venue-cards { grid-template-columns: 1fr; }
  .final-cta h2 { font-size: 29px; }
  .music-player { left: 10px; bottom: 12px; grid-template-columns: 48px auto; max-width: 220px; }
  .music-player.raised { bottom: 80px; }
  .music-player > img { width: 48px; height: 52px; }
  .music-main { min-width: 0; padding: 8px 11px; }
  .music-main strong { font-size: 11px; }
  .music-player.open { right: 10px; }
  .music-embed { height: 78px; }
  .video-modal { padding: 16px; }
}

/* Bright botanical key visual: the photography, live copy and form stay independent. */
.hero.hero-bright {
  position: relative;
  isolation: isolate;
  width: min(1600px, 100%);
  min-height: 900px;
  overflow: hidden;
  color: var(--ink);
  background: #f8f2e7;
  border-bottom: 1px solid #dfd3bc;
}
.hero-bright .hero-backdrop {
  position: absolute;
  z-index: -2;
  inset: 0 0 auto 0;
  height: 67%;
  overflow: hidden;
}
.hero-bright .hero-backdrop img { width: 100%; height: 100%; object-fit: cover; object-position: center 47%; filter: saturate(.84) brightness(1.08); }
.hero-bright .hero-backdrop::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgb(252 249 240 / .98) 0%, rgb(252 249 240 / .82) 26%, rgb(252 249 240 / .58) 54%, rgb(252 249 240 / .22) 72%, rgb(252 249 240 / .75) 100%);
}
.hero-bright::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 57% 0 0;
  background: linear-gradient(180deg, rgb(248 242 231 / .76), #f8f2e7 18%);
}
.hero-copy { position: absolute; z-index: 3; top: 36px; left: 26.5%; width: 43.5%; }
.hero-anniversary {
  width: max-content;
  margin: 0 auto 8px;
  padding: 8px 38px;
  color: var(--teal);
  border: 1px solid #84a38d;
  background: rgb(255 253 247 / .86);
  font-family: var(--serif);
  font-size: clamp(15px, 1.45vw, 23px);
  font-weight: 900;
  letter-spacing: .08em;
}
.hero-copy h1 { margin: 0; text-align: center; font-family: var(--serif); font-size: clamp(48px, 5.4vw, 82px); line-height: .96; letter-spacing: -.065em; text-shadow: 0 2px 0 #fff; }
.hero-copy h1 > span { margin-right: .08em; font-family: Georgia, serif; font-size: .73em; font-weight: 500; letter-spacing: -.04em; }
.hero-copy h1 > strong { display: block; margin-top: 6px; color: var(--red); font-size: .86em; }
.hero-lead { margin: 14px 0 8px; color: #3d4c3f; text-align: center; font-family: var(--serif); font-size: clamp(14px, 1.18vw, 19px); font-weight: 700; line-height: 1.55; letter-spacing: .04em; }
.hero-sale-row { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 10px; }
.hero-sale { display: flex; align-items: center; margin: 0; padding: 4px 24px 8px 18px; color: #fff; background: var(--red); box-shadow: 8px 8px 0 #efd9a3; transform: rotate(-2deg); }
.hero-sale span { margin-right: 4px; font-size: 18px; font-weight: 900; writing-mode: vertical-rl; }
.hero-sale strong { font-family: Georgia, serif; font-size: clamp(54px, 5.5vw, 86px); font-weight: 500; line-height: .86; letter-spacing: -.06em; }
.hero-sale b { align-self: flex-end; margin-bottom: 9px; font-family: Georgia, serif; font-size: clamp(20px, 2.2vw, 34px); }
.hero-limited { margin: 0; color: var(--teal); font-family: var(--serif); font-size: clamp(16px, 1.4vw, 22px); font-weight: 900; line-height: 1.35; }
.hero-limited strong { color: var(--ink); font-size: 1.28em; }
.hero-facts { display: grid; gap: 7px; margin-top: 23px; padding: 13px 18px; background: rgb(255 253 247 / .9); border-top: 1px solid #b7a674; border-bottom: 1px solid #b7a674; }
.hero-facts p { display: grid; grid-template-columns: 28px 58px 1fr; align-items: center; gap: 8px; margin: 0; }
.hero-facts svg { color: var(--teal); }
.hero-facts p > span { color: var(--muted); font-size: 11px; font-weight: 900; }
.hero-facts strong { font-family: var(--serif); font-size: clamp(14px, 1.32vw, 21px); }
.hero-facts strong span { display: inline-grid; place-items: center; width: 23px; aspect-ratio: 1; margin: 0 4px; color: #fff; background: var(--teal); border-radius: 50%; font-family: sans-serif; font-size: 10px; }
.hero-person { position: absolute; z-index: 2; left: -1.5%; bottom: 0; width: 31%; height: 95%; pointer-events: none; }
.hero-person > img { width: 100%; height: 100%; object-fit: contain; object-position: left bottom; filter: drop-shadow(15px 18px 28px rgb(61 45 30 / .16)); }
.hero-person > p { position: absolute; left: 18%; bottom: 18px; margin: 0; color: #fff; text-shadow: 0 2px 8px rgb(0 0 0 / .8); font-family: var(--serif); font-size: 18px; font-weight: 900; }
.hero-person > p span { display: block; margin-top: 3px; font-family: sans-serif; font-size: 9px; font-weight: 700; }
.hero-bright .hero-form-wrap { position: absolute; z-index: 5; top: 34px; right: 1.7%; width: 27%; height: calc(100% - 68px); }
.hero-bright .invitation-form { height: calc(100% - 112px); padding: 18px; background: rgb(255 253 247 / .97); border-color: #d7c7a8; border-radius: 20px; box-shadow: 0 20px 55px rgb(67 48 31 / .17); }
.hero-bright .form-speed { background: var(--red); }
.hero-bright .submit-invitation { background: var(--teal); border-color: #fff0a8; box-shadow: 0 7px 0 #143d2f, 0 14px 22px rgb(39 89 69 / .24); }
.hero-bright .submit-invitation:hover { background: #1f4e3b; }
.hero-gift { display: grid; grid-template-columns: 38px 1fr; align-items: center; gap: 0 10px; min-height: 92px; margin: 16px 0 0; padding: 14px 16px; color: #fff; background: var(--teal); border-radius: 12px; box-shadow: 0 10px 24px rgb(39 89 69 / .18); }
.hero-gift svg { grid-row: 1 / 3; color: var(--yellow); }
.hero-gift span { font-size: 10px; font-weight: 900; letter-spacing: .12em; }
.hero-gift strong { font-family: var(--serif); font-size: clamp(17px, 1.5vw, 24px); }
.hero-gallery { position: absolute; z-index: 4; left: 25.5%; bottom: 27px; display: grid; grid-template-columns: repeat(3, 1fr); width: 44.5%; height: 178px; overflow: hidden; background: #fff; border: 7px solid #fff; box-shadow: 0 14px 40px rgb(70 51 32 / .2); }
.hero-gallery figure { position: relative; min-width: 0; margin: 0; overflow: hidden; }
.hero-gallery figure + figure { border-left: 5px solid #fff; }
.hero-gallery img { width: 100%; height: 100%; object-fit: cover; }
.hero-gallery figcaption { position: absolute; left: 14px; bottom: 9px; color: #fff; font-family: Georgia, serif; font-size: 22px; font-style: italic; text-shadow: 0 2px 6px rgb(0 0 0 / .72); }
.hero.hero-approved { position: relative; width: min(1536px, 100%); min-height: 0; aspect-ratio: 3 / 2; overflow: hidden; background: #f7f1e7; }
.hero-approved-picture { position: absolute; inset: 0; display: block; width: 100%; height: 100%; overflow: hidden; }
.hero-approved-picture img { width: 100%; max-width: 100%; height: 100%; object-fit: cover; object-position: left top; }
.hero-approved .hero-form-wrap { position: absolute; z-index: 5; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.hero-approved .invitation-form.compact { position: absolute; inset: 0; display: block; width: 100%; height: 100%; padding: 0; background: transparent; border: 0; border-radius: 0; box-shadow: none; pointer-events: none; }
.hero-approved .invitation-form.compact .form-speed,
.hero-approved .invitation-form.compact .form-note,
.hero-approved .hero-gift { display: none; }
.hero-approved .invitation-form.compact label { position: absolute; left: 73.3%; display: block; width: 24.2%; height: 5.95%; pointer-events: auto; }
.hero-approved .invitation-form.compact label:nth-of-type(1) { top: 27.9%; }
.hero-approved .invitation-form.compact label:nth-of-type(2) { top: 39.9%; }
.hero-approved .invitation-form.compact label:nth-of-type(3) { top: 52%; }
.hero-approved .invitation-form.compact label > span { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hero-approved .invitation-form.compact input { width: 100%; height: 100%; min-height: 0; padding: 8px 14px; color: #40362f; background: rgb(255 255 255 / .97); border: 1.5px solid #c7b9a3; border-radius: 5px; box-shadow: inset 0 1px 2px rgb(54 41 28 / .06); font-size: clamp(13px, 1.06vw, 17px); }
.hero-approved .invitation-form.compact input::placeholder { color: #9f9994; opacity: 1; }
.hero-approved .submit-invitation { position: absolute; left: 71.35%; top: 59.8%; width: 27.4%; min-height: 0; margin: 0; padding: 0; background: transparent; border: 0; border-radius: 0; box-shadow: none; filter: drop-shadow(0 7px 8px rgb(31 67 42 / .2)); pointer-events: auto; }
.hero-approved .submit-invitation img { width: 100%; height: auto; }
.hero-approved .submit-invitation:hover { background: transparent; box-shadow: none; transform: translateY(-2px); filter: drop-shadow(0 10px 10px rgb(31 67 42 / .24)); }
.hero-approved .submit-invitation:active { box-shadow: none; transform: translateY(2px); }
.gift-section { background: var(--teal); }
.brand-section {
  position: relative;
  overflow: hidden;
  color: var(--ink);
  background: linear-gradient(rgb(251 248 239 / .93), rgb(251 248 239 / .97)), url("../images/venue-overview.png") center / cover;
}
.brand-section::before { content: "BRANDS"; position: absolute; left: -2vw; top: 20px; color: rgb(39 89 69 / .045); font: 900 clamp(110px, 18vw, 280px)/1 Georgia, serif; letter-spacing: -.08em; }
.brand-section .section-heading { position: relative; z-index: 2; }
.brand-section .section-heading > p { color: var(--red); }
.brand-section .section-heading > span { color: var(--muted); }
.brand-filters { position: relative; z-index: 2; }
.brand-filters button { color: var(--teal); background: rgb(255 255 255 / .75); border-color: #b7c9bd; }
.brand-filters button.selected { color: #fff; background: var(--teal); border-color: var(--teal); }
.brand-cloud {
  position: relative;
  z-index: 2;
  grid-template-columns: repeat(5, 1fr);
  gap: 18px 24px;
  min-height: 0;
  padding: 42px 44px;
  background: rgb(255 255 255 / .93);
  border-radius: 44px 8px 44px 8px;
  box-shadow: 0 28px 70px rgb(50 41 30 / .12);
}
.brand-logo { min-height: 92px; padding: 12px 16px; background: transparent; border: 0; border-radius: 0; box-shadow: none; opacity: 0; animation: none; }
.brand-logo img { width: 100%; height: 62px; object-fit: contain; }
.brand-cloud.is-visible .brand-logo { animation: brand-fly-focus .82s cubic-bezier(.2, .82, .22, 1) both; animation-delay: var(--brand-delay); }
.brand-cloud.is-visible .brand-logo:nth-child(4n + 1) { --brand-x: -170px; --brand-y: -90px; --brand-r: -7deg; }
.brand-cloud.is-visible .brand-logo:nth-child(4n + 2) { --brand-x: 80px; --brand-y: -150px; --brand-r: 6deg; }
.brand-cloud.is-visible .brand-logo:nth-child(4n + 3) { --brand-x: 180px; --brand-y: 70px; --brand-r: -5deg; }
.brand-cloud.is-visible .brand-logo:nth-child(4n) { --brand-x: -90px; --brand-y: 120px; --brand-r: 5deg; }
@keyframes brand-fly-focus { from { opacity: 0; filter: blur(12px); transform: translate(var(--brand-x), var(--brand-y)) rotate(var(--brand-r)) scale(.72); } to { opacity: 1; filter: blur(0); transform: translate(0, 0) rotate(0) scale(1); } }
.brand-more { position: relative; z-index: 2; width: max-content; max-width: 100%; margin: -18px auto 0; padding: 12px 28px; color: #fff; background: var(--red); font-family: var(--serif); font-size: 18px; font-weight: 900; box-shadow: 6px 7px 0 var(--yellow); transform: rotate(-1deg); }
.brand-note { position: relative; z-index: 2; color: var(--muted); }
.benefit-section {
  padding: 110px 0 120px;
  background: linear-gradient(rgb(251 248 239 / .92), rgb(251 248 239 / .96)), url("../images/venue-overview.png") center / cover;
}
.benefit-section .section-shell { position: relative; }
.benefit-grid { grid-template-columns: repeat(4, 1fr); gap: 14px; }
.benefit-grid article { min-height: 210px; overflow: hidden; background: rgb(255 255 255 / .96); border: 0; border-top: 6px solid var(--turquoise); box-shadow: 0 14px 35px rgb(54 43 31 / .1); }
.benefit-grid article:nth-child(1), .benefit-grid article:nth-child(3) { color: #fff; background: var(--teal); border-top-color: var(--yellow); }
.benefit-grid article:nth-child(2), .benefit-grid article:nth-child(4) { color: #fff; background: var(--red); border-top-color: var(--yellow); }
.benefit-grid article:nth-child(-n + 4) { min-height: 245px; }
.benefit-grid article:nth-child(-n + 4) svg, .benefit-grid article:nth-child(-n + 4) .benefit-number { color: var(--yellow); }
.benefit-grid article:nth-child(-n + 4) p { color: rgb(255 255 255 / .82); }
@media (min-width: 900px) {
  .daily-products { grid-template-columns: 1fr; }
  .daily-feature { grid-template-columns: 1.15fr .85fr; min-height: 420px; }
  .daily-image img { object-fit: contain; }
  .supporting-products { grid-template-columns: repeat(3, 1fr); }
  .supporting-products article { grid-template-columns: 1fr; min-height: 0; }
  .supporting-products img { height: 150px; object-fit: contain; background: #eef2f0; }
}
.lineup-section .story-grid article:nth-child(2) > img, .lineup-section .story-grid article:nth-child(3) > img { content: normal; }
.voices-section { padding: 110px 0; color: #fff; background: var(--teal); }
.voices-section .section-heading > p { color: #f1ce68; }
.voice-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 46px; }
.voice-cards article { position: relative; min-height: 280px; padding: 34px 30px; color: var(--ink); background: #fff; border-radius: 28px 8px 28px 8px; box-shadow: 9px 10px 0 var(--yellow); }
.voice-cards article:nth-child(2) { transform: translateY(18px); }
.voice-cards article > span { display: inline-block; padding: 6px 10px; color: #fff; background: var(--red); font-size: 11px; font-weight: 900; }
.voice-cards h3 { margin: 25px 0 14px; font-family: var(--serif); font-size: 24px; line-height: 1.55; }
.voice-cards p { margin: 0; color: var(--muted); line-height: 1.9; }
.access-section .section-shell { grid-template-columns: 1fr; }
.access-intro { max-width: 760px; margin: 0 auto 42px; text-align: center; }
.venue-cards article { padding: 0; overflow: hidden; border-radius: 22px; box-shadow: 0 18px 42px rgb(49 66 52 / .12); }
.venue-cards article > img { width: 100%; height: 285px; object-fit: cover; }
.venue-cards article:nth-child(2) > img { object-position: center 45%; }
.venue-cards article > div { padding: 30px 34px 34px; }
.venue-cards article > div > span { display: inline-block; padding: 5px 9px; color: #fff; background: var(--teal); font-size: 11px; font-weight: 900; }
.faq-section { padding-block: 110px; }
.faq-section .faq { width: min(880px, 100%); margin: 44px auto 0; padding: 12px 40px; background: #fff; border-top: 6px solid var(--red); box-shadow: 0 18px 48px rgb(54 43 31 / .1); }
.story-section { background: #eaf1e8; }
.media-section { background: #1f4638; }
.access-section { background: #e5efe6; }
footer { background: #1a3a30; }

@media (max-width: 1100px) and (min-width: 900px) {
  .hero.hero-bright { min-height: 790px; }
  .hero-copy { left: 25%; width: 45%; }
  .hero-person { width: 29%; }
  .hero-bright .hero-form-wrap { width: 28.5%; right: 1%; }
  .hero-bright .invitation-form { padding: 13px; }
  .hero-bright .form-speed { padding: 8px; }
  .hero-gallery { left: 24%; width: 46%; height: 150px; }
  .brand-cloud { grid-template-columns: repeat(4, 1fr); padding: 34px; }
  .benefit-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 899px) {
  .hero.hero-bright { min-height: 0; padding-bottom: 0; background: #f8f2e7; }
  .hero-bright .hero-backdrop { height: 520px; }
  .hero-bright .hero-backdrop::after { background: linear-gradient(180deg, rgb(252 249 240 / .36), rgb(252 249 240 / .78) 48%, #f8f2e7 100%); }
  .hero-bright::after { display: none; }
  .hero-copy { position: relative; top: auto; left: auto; width: 100%; min-height: 690px; padding: 20px 14px 0; }
  .hero-anniversary { margin: 0 auto 8px; padding: 6px 20px; font-size: 15px; }
  .hero-copy h1 { position: relative; z-index: 3; margin-left: 29%; padding: 8px 4px; background: rgb(255 253 247 / .74); font-size: clamp(37px, 10.8vw, 58px); line-height: 1.02; }
  .hero-copy h1 > span { display: block; margin: 0; font-size: .46em; }
  .hero-copy h1 > strong { font-size: .8em; }
  .hero-lead { margin-left: 38%; font-size: 13px; }
  .hero-sale-row { position: absolute; z-index: 4; top: 305px; right: 12px; width: 63%; gap: 11px; }
  .hero-sale { padding: 5px 13px 7px 10px; box-shadow: 5px 6px 0 #efd9a3; }
  .hero-sale span { font-size: 13px; }
  .hero-sale strong { font-size: clamp(56px, 17vw, 78px); }
  .hero-sale b { margin-bottom: 6px; font-size: 21px; }
  .hero-limited { font-size: 13px; }
  .hero-person { z-index: 2; top: 86px; bottom: auto; left: -18%; width: 72%; height: 510px; }
  .hero-person > p { left: 28%; bottom: 20px; font-size: 15px; }
  .hero-facts { position: absolute; z-index: 5; left: 12px; right: 12px; top: 463px; margin: 0; padding: 12px 14px; background: rgb(255 253 247 / .96); box-shadow: 0 12px 32px rgb(57 42 27 / .12); }
  .hero-facts p { grid-template-columns: 25px 48px 1fr; }
  .hero-facts strong { font-size: 14px; }
  .hero-gallery { display: none; }
  .hero-bright .hero-form-wrap { position: relative; top: auto; right: auto; width: 100%; height: auto; padding: 0 12px 24px; background: transparent; }
  .hero-bright .invitation-form { height: auto; padding: 18px; border-radius: 18px; }
  .hero-gift { min-height: 80px; margin-top: 12px; }
  .hero.hero-approved { aspect-ratio: auto; background: #f8f1e4; }
  .hero-approved-picture { position: relative; inset: auto; width: 100%; height: auto; aspect-ratio: 3 / 4; overflow: hidden; background: #fbf8ef; }
  .hero-approved-picture img { width: 100%; max-width: 100%; height: 100%; object-fit: cover; object-position: center top; }
  .hero-approved .hero-form-wrap { position: relative; inset: auto; display: block; width: 100%; height: auto; padding: 18px 14px 30px; background: linear-gradient(180deg, #f8f1e4, #ede1cc); pointer-events: auto; }
  .hero-approved .invitation-form.compact { position: relative; inset: auto; display: grid; gap: 15px; width: min(620px, 100%); height: auto; margin: 0 auto; padding: 0; background: transparent; border: 0; border-radius: 0; box-shadow: none; pointer-events: auto; }
  .hero-approved .invitation-form.compact .form-speed { display: none; }
  .hero-approved .invitation-form.compact label { position: static; display: grid; gap: 6px; width: auto; height: auto; font-size: 15px; pointer-events: auto; }
  .hero-approved .invitation-form.compact label > span { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; white-space: normal; }
  .hero-approved .invitation-form.compact input { width: 100%; height: auto; min-height: 56px; padding: 12px 14px; border-radius: 6px; font-size: 17px; }
  .hero-approved .submit-invitation { position: static; width: 100%; margin: 2px 0 0; filter: drop-shadow(0 8px 9px rgb(31 67 42 / .2)); }
  .hero-approved .hero-gift { display: none; }
  .brand-cloud { grid-template-columns: repeat(3, 1fr); padding: 28px 22px; gap: 12px; border-radius: 26px 6px; }
  .benefit-grid { grid-template-columns: repeat(2, 1fr); }
  .voice-cards { grid-template-columns: 1fr; }
  .voice-cards article:nth-child(2) { transform: none; }
}

@media (max-width: 480px) {
  .hero-copy { min-height: 650px; }
  .hero-bright .hero-backdrop { height: 480px; }
  .hero-copy h1 { margin-left: 27%; font-size: 38px; }
  .hero-lead { margin-left: 40%; font-size: 11px; }
  .hero-person { top: 100px; left: -24%; width: 78%; height: 450px; }
  .hero-sale-row { top: 300px; width: 65%; }
  .hero-sale strong { font-size: 54px; }
  .hero-facts { top: 445px; }
  .hero-facts p { grid-template-columns: 23px 41px 1fr; gap: 6px; }
  .hero-facts p > span { font-size: 9px; }
  .hero-facts strong { font-size: 12px; }
  .gift-picker { grid-template-columns: 1fr; }
  .gift-picker img { aspect-ratio: 16 / 10; }
  .brand-cloud { grid-template-columns: repeat(2, 1fr); padding: 18px 12px; gap: 8px; }
  .brand-logo { min-height: 72px; padding: 8px; }
  .brand-logo img { height: 48px; }
  .benefit-grid { grid-template-columns: 1fr; }
  .venue-cards article > img { height: 220px; }
  .venue-cards article > div { padding: 24px 22px 28px; }
  .faq-section .faq { padding: 6px 20px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Revised editorial flow: current-LP content, reordered around the conversion path. */
main > .hero-approved { order: 0; }
main > .page-index { order: 1; }
main > .overview { order: 2; }
main > .gift-section { order: 3; }
main > .benefit-section { order: 4; }
main > .brand-section { order: 5; }
main > .daily-section { order: 6; }
main > .lineup-section { order: 7; }
main > .simultaneous-section { order: 8; }
main > .service-section { order: 9; }
main > .campaign-section { order: 10; }
main > .voices-section { order: 11; }
main > .access-section { order: 12; }
main > .faq-section { order: 13; }
main > .event-details-section { order: 14; }
main > .final-cta { order: 15; }
main > footer { order: 16; }
main > .music-player,
main > .quick-invitation,
main > .invitation-layer,
main > .video-modal { order: 99; }

#overview,
#gift,
#benefits,
#brands,
#daily,
#guide,
#simultaneous,
#access { scroll-margin-top: 78px; }

.page-index { grid-template-columns: repeat(8, 1fr); }
.page-index a { min-width: 0; padding-inline: 7px; font-size: 12px; }

/* 9/19 feature + continuously moving 9/20–9/24 rail. */
.daily-tabs { display: none; }
.daily-products { grid-template-columns: minmax(0, 1.32fr) minmax(310px, .68fr); margin-top: 48px; }
.daily-feature { min-height: 540px; }
.daily-image img { object-fit: cover; }
.daily-carousel-window { position: relative; height: 540px; overflow: hidden; mask-image: linear-gradient(transparent, #000 7%, #000 93%, transparent); }
.daily-carousel-window::before,
.daily-carousel-window::after { content: ""; position: absolute; z-index: 2; left: 0; right: 0; height: 54px; pointer-events: none; }
.daily-carousel-window::before { top: 0; background: linear-gradient(var(--ivory), transparent); }
.daily-carousel-window::after { bottom: 0; background: linear-gradient(transparent, var(--ivory)); }
.daily-carousel-track { display: grid; gap: 12px; animation: daily-vertical 28s linear infinite; }
.daily-carousel-window:hover .daily-carousel-track,
.daily-carousel-window:focus-within .daily-carousel-track { animation-play-state: paused; }
.daily-carousel-track article { min-height: 160px; grid-template-columns: 44% 56%; }
.daily-carousel-track img { height: 160px; object-fit: cover; }
@keyframes daily-vertical { to { transform: translateY(-50%); } }

/* 22 benefits: photographic, varied editorial tiles instead of equal icon cards. */
.benefit-section { background: #f4efe6; }
.benefit-title { align-items: center; }
.benefit-count { color: #fff; background: #173c59; box-shadow: 8px 9px 0 #e4b65c; }
.benefit-grid { grid-template-columns: repeat(12, 1fr); grid-auto-flow: dense; gap: 16px; }
.benefit-grid .benefit-card { --benefit-accent: #315d7a; grid-column: span 3; display: grid; grid-template-rows: 128px 1fr; min-height: 290px; padding: 0; overflow: hidden; color: var(--ink); background: #fff; border: 0; border-radius: 22px 7px 22px 7px; box-shadow: 0 16px 38px rgb(69 51 36 / .11); }
.benefit-grid article.benefit-card { color: var(--ink); background: #fff; border-top: 0; }
.benefit-grid .benefit-card:nth-child(6n + 2) { --benefit-accent: #c9674d; }
.benefit-grid .benefit-card:nth-child(6n + 3) { --benefit-accent: #9b7638; }
.benefit-grid .benefit-card:nth-child(6n + 4) { --benefit-accent: #5f718f; }
.benefit-grid .benefit-card:nth-child(6n + 5) { --benefit-accent: #7a5f75; }
.benefit-grid .benefit-card:nth-child(6n) { --benefit-accent: #527467; }
.benefit-grid .benefit-card:nth-child(1),
.benefit-grid .benefit-card:nth-child(2),
.benefit-grid .benefit-card:nth-child(10),
.benefit-grid .benefit-card:nth-child(15),
.benefit-grid .benefit-card:nth-child(22) { grid-column: span 6; grid-template-rows: 205px 1fr; min-height: 365px; }
.benefit-grid .benefit-card:nth-child(3),
.benefit-grid .benefit-card:nth-child(4),
.benefit-grid .benefit-card:nth-child(5) { grid-column: span 4; grid-template-rows: 165px 1fr; min-height: 325px; }
.benefit-grid .benefit-card > img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.86) contrast(.97); }
.benefit-grid .benefit-card > div { position: relative; padding: 23px 21px 22px; border-top: 7px solid var(--benefit-accent); }
.benefit-grid .benefit-card .benefit-number { z-index: 2; top: 12px; left: 12px; right: auto; display: grid; place-items: center; width: 43px; aspect-ratio: 1; color: #fff; background: var(--benefit-accent); border: 2px solid rgb(255 255 255 / .84); border-radius: 50%; font-size: 15px; box-shadow: 0 5px 14px rgb(0 0 0 / .2); }
.benefit-grid article.benefit-card h3 { margin: 0 0 9px; color: var(--benefit-accent); font-size: 21px; line-height: 1.4; }
.benefit-grid article.benefit-card p { color: #665f57; }

.brand-cloud.has-settled .brand-logo { opacity: 1; animation: none; filter: none; transform: none; }

/* Product magazine chapters reconstructed from the current flyers. */
.lineup-section { background: #f7f3eb; }
.product-index { position: sticky; z-index: 12; top: 64px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 48px 0 64px; padding: 8px; background: rgb(255 255 255 / .92); border: 1px solid #e4dacc; border-radius: 16px; backdrop-filter: blur(12px); box-shadow: 0 12px 30px rgb(66 47 31 / .08); }
.product-index a { display: grid; grid-template-columns: 1fr auto; gap: 3px 8px; min-width: 0; padding: 14px 16px; border-radius: 11px; transition: color .2s ease, background .2s ease; }
.product-index a:hover { color: #fff; background: #173c59; }
.product-index span { grid-column: 1 / -1; color: #b35a46; font-family: Arial, sans-serif; font-size: 9px; font-weight: 900; letter-spacing: .12em; }
.product-index a:hover span { color: #f3cf7c; }
.product-index strong { min-width: 0; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.product-chapters { display: grid; gap: 86px; }
.product-chapter { --chapter-accent: #315d7a; scroll-margin-top: 140px; }
.product-chapter-2 { --chapter-accent: #a87240; }
.product-chapter-3 { --chapter-accent: #7a5f75; }
.product-chapter-4 { --chapter-accent: #527467; }
.product-chapter > header { display: grid; grid-template-columns: .38fr .62fr; align-items: end; gap: 8px 32px; margin-bottom: 24px; padding-bottom: 18px; border-bottom: 2px solid var(--chapter-accent); }
.product-chapter > header p { grid-row: span 2; margin: 0; color: var(--chapter-accent); font: 900 clamp(25px, 3.6vw, 52px)/1 Georgia, serif; letter-spacing: -.04em; }
.product-chapter > header h3 { margin: 0; font-family: var(--serif); font-size: clamp(26px, 3vw, 42px); }
.product-chapter > header span { color: var(--muted); }
.product-card-row { display: grid; grid-template-columns: 1.2fr .9fr .9fr; gap: 16px; }
.product-card { overflow: hidden; background: #fff; border-radius: 4px 24px 4px 24px; box-shadow: 0 18px 44px rgb(61 46 32 / .1); }
.product-card > img { width: 100%; height: 245px; object-fit: cover; }
.product-card.featured > img { height: 300px; }
.product-card > div { position: relative; padding: 24px 22px 25px; }
.product-card > div > span { position: absolute; right: 18px; top: 16px; color: rgb(49 93 122 / .2); font: 700 30px/1 Georgia, serif; }
.product-card h4 { margin: 0 32px 8px 0; font-family: var(--serif); font-size: 22px; line-height: 1.45; }
.product-card p { margin: 0 0 14px; color: var(--muted); font-size: 12px; }
.product-card strong { color: #c74435; font: 700 29px/1.2 Georgia, serif; }
.product-card strong small { margin-left: 4px; font: 700 10px/1 sans-serif; }
.product-card .special-price { display: inline-block; padding: 7px 11px; color: #fff; background: var(--chapter-accent); font: 900 14px/1.2 sans-serif; }
.product-card b { float: right; margin-top: 7px; color: var(--chapter-accent); font-size: 12px; }

.simultaneous-section { padding: 110px 0; background: #ede7dd; }
.simultaneous-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 18px; margin-top: 48px; }
.simultaneous-grid article { grid-column: span 6; display: grid; grid-template-columns: 45% 55%; min-height: 330px; overflow: hidden; background: #fff; border-radius: 24px 5px 24px 5px; box-shadow: 0 18px 42px rgb(61 45 31 / .11); }
.simultaneous-grid article:nth-child(3) { grid-column: span 7; }
.simultaneous-grid article:nth-child(4) { grid-column: span 5; }
.simultaneous-grid img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.simultaneous-grid article:nth-child(3) img { content: url("../images/campaign-splie-card.jpg"); object-fit: cover; object-position: center 38%; background: #e8f3ff; }
.simultaneous-grid article:nth-child(4) { grid-template-columns: 1fr; grid-template-rows: 135px 1fr; }
.simultaneous-grid article:nth-child(4) img { object-fit: contain; background: #fff; }
.simultaneous-grid article > div { align-self: center; padding: 30px; }
.simultaneous-grid p { margin: 0 0 10px; color: #b45a47; font: 900 10px/1.2 Arial, sans-serif; letter-spacing: .15em; }
.simultaneous-grid h3 { margin: 0 0 14px; font-family: var(--serif); font-size: 26px; line-height: 1.45; }
.simultaneous-grid span { color: var(--muted); line-height: 1.8; }

.voices-section { background: #173c59; }
.voices-video { margin-top: 46px; color: var(--ink); background: #fff; }
.voices-video > div { color: var(--ink); background: #fff; }
.voices-video > div > span { color: var(--muted); }

.access-guides { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 26px; }
.access-guides figure { position: relative; height: 450px; margin: 0; overflow: hidden; background: #fff; border-radius: 20px; box-shadow: 0 16px 40px rgb(49 66 52 / .11); }
.access-guides img { width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.access-guides figcaption { position: absolute; left: 18px; right: 18px; bottom: 18px; display: grid; gap: 3px; padding: 15px 18px; color: #fff; background: rgb(23 60 89 / .92); border-radius: 10px; }
.access-guides figcaption span { font-size: 12px; }
.event-details { margin-top: 84px; padding: 48px; background: #fff; border-radius: 24px 6px 24px 6px; box-shadow: 0 18px 48px rgb(49 66 52 / .1); }
.event-details dl { display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px; margin: 36px 0 0; }
.event-details dl > div { display: grid; grid-template-columns: 110px 1fr; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.event-details dt { color: #315d7a; font-weight: 900; }
.event-details dd { margin: 0; }

/* Hero-exit conversion prompt: modal on desktop, bottom sheet on mobile. */
.quick-invitation { position: fixed; z-index: 45; left: 50%; bottom: 16px; display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 14px; width: min(690px, calc(100% - 32px)); min-height: 74px; padding: 10px 18px 10px 24px; color: #fff; background: linear-gradient(110deg, #173c59, #234e6b 63%, #c84e3d 63%); border: 2px solid #f3cf7c; border-radius: 18px; box-shadow: 0 16px 46px rgb(25 41 55 / .35); opacity: 0; pointer-events: none; transform: translate(-50%, calc(100% + 30px)); transition: opacity .28s ease, transform .38s cubic-bezier(.2, .8, .2, 1); cursor: pointer; }
.quick-invitation.visible { opacity: 1; pointer-events: auto; transform: translate(-50%, 0); }
.quick-invitation > span { display: grid; justify-items: start; }
.quick-invitation small { color: #f3cf7c; font-size: 11px; font-weight: 900; letter-spacing: .12em; }
.quick-invitation strong { font-family: var(--serif); font-size: 23px; }
.quick-invitation > b { display: grid; place-items: center; width: 48px; aspect-ratio: 1; color: #c84e3d; background: #fff; border-radius: 50%; }
.invitation-layer { position: fixed; z-index: 70; inset: 0; display: grid; place-items: center; padding: 28px; background: rgb(15 28 37 / .72); backdrop-filter: blur(8px); animation: layer-in .25s ease both; }
.invitation-layer-card { position: relative; display: grid; grid-template-columns: .8fr 1.2fr; gap: 26px; width: min(900px, 100%); max-height: calc(100dvh - 56px); padding: 32px; overflow: auto; background: #f6f0e5; border: 1px solid #ebca78; border-radius: 28px; box-shadow: 0 28px 90px rgb(0 0 0 / .32); }
.invitation-layer-copy { align-self: center; padding: 24px; }
.invitation-layer-copy p { margin: 0 0 12px; color: #c84e3d; font: 900 11px/1.2 Arial, sans-serif; letter-spacing: .16em; }
.invitation-layer-copy h2 { margin: 0 0 18px; color: #173c59; font-family: var(--serif); font-size: clamp(38px, 4vw, 46px); line-height: 1.25; letter-spacing: -.06em; white-space: nowrap; }
.invitation-layer-copy span { color: var(--muted); line-height: 1.8; }
.invitation-layer-card .invitation-form { height: auto; }
.invitation-layer-close { position: absolute; z-index: 2; top: 12px; right: 12px; display: grid; place-items: center; width: 42px; aspect-ratio: 1; color: #fff; background: #173c59; border: 0; border-radius: 50%; cursor: pointer; }
@keyframes layer-in { from { opacity: 0; } }

@media (max-width: 1100px) {
  .page-index { grid-template-columns: repeat(8, max-content); justify-content: start; overflow-x: auto; }
  .page-index a { padding-inline: 13px; }
  .daily-products { grid-template-columns: 1fr; }
  .daily-carousel-window { height: 190px; margin-top: 18px; mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); }
  .daily-carousel-window::before { inset: 0 auto 0 0; width: 50px; height: auto; background: linear-gradient(90deg, var(--ivory), transparent); }
  .daily-carousel-window::after { inset: 0 0 0 auto; width: 50px; height: auto; background: linear-gradient(90deg, transparent, var(--ivory)); }
  .daily-carousel-track { display: flex; width: max-content; animation-name: daily-horizontal; }
  .daily-carousel-track article { flex: 0 0 310px; min-height: 170px; grid-template-columns: 43% 57%; }
  .daily-carousel-track img { height: 170px; }
  @keyframes daily-horizontal { to { transform: translateX(-50%); } }
  .benefit-grid .benefit-card { grid-column: span 4; }
  .benefit-grid .benefit-card:nth-child(1),
  .benefit-grid .benefit-card:nth-child(2),
  .benefit-grid .benefit-card:nth-child(10),
  .benefit-grid .benefit-card:nth-child(15),
  .benefit-grid .benefit-card:nth-child(22) { grid-column: span 6; }
  .benefit-grid .benefit-card:nth-child(3),
  .benefit-grid .benefit-card:nth-child(4),
  .benefit-grid .benefit-card:nth-child(5) { grid-column: span 4; }
  .product-index { top: 56px; }
  .product-card-row { grid-template-columns: repeat(3, 1fr); }
  .product-card > img,
  .product-card.featured > img { height: 220px; }
  .simultaneous-grid article,
  .simultaneous-grid article:nth-child(3),
  .simultaneous-grid article:nth-child(4) { grid-column: span 12; }
}

@media (max-width: 899px) {
  .benefit-grid .benefit-card,
  .benefit-grid .benefit-card:nth-child(1),
  .benefit-grid .benefit-card:nth-child(2),
  .benefit-grid .benefit-card:nth-child(3),
  .benefit-grid .benefit-card:nth-child(4),
  .benefit-grid .benefit-card:nth-child(5),
  .benefit-grid .benefit-card:nth-child(10),
  .benefit-grid .benefit-card:nth-child(15),
  .benefit-grid .benefit-card:nth-child(22) { grid-column: span 6; grid-template-rows: 155px 1fr; min-height: 315px; }
  .product-index { grid-template-columns: repeat(4, minmax(180px, 1fr)); overflow-x: auto; }
  .product-chapter > header { grid-template-columns: 1fr; }
  .product-chapter > header p { grid-row: auto; }
  .product-card-row { grid-template-columns: 1.2fr .9fr .9fr; overflow-x: auto; scroll-snap-type: x mandatory; padding: 0 4px 18px; }
  .product-card { min-width: 290px; scroll-snap-align: start; }
  .access-guides { grid-template-columns: 1fr; }
  .access-guides figure { height: 390px; }
  .event-details { padding: 34px 28px; }
  .event-details dl { grid-template-columns: 1fr; }
  .quick-invitation { left: 10px; right: 10px; bottom: 10px; width: auto; min-height: 64px; padding: 8px 13px 8px 17px; border-radius: 16px; transform: translateY(calc(100% + 30px)); }
  .quick-invitation.visible { transform: translateY(0); }
  .quick-invitation strong { font-size: 19px; }
  .quick-invitation > b { width: 42px; }
  .invitation-layer { place-items: end stretch; padding: 0; background: rgb(15 28 37 / .62); }
  .invitation-layer-card { grid-template-columns: 1fr; gap: 0; width: 100%; max-height: 92dvh; padding: 22px 14px 18px; border-radius: 28px 28px 0 0; animation: sheet-up .36s cubic-bezier(.2, .82, .22, 1) both; }
  .invitation-layer-copy { padding: 10px 12px 16px; }
  .invitation-layer-copy h2 { margin-bottom: 8px; font-size: 34px; }
  .invitation-layer-copy h2 { white-space: normal; }
  .invitation-layer-copy h2 br { display: none; }
  .invitation-layer-copy span { font-size: 13px; }
  .invitation-layer-card .invitation-form { padding: 16px; }
  .invitation-layer-close { top: 10px; right: 10px; }
  @keyframes sheet-up { from { transform: translateY(100%); } }
}

@media (max-width: 620px) {
  .daily-feature { min-height: 0; }
  .daily-carousel-track article { flex-basis: 270px; }
  .benefit-grid { grid-template-columns: 1fr; }
  .benefit-grid .benefit-card,
  .benefit-grid .benefit-card:nth-child(1),
  .benefit-grid .benefit-card:nth-child(2),
  .benefit-grid .benefit-card:nth-child(3),
  .benefit-grid .benefit-card:nth-child(4),
  .benefit-grid .benefit-card:nth-child(5),
  .benefit-grid .benefit-card:nth-child(10),
  .benefit-grid .benefit-card:nth-child(15),
  .benefit-grid .benefit-card:nth-child(22) { grid-column: auto; grid-template-rows: 180px 1fr; min-height: 0; }
  .product-chapter > header p { font-size: 27px; }
  .simultaneous-grid article,
  .simultaneous-grid article:nth-child(3),
  .simultaneous-grid article:nth-child(4) { grid-template-columns: 1fr; }
  .simultaneous-grid img { height: 260px; }
  .voices-video { grid-template-columns: 1fr; }
  .voices-video > button { min-height: 230px; }
  .event-details dl > div { grid-template-columns: 1fr; gap: 5px; }
  .quick-invitation small { font-size: 9px; }
  .quick-invitation strong { font-size: 17px; }
}

/* Review 4: clarify choices, group benefits, expand the current product inventory. */
.gift-picker article { position: relative; min-width: 0; padding: 0 0 18px; overflow: hidden; color: var(--ink); background: #fff; border-radius: 16px; text-align: left; box-shadow: 0 16px 36px rgb(8 42 48 / .18); }
.gift-picker article:nth-child(2) { transform: translateY(28px); }
.gift-picker article img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.gift-picker article strong,
.gift-picker article small { display: block; padding-inline: 14px; }
.gift-picker article strong { margin-top: 14px; font-size: 15px; line-height: 1.45; }
.gift-picker article small { margin-top: 5px; color: var(--muted); line-height: 1.4; }
.gift-picker article .gift-number { position: absolute; z-index: 2; left: 10px; top: 10px; display: grid; place-items: center; width: 42px; aspect-ratio: 1; color: #173c59; background: #f3cf7c; border-radius: 50%; font: 900 13px/1 Arial, sans-serif; box-shadow: 0 5px 15px rgb(0 0 0 / .18); }
.gift-picker > p { margin-top: 42px; }

.benefit-editorial { display: grid; gap: 22px; margin-top: 48px; }
.benefit-story { --story-accent: #315d7a; display: grid; grid-template-columns: minmax(280px, .8fr) minmax(0, 1.2fr); min-height: 380px; overflow: hidden; background: #fff; border-radius: 6px 30px 6px 30px; box-shadow: 0 18px 46px rgb(61 47 34 / .1); }
.benefit-story:nth-child(even) { grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); }
.benefit-story:nth-child(even) .benefit-story-image { order: 2; }
.benefit-story-2 { --story-accent: #c54d3f; }
.benefit-story-3 { --story-accent: #9a6e32; }
.benefit-story-4 { --story-accent: #6a5c7b; }
.benefit-story-5 { --story-accent: #536d7d; }
.benefit-story-image { position: relative; min-height: 360px; background: #e9e5dd; }
.benefit-story-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 65%, rgb(12 27 37 / .5)); }
.benefit-story-image img { width: 100%; height: 100%; object-fit: cover; }
.benefit-story-5 .benefit-story-image img { object-fit: contain; background: #fff; }
.benefit-story-image > span { position: absolute; z-index: 2; left: 18px; bottom: 16px; padding: 7px 11px; color: #fff; background: var(--story-accent); border-radius: 999px; font: 900 10px/1 Arial, sans-serif; letter-spacing: .1em; }
.benefit-story-copy { align-self: center; padding: clamp(32px, 5vw, 68px); }
.benefit-story-copy > p { margin: 0 0 10px; color: var(--story-accent); font: 900 10px/1.2 Arial, sans-serif; letter-spacing: .18em; }
.benefit-story-copy h3 { margin: 0 0 13px; color: var(--story-accent); font-family: var(--serif); font-size: clamp(28px, 3.4vw, 48px); line-height: 1.32; }
.benefit-story-copy > span { color: var(--muted); line-height: 1.8; }
.benefit-story-copy ul { display: flex; flex-wrap: wrap; gap: 9px; margin: 24px 0 0; padding: 0; list-style: none; }
.benefit-story-copy li { display: flex; align-items: center; gap: 6px; min-height: 38px; padding: 8px 12px; color: #453f39; background: color-mix(in srgb, var(--story-accent) 8%, white); border: 1px solid color-mix(in srgb, var(--story-accent) 25%, white); border-radius: 999px; font-size: 13px; font-weight: 800; }
.benefit-story-copy li svg { flex: 0 0 auto; color: var(--story-accent); }
.benefit-story-copy li b { margin-left: 2px; color: #fff; background: var(--story-accent); border-radius: 999px; padding: 3px 6px; font-size: 11px; }
.benefit-footnote { margin: 22px 0 0; color: var(--muted); font-size: 11px; text-align: right; }

.daily-date-selector { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; margin: 44px 0 18px; padding: 8px; background: #ece7dd; border-radius: 15px; }
.daily-date-selector button { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 58px; color: #173c59; background: #fff; border: 1px solid transparent; border-radius: 10px; cursor: pointer; transition: transform .2s ease, color .2s ease, background .2s ease; }
.daily-date-selector button strong { font: 800 19px/1 Georgia, serif; }
.daily-date-selector button span { font-size: 10px; font-weight: 900; }
.daily-date-selector button[aria-selected="true"] { color: #fff; background: #c64c3e; transform: translateY(-3px); box-shadow: 0 8px 18px rgb(198 76 62 / .24); }
.daily-products { margin-top: 0; }
.daily-feature { animation: feature-swap .32s ease both; }
@keyframes feature-swap { from { opacity: .2; transform: translateY(8px); } }
.daily-carousel-track button { display: grid; min-height: 160px; grid-template-columns: 44% 56%; overflow: hidden; padding: 0; color: var(--ink); background: #fff; border: 1px solid var(--line); border-radius: 10px; text-align: left; cursor: pointer; }
.daily-carousel-track button:hover { border-color: #c64c3e; }
.daily-carousel-track button > div { position: relative; padding: 20px 18px; }
.daily-carousel-track button img { width: 100%; height: 160px; object-fit: cover; }
.daily-carousel-track button b { position: absolute; right: 10px; bottom: 10px; padding: 6px 9px; color: #fff; background: #c64c3e; border-radius: 4px; font-size: 12px; }

.product-card-row { grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: start; }
.product-card { grid-column: span 4; min-width: 0; }
.product-card.featured { grid-column: span 6; }
.product-card .product-brand { display: block; margin: 0 38px 7px 0; color: var(--chapter-accent); font: 900 10px/1.2 Arial, sans-serif; letter-spacing: .14em; text-transform: uppercase; }
.product-card.featured h4 { font-size: 27px; }
.product-card.featured > img { height: 330px; }

.service-grid .repair-card { display: grid; grid-template-rows: 1fr auto; min-height: 520px; background: #173c59; }
.service-grid .repair-card > img { width: 100%; height: 100%; min-height: 285px; object-fit: cover; }
.repair-card > div { position: static; padding: 32px 36px 38px; color: #fff; background: #173c59; }
.repair-card h3 { margin: 8px 0 10px; }

.faq details::details-content { block-size: 0; opacity: 0; overflow: hidden; transition: block-size .4s cubic-bezier(.2,.8,.2,1), opacity .25s ease, content-visibility .4s; transition-behavior: allow-discrete; }
.faq details[open]::details-content { block-size: auto; opacity: 1; }
.faq details p { transform: translateY(-8px); transition: transform .35s ease; }
.faq details[open] p { transform: translateY(0); }

/* A compact vertical theme-song banner that stays clear of the conversion CTA. */
.music-player,
.music-player.raised { left: 14px; right: auto; bottom: 102px; display: grid; grid-template-columns: 1fr; width: 124px; max-width: none; overflow: visible; border-radius: 18px; }
.music-player > img { width: 124px; height: 116px; object-fit: cover; border-radius: 16px 16px 0 0; }
.music-player .music-main { display: grid; grid-template-columns: 28px 1fr; gap: 6px; width: 100%; min-height: 72px; padding: 10px 8px; text-align: left; }
.music-player .music-main small { font-size: 7px; }
.music-player .music-main strong { font-size: 11px; line-height: 1.35; }
.music-player .music-embed { position: absolute; left: calc(100% + 10px); bottom: 0; width: min(390px, calc(100vw - 170px)); height: 220px; overflow: hidden; background: #000; border-radius: 14px; box-shadow: 0 18px 48px rgb(0 0 0 / .28); }
.music-player .music-embed iframe { width: 100%; height: 100%; border: 0; }

@media (max-width: 1100px) {
  .product-card,
  .product-card.featured { grid-column: span 6; }
  .daily-carousel-track button { flex: 0 0 310px; min-height: 170px; grid-template-columns: 43% 57%; }
  .daily-carousel-track button img { height: 170px; }
}

@media (max-width: 899px) {
  .benefit-story,
  .benefit-story:nth-child(even) { grid-template-columns: 1fr; }
  .benefit-story:nth-child(even) .benefit-story-image { order: 0; }
  .benefit-story-image { min-height: 280px; }
  .benefit-story-copy { padding: 34px 28px 38px; }
  .product-card-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: visible; padding: 0; }
  .product-card,
  .product-card.featured { grid-column: auto; min-width: 0; }
  .product-card > img,
  .product-card.featured > img { height: 235px; }
  .music-player,
  .music-player.raised { left: 8px; bottom: 84px; width: 88px; }
  .music-player > img { width: 88px; height: 82px; }
  .music-player .music-main { grid-template-columns: 22px 1fr; min-height: 58px; padding: 7px 5px; }
  .music-player .music-main small { display: none; }
  .music-player .music-main strong { font-size: 9px; }
  .music-player .music-embed { left: 0; bottom: calc(100% + 8px); width: min(330px, calc(100vw - 16px)); height: 186px; }
}

@media (max-width: 620px) {
  .gift-picker article:nth-child(2) { transform: none; }
  .gift-picker > p { margin-top: 10px; }
  .daily-date-selector { grid-template-columns: repeat(6, minmax(82px, 1fr)); overflow-x: auto; padding-bottom: 12px; }
  .daily-date-selector button { min-height: 52px; }
  .daily-carousel-track button { flex-basis: 270px; }
  .product-card-row { grid-template-columns: 1fr; }
  .benefit-story-copy h3 { font-size: 29px; }
}

/* Two sale items per day, with the remaining dates moving below as one strip. */
.daily-selected { animation: feature-swap .34s ease both; }
.daily-selected-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; margin: 22px 2px 16px; }
.daily-selected-heading p { margin: 0; color: #c64c3e; font: 900 clamp(24px, 3vw, 40px)/1.2 var(--serif); }
.daily-selected-heading strong { color: #315d7a; font-size: 13px; letter-spacing: .08em; }
.daily-feature-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.daily-feature-pair .daily-feature { display: grid; grid-template-rows: 285px 1fr; min-height: 0; overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: 20px 6px 20px 6px; box-shadow: 0 18px 50px rgb(11 70 85 / .1); }
.daily-feature-pair .daily-image { min-height: 0; overflow: hidden; }
.daily-feature-pair .daily-image img { width: 100%; height: 100%; object-fit: cover; }
.daily-feature-pair .daily-copy { min-height: 315px; padding: 30px 32px 28px; }
.daily-feature-pair .daily-copy h3 { margin-bottom: 8px; font-size: clamp(27px, 2.6vw, 38px); }
.daily-feature-pair .price-row { margin-top: auto; }
.daily-carousel-window { height: 248px; margin-top: 24px; overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent); }
.daily-carousel-window::before,
.daily-carousel-window::after { display: none; }
.supporting-products.daily-carousel-track { display: flex; gap: 12px; width: max-content; grid-template-columns: none; animation: daily-slide-horizontal 36s linear infinite; }
.daily-carousel-window:hover .daily-carousel-track,
.daily-carousel-window:focus-within .daily-carousel-track { animation-play-state: paused; }
.daily-carousel-track .daily-day-card { display: grid; grid-template-columns: 86px 1fr; flex: 0 0 420px; min-height: 220px; padding: 10px; overflow: hidden; color: var(--ink); background: #fff; border: 1px solid var(--line); border-radius: 14px; text-align: left; cursor: pointer; box-shadow: 0 10px 30px rgb(37 53 60 / .08); }
.daily-carousel-track .daily-day-card:hover { border-color: #c64c3e; transform: translateY(-2px); }
.daily-day-card-date { display: grid; align-content: center; justify-items: center; margin: -10px 10px -10px -10px; color: #fff; background: #315d7a; font: 900 22px/1 Georgia, serif; }
.daily-day-card-date small { margin-top: 8px; font: 900 10px/1.2 Arial, sans-serif; }
.daily-day-thumbs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; min-width: 0; }
.daily-day-thumbs > span { display: grid; grid-template-rows: 118px auto auto; min-width: 0; }
.daily-day-thumbs img { width: 100%; height: 118px; object-fit: cover; border-radius: 8px; }
.daily-day-thumbs b { position: static; overflow: hidden; margin-top: 8px; padding: 0; color: var(--ink); background: none; font-size: 12px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.daily-day-thumbs strong { margin-top: 4px; color: #c64c3e; font: 800 16px/1 Georgia, serif; }
@keyframes daily-slide-horizontal { to { transform: translateX(-50%); } }

.bargain-section { padding-block: 108px; overflow: hidden; background: linear-gradient(155deg, #fff 0 33%, #f7f0e7 33% 100%); }
.bargain-heading { display: grid; grid-template-columns: minmax(280px, .8fr) minmax(380px, 1.2fr); column-gap: 70px; align-items: end; margin-bottom: 48px; }
.bargain-heading > p { grid-column: 1 / -1; margin: 0 0 10px; color: #c64c3e; font: 900 11px/1.2 Arial, sans-serif; letter-spacing: .2em; }
.bargain-heading h2 { margin: 0; color: #173c59; font-family: var(--serif); font-size: clamp(38px, 5vw, 68px); line-height: 1.15; }
.bargain-heading h2 em { color: #c64c3e; font-style: normal; }
.bargain-heading > span { padding-bottom: 8px; color: var(--muted); line-height: 1.9; }
.bargain-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 14px; }
.bargain-grid article { grid-column: span 3; overflow: hidden; background: #fff; border: 1px solid #e6ddd2; border-radius: 7px 22px 7px 7px; box-shadow: 0 12px 32px rgb(69 46 30 / .08); }
.bargain-grid article.featured { grid-column: span 6; display: grid; grid-template-columns: 1.1fr .9fr; }
.bargain-image { position: relative; min-height: 180px; overflow: hidden; background: #eee9e2; }
.bargain-grid article.featured .bargain-image { min-height: 290px; }
.bargain-image img { width: 100%; height: 100%; object-fit: cover; }
.bargain-image > b { position: absolute; right: 10px; bottom: 10px; display: grid; place-items: center; width: 70px; aspect-ratio: 1; color: #fff; background: #c64c3e; border: 5px solid #fff; border-radius: 50%; font: 900 21px/.9 Georgia, serif; box-shadow: 0 7px 18px rgb(0 0 0 / .18); }
.bargain-image > b small { display: block; font: 900 10px/1 Arial, sans-serif; }
.bargain-grid article > div:last-child { display: flex; flex-direction: column; padding: 20px; }
.bargain-grid article > div:last-child > span { align-self: flex-start; padding: 5px 8px; color: #fff; background: #315d7a; border-radius: 4px; font-size: 10px; font-weight: 900; }
.bargain-grid h3 { margin: 12px 0 10px; font-family: var(--serif); font-size: 21px; line-height: 1.35; }
.bargain-grid article > div:last-child > small { color: var(--muted); }
.bargain-grid article > div:last-child > strong { margin-top: auto; padding-top: 14px; color: #c64c3e; font: 800 28px/1 Georgia, serif; }
.bargain-grid article > div:last-child > strong small { margin-left: 4px; color: inherit; font: 900 9px/1 Arial, sans-serif; }

@media (max-width: 1100px) {
  .daily-feature-pair .daily-feature { grid-template-rows: 245px 1fr; }
  .daily-feature-pair .daily-copy { min-height: 300px; padding: 26px 24px; }
  .daily-carousel-track .daily-day-card { flex-basis: 390px; }
  .bargain-grid article { grid-column: span 4; }
  .bargain-grid article.featured { grid-column: span 6; }
}

@media (max-width: 899px) {
  .daily-feature-pair { grid-template-columns: 1fr 1fr; }
  .daily-feature-pair .daily-feature { grid-template-columns: 1fr; grid-template-rows: 225px 1fr; }
  .daily-feature-pair .daily-copy { min-height: 285px; }
  .bargain-heading { grid-template-columns: 1fr; row-gap: 16px; }
  .bargain-heading > p { grid-column: auto; }
  .bargain-grid article,
  .bargain-grid article.featured { grid-column: span 6; display: block; }
  .bargain-grid article.featured .bargain-image { min-height: 220px; }
}

@media (max-width: 620px) {
  .daily-selected-heading { align-items: flex-start; flex-direction: column; gap: 5px; }
  .daily-feature-pair { grid-template-columns: 1fr; }
  .daily-feature-pair .daily-feature { grid-template-rows: 245px auto; }
  .daily-feature-pair .daily-copy { min-height: 0; }
  .daily-carousel-window { height: 225px; margin-inline: -18px; }
  .daily-carousel-track .daily-day-card { flex-basis: 340px; min-height: 202px; }
  .daily-day-thumbs > span { grid-template-rows: 105px auto auto; }
  .daily-day-thumbs img { height: 105px; }
  .bargain-section { padding-block: 74px; }
  .bargain-grid article,
  .bargain-grid article.featured { grid-column: 1 / -1; display: grid; grid-template-columns: 42% 58%; }
  .bargain-image,
  .bargain-grid article.featured .bargain-image { min-height: 210px; }
}

/* Review 8: benefit headings lead each group; individual benefits stay visible as cards. */
.benefit-story,
.benefit-story:nth-child(even) {
  display: block;
  min-height: 0;
  overflow: hidden;
}
.benefit-story-head {
  display: grid;
  grid-template-columns: minmax(300px, .88fr) minmax(0, 1.12fr);
  min-height: 330px;
}
.benefit-story:nth-child(even) .benefit-story-head { grid-template-columns: minmax(0, 1.12fr) minmax(300px, .88fr); }
.benefit-story:nth-child(even) .benefit-story-image { order: 2; }
.benefit-story-image { min-height: 330px; }
.benefit-story-copy { display: grid; align-content: center; padding: clamp(34px, 5vw, 66px); }
.benefit-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
  padding: 18px;
  background: color-mix(in srgb, var(--story-accent) 8%, #f8f5ee);
  border-top: 1px solid color-mix(in srgb, var(--story-accent) 24%, white);
}
.benefit-card-grid.zero-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.benefit-card {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
  min-height: 92px;
  padding: 18px 16px;
  color: #332f2b;
  background: #fff;
  border: 1px solid color-mix(in srgb, var(--story-accent) 22%, white);
  border-radius: 6px 17px 6px 6px;
  box-shadow: 0 9px 24px rgb(43 39 35 / .08);
}
.benefit-card svg { flex: 0 0 auto; color: var(--story-accent); }
.benefit-card span { font-size: 14px; font-weight: 900; line-height: 1.45; }
.benefit-card b {
  display: grid;
  place-items: center;
  width: 48px;
  aspect-ratio: 1;
  color: #fff;
  background: var(--story-accent);
  border-radius: 50%;
  font: 900 14px/1 Arial, sans-serif;
}

.benefit-card-detail,
.benefit-mobile-gallery { display: none; }

@media (min-width: 900px) {
  .benefit-card-grid,
  .benefit-card-grid.zero-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-auto-rows: 1fr;
  }

  .benefit-card {
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-rows: auto 1fr;
    align-items: start;
    min-height: 310px;
    height: 100%;
  }

  .benefit-card-detail {
    display: block;
    grid-column: 1 / -1;
    margin: 3px 0 0;
    padding-top: 14px;
    color: #655e56;
    border-top: 1px solid color-mix(in srgb, var(--story-accent) 18%, white);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.75;
  }
}

@media (max-width: 620px) {
  html.mobile-carousel .benefit-editorial,
  html.mobile-vertical .benefit-editorial { display: none; }

  html.mobile-carousel .benefit-mobile-gallery,
  html.mobile-vertical .benefit-mobile-gallery {
    display: grid;
    gap: 14px;
    margin-top: 20px;
  }

  html.mobile-carousel .benefit-mobile-group,
  html.mobile-vertical .benefit-mobile-group { margin: 0; }

  html.mobile-carousel .benefit-mobile-group-title,
  html.mobile-vertical .benefit-mobile-group-title {
    margin: 0 0 5px;
    line-height: 0;
  }

  html.mobile-carousel .benefit-mobile-group-title img,
  html.mobile-vertical .benefit-mobile-group-title img {
    display: block;
    width: 100%;
    height: auto;
  }

  html.mobile-carousel .benefit-mobile-grid,
  html.mobile-vertical .benefit-mobile-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }

  html.mobile-carousel .benefit-mobile-card,
  html.mobile-vertical .benefit-mobile-card {
    min-width: 0;
    overflow: hidden;
    background: #fff;
  }

  html.mobile-carousel .benefit-mobile-card.is-wide,
  html.mobile-vertical .benefit-mobile-card.is-wide { grid-column: 1 / -1; }

  html.mobile-carousel .benefit-mobile-toggle,
  html.mobile-vertical .benefit-mobile-toggle {
    position: relative;
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    color: inherit;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    cursor: pointer;
  }

  html.mobile-carousel .benefit-mobile-toggle img,
  html.mobile-vertical .benefit-mobile-toggle img {
    display: block;
    width: 100%;
    height: auto;
  }

  html.mobile-carousel .benefit-number-override,
  html.mobile-vertical .benefit-number-override {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    display: grid;
    align-content: center;
    justify-items: center;
    width: 43px;
    height: 58px;
    color: #8b1420;
    background: #e3bd32;
    border-right: 2px solid #f3d969;
    border-bottom: 2px solid #f3d969;
    font-family: Arial, "Noto Sans JP", sans-serif;
    font-weight: 900;
    line-height: 1;
  }

  html.mobile-carousel .benefit-number-override small,
  html.mobile-vertical .benefit-number-override small { font-size: 9px; }

  html.mobile-carousel .benefit-number-override b,
  html.mobile-vertical .benefit-number-override b { margin-top: 3px; font-size: 16px; }

  html.mobile-carousel .benefit-mobile-detail,
  html.mobile-vertical .benefit-mobile-detail {
    padding: 16px 16px 18px;
    color: #302b27;
    background: #fffaf1;
    border: 1px solid #d7c39d;
    border-top: 0;
  }

  html.mobile-carousel .benefit-mobile-detail[hidden],
  html.mobile-vertical .benefit-mobile-detail[hidden] { display: none; }

  html.mobile-carousel .benefit-mobile-detail h3,
  html.mobile-vertical .benefit-mobile-detail h3 {
    margin: 0 0 7px;
    color: #881421;
    font-size: 16px;
    line-height: 1.45;
  }

  html.mobile-carousel .benefit-mobile-detail p,
  html.mobile-vertical .benefit-mobile-detail p {
    margin: 0;
    color: #5f564d;
    font-size: 13px;
    line-height: 1.75;
  }
}

/* Native horizontal scrolling gives touch users a real flick gesture; arrows remain for desktop. */
.daily-carousel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 30px 2px 12px;
}
.daily-carousel-heading > span { color: #315d7a; font-weight: 900; letter-spacing: .08em; }
.daily-carousel-heading > div { display: flex; gap: 8px; }
.daily-carousel-heading button {
  display: grid;
  place-items: center;
  width: 44px;
  aspect-ratio: 1;
  color: #fff;
  background: #315d7a;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 8px 20px rgb(49 93 122 / .22);
  transition: transform .2s ease, background .2s ease;
}
.daily-carousel-heading button:hover { background: #c64c3e; transform: translateY(-2px); }
.daily-carousel-window {
  height: auto;
  margin-top: 0;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  mask-image: linear-gradient(90deg, #000 0 97%, transparent);
}
.daily-carousel-window::-webkit-scrollbar { display: none; }
.supporting-products.daily-carousel-track {
  width: max-content;
  padding: 4px 26px 20px 2px;
  animation: none;
  transform: none;
}
.daily-carousel-track .daily-day-card { scroll-snap-align: start; }

.event-details-section { padding-block: 0 112px; }
.event-details-section .event-details { margin-top: 0; }

@media (max-width: 899px) {
  .benefit-story-head,
  .benefit-story:nth-child(even) .benefit-story-head { grid-template-columns: 1fr; }
  .benefit-story:nth-child(even) .benefit-story-image { order: 0; }
  .benefit-card-grid.zero-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .daily-carousel-window { margin-inline: -24px; padding-left: 24px; mask-image: linear-gradient(90deg, #000 0 95%, transparent); }
  .daily-carousel-heading > div { display: none; }
}

@media (max-width: 620px) {
  .benefit-story-head { min-height: 0; }
  .benefit-story-image { min-height: 245px; }
  .benefit-card-grid,
  .benefit-card-grid.zero-grid { grid-template-columns: 1fr 1fr; gap: 8px; padding: 10px; }
  .benefit-card { grid-template-columns: auto 1fr; min-height: 88px; padding: 13px 11px; }
  .benefit-card b { grid-column: 1 / -1; width: auto; min-height: 27px; aspect-ratio: auto; border-radius: 999px; }
  .daily-carousel-heading { margin-top: 24px; }
  .daily-carousel-window { margin-inline: -18px; padding-left: 18px; }
}

/* The JSX now follows the approved editorial sequence, so native document order
   keeps anchors and assistive-technology reading order aligned. */
main { display: block; }

/* Source flyers place promotional badges at the photograph edges.  The live LP
   supplies those prices and discounts in HTML, so product photography is framed
   more tightly to keep the duplicated flyer typography outside the card crop. */
.product-chapter-2 .product-card > img {
  transform: scale(1.3);
  transform-origin: 8% 8%;
}
.product-chapter-2 .product-card:nth-child(5) > img {
  transform-origin: 92% 92%;
}
.product-chapter-2 .product-card:nth-child(8) > img,
.product-chapter-2 .product-card:nth-child(13) > img,
.product-chapter-2 .product-card:nth-child(14) > img {
  transform: scale(1.52);
  transform-origin: 50% 4%;
}
.daily-feature-pair .daily-image img,
.daily-day-thumbs img,
.bargain-image img {
  transform: scale(1.16);
}

/* Review 10: make the 01–22 benefit sequence explicit without turning the
   editorial groups back into a monotonous wall of identical cards. */
.benefit-one-badge {
  display: inline-flex;
  width: max-content;
  margin-bottom: 18px;
  padding: 7px 12px;
  color: #173c59;
  background: #f4cd70;
  border: 1px solid rgb(23 60 89 / .22);
  border-radius: 999px;
  font: 900 12px/1 Arial, sans-serif;
  letter-spacing: .12em;
  box-shadow: 0 6px 15px rgb(23 60 89 / .11);
}
.benefit-card { padding-top: 37px; }
.benefit-card-number {
  position: absolute;
  top: 9px;
  left: 13px;
  color: var(--story-accent);
  font: 900 10px/1 Arial, sans-serif;
  letter-spacing: .1em;
}

.daily-carousel-heading > span small {
  display: inline-block;
  margin-left: 10px;
  color: #84766a;
  font-size: 10px;
  letter-spacing: .06em;
}

/* The source SPLIE flyer is split into two legible crops, while campaign
   details remain responsive HTML text beside the artwork. */
.simultaneous-grid article.splie-card {
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
  min-height: 610px;
  overflow: hidden;
  background: linear-gradient(135deg, #eef5ff 0 52%, #fff 52% 100%);
}
.simultaneous-grid article.splie-card .splie-media {
  align-self: stretch;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  gap: 8px;
  min-width: 0;
  padding: 8px;
  background: #dfeaff;
}
.simultaneous-grid article.splie-card .splie-media img {
  content: normal;
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
  object-position: center top;
  border-radius: 15px 3px 15px 3px;
}
.simultaneous-grid article.splie-card .splie-copy {
  align-self: center;
  padding: clamp(34px, 5vw, 70px);
}
.splie-copy > p { color: #1649b5; }
.simultaneous-grid .splie-copy h3 {
  color: #16355a;
  font-size: clamp(31px, 3.2vw, 48px);
  line-height: 1.3;
}
.simultaneous-grid .splie-copy > span {
  display: block;
  max-width: 37em;
  color: #4d5d70;
  font-size: 15px;
}
.splie-copy ul {
  display: grid;
  gap: 10px;
  margin: 25px 0 19px;
  padding: 0;
  list-style: none;
}
.splie-copy li {
  position: relative;
  padding-left: 24px;
  color: #24374d;
  font-weight: 800;
  line-height: 1.55;
}
.splie-copy li::before {
  content: "";
  position: absolute;
  top: .5em;
  left: 0;
  width: 10px;
  height: 10px;
  background: #f15a70;
  border-radius: 50%;
  box-shadow: 5px 5px 0 #ffd76b;
}
.splie-copy li strong { color: #e23c56; font-size: 1.15em; }
.simultaneous-grid .splie-copy > small {
  display: block;
  color: #786f66;
  font-size: 10px;
  line-height: 1.6;
}
.splie-copy > a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 24px;
  padding: 12px 17px;
  color: #fff;
  background: #1649b5;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 9px 22px rgb(22 73 181 / .2);
}

/* Illustrated avatars sit outside the speech panels so the words clearly
   read as visitor comments instead of three generic content cards. */
.voice-cards { gap: 24px; margin-top: 56px; }
.voice-cards article {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  align-items: start;
  min-height: 0;
  padding: 0;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
}
.voice-cards article:nth-child(2) { transform: translateY(18px); }
.voice-cards article > img {
  z-index: 2;
  width: 112px;
  height: 112px;
  margin-top: 31px;
  object-fit: cover;
  background: #f8e2c6;
  border: 5px solid #fff;
  border-radius: 50%;
  box-shadow: 0 9px 24px rgb(43 39 35 / .18);
}
.voice-bubble {
  position: relative;
  min-height: 250px;
  margin-left: -8px;
  padding: 29px 24px 30px 32px;
  background: #fff;
  border: 2px solid #e7c766;
  border-radius: 7px 28px 28px 28px;
  box-shadow: 10px 11px 0 #f6d665;
}
.voice-bubble::before {
  content: "";
  position: absolute;
  top: 49px;
  left: -18px;
  width: 29px;
  height: 29px;
  background: #fff;
  border-bottom: 2px solid #e7c766;
  transform: rotate(45deg);
}
.voice-cards article:nth-child(2) .voice-bubble {
  border-color: #70bcb4;
  box-shadow: 10px 11px 0 #8bd4cc;
}
.voice-cards article:nth-child(2) .voice-bubble::before { border-color: #70bcb4; }
.voice-cards article:nth-child(3) .voice-bubble {
  border-color: #e18a70;
  box-shadow: 10px 11px 0 #f0a28c;
}
.voice-cards article:nth-child(3) .voice-bubble::before { border-color: #e18a70; }
.voice-bubble > span {
  position: relative;
  z-index: 1;
  display: inline-block;
  padding: 6px 10px;
  color: #fff;
  background: #c64c3e;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 900;
}
.voice-cards .voice-bubble h3 { position: relative; z-index: 1; margin: 20px 0 12px; font-size: 21px; }
.voice-cards .voice-bubble p { position: relative; z-index: 1; font-size: 13px; line-height: 1.8; }
.voice-note { margin: 42px 0 0; color: #81776f; font-size: 10px; text-align: center; }

@media (max-width: 899px) {
  .simultaneous-grid article.splie-card { grid-template-columns: 1fr; }
  .simultaneous-grid article.splie-card .splie-media { min-height: 520px; }
  .simultaneous-grid article.splie-card .splie-copy { padding: 42px 34px 48px; }
  .voice-cards article:nth-child(2) { transform: none; }
}

@media (max-width: 620px) {
  .benefit-card { padding: 34px 11px 13px; }
  .daily-carousel-heading > span small { display: block; margin: 5px 0 0; }
  .simultaneous-grid article.splie-card .splie-media { grid-template-columns: 1fr 1fr; min-height: 400px; padding: 5px; }
  .simultaneous-grid article.splie-card .splie-copy { padding: 32px 22px 38px; }
  .voice-cards { gap: 30px; }
  .voice-cards article { grid-template-columns: 82px minmax(0, 1fr); }
  .voice-cards article > img { width: 90px; height: 90px; margin-top: 26px; }
  .voice-bubble { min-height: 0; padding: 25px 18px 25px 27px; }
  .voice-bubble::before { top: 38px; left: -15px; width: 23px; height: 23px; }
  .voice-cards .voice-bubble h3 { font-size: 18px; }
}

/* Review 16: separate photography, brand identity, price and discount into
   distinct layers so flyer typography never collides with responsive copy. */
.product-card { position: relative; }
.product-media {
  position: relative;
  height: 272px;
  overflow: hidden;
  background: #f3f0ea;
}
.product-card.featured .product-media { height: 272px; }
.product-media > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: none !important;
}
.product-card-body { padding: 21px 22px 24px; }
.product-brand-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 39px;
  margin-bottom: 10px;
}
.product-brand-row > span {
  flex: 0 0 auto;
  color: rgb(49 93 122 / .24);
  font: 800 24px/1 "Zen Kaku Gothic New", Arial, sans-serif;
  font-variant-numeric: tabular-nums;
}
.product-brand-logo {
  display: block;
  width: auto;
  max-width: 158px;
  height: 34px;
  object-fit: contain;
  object-position: left center;
}
.product-card .product-brand {
  margin: 0;
  color: var(--chapter-accent);
  font: 900 11px/1.25 "Zen Kaku Gothic New", Arial, sans-serif;
  letter-spacing: .1em;
}
.product-card h4,
.product-card.featured h4 {
  margin: 0 0 8px;
  font-size: clamp(20px, 2vw, 25px);
}
.product-card p { min-height: 3.4em; margin-bottom: 16px; }
.product-price-row { display: flex; align-items: end; justify-content: space-between; gap: 10px; }
.product-card .product-price-row > strong:not(.special-price),
.bargain-grid article > div:last-child > strong,
.price-row strong,
.supporting-products strong,
.daily-day-thumbs strong {
  font-family: "Zen Kaku Gothic New", "Noto Sans JP", Arial, sans-serif;
  font-variant-numeric: tabular-nums;
  font-weight: 900;
  letter-spacing: -.045em;
}
.product-card .product-price-row > b { margin: 0 0 4px; }

.discount-emblem {
  position: absolute;
  z-index: 3;
  right: 11px;
  bottom: 11px;
  display: grid;
  place-content: center;
  width: 88px;
  aspect-ratio: 1;
  padding-top: 3px;
  color: #d91f25;
  background: url("../images/sale-emblem.png") center / contain no-repeat;
  text-align: center;
  filter: drop-shadow(0 7px 9px rgb(108 30 16 / .2));
  transform: rotate(4deg);
}
.discount-emblem strong {
  display: block;
  font: 950 29px/.82 "Zen Kaku Gothic New", Arial, sans-serif;
  letter-spacing: -.08em;
}
.discount-emblem strong small { font: 900 13px/1 Arial, sans-serif; }
.discount-emblem > b { display: block; margin-top: 3px; font: 950 15px/.9 Arial, sans-serif; }
.product-media .discount-emblem { width: 94px; }

/* The bargain gallery keeps every one of the ten current items, but uses clean
   product photography and live, reflowable copy. */
.bargain-image { height: 224px; min-height: 224px; padding: 12px; background: #f8f4ee; }
.bargain-grid article.featured .bargain-image { height: 292px; min-height: 292px; }
.bargain-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: none !important;
}
.bargain-grid article > div:last-child { min-height: 292px; padding: 20px 20px 22px; }
.bargain-grid article > div:last-child > p {
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.7;
}
.bargain-grid article > div:last-child > small { display: block; margin-top: 5px; line-height: 1.45; }
.bargain-grid article > div:last-child > strong { font-size: 30px; }
.bargain-image > b { display: none; }

/* Desktop SPLIE artwork is purpose-built as a wide image.  Mobile keeps the
   two original readable panels. */
.simultaneous-grid article.splie-card { min-height: 560px; }
.simultaneous-grid article.splie-card .splie-media {
  display: block;
  padding: 0;
  background: #e7f0ff;
}
.splie-media picture { display: block; width: 100%; height: 100%; }
.simultaneous-grid article.splie-card .splie-media picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 58% center;
  border-radius: 0;
}
.splie-member-mobile { display: none; }

/* All three service cards now share one image band and one text scale. */
.service-grid > article,
.service-grid .repair-card {
  display: grid;
  grid-template-rows: 230px 1fr;
  min-height: 520px;
  color: var(--ink);
  background: #fff;
}
.service-grid > article > img,
.service-grid .repair-card > img {
  width: 100%;
  height: 230px;
  min-height: 230px;
  object-fit: cover;
}
.service-grid > article > div,
.repair-card > div {
  position: static;
  padding: 28px;
  color: var(--ink);
  background: #fff;
}
.service-grid h3,
.service-grid .repair-card h3 { margin: 16px 0 12px; font-size: 27px; line-height: 1.45; }
.repair-card svg { color: var(--turquoise); }
.repair-card p { color: var(--turquoise); }
.repair-card span { color: var(--muted); }

/* Square floating player: thumbnail on top, title/action below. */
.music-player,
.music-player.raised {
  width: 158px;
  height: 158px;
  grid-template-rows: 96px 62px;
  overflow: visible;
  border-radius: 18px;
}
.music-player > img {
  width: 158px;
  height: 96px;
  object-fit: cover;
  object-position: center 38%;
  border-radius: 16px 16px 0 0;
}
.music-player .music-main {
  grid-template-columns: 27px 1fr;
  min-height: 62px;
  height: 62px;
  padding: 8px 9px;
  border-radius: 0 0 16px 16px;
}
.music-player .music-main small { font-size: 6px; letter-spacing: .04em; }
.music-player .music-main strong { font-size: 10px; line-height: 1.3; }

@media (max-width: 1100px) {
  .product-media,
  .product-card.featured .product-media { height: 248px; }
  .bargain-grid article > div:last-child { min-height: 278px; }
}

@media (max-width: 899px) {
  .product-media,
  .product-card.featured .product-media { height: 230px; }
  .simultaneous-grid article.splie-card .splie-media {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 6px;
    min-height: 510px;
    padding: 6px;
  }
  .splie-media picture { height: 100%; }
  .simultaneous-grid article.splie-card .splie-media picture img,
  .simultaneous-grid article.splie-card .splie-media > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    border-radius: 14px 3px 14px 3px;
  }
  .splie-member-mobile { display: block; }
  .music-player,
  .music-player.raised {
    width: 108px;
    height: 108px;
    grid-template-rows: 66px 42px;
  }
  .music-player > img { width: 108px; height: 66px; }
  .music-player .music-main { grid-template-columns: 19px 1fr; height: 42px; min-height: 42px; padding: 5px 6px; }
  .music-player .music-main strong { font-size: 8px; }
  .music-player .music-main svg { width: 17px; height: 17px; }
  .bargain-grid article > div:last-child { min-height: 275px; }
}

@media (max-width: 620px) {
  .product-media,
  .product-card.featured .product-media { height: 245px; }
  .product-brand-logo { max-width: 148px; height: 32px; }
  .product-card p { min-height: 0; }
  .product-media .discount-emblem { width: 82px; }
  .bargain-image,
  .bargain-grid article.featured .bargain-image { height: 210px; min-height: 210px; }
  .bargain-grid article > div:last-child { min-height: 210px; }
  .bargain-grid article > div:last-child > p { font-size: 11px; line-height: 1.55; }
  .bargain-grid article > div:last-child > strong { font-size: 27px; }
  .discount-emblem { right: 7px; bottom: 7px; width: 72px; }
  .discount-emblem strong { font-size: 24px; }
  .simultaneous-grid article.splie-card .splie-media { min-height: 390px; }
  .service-grid > article,
  .service-grid .repair-card { grid-template-rows: 220px auto; min-height: 0; }
  .service-grid > article > img,
  .service-grid .repair-card > img { height: 220px; min-height: 220px; }
}

/* Review 18: premium sale graphics, equal bargain cards, stronger benefit
   typography, and explicit invitation/music confirmation states. */
.sale-seal {
  position: relative;
  display: block;
  width: 180px;
  aspect-ratio: 1;
  color: #fffaf0;
  background: url("../images/daily-sale-burst.png") center / contain no-repeat;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  transform: none;
}
.sale-seal > span,
.sale-seal > strong,
.sale-seal > b { position: absolute; margin: 0; font-family: "Zen Kaku Gothic New", "Noto Sans JP", Arial, sans-serif; }
.sale-seal > span { top: 22%; left: 50%; font-size: 14px; font-weight: 900; letter-spacing: .14em; transform: translateX(-50%); }
.sale-seal > strong { top: 37%; left: 50%; display: flex; align-items: flex-end; font-size: 68px; line-height: .75; letter-spacing: -.08em; transform: translateX(-50%); }
.sale-seal > strong small { margin: 0 0 2px 3px; font-size: 20px; line-height: 1; }
.sale-seal > b { right: 0; bottom: 20%; left: 0; color: #fffaf0; font-size: 20px; line-height: 1; letter-spacing: .18em; text-align: center; }

.discount-emblem {
  top: -1px;
  right: -1px;
  bottom: auto;
  display: block;
  width: 116px;
  padding: 0;
  color: #fffaf0;
  background-image: url("../images/sale-corner-premium.png");
  filter: drop-shadow(-5px 7px 10px rgb(95 22 20 / .2));
  transform: none;
}
.discount-emblem strong { position: absolute; top: 18px; right: 10px; font-size: 29px; line-height: .82; letter-spacing: -.06em; }
.discount-emblem strong small { margin-left: 1px; color: inherit; font-size: 12px; }
.discount-emblem > b { position: absolute; top: 50px; right: 13px; margin: 0; color: inherit; font-size: 14px; letter-spacing: .08em; }

.bargain-grid { align-items: stretch; }
.bargain-grid article {
  grid-column: span 3;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 224px 1fr;
  height: 550px;
}
.bargain-grid article.featured { grid-column: span 3; display: grid; grid-template-columns: 1fr; }
.bargain-grid article.featured .bargain-image,
.bargain-image { height: 224px; min-height: 224px; }
.bargain-grid article > div:last-child { min-height: 0; height: 100%; }

.benefit-card {
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: 1fr;
  gap: 12px;
  min-height: 126px;
  padding: 45px 20px 20px;
  overflow: hidden;
}
.benefit-card span {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  font-size: clamp(18px, 1.45vw, 22px);
  font-weight: 900;
  line-height: 1.35;
  letter-spacing: -.035em;
}
.benefit-card svg {
  position: absolute;
  right: 15px;
  bottom: 14px;
  width: 33px;
  height: 33px;
  opacity: .26;
}
.benefit-card b {
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  width: 54px;
  font-size: 16px;
}
.benefit-card:has(b) svg { right: 78px; }

.music-player,
.music-player.raised {
  width: 200px;
  height: 200px;
  grid-template-rows: 116px 84px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(18px) scale(.96);
  transition: opacity .28s ease, transform .28s ease, visibility 0s linear .28s;
}
.music-player.is-available {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0) scale(1);
  transition-delay: 0s;
}
.music-player.open,
.music-player.open.raised {
  width: min(360px, calc(100vw - 36px));
  height: 261px;
  display: grid;
  grid-template-rows: 36px 225px;
  overflow: hidden;
  background: #111;
  border-radius: 18px;
}
.music-player.open .music-embed {
  position: static;
  grid-row: 2;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: inherit;
  box-shadow: none;
}
.music-player.open .music-embed iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  pointer-events: auto;
}
.music-stop {
  position: static;
  grid-row: 1;
  justify-self: end;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  padding: 6px 13px;
  color: #fff;
  background: rgb(10 45 42 / .9);
  border: 0;
  border-radius: 0;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
  backdrop-filter: blur(6px);
}
.music-thumbnail {
  position: relative;
  width: 200px;
  height: 116px;
  overflow: hidden;
  border-radius: 16px 16px 0 0;
}
.music-thumbnail img { width: 100%; height: 100%; object-fit: cover; object-position: center 38%; }
.music-thumbnail > span {
  position: absolute;
  right: 9px;
  bottom: 8px;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 5px 8px;
  color: #fff;
  background: rgb(15 63 58 / .9);
  border-radius: 999px;
  font: 900 10px/1 Arial, sans-serif;
  letter-spacing: .08em;
}
.music-player .music-main { min-height: 84px; height: 84px; padding: 10px 12px; }
.music-player .music-main small { color: #a8e8df; font-size: 8px; line-height: 1.35; }
.music-player .music-main strong { margin-top: 4px; font-size: 13px; line-height: 1.3; }

.delivery-layer,
.music-consent-layer {
  position: fixed;
  z-index: 90;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgb(18 34 43 / .72);
  backdrop-filter: blur(8px);
  animation: layer-in .24s ease both;
}
.delivery-card,
.music-consent-card {
  width: min(520px, 100%);
  padding: clamp(34px, 6vw, 58px);
  color: #27231f;
  background: #fffaf1;
  border: 1px solid #ead7b5;
  border-radius: 28px 8px 28px 8px;
  box-shadow: 0 30px 90px rgb(0 0 0 / .3);
  text-align: center;
}
.delivery-check {
  display: grid;
  place-items: center;
  width: 72px;
  margin: 0 auto 18px;
  aspect-ratio: 1;
  color: #fff;
  background: #17877f;
  border-radius: 50%;
}
.delivery-card > p,
.music-consent-card > p { margin: 0 0 10px; color: #c8493f; font: 900 11px/1.2 Arial, sans-serif; letter-spacing: .18em; }
.delivery-card h2,
.music-consent-card h2 { margin: 0 0 15px; color: #173c59; font-family: var(--serif); font-size: clamp(30px, 5vw, 44px); line-height: 1.38; letter-spacing: -.04em; }
.music-consent-card h2 { font-size: clamp(30px, 4vw, 38px); }
.delivery-card > span:not(.delivery-check),
.music-consent-card > span { display: block; color: var(--muted); line-height: 1.8; }
.delivery-card > button,
.music-consent-card > div button:first-child {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 54px;
  margin-top: 26px;
  padding: 12px 24px;
  color: #fff;
  background: #c8493f;
  border: 0;
  border-radius: 999px;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 10px 24px rgb(200 73 63 / .25);
}
.music-consent-card > svg { margin-bottom: 14px; color: #17877f; }
.music-consent-card > div { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 26px; }
.music-consent-card > div button:first-child { margin-top: 0; background: #17877f; box-shadow: 0 10px 24px rgb(23 135 127 / .25); }
.music-consent-card > div button:last-child { padding: 12px 16px; color: #655e56; background: transparent; border: 0; text-decoration: underline; cursor: pointer; }

@media (max-width: 1100px) {
  .bargain-grid article,
  .bargain-grid article.featured { grid-column: span 4; height: 530px; }
}

@media (max-width: 899px) {
  .sale-seal { width: 164px; }
  .sale-seal > strong { font-size: 54px; }
  .bargain-grid article,
  .bargain-grid article.featured { grid-column: span 6; grid-template-columns: 1fr; grid-template-rows: 220px 1fr; height: 505px; }
  .bargain-image,
  .bargain-grid article.featured .bargain-image { height: 220px; min-height: 220px; }
  .benefit-card { min-height: 116px; }
  .music-player,
  .music-player.raised { width: 132px; height: 132px; grid-template-rows: 76px 56px; }
  .music-thumbnail { width: 132px; height: 76px; }
  .music-thumbnail > span { right: 5px; bottom: 5px; padding: 4px 6px; font-size: 8px; }
  .music-thumbnail > span svg { width: 14px; height: 14px; }
  .music-player .music-main { min-height: 56px; height: 56px; padding: 6px 7px; }
  .music-player .music-main small { display: none; }
  .music-player .music-main strong { margin: 0; font-size: 10px; }
}

@media (max-width: 620px) {
  .sale-seal { width: 146px; }
  .sale-seal > span { top: 26%; font-size: 10px; }
  .sale-seal > strong { top: 38%; font-size: 46px; }
  .sale-seal > strong small { font-size: 14px; }
  .sale-seal > b { font-size: 14px; }
  .bargain-grid article,
  .bargain-grid article.featured {
    grid-column: 1 / -1;
    grid-template-columns: 42% 58%;
    grid-template-rows: 1fr;
    height: 318px;
  }
  .bargain-image,
  .bargain-grid article.featured .bargain-image { height: 100%; min-height: 0; }
  .benefit-card { min-height: 108px; padding: 39px 13px 14px; }
  .benefit-card span { font-size: 16px; line-height: 1.35; }
  .benefit-card b { width: 46px; font-size: 14px; }
  .benefit-card svg { right: 10px; bottom: 10px; width: 27px; height: 27px; }
  .benefit-card:has(b) svg { right: 64px; }
  .discount-emblem { top: -1px; right: -1px; bottom: auto; width: 88px; }
  .discount-emblem strong { top: 13px; right: 8px; font-size: 22px; }
  .discount-emblem strong small { font-size: 9px; }
  .discount-emblem > b { top: 38px; right: 10px; font-size: 11px; }
  .music-consent-card > div { display: grid; gap: 8px; }
  .music-consent-card > div button:last-child { justify-self: center; }
  .music-player.open,
  .music-player.open.raised {
    left: 8px;
    bottom: 84px;
    width: min(280px, calc(100vw - 16px));
    height: 236px;
    grid-template-rows: 36px 200px;
  }
}

/* Review 23: each remaining daily deal is its own compact landscape card. */
.daily-selected-heading { justify-content: flex-start; }
.daily-carousel-track .daily-product-card {
  display: grid;
  grid-template-columns: 56% 44%;
  flex: 0 0 310px;
  width: 310px;
  min-height: 150px;
  height: 150px;
  padding: 0;
  overflow: hidden;
  color: var(--ink);
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px 18px 8px 8px;
  text-align: left;
  cursor: pointer;
  scroll-snap-align: start;
  box-shadow: 0 10px 28px rgb(37 53 60 / .08);
  transition: border-color .2s ease, transform .2s ease;
}
.daily-carousel-track .daily-product-card:hover {
  border-color: #c64c3e;
  transform: translateY(-2px);
}
.daily-product-card-media {
  display: block;
  width: 100%;
  height: 150px;
  overflow: hidden;
  background: #f4f1eb;
}
.daily-carousel-track .daily-product-card .daily-product-card-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: none;
}
.daily-product-card-copy {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 15px 14px 13px;
}
.daily-product-card-copy > small {
  color: #315d7a;
  font: 800 11px/1.2 Arial, sans-serif;
}
.daily-product-card-copy > small b {
  position: static;
  margin-right: 4px;
  padding: 0;
  color: #c64c3e;
  background: transparent;
  font: 900 16px/1 Georgia, serif;
}
.daily-product-card-copy > strong {
  display: block;
  overflow: hidden;
  margin-top: 13px;
  color: var(--ink);
  font-family: var(--serif);
  font-size: 15px;
  line-height: 1.35;
}
.daily-product-card-copy > em {
  margin-top: auto;
  color: #c64c3e;
  font: 800 22px/1 Georgia, serif;
  font-style: normal;
  white-space: nowrap;
}
.daily-product-card-copy > em small { margin-left: 3px; font: 900 8px/1 Arial, sans-serif; }

/* The YouTube iframe stays mounted while paused so playback can resume. */
.music-player:not(.open) .music-embed { display: none; }

/* Access maps belong to their respective venue cards. */
.venue-cards article { display: flex; flex-direction: column; }
.venue-cards article > div { flex: 1 1 auto; }
.venue-cards article > img { height: 240px; }
.venue-photo-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  height: 240px;
  margin: 0;
  overflow: hidden;
  background: #dfd4c5;
}
.venue-photo-pair img { width: 100%; height: 100%; object-fit: cover; }
.venue-photo-pair img:first-child { object-position: center 46%; }
.venue-photo-pair img:last-child { object-position: center 48%; }
.venue-card-map {
  position: relative;
  height: 310px;
  margin: 0 24px;
  overflow: hidden;
  background: #f6f3ed;
  border: 1px solid #e7ddd0;
  border-radius: 14px;
}
.venue-card-map img { width: 100%; height: 100%; object-fit: contain; object-position: center; }
.venue-card-map figcaption {
  position: absolute;
  left: 10px;
  bottom: 10px;
  padding: 7px 10px;
  color: #fff;
  background: rgb(23 60 89 / .9);
  border-radius: 6px;
  font-size: 11px;
  font-weight: 900;
}
.venue-cards a.venue-map-link { margin: 18px 24px 26px; border-radius: 8px; text-decoration: none; }

/* Long-page utility: appears once the hero has left the viewport. */
.back-to-top {
  position: fixed;
  z-index: 44;
  right: 20px;
  bottom: 104px;
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  padding: 0;
  color: #fff;
  background: #394247;
  border: 1px solid rgb(255 255 255 / .35);
  border-radius: 50%;
  box-shadow: 0 10px 28px rgb(22 33 37 / .24);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(12px);
  transition: opacity .25s ease, transform .25s ease, visibility 0s linear .25s, background-color .2s ease;
  cursor: pointer;
}
.back-to-top:hover { background: #1e5d62; }
.back-to-top.visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  transition-delay: 0s;
}
.back-to-top:focus-visible { outline: 3px solid #f3cf7c; outline-offset: 3px; }

@media (max-width: 620px) {
  .daily-carousel-track .daily-product-card {
    flex-basis: 286px;
    width: 286px;
    height: 140px;
    min-height: 140px;
    grid-template-columns: 54% 46%;
  }
  .daily-product-card-media { height: 140px; }
  .daily-product-card-copy { padding: 13px 11px 11px; }
  .daily-product-card-copy > strong { margin-top: 10px; font-size: 14px; }
  .daily-product-card-copy > em { font-size: 20px; }
  .venue-card-map { height: 260px; margin-inline: 14px; }
  .venue-cards a.venue-map-link { margin-inline: 14px; }
  .venue-photo-pair { height: 220px; }
  .back-to-top { right: 12px; bottom: 84px; width: 46px; height: 46px; }
}

/* Review 25: smaller paused banner and a policy-compliant compact YouTube player. */
.music-player:not(.open),
.music-player:not(.open).raised {
  width: 152px;
  height: 152px;
  grid-template-rows: 88px 64px;
}
.music-player:not(.open) .music-thumbnail { width: 152px; height: 88px; }
.music-player:not(.open) .music-main { min-height: 64px; height: 64px; padding: 7px 8px; }
.music-player:not(.open) .music-main small { font-size: 6px; }
.music-player:not(.open) .music-main strong { font-size: 10px; }
.music-controls {
  position: relative;
  z-index: 10;
  grid-row: 1;
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  width: 100%;
  min-width: 0;
  background: #153e3b;
  pointer-events: auto;
}
.music-controls button {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 36px;
  padding: 5px 10px;
  color: #fff;
  background: transparent;
  border: 0;
  border-radius: 0;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
  cursor: pointer;
}
.music-controls button:hover { background: rgb(255 255 255 / .1); }
@media (max-width: 620px) {
  .music-player:not(.open),
  .music-player:not(.open).raised { width: 96px; height: 96px; grid-template-rows: 56px 40px; }
  .music-player:not(.open) .music-thumbnail { width: 96px; height: 56px; }
  .music-player:not(.open) .music-thumbnail > span { right: 4px; bottom: 4px; padding: 3px 5px; font-size: 7px; }
  .music-player:not(.open) .music-main { grid-template-columns: 17px 1fr; min-height: 40px; height: 40px; padding: 4px 5px; }
  .music-player:not(.open) .music-main small { display: none; }
  .music-player:not(.open) .music-main strong { margin: 0; font-size: 8px; }
  .music-player:not(.open) .music-main svg { width: 15px; height: 15px; }
}

/* Keep the visible YouTube player at its native 16:9 ratio to avoid letterboxing. */
.music-player.open,
.music-player.open.raised {
  height: auto;
  grid-template-rows: 36px auto;
}
.music-player.open .music-embed {
  height: auto;
  aspect-ratio: 16 / 9;
}
.music-controls { justify-content: flex-start; }
.music-player.open.minimized,
.music-player.open.minimized.raised {
  width: 200px;
  height: 236px;
  grid-template-rows: 36px 200px;
}
.music-player.open.minimized .music-embed { height: 200px; aspect-ratio: auto; }
.music-player.open.minimized .music-controls button { padding-inline: 7px; font-size: 10px; }

@media (max-width: 620px) {
  .music-player.open,
  .music-player.open.raised { width: min(356px, calc(100vw - 16px)); height: auto; grid-template-rows: 36px auto; }
  .music-player.open.minimized,
  .music-player.open.minimized.raised { width: 200px; height: 236px; grid-template-rows: 36px 200px; }
}

/* Review 27: show the complete daily-deal product and keep long names readable. */
.daily-feature-pair .daily-image {
  display: grid;
  place-items: center;
  padding: 10px;
  background: #f4f1eb;
}
.daily-feature-pair .daily-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  transform: none;
}
.daily-feature-pair .daily-copy h3 {
  font-size: clamp(23px, 2vw, 30px);
  line-height: 1.32;
  text-wrap: balance;
  word-break: keep-all;
}

@media (max-width: 620px) {
  .daily-feature-pair .daily-copy h3 { font-size: 25px; }
}

/* Review 28: the paused theme-song prompt is a low, landscape banner. */
.music-player:not(.open),
.music-player:not(.open).raised {
  width: 210px;
  height: 100px;
  grid-template-columns: 92px 118px;
  grid-template-rows: 100px;
  border-radius: 16px;
}
.music-player:not(.open) .music-thumbnail {
  grid-column: 1;
  grid-row: 1;
  width: 92px;
  height: 100px;
  border-radius: 15px 0 0 15px;
}
.music-player:not(.open) .music-main {
  grid-column: 2;
  grid-row: 1;
  grid-template-columns: 20px 1fr;
  width: 118px;
  min-height: 100px;
  height: 100px;
  padding: 8px 9px;
  border-radius: 0 15px 15px 0;
}
.music-player:not(.open) .music-main small { display: none; }
.music-player:not(.open) .music-main > span { min-width: 0; }
.music-player:not(.open) .music-main strong { display: block; max-width: 100%; margin: 0; font-size: 10px; line-height: 1.45; white-space: normal; overflow-wrap: anywhere; }
.music-player:not(.open) .music-main svg { width: 18px; height: 18px; }

@media (max-width: 620px) {
  .music-player:not(.open),
  .music-player:not(.open).raised {
    width: 180px;
    height: 78px;
    grid-template-columns: 72px 108px;
    grid-template-rows: 78px;
  }
  .music-player:not(.open) .music-thumbnail { width: 72px; height: 78px; border-radius: 13px 0 0 13px; }
  .music-player:not(.open) .music-main { width: 108px; min-height: 78px; height: 78px; padding: 6px 8px; border-radius: 0 13px 13px 0; }
  .music-player:not(.open) .music-main strong { font-size: 9px; }
}

/* Review 29: the paused player is one fixed-ratio image so responsive scaling
   cannot move the photo, copy, or circular play symbol independently. */
.music-player:not(.open),
.music-player:not(.open).raised {
  display: block;
  width: 210px;
  height: auto;
  aspect-ratio: 2.1 / 1;
  background: transparent;
  border: 0;
  border-radius: 16px;
}
.music-player:not(.open) .music-main-banner {
  display: block;
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  border-radius: inherit;
}
.music-player:not(.open) .music-main-banner img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
@media (max-width: 620px) {
  .music-player:not(.open),
  .music-player:not(.open).raised {
    width: 180px;
    height: auto;
    aspect-ratio: 2.1 / 1;
  }
}

/* Review 30: use the complete 5:3 daily-special exports in both placements. */
.daily-feature-pair .daily-feature {
  grid-template-rows: auto 1fr;
}
.daily-feature-pair .daily-image {
  aspect-ratio: 5 / 3;
  padding: 6px;
}
.daily-carousel-track .daily-product-card {
  grid-template-columns: 65% 35%;
  flex-basis: 390px;
  width: 390px;
  min-height: 160px;
  height: 160px;
}
.daily-product-card-media {
  height: 160px;
}
.daily-carousel-track .daily-product-card .daily-product-card-media img {
  object-fit: contain;
}
.daily-product-card-copy {
  padding: 14px 12px 12px;
}
.daily-product-card-copy > strong {
  margin-top: 10px;
  font-size: 14px;
}
.daily-product-card-copy > em {
  font-size: 20px;
}

@media (max-width: 620px) {
  .daily-carousel-track .daily-product-card {
    grid-template-columns: 64% 36%;
    flex-basis: 320px;
    width: 320px;
    min-height: 132px;
    height: 132px;
  }
  .daily-product-card-media { height: 132px; }
  .daily-product-card-copy { padding: 11px 9px 9px; }
  .daily-product-card-copy > small b { font-size: 14px; }
  .daily-product-card-copy > strong { margin-top: 8px; font-size: 13px; }
  .daily-product-card-copy > em { font-size: 17px; }
}




/* Traditional HTML/PHP build helpers */
.static-hidden { display: none !important; }
.static-music-icon { display: grid; place-items: center; width: 54px; height: 54px; margin: 0 auto 10px; color: #fff; background: #1f6650; border-radius: 50%; font: 700 30px/1 Arial, sans-serif; }
[hidden] { display: none !important; }

/* 2026-09-10: Kanetaya-inspired editorial sequence */
.scale-showcase {
  position: relative;
  min-height: clamp(520px, 52vw, 690px);
  margin-block: 72px 108px;
  padding: 0;
  overflow: hidden;
  border-radius: 28px 7px 28px 7px;
  background: #e8e1d6;
  box-shadow: 0 24px 70px rgb(50 42 33 / .16);
  scroll-margin-top: 100px;
}
.scale-showcase-media { position: absolute; inset: 0; }
.scale-showcase-media img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.scale-showcase-copy {
  position: absolute;
  left: clamp(24px, 4vw, 58px);
  bottom: clamp(24px, 4vw, 58px);
  width: min(540px, calc(100% - 48px));
  padding: clamp(26px, 3.4vw, 48px);
  background: rgb(255 253 247 / .95);
  border-left: 7px solid #c94b3d;
  box-shadow: 0 18px 45px rgb(35 28 22 / .22);
}
.scale-showcase-copy > p,
.advisory-feature-copy > p,
.lineup-carpet-promo p { margin: 0 0 12px; color: #b74c3f; font: 900 11px/1.3 Arial, sans-serif; letter-spacing: .16em; }
.scale-showcase-copy h1 { margin: 0; font-family: var(--serif); font-size: clamp(34px, 4vw, 58px); line-height: 1.28; letter-spacing: -.04em; }
.scale-showcase-copy h1 em { color: #c84436; font-style: normal; }
.scale-showcase-copy > span { display: block; max-width: 46em; margin-top: 18px; color: var(--muted); font-size: 15px; line-height: 1.9; }
.scale-showcase-facts { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 18px; margin: 22px 0 17px; }
.scale-showcase-facts strong { color: #173c59; font-family: var(--serif); font-size: clamp(42px, 5vw, 72px); line-height: 1; }
.scale-showcase-facts strong small { font-size: .38em; }
.scale-showcase-facts b { padding: 7px 12px; color: #173c59; background: #f1cc71; font-size: 13px; }

.advisory-feature {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(340px, .82fr);
  margin-block: 0 110px;
  padding: 0;
  overflow: hidden;
  border-radius: 28px 7px 28px 7px;
  background: #173c59;
  box-shadow: 0 22px 58px rgb(50 42 33 / .15);
  scroll-margin-top: 100px;
}
.advisory-feature-media { min-height: 520px; }
.advisory-feature-media img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.advisory-feature-copy { align-self: center; padding: clamp(36px, 5vw, 72px); color: #fff; }
.advisory-feature-copy > p { color: #f1cc71; }
.advisory-feature-copy h2 { margin: 0; font-family: var(--serif); font-size: clamp(38px, 4vw, 58px); line-height: 1.3; letter-spacing: -.04em; }
.advisory-feature-copy > span { display: block; margin-top: 20px; color: #e5edf2; line-height: 1.9; }
.advisory-feature-copy ul { display: grid; gap: 10px; margin: 24px 0 0; padding: 0; list-style: none; }
.advisory-feature-copy li { padding: 10px 13px; color: #173c59; background: #fff; font-weight: 800; }

.lineup-carpet-promo {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(340px, .75fr);
  min-height: 330px;
  margin: 46px 0 28px;
  overflow: hidden;
  color: #fff;
  background: #173c59;
  border-radius: 24px 6px 24px 6px;
  box-shadow: 0 18px 42px rgb(61 45 31 / .13);
}
.lineup-carpet-promo > img { width: 100%; height: 100%; min-height: 330px; object-fit: cover; object-position: center 25%; }
.lineup-carpet-promo > div { align-self: center; padding: clamp(28px, 4vw, 54px); }
.lineup-carpet-promo p { color: #f1cc71; }
.lineup-carpet-promo h3 { margin: 0; font-family: var(--serif); font-size: clamp(30px, 3.2vw, 47px); line-height: 1.35; }
.lineup-carpet-promo h3 em { color: #f1cc71; font-style: normal; }
.lineup-carpet-promo > div > span { display: block; margin-top: 16px; color: #dfe8ed; line-height: 1.8; }
.lineup-carpet-promo a { display: inline-flex; align-items: center; gap: 10px; margin-top: 22px; padding-bottom: 5px; color: #fff; border-bottom: 2px solid #f1cc71; font-weight: 900; }
.lineup-carpet-promo + .product-index { margin-top: 24px; }

.service-grid.service-grid-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.service-grid-two > article:nth-child(1) > img { content: url("../images/curtain-clean.png") !important; }
.service-grid-two > article:nth-child(2) > img { content: url("../images/furniture-repair-workshop.png") !important; }

@media (max-width: 899px) {
  .scale-showcase { min-height: 0; margin-block: 34px 74px; border-radius: 18px 4px 18px 4px; }
  .scale-showcase-media { position: relative; aspect-ratio: 4 / 3; }
  .scale-showcase-copy { position: relative; left: auto; bottom: auto; width: auto; margin: -34px 12px 12px; padding: 26px 22px 28px; }
  .scale-showcase-copy h1 { font-size: clamp(30px, 9vw, 43px); }
  .scale-showcase-copy > span { font-size: 14px; }
  .scale-showcase-facts strong { font-size: clamp(42px, 13vw, 62px); }
  .advisory-feature { grid-template-columns: 1fr; margin-bottom: 76px; }
  .advisory-feature-media { min-height: 0; aspect-ratio: 4 / 3; }
  .advisory-feature-copy { padding: 34px 24px 38px; }
  .lineup-carpet-promo { grid-template-columns: 1fr; margin-top: 34px; }
  .lineup-carpet-promo > img { min-height: 0; height: 230px; }
  .lineup-carpet-promo > div { padding: 28px 22px 32px; }
  .service-grid.service-grid-two { grid-template-columns: 1fr; }
}

/* Benefits review: keep every desktop benefit card the same size and keep the
   reference site's "詳しく見る" explanation inside the card. */
@media (min-width: 900px) {
  .benefit-card-grid,
  .benefit-card-grid.zero-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-auto-rows: 330px;
  }

  .benefit-card {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto minmax(0, 1fr);
    align-items: start;
    min-height: 330px;
    height: 330px;
  }

  .benefit-card span {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
  }

  .benefit-card b {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
  }

  .benefit-card-detail {
    display: block;
    grid-column: 1 / -1;
    grid-row: 2;
    align-self: start;
    margin: 14px 0 0;
    padding-top: 14px;
    color: #655e56;
    border-top: 1px solid color-mix(in srgb, var(--story-accent) 18%, white);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.75;
  }
}