:root {
  color-scheme: dark;
  --bg: #0c0305;
  --surface: #16080b;
  --surface-elevated: rgba(31, 8, 12, 0.74);
  --surface-soft: #211013;
  --text: #ffffff;
  --muted: #aa979a;
  --muted-strong: #d8c8ca;
  --line: rgba(255, 255, 255, 0.1);
  --line-strong: rgba(255, 255, 255, 0.17);
  --brand-red: #d91427;
  --brand-red-bright: #f02b3c;
  --brand-red-deep: #820714;
  --lime: var(--brand-red);
  --lime-ink: #ffffff;
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --shadow-soft: 0 1.5rem 4rem rgba(0, 0, 0, 0.2);
  --shadow-deep: 0 2rem 7rem rgba(0, 0, 0, 0.55);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", ui-sans-serif, system-ui, sans-serif;
  font-synthesis: none;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body { margin: 0; min-width: 20rem; overflow-x: hidden; background: var(--bg); color: var(--text); line-height: 1.5; }
/* Si la página está dentro de un frame, JavaScript no la revela. Es una defensa
   de respaldo para GitHub Pages, que no permite enviar frame-ancestors por header. */
html.frame-check-pending body { visibility: hidden; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; }

.container { width: min(100% - 3rem, 76rem); margin-inline: auto; }
.section { padding-block: clamp(6rem, 13vw, 10rem); }
.eyebrow { margin: 0 0 1rem; color: var(--muted-strong); font-size: .69rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.ambient { position: fixed; z-index: -1; width: 42rem; height: 42rem; border-radius: 50%; filter: blur(6rem); opacity: .18; pointer-events: none; }
.ambient-one { top: -22rem; right: -19rem; background: var(--brand-red); }
.ambient-two { top: 41rem; left: -28rem; background: #b30b1d; opacity: .1; }

.site-loader { position: fixed; z-index: 20; inset: 0; display: grid; place-content: center; justify-items: center; gap: .5rem; background: #0c0305; color: var(--text); transition: opacity 520ms var(--ease-out), visibility 520ms step-end; }
.site-loader.is-leaving { opacity: 0; visibility: hidden; pointer-events: none; }
.site-loader p { margin: .7rem 0 0; font-size: 1.05rem; font-weight: 700; letter-spacing: -.04em; }
.site-loader small { color: var(--muted); font-size: .72rem; }
.loader-mark { width: 2.7rem; height: 2.7rem; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; animation: loader-spin 780ms linear infinite; }
.loader-mark span { width: .45rem; height: .45rem; border-radius: 50%; background: var(--lime); box-shadow: 0 0 .9rem var(--lime); }
@keyframes loader-spin { to { transform: rotate(360deg); } }

.site-header { position: sticky; z-index: 10; top: 0; padding: 1rem 0; }
.nav { min-height: 3.8rem; display: flex; align-items: center; justify-content: space-between; padding: .65rem .8rem .65rem 1rem; border: 1px solid rgba(255, 255, 255, .14); border-radius: 1.25rem; background: rgba(25, 4, 8, .72); box-shadow: 0 .5rem 2.5rem rgba(0, 0, 0, .18); backdrop-filter: blur(1.25rem) saturate(145%); -webkit-backdrop-filter: blur(1.25rem) saturate(145%); }
.brand { display: inline-flex; align-items: center; white-space: nowrap; }
.brand-logo { width: 5.6rem; height: 2.55rem; display: block; border: 1px solid rgba(255,255,255,.14); border-radius: .62rem; object-fit: cover; object-position: center; box-shadow: 0 .45rem 1.1rem rgba(106,0,13,.24); }
.nav-links { display: flex; align-items: center; gap: 1.5rem; color: var(--muted-strong); font-size: .8rem; font-weight: 500; }
.nav-links > a:not(.nav-cta), .nav-text-button { transition: color 160ms ease; }
.nav-text-button { padding: 0; border: 0; background: none; color: inherit; cursor: pointer; }
.nav-cta { display: inline-flex; align-items: center; gap: .55rem; padding: .65rem .85rem; border-radius: .8rem; background: var(--brand-red); color: #fff; font-weight: 700; transition: transform 160ms var(--ease-out), background-color 160ms ease; }
.nav-toggle { display: none; width: 2.6rem; height: 2.6rem; padding: .6rem; border: 1px solid var(--line); border-radius: .75rem; background: transparent; cursor: pointer; }
.nav-toggle span { display: block; width: 100%; height: 1px; margin-block: .28rem; background: var(--text); transition: transform 180ms var(--ease-out); }

.hero { min-height: min(51rem, calc(100vh - 5rem)); display: grid; grid-template-columns: 1.08fr .92fr; align-items: center; gap: clamp(2rem, 6vw, 6.5rem); padding-block: clamp(5rem, 10vw, 8.5rem) 6rem; }
.hero-copy { position: relative; z-index: 1; }
.hero h1, h2, h3, p { text-wrap: balance; }
.hero h1 { max-width: 45rem; margin: 0; font-size: clamp(3.5rem, 7.2vw, 6.8rem); font-weight: 700; letter-spacing: -.075em; line-height: .94; }
.hero h1 span, .statement h2 span, .final-cta h2 span { color: #7f8088; }
.hero-description { max-width: 30rem; margin: 1.9rem 0 0; color: var(--muted-strong); font-size: clamp(1rem, 1.4vw, 1.14rem); line-height: 1.6; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; margin-top: 2.25rem; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: .8rem; min-height: 3.3rem; padding: .95rem 1.2rem; border: 1px solid transparent; border-radius: 1rem; font-size: .82rem; font-weight: 700; letter-spacing: -.01em; cursor: pointer; transition: transform 160ms var(--ease-out), color 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease; }
.button:active, .nav-cta:active { scale: .97; }
.button-primary { background: var(--brand-red); color: var(--lime-ink); box-shadow: 0 .8rem 2.3rem rgba(217, 20, 39, .22); }
.button-primary:hover { background: var(--brand-red-bright); box-shadow: 0 1rem 2.8rem rgba(217, 20, 39, .38); }
.button-arrow { font-size: 1.05rem; transition: transform 160ms var(--ease-out); }
.button-quiet { padding-inline: .3rem; background: transparent; color: var(--text); }
.button-quiet span { color: var(--lime); font-size: 1rem; transition: transform 160ms var(--ease-out); }
.button-light { margin-top: 1.5rem; background: var(--text); color: #09090a; }
.button-light:hover { background: #fff; box-shadow: 0 .9rem 2.5rem rgba(0, 0, 0, .24); }
.trust-list { display: flex; flex-wrap: wrap; gap: 1.35rem 2rem; margin: 4rem 0 0; }
.trust-list div { min-width: 6.9rem; }
.trust-list dt { font-size: .95rem; font-weight: 700; letter-spacing: -.03em; }
.trust-list dd { margin: .1rem 0 0; color: var(--muted); font-size: .68rem; }
.hero-reveal { opacity: 0; transform: translateY(1rem); animation: hero-reveal 620ms var(--ease-out) var(--delay) forwards; }
.hero-reveal--eyebrow { --delay: 110ms; }
.hero-reveal--title { --delay: 180ms; }
.hero-reveal--description { --delay: 250ms; }
.hero-reveal--actions { --delay: 320ms; }
.hero-reveal--trust { --delay: 390ms; }
@keyframes hero-reveal { to { opacity: 1; transform: translateY(0); } }

.hero-device { position: relative; min-height: 31rem; display: grid; place-items: center; isolation: isolate; }
.device-aura { position: absolute; inset: 11% 5% 9%; z-index: -1; border-radius: 50%; background: radial-gradient(circle, rgba(217, 20, 39, .3), rgba(130, 7, 20, .16) 42%, transparent 70%); filter: blur(1rem); }
.phone { position: relative; overflow: hidden; border: .42rem solid #2e2e33; border-radius: 2.85rem; background: #1d1d21; box-shadow: inset 0 0 0 1px rgba(255,255,255,.14), 1.4rem 2rem 3rem rgba(0,0,0,.42); }
.phone::after { content: ""; position: absolute; z-index: 3; inset: .05rem; border-radius: inherit; border: 1px solid rgba(255,255,255,.13); pointer-events: none; }
.phone-hero { width: clamp(14rem, 22vw, 18.5rem); aspect-ratio: .49; transform: rotate(8deg); }
.phone-screen { position: absolute; inset: 0; overflow: hidden; border-radius: 2.38rem; background: radial-gradient(circle at 75% 12%, #f13b49 0, transparent 25%), radial-gradient(circle at 15% 90%, #850714 0, transparent 39%), linear-gradient(144deg, #31040a 0%, #120306 46%, #620713 100%); }
.dynamic-island { position: absolute; z-index: 2; top: .65rem; left: 50%; width: 34%; height: .85rem; border-radius: 2rem; background: #060607; transform: translateX(-50%); }
.screen-glow { position: absolute; inset: 0; background: linear-gradient(122deg, rgba(255,255,255,.3), transparent 18% 70%, rgba(255,255,255,.13)); mix-blend-mode: overlay; }
.screen-orb { position: absolute; border-radius: 50%; filter: blur(.4rem); }
.screen-orb-one { width: 65%; aspect-ratio: 1; top: 18%; right: -23%; background: rgba(246, 67, 80, .72); }
.screen-orb-two { width: 70%; aspect-ratio: 1; bottom: -24%; left: -25%; background: rgba(123, 7, 23, .82); }
.screen-orb-three { width: 125%; aspect-ratio: 1; top: 30%; left: -35%; background: linear-gradient(135deg, #f24351, #a1071a 58%, #4a030c); }
.phone-screen p { position: absolute; bottom: 1.4rem; left: 1.25rem; margin: 0; color: rgba(255,255,255,.8); font-size: .63rem; font-weight: 600; letter-spacing: -.03em; }
.phone-side-button { position: absolute; left: -.54rem; width: .2rem; border-radius: .2rem 0 0 .2rem; background: #45454b; }
.phone-side-button-one { top: 20%; height: 10%; }.phone-side-button-two { top: 34%; height: 18%; }
.glass-panel { border: 1px solid rgba(255,255,255,.13); background: rgba(24,24,28,.64); box-shadow: var(--shadow-soft); backdrop-filter: blur(1.2rem) saturate(130%); -webkit-backdrop-filter: blur(1.2rem) saturate(130%); }
.hero-caption { position: absolute; right: -2%; bottom: 5%; display: grid; grid-template-columns: auto 1fr; column-gap: .5rem; padding: .9rem 1.05rem; border-radius: 1rem; color: var(--muted-strong); font-size: .68rem; }
.hero-caption strong { grid-column: 1 / -1; margin-top: .2rem; color: var(--text); font-size: .75rem; letter-spacing: -.02em; }
.availability-dot { width: .45rem; height: .45rem; align-self: center; border-radius: 50%; background: var(--lime); box-shadow: 0 0 .8rem rgba(217,20,39,.75); }

/* Portada iPhone 17 Pro Max: una pieza de producto con profundidad, no un fondo decorativo. */
.hero-device--17 { min-height: clamp(32rem, 49vw, 43.5rem); isolation: isolate; animation: hero-device-arrival 820ms var(--ease-out) 210ms both; }
.hero-device-scroll-layer { width: 100%; height: 100%; }
.hero-device-stage { position: relative; width: 100%; height: 100%; display: grid; place-items: center; transform-style: preserve-3d; transition: transform 260ms var(--ease-out); }
.hero-device-halo { position: absolute; z-index: -1; width: min(32rem, 90%); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(190, 25, 41, .3), rgba(105, 8, 20, .12) 39%, transparent 69%); filter: blur(1.25rem); transform: translate3d(8%, 3%, 0); }
.hero-product-image { position: relative; z-index: 1; display: block; width: auto; max-width: none; height: clamp(31rem, 51vw, 45rem); filter: drop-shadow(1.3rem 2.2rem 2.6rem rgba(0, 0, 0, .48)); pointer-events: none; transform: translate3d(4%, 0, 0) rotate(1.35deg); transition: transform 260ms var(--ease-out); }
.hero-caption--17 { z-index: 3; right: auto; bottom: 7%; left: -2%; min-width: 11.6rem; grid-template-columns: auto 1fr; row-gap: .05rem; border-color: rgba(255,255,255,.17); background: rgba(22, 8, 11, .58); }
.hero-caption--17 strong { font-size: .82rem; }
.hero-caption--17 small { grid-column: 1 / -1; color: var(--muted); font-size: .63rem; }
@keyframes hero-device-arrival { from { opacity: 0; transform: translate3d(1.65rem, 1.4rem, 0) scale(.965); } to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); } }
@keyframes hero-device-reduced-arrival { from { opacity: 0; } to { opacity: 1; } }

/* Coreografía de scroll: entradas únicas por sección, siempre mediante opacity y transform. */
.statement, .catalog, .stores, .final-cta { position: relative; }
.scroll-scenes-ready .statement::after { content: ""; position: absolute; top: 0; right: 0; width: clamp(6rem, 16vw, 14rem); height: 1px; background: linear-gradient(90deg, transparent, var(--brand-red)); transform: scaleX(.12); transform-origin: right; opacity: .25; transition: transform 620ms var(--ease-out), opacity 440ms var(--ease-out); }
.scroll-scenes-ready .statement.is-scroll-active::after { transform: scaleX(1); opacity: .9; }
.scroll-scenes-ready .statement h2, .scroll-scenes-ready .statement > p:last-child { opacity: .01; transform: translate3d(0, 1.2rem, 0); transition: transform 560ms var(--ease-out), opacity 420ms var(--ease-out); }
.scroll-scenes-ready .statement > p:last-child { transition-delay: 90ms; }
.scroll-scenes-ready .statement.is-scroll-active h2, .scroll-scenes-ready .statement.is-scroll-active > p:last-child { opacity: 1; transform: translate3d(0, 0, 0); }
.scroll-scenes-ready .catalog::before { content: ""; position: absolute; top: clamp(3rem, 7vw, 6rem); left: 0; width: clamp(10rem, 28vw, 23rem); height: 1px; background: linear-gradient(90deg, var(--brand-red), transparent); opacity: 0; transform: translate3d(-42%, 0, 0); transition: transform 640ms var(--ease-out), opacity 420ms var(--ease-out); }
.scroll-scenes-ready .catalog.is-scroll-active::before { opacity: .82; transform: translate3d(0, 0, 0); }
.scroll-scenes-ready .catalog-gift > div { opacity: .01; transform: translate3d(-1.1rem, 0, 0); transition: transform 540ms var(--ease-out), opacity 400ms var(--ease-out); }
.scroll-scenes-ready .catalog.is-scroll-active .catalog-gift > div { opacity: 1; transform: translate3d(0, 0, 0); }
.scroll-scenes-ready .catalog-gift-list li { opacity: .01; transform: translate3d(0, .45rem, 0); transition: transform 440ms var(--ease-out), opacity 360ms var(--ease-out); }
.scroll-scenes-ready .catalog.is-scroll-active .catalog-gift-list li { opacity: 1; transform: translate3d(0, 0, 0); }
.scroll-scenes-ready .catalog.is-scroll-active .catalog-gift-list li:nth-child(2) { transition-delay: 55ms; }.scroll-scenes-ready .catalog.is-scroll-active .catalog-gift-list li:nth-child(3) { transition-delay: 105ms; }.scroll-scenes-ready .catalog.is-scroll-active .catalog-gift-list li:nth-child(4) { transition-delay: 155ms; }.scroll-scenes-ready .catalog.is-scroll-active .catalog-gift-list li:nth-child(5) { transition-delay: 205ms; }
.scroll-scenes-ready .product-card .product-visual::before { transform: scale(.9); transition: transform 520ms var(--ease-out); }
.scroll-scenes-ready .product-card.is-revealed .product-visual::before { transform: scale(1); }
.scroll-scenes-ready .trade-in-banner::after { transform: translate3d(3.5rem, 2.4rem, 0) scale(.9); transition: transform 620ms var(--ease-out); }
.scroll-scenes-ready .trade-in-banner.is-scroll-active::after { transform: translate3d(0, 0, 0) scale(1); }
.scroll-scenes-ready .trade-in-orbit::before { transform: scale(.84) rotate(-9deg); transition: transform 600ms var(--ease-out); }
.scroll-scenes-ready .trade-in-banner.is-scroll-active .trade-in-orbit::before { transform: scale(1) rotate(0); }
.scroll-scenes-ready .phone-trade-back { opacity: .01; transform: translate3d(-1.25rem, .85rem, 0) rotate(-21deg); transition: transform 620ms var(--ease-out), opacity 380ms var(--ease-out); }
.scroll-scenes-ready .phone-trade-front { opacity: .01; transform: translate3d(1.15rem, -.8rem, 0) rotate(19deg); transition: transform 620ms var(--ease-out) 70ms, opacity 380ms var(--ease-out) 70ms; }
.scroll-scenes-ready .trade-in-banner.is-scroll-active .phone-trade-back { opacity: 1; transform: translate3d(0, 0, 0) rotate(-15deg); }
.scroll-scenes-ready .trade-in-banner.is-scroll-active .phone-trade-front { opacity: 1; transform: translate3d(0, 0, 0) rotate(13deg); }
.scroll-scenes-ready .trade-symbol { opacity: .01; transform: scale(.78); transition: transform 480ms var(--ease-out) 100ms, opacity 350ms var(--ease-out) 100ms; }
.scroll-scenes-ready .trade-in-banner.is-scroll-active .trade-symbol { opacity: 1; transform: scale(1); }
.scroll-scenes-ready .store-card .store-map::before { transform: scale(.78); transition: transform 520ms var(--ease-out); }
.scroll-scenes-ready .store-card.is-revealed .store-map::before { transform: scale(1); }
.scroll-scenes-ready .store-card .store-map i { opacity: .01; transform: scale(.35); transition: transform 380ms var(--ease-out), opacity 280ms var(--ease-out); }
.scroll-scenes-ready .store-card.is-revealed .store-map i { opacity: 1; transform: scale(1); }
.scroll-scenes-ready .store-card.is-revealed .store-map i:nth-child(2) { transition-delay: 70ms; }.scroll-scenes-ready .store-card.is-revealed .store-map i:nth-child(3) { transition-delay: 130ms; }
.scroll-scenes-ready .store-card.is-revealed .store-map b { animation: store-pin-settle 540ms var(--ease-out) both; }
.scroll-scenes-ready .final-cta::before { content: ""; position: absolute; top: clamp(2rem, 4vw, 4.5rem); left: 50%; width: clamp(4rem, 9vw, 7rem); height: 1px; background: var(--brand-red); opacity: 0; transform: translate3d(-50%, 0, 0) scaleX(.2); transition: transform 520ms var(--ease-out), opacity 400ms var(--ease-out); }
.scroll-scenes-ready .final-cta.is-scroll-active::before { opacity: .9; transform: translate3d(-50%, 0, 0) scaleX(1); }
.scroll-scenes-ready .final-cta h2, .scroll-scenes-ready .final-cta .button { opacity: .01; transform: translate3d(0, 1.1rem, 0); transition: transform 560ms var(--ease-out), opacity 420ms var(--ease-out); }
.scroll-scenes-ready .final-cta .button { transition-delay: 90ms; }
.scroll-scenes-ready .final-cta.is-scroll-active h2, .scroll-scenes-ready .final-cta.is-scroll-active .button { opacity: 1; transform: translate3d(0, 0, 0); }
@keyframes store-pin-settle { from { opacity: 0; transform: translate3d(0, -.7rem, 0) rotate(-45deg) scale(.82); } to { opacity: 1; transform: translate3d(0, 0, 0) rotate(-45deg) scale(1); } }

.statement { display: grid; grid-template-columns: 1.05fr .75fr; gap: 2rem; align-items: end; border-top: 1px solid var(--line); }
.statement .eyebrow { grid-column: 1 / -1; }
.statement h2, .section-heading h2, .trade-in-banner h2, .final-cta h2 { margin: 0; font-size: clamp(2.4rem, 5vw, 4.5rem); font-weight: 650; letter-spacing: -.065em; line-height: .99; }
.statement > p:last-child { max-width: 25rem; margin: 0 0 .35rem; color: var(--muted-strong); font-size: 1rem; line-height: 1.65; }

.catalog { overflow: hidden; padding-block: clamp(5rem, 10vw, 8.5rem); background: #110407; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2.8rem; }
.section-heading .eyebrow { margin-bottom: .8rem; }
.text-link, .store-card a { display: inline-flex; align-items: center; gap: .55rem; color: var(--muted-strong); font-size: .8rem; font-weight: 600; transition: color 160ms ease; }
.text-link span, .store-card a span { color: var(--lime); font-size: 1rem; transition: transform 160ms var(--ease-out); }
.catalog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.product-card { position: relative; min-height: 31rem; display: flex; flex-direction: column; overflow: hidden; padding: 1.35rem; border: 1px solid var(--line); border-radius: 1.5rem; background: linear-gradient(160deg, #26090e, #140507); transition: transform 240ms var(--ease-out), border-color 180ms ease, box-shadow 240ms var(--ease-out); }
.product-card-top { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; }
.product-card h3 { margin: 0; font-size: 1.18rem; letter-spacing: -.045em; }
.product-card p { margin: .25rem 0 0; color: var(--muted); font-size: .74rem; }
.product-tag { display: inline-block; padding: .35rem .5rem; border: 1px solid var(--line); border-radius: .55rem; color: var(--muted-strong); font-size: .59rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.product-visual { position: relative; z-index: 0; flex: 1; min-height: 17rem; display: grid; place-items: center; margin-block: 1rem; overflow: hidden; border-radius: 1rem; background: radial-gradient(circle at 50% 60%, var(--product-glow), transparent 58%), #23090d; }
.product-visual::before { content: ""; position: absolute; width: 72%; aspect-ratio: 1; border-radius: 50%; background: var(--product-aura); filter: blur(2rem); opacity: .72; }
.product-image { position: relative; z-index: 1; width: 100%; height: 100%; min-height: 17rem; object-fit: contain; padding: .75rem; filter: drop-shadow(0 1.1rem 1.3rem rgba(0,0,0,.25)); transition: transform 300ms var(--ease-out); }
.product-footer { display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.product-price { display: grid; gap: .12rem; color: var(--text); font-size: .83rem; font-weight: 700; letter-spacing: -.025em; }.product-price small { color: var(--muted); font-size: .61rem; font-weight: 500; letter-spacing: 0; }
.product-select { display: inline-flex; align-items: center; gap: .3rem; padding: .45rem 0; border: 0; background: transparent; color: var(--text); font-size: .74rem; font-weight: 700; cursor: pointer; }
.product-select span { color: var(--lime); font-size: 1rem; transition: transform 160ms var(--ease-out); }
.product-skeleton { min-height: 31rem; overflow: hidden; padding: 1.35rem; border: 1px solid var(--line); border-radius: 1.5rem; background: #17171b; }
.product-skeleton div, .product-skeleton span { display: block; border-radius: .5rem; background: linear-gradient(100deg, #202025 25%, #2a2a30 39%, #202025 55%); background-size: 250% 100%; animation: skeleton-shimmer 1.4s linear infinite; }
.product-skeleton div { height: 65%; margin-bottom: 1.3rem; }.product-skeleton span { height: .8rem; width: 56%; margin-top: .7rem; }.product-skeleton span:last-child { width: 32%; }
@keyframes skeleton-shimmer { to { background-position: -250% 0; } }
.catalog-status { display: flex; justify-content: center; align-items: center; gap: .5rem; min-height: 1.4rem; margin: 1.25rem 0 0; color: var(--muted); font-size: .72rem; text-align: center; }
.status-spinner { width: .7rem; height: .7rem; border: 1px solid rgba(255,255,255,.18); border-top-color: var(--lime); border-radius: 50%; animation: loader-spin 700ms linear infinite; }
.catalog-status.is-ready { color: #9d9da6; }.catalog-status.is-ready .status-spinner { display: none; }

.trade-in-banner { position: relative; display: grid; grid-template-columns: 1fr .85fr; gap: 2rem; overflow: hidden; min-height: 30rem; margin-top: clamp(5rem, 10vw, 8.5rem); padding: clamp(2rem, 6vw, 5rem); border-radius: 1.8rem; background: linear-gradient(128deg, #f03a49 0%, #cf1025 53%, #850714 100%); color: #fff; isolation: isolate; }
.trade-in-banner::after { content: ""; position: absolute; inset: auto -10rem -16rem auto; z-index: -1; width: 36rem; height: 36rem; border-radius: 50%; background: rgba(255,255,255,.26); filter: blur(1rem); }
.trade-in-banner .eyebrow { color: rgba(255,255,255,.76); }.trade-in-banner h2 { max-width: 32rem; }.trade-in-banner p:not(.eyebrow) { max-width: 27rem; margin: 1.35rem 0 0; color: rgba(255,255,255,.82); font-size: .96rem; line-height: 1.65; }
.trade-in-orbit { position: relative; min-height: 20rem; display: grid; place-items: center; }
.trade-in-orbit::before { content: ""; position: absolute; width: 17rem; height: 17rem; border: 1px solid rgba(13,17,8,.18); border-radius: 50%; }
.phone-trade-back, .phone-trade-front { position: absolute; width: 9.3rem; aspect-ratio: .49; }
.phone-trade-back { top: 8%; left: 8%; border-color: #838383; background: linear-gradient(150deg,#f0f0f0,#77777b); transform: rotate(-15deg); }.phone-trade-front { right: 4%; bottom: 7%; border-color: #3c3c42; transform: rotate(13deg); }.phone-trade-front .phone-screen { border-radius: 2.05rem; background: linear-gradient(145deg, #2a0308, #a7071a 45%, #f44956); }
.camera-cluster { position: absolute; top: .75rem; left: .75rem; display: grid; grid-template-columns: repeat(2, 1.5rem); gap: .35rem; padding: .3rem; border-radius: 1.3rem; background: rgba(0,0,0,.18); }.camera-cluster i { width: 1.4rem; aspect-ratio: 1; border: .18rem solid #333; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #777, #101011 59%); }.camera-cluster i:last-child { grid-column: 1; }
.trade-symbol { position: relative; z-index: 2; width: 2.5rem; height: 2.5rem; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.36); border-radius: 50%; background: rgba(255,255,255,.2); font-size: 1.5rem; }

.stores { padding-top: clamp(7rem, 13vw, 11rem); }.section-side-copy { max-width: 16rem; margin: 0; color: var(--muted); font-size: .84rem; line-height: 1.6; }.store-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }.store-card { overflow: hidden; border: 1px solid var(--line); border-radius: 1.5rem; background: var(--surface); }.store-card-top { display: flex; justify-content: space-between; padding: 1.2rem 1.3rem; color: var(--muted); font-size: .68rem; font-weight: 600; }.store-radius { color: var(--muted-strong); }.store-map { position: relative; height: 17rem; overflow: hidden; background-color: #15151a; background-image: linear-gradient(35deg, transparent 47%, rgba(255,255,255,.07) 48% 49%, transparent 50%), linear-gradient(125deg, transparent 46%, rgba(255,255,255,.05) 47% 48%, transparent 49%), linear-gradient(0deg, transparent 46%, rgba(255,255,255,.05) 47% 48%, transparent 49%); background-size: 4.5rem 4.5rem, 6rem 6rem, 3.4rem 3.4rem; }.store-map::before { content: ""; position: absolute; inset: -20%; background: radial-gradient(circle at 52% 48%, rgba(212,255,69,.17), transparent 20%), radial-gradient(circle at 70% 62%, rgba(100,86,255,.16), transparent 28%); }.store-map i { position: absolute; width: .35rem; aspect-ratio: 1; border-radius: 50%; background: #64646d; }.store-map i:nth-child(1) { top: 28%; left: 25%; }.store-map i:nth-child(2) { top: 62%; left: 71%; }.store-map i:nth-child(3) { top: 76%; left: 40%; }.store-map b { position: absolute; top: 48%; left: 51%; width: 1rem; height: 1rem; border: .25rem solid var(--lime); border-radius: 50% 50% 50% 0; box-shadow: 0 0 0 .5rem rgba(212,255,69,.08); transform: rotate(-45deg); }.map-lorenzo b { top: 39%; left: 58%; }.store-card-body { padding: 1.4rem; }.store-card-body h3 { margin: 0; font-size: 1.6rem; letter-spacing: -.05em; }.store-card-body p { max-width: 27rem; margin: .5rem 0 0; color: var(--muted); font-size: .8rem; line-height: 1.6; }

.final-cta { text-align: center; }.final-cta h2 { max-width: 50rem; margin-inline: auto; }.final-cta .button { margin-top: 2.1rem; }.site-footer { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-block: 1.5rem 2.3rem; border-top: 1px solid var(--line); color: var(--muted); font-size: .67rem; }.site-footer p { margin: 0; }.social-links { display: flex; align-items: center; gap: 1rem; }.social-links a { display: inline-flex; align-items: center; gap: .3rem; color: var(--muted-strong); font-weight: 600; transition: color 160ms ease; }.social-links span { color: var(--lime); font-size: .9rem; transition: transform 160ms var(--ease-out); }

.modal { width: min(calc(100% - 2rem), 38rem); max-height: min(46rem, calc(100dvh - 2rem)); padding: 0; overflow: auto; border: 1px solid rgba(255,255,255,.14); border-radius: 1.55rem; background: rgba(22,22,26,.76); color: var(--text); box-shadow: var(--shadow-deep); opacity: 0; transform: scale(.96); transition: opacity 250ms var(--ease-out), transform 250ms var(--ease-out), filter 250ms var(--ease-out); backdrop-filter: blur(1.6rem) saturate(140%); -webkit-backdrop-filter: blur(1.6rem) saturate(140%); }.modal[open] { display: block; }.modal.is-open { opacity: 1; transform: scale(1); }.modal.is-closing { opacity: 0; transform: scale(.97); filter: blur(2px); }.modal::backdrop { background: rgba(0,0,0,.68); backdrop-filter: blur(.6rem); -webkit-backdrop-filter: blur(.6rem); }.modal-surface { position: relative; padding: clamp(1.65rem, 5vw, 2.6rem); }.modal h2 { max-width: 28rem; margin: 0; font-size: clamp(2rem, 5vw, 3rem); letter-spacing: -.06em; line-height: 1; }.modal-lead { margin: 1rem 0 0; color: var(--muted-strong); font-size: .9rem; line-height: 1.65; }.modal-close { position: absolute; top: 1rem; right: 1rem; width: 2.25rem; height: 2.25rem; display: grid; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: rgba(255,255,255,.06); color: var(--text); font-size: 1.4rem; line-height: 1; cursor: pointer; transition: transform 160ms var(--ease-out), background-color 160ms ease; }.modal-close:active { scale: .94; }.trade-steps { display: grid; gap: 1rem; margin: 1.8rem 0; padding: 0; list-style: none; }.trade-steps li { display: grid; grid-template-columns: 2rem 1fr; gap: .8rem; }.trade-steps span { width: 1.7rem; height: 1.7rem; display: grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; color: var(--lime); font-size: .6rem; font-weight: 700; }.trade-steps strong { font-size: .84rem; letter-spacing: -.02em; }.trade-steps p { margin: .12rem 0 0; color: var(--muted); font-size: .74rem; }.product-modal-layout { display: grid; grid-template-columns: .8fr 1fr; align-items: center; gap: 2rem; }.product-modal-visual { min-height: 18rem; display: grid; place-items: center; overflow: hidden; border-radius: 1.1rem; background: radial-gradient(circle, var(--product-glow, #555), transparent 60%), #17171b; }.product-modal-visual .product-phone { transform: rotate(9deg); }.modal-price { margin: 1.5rem 0; font-size: 1.1rem; font-weight: 700; letter-spacing: -.04em; }

[data-reveal] { opacity: 0; transform: translateY(1.25rem) scale(.985); transition: opacity 650ms var(--ease-out) var(--reveal-delay, 0ms), transform 650ms var(--ease-out) var(--reveal-delay, 0ms); }.is-revealed { opacity: 1; transform: translateY(0) scale(1); }
.reveal-delay-1 { --reveal-delay: 55ms; }
.reveal-delay-2 { --reveal-delay: 110ms; }

@media (hover: hover) and (pointer: fine) { .nav-links > a:not(.nav-cta):hover, .nav-text-button:hover, .text-link:hover, .social-links a:hover { color: var(--text); }.nav-cta:hover { transform: translateY(-2px); }.button-quiet:hover span, .text-link:hover span, .social-links a:hover span, .product-select:hover span { transform: translateX(3px); }.button-primary.magnetic:hover { box-shadow: 0 1.1rem 3.5rem rgba(198,255,45,.25); }.product-card:hover { transform: translateY(-.45rem); border-color: var(--line-strong); box-shadow: var(--shadow-soft); }.product-card:hover .product-image { transform: scale(1.035); }.hero-device--17:hover .hero-product-image { transform: translate3d(4%, -.2rem, 0) rotate(.85deg); }.modal-close:hover { background: rgba(255,255,255,.13); transform: rotate(90deg); } }

@media (max-width: 48rem) { .container { width: min(100% - 2rem, 76rem); }.site-header { padding-top: .75rem; }.nav { min-height: 3.5rem; padding: .45rem .55rem .45rem .8rem; border-radius: 1rem; }.nav-toggle { display: block; }.nav-toggle[aria-expanded="true"] span:first-child { transform: translateY(.31rem) rotate(45deg); }.nav-toggle[aria-expanded="true"] span:last-child { transform: translateY(-.31rem) rotate(-45deg); }.nav-links { position: absolute; top: calc(100% + .5rem); right: 1rem; left: 1rem; display: grid; gap: .15rem; padding: .6rem; border: 1px solid var(--line); border-radius: 1rem; background: rgba(19,19,22,.94); box-shadow: var(--shadow-deep); opacity: 0; transform: translateY(-.5rem) scale(.98); pointer-events: none; transition: opacity 180ms var(--ease-out), transform 180ms var(--ease-out); backdrop-filter: blur(1.2rem); }.nav-links.is-open { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }.nav-links > a:not(.nav-cta), .nav-text-button { padding: .8rem; text-align: left; }.nav-cta { justify-content: space-between; margin-top: .25rem; }.hero { grid-template-columns: 1fr; min-height: auto; padding-top: 4.5rem; }.hero-device { min-height: 25rem; order: -1; }.hero-device--17 { min-height: min(36rem, 120vw); margin-top: -.5rem; }.hero-product-image { height: min(35rem, 115vw); }.hero-caption--17 { right: 4%; bottom: 4%; left: auto; }.phone-hero { width: 13.3rem; }.hero-caption { right: 5%; bottom: 2%; }.trust-list { margin-top: 3rem; }.statement { grid-template-columns: 1fr; gap: 1.2rem; }.section-heading { align-items: start; flex-direction: column; gap: 1rem; }.catalog-grid { grid-template-columns: 1fr; }.product-card, .product-skeleton { min-height: 26rem; }.product-visual, .product-image { min-height: 13rem; }.trade-in-banner { grid-template-columns: 1fr; min-height: 39rem; }.trade-in-orbit { min-height: 15rem; }.phone-trade-back { left: 15%; }.phone-trade-front { right: 12%; }.store-grid { grid-template-columns: 1fr; }.site-footer { flex-wrap: wrap; }.product-modal-layout { grid-template-columns: 1fr; gap: 1.5rem; }.product-modal-visual { min-height: 12rem; }.modal .button { width: 100%; } }
@media (max-width: 26rem) { .hero h1 { font-size: 3rem; }.hero-actions .button { width: 100%; }.trust-list { gap: 1rem; }.trade-in-banner { padding: 1.7rem; }.phone-trade-back, .phone-trade-front { width: 7.5rem; }.store-map { height: 13rem; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }.site-loader, .button, .nav-cta, .nav-links, .product-card, .product-phone, .modal, [data-reveal], .hero-reveal { animation: none !important; transition-duration: 1ms !important; }.hero-reveal, [data-reveal] { opacity: 1; transform: none; }.hero-device--17 { opacity: 0; transform: none; animation: hero-device-reduced-arrival 180ms ease-out 160ms both !important; transition: none !important; }.hero-device-stage, .hero-product-image { transition: none !important; }.loader-mark, .status-spinner, .product-skeleton div, .product-skeleton span { animation: none; }.site-loader.is-leaving { display: none; }.modal.is-open, .modal.is-closing { transform: none; }.product-card:hover { transform: none; } }
@media (prefers-reduced-transparency: reduce) { .nav, .glass-panel, .modal { background: #17171b; backdrop-filter: none; -webkit-backdrop-filter: none; } }
@media (prefers-contrast: more) { .nav, .product-card, .store-card, .modal { border-color: rgba(255,255,255,.45); }.eyebrow, .hero-description, .statement > p:last-child, .modal-lead { color: #e0e0e5; } }

/* iPhone Style — the logo's red, white and deep-shadow palette */
.store-map { background-color: #1d070b; }
.store-map::before { background: radial-gradient(circle at 52% 48%, rgba(217,20,39,.3), transparent 20%), radial-gradient(circle at 70% 62%, rgba(130,7,20,.28), transparent 28%); }
.store-map i { background: #80676b; }
.store-map b { box-shadow: 0 0 0 .5rem rgba(217,20,39,.16); }
.modal { border-color: rgba(255,255,255,.16); background: rgba(31,6,10,.8); }
.modal::backdrop { background: rgba(14,0,3,.72); }
.product-modal-visual { background: radial-gradient(circle, var(--product-glow, #7d101d), transparent 60%), #21080d; }
.button-primary.magnetic:hover { box-shadow: 0 1.1rem 3.5rem rgba(217,20,39,.38); }
.trade-in-banner .button-light { box-shadow: 0 .8rem 2.2rem rgba(76,0,9,.26); }
@media (max-width: 48rem) { .nav-links { background: rgba(25,4,8,.94); } }

/* Catálogo comercial: la información se agrupa por decisión de compra, no como una lista plana. */
.catalog-gift { display: grid; grid-template-columns: minmax(0, 1fr) minmax(18rem, .85fr); gap: clamp(1.25rem, 4vw, 3rem); align-items: center; margin: 0 0 clamp(4rem, 7vw, 6rem); padding: clamp(1.4rem, 4vw, 2.2rem); border: 1px solid rgba(255,255,255,.14); border-radius: 1.45rem; background: linear-gradient(118deg, rgba(217,20,39,.22), rgba(35,6,11,.78) 50%, rgba(255,255,255,.04)); box-shadow: var(--shadow-soft); }
.catalog-gift h3, .catalog-group-heading h3 { margin: 0; font-size: clamp(1.65rem, 3vw, 2.45rem); font-weight: 650; letter-spacing: -.055em; line-height: 1; }
.catalog-gift p:not(.eyebrow) { max-width: 35rem; margin: .85rem 0 0; color: var(--muted-strong); font-size: .86rem; line-height: 1.6; }
.catalog-gift-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; margin: 0; padding: 0; list-style: none; }
.catalog-gift-list li { display: flex; align-items: center; gap: .45rem; min-height: 2.4rem; padding: .55rem .7rem; border: 1px solid rgba(255,255,255,.11); border-radius: .75rem; background: rgba(255,255,255,.055); color: var(--muted-strong); font-size: .69rem; font-weight: 650; letter-spacing: -.015em; }
.catalog-gift-list li::before { content: "✓"; color: var(--brand-red-bright); font-size: .8rem; }
.catalog-gift-list li:last-child { grid-column: 1 / -1; }

.catalog-groups { display: grid; gap: clamp(5rem, 9vw, 8rem); }
.catalog-group { scroll-margin-top: 7rem; }
.catalog-group + .catalog-group { padding-top: clamp(4.5rem, 8vw, 7rem); border-top: 1px solid var(--line); }
.catalog-group-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; }
.catalog-group-heading > p { max-width: 25rem; margin: 0; color: var(--muted-strong); font-size: .84rem; line-height: 1.6; }
.catalog-group-heading .eyebrow { margin-bottom: .75rem; }

.product-card { min-height: 42rem; }
.product-visual { flex: 0 0 clamp(13rem, 17vw, 15rem); min-height: 0; }
.product-image { min-height: 0; }
.product-pricing { display: grid; gap: .8rem; }
.price-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .45rem; }
.price-tile, .installment-tile { min-width: 0; border: 1px solid rgba(255,255,255,.09); background: rgba(255,255,255,.045); font-variant-numeric: tabular-nums; }
.price-tile { display: grid; gap: .26rem; min-height: 4.25rem; padding: .65rem .55rem; border-radius: .8rem; }
.price-tile span, .installment-tile span { color: var(--muted); font-size: .56rem; font-weight: 700; letter-spacing: .055em; text-transform: uppercase; }
.price-tile strong { overflow: hidden; color: var(--text); font-size: clamp(.68rem, 1.3vw, .79rem); font-weight: 700; letter-spacing: -.035em; text-overflow: ellipsis; white-space: nowrap; }
.price-tile.is-usd { border-color: rgba(240,43,60,.34); background: rgba(217,20,39,.13); }
.price-tile.is-usd strong { color: #fff; }
.installment-heading { display: flex; justify-content: space-between; margin: .1rem 0 0; color: var(--muted-strong); font-size: .61rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
.installment-heading span { color: var(--muted); font-weight: 600; }
.installment-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .38rem; }
.installment-tile { display: grid; gap: .14rem; min-height: 4rem; padding: .52rem .35rem; border-radius: .68rem; text-align: center; }
.installment-tile strong { overflow: hidden; color: var(--text); font-size: clamp(.56rem, 1.1vw, .67rem); font-weight: 700; letter-spacing: -.04em; text-overflow: ellipsis; white-space: nowrap; }
.installment-tile small { color: var(--muted); font-size: .5rem; letter-spacing: -.01em; }
.product-footer { margin-top: 1rem; justify-content: stretch; }
.product-select { width: 100%; justify-content: space-between; padding: .72rem .78rem; border: 1px solid rgba(255,255,255,.13); border-radius: .78rem; background: rgba(255,255,255,.055); transition: transform 160ms var(--ease-out), color 160ms ease, background-color 160ms ease, border-color 160ms ease; }
.product-select:active { transform: scale(.98); }

.modal-payment-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .55rem; margin: 1.5rem 0; }
.modal-payment-grid .price-tile { min-height: 4.45rem; }
.modal-payment-grid .installment-tile { min-height: 4.2rem; }

@media (hover: hover) and (pointer: fine) { .product-select:hover { border-color: rgba(240,43,60,.45); background: rgba(217,20,39,.12); } }
@media (max-width: 48rem) { .catalog-gift { grid-template-columns: 1fr; }.catalog-gift-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }.catalog-group-heading { align-items: start; flex-direction: column; gap: .9rem; }.product-card { min-height: 0; }.product-visual { flex-basis: 13rem; }.installment-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }.modal-payment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 26rem) { .catalog-gift-list { grid-template-columns: 1fr; }.catalog-gift-list li:last-child { grid-column: auto; }.price-tile { padding-inline: .4rem; }.price-tile strong { font-size: .62rem; } }
.catalog-group .product-card[data-reveal] { transition-duration: 280ms; }

/* Compra y Plan Canje: dos acciones, una jerarquía clara. */
.modal-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; margin-top: 1.25rem; }
.modal-actions .button { width: 100%; padding-inline: .8rem; }
.button-secondary { border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.065); color: var(--text); }
.button-secondary:hover { border-color: rgba(240,43,60,.45); background: rgba(217,20,39,.12); }
.trade-in-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; margin-top: 1.6rem; }
.form-field { display: grid; gap: .42rem; min-width: 0; }
.form-field-wide { grid-column: 1 / -1; }
.form-field > span { color: var(--muted-strong); font-size: .69rem; font-weight: 700; letter-spacing: -.01em; }
.form-field em { color: var(--muted); font-style: normal; font-weight: 500; }
.form-field input, .form-field select, .form-field textarea { width: 100%; border: 1px solid rgba(255,255,255,.13); border-radius: .78rem; outline: 0; background: rgba(255,255,255,.055); color: var(--text); font: inherit; font-size: .79rem; line-height: 1.4; transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease; }
.form-field input, .form-field select { min-height: 2.9rem; padding: .72rem .78rem; }
.form-field textarea { min-height: 5.6rem; padding: .72rem .78rem; resize: vertical; }
.form-field select { color-scheme: dark; }
.form-field input::placeholder, .form-field textarea::placeholder { color: #8f767b; }
.form-field:focus-within input, .form-field:focus-within select, .form-field:focus-within textarea { border-color: rgba(240,43,60,.72); background: rgba(217,20,39,.08); box-shadow: 0 0 0 .22rem rgba(217,20,39,.12); }
.form-submit { grid-column: 1 / -1; width: 100%; margin-top: .25rem; }
@media (max-width: 48rem) { .modal-actions { grid-template-columns: 1fr; }.trade-in-form { grid-template-columns: 1fr; }.form-field-wide { grid-column: auto; } }

/* Fichas de producto: precio y decisión de compra visibles en una sola mirada. */
.catalog-gift { display: none; }
.catalog-grid { align-items: start; }
.product-card { min-height: 0; padding: 0; border-color: rgba(255,255,255,.12); border-radius: 1.45rem; background: #151518; box-shadow: 0 1.2rem 3.5rem rgba(0,0,0,.16); }
.product-card-top { order: 1; display: block; padding: 1.45rem 1.55rem 0; }
.product-card-top h3 { font-size: clamp(1.08rem, 1.65vw, 1.3rem); font-weight: 750; letter-spacing: -.055em; }
.product-card-top p { margin-top: .38rem; color: var(--muted); font-size: .72rem; }
.product-card .product-tag { display: none; }
.product-visual { order: 0; flex: none; min-height: 0; aspect-ratio: 4 / 5; margin: 0; border-radius: 0; background: #0d0d0f; }
.product-visual::before { display: none; }
.product-image { width: 100%; height: 100%; min-height: 100%; padding: 0; object-fit: contain; object-position: center; filter: none; }
.product-pricing { order: 2; gap: 0; padding: 1.3rem 1.55rem 0; }
.product-usd-price { margin: 0; color: var(--text); font-size: clamp(1.25rem, 2vw, 1.55rem); font-weight: 750; letter-spacing: -.06em; line-height: 1.08; }
.product-usd-price strong { color: #fff; }
.product-payment-copy { margin: .5rem 0 0; color: var(--muted-strong); font-size: .69rem; line-height: 1.45; }
.product-gift { display: grid; grid-template-columns: auto 1fr; gap: .65rem; align-items: start; margin-top: 1.15rem; padding: .85rem .9rem; border: 1px solid rgba(217,20,39,.5); border-radius: .9rem; background: linear-gradient(112deg, rgba(125,7,20,.33), rgba(69,9,16,.48)); }
.product-gift > span { padding-top: .05rem; font-size: .78rem; }
.product-gift p { margin: 0; color: #f1dfe1; font-size: .65rem; line-height: 1.48; }
.product-gift strong { display: block; margin-bottom: .1rem; color: #fff; font-size: .68rem; }
.installment-panel { margin-top: 1rem; padding: .9rem 1rem .65rem; border: 1px solid rgba(255,255,255,.11); border-radius: 1rem; background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.018)); }
.installment-panel .installment-heading { display: block; margin: 0 0 .55rem; color: #8e888d; font-size: .58rem; font-weight: 750; letter-spacing: .12em; text-align: center; }
.installment-rows { display: grid; }
.installment-row { display: flex; justify-content: space-between; gap: 1rem; padding: .43rem 0; border-top: 1px solid rgba(255,255,255,.075); color: var(--muted); font-size: .69rem; }
.installment-row:first-child { border-top: 0; }
.installment-row strong { color: var(--text); font-size: .71rem; font-variant-numeric: tabular-nums; letter-spacing: -.03em; }
.product-footer { order: 3; display: grid; gap: .62rem; margin: 1.15rem 0 0; padding: 0 1.55rem 1.55rem; border: 0; }
.product-buy, .product-trade-in { width: 100%; min-height: 3rem; display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: 1rem; font: inherit; font-size: .75rem; font-weight: 750; letter-spacing: -.02em; cursor: pointer; transition: transform 160ms var(--ease-out), background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease; }
.product-buy { background: linear-gradient(100deg, #fb4859, var(--brand-red)); color: #fff; box-shadow: 0 .65rem 1.35rem rgba(217,20,39,.22); }
.product-trade-in { border-color: rgba(255,255,255,.15); background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.035)); color: var(--text); }
.product-buy:active, .product-trade-in:active { transform: scale(.98); }
@media (hover: hover) and (pointer: fine) { .product-buy:hover { transform: translateY(-2px); box-shadow: 0 .85rem 1.65rem rgba(217,20,39,.34); }.product-trade-in:hover { border-color: rgba(240,43,60,.46); background: rgba(217,20,39,.1); }.product-card:hover .product-image { transform: scale(1.025); } }
@media (max-width: 48rem) { .product-visual { flex-basis: auto; aspect-ratio: 4 / 5; }.product-card-top, .product-pricing, .product-footer { padding-inline: 1.2rem; }.product-footer { padding-bottom: 1.2rem; } }

.product-image-main {
  position: relative !important;
  z-index: 1 !important;
  display: block;
  object-fit: cover !important;
  object-position: center !important;
}
.product-visual .product-image-main {
  width: 100%;
  height: 100%;
  min-height: 100%;
  padding: 0;
}
.modal-product .product-modal-visual .product-image-main {
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 0;
  object-fit: cover !important;
}

@media (hover: hover) and (pointer: fine) {
  .product-card:hover .product-visual .product-image {
    transform: none;
  }
}

/* La tarjeta abre una ficha de producto; las dos acciones de compra quedan fuera de esa zona. */
.product-detail-trigger {
  position: absolute;
  z-index: 2;
  inset: 0 0 8.25rem;
  padding: 0;
  border: 0;
  border-radius: 1.45rem 1.45rem 0 0;
  background: transparent;
  cursor: pointer;
}
.product-detail-trigger:focus-visible {
  outline: 2px solid #fb4859;
  outline-offset: -4px;
}
.product-footer {
  position: relative;
  z-index: 3;
}

/* Ficha visual: una sola imagen vertical y el beneficio principal, sin duplicar las acciones de compra. */
.modal-product {
  width: min(calc(100% - 2rem), 57.5rem);
  max-height: min(44rem, calc(100dvh - 2rem));
  overflow: hidden;
  background: linear-gradient(128deg, rgba(35, 35, 39, .96), rgba(16, 16, 18, .985) 52%);
}
.modal-product .modal-surface {
  padding: clamp(2rem, 7vw, 4.25rem);
}
.modal-product .product-modal-layout {
  grid-template-columns: minmax(17rem, 20rem) minmax(0, 1fr);
  min-height: min(35.5rem, calc(100dvh - 10.5rem));
  gap: clamp(2rem, 6vw, 5.75rem);
}
.modal-product .product-modal-visual {
  width: 100%;
  min-height: 0;
  aspect-ratio: 9 / 16;
  border-radius: 0;
  background: #0d0d0f;
}
.modal-product .product-modal-visual .product-image {
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 0;
  object-fit: contain;
  object-position: center;
}
.modal-product .eyebrow {
  margin-bottom: 1rem;
  color: #fb4859;
  font-size: .62rem;
  font-weight: 750;
  letter-spacing: .13em;
}
.modal-product h2 {
  max-width: 16rem;
  font-size: clamp(2rem, 4vw, 2.7rem);
  font-weight: 750;
  letter-spacing: -.065em;
}
.modal-product .modal-lead {
  max-width: 17rem;
  margin-top: 1.1rem;
  color: #afadb3;
  font-size: .84rem;
  line-height: 1.72;
}
.product-dialog-specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; margin: 1.4rem 0 0; }
.product-dialog-specs div { min-width: 0; padding: .65rem .72rem; border: 1px solid rgba(255,255,255,.1); border-radius: .7rem; background: rgba(255,255,255,.04); }
.product-dialog-specs dt { color: #a8a4aa; font-size: .56rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.product-dialog-specs dd { margin: .15rem 0 0; color: #f3f1f2; font-size: .69rem; font-weight: 600; overflow-wrap: anywhere; }

@media (hover: hover) and (pointer: fine) {
  .product-detail-trigger:hover { background: rgba(255,255,255,.015); }
}
@media (max-width: 48rem) {
  .product-detail-trigger { inset-bottom: 7.85rem; }
  .modal-product {
    width: min(calc(100% - 1rem), 31rem);
    max-height: calc(100dvh - 1rem);
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .modal-product .modal-surface { padding: 3.75rem 1.25rem 1.5rem; }
  .modal-product .product-modal-layout { grid-template-columns: 1fr; min-height: 0; gap: 1.25rem; }
  .modal-product .product-modal-visual { width: min(100%, 18rem); max-height: 30dvh; margin-inline: auto; }
  .modal-product h2, .modal-product .modal-lead { max-width: none; }
  .product-dialog-specs { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 1.1rem; }
  .product-dialog-specs div:last-child:nth-child(odd) { grid-column: 1 / -1; }
}

/* Las sucursales son accesos directos; el movimiento confirma que son clickeables. */
.store-card {
  display: block;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  transition: transform 180ms var(--ease-out), border-color 180ms ease, box-shadow 180ms ease;
}
.store-card:focus-visible {
  outline: 2px solid #fb4859;
  outline-offset: .3rem;
}
.store-card:active {
  transform: scale(.99);
}
@media (hover: hover) and (pointer: fine) {
  .store-card:hover {
    transform: translateY(-.35rem);
    border-color: rgba(240, 43, 60, .52);
    box-shadow: 0 1rem 2.4rem rgba(0, 0, 0, .22);
  }
}
@media (prefers-reduced-motion: reduce) {
  .store-card { transition: border-color 1ms ease, box-shadow 1ms ease; }
  .store-card:active { transform: none; }
}

/* Plan Canje: una escena original de intercambio, compuesta para iPhone Style. */
.trade-in-banner--exchange { display: grid; place-items: start center; min-height: clamp(31rem, 48vw, 39rem); padding: clamp(2rem, 5vw, 4rem); background: #f3f1ed; color: #171719; isolation: isolate; }
.trade-in-banner--exchange .trade-in-media { position: absolute; z-index: 0; inset: 0; overflow: hidden; }
.trade-in-banner--exchange .trade-in-media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform 320ms var(--ease-out); }
.trade-in-banner--exchange::after { content: ""; position: absolute; z-index: 1; inset: 0 auto 0 -35%; width: 34%; height: 100%; border-radius: 0; background: linear-gradient(105deg, transparent 12%, rgba(255,255,255,.5) 48%, transparent 85%); filter: none; opacity: 0; transform: translate3d(0, 0, 0) skewX(-12deg); pointer-events: none; }
.trade-in-banner--exchange .trade-in-copy { position: relative; z-index: 2; width: min(100%, 29rem); text-align: center; }
.trade-in-banner--exchange .eyebrow { color: #b80c1e; }
.trade-in-banner--exchange h2 { color: #19191b; }
.trade-in-banner--exchange p:not(.eyebrow) { margin-inline: auto; color: #505056; }
.trade-in-banner--exchange .button { margin-top: 1.65rem; }
.scroll-scenes-ready .trade-in-banner--exchange .trade-in-media { opacity: .01; transform: scale(1.055); transition: transform 760ms var(--ease-out), opacity 520ms var(--ease-out); }
.scroll-scenes-ready .trade-in-banner--exchange.is-scroll-active .trade-in-media { opacity: 1; transform: scale(1); }
.scroll-scenes-ready .trade-in-banner--exchange .trade-in-copy { opacity: .01; transform: translate3d(0, -1.15rem, 0); transition: transform 560ms var(--ease-out) 110ms, opacity 420ms var(--ease-out) 110ms; }
.scroll-scenes-ready .trade-in-banner--exchange.is-scroll-active .trade-in-copy { opacity: 1; transform: translate3d(0, 0, 0); }
.scroll-scenes-ready .trade-in-banner--exchange::after { opacity: .01; transition: transform 780ms var(--ease-out) 180ms, opacity 320ms var(--ease-out) 180ms; }
.scroll-scenes-ready .trade-in-banner--exchange.is-scroll-active::after { opacity: 1; transform: translate3d(420%, 0, 0) skewX(-12deg); }
@media (max-width: 48rem) {
  .trade-in-banner--exchange { min-height: 35rem; padding: 2rem 1.25rem; }
  .trade-in-banner--exchange .trade-in-media img { object-position: 50% 50%; }
  .trade-in-banner--exchange .trade-in-copy { margin-top: .65rem; }
}

/* El catálogo se divide por intención de compra sin alejar al visitante de la navegación principal. */
.nav-catalog { position: relative; }
.nav-catalog-trigger { display: inline-flex; align-items: center; gap: .38rem; padding: 0; border: 0; background: transparent; color: inherit; font-size: inherit; font-weight: inherit; cursor: pointer; transition: color 160ms ease, transform 140ms var(--ease-out); }
.nav-catalog-trigger svg { width: .72rem; height: .72rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.45; transition: transform 180ms var(--ease-out); }
.nav-catalog-trigger[aria-expanded="true"] { color: var(--text); }
.nav-catalog-trigger[aria-expanded="true"] svg { transform: rotate(180deg); }
.nav-catalog-trigger:active { transform: scale(.97); }
.nav-catalog-trigger:focus-visible, .catalog-nav-option:focus-visible { outline: 2px solid var(--brand-red-bright); outline-offset: .28rem; }

.catalog-nav-popover { position: absolute; z-index: 12; top: calc(100% + .9rem); left: 50%; display: grid; width: max-content; min-width: 14.75rem; padding: .42rem; border: 1px solid rgba(255,255,255,.14); border-radius: .95rem; background: rgba(29, 5, 10, .94); box-shadow: 0 1rem 2.6rem rgba(0,0,0,.28); opacity: 0; pointer-events: none; transform: translate3d(-50%, -.42rem, 0) scale(.96); transform-origin: top center; transition: opacity 180ms var(--ease-out), transform 180ms var(--ease-out), visibility 0s linear 180ms; visibility: hidden; backdrop-filter: blur(1.2rem) saturate(145%); -webkit-backdrop-filter: blur(1.2rem) saturate(145%); }
.nav-catalog.is-open .catalog-nav-popover { opacity: 1; pointer-events: auto; transform: translate3d(-50%, 0, 0) scale(1); transition-delay: 0s; visibility: visible; }
.nav-catalog.is-instant .catalog-nav-popover, .nav-catalog.is-instant .catalog-nav-popover * { transition-duration: 1ms !important; }
.catalog-nav-option { display: flex; align-items: center; justify-content: space-between; gap: 1.4rem; min-height: 3.25rem; padding: .66rem .72rem .66rem .82rem; border-radius: .65rem; color: var(--muted-strong); transition: color 150ms ease, background-color 150ms ease, transform 150ms var(--ease-out); }
.catalog-nav-option span { display: grid; gap: .08rem; }
.catalog-nav-option strong { color: var(--text); font-size: .75rem; font-weight: 700; letter-spacing: -.015em; }
.catalog-nav-option small { color: var(--muted); font-size: .62rem; line-height: 1.35; }
.catalog-nav-option i { width: .38rem; height: .38rem; border-radius: 50%; background: var(--brand-red-bright); box-shadow: 0 0 .7rem rgba(251,72,89,.52); }
.catalog-nav-option:nth-child(2) i { background: #eab1b7; box-shadow: none; }
.catalog-nav-option:nth-child(3) i { background: #9f2936; box-shadow: none; }

@media (hover: hover) and (pointer: fine) {
  .nav-catalog-trigger:hover { color: var(--text); }
  .catalog-nav-option:hover { background: rgba(255,255,255,.075); color: var(--text); transform: translateX(.16rem); }
}

@media (max-width: 48rem) {
  .nav-catalog { position: relative; }
  .nav-catalog-trigger { width: 100%; justify-content: space-between; padding: .8rem; text-align: left; }
  .catalog-nav-popover { top: calc(100% + .1rem); right: .2rem; left: .2rem; width: auto; min-width: 0; transform: translate3d(0, -.35rem, 0) scale(.98); transform-origin: top center; }
  .nav-catalog.is-open .catalog-nav-popover { transform: translate3d(0, 0, 0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .nav-catalog-trigger, .nav-catalog-trigger svg, .catalog-nav-popover, .catalog-nav-option { transition-duration: 1ms !important; }
  .catalog-nav-option:active { transform: none; }
}

/* Fotos reales de las sucursales: cada tarjeta funciona como una cita directa. */
.store-card {
  display: grid;
  grid-template-columns: minmax(12.75rem, .86fr) minmax(0, 1.14fr);
  min-height: clamp(23rem, 34vw, 27rem);
  overflow: hidden;
  border-color: rgba(255, 255, 255, .14);
  border-radius: 1rem;
  background: #18070b;
}
.store-photo {
  min-width: 0;
  overflow: hidden;
  background: #120508;
}
.store-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  transition: transform 240ms var(--ease-out);
}
.store-card--rosario .store-photo img { object-position: 50% 53%; }
.store-card-content {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: clamp(1.35rem, 3vw, 2rem);
  background: linear-gradient(145deg, rgba(39, 7, 13, .98), rgba(16, 4, 7, .98));
}
.store-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding-bottom: 1.1rem;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
}
.store-card-top span:first-child {
  color: var(--muted);
  font-size: .64rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.store-radius {
  color: #f2dadd;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .02em;
}
.store-card-body { padding-top: clamp(1.45rem, 4vw, 2.2rem); }
.store-card-body h3 {
  margin: 0;
  color: var(--text);
  font-size: clamp(1.8rem, 3vw, 2.45rem);
  letter-spacing: -.055em;
  line-height: .98;
}
.store-card-body p {
  max-width: 25rem;
  margin: .85rem 0 0;
  color: var(--muted-strong);
  font-size: .86rem;
  line-height: 1.6;
}
.store-card-action {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  margin-top: auto;
  padding-top: 1.65rem;
  color: var(--text);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: -.01em;
}
.store-card-action svg {
  width: .9rem;
  height: .9rem;
  fill: none;
  stroke: var(--brand-red-bright);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.45;
  transition: transform 160ms var(--ease-out);
}
@media (hover: hover) and (pointer: fine) {
  .store-card:hover .store-photo img { transform: scale(1.035); }
  .store-card:hover .store-card-action svg { transform: translateX(.2rem); }
}
@media (max-width: 48rem) {
  .store-card { grid-template-columns: 1fr; min-height: 0; }
  .store-photo { aspect-ratio: 3 / 4; max-height: 33rem; }
  .store-card-content { min-height: 14rem; }
}
@media (prefers-reduced-motion: reduce) {
  .store-photo img, .store-card-action svg { transition-duration: 1ms; }
  .store-card:hover .store-photo img, .store-card:hover .store-card-action svg { transform: none; }
}

/* Interacciones activadas por clases: mantienen style-src-attr 'none' en la CSP. */
.hero-device-scroll-layer,
.hero-copy { transition: transform 420ms var(--ease-out); }
.hero-device-scroll-layer.is-scroll-depth-active { transform: translate3d(0, 4.75rem, 0) scale(.945); }
.hero-copy.is-scroll-depth-active { transform: translate3d(0, -2.75rem, 0); }

@media (hover: hover) and (pointer: fine) {
  [data-magnetic].is-magnetic-active { transform: translate3d(0, -.15rem, 0) scale(1.01); }
  .hero-device-stage.is-pointer-active { transform: perspective(1100px) rotateX(.75deg) rotateY(1.8deg) translate3d(.35rem, -.2rem, 0); }
  .trade-in-banner--exchange .trade-in-media img.is-pointer-active { transform: scale(1.035) translate3d(.28rem, -.18rem, 0); }
}

@media (prefers-reduced-motion: reduce) {
  .hero-device-scroll-layer,
  .hero-copy,
  [data-magnetic].is-magnetic-active,
  .hero-device-stage.is-pointer-active,
  .trade-in-banner--exchange .trade-in-media img.is-pointer-active { transform: none; }
}

/* Navegación del catálogo: categoría y modelo comparten una única superficie. */
.catalog-nav-popover {
  left: 50%;
  display: grid;
  grid-template-columns: minmax(10.8rem, .82fr) minmax(13.2rem, 1fr);
  width: min(31.5rem, calc(100vw - 2rem));
  min-width: 0;
  padding: .42rem;
  overflow: hidden;
  border-color: rgba(255,255,255,.16);
  border-radius: 1.1rem;
  background: rgba(24, 5, 9, .96);
  box-shadow: 0 1.4rem 3.6rem rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.045);
}
.catalog-nav-tabs { display: grid; align-content: start; gap: .16rem; padding: .14rem; border-right: 1px solid rgba(255,255,255,.09); }
.catalog-nav-category {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .7rem;
  min-height: 3.45rem;
  padding: .68rem .6rem .68rem .7rem;
  border: 0;
  border-radius: .72rem;
  background: transparent;
  color: var(--muted-strong);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: color 180ms ease, background-color 180ms ease, transform 180ms var(--ease-out);
}
.catalog-nav-category span { display: grid; gap: .08rem; }
.catalog-nav-category strong { color: var(--text); font-size: .74rem; font-weight: 700; letter-spacing: -.018em; }
.catalog-nav-category small { color: var(--muted); font-size: .6rem; line-height: 1.35; }
.catalog-nav-category i { width: .34rem; height: .34rem; border-radius: 50%; background: #a62b38; box-shadow: none; }
.catalog-nav-category:nth-child(2) i { background: #dfbdc2; }
.catalog-nav-category:nth-child(3) i { background: #80303a; }
.catalog-nav-category[aria-selected="true"] { background: rgba(255,255,255,.075); color: var(--text); }
.catalog-nav-category[aria-selected="true"] i { background: var(--brand-red-bright); box-shadow: 0 0 .75rem rgba(251,72,89,.46); }
.catalog-nav-category:active { transform: scale(.975); }
.catalog-nav-category:focus-visible,
.catalog-nav-model-panel a:focus-visible { outline: 2px solid var(--brand-red-bright); outline-offset: -2px; }

.catalog-nav-models { min-width: 0; padding: .5rem .38rem .38rem .65rem; }
.catalog-nav-model-panel { animation: catalog-panel-in 180ms var(--ease-out) both; }
.catalog-nav-panel-title { margin: .08rem .15rem .72rem; color: var(--muted-strong); font-size: .62rem; font-weight: 700; letter-spacing: .025em; }
.catalog-nav-all {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .65rem;
  margin: 0 .1rem .56rem;
  padding: .6rem .62rem;
  border: 1px solid rgba(240,43,60,.3);
  border-radius: .62rem;
  background: rgba(217,20,39,.11);
  color: #fff;
  font-size: .67rem;
  font-weight: 700;
  letter-spacing: -.01em;
  transition: border-color 180ms ease, background-color 180ms ease, transform 180ms var(--ease-out);
}
.catalog-nav-all span { color: var(--brand-red-bright); font-size: .9rem; transition: transform 180ms var(--ease-out); }
.catalog-nav-all--outlet { margin-bottom: .1rem; }
.catalog-nav-model-list { display: grid; gap: .12rem; }
.catalog-nav-model-list a { padding: .57rem .66rem; border-radius: .56rem; color: var(--muted-strong); font-size: .7rem; font-weight: 650; letter-spacing: -.015em; transition: color 180ms ease, background-color 180ms ease, transform 180ms var(--ease-out); }
@keyframes catalog-panel-in { from { opacity: 0; transform: translate3d(-.3rem,0,0); } to { opacity: 1; transform: translate3d(0,0,0); } }

.catalog-model-groups { display: grid; gap: clamp(3.5rem, 7vw, 6rem); }
.catalog-model-group { scroll-margin-top: 7rem; }
.catalog-model-group + .catalog-model-group { padding-top: clamp(3.5rem, 6vw, 5rem); border-top: 1px solid var(--line); }
.catalog-model-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.35rem; }
.catalog-model-heading h4 { margin: 0; color: var(--text); font-size: clamp(1.25rem, 2.3vw, 1.8rem); font-weight: 650; letter-spacing: -.055em; line-height: 1; }
.catalog-model-heading p { max-width: 20rem; margin: 0; color: var(--muted); font-size: .74rem; line-height: 1.5; text-align: right; }
@media (hover: hover) and (pointer: fine) {
  .catalog-nav-category:hover { background: rgba(255,255,255,.055); color: var(--text); }
  .catalog-nav-all:hover { border-color: rgba(240,43,60,.55); background: rgba(217,20,39,.19); transform: translateY(-1px); }
  .catalog-nav-all:hover span { transform: translateX(.16rem); }
  .catalog-nav-model-list a:hover { background: rgba(255,255,255,.06); color: var(--text); transform: translateX(.13rem); }
}

@media (max-width: 48rem) {
  .catalog-nav-popover { right: .2rem; left: .2rem; grid-template-columns: 1fr; width: auto; max-height: min(31rem, calc(100vh - 8rem)); overflow-y: auto; }
  .catalog-nav-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); border-right: 0; border-bottom: 1px solid rgba(255,255,255,.09); padding-bottom: .42rem; }
  .catalog-nav-category { min-height: 3.1rem; padding: .5rem .42rem; }
  .catalog-nav-category strong { font-size: .64rem; }
  .catalog-nav-category small { display: none; }
  .catalog-nav-category i { flex: 0 0 auto; width: .28rem; height: .28rem; }
  .catalog-nav-models { padding: .62rem .3rem .25rem; }
  .catalog-model-heading { align-items: start; flex-direction: column; gap: .45rem; }
  .catalog-model-heading p { max-width: none; text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
  .catalog-nav-category,
  .catalog-nav-all,
  .catalog-nav-all span,
  .catalog-nav-model-list a,
  .catalog-nav-model-panel { animation: none; transition-duration: 1ms !important; }
}

/* En teléfono, la historia empieza con la elección y continúa con el equipo. */
@media (max-width: 48rem) {
  .hero {
    row-gap: 0;
    padding-block: 3.65rem 4.75rem;
  }
  .hero-copy { display: contents; }
  .hero-reveal--eyebrow { order: 1; margin-bottom: .72rem; }
  .hero-reveal--title { order: 2; }
  .hero-reveal--description { order: 3; margin-top: 1.35rem; }
  .hero-device,
  .hero-device--17 {
    order: 4;
    min-height: min(29rem, 100vw);
    margin-top: 1.75rem;
  }
  .hero-product-image { height: min(29rem, 100vw); }
  .hero-actions { order: 5; margin-top: 1.6rem; }
  .trust-list { order: 6; margin-top: 2.5rem; }
}