@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@800&family=Inter:wght@400;500;600;700&display=swap');

:root {
  --accent: #E8202A;
  --ink: #111318;
  --muted: #5B6270;
  --bg: #fff;
  --soft: #F3F4F6;
  --line: #E5E7EB;
  --buy: #0F62FE;
  --ml: #FFE600;
  --ml-ink: #2D3277;
  --ok: #0E9F6E;
  --bad: #D92D20;
  --radius: 10px;
  --header-h: 56px;
  --util-h: 28px;
  --max-w: 1320px;
  --space: 16px;
  --gap: 24px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: 'Inter', system-ui, sans-serif; font-size: 1rem; line-height: 1.6; color: var(--ink); background: var(--bg); }
img, video { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: underline; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
button { font: inherit; cursor: pointer; background: none; border: none; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4, h5, h6 { margin: 0; font-family: 'Archivo', sans-serif; font-weight: 800; line-height: 1.2; }
p { margin: 0 0 1rem; }
input, select, textarea { font: inherit; color: inherit; background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius); padding: 0.625rem 0.875rem; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(232,32,42,.15); }
label { display: block; font-weight: 500; margin-bottom: 0.25rem; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* Layout helpers */
.md-container { width: 100%; max-width: var(--max-w); margin: 0 auto; padding: 0 var(--space); }
.md-layout { display: grid; gap: var(--gap); }
.md-rail { display: flex; flex-direction: column; gap: var(--gap); }
@media (min-width: 1024px) {
  .md-layout { grid-template-columns: 240px 1fr 300px; }
  .md-rail { position: sticky; top: calc(var(--header-h) + var(--util-h) + 40px + var(--gap)); align-self: start; }
}
@media (max-width: 1023px) {
  .md-layout { grid-template-columns: 1fr; }
  .md-rail:first-child { order: 2; }
  .md-rail:last-child { order: 3; }
}

/* ===== HEADER ===== */
.md-header { position: sticky; top: 0; z-index: 1000; background: var(--bg); border-bottom: 1px solid var(--line); }
.md-util-bar { display: flex; align-items: center; justify-content: space-between; height: var(--util-h); background: var(--ink); color: #fff; font-size: 0.75rem; font-weight: 500; padding: 0 var(--space); }
.md-util-left { display: flex; align-items: center; gap: 0.5rem; }
.md-util-right { display: flex; align-items: center; gap: 1rem; }
.md-util-link, .md-util-btn { color: #fff; text-decoration: none; padding: 0.25rem 0; }
.md-util-link:hover, .md-util-btn:hover { text-decoration: underline; }
.md-util-btn { background: transparent; border: none; color: #fff; font-weight: 600; }

.md-main-bar { display: flex; align-items: center; justify-content: space-between; height: var(--header-h); padding: 0 var(--space); }
.md-logo { display: flex; align-items: center; gap: 2px; text-decoration: none; }
.md-logo-md { font-family: 'Archivo', sans-serif; font-weight: 800; font-size: 1.25rem; color: var(--ink); }
.md-logo-go { font-family: 'Archivo', sans-serif; font-weight: 800; font-size: 1.25rem; color: var(--accent); }
.md-logo-dot { font-size: 1.25rem; color: var(--accent); line-height: 1; }

.md-nav { display: flex; align-items: center; gap: 0.25rem; }
.md-nav-list { display: flex; align-items: center; gap: 0.25rem; }
.md-nav-item { position: relative; }
.md-nav-link { display: flex; align-items: center; gap: 0.375rem; padding: 0.5rem 0.75rem; font-size: 0.875rem; font-weight: 600; color: var(--ink); border-radius: var(--radius); transition: background .15s, color .15s; }
.md-nav-link:hover, .md-nav-link:focus { background: var(--soft); color: var(--accent); text-decoration: none; }
.md-nav-link[aria-expanded="true"] { background: var(--soft); color: var(--accent); }
.md-nav-link-active { color: var(--accent); }
.md-nav-link-active::after { content: ''; position: absolute; bottom: -1px; left: 0.75rem; right: 0.75rem; height: 2px; background: var(--accent); border-radius: 2px 2px 0 0; }

.md-search-btn, .md-hamburger { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: var(--radius); color: var(--ink); }
.md-search-btn:hover, .md-hamburger:hover { background: var(--soft); }
.md-hamburger { flex-direction: column; gap: 4px; padding: 0; }
.md-hamburger-line { display: block; width: 20px; height: 2px; background: currentColor; border-radius: 2px; transition: transform .2s, opacity .2s; }
.md-hamburger[aria-expanded="true"] .md-hamburger-line:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.md-hamburger[aria-expanded="true"] .md-hamburger-line:nth-child(2) { opacity: 0; }
.md-hamburger[aria-expanded="true"] .md-hamburger-line:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Mega menu (desktop) */
.md-mega-menu { position: absolute; left: 0; right: 0; top: calc(var(--util-h) + var(--header-h)); z-index: 200; background: var(--bg); border-bottom: 1px solid var(--line); box-shadow: 0 12px 24px rgba(17,19,24,.08); padding: 1.5rem var(--space); display: none; }
.md-mega-menu:not([hidden]) { display: block; animation: md-fade-down .15s ease-out; }
@keyframes md-fade-down { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
.md-mega-panel { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--gap); max-width: var(--max-w); margin: 0 auto; }
.md-mega-col { min-width: 0; }
.md-mega-title { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); margin-bottom: 0.75rem; }
.md-mega-list { display: flex; flex-direction: column; gap: 0.375rem; }
.md-mega-link { display: block; padding: 0.375rem 0; font-size: 0.875rem; color: var(--ink); border-bottom: 1px solid transparent; transition: color .15s, border-color .15s; }
.md-mega-link:hover, .md-mega-link:focus { color: var(--accent); border-bottom-color: var(--accent); text-decoration: none; }
.md-mega-featured { padding-left: var(--gap); border-left: 1px solid var(--line); }
.md-mega-featured-title { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); margin-bottom: 0.5rem; }
.md-mega-featured-link { display: inline-block; font-weight: 600; color: var(--ink); padding: 0.5rem 0; }
.md-mega-featured-link:hover { color: var(--accent); text-decoration: underline; }
.md-mega-coming { text-align: center; padding: 2rem; }
.md-mega-coming p { color: var(--muted); margin-bottom: 1rem; }
.md-mega-coming-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 1.25rem; background: var(--ink); color: #fff; font-weight: 600; border-radius: var(--radius); transition: background .15s; }
.md-mega-coming-btn:hover { background: #1a1d23; text-decoration: none; }

/* Search overlay */
.md-search-overlay { position: fixed; inset: 0; z-index: 3000; background: rgba(17,19,24,.6); display: flex; flex-direction: column; align-items: center; padding-top: 8vh; opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s; }
.md-search-overlay:not([hidden]) { opacity: 1; visibility: visible; }
.md-search-overlay-inner { width: 100%; max-width: 640px; background: var(--bg); border-radius: var(--radius); box-shadow: 0 24px 48px rgba(17,19,24,.15); padding: 1.5rem; margin: 0 var(--space); animation: md-fade-up .2s ease-out; }
@keyframes md-fade-up { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
.md-search-overlay-inner label { display: block; margin-bottom: 0.5rem; font-weight: 500; }
.md-search-input { width: 100%; font-size: 1.125rem; padding: 0.875rem 1rem; border: 2px solid var(--line); }
.md-search-input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(232,32,42,.15); }
.md-search-results { margin-top: 1rem; max-height: 40vh; overflow-y: auto; }
.md-search-result { border-bottom: 1px solid var(--line); }
.md-search-result:last-child { border-bottom: none; }
.md-search-result a { display: flex; flex-direction: column; gap: 0.25rem; padding: 0.75rem 0.5rem; }
.md-search-result-title { font-weight: 600; color: var(--ink); }
.md-search-result-url { font-size: 0.75rem; color: var(--muted); }
.md-search-result a:hover .md-search-result-title { color: var(--accent); }
.md-search-close { position: absolute; top: 1rem; right: 1rem; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; border-radius: 50%; color: var(--muted); font-size: 1.25rem; }
.md-search-close:hover { background: var(--soft); color: var(--ink); }

/* Mobile drawer */
.md-drawer { position: fixed; inset: 0; z-index: 2500; background: var(--bg); display: flex; flex-direction: column; transform: translateX(100%); transition: transform .3s ease-out; }
.md-drawer:not([hidden]) { transform: translateX(0); }
.md-drawer-header { display: flex; align-items: center; justify-content: space-between; padding: 1rem var(--space); border-bottom: 1px solid var(--line); }
.md-drawer-header h2 { font-size: 1.25rem; }
.md-drawer-close { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; border-radius: var(--radius); color: var(--ink); font-size: 1.25rem; }
.md-drawer-close:hover { background: var(--soft); }
.md-drawer-body { flex: 1; overflow-y: auto; padding: 1rem var(--space); }
.md-drawer-section { border-bottom: 1px solid var(--line); }
.md-drawer-toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 1rem 0; font-size: 1rem; font-weight: 600; color: var(--ink); text-align: left; }
.md-drawer-toggle:hover { color: var(--accent); }
.md-drawer-chevron { transition: transform .2s; }
.md-drawer-toggle[aria-expanded="true"] .md-drawer-chevron { transform: rotate(180deg); }
.md-drawer-content { padding-top: 0.5rem; animation: md-slide-down .2s ease-out; }
@keyframes md-slide-down { from { opacity: 0; max-height: 0; } to { opacity: 1; max-height: 500px; } }
.md-drawer-content h4 { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); margin: 1rem 0 0.5rem; }
.md-drawer-content .md-mega-list { margin-bottom: 0.5rem; }
.md-drawer-content .md-mega-link { padding: 0.5rem 0; font-size: 0.9375rem; }
.md-drawer-content .md-mega-featured-link { font-size: 1rem; }

/* Trends row */
.md-trends { display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem var(--space); background: var(--soft); border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; }
.md-trends::-webkit-scrollbar { display: none; }
.md-trends-label { flex-shrink: 0; font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); white-space: nowrap; }
.md-trends-list { display: flex; gap: 0.5rem; min-width: max-content; }
.md-trend-chip { display: inline-flex; align-items: center; padding: 0.375rem 0.875rem; font-size: 0.8125rem; font-weight: 500; color: var(--ink); background: var(--bg); border: 1px solid var(--line); border-radius: 999px; white-space: nowrap; transition: border-color .15s, color .15s, background .15s; }
.md-trend-chip:hover { border-color: var(--accent); color: var(--accent); background: #fff; text-decoration: none; }

/* ===== WIDGETS ===== */
.md-widget { background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.25rem; }

/* Comparador */
.md-comparador-title { font-size: 1.125rem; margin-bottom: 0.25rem; }
.md-comparador-subtitle { font-size: 0.875rem; color: var(--muted); margin-bottom: 1rem; }
.md-comparador-selects { display: grid; grid-template-columns: 1fr; gap: 0.75rem; margin-bottom: 1rem; }
@media (min-width: 480px) { .md-comparador-selects { grid-template-columns: 1fr 1fr; } }
.md-comparador-select-wrapper { display: flex; flex-direction: column; gap: 0.375rem; }
.md-comparador-select-label { font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); }
.md-comparador-select { width: 100%; min-height: 44px; font-size: 0.9375rem; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235B6270' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 0.75rem center; padding-right: 2.5rem; }
.md-comparador-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; margin-bottom: 1rem; }
.md-comparador-row { display: grid; grid-template-columns: 1fr 1fr 1fr; border-bottom: 1px solid var(--line); }
.md-comparador-row:last-child { border-bottom: none; }
.md-comparador-label, .md-comparador-value { padding: 0.625rem 0.75rem; }
.md-comparador-label { font-weight: 500; color: var(--muted); background: var(--soft); border-right: 1px solid var(--line); }
.md-comparador-value { text-align: center; color: var(--ink); }
.md-comparador-value-best { color: var(--ok); font-weight: 600; }
.md-comparador-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1rem; }
.md-comparador-btns { display: flex; flex-direction: column; gap: 0.375rem; flex: 1; min-width: 140px; }
.md-comparador-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 0.5rem 0.875rem; font-size: 0.8125rem; font-weight: 600; border-radius: var(--radius); text-align: center; transition: background .15s, color .15s, transform .1s; }
.md-comparador-btn:active { transform: scale(0.98); }
.md-comparador-btn:not(.ml) { background: var(--buy); color: #fff; }
.md-comparador-btn:not(.ml):hover { background: #0d52d6; text-decoration: none; }
.md-comparador-btn.ml { background: var(--ml); color: var(--ml-ink); border: 1px solid var(--ml-ink); }
.md-comparador-btn.ml:hover { background: #ffdd00; text-decoration: none; }
.md-comparador-guia { font-size: 0.875rem; font-weight: 500; }
.md-comparador-guia a { color: var(--accent); }
.md-comparador-footnote { font-size: 0.75rem; color: var(--muted); }

/* MÃ¡s leÃ­das */
.md-mas-leidas-title { font-size: 1.125rem; margin-bottom: 0.75rem; }
.md-mas-leidas-list { display: flex; flex-direction: column; gap: 0.75rem; }
.md-mas-leidas-item { display: flex; align-items: flex-start; gap: 0.75rem; }
.md-mas-leidas-number { flex-shrink: 0; width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; font-family: 'Archivo', sans-serif; font-weight: 800; font-size: 1rem; color: #fff; background: var(--accent); border-radius: 50%; line-height: 1; }
.md-mas-leidas-link { font-weight: 500; line-height: 1.4; transition: color .15s; }
.md-mas-leidas-link:hover { color: var(--accent); text-decoration: none; }

/* Newsletter box */
.md-newsletter-box { background: var(--ink); color: #fff; border-color: var(--ink); }
.md-newsletter-title { font-size: 1.125rem; margin-bottom: 1rem; }
.md-newsletter-field { margin-bottom: 0.75rem; }
.md-newsletter-field label { color: #fff; margin-bottom: 0.375rem; }
.md-newsletter-input { width: 100%; background: #fff; border-color: transparent; color: var(--ink); }
.md-newsletter-input::placeholder { color: var(--muted); }
.md-newsletter-checkbox-wrapper { display: flex; align-items: flex-start; gap: 0.5rem; margin-bottom: 1rem; }
.md-newsletter-checkbox { flex-shrink: 0; width: 20px; height: 20px; margin-top: 0.125rem; accent-color: var(--accent); }
.md-newsletter-checkbox-label { font-size: 0.8125rem; color: rgba(255,255,255,.8); cursor: pointer; }
.md-newsletter-submit { width: 100%; min-height: 48px; background: var(--accent); color: #fff; font-weight: 600; font-size: 1rem; border-radius: var(--radius); transition: background .15s; }
.md-newsletter-submit:hover { background: #d01a23; }
.md-newsletter-legal { font-size: 0.75rem; color: rgba(255,255,255,.6); text-align: center; margin-top: 0.75rem; }

/* ===== MODAL ===== */
.md-modal { position: fixed; inset: 0; z-index: 4000; display: flex; align-items: center; justify-content: center; padding: var(--space); animation: md-fade-in .2s ease-out; }
@keyframes md-fade-in { from { opacity: 0; } to { opacity: 1; } }
.md-modal-overlay { position: absolute; inset: 0; background: rgba(17,19,24,.6); }
.md-modal-dialog { position: relative; width: 100%; max-width: 420px; background: var(--bg); border-radius: var(--radius); box-shadow: 0 24px 48px rgba(17,19,24,.2); padding: 1.5rem; animation: md-fade-up .2s ease-out; }
.md-modal-close { position: absolute; top: 0.75rem; right: 0.75rem; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 50%; color: var(--muted); font-size: 1.25rem; line-height: 1; }
.md-modal-close:hover { background: var(--soft); color: var(--ink); }
.md-modal-tag { display: inline-block; font-size: 0.625rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: #fff; background: var(--accent); padding: 0.25rem 0.5rem; border-radius: 4px; margin-bottom: 0.75rem; }
.md-modal-title { font-size: 1.5rem; margin-bottom: 0.5rem; }
.md-modal-text { color: var(--muted); margin-bottom: 1.25rem; }
.md-modal-form { display: flex; flex-direction: column; gap: 0.75rem; }
.md-modal-field label { color: var(--ink); }
.md-modal-input { width: 100%; min-height: 48px; }
.md-modal-checkbox-wrapper { display: flex; align-items: flex-start; gap: 0.5rem; }
.md-modal-checkbox { flex-shrink: 0; width: 20px; height: 20px; margin-top: 0.125rem; accent-color: var(--accent); }
.md-modal-checkbox-label { font-size: 0.8125rem; color: var(--muted); cursor: pointer; }
.md-modal-submit { min-height: 48px; background: var(--accent); color: #fff; font-weight: 600; font-size: 1rem; border-radius: var(--radius); transition: background .15s; margin-top: 0.25rem; }
.md-modal-submit:hover { background: #d01a23; }
.md-modal-submit:disabled { opacity: 0.6; cursor: not-allowed; }
.md-modal-dismiss { display: block; text-align: center; margin-top: 0.75rem; font-size: 0.875rem; color: var(--muted); }
.md-modal-dismiss:hover { color: var(--accent); }
.md-modal-footnote { font-size: 0.75rem; color: var(--muted); text-align: center; margin-top: 1rem; }

/* ===== FOOTER ===== */
.md-footer { background: var(--ink); color: #fff; padding: 3rem var(--space) 2rem; }
.md-footer-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; margin-bottom: 2rem; }
@media (min-width: 640px) { .md-footer-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .md-footer-grid { grid-template-columns: repeat(4, 1fr); } }
.md-footer-title { font-size: 0.875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ml); margin-bottom: 1rem; }
.md-footer-list { display: flex; flex-direction: column; gap: 0.5rem; }
.md-footer-link { font-size: 0.9375rem; color: rgba(255,255,255,.8); transition: color .15s; }
.md-footer-link:hover { color: var(--ml); text-decoration: none; }
.md-footer-newsletter { padding-top: 2rem; border-top: 1px solid rgba(255,255,255,.1); margin-bottom: 2rem; }
.md-footer-newsletter-title { font-size: 1.125rem; margin-bottom: 1rem; }
.md-footer-newsletter-form { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.md-footer-newsletter-input { flex: 1; min-width: 200px; min-height: 48px; background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.2); color: #fff; }
.md-footer-newsletter-input::placeholder { color: rgba(255,255,255,.5); }
.md-footer-newsletter-input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(232,32,42,.2); }
.md-footer-newsletter-submit { min-height: 48px; padding: 0 1.5rem; background: var(--accent); color: #fff; font-weight: 600; border-radius: var(--radius); transition: background .15s; white-space: nowrap; }
.md-footer-newsletter-submit:hover { background: #d01a23; }
.md-footer-bottom { font-size: 0.8125rem; color: rgba(255,255,255,.5); text-align: center; line-height: 1.6; }

/* ===== UTILITIES ===== */
@media (max-width: 360px) {
  :root { --space: 12px; --gap: 16px; }
  .md-main-bar { padding: 0 var(--space); }
  .md-logo-md, .md-logo-go, .md-logo-dot { font-size: 1.125rem; }
  .md-nav-link { padding: 0.5rem 0.5rem; font-size: 0.8125rem; }
  .md-mega-panel { grid-template-columns: 1fr 1fr; }
  .md-mega-featured { grid-column: 1 / -1; border-left: none; border-top: 1px solid var(--line); padding-top: 1rem; margin-top: 0.5rem; }
}
/* === Ajustes de revisiÃ³n (Claude) === */
html,body{overflow-x:hidden}
@media (max-width:1023px){ .md-nav{display:flex;margin-left:auto} .md-nav-item:not(:has(.md-hamburger)):not(:has(.md-search-btn)){display:none} .md-hamburger{display:flex} }
@media (min-width:1024px){ .md-hamburger{display:none} }
@media (min-width:1024px) and (max-width:1199px){
  .md-layout{grid-template-columns:minmax(0,1fr) 300px}
  .md-layout > .md-rail:first-child{order:3;grid-column:1 / -1;position:static}
}
@media (min-width:1200px){ .md-layout{grid-template-columns:280px minmax(0,1fr) 300px} }
.md-layout > *{min-width:0}
.md-trending, [class*=md-trending]{scrollbar-width:none}
[class*=md-trending]::-webkit-scrollbar{display:none}
.md-nav-list{list-style:none;margin:0;padding:0}
.md-nav-item:has(.md-hamburger),.md-nav-item:has(.md-search-btn){display:flex}
.md-hamburger-line{width:20px;min-width:20px;height:2px}

/* Fotos de producto */
.ph-img,.hm-photo{width:100%;height:100%;object-fit:contain;display:block}
.ph:has(.ph-img),.product-ph:has(.ph-img),.carousel-card .ph:has(.ph-img),.hm-hero-img:has(.hm-photo),.hm-side-thumb:has(.hm-photo){background:#fff}
.product-ph .ph-img{padding:12px}
.hm-hero-img:has(.hm-photo){max-height:340px}
.hm-card-img{width:100%;aspect-ratio:4/3;object-fit:contain;background:#fff;border-radius:8px;display:block}
.md-cupon{display:inline-block;margin-top:6px;padding:6px 10px;border:1.5px dashed var(--accent);border-radius:8px;background:#fff5f5;color:var(--ink);font-size:13px;line-height:1.35}
.md-cupon strong{color:var(--accent)}

/* Layout artículo estilo Tom's Guide: contenido + barra derecha */
@media (min-width:1024px){
  .md-layout{grid-template-columns:minmax(0,1fr) 320px;max-width:1180px;margin:0 auto;column-gap:48px}
  .md-layout > .md-rail:first-child{order:initial;grid-column:auto;position:sticky}
  .md-rail-right{position:sticky;top:100px;align-self:start}
}
.md-inline-widget{margin:28px 0}
.gd-cmp{margin:32px 0}
/* Sticky de la barra lateral: clip no rompe position:sticky (hidden sí) */
html,body{overflow-x:clip}
.md-header{position:relative}
@media (min-width:1024px){.md-rail-right{position:sticky;top:24px}}
