/* Here & Now — shared stylesheet. Ported 1:1 from the original .dc.html inline
   styles into classes, grouped to mirror the SECTION boundaries in the HTML
   (see the <!-- SECTION: … --> comments in each page) so this can later be
   split per Shopify section/snippet without re-deriving values. */

/* ===== Wordmark font ===== */
@font-face {
  font-family: 'Poppins Bold';
  src: url('../fonts/Poppins-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ===== Reset / base ===== */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  background: #EFE6D2;
  color: #0E0E0E;
  font-family: Inter, system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}
a { color: #2747D9; text-decoration: none; }
a:hover { color: #D94A2A; }
img { max-width: 100%; }
button { font-family: inherit; }
::selection { background: #2747D9; color: #EFE6D2; }

.page-shell { min-height: 100vh; display: flex; flex-direction: column; }
.main-content { flex: 1; }
.fade-in { animation: fadeIn .4s ease; }

/* ===== keyframes ===== */
@keyframes drawerIn { from { transform: translateX(100%); } to { transform: translateX(0); } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes toastIn { from { opacity: 0; transform: translate(-50%, 12px); } to { opacity: 1; transform: translate(-50%, 0); } }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes heroProg { from { width: 0%; } to { width: 100%; } }
@keyframes bulbBlink { 0%, 100% { opacity: 1; } 50% { opacity: .28; } }
@keyframes bulbBlink2 { 0%, 100% { opacity: .28; } 50% { opacity: 1; } }
@keyframes neonFlicker { 0%, 100% { text-shadow: 0 0 7px rgba(217,74,42,.9), 0 0 26px rgba(217,74,42,.55), 0 0 48px rgba(217,74,42,.35); } 50% { text-shadow: 0 0 10px rgba(39,71,217,.95), 0 0 34px rgba(39,71,217,.6), 0 0 62px rgba(39,71,217,.4); } }
@keyframes badgeGlow { 0%, 100% { box-shadow: 0 0 0 0 rgba(217,74,42,.55), 0 0 14px 2px rgba(217,74,42,.5); } 50% { box-shadow: 0 0 0 0 rgba(39,71,217,.55), 0 0 22px 5px rgba(39,71,217,.6); } }
@keyframes spinSlow { to { transform: rotate(360deg); } }

/* ===== SECTION: header ===== */
.site-header { position: sticky; top: 0; z-index: 40; background: rgba(239,230,210,.92); backdrop-filter: blur(8px); border-bottom: 1px solid rgba(14,14,14,.12); }
.header-inner { max-width: 1240px; margin: 0 auto; padding: 16px 32px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
/* ===== Wordmark: "here&now." — Poppins Bold, no word-spacing, no italics,
   no underline. Ampersand is the only accent (1.1×, persimmon). Text is
   ink on cream surfaces, cream on ink surfaces. Clear space around the
   mark ≈ the height of a lowercase "h" (~0.72em), reserved via padding. */
.brand-mark, .footer-brand {
  font-family: 'Poppins Bold', Inter, system-ui, sans-serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0;
  text-decoration: none;
  padding: 0.36em 0;
}
.brand-mark { background: none; border: 0; cursor: pointer; font-size: 25px; color: #0E0E0E; }
.footer-brand { color: #EFE6D2; font-size: 22px; }
.brand-mark .accent, .footer-brand .accent {
  display: inline-block;
  font-size: 1.1em;
  line-height: 1;
  color: #D94A2A;
}
.main-nav { display: flex; gap: 30px; align-items: center; }
.nav-link { background: none; border: 0; cursor: pointer; padding: 0; font-family: Inter; font-size: 14px; font-weight: 500; letter-spacing: .02em; color: #0E0E0E; text-decoration: none; }
.nav-link:hover { color: #D94A2A; }
.nav-sale { display: inline-flex; align-items: center; gap: 6px; background: none; border: 0; cursor: pointer; padding: 0; font-family: Inter; font-size: 14px; font-weight: 700; letter-spacing: .02em; color: #D94A2A; text-decoration: none; }
.nav-sale:hover { color: #0E0E0E; }
.sale-dot { width: 7px; height: 7px; border-radius: 50%; background: #D94A2A; animation: bulbBlink .9s steps(1,end) infinite; display: inline-block; }
.btn-cart { display: flex; align-items: center; gap: 8px; background: #0E0E0E; color: #EFE6D2; border: 0; cursor: pointer; padding: 9px 16px; border-radius: 4px; font-family: Inter; font-size: 13px; font-weight: 600; letter-spacing: .03em; }
.cart-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 19px; height: 19px; padding: 0 5px; background: var(--accent, #D94A2A); color: #EFE6D2; border-radius: 10px; font-size: 11px; font-weight: 700; }

/* current-page nav state */
.nav-link.is-active { text-decoration: underline; text-underline-offset: 4px; }

/* ===== SECTION: announcement-bar (marquee) ===== */
.marquee-strip { overflow: hidden; background: #0E0E0E; color: #EFE6D2; padding: 15px 0; border-top: 1px solid rgba(14,14,14,.1); }
.marquee-strip.marquee-red { background: #D94A2A; padding: 12px 0; margin-top: 24px; }
.marquee-track { display: flex; gap: 56px; width: max-content; animation: marquee 26s linear infinite; white-space: nowrap; font-family: Silkscreen, monospace; font-size: 15px; letter-spacing: .04em; }
.marquee-red .marquee-track { animation-duration: 22s; gap: 48px; font-size: 14px; letter-spacing: .05em; }
.marquee-group { display: flex; gap: 56px; }
.marquee-red .marquee-group { gap: 48px; }

/* ===== SECTION: image-banner (hero) ===== */
.hero-section { max-width: 1240px; margin: 0 auto; padding: 52px 32px 40px; display: grid; grid-template-columns: 1.05fr .95fr; gap: 56px; align-items: center; }
.hero-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #D94A2A; margin-bottom: 22px; }
.hero-eyebrow-line { width: 22px; height: 1px; background: #D94A2A; }
.hero-dots { display: inline-flex; align-items: center; gap: 6px; margin-left: 4px; }
.hero-dot { width: 6px; height: 6px; padding: 0; border: 0; border-radius: 8px; background: rgba(14,14,14,.25); cursor: pointer; transition: all .3s ease; }
.hero-dot.is-active { width: 18px; background: #D94A2A; }
.hero-lede { font-family: 'Playfair Display', serif; font-weight: 800; font-size: 34px; line-height: 1; letter-spacing: -.01em; color: rgba(14,14,14,.55); margin-bottom: 6px; }
.hero-swap { transition: opacity 400ms ease; }
.hero-title { font-family: 'Playfair Display', serif; font-weight: 800; font-size: 72px; line-height: .98; letter-spacing: -.02em; margin: 0 0 16px; }
.hero-title .dot { }
.hero-copy { font-size: 18px; line-height: 1.55; max-width: 430px; margin: 0; color: rgba(14,14,14,.75); }
.hero-cta-row { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 30px; }
.btn-primary { display: inline-block; text-decoration: none; background: #2747D9; color: #EFE6D2; border: 0; cursor: pointer; padding: 15px 28px; border-radius: 4px; font-family: Inter; font-size: 15px; font-weight: 600; letter-spacing: .02em; }
.btn-primary:hover { background: #0E0E0E; color: #EFE6D2; }
.btn-secondary { display: inline-block; text-decoration: none; background: none; color: #0E0E0E; border: 1px solid rgba(14,14,14,.35); cursor: pointer; padding: 15px 28px; border-radius: 4px; font-family: Inter; font-size: 15px; font-weight: 600; }
.btn-secondary:hover { border-color: #0E0E0E; color: #0E0E0E; }
.hero-tabs { display: flex; gap: 10px; margin-top: 38px; }
.hero-tab { flex: 1; text-align: left; cursor: pointer; background: none; border: 0; padding: 13px 0 0; position: relative; border-top: 2px solid rgba(14,14,14,.18); }
.hero-tab.is-active { border-top-color: transparent; }
.hero-tab-progress { position: absolute; top: -2px; left: 0; height: 2px; width: 100%; animation: heroProg 3800ms linear; }
.hero-tab-progress.is-paused { animation-play-state: paused; }
.hero-tab-label { font-family: Inter; font-size: 13px; font-weight: 600; color: rgba(14,14,14,.5); }
.hero-tab.is-active .hero-tab-label { color: #0E0E0E; }
.hero-visual { position: relative; aspect-ratio: 4/5; border-radius: 6px; overflow: hidden; background-image: repeating-linear-gradient(45deg,rgba(14,14,14,.05) 0 7px,transparent 7px 14px),repeating-linear-gradient(-45deg,rgba(14,14,14,.05) 0 7px,transparent 7px 14px); }
.hero-visual-img { position: absolute; inset: 0; transition: opacity 400ms ease; }
.hero-visual-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hero-visual-tag { position: absolute; left: 16px; top: 14px; z-index: 2; background: rgba(14,14,14,.7); color: #EFE6D2; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; padding: 5px 10px; border-radius: 20px; }

/* ===== SECTION: featured-collection ===== */
.featured-section { max-width: 1240px; margin: 0 auto; padding: 72px 32px 24px; }
.featured-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 36px; flex-wrap: wrap; }
.featured-eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #2747D9; margin-bottom: 12px; }
.featured-heading { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 44px; line-height: 1; letter-spacing: -.01em; margin: 0; }
.featured-heading em { font-style: italic; font-weight: 500; }
.featured-controls { display: flex; align-items: center; gap: 18px; }
.slide-arrows { display: flex; gap: 8px; }
.slide-btn { width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(14,14,14,.3); background: none; cursor: pointer; font-size: 18px; line-height: 1; color: #0E0E0E; display: flex; align-items: center; justify-content: center; }
.slide-btn:hover { border-color: #0E0E0E; background: #0E0E0E; color: #EFE6D2; }
.view-all-link { display: inline-block; background: none; border: 0; cursor: pointer; font-family: Inter; font-size: 14px; font-weight: 600; color: #0E0E0E; border-bottom: 2px solid #D94A2A; padding: 0 0 3px; white-space: nowrap; text-decoration: none; }
.slide-viewport { overflow: hidden; }
.slide-track { display: flex; gap: 22px; transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.slide-track .product-card { flex: 0 0 var(--card-w, calc((100% - 66px)/4)); }
.slide-dots { display: flex; justify-content: center; gap: 8px; margin-top: 30px; }
.slide-dot { height: 8px; border-radius: 8px; border: 0; cursor: pointer; transition: all .3s ease; padding: 0; background: rgba(14,14,14,.25); width: 8px; }
.slide-dot.is-active { width: 26px; background: #0E0E0E; }

/* ===== shared product-card (home / collection / sale / related) ===== */
.product-card { cursor: pointer; display: flex; flex-direction: column; gap: 14px; height: 100%; }
.product-card:hover { opacity: .94; }
.product-media { position: relative; flex-shrink: 0; width: 100%; aspect-ratio: 1/1; border-radius: 6px; overflow: hidden; background-color: #EFE6D2; display: flex; align-items: center; justify-content: center; padding: 10%; }
.product-media img { position: static; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; object-position: center; display: block; }
.product-media .art-wrap { transform: scale(1.35); }
.product-media.related-media { aspect-ratio: 4/3; }
.product-media.related-media .art-wrap { transform: scale(1.1); }
/* badges sit at the edge of the padded image content, not the tile's outer
   (page-coloured, invisible) edge — otherwise they read as floating above
   the photo instead of pinned to it */
.sale-badge { position: absolute; top: max(11px, 10%); right: max(11px, 10%); background: #D94A2A; color: #EFE6D2; font-size: 11px; font-weight: 700; padding: 4px 9px; border-radius: 20px; }
.coming-soon-badge { position: absolute; top: max(11px, 10%); right: max(11px, 10%); background: #D94A2A; color: #EFE6D2; font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; padding: 4px 9px; border-radius: 20px; }
.cap-label { position: absolute; left: max(12px, 10%); bottom: max(11px, 10%); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.product-info-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.product-name { font-family: 'Playfair Display', serif; font-weight: 600; font-size: 19px; cursor: pointer; text-decoration: none; color: inherit; }
.related-media + .product-info-row .product-name, .related-section .product-name { font-size: 18px; }
.product-price { font-size: 15px; font-weight: 600; }
.product-tagline { font-size: 13px; color: rgba(14,14,14,.62); margin-top: -8px; display: block; }
.add-btn { margin-top: auto; color: #EFE6D2; border: 0; cursor: pointer; padding: 11px; border-radius: 4px; font-family: Inter; font-size: 13px; font-weight: 600; letter-spacing: .02em; width: 100%; }
.add-btn:hover { opacity: .9; }
.sale-price-row { display: flex; align-items: baseline; gap: 7px; }
.sale-was { font-size: 13px; color: rgba(14,14,14,.45); text-decoration: line-through; }
.sale-now { font-size: 16px; font-weight: 700; color: #D94A2A; }
.sale-percent-badge { position: absolute; top: max(11px, 10%); right: max(11px, 10%); display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 50%; background: #D94A2A; color: #EFE6D2; font-family: Silkscreen, monospace; font-size: 12px; transform: rotate(-8deg); animation: badgeGlow 1.8s ease-in-out infinite; }

/* ===== SECTION: promo-third-eye ===== */
.promo-section { margin: 72px 0 0; background: #2747D9; color: #EFE6D2; overflow: hidden; }
.promo-grid { max-width: 1240px; margin: 0 auto; padding: 72px 32px 0; display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: end; min-height: 520px; }
.promo-copy { padding-bottom: 76px; }
.promo-eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: rgba(239,230,210,.7); margin-bottom: 14px; }
.promo-title { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 54px; line-height: 1; letter-spacing: -.02em; margin: 0 0 18px; }
.promo-desc { font-size: 17px; line-height: 1.55; max-width: 420px; margin: 0 0 30px; color: rgba(239,230,210,.85); }
.promo-stats { display: flex; gap: 20px; margin-bottom: 32px; }
.promo-stat-num { font-family: 'Playfair Display', serif; font-size: 30px; font-weight: 700; }
.promo-stat-label { font-size: 12px; color: rgba(239,230,210,.7); }
.promo-divider { width: 1px; background: rgba(239,230,210,.25); }
.btn-light { display: inline-block; text-decoration: none; background: #EFE6D2; color: #0E0E0E; border: 0; cursor: pointer; padding: 15px 28px; border-radius: 4px; font-family: Inter; font-size: 15px; font-weight: 600; letter-spacing: .02em; }
.btn-light:hover { background: #D94A2A; color: #EFE6D2; }
.promo-visual { position: relative; align-self: end; height: 100%; min-height: 460px; display: flex; justify-content: center; align-items: flex-end; }
.promo-glow { position: absolute; bottom: 44px; left: 50%; transform: translateX(-50%); width: 360px; height: 360px; border-radius: 50%; background: radial-gradient(circle,rgba(239,230,210,.22) 0%,rgba(239,230,210,0) 68%); }
.promo-caption { position: absolute; bottom: 70px; left: 50%; transform: translate(-50%,0); font-family: Silkscreen, monospace; font-size: 16px; letter-spacing: .1em; color: rgba(239,230,210,.5); white-space: nowrap; }
.promo-img { position: relative; z-index: 1; max-width: 112%; height: auto; max-height: 520px; object-fit: contain; object-position: bottom; filter: drop-shadow(0 24px 40px rgba(14,14,14,.35)); }

/* ===== SECTION: rich-text (thinking teaser / about) ===== */
.thinking-section { max-width: 1240px; margin: 0 auto; padding: 84px 32px; }
.thinking-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.thinking-eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #D94A2A; margin-bottom: 18px; }
.thinking-quote { font-family: 'Playfair Display', serif; font-style: italic; font-weight: 500; font-size: 34px; line-height: 1.2; letter-spacing: -.01em; margin: 0 0 24px; }
.thinking-body { font-size: 16px; line-height: 1.6; color: rgba(14,14,14,.72); margin: 0 0 10px; }
.thinking-ps { font-size: 13px; color: rgba(14,14,14,.5); margin: 0; font-style: italic; }
.thinking-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.thinking-card { border-radius: 6px; padding: 26px; }
.thinking-card.dark { background: #0E0E0E; color: #EFE6D2; }
.thinking-card.red { background: #D94A2A; color: #EFE6D2; }
.thinking-card.blue { background: #2747D9; color: #EFE6D2; }
.thinking-card.outline { border: 1px solid rgba(14,14,14,.25); }
.thinking-num { font-family: 'Playfair Display', serif; font-size: 34px; font-weight: 700; margin-bottom: 6px; }
.thinking-text { font-size: 14px; line-height: 1.4; }

/* ===== SECTION: main-collection-product-grid ===== */
.collection-hero { max-width: 1240px; margin: 0 auto; padding: 56px 32px 28px; }
.collection-eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #2747D9; margin-bottom: 14px; }
.collection-title { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 56px; line-height: 1; letter-spacing: -.02em; margin: 0 0 16px; }
.collection-desc { font-size: 17px; line-height: 1.55; max-width: 520px; margin: 0; color: rgba(14,14,14,.7); }
.collection-controls { max-width: 1240px; margin: 0 auto; padding: 0 32px 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; border-bottom: 1px solid rgba(14,14,14,.14); margin-bottom: 32px; }
.filter-row { display: flex; gap: 10px; flex-wrap: wrap; padding-bottom: 20px; }
.filter-btn { cursor: pointer; padding: 8px 15px; border-radius: 20px; border: 1px solid rgba(14,14,14,.3); background: transparent; color: #0E0E0E; font-family: Inter; font-size: 13px; font-weight: 500; }
.filter-btn.is-active { background: #0E0E0E; color: #EFE6D2; border-color: #0E0E0E; }
.view-toggle-wrap { display: flex; align-items: center; gap: 12px; padding-bottom: 20px; }
.view-toggle-label { font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: rgba(14,14,14,.5); }
.view-toggle { display: flex; border: 1px solid rgba(14,14,14,.3); border-radius: 20px; overflow: hidden; }
.view-toggle-btn { cursor: pointer; padding: 7px 16px; border: 0; font-family: Inter; font-size: 13px; font-weight: 600; background: transparent; color: #0E0E0E; }
.view-toggle-btn.is-active { background: #0E0E0E; color: #EFE6D2; }
.collection-grid-section { max-width: 1240px; margin: 0 auto; padding: 0 32px 40px; }
.product-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 24px; }

/* ===== SECTION: main-product ===== */
.product-back-row { max-width: 1240px; margin: 0 auto; padding: 28px 32px 12px; }
.back-link { display: inline-block; background: none; border: 0; cursor: pointer; font-family: Inter; font-size: 13px; color: rgba(14,14,14,.6); padding: 0; text-decoration: none; }
.back-link:hover { color: #0E0E0E; }
.product-layout { max-width: 1240px; margin: 0 auto; padding: 12px 32px 64px; display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; }
.product-gallery { display: flex; flex-direction: column; gap: 14px; position: sticky; top: 96px; }
.product-main-media { position: relative; aspect-ratio: 1/1; border-radius: 8px; overflow: hidden; background-color: #EFE6D2; display: flex; align-items: center; justify-content: center; padding: 10%; }
.product-main-media img { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; object-position: center; }
.product-main-media .art-wrap { transform: scale(2); }
.product-caption { position: absolute; left: 16px; bottom: 14px; font-size: 11px; letter-spacing: .09em; text-transform: uppercase; }
.product-thumbs { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.thumb-placeholder { aspect-ratio: 1/1; border-radius: 6px; background: rgba(14,14,14,.06); border: 1px dashed rgba(14,14,14,.2); display: flex; align-items: center; justify-content: center; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: rgba(14,14,14,.45); text-align: center; padding: 6px; }
.product-info .product-eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #2747D9; margin-bottom: 12px; }
.product-title { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 48px; line-height: 1; letter-spacing: -.02em; margin: 0 0 10px; }
.product-price-lg { font-size: 24px; font-weight: 600; margin-bottom: 22px; }
.product-blurb { font-size: 16px; line-height: 1.6; color: rgba(14,14,14,.75); margin: 0 0 30px; max-width: 460px; }
.option-label { font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: rgba(14,14,14,.55); margin-bottom: 12px; }
.option-label .fit-note { font-weight: 400; text-transform: none; letter-spacing: 0; }
.pair-row { display: flex; gap: 12px; margin-bottom: 28px; flex-wrap: wrap; }
.pair-btn { cursor: pointer; display: flex; align-items: center; gap: 9px; padding: 8px 13px 8px 9px; border-radius: 24px; background: none; border: 1.5px solid rgba(14,14,14,.22); font-family: Inter; font-size: 13px; font-weight: 500; color: #0E0E0E; }
.pair-btn.is-active { border-color: var(--accent, #D94A2A); }
.pair-swatch { display: flex; border-radius: 20px; overflow: hidden; border: 1px solid rgba(14,14,14,.15); }
.pair-swatch span { width: 16px; height: 16px; display: block; }
.size-row { display: flex; gap: 10px; margin-bottom: 28px; }
.size-btn { cursor: pointer; min-width: 74px; padding: 11px 14px; border-radius: 4px; background: transparent; color: #0E0E0E; border: 1.5px solid rgba(14,14,14,.3); font-family: Inter; font-size: 14px; font-weight: 600; }
.size-btn.is-active { background: #0E0E0E; color: #EFE6D2; border-color: #0E0E0E; }
.edition-note { display: flex; align-items: center; gap: 10px; background: rgba(39,71,217,.08); border: 1px solid rgba(39,71,217,.25); border-radius: 6px; padding: 12px 15px; margin-bottom: 28px; }
.edition-note-mark { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 20px; color: #2747D9; }
.edition-note-text { font-size: 13px; line-height: 1.4; color: rgba(14,14,14,.75); }
.add-to-cart-btn { width: 100%; color: #EFE6D2; border: 0; cursor: pointer; padding: 17px; border-radius: 5px; font-family: Inter; font-size: 16px; font-weight: 600; letter-spacing: .02em; margin-bottom: 8px; }
.add-to-cart-btn:hover { opacity: .92; }
.add-hint { font-size: 12px; color: rgba(14,14,14,.5); text-align: center; margin-bottom: 36px; }
.specs-section { border-top: 1px solid rgba(14,14,14,.16); padding-top: 24px; }
.specs-title { font-family: 'Playfair Display', serif; font-weight: 600; font-size: 20px; margin-bottom: 16px; }
.specs-list { display: flex; flex-direction: column; }
.spec-row { display: grid; grid-template-columns: 170px 1fr; gap: 18px; padding: 12px 0; border-bottom: 1px solid rgba(14,14,14,.1); align-items: start; }
.spec-label { display: flex; align-items: center; gap: 9px; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: rgba(14,14,14,.5); }
.spec-label .icon { flex-shrink: 0; color: #2747D9; }
.spec-value { font-size: 14px; line-height: 1.45; }
.spec-note { font-size: 13px; line-height: 1.5; color: rgba(14,14,14,.6); margin: 18px 0 0; font-style: italic; }
.related-section { max-width: 1240px; margin: 0 auto; padding: 0 32px 72px; }
.related-title { font-family: 'Playfair Display', serif; font-weight: 600; font-size: 26px; margin-bottom: 24px; }
.related-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }

/* ===== SECTION: main-page (about) ===== */
.about-hero { max-width: 820px; margin: 0 auto; padding: 72px 32px 40px; text-align: center; }
.about-eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #D94A2A; margin-bottom: 20px; }
.about-title { font-family: 'Playfair Display', serif; font-weight: 800; font-size: 62px; line-height: 1; letter-spacing: -.02em; margin: 0 0 20px; }
.about-desc { font-size: 19px; line-height: 1.6; color: rgba(14,14,14,.75); margin: 0 auto; max-width: 600px; }
.about-cards-section { max-width: 1000px; margin: 0 auto; padding: 20px 32px 72px; }
.about-cards-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.about-card { border-radius: 8px; padding: 34px; }
.about-card.dark { background: #0E0E0E; color: #EFE6D2; }
.about-card.light { background: #EFE6D2; border: 1px solid rgba(14,14,14,.2); }
.about-card.red { background: #D94A2A; color: #EFE6D2; }
.about-card.blue { background: #2747D9; color: #EFE6D2; }
.about-card-title { font-family: 'Playfair Display', serif; font-style: italic; font-size: 24px; margin-bottom: 12px; }
.about-card-body { font-size: 15px; line-height: 1.55; margin: 0; }
.about-card.dark .about-card-body { color: rgba(239,230,210,.82); }
.about-card.light .about-card-body { color: rgba(14,14,14,.7); }
.about-card.red .about-card-body { color: rgba(239,230,210,.9); }
.about-card.blue .about-card-body { color: rgba(239,230,210,.9); }
.about-cta-wrap { text-align: center; margin-top: 48px; }
.btn-dark { display: inline-block; text-decoration: none; background: #0E0E0E; color: #EFE6D2; border: 0; cursor: pointer; padding: 16px 34px; border-radius: 5px; font-family: Inter; font-size: 15px; font-weight: 600; }

/* ===== SECTION: sale-hero ===== */
.sale-hero-wrap { margin: 24px 0 0; padding: 0 32px; }
.sale-hero-card { position: relative; max-width: 1240px; margin: 0 auto; background: #0E0E0E; color: #EFE6D2; border-radius: 10px; overflow: hidden; }
.bulb-row { position: absolute; height: 14px; background-image: radial-gradient(circle at center,#D94A2A 0 3px,transparent 3.4px); background-size: 24px 14px; background-position: center; animation: bulbBlink .9s steps(1,end) infinite; }
.bulb-row.top { top: 0; left: 0; right: 0; }
.bulb-row.bottom { bottom: 0; left: 0; right: 0; background-image: radial-gradient(circle at center,#2747D9 0 3px,transparent 3.4px); animation-name: bulbBlink2; }
.bulb-col { position: absolute; top: 0; bottom: 0; width: 14px; background-size: 14px 24px; background-position: center; }
.bulb-col.left { left: 0; background-image: radial-gradient(circle at center,#2747D9 0 3px,transparent 3.4px); animation: bulbBlink2 .9s steps(1,end) infinite; }
.bulb-col.right { right: 0; background-image: radial-gradient(circle at center,#D94A2A 0 3px,transparent 3.4px); animation: bulbBlink .9s steps(1,end) infinite; }
.sale-hero-inner { position: relative; padding: 66px 56px; text-align: center; }
.sale-eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: rgba(239,230,210,.6); margin-bottom: 14px; }
.sale-title { font-family: 'Playfair Display', serif; font-weight: 900; font-size: 132px; line-height: .86; letter-spacing: -.03em; margin: 0; color: #EFE6D2; animation: neonFlicker 1.6s ease-in-out infinite; }
.sale-percent { font-family: Silkscreen, monospace; font-size: 18px; letter-spacing: .08em; color: #D94A2A; margin: 14px 0 22px; }
.sale-desc { font-size: 17px; line-height: 1.5; max-width: 520px; margin: 0 auto 30px; color: rgba(239,230,210,.82); }
.sale-timer { display: inline-flex; align-items: center; gap: 14px; border: 1px solid rgba(239,230,210,.28); border-radius: 40px; padding: 12px 22px; }
.sale-timer-label { font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: rgba(239,230,210,.6); }
.sale-timer-clock { font-family: Silkscreen, monospace; font-size: 22px; letter-spacing: .06em; color: #EFE6D2; white-space: nowrap; }

/* ===== SECTION: campaign banner ===== */
.campaign-section { max-width: 1240px; margin: 0 auto; padding: 40px 32px 8px; }
.campaign-card { position: relative; border-radius: 10px; overflow: hidden; min-height: 440px; background: #0E0E0E; }
.campaign-photo-clip { position: absolute; inset: 0; clip-path: polygon(0 0, 57% 0, 43% 100%, 0 100%); background: #EFE6D2; }
.campaign-photo-caption { position: absolute; left: 20px; bottom: 16px; background: rgba(14,14,14,.72); color: #EFE6D2; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; padding: 5px 10px; border-radius: 20px; }
.campaign-photo-clip img { height: 100%; object-fit: cover; display: block; position: static; }
.campaign-dark-clip { position: absolute; inset: 0; clip-path: polygon(58.5% 0, 100% 0, 100% 100%, 44.5% 100%); background: #0E0E0E; }
.campaign-accent-clip { position: absolute; top: 0; bottom: 0; right: 0; left: 0; clip-path: polygon(57% 0, 58.5% 0, 44.5% 100%, 43% 100%); background: #D94A2A; animation: neonFlicker 1.6s ease-in-out infinite; }
.campaign-copy { position: absolute; top: 0; bottom: 0; right: 0; width: 56%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 40px; pointer-events: none; }
.campaign-bolt { font-size: 34px; letter-spacing: .3em; color: #D94A2A; margin-bottom: 6px; }
.campaign-heading { font-family: 'Bungee Shade', cursive; font-size: 66px; line-height: .94; margin: 0; color: #EFE6D2; text-shadow: 0 0 18px rgba(217,74,42,.5); }
.campaign-sub { font-family: Silkscreen, monospace; font-size: 15px; letter-spacing: .08em; color: #D94A2A; margin-top: 20px; }

/* ===== SECTION: sale-grid ===== */
.sale-grid-section { max-width: 1240px; margin: 0 auto; padding: 52px 32px 24px; }
.sale-grid-head { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; margin-bottom: 32px; flex-wrap: wrap; }
.sale-grid-title { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 34px; line-height: 1; letter-spacing: -.01em; margin: 0; }
.sale-grid-note { font-size: 13px; color: rgba(14,14,14,.55); }

/* ===== SECTION: footer ===== */
.site-footer { background: #0E0E0E; color: #EFE6D2; margin-top: auto; }
.footer-inner { max-width: 1240px; margin: 0 auto; padding: 64px 32px 40px; }
.footer-top { display: grid; grid-template-columns: 1.4fr 1fr; gap: 56px; padding-bottom: 48px; border-bottom: 1px solid rgba(239,230,210,.16); }
.footer-heading { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 36px; line-height: 1.05; letter-spacing: -.01em; margin: 0 0 12px; }
.footer-sub { font-size: 15px; color: rgba(239,230,210,.7); margin: 0 0 22px; }
.newsletter-form { display: flex; gap: 10px; max-width: 420px; }
.newsletter-input { flex: 1; background: transparent; border: 1px solid rgba(239,230,210,.35); border-radius: 4px; padding: 13px 15px; color: #EFE6D2; font-family: Inter; font-size: 15px; outline: none; }
.newsletter-btn { background: #D94A2A; color: #EFE6D2; border: 0; cursor: pointer; padding: 13px 22px; border-radius: 4px; font-family: Inter; font-size: 14px; font-weight: 600; white-space: nowrap; }
.newsletter-btn:hover { background: #2747D9; }
.newsletter-msg { margin-top: 14px; font-size: 14px; color: #EFE6D2; font-style: italic; }
.footer-explore { display: flex; flex-direction: column; gap: 14px; }
.footer-explore-label { font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: rgba(239,230,210,.55); }
.footer-link { display: block; text-decoration: none; text-align: left; background: none; border: 0; cursor: pointer; color: #EFE6D2; font-family: Inter; font-size: 15px; padding: 0; }
.footer-link:hover { color: #D94A2A; }
.footer-sale-link { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; text-align: left; background: none; border: 0; cursor: pointer; color: #D94A2A; font-weight: 700; font-family: Inter; font-size: 15px; padding: 0; }
.footer-sale-link:hover { color: #EFE6D2; }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-top: 32px; flex-wrap: wrap; }
.footer-dots { display: flex; gap: 8px; align-items: center; }
.footer-dot { width: 22px; height: 22px; border-radius: 50%; background: #EFE6D2; border: 1px solid rgba(239,230,210,.3); }
.footer-dot.cobalt { background: #2747D9; border: none; }
.footer-dot.persimmon { background: #D94A2A; border: none; }
.footer-dot.outline { border: 2px solid #EFE6D2; outline: 1px solid rgba(239,230,210,.3); }
.footer-copy { font-size: 12px; color: rgba(239,230,210,.55); }

/* ===== SECTION: cart-drawer ===== */
.cart-overlay { position: fixed; inset: 0; z-index: 60; display: none; }
.cart-overlay.is-open { display: block; }
.cart-scrim { position: absolute; inset: 0; background: rgba(14,14,14,.45); animation: fadeIn .25s ease; }
.cart-drawer { position: absolute; top: 0; right: 0; height: 100%; width: min(420px,100%); background: #EFE6D2; box-shadow: -16px 0 48px rgba(14,14,14,.25); display: flex; flex-direction: column; animation: drawerIn .32s cubic-bezier(.2,.8,.2,1); }
.cart-drawer-head { display: flex; align-items: center; justify-content: space-between; padding: 22px 24px; border-bottom: 1px solid rgba(14,14,14,.14); }
.cart-drawer-title { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 22px; }
.cart-close { background: none; border: 0; cursor: pointer; font-size: 22px; line-height: 1; color: #0E0E0E; padding: 0; }
.cart-state { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 32px; gap: 14px; }
.cart-state.hidden { display: none; }
.cart-order-code { font-family: Silkscreen, monospace; font-size: 15px; color: #2747D9; line-height: 1.6; }
.cart-state-title { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 26px; }
.cart-empty-state .cart-state-title { font-weight: 600; font-size: 22px; }
.cart-state-body { font-size: 15px; color: rgba(14,14,14,.7); margin: 0; max-width: 280px; }
.cart-state-cta { display: inline-block; text-decoration: none; margin-top: 8px; background: #0E0E0E; color: #EFE6D2; border: 0; cursor: pointer; padding: 13px 26px; border-radius: 4px; font-family: Inter; font-size: 14px; font-weight: 600; }
.cart-empty-state .cart-state-cta { margin-top: 6px; background: #2747D9; }
.cart-items { flex: 1; overflow-y: auto; padding: 8px 24px; display: none; }
.cart-items.is-visible { display: block; }
.cart-item { display: flex; gap: 14px; padding: 18px 0; border-bottom: 1px solid rgba(14,14,14,.1); }
.cart-item-media { width: 64px; height: 64px; flex-shrink: 0; border-radius: 5px; overflow: hidden; background-color: #EFE6D2; display: flex; align-items: center; justify-content: center; padding: 8px; }
.cart-item-media img { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; object-position: center; }
.cart-item-body { flex: 1; min-width: 0; }
.cart-item-top { display: flex; justify-content: space-between; gap: 10px; }
.cart-item-name { font-family: 'Playfair Display', serif; font-weight: 600; font-size: 16px; }
.cart-item-price { font-weight: 600; font-size: 15px; }
.cart-item-line { font-size: 12px; color: rgba(14,14,14,.6); margin-top: 3px; }
.cart-item-remove { margin-top: 8px; background: none; border: 0; cursor: pointer; font-size: 12px; color: #D94A2A; padding: 0; text-decoration: underline; }
.cart-footer { padding: 20px 24px; border-top: 1px solid rgba(14,14,14,.14); display: none; }
.cart-footer.is-visible { display: block; }
.cart-subtotal-row { display: flex; justify-content: space-between; margin-bottom: 4px; }
.cart-subtotal-label { font-size: 15px; font-weight: 600; }
.cart-subtotal-value { font-size: 17px; font-weight: 700; }
.cart-shipping-note { font-size: 12px; color: rgba(14,14,14,.55); margin-bottom: 16px; }
.checkout-btn { width: 100%; background: #0E0E0E; color: #EFE6D2; border: 0; cursor: pointer; padding: 15px; border-radius: 5px; font-family: Inter; font-size: 15px; font-weight: 600; }
.checkout-btn:hover { background: #2747D9; }

/* ===== SECTION: toast ===== */
.toast { position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%); z-index: 70; background: #0E0E0E; color: #EFE6D2; padding: 14px 24px; border-radius: 6px; font-family: Inter; font-size: 14px; font-weight: 500; box-shadow: 0 12px 32px rgba(14,14,14,.3); animation: toastIn .3s ease; display: none; max-width: calc(100vw - 32px); text-align: center; }
.toast.is-visible { display: block; }

/* ======================================================================
   RESPONSIVE
   Breakpoints: 960px (tablet), 640px (mobile). Mirrors the SECTION
   boundaries above — search for the matching SECTION name when tuning
   a specific block, or when this later gets split into per-section
   Shopify liquid + CSS.
   ====================================================================== */

body { overflow-x: hidden; }

/* ---- header / mobile nav ---- */
.header-actions { display: flex; align-items: center; gap: 14px; }
.nav-toggle { display: none; flex-direction: column; justify-content: center; gap: 5px; width: 34px; height: 34px; background: none; border: 0; cursor: pointer; padding: 0; }
.nav-toggle span { display: block; width: 100%; height: 2px; background: #0E0E0E; transition: transform .2s ease, opacity .2s ease; }
.nav-toggle.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.is-open span:nth-child(2) { opacity: 0; }
.nav-toggle.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 900px) {
  .header-inner { padding: 14px 20px; flex-wrap: wrap; }
  .nav-toggle { display: flex; }
  .main-nav {
    order: 3; flex-basis: 100%; flex-direction: column; align-items: flex-start; gap: 4px;
    max-height: 0; overflow: hidden; opacity: 0; margin-top: 0;
    transition: max-height .25s ease, opacity .2s ease, margin-top .25s ease;
  }
  .main-nav.is-open { max-height: 260px; opacity: 1; margin-top: 14px; }
  .nav-link, .nav-sale { padding: 10px 0; width: 100%; }

  /* ---- hero ---- */
  .hero-section { grid-template-columns: 1fr; gap: 32px; padding: 32px 20px 32px; }
  .hero-title { font-size: 52px; }
  .hero-visual { aspect-ratio: 16/10; }

  /* ---- featured / grids ---- */
  .featured-section { padding: 48px 20px 24px; }
  .featured-heading { font-size: 34px; }
  .promo-grid { grid-template-columns: 1fr; padding: 48px 20px 0; min-height: 0; }
  .promo-copy { padding-bottom: 40px; }
  .promo-title { font-size: 40px; }
  .promo-visual { min-height: 320px; }
  .promo-stats { flex-wrap: wrap; row-gap: 16px; }

  .thinking-section { padding: 56px 20px; }
  .thinking-grid { grid-template-columns: 1fr; gap: 36px; }
  .thinking-quote { font-size: 26px; }
  .thinking-cards { grid-template-columns: 1fr 1fr; }

  /* ---- collection ---- */
  .collection-hero { padding: 40px 20px 24px; }
  .collection-title { font-size: 40px; }
  .collection-controls { padding: 0 20px 20px; }
  .collection-grid-section { padding: 0 20px 32px; }
  .product-grid { grid-template-columns: repeat(3, 1fr); gap: 18px; }

  /* ---- product detail ---- */
  .product-back-row { padding: 20px 20px 8px; }
  .product-layout { grid-template-columns: 1fr; gap: 32px; padding: 8px 20px 48px; }
  .product-gallery { position: static; }
  .product-title { font-size: 38px; }
  .related-section { padding: 0 20px 48px; }
  .related-grid { grid-template-columns: repeat(2, 1fr); }

  /* ---- about ---- */
  .about-hero { padding: 48px 20px 32px; }
  .about-title { font-size: 44px; }
  .about-cards-section { padding: 16px 20px 48px; }
  .about-cards-grid { grid-template-columns: 1fr; }

  /* ---- sale ---- */
  .sale-hero-wrap { padding: 0 20px; }
  .sale-hero-inner { padding: 44px 24px; }
  .sale-title { font-size: 84px; }
  .campaign-section { padding: 24px 20px 8px; }
  .sale-grid-section { padding: 36px 20px 20px; }

  /* ---- footer ---- */
  .footer-inner { padding: 48px 20px 32px; }
  .footer-top { grid-template-columns: 1fr; gap: 36px; }
  .footer-heading { font-size: 28px; }
}

@media (max-width: 640px) {
  .header-inner { padding: 12px 16px; }
  .brand-mark { font-size: 21px; }

  /* ---- hero ---- */
  .hero-section { padding: 24px 16px 24px; }
  .hero-title { font-size: 38px; }
  .hero-copy { font-size: 16px; }
  .hero-cta-row { flex-direction: column; align-items: stretch; }
  .hero-tabs { flex-wrap: wrap; }
  .hero-tab { flex: 0 0 calc(50% - 5px); }

  /* ---- featured ---- */
  .featured-section { padding: 36px 16px 16px; }
  .featured-head { flex-direction: column; align-items: flex-start; gap: 16px; }
  .featured-heading { font-size: 28px; }

  .promo-title { font-size: 32px; }
  .promo-stats { gap: 16px; }
  .promo-img { max-width: 100%; }

  .thinking-quote { font-size: 22px; }
  .thinking-cards { grid-template-columns: 1fr; }

  /* ---- collection ---- */
  .collection-title { font-size: 32px; }
  .product-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .filter-row { gap: 8px; }
  .view-toggle-wrap { width: 100%; justify-content: space-between; }

  /* ---- product detail ---- */
  .product-title { font-size: 30px; }
  .product-price-lg { font-size: 20px; }
  .spec-row { grid-template-columns: 1fr; gap: 4px; }
  .related-grid { grid-template-columns: 1fr; }
  .product-thumbs { gap: 8px; }

  /* ---- about ---- */
  .about-title { font-size: 32px; }
  .about-desc { font-size: 16px; }

  /* ---- sale ---- */
  .sale-title { font-size: 52px; }
  .sale-desc { font-size: 15px; }
  .sale-timer { flex-wrap: wrap; justify-content: center; }
  .sale-grid-head { flex-direction: column; align-items: flex-start; gap: 8px; }

  .campaign-card { display: flex; flex-direction: column; min-height: 0; }
  .campaign-photo-clip { position: relative; inset: auto; clip-path: none; height: 220px; }
  .campaign-photo-clip img { width: 100%; height: 100%; object-fit: cover; }
  .campaign-dark-clip, .campaign-accent-clip { display: none; }
  .campaign-copy { position: relative; inset: auto; width: 100%; background: #0E0E0E; padding: 32px 24px; pointer-events: auto; }
  .campaign-heading { font-size: 38px; }
  .campaign-bolt { font-size: 26px; }

  /* ---- footer ---- */
  .footer-bottom { flex-direction: column; align-items: flex-start; gap: 16px; }
  .newsletter-form { flex-direction: column; }

  /* ---- cart drawer ---- */
  .cart-drawer-title { font-size: 19px; }
}

@media (max-width: 420px) {
  .sale-title { font-size: 40px; }
}

/* ===== Hero — orientation-aware fixes =====
   Desktop and tablet-landscape (>900px, or landscape with room to spare)
   keep the original cover-fit hero image untouched. Tablet-portrait and
   mobile-portrait switch the hero image to contain-fit with a page-coloured
   margin so it's never cropped; mobile-portrait additionally drops the CTA
   buttons and the category tab strip to make room for the image. Mobile
   landscape drops just the tab strip and keeps text + image side by side. */

/* tablet-portrait AND mobile-portrait: show the hero photo in full, on a
   transparent holder (no colour mat, no placeholder checker pattern) */
@media (max-width: 900px) and (orientation: portrait) {
  .hero-visual { background: transparent; padding: 8%; display: flex; align-items: center; justify-content: center; }
  .hero-visual-img { position: static; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
  .hero-visual-img img { width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; }
  .hero-visual-tag { top: max(14px, 8%); left: max(16px, 8%); }
}

/* mobile-portrait only: lose the CTAs and the tab strip to free up space,
   and lead with the image instead of the copy */
@media (max-width: 640px) and (orientation: portrait) {
  .hero-cta-row, .hero-tabs { display: none; }
  .hero-section { row-gap: 20px; }
  .hero-copy-col { order: 2; }
  .hero-visual { order: 1; }
}

/* mobile-landscape: drop the tab strip, sit image beside the text, keep both fully visible */
@media (orientation: landscape) and (max-height: 500px) {
  .hero-section { grid-template-columns: 1fr 1fr; gap: 20px; padding: 16px 20px; align-items: center; }
  .hero-eyebrow { margin-bottom: 10px; }
  .hero-lede { font-size: 18px; }
  .hero-title { font-size: 26px; margin: 0 0 8px; }
  .hero-copy { font-size: 13px; line-height: 1.4; }
  .hero-cta-row { flex-direction: row; margin-top: 14px; gap: 8px; }
  .btn-primary, .btn-secondary { padding: 9px 16px; font-size: 12px; }
  .hero-tabs { display: none; }
  .hero-visual { aspect-ratio: 1/1; background-color: #EFE6D2; padding: 8%; display: flex; align-items: center; justify-content: center; }
  .hero-visual-img { position: static; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
  .hero-visual-img img { width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; }
  .hero-visual-tag { top: max(10px, 8%); left: max(10px, 8%); }
}

/* ===== SECTION: coming-soon-hero ===== */
.soon-hero-wrap { margin: 32px 0 0; padding: 0 32px; }
.soon-hero-card { position: relative; max-width: 900px; margin: 0 auto; background: #0E0E0E; color: #EFE6D2; border-radius: 10px; overflow: hidden; }
.soon-hero-inner { position: relative; padding: 64px 48px; text-align: center; }
.soon-title { font-family: 'Playfair Display', serif; font-weight: 900; font-size: 128px; line-height: .86; letter-spacing: -.03em; margin: 0; color: #EFE6D2; animation: neonFlicker 1.6s ease-in-out infinite; }
.soon-form { display: flex; gap: 10px; max-width: 420px; margin: 30px auto 0; }
.soon-input { flex: 1; }
.soon-submit { white-space: nowrap; }
.soon-msg { text-align: center; }

/* ===== SECTION: excuse-generator ===== */
.soon-excuse-section { max-width: 640px; margin: 0 auto; padding: 72px 32px; text-align: center; }
.soon-excuse-eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #2747D9; margin-bottom: 14px; }
.soon-excuse-title { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 34px; line-height: 1; letter-spacing: -.01em; margin: 0 0 28px; }
.soon-excuse-box { min-height: 90px; display: flex; align-items: center; justify-content: center; background: rgba(14,14,14,.05); border: 1px dashed rgba(14,14,14,.25); border-radius: 8px; padding: 20px 28px; margin-bottom: 24px; }
.soon-excuse-text { font-family: 'Playfair Display', serif; font-style: italic; font-size: 19px; line-height: 1.4; color: rgba(14,14,14,.8); margin: 0; transition: opacity .2s ease; }
.soon-excuse-btn { cursor: pointer; }

@media (max-width: 640px) {
  .soon-hero-inner { padding: 40px 24px; }
  .soon-title { font-size: 68px; }
  .soon-form { flex-direction: column; }
  .soon-excuse-section { padding: 48px 20px; }
  .soon-excuse-title { font-size: 26px; }
  .soon-excuse-text { font-size: 16px; }
}