:root {
  --black: #080808;
  --panel: #11100e;
  --ivory: #f7f3ea;
  --muted: #b9b2a5;
  --gold: #d5aa4d;
  --gold-light: #f1d58d;
  --line: rgba(213,170,77,.28);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--black);
  color: var(--ivory);
  font: 400 1rem/1.65 "DM Sans", sans-serif;
}
main { display: flex; flex-direction: column; }
main > section { order: 3; }
.hero { order: 0; }
.creator-app { order: 1; padding-top: clamp(70px,9vw,120px); }
.universe { order: 2; }
a { color: inherit; }
.site-header {
  position: fixed; inset: 0 0 auto; z-index: 20;
  min-height: 76px; padding: 0 clamp(20px,5vw,72px);
  display: flex; align-items: center; justify-content: space-between;
  background: linear-gradient(to bottom, rgba(8,8,8,.96), rgba(8,8,8,.55), transparent);
}
.brand { text-decoration: none; font-weight: 600; letter-spacing: .06em; }
.brand span { color: var(--gold-light); font: 700 1.55rem "Playfair Display", serif; margin-right: .2rem; }
nav { display: flex; gap: clamp(18px,3vw,38px); }
nav a { text-decoration: none; color: #e6dfd2; font-size: .93rem; }
nav a:hover, nav a:focus-visible { color: var(--gold-light); }
.menu-toggle { display: none; }
.app-nav { display: none; }
.hero { position: relative; min-height: min(900px,100svh); display: grid; align-items: center; overflow: hidden; }
.hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5,5,5,.97) 0%, rgba(5,5,5,.78) 35%, rgba(5,5,5,.15) 72%), linear-gradient(0deg, var(--black), transparent 20%); }
.hero-content { position: relative; z-index: 2; width: min(660px,86%); margin-left: clamp(20px,8vw,120px); padding-top: 70px; }
.eyebrow { color: var(--gold-light); text-transform: uppercase; letter-spacing: .22em; font-size: .78rem; font-weight: 700; }
h1, h2, h3 { font-family: "Playfair Display", serif; margin-top: 0; line-height: 1.05; }
h1 { margin-bottom: 22px; font-size: clamp(3.3rem,7vw,7rem); letter-spacing: -.04em; }
h1 em { color: var(--gold-light); font-style: italic; }
.intro { max-width: 560px; margin: 0 0 32px; color: #d6d0c5; font-size: clamp(1rem,2vw,1.2rem); }
.actions { display: flex; flex-wrap: wrap; gap: 12px; }
.button { min-height: 52px; padding: 14px 22px; border: 1px solid var(--gold); display: inline-flex; align-items: center; justify-content: center; text-decoration: none; font-weight: 700; transition: .2s ease; }
.button.gold { background: var(--gold); color: #120e05; }
.button.gold:hover { background: var(--gold-light); border-color: var(--gold-light); transform: translateY(-2px); }
.button.ghost:hover { background: rgba(213,170,77,.1); }
.button.whatsapp { border-color: #25d366; background: #25d366; color: #071a0e; }
.button.whatsapp:hover { border-color: #5ce986; background: #5ce986; transform: translateY(-2px); }
.universe { padding: clamp(80px,10vw,150px) clamp(20px,6vw,90px); }
.section-heading { max-width: 760px; margin-bottom: 48px; }
h2 { font-size: clamp(2.4rem,5vw,4.8rem); letter-spacing: -.035em; }
.cards { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.feature-card { position: relative; min-height: 390px; padding: 42px 34px; border-right: 1px solid var(--line); background: linear-gradient(145deg, rgba(255,255,255,.025), transparent); }
.feature-card:last-child { border-right: 0; }
.feature-card:hover { background: linear-gradient(145deg, rgba(213,170,77,.11), rgba(255,255,255,.01)); }
.number { position: absolute; right: 28px; top: 24px; color: #706656; font-size: .78rem; }
.card-icon { color: var(--gold); font-size: 2rem; margin-bottom: 54px; }
.feature-card h3 { font-size: 2.25rem; margin-bottom: 18px; }
.feature-card p { color: var(--muted); min-height: 95px; }
.feature-card a { text-decoration: none; color: var(--gold-light); font-weight: 700; }
.note { color: #8d877d; font-size: .88rem; }
.creator-app { padding: 0 clamp(20px,6vw,90px) clamp(90px,11vw,150px); scroll-margin-top: 90px; }
.creator-heading { display: flex; align-items: end; justify-content: space-between; gap: 32px; margin-bottom: 30px; }
.creator-heading h2 { margin-bottom: 0; }
.creator-heading > p { max-width: 500px; margin: 0 0 8px; color: var(--muted); }
.tool-tabs { display: grid; grid-template-columns: repeat(4,1fr); border: 1px solid var(--line); border-bottom: 0; }
.tool-tab { min-height: 58px; padding: 12px 16px; border: 0; border-right: 1px solid var(--line); background: #0d0c0a; color: var(--muted); font: 600 .92rem "DM Sans",sans-serif; cursor: pointer; }
.tool-tab:last-child { border-right: 0; }
.tool-tab:hover, .tool-tab:focus-visible { color: var(--gold-light); background: #17140e; }
.tool-tab.active { color: #120e05; background: var(--gold); }
.tool-workspace { border: 1px solid var(--line); background: linear-gradient(145deg, rgba(213,170,77,.08), transparent 38%), #11100e; }
.tool-panel { display: grid; grid-template-columns: minmax(280px,.8fr) minmax(360px,1.2fr); gap: clamp(28px,5vw,70px); padding: clamp(28px,5vw,64px); }
.creator-form { display: grid; align-content: start; gap: 18px; }
.creator-form label { display: grid; gap: 7px; color: #e8e0d2; font-size: .92rem; font-weight: 600; }
.creator-form input, .creator-form select, .creator-form textarea { width: 100%; min-height: 50px; padding: 12px 14px; border: 1px solid rgba(213,170,77,.38); border-radius: 0; background: #090807; color: var(--ivory); font: inherit; }
.creator-form textarea { min-height: 180px; resize: vertical; line-height: 1.55; }
.creator-form input::placeholder, .creator-form textarea::placeholder { color: #746e65; }
.creator-form input:focus, .creator-form select:focus, .creator-form textarea:focus { outline: 2px solid var(--gold); outline-offset: 2px; }
.field-help { color: var(--muted); font-size: .85rem; font-weight: 400; line-height: 1.45; }
.character-count { justify-self: end; color: #c7bda9; font-size: .82rem; font-weight: 500; }
.creator-form .button { margin-top: 5px; cursor: pointer; }
.trial-offer { padding: 16px 18px; border-left: 3px solid var(--gold); background: rgba(213,170,77,.08); }
.trial-offer strong, .trial-offer span { display: block; }
.trial-offer strong { color: var(--gold-light); margin-bottom: 4px; }
.trial-offer span { color: var(--muted); font-size: .9rem; line-height: 1.5; }
.song-payment { padding: 22px; border: 1px solid var(--gold); background: rgba(213,170,77,.1); }
.song-payment[hidden] { display: none !important; }
.song-payment strong { display: block; color: var(--gold-light); font-size: 1.1rem; }
.song-payment p { margin: 8px 0 16px; color: #ddd6ca; font-size: .92rem; }
.song-payment .button { width: 100%; text-align: center; }
.song-payment small { display: block; margin-top: 12px; color: var(--muted); line-height: 1.45; }
.song-plans { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 18px; }
.song-plan { padding: 18px; border: 1px solid var(--line); background: #090807; }
.song-plan > span { display: block; min-height: 2.7em; color: var(--muted); font-size: .8rem; }
.song-plan h4 { margin: 8px 0 4px; font: 700 1.25rem "Playfair Display",serif; }
.song-plan > strong { margin-bottom: 16px; color: var(--gold-light); font-size: 1.35rem; }
.song-plan .button { min-height: 46px; padding: 10px 12px; font-size: .86rem; }
.song-plan .button:disabled { opacity: .58; cursor: not-allowed; transform: none; }
.featured-plan { border-color: var(--gold); background: rgba(213,170,77,.08); }
.generated-audio { width: 100%; margin: 12px 0 20px; }
.audio-download { width: fit-content !important; }
.song-cover-preview { width: min(100%,360px); height: auto; display: block; margin: 0 0 20px; border: 1px solid var(--line); }
.creator-result { min-height: 320px; padding: clamp(24px,4vw,42px); border: 1px solid var(--line); background: rgba(5,5,5,.72); color: #ddd6ca; white-space: pre-wrap; overflow-wrap: anywhere; }
.creator-result > p:first-child { margin-top: 0; color: var(--muted); }
.creator-result h3 { color: var(--gold-light); font-size: 1.7rem; margin-bottom: 18px; }
.creator-result-error { min-height: 0; align-self: start; border-color: rgba(213,170,77,.55); }
.creator-result-error > p { white-space: normal; }
.compact-retry { min-height: 46px; margin-top: 8px; background: transparent; color: var(--gold-light); cursor: pointer; }
.creator-result .copy-result { margin-top: 24px; min-height: 44px; padding: 10px 16px; border: 1px solid var(--gold); background: transparent; color: var(--gold-light); font: 700 .9rem "DM Sans",sans-serif; cursor: pointer; }
.publication-result { display: grid; gap: 20px; align-content: start; }
.publication-canvas { width: min(100%,520px); height: auto; display: block; border: 1px solid var(--line); }
.publication-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.publication-actions .button { min-height: 46px; padding: 11px 16px; cursor: pointer; }
.result-block { padding: 16px 0; border-bottom: 1px solid var(--line); }
.result-block:last-of-type { border-bottom: 0; }
.result-block strong { color: var(--ivory); }
.creations-panel { align-items: start; }
.creations-intro h3 { color: var(--gold-light); font-size: clamp(2rem,4vw,3rem); margin-bottom: 18px; }
.creations-intro > p:not(.eyebrow) { color: var(--muted); max-width: 430px; }
.creations-intro .button { margin-top: 16px; cursor: pointer; background: transparent; color: var(--gold-light); }
.creations-list { min-height: 260px; display: grid; gap: 14px; }
.empty-creations { margin: 0; padding: 28px; border: 1px dashed var(--line); color: var(--muted); }
.creation-item { padding: 22px; border: 1px solid var(--line); background: rgba(5,5,5,.72); }
.creation-cover { width: 112px; aspect-ratio: 1; object-fit: cover; float: right; margin: 0 0 14px 18px; border: 1px solid var(--line); }
.creation-item h4 { margin: 0 0 6px; color: var(--gold-light); font: 700 1.25rem "Playfair Display",serif; }
.creation-meta { margin: 0 0 14px; color: var(--muted); font-size: .88rem; }
.creation-item audio { width: 100%; margin-bottom: 14px; }
.creation-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.creation-actions .button { min-height: 44px; padding: 10px 16px; font-size: .88rem; }
.delete-creation { border-color: #73534d; color: #e9b7ae; background: transparent; cursor: pointer; }
.share-creation { border-color: var(--gold); color: var(--gold-light); background: transparent; cursor: pointer; }
.ad-result { display: grid; gap: 18px; align-content: start; }
#ad-canvas { width: min(100%,520px); height: auto; display: block; background: #080808; border: 1px solid var(--line); }
.ad-status { margin: 0; color: var(--muted); white-space: normal; }
.ad-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.ad-actions .button { cursor: pointer; background: transparent; color: var(--gold-light); }
#download-ad[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }
.music-showcase {
  margin: 0 clamp(20px,6vw,90px) clamp(90px,11vw,150px);
  padding: clamp(34px,6vw,72px);
  display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(32px,6vw,90px); align-items: center;
  background: radial-gradient(circle at 10% 20%, rgba(213,170,77,.2), transparent 34%), #11100e;
  border: 1px solid var(--line);
}
.music-copy > p:not(.eyebrow) { max-width: 560px; color: var(--muted); font-size: 1.05rem; }
.track-list { list-style: none; padding: 0; margin: 32px 0; border-top: 1px solid var(--line); columns: 2; column-gap: 28px; }
.track-list li { display: grid; grid-template-columns: 42px 1fr; gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.track-list span { color: var(--gold); font-size: .78rem; letter-spacing: .1em; }
.track-list strong { font-weight: 600; }
.music-actions { margin-top: 30px; }
.artist-support { margin-top: 24px; padding: 22px; display: grid; grid-template-columns: 1fr auto; gap: 22px; align-items: center; border: 1px solid rgba(213,170,77,.45); background: rgba(213,170,77,.07); }
.artist-support strong { display: block; margin-bottom: 5px; color: var(--gold-light); font: 700 1.1rem "DM Sans",sans-serif; }
.artist-support p { margin: 0; color: var(--muted); font-size: .94rem; line-height: 1.55; }
.artist-support .button { white-space: nowrap; text-align: center; }
.music-player { position: relative; aspect-ratio: 16/10; min-height: 320px; border: 1px solid var(--line); background: #050505; box-shadow: 0 30px 80px rgba(0,0,0,.38); }
.music-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.collections { padding: 0 clamp(20px,6vw,90px) clamp(90px,11vw,160px); }
.kids-studio { margin: 0 clamp(20px,6vw,90px) clamp(90px,11vw,150px); padding: clamp(34px,6vw,72px); scroll-margin-top: 90px; border: 1px solid var(--line); background: radial-gradient(circle at 92% 8%, rgba(213,170,77,.18), transparent 30%), #11100e; }
.kids-heading { display: grid; grid-template-columns: 1fr minmax(280px,520px); gap: 40px; align-items: end; margin-bottom: 38px; }
.kids-heading h2 { margin-bottom: 5px; }
.kids-heading > p { margin: 0 0 8px; color: var(--muted); line-height: 1.65; }
.kids-subtitle { margin: 0; color: var(--gold-light); font: 600 clamp(1.2rem,2vw,1.65rem) "DM Sans",sans-serif; }
.kids-experience { display: grid; grid-template-columns: minmax(280px,.75fr) minmax(420px,1.25fr); gap: clamp(26px,5vw,68px); }
.kids-controls { display: grid; align-content: start; gap: 18px; }
.kids-step { display: grid; grid-template-columns: 34px 1fr; gap: 12px; align-items: start; }
.kids-step > span { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--gold); border-radius: 50%; color: var(--gold-light); font-weight: 700; }
.kids-step strong, .kids-step small { display: block; }
.kids-step small { margin-top: 3px; color: var(--muted); line-height: 1.4; }
.kids-upload { min-height: 130px; padding: 24px; display: grid; place-items: center; text-align: center; border: 1px dashed rgba(241,213,141,.55); background: rgba(213,170,77,.045); cursor: pointer; }
.kids-upload:hover, .kids-upload:focus-within { border-color: var(--gold-light); background: rgba(213,170,77,.09); }
.kids-upload > span { color: var(--gold-light); font-size: 2rem; line-height: 1; }
.kids-upload small { color: var(--muted); }
.kids-consent { display: grid; grid-template-columns: 22px 1fr; gap: 10px; align-items: start; color: #ded7ca; font-size: .86rem; line-height: 1.45; cursor: pointer; }
.kids-consent input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--gold); }
.look-options { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.look-option { min-height: 84px; padding: 10px; display: grid; place-items: center; gap: 7px; border: 1px solid var(--line); background: #090807; color: var(--ivory); cursor: pointer; }
.look-option i { width: 30px; height: 30px; display: block; border-radius: 50%; background: var(--look); box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); }
.look-option.active { border-color: var(--gold); color: var(--gold-light); }
.kids-size { display: grid; gap: 7px; color: #e8e0d2; font-size: .92rem; font-weight: 600; }
.kids-size select { min-height: 50px; padding: 12px 14px; border: 1px solid rgba(213,170,77,.38); background: #090807; color: var(--ivory); font: inherit; }
.kids-try { width: 100%; cursor: pointer; }
.kids-privacy { margin: 0; color: #8f887d; font-size: .78rem; line-height: 1.5; }
.kids-preview { padding: clamp(18px,3vw,30px); border: 1px solid var(--line); background: #090807; }
.preview-labels, .preview-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.preview-labels { margin-bottom: 10px; color: var(--gold-light); text-transform: uppercase; letter-spacing: .13em; font-size: .72rem; font-weight: 700; }
.preview-grid figure { position: relative; margin: 0; min-width: 0; overflow: hidden; border: 1px solid var(--line); background: #eee9df; }
.preview-grid img { width: 100%; aspect-ratio: 4/5; display: block; object-fit: cover; object-position: top center; }
.preview-grid figcaption { min-height: 48px; padding: 12px; display: grid; place-items: center; color: #2c2924; background: #f1ece2; text-align: center; font-size: .82rem; font-weight: 700; }
.after-frame #look-swatch { position: absolute; top: 12px; right: 12px; width: 26px; height: 26px; border: 2px solid #fff; border-radius: 50%; background: #e9ddc7; box-shadow: 0 2px 12px rgba(0,0,0,.35); }
.kids-status { margin: 18px 0; color: var(--muted); }
.kids-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.kids-actions .button:last-child { grid-column: 1 / -1; }
.kids-actions .button { min-height: 48px; padding: 11px 14px; text-align: center; cursor: pointer; }
.section-intro { max-width: 620px; color: var(--muted); font-size: 1.05rem; }
.collection-grid { display: grid; grid-template-columns: repeat(6,1fr); gap: 14px; }
.collection-card {
  position: relative; min-height: 270px; padding: 28px; overflow: hidden;
  display: flex; flex-direction: column; justify-content: flex-end;
  text-decoration: none; border: 1px solid var(--line);
  background: linear-gradient(145deg, #191713, #0e0d0b 68%);
  transition: transform .25s ease, border-color .25s ease;
}
.collection-card:nth-child(1), .collection-card:nth-child(2) { grid-column: span 3; }
.collection-card:nth-child(n+3) { grid-column: span 2; }
.collection-card::before {
  content: ""; position: absolute; width: 190px; height: 190px; right: -70px; top: -70px;
  border: 1px solid rgba(241,213,141,.16); border-radius: 50%;
}
.collection-card:hover { transform: translateY(-4px); border-color: var(--gold); }
.collection-kicker { position: absolute; top: 22px; left: 26px; color: var(--gold); font-size: .75rem; letter-spacing: .18em; }
.collection-card h3 { margin: 0 0 8px; font-size: clamp(2rem,4vw,3rem); }
.collection-card p { margin: 0 0 20px; color: var(--muted); }
.collection-card > span:last-child { color: var(--gold-light); font-weight: 700; font-size: .9rem; }
.featured { padding: 0 clamp(20px,6vw,90px) clamp(90px,11vw,150px); }
.featured-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 42px; }
.featured-heading h2 { margin-bottom: 0; }
.text-link { color: var(--gold-light); text-decoration: none; font-weight: 700; white-space: nowrap; padding-bottom: 8px; }
.product-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
.product-card { background: #11100e; border: 1px solid var(--line); overflow: hidden; }
.product-image { display: block; aspect-ratio: 4/5; overflow: hidden; background: #ebe7df; }
.product-image img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .4s ease; }
.product-card:hover .product-image img { transform: scale(1.035); }
.product-copy { padding: 22px; }
.product-type { margin: 0 0 8px; color: var(--gold-light); text-transform: uppercase; letter-spacing: .15em; font-size: .75rem; font-weight: 700; }
.product-copy h3 { min-height: 3.2rem; margin-bottom: 24px; font: 600 1.15rem/1.4 "DM Sans",sans-serif; }
.product-copy > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.product-copy strong { font-size: .92rem; }
.product-copy a { color: var(--gold-light); text-decoration: none; font-weight: 700; font-size: .9rem; }
.new-arrivals { padding: 0 clamp(20px,6vw,90px) clamp(90px,11vw,150px); }
.men-arrivals { padding-top: clamp(20px,3vw,45px); }
.kids-arrivals { padding-top: clamp(20px,3vw,45px); }
.home-arrivals { padding-top: clamp(20px,3vw,45px); }
.pet-arrivals { padding-top: clamp(20px,3vw,45px); }
.auto-arrivals { padding-top: clamp(20px,3vw,45px); }
.shoes-arrivals { padding-top: clamp(20px,3vw,45px); }
.sport-arrivals { padding-top: clamp(20px,3vw,45px); }
.arrival-note { max-width: 360px; margin: 0 0 8px; color: var(--muted); text-align: right; }
.arrival-grid { grid-template-columns: repeat(3,1fr); }
.coming-soon .product-image { position: relative; }
.status-badge {
  position: absolute; left: 16px; bottom: 16px; padding: 8px 12px;
  background: rgba(8,8,8,.9); border: 1px solid var(--gold);
  color: var(--gold-light); font-size: .75rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .08em;
}
.promise {
  margin: 0 clamp(20px,6vw,90px) clamp(90px,11vw,150px);
  display: grid; grid-template-columns: repeat(4,1fr); border-block: 1px solid var(--line);
}
.promise div { padding: 30px 24px; border-right: 1px solid var(--line); }
.promise div:last-child { border-right: 0; }
.promise strong, .promise span { display: block; }
.promise strong { color: var(--gold-light); margin-bottom: 5px; }
.promise span { color: var(--muted); font-size: .86rem; line-height: 1.45; }
.story { margin: 0 clamp(20px,6vw,90px); padding: clamp(60px,8vw,110px); display: grid; grid-template-columns: .8fr 1.2fr; gap: 8vw; align-items: center; background: radial-gradient(circle at 15% 45%, rgba(213,170,77,.22), transparent 34%), var(--panel); border: 1px solid var(--line); }
.monogram { color: transparent; -webkit-text-stroke: 1px rgba(241,213,141,.55); font: 700 clamp(9rem,22vw,20rem)/.8 "Playfair Display",serif; letter-spacing: -.12em; }
.story-copy p:not(.eyebrow):not(.signature) { max-width: 670px; color: var(--muted); font-size: 1.06rem; }
.signature { color: var(--gold-light); font-family: "Playfair Display",serif; font-style: italic; font-size: 1.25rem; }
.closing { padding: clamp(100px,14vw,190px) 20px; text-align: center; }
.closing h2 { max-width: 850px; margin: 0 auto 34px; }
footer { padding: 32px clamp(20px,6vw,90px); border-top: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; color: #807a70; font-size: .88rem; }
.whatsapp-float {
  position: fixed; right: 18px; bottom: calc(18px + env(safe-area-inset-bottom)); z-index: 30;
  min-height: 52px; padding: 13px 20px; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid #5ce986; border-radius: 999px; background: #25d366; color: #071a0e;
  box-shadow: 0 12px 34px rgba(0,0,0,.45); text-decoration: none; font-weight: 700;
}
.whatsapp-float:hover, .whatsapp-float:focus-visible { background: #5ce986; transform: translateY(-2px); }
@media (max-width: 820px) {
  body { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  .whatsapp-float { display: none; }
  .site-header { min-height: 68px; background: rgba(8,8,8,.94); }
  .menu-toggle, #navigation { display: none; }
  .app-nav {
    position: fixed; inset: auto 0 0; z-index: 60;
    display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 0;
    min-height: calc(64px + env(safe-area-inset-bottom)); padding: 5px 4px env(safe-area-inset-bottom);
    background: rgba(10,10,10,.97); border-top: 1px solid rgba(213,170,77,.35);
    box-shadow: 0 -10px 28px rgba(0,0,0,.45); backdrop-filter: blur(16px);
  }
  .app-nav-item {
    min-width: 0; padding: 4px 1px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
    color: #aaa398; text-decoration: none; font-size: clamp(.6rem,2.7vw,.72rem); font-weight: 600; line-height: 1.2;
    border: 0; background: transparent; font-family: inherit; cursor: pointer;
  }
  .app-nav-icon { height: 28px; display: grid; place-items: center; color: #d1c8b8; font-size: 1.35rem; line-height: 1; }
  .app-nav-item.active, .app-nav-item:focus-visible { color: var(--gold-light); }
  .app-nav-item.active .app-nav-icon { color: var(--gold-light); transform: translateY(-1px); }
  .hero { min-height: 780px; align-items: end; }
  .hero > img { object-position: 62% center; }
  .hero-shade { background: linear-gradient(0deg, var(--black) 0%, rgba(5,5,5,.92) 32%, rgba(5,5,5,.2) 78%), linear-gradient(90deg, rgba(5,5,5,.3), transparent); }
  .hero-content { width: auto; margin: 0; padding: 0 20px 70px; }
  h1 { font-size: clamp(3rem,15vw,4.8rem); }
  .cards { grid-template-columns: 1fr; }
  .feature-card { min-height: 320px; border-right: 0; border-bottom: 1px solid var(--line); }
  .feature-card:last-child { border-bottom: 0; }
  .story { grid-template-columns: 1fr; padding: 42px 24px; }
  .music-showcase { grid-template-columns: 1fr; }
  .kids-heading, .kids-experience { grid-template-columns: 1fr; }
  .artist-support { grid-template-columns: 1fr; }
  .track-list { columns: 1; }
  .creator-heading { display: block; }
  .creator-heading > p { margin-top: 16px; }
  .tool-tabs { grid-template-columns: 1fr 1fr; }
  .tool-tab:nth-child(2) { border-right: 0; }
  .tool-tab:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .tool-panel { grid-template-columns: 1fr; }
  .collection-grid { grid-template-columns: 1fr; }
  .collection-card:nth-child(n) { grid-column: auto; min-height: 235px; }
  .product-grid { grid-template-columns: 1fr 1fr; }
  .arrival-grid { grid-template-columns: repeat(3,1fr); }
  .promise { grid-template-columns: 1fr 1fr; }
  .promise div:nth-child(2) { border-right: 0; }
  .promise div { border-bottom: 1px solid var(--line); }
  .promise div:nth-child(n+3) { border-bottom: 0; }
  .monogram { font-size: 9rem; }
  footer { flex-direction: column; align-items: flex-start; gap: 8px; }
}
@media (max-width: 480px) {
  .featured-heading { display: block; }
  .featured-heading .text-link { display: inline-block; margin-top: 16px; }
  .product-grid { grid-template-columns: 1fr; }
  .arrival-grid { grid-template-columns: 1fr; }
  .arrival-note { margin-top: 16px; text-align: left; }
  .music-showcase { padding: 30px 20px; }
  .kids-studio { padding: 30px 18px; }
  .preview-grid { gap: 7px; }
  .kids-actions { grid-template-columns: 1fr; }
  .music-player { min-height: 220px; aspect-ratio: 16/12; }
  .tool-tabs { grid-template-columns: 1fr; }
  .tool-tab { border-right: 0; border-bottom: 1px solid var(--line); }
  .tool-tab:last-child { border-bottom: 0; }
  .tool-panel { padding: 22px 16px; }
  .song-plans { grid-template-columns: 1fr; }
  .product-image { aspect-ratio: 1/1; }
  .promise { grid-template-columns: 1fr; }
  .promise div { border-right: 0; border-bottom: 1px solid var(--line) !important; }
  .promise div:last-child { border-bottom: 0 !important; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; } }