:root { color-scheme: dark; --bg:#20242a; --bg-deep:#15181d; --panel:#272c33; --panel-2:#30363f; --text:#f7f7f8; --muted:#b7bdc6; --line:#3c444f; --accent:#ff3045; --accent-2:#b71122; --accent-soft:rgba(255,48,69,.14); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font-family:Inter,Segoe UI,Arial,sans-serif; background:var(--bg); color:var(--text); }
a { color:inherit; text-decoration:none; }
button,input,select { font:inherit; }
.shell { width:min(1360px,calc(100% - 32px)); margin:0 auto; }
header { position:sticky; top:0; z-index:10; background:rgba(24,28,33,.97); border-bottom:1px solid #111419; box-shadow:0 7px 20px rgba(0,0,0,.28); backdrop-filter:blur(10px); }
.topbar { min-height:64px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:inline-flex; align-items:center; gap:10px; flex:none; font-size:22px; font-weight:900; text-transform:uppercase; }
.brand-mark { width:34px; height:34px; display:inline-grid; place-items:center; color:#fff; background:#d91f32; border-radius:7px; box-shadow:0 6px 15px rgba(255,45,61,.22); }
.brand-mark svg { width:21px; height:21px; stroke-width:2.4; }
.header-search { flex:1; display:flex; justify-content:flex-end; }
.search-wrap { position:relative; width:min(430px,100%); }
.search-wrap svg { position:absolute; left:14px; top:50%; width:18px; height:18px; transform:translateY(-50%); color:#d1d5dc; pointer-events:none; }
.search { width:100%; border:1px solid #434b55; background:#313741; color:var(--text); border-radius:7px; padding:11px 14px 11px 42px; outline:none; }
.search:focus { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.primary-nav,.secondary-nav { display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; }
.primary-nav { padding:0 0 10px; }
.primary-nav a,.secondary-nav a { white-space:nowrap; color:#dce0e6; border-radius:6px; font-size:13px; font-weight:800; }
.primary-nav a { padding:9px 14px; }
.primary-nav a.active,.primary-nav a:hover { color:#fff; background:var(--accent-soft); box-shadow:inset 0 -2px 0 var(--accent); }
.secondary-nav { justify-content:center; padding:12px 0; }
.secondary-nav a { padding:8px 13px; border:1px solid var(--line); background:#292f37; }
.secondary-nav a.active,.secondary-nav a:hover { border-color:var(--accent); color:#fff; }
.intro { padding:38px 0 16px; text-align:center; }
.intro h1 { max-width:980px; margin:0 auto 14px; font-size:clamp(31px,4vw,54px); line-height:1.06; }
.intro h1 span { color:#ff5061; }
.lead { max-width:820px; margin:0 auto; color:var(--muted); font-size:17px; line-height:1.55; }
.section-head { display:flex; align-items:end; justify-content:space-between; gap:16px; padding:38px 0 16px; }
.section-head h1,.section-head h2 { margin:0; font-size:clamp(22px,2.5vw,30px); }
.section-head h3 { margin:0; font-size:20px; }
.section-head > span { display:inline-flex; align-items:center; min-height:30px; border:1px solid var(--accent); border-radius:999px; padding:6px 11px; background:var(--accent); color:#fff; font-size:12px; font-weight:900; box-shadow:0 6px 18px rgba(255,49,70,.16); }
.device-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.device-card { min-height:92px; display:flex; align-items:center; justify-content:center; border:1px solid #48515d; border-radius:8px; background:#292f37; text-align:center; transition:.2s ease; }
.device-card:hover { background:var(--accent-soft); border-color:var(--accent); }
.visual-card img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.visual-card::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,12,15,.02) 20%,rgba(10,12,15,.88) 100%); }
.device-card-content,.visual-card-content { position:relative; z-index:1; width:100%; padding:20px; }
.device-card h3,.visual-card h3 { margin:0 0 6px; font-size:22px; }
.device-card p,.visual-card p { margin:0; color:#bfc5ce; line-height:1.42; }
.device-card:hover,.visual-card:hover,.card:hover { border-color:rgba(255,48,69,.7); transform:translateY(-2px); }
.collection-grid,.category-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.visual-card,.category-card { aspect-ratio:16/9; position:relative; display:flex; align-items:flex-end; overflow:hidden; border:1px solid var(--line); border-radius:8px; background:#191d22; transition:.2s ease; }
.category-card img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(1.2) contrast(1.04); }
.category-card::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 25%,rgba(11,13,16,.88) 100%); }
.category-content { position:relative; z-index:1; padding:17px; width:100%; }
.category-title { display:flex; justify-content:space-between; gap:12px; align-items:center; font-size:21px; font-weight:900; }
.category-count { background:var(--accent); border-radius:999px; padding:4px 8px; font-size:11px; white-space:nowrap; }
.category-desc { margin:7px 0 0; color:#d8dce1; line-height:1.4; }
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(285px,1fr)); gap:18px; align-items:start; padding-bottom:22px; }
.mobile-strip { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,210px)); gap:14px; align-items:start; justify-content:start; padding-bottom:22px; }
.mobile-strip .card { width:100%; }
.format-section { padding-bottom:18px; border-bottom:1px solid #343b44; }
.format-section:last-child { border-bottom:0; }
.format-section .section-head { padding-top:26px; }
.search-page-form { max-width:720px; margin:10px 0 24px; display:flex; gap:10px; }
.search-page-form .search { flex:1; }
.search-page-form button { border:0; border-radius:7px; padding:10px 18px; background:var(--accent); color:#fff; font-weight:900; cursor:pointer; }
.card { display:block; overflow:hidden; border:1px solid var(--line); border-radius:8px; background:var(--panel); transition:.2s ease; }
.card-media { aspect-ratio:16/9; overflow:hidden; background:#111419; }
.card-media img { width:100%; height:100%; display:block; object-fit:cover; transition:transform .2s ease; }
.card.is-mobile .card-media,.related-card.is-mobile .card-media { aspect-ratio:9/16; }
.card:hover .card-media img { transform:scale(1.02); }
.card-body { padding:12px; }
.card-title { min-height:38px; margin-bottom:9px; font-weight:800; line-height:1.25; overflow-wrap:anywhere; }
.meta { display:flex; gap:7px; flex-wrap:wrap; color:var(--muted); font-size:12px; }
.pill { border:1px solid #46505c; border-radius:999px; padding:4px 8px; }
.section-link { color:#ff6978; font-weight:800; font-size:13px; }
.hero { padding:30px 0 12px; }
.hero h1 { margin:0 0 12px; font-size:clamp(30px,4vw,48px); }
.hero .lead { margin:0; }
.filters { display:flex; gap:8px; flex-wrap:wrap; padding:14px 0 22px; }
.filters a { border:1px solid var(--line); border-radius:999px; padding:8px 12px; color:var(--muted); font-size:12px; font-weight:800; }
.filters a.active,.filters a:hover { color:#fff; border-color:var(--accent); background:var(--accent-soft); }
.filter-panel { margin:8px 0 24px; border:1px solid var(--line); border-radius:8px; background:#252a31; }
.filter-panel summary { display:none; padding:13px 15px; cursor:pointer; font-weight:900; }
.filter-form { display:grid; grid-template-columns:repeat(6,minmax(120px,1fr)); gap:10px; padding:14px; }
.filter-form label { color:var(--muted); font-size:11px; font-weight:800; }
.filter-form select { width:100%; margin-top:5px; padding:9px; border:1px solid #46505c; border-radius:6px; background:#171b20; color:#fff; }
.filter-submit { align-self:end; border:0; border-radius:6px; padding:10px 14px; background:var(--accent); color:#fff; font-weight:900; cursor:pointer; }
.search-summary { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:16px 0; }
.empty-state { display:none; padding:44px 20px; text-align:center; border:1px solid var(--line); border-radius:8px; background:#252a31; }
.suggestions { display:flex; justify-content:center; gap:8px; flex-wrap:wrap; margin-top:16px; }
.suggestions a { border:1px solid var(--line); border-radius:999px; padding:8px 12px; color:#e4e7eb; }
.catalog-search-page { padding-bottom:56px; }
.search-hero { padding-bottom:6px; }
.search-page-form { max-width:860px; margin:12px 0 18px; }
.search-page-form .search { min-height:48px; padding:12px 15px; border-radius:8px; }
.search-page-form button { min-width:120px; }
.search-format-nav { display:flex; gap:9px; flex-wrap:wrap; padding:0 0 10px; }
.search-format-nav button { border:1px solid #46505c; border-radius:999px; padding:9px 14px; background:#2b3139; color:#dce0e6; font-size:13px; font-weight:900; cursor:pointer; }
.search-format-nav button:hover,.search-format-nav button.active { color:#fff; border-color:var(--accent); background:var(--accent-soft); }
.search-results { padding-bottom:12px; }
.search-result-group { padding:10px 0 22px; }
.search-result-group + .search-result-group { border-top:1px solid #353d47; }
.search-group-head { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:8px 0 14px; }
.search-group-head h2 { margin:0; font-size:21px; }
.search-group-head h2 span { margin-left:7px; color:var(--muted); font-size:13px; font-weight:700; }
.search-group-action { flex:none; border:1px solid #ff5264; border-radius:999px; min-height:40px; padding:10px 18px; background:#db1f35; color:#fff; font-size:13px; font-weight:900; cursor:pointer; box-shadow:0 6px 16px rgba(219,31,53,.22); transition:transform .18s ease,background .18s ease,box-shadow .18s ease; }
.search-group-action:hover { background:#f12b42; box-shadow:0 8px 20px rgba(219,31,53,.34); transform:translateY(-1px); }
.search-results-grid { align-items:start; padding-bottom:0; }
.search-mobile-results { grid-template-columns:repeat(auto-fill,minmax(150px,210px)); justify-content:start; padding-bottom:0; }
.search-results-grid .card-title { min-height:0; }
.catalog-search-page .empty-state { display:block; margin:12px 0 30px; }
.catalog-search-page .empty-state[hidden] { display:none; }
.catalog-search-page .suggestions button { border:1px solid #46505c; border-radius:999px; padding:8px 12px; background:#2b3139; color:#e4e7eb; cursor:pointer; }
.catalog-search-page .suggestions button:hover { border-color:var(--accent); background:var(--accent-soft); }
.search-pagination button { border:1px solid var(--line); border-radius:7px; padding:10px 13px; background:#292f37; color:#fff; cursor:pointer; }
.search-pagination button:hover,.search-pagination button.active { border-color:var(--accent); background:var(--accent-soft); }
.search-pagination button:disabled { cursor:default; opacity:.42; }
.detail-heading { padding:30px 0 14px; }
.breadcrumbs { display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding-left:12px; border-left:4px solid var(--accent); color:var(--muted); font-size:13px; font-weight:800; }
.breadcrumbs a:hover { color:var(--accent); }
.detail { display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,380px); gap:24px; align-items:start; padding-bottom:46px; }
.preview-column { min-width:0; }
.preview-frame { display:flex; justify-content:center; align-items:center; min-height:360px; border:1px solid #48515c; border-radius:8px; background:#111419; overflow:hidden; }
.preview { display:block; width:auto; height:auto; max-width:100%; max-height:78vh; object-fit:contain; }
.ad-slot { min-height:110px; margin-top:18px; border:1px dashed #46515f; border-radius:8px; background:#1b1f25; }
.side { position:sticky; top:124px; border:1px solid var(--line); border-radius:8px; padding:20px; background:#292f37; }
.side h1 { margin:0 0 12px; color:var(--accent); font-size:clamp(23px,2.6vw,32px); line-height:1.12; overflow-wrap:anywhere; }
.side .description { color:var(--muted); line-height:1.55; }
.info-list { margin:18px 0 0; border-top:1px solid var(--line); }
.info-row { display:grid; grid-template-columns:105px 1fr; gap:12px; padding:11px 0; border-bottom:1px solid var(--line); font-size:13px; }
.info-row dt { color:var(--muted); }
.info-row dd { margin:0; font-weight:800; }
.info-row a { color:#ff6978; }
.downloads { display:grid; gap:9px; margin-top:18px; }
.button { display:flex; justify-content:center; align-items:center; min-height:46px; border-radius:7px; padding:12px 15px; background:var(--accent); color:#fff; font-weight:900; }
.button.secondary { background:#343b45; border:1px solid #4b5562; }
.related { padding:0 0 58px; }
.related-title { display:flex; align-items:center; justify-content:center; gap:9px; margin:8px 0 18px; }
.related-title svg { width:21px; color:var(--accent); }
.related-title h2 { margin:0; font-size:21px; }
.related-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; }
.related-card { overflow:hidden; border:1px solid var(--line); border-radius:8px; background:var(--panel); }
.related-card-title { min-height:36px; padding:9px 10px; text-align:center; color:#d9dde2; font-size:13px; }
.pagination { display:flex; justify-content:center; align-items:center; gap:10px; padding:24px 0 48px; }
.pagination a,.pagination span { border:1px solid var(--line); border-radius:7px; padding:11px 16px; }
.pagination a { border-color:var(--accent); background:var(--accent); color:#fff; font-weight:900; box-shadow:0 6px 18px rgba(255,49,70,.18); }
.pagination a:hover { background:#ff4b5f; border-color:#ff4b5f; transform:translateY(-1px); }
.pagination span { background:#292f37; color:#e6e9ed; font-weight:800; }
.content-page { max-width:920px; padding:42px 0 76px; line-height:1.7; }
.content-hero { padding-bottom:26px; border-bottom:1px solid var(--line); }
.content-eyebrow { margin:0 0 8px; color:var(--accent); font-size:13px; font-weight:800; text-transform:uppercase; }
.content-page h1 { margin:0; font-size:clamp(34px,5vw,54px); line-height:1.08; }
.content-lead { max-width:760px; margin:16px 0 0; color:#d6dbe2; font-size:19px; line-height:1.6; }
.content-page section { padding:28px 0; border-bottom:1px solid var(--line); }
.content-page section:last-child { border-bottom:0; }
.content-page h2 { margin:0 0 10px; font-size:24px; }
.content-page section p { margin:0 0 12px; color:#d1d6dd; }
.content-page section p:last-child { margin-bottom:0; }
.content-page ul { margin:12px 0 0; padding-left:22px; color:#d1d6dd; }
.content-page a { color:#ff6676; text-decoration:underline; text-underline-offset:3px; }
.content-update { margin-top:20px !important; color:var(--muted) !important; font-size:14px; }
.site-footer { margin-top:52px; border-top:1px solid #343b44; background:#171a1f; }
.footer-grid { display:grid; grid-template-columns:1.6fr repeat(3,1fr); gap:30px; padding:42px 0 32px; }
.footer-grid h2,.footer-grid h3 { margin:0 0 12px; font-size:16px; }
.footer-grid p { color:var(--muted); line-height:1.55; margin:0; }
.footer-links { display:grid; gap:9px; color:#c9ced5; font-size:13px; }
.footer-links a:hover { color:var(--accent); }
.footer-note { padding:18px 0 28px; border-top:1px solid #30363f; color:#aeb5bf; font-size:12px; text-align:center; }
@media (max-width:900px) { .collection-grid,.category-grid { grid-template-columns:repeat(2,1fr); } .detail { grid-template-columns:minmax(0,1fr) 320px; } .filter-form { grid-template-columns:repeat(3,1fr); } .footer-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:700px) { .shell { width:min(100% - 22px,1360px); } header { position:relative; } .topbar { min-height:52px; gap:12px; } .brand { font-size:17px; } .brand-mark { width:29px; height:29px; } .header-search { padding:0 0 10px; } .topbar { flex-wrap:wrap; padding-top:9px; } .header-search { order:3; flex-basis:100%; } .primary-nav { padding-bottom:8px; } .primary-nav a { padding:8px 10px; font-size:12px; } .secondary-nav { justify-content:flex-start; } .intro { padding-top:26px; } .device-grid,.collection-grid,.category-grid { grid-template-columns:1fr; } .device-card { min-height:76px; } .section-head { align-items:flex-start; flex-direction:column; padding-top:30px; } .grid { grid-template-columns:1fr; } .mobile-strip { grid-template-columns:repeat(2,minmax(0,1fr)); } .detail { display:flex; flex-direction:column; gap:14px; } .preview-column { display:contents; } .preview-frame { order:1; width:100%; min-height:240px; } .side { position:static; order:2; width:100%; } .ad-slot { order:3; width:100%; margin-top:0; } .side .description { margin-top:18px; } .preview { max-height:72vh; } .footer-grid { grid-template-columns:1fr; } }

/* Apariencia original anterior al rediseño del catálogo. */
body { background:linear-gradient(180deg,#2d3239 0,var(--bg) 240px,#20242a 100%); }
.topbar { min-height:66px; }
.brand { gap:10px; font-size:23px; letter-spacing:1px; }
.brand-mark { border-radius:8px; background:linear-gradient(180deg,#ff4050,#b61120); }
.top-actions { display:flex; align-items:center; gap:12px; }
.search-wrap { width:min(360px,34vw); }
.search { border-radius:999px; background:#363c45; padding:12px 16px 12px 42px; }
.mode-nav { display:flex; justify-content:center; gap:8px; flex-wrap:wrap; padding:12px 0 22px; }
.mode-nav a { border:1px solid #404852; background:rgba(48,54,64,.78); color:#dce0e6; border-radius:999px; padding:10px 18px; font-size:13px; font-weight:900; text-transform:uppercase; }
.mode-nav a.active,.mode-nav a:hover { color:#fff; border-color:var(--accent); background:var(--accent-soft); box-shadow:inset 0 -2px 0 var(--accent); }
.intro { padding:20px 0 8px; }
.intro h1 { max-width:920px; font-size:clamp(28px,3.8vw,48px); line-height:1.05; margin:0 0 14px; }
.intro .lead { max-width:860px; font-size:18px; }
.home-main .intro { text-align:center; display:flex; flex-direction:column; align-items:center; }
.home-main .intro h1 { max-width:1180px; margin-left:auto; margin-right:auto; }
.home-main .intro .lead { max-width:980px; margin-left:auto; margin-right:auto; }
.home-main .quick-tags { justify-content:center; }
.home-main .section-head.search-head { justify-content:center; text-align:center; }
.home-main .section-head.search-head span { display:none; }
.quick-tags { display:flex; gap:10px; flex-wrap:wrap; padding:0 0 22px; }
.quick-tags a { border:1px solid #424a55; background:#2d333c; color:#d8dce2; border-radius:999px; padding:9px 14px; font-size:13px; font-weight:800; }
.section-head { align-items:baseline; padding:22px 0 14px; }
.filters { display:flex; gap:10px; flex-wrap:wrap; padding:18px 0 28px; }
.filters a { border-radius:999px; background:#2c323a; padding:9px 13px; }
.format-nav { display:flex; gap:10px; flex-wrap:wrap; align-items:center; padding:0 0 26px; }
.format-nav a,.format-nav span { border:1px solid #424a55; background:#2d333c; color:#d8dce2; border-radius:999px; padding:10px 14px; font-size:13px; font-weight:900; }
.format-nav a.active,.format-nav a:hover { color:#fff; border-color:var(--accent); background:var(--accent-soft); }
.format-nav span.disabled { color:#7f8894; background:#242a31; cursor:not-allowed; }
.empty-list-page { margin:10px 0 34px; padding:22px; border:1px solid #3a424d; background:#252b33; color:#b9c1cc; border-radius:8px; text-align:center; }
.grid { grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); align-items:stretch; padding-bottom:48px; }
.mobile-strip { grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); justify-content:normal; padding-bottom:36px; }
.mobile-strip .card { max-width:220px; }
.card { background:linear-gradient(180deg,#293039,#22272e); box-shadow:0 10px 24px rgba(0,0,0,.16); }
.card-media { aspect-ratio:16/9; background:#0b0c0f; }
.card-media img { object-fit:cover; background:#0b0c0f; }
.card.is-mobile .card-media,.related-card.is-mobile .card-media { aspect-ratio:9/16; }
.card-body { padding:12px; }
.card-title { min-height:40px; margin-bottom:9px; }
.category-grid { grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:18px; padding:8px 0 60px; }
.category-card { aspect-ratio:16/9; border:1px solid rgba(255,255,255,.08); box-shadow:0 12px 30px rgba(0,0,0,.18); }
.category-card img { opacity:1; filter:saturate(1.35) contrast(1.06) brightness(1.08); }
.category-card::after { background:linear-gradient(180deg,rgba(14,16,19,.02) 0%,rgba(14,16,19,.06) 42%,rgba(14,16,19,.82) 100%); }
.detail-heading { padding:38px 0 14px; }
.detail-heading h1 { color:var(--accent); font-size:clamp(24px,3vw,34px); margin:0; }
.detail-heading p { margin-top:14px; max-width:none; font-size:14px; }
.detail { display:flex; flex-direction:column; gap:18px; padding:0 0 48px; align-items:stretch; }
.preview { width:auto; max-width:100%; height:auto; max-height:78vh; display:block; margin:0 auto; border-radius:8px; border:1px solid #555e6a; background:transparent; box-shadow:0 14px 34px rgba(0,0,0,.34); object-fit:contain; }
.ad-slot { min-height:110px; margin-top:0; border:1px dashed #46515f; background:rgba(24,28,34,.42); }
.side { position:static; width:100%; display:flex; flex-direction:column; align-items:center; text-align:center; background:linear-gradient(180deg,#293039,#232830); border:1px solid #3c4550; padding:18px; }
.side .meta { justify-content:center; }
.button { display:inline-flex; justify-content:center; width:min(360px,100%); min-height:auto; background:linear-gradient(180deg,#ff4050,var(--accent-2)); border-radius:8px; padding:14px 16px; margin-top:18px; }
.related-grid { grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:18px; }
.mode-nav { padding:12px 0 8px; }
.mode-nav a { min-height:40px; display:inline-flex; align-items:center; justify-content:center; padding:9px 17px; }
.topbar { display:grid; grid-template-columns:max-content minmax(390px,1fr) minmax(250px,340px); gap:28px; }
.header-nav { min-width:0; margin:0; padding:0; justify-content:center; flex-wrap:nowrap; }
.header-nav a { flex:none; }
.top-actions { width:100%; }
.top-actions .search-wrap { width:100%; }
.home-main .intro { padding:24px 0 2px; }
.home-main .intro h1 { max-width:1280px; font-size:clamp(30px,3vw,44px); line-height:1.08; text-wrap:balance; }
.home-main .section-head.search-head { padding:22px 0 12px; }
.home-main .section-head.search-head h2 { font-size:24px; }
.home-main .quick-tags { max-width:1180px; margin:0 auto; gap:9px; padding-bottom:30px; }
.home-main .quick-tags a { min-height:37px; display:inline-flex; align-items:center; padding:8px 13px; background:#2c323a; border-color:#414a55; box-shadow:0 5px 12px rgba(0,0,0,.1); }
.home-main .quick-tags a:hover { background:#353c46; border-color:var(--accent); }
.end-page { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(280px,.8fr); gap:36px; align-items:center; margin:24px 0 54px; padding:30px 0 4px; border-top:1px solid #3a424d; }
.end-page-copy h2 { margin:0 0 10px; font-size:22px; }
.end-page-copy p { max-width:760px; margin:0; color:var(--muted); line-height:1.65; }
.end-page-copy p + p { margin-top:10px; }
.end-page-copy a { color:#ff7180; font-weight:800; text-decoration:underline; text-decoration-color:rgba(255,113,128,.35); text-underline-offset:3px; }
.end-page-copy a:hover { text-decoration-color:currentColor; }
.end-page-facts { display:flex; justify-content:flex-end; gap:8px; flex-wrap:wrap; margin:0; padding:0; list-style:none; }
.end-page-facts li { border:1px solid #434c58; border-radius:999px; padding:8px 11px; color:#d9dde3; background:#292f37; font-size:12px; font-weight:800; }
.index2-main { padding-top:0; }
.index2-hero { max-width:1100px; margin:0 auto; padding:58px 0 34px; text-align:center; }
.index2-eyebrow { margin:0 0 12px; color:#ff6877; font-size:12px; font-weight:900; text-transform:uppercase; letter-spacing:.8px; }
.index2-hero h1 { margin:0; font-size:clamp(34px,4.3vw,58px); line-height:1.04; text-wrap:balance; }
.index2-hero h1 span { color:var(--accent); }
.index2-section { padding:25px 0 16px; }
.index2-heading { display:flex; align-items:end; justify-content:space-between; gap:18px; margin-bottom:17px; }
.index2-heading p { margin:0 0 6px; color:#ff6877; font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.7px; }
.index2-heading h2 { margin:0; font-size:clamp(23px,2.5vw,31px); line-height:1.15; }
.index2-heading-link { flex:none; border:1px solid #ff5264; border-radius:999px; min-height:42px; display:inline-flex; align-items:center; padding:10px 19px; color:#fff; background:#db1f35; font-size:13px; font-weight:900; box-shadow:0 6px 16px rgba(219,31,53,.22); transition:transform .18s ease,background .18s ease,box-shadow .18s ease; }
.index2-heading-link:hover { background:#f12b42; box-shadow:0 8px 20px rgba(219,31,53,.34); transform:translateY(-1px); }
.device-choice-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.device-choice { min-height:92px; display:grid; grid-template-columns:42px 1fr 20px; gap:14px; align-items:center; padding:18px; border:1px solid #424b56; border-radius:8px; background:#292f37; transition:transform .18s ease,border-color .18s ease,background .18s ease; }
.device-choice:hover { transform:translateY(-2px); border-color:var(--accent); background:#303741; }
.device-icon { width:36px; height:36px; padding:7px; color:#ff6574; border:1px solid #505a67; border-radius:7px; stroke-width:1.8; }
.device-choice strong,.device-choice small { display:block; }
.device-choice strong { margin-bottom:5px; font-size:17px; }
.device-choice small { color:var(--muted); font-size:12px; }
.device-arrow { color:#ff6574; font-size:27px; line-height:1; text-align:right; }
.index2-subheading { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 0 11px; border-bottom:1px solid #353d47; }
.index2-subheading h3 { margin:0; font-size:18px; }
.index2-subheading a { flex:none; min-height:40px; display:inline-flex; align-items:center; border:1px solid #ff5264; border-radius:999px; padding:10px 18px; background:#db1f35; color:#fff; font-size:13px; font-weight:900; box-shadow:0 6px 16px rgba(219,31,53,.22); transition:transform .18s ease,background .18s ease,box-shadow .18s ease; }
.index2-subheading a:hover { background:#f12b42; box-shadow:0 8px 20px rgba(219,31,53,.34); transform:translateY(-1px); }
.index2-wallpaper-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; padding:14px 0 8px; }
.index2-mobile-strip { grid-template-columns:repeat(6,minmax(0,1fr)); gap:14px; padding:14px 0 8px; }
.index2-mobile-strip .card { max-width:none; }
.index2-mobile-strip .meta,.index2-wallpaper-grid .meta { display:none; }
.index2-mobile-strip .card-title,.index2-wallpaper-grid .card-title { min-height:0; margin-bottom:0; }
.index2-category-grid { grid-template-columns:repeat(3,minmax(0,1fr)); padding-bottom:18px; }
@media (max-width:980px) { .index2-wallpaper-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .index2-mobile-strip { grid-template-columns:repeat(4,minmax(0,1fr)); } .index2-category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:1080px) { .topbar { grid-template-columns:max-content 1fr; gap:14px 22px; padding:10px 0; } .header-nav { justify-content:flex-end; } .top-actions { grid-column:1 / -1; } }
@media (max-width:760px) { .topbar { display:flex; align-items:stretch; flex-direction:column; padding:12px 0; gap:10px; } .brand { font-size:20px; } .header-nav { width:100%; justify-content:flex-start; margin:2px 0 0; padding:0 0 3px; } .top-actions,.search-wrap { width:100%; } .quick-tags,.mode-nav { justify-content:flex-start; overflow-x:auto; flex-wrap:nowrap; padding-bottom:8px; } .home-main .quick-tags { justify-content:flex-start; margin:0; } .mode-nav a,.quick-tags a { white-space:nowrap; } .home-main .intro { padding-top:16px; } .home-main .intro h1 { font-size:31px; } .section-head { align-items:flex-start; flex-direction:column; } .home-main .section-head.search-head { align-items:flex-start; text-align:left; padding-top:18px; } .category-grid,.grid { grid-template-columns:1fr; } .mobile-strip { grid-template-columns:repeat(2,minmax(0,1fr)); } .end-page { grid-template-columns:1fr; gap:20px; margin-bottom:38px; padding-top:24px; } .end-page-facts { justify-content:flex-start; } .index2-hero { padding:36px 0 20px; text-align:left; } .index2-hero h1 { font-size:36px; } .index2-heading { align-items:flex-start; flex-direction:column; } .index2-heading-link { align-self:flex-start; } .device-choice-grid,.index2-category-grid { grid-template-columns:1fr; } .index2-mobile-strip { grid-template-columns:repeat(2,minmax(0,1fr)); overflow:visible; } .index2-wallpaper-grid { grid-template-columns:1fr; } .index2-section { padding-top:20px; } }
.catalog-search-page .search-results-grid { align-items:start; }
.catalog-search-page .search-mobile-results { grid-template-columns:repeat(auto-fill,minmax(150px,210px)); }
@media (max-width:760px) { .search-page-form { flex-direction:column; } .search-page-form button { min-height:46px; } .search-group-head { align-items:flex-start; } .catalog-search-page .search-mobile-results { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.detail { max-width:1320px; display:grid; grid-template-columns:minmax(0,1fr) minmax(390px,440px); gap:30px; align-items:start; }
.detail-media-column { min-width:0; display:flex; flex-direction:column; gap:18px; }
.preview-stage { display:flex; justify-content:center; margin:0; }
.download-panel { position:sticky; top:90px; display:flex; flex-direction:column; gap:22px; align-items:stretch; border:1px solid #414a55; border-radius:8px; padding:24px; background:linear-gradient(180deg,#293039,#232830); box-shadow:0 14px 32px rgba(0,0,0,.2); }
.download-intro { padding-bottom:20px; border-bottom:1px solid #414a55; }
.download-intro h1 { margin:0; color:var(--accent); font-size:clamp(25px,2.4vw,33px); line-height:1.12; overflow-wrap:anywhere; }
.download-intro p { margin:12px 0 0; color:var(--muted); font-size:14px; line-height:1.6; }
.download-panel h2 { margin:0 0 14px; font-size:18px; }
.wallpaper-editorial { padding:0 0 54px; }
.wallpaper-editorial-inner { max-width:920px; margin:0 auto; padding:28px 0 0; border-top:1px solid var(--line); }
.wallpaper-editorial-label { margin:0 0 8px; color:var(--accent); font-size:12px; font-weight:800; text-transform:uppercase; }
.wallpaper-editorial h2 { margin:0 0 13px; font-size:24px; }
.wallpaper-editorial-copy { margin:0; color:#cbd2da; font-size:16px; line-height:1.75; }
.wallpaper-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; margin:0; overflow:hidden; border:1px solid #3f4853; border-radius:7px; background:#3f4853; }
.wallpaper-fact { min-width:0; padding:11px 12px; background:#252b32; }
.wallpaper-fact dt { margin:0 0 4px; color:var(--muted); font-size:11px; }
.wallpaper-fact dd { margin:0; font-size:13px; font-weight:800; overflow-wrap:anywhere; }
.wallpaper-fact a { color:#ff7180; }
.download-box { display:flex; flex-direction:column; align-items:stretch; justify-content:center; border-top:1px solid #414a55; padding-top:18px; }
.download-box .button { width:100%; margin-top:0; }
.related-grid.is-mobile-related { grid-template-columns:repeat(6,minmax(0,1fr)); justify-content:center; }
.related-grid.is-mobile-related .related-card-title { min-height:52px; }
@media (max-width:1050px) { .detail { grid-template-columns:minmax(0,1fr) 360px; gap:20px; } .wallpaper-facts { grid-template-columns:1fr; } }
@media (max-width:700px) { .detail-heading { padding-top:26px; } .detail-heading h1 { font-size:27px; } .detail { display:flex; flex-direction:column; } .detail-media-column,.download-panel { width:100%; } .download-panel { position:static; gap:20px; padding:17px; } .wallpaper-facts { grid-template-columns:repeat(2,minmax(0,1fr)); } .wallpaper-editorial { padding-bottom:42px; } .wallpaper-editorial-inner { padding-top:22px; } .wallpaper-editorial h2 { font-size:21px; } .wallpaper-editorial-copy { font-size:15px; } .related-grid.is-mobile-related { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) { .topbar { padding:7px 0; gap:6px; } .brand { font-size:17px; } .brand-mark { width:28px; height:28px; } .header-nav { gap:5px; margin:0; padding:0; } .header-nav a { padding:7px 10px; font-size:11px; } .top-actions { margin:0; } .search { padding-top:9px; padding-bottom:9px; } }