/* smdani-gp — components.css
 * Mobile-first. Breakpoints: 600 / 900 / 1025 (GP desktop = min-width 1025px; mobile menu ≤ 1024 via menu-plus breakpoint).
 * Sections: 1 header/nav  2 hero  3 sections & home hero  4 cards  5 video  6 affiliates (AAWP)  7 rating
 * 8 FAQ  9 footer  10 404  11 timeline/collab/follow/interlinking/divider/mosaic
 */

/* 1. Header / navigation (PLA-01, ERR-04, ERR-09, A11Y-06) ----------------------------------- */
.main-navigation { background: var(--sm-noche); color: var(--sm-blanco); }
.main-navigation .inside-navigation {
  display: flex; align-items: center; flex-wrap: wrap; gap: 0 var(--sm-s3);
  padding: var(--sm-s2) var(--sm-gutter); max-width: var(--sm-w-container); margin-inline: auto;
  transition: padding .2s ease;
}
/* brand: inline SVG bridge + wordmark (MAR-01) */
.navigation-branding { display: flex; align-items: center; margin-right: auto; }
.navigation-branding .main-title, .main-title.sm-brand { margin: 0; font-size: 20px; line-height: 1; }
.sm-brand__link {
  display: inline-flex; align-items: center; gap: 10px; color: var(--sm-blanco); text-decoration: none;
  font-family: var(--sm-font-display); font-weight: 850; font-size: 20px; line-height: 1;
  letter-spacing: .14em; font-stretch: 110%; padding: 6px 0;
}
.sm-brand__link:hover { color: var(--sm-ambar); text-decoration: none; }
.sm-brand__mark { width: 32px; height: 32px; flex: none; color: var(--sm-blanco); transition: height .2s ease, width .2s ease; }
.sm-brand__link:hover .sm-brand__mark { color: var(--sm-ambar); }
/* menu items: Archivo 600 15px, sentence case, amber hover, amber underline on current */
.main-navigation .main-nav ul li a, .main-navigation .menu-toggle, .main-navigation .menu-bar-items {
  font-family: var(--sm-font-display); font-weight: 600; font-size: 15px; color: var(--sm-on-noche); text-decoration: none;
}
.main-navigation .main-nav ul li a { padding: 0 14px; line-height: 64px; transition: line-height .2s ease, color .15s ease; position: relative; }
.main-navigation .main-nav ul li a:hover, .main-navigation .main-nav ul li.sfHover > a, .main-navigation .main-nav ul li:focus-within > a { color: var(--sm-ambar); }
.main-navigation .main-nav > ul > li.current-menu-item > a::after,
.main-navigation .main-nav > ul > li.current-menu-ancestor > a::after,
.main-navigation .main-nav > ul > li.current_page_parent > a::after {
  content: ""; position: absolute; left: 14px; right: 14px; bottom: 12px; height: 3px; border-radius: 2px; background: var(--sm-ambar);
}
.main-navigation .main-nav > ul > li.menu-item-has-children.current-menu-ancestor > a::after { right: 34px; }
.main-navigation .main-nav ul li a:focus-visible { outline-offset: -3px; }
.menu-item-has-children .dropdown-menu-toggle { padding-left: 6px; padding-right: 14px; }
/* submenu panel (ERR-09): raised Noche, shadow, separators, 2 columns when ≥ 9 items (.sm-wide from inc/nav.php) */
.main-navigation ul ul {
  background: var(--sm-noche-2); width: 280px; padding: 8px 0; border-radius: 0 0 10px 10px;
  box-shadow: 0 16px 32px -12px rgba(7,11,63,.6), 0 0 0 1px rgba(255,255,255,.06);
}
.main-navigation .main-nav ul ul li a { padding: 12px 18px; line-height: 1.35; font-size: 15px; border-top: 1px solid rgba(255,255,255,.08); color: var(--sm-on-noche); }
.main-navigation .main-nav ul ul li:first-child > a { border-top: 0; }
.main-navigation .main-nav ul ul li a:hover, .main-navigation .main-nav ul ul li.sfHover > a { background: rgba(255,255,255,.06); color: var(--sm-ambar); }
.main-navigation .main-nav ul ul li.current-menu-item > a { color: var(--sm-ambar); box-shadow: inset 3px 0 0 var(--sm-ambar); }
@media (min-width: 1025px) {
  .main-navigation:not(.toggled) li.sm-wide > ul { display: grid; grid-template-columns: 1fr 1fr; width: 560px; }
  .main-navigation:not(.toggled) li.sm-wide > ul > li:nth-child(2) > a { border-top: 0; }
  .main-navigation:not(.toggled) li.sm-wide > ul > li:nth-child(odd) > a { border-right: 1px solid rgba(255,255,255,.08); }
  .main-navigation.has-branding .main-nav { margin-left: auto; }
  .main-navigation.has-branding .menu-bar-items { margin-left: 0; }
}
/* menu bar items: YouTube icon + «Contactar» (inc/header.php) */
.main-navigation .menu-bar-items { display: flex; align-items: center; gap: 4px; }
.main-navigation .menu-bar-item > a { display: inline-flex; align-items: center; padding: 0 10px; line-height: 64px; color: inherit; text-decoration: none; }
.sm-bar-yt a svg { width: 24px; height: 24px; fill: currentColor; transition: color .15s ease; }
.sm-bar-yt a:hover, .sm-bar-yt a:focus-visible { color: var(--sm-rojo); }
.sm-bar-cta a.sm-btn { min-height: 40px; padding: 9px 14px; margin-left: 8px; line-height: 1; font-size: 14px; }
/* mobile toggle: GP's own <button> (A11Y-06); icon-only, 44px target */
.main-navigation .menu-toggle { padding: 0 10px; line-height: 64px; color: var(--sm-blanco); font-size: 22px; flex-grow: 0; order: 10; }
.main-navigation .menu-toggle .gp-icon svg { width: 1em; height: 1em; }
.main-navigation .menu-toggle .mobile-menu { display: none; }
.main-navigation.toggled .main-nav { background: var(--sm-noche); flex-basis: 100%; order: 20; border-top: 1px solid rgba(255,255,255,.12); margin: 0 calc(-1 * var(--sm-gutter)); padding: 8px 0 12px; }
.main-navigation.toggled .main-nav ul li a { line-height: 1.35; padding: 14px var(--sm-gutter); font-size: 16px; }
.main-navigation.toggled .main-nav ul ul { background: var(--sm-noche-2); width: 100%; box-shadow: none; border-radius: 0; padding: 0; }
.main-navigation.toggled .main-nav ul ul li a { padding-left: calc(var(--sm-gutter) + 16px); font-size: 15px; }
.main-navigation.toggled .main-nav > ul > li.current-menu-item > a::after { display: none; }
.main-navigation.toggled .main-nav > ul > li.current-menu-item > a { box-shadow: inset 4px 0 0 var(--sm-ambar); }
@media (max-width: 600px) { .sm-bar-cta { display: none; } }
/* sticky (GP Premium menu-plus adds .navigation-stick/.is_stuck to #site-navigation): shrink to 56px */
.navigation-stick { box-shadow: 0 6px 18px -14px rgba(7,11,63,.8); }
.navigation-stick .inside-navigation { padding-top: 0; padding-bottom: 0; }
.navigation-stick .main-nav ul li a, .navigation-stick .menu-bar-item > a, .navigation-stick .menu-toggle { line-height: 56px; }
.navigation-stick .sm-brand__mark { width: 26px; height: 26px; }
#sticky-placeholder { background: var(--sm-noche); }
/* skip link on Noche */
.skip-link:focus { background: var(--sm-ambar); color: var(--sm-tinta); }
/* a11y: anchor targets clear the sticky bar */
[id] { scroll-margin-top: 72px; }

/* 2. Hero (PLA-03, MAR-03, MAR-04, PLA-11, MAR-05) ------------------------------------------- */
.sm-hero {
  position: relative; overflow: hidden; background: var(--sm-noche); color: var(--sm-blanco);
  margin: calc(-1 * var(--sm-content-top)) calc(50% - 50vw) var(--sm-s6);
  padding: var(--sm-s6) var(--sm-gutter);
}
.sm-hero__inner { max-width: var(--sm-w-container); margin-inline: auto; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sm-s5); align-items: center; }
.sm-hero .sm-kicker { color: var(--sm-ambar); }
.sm-hero__title { color: var(--sm-blanco); margin: var(--sm-s3) 0 0; }
.sm-hero__sub { font-family: var(--sm-font-text); font-size: clamp(1.05rem, 1rem + .4vw, 1.25rem); line-height: 1.55; color: var(--sm-on-noche-soft); margin: var(--sm-s4) 0 0; max-width: 52ch; }
.sm-hero__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin: var(--sm-s4) 0 0; font-family: var(--sm-font-display); font-weight: 500; font-size: 14px; line-height: 1.2; color: var(--sm-on-noche-muted); }
.sm-hero__meta time { white-space: nowrap; }
.sm-hero__media { margin: 0; position: relative; }
.sm-hero__media img, .sm-hero__thumb { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--sm-r-card); box-shadow: 0 24px 48px -28px rgba(0,0,0,.8); }
.sm-hero__media--video::after {
  content: ""; position: absolute; left: 14px; bottom: 14px; width: 48px; height: 48px; border-radius: 50%;
  background: var(--sm-ambar) var(--sm-play-icon) 55% 50% / 20px no-repeat; box-shadow: 0 2px 8px rgba(0,0,0,.35); pointer-events: none;
}
@media (min-width: 900px) {
  .sm-hero { padding: var(--sm-s7) var(--sm-gutter); }
  .sm-hero__inner { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: var(--sm-s6); }
  .sm-hero--no-media .sm-hero__inner { grid-template-columns: minmax(0, 1fr); }
  .sm-hero--no-media .sm-hero__text { max-width: 60ch; }
}
/* MAR-05 optional rainbow corner stripe */
.sm-hero--rainbow::before {
  content: ""; position: absolute; top: 22px; right: -60px; width: 240px; height: 10px; transform: rotate(45deg);
  background: linear-gradient(90deg, #E5101F, #F6B40C 30%, #2BB673 50%, #0A2BE0 75%, #7B3FE4); opacity: .95;
}
/* legal / about variants: light hero */
.sm-hero--legal, .sm-hero--light { background: var(--sm-superficie); color: var(--sm-tinta); }
.sm-hero--legal .sm-hero__title, .sm-hero--light .sm-hero__title { color: var(--sm-tinta); }
.sm-hero--legal .sm-kicker, .sm-hero--light .sm-kicker { color: var(--sm-azul); }
.sm-hero--legal .sm-hero__sub, .sm-hero--light .sm-hero__sub { color: var(--sm-texto); }
.sm-hero--legal .sm-hero__meta, .sm-hero--light .sm-hero__meta { color: var(--sm-gris); }
.sm-hero + .entry-content { margin-top: 0; }

/* 3. Section bands & home hero (PLA-02, MAR-02, MAR-06) -------------------------------------- */
.sm-section { padding: var(--sm-s7) max(var(--sm-gutter), calc(50% - var(--sm-w-container) / 2)); margin-bottom: 0; }
.sm-section > :first-child { margin-top: 0; }
.sm-section > :last-child { margin-bottom: 0; }
.sm-section--superficie { background: var(--sm-superficie); }
.sm-section--blanco { background: var(--sm-blanco); }
.sm-section--noche, .sm-on-dark { background: var(--sm-noche); color: var(--sm-on-noche-soft); }
.sm-section--noche h1, .sm-section--noche h2, .sm-section--noche h3, .sm-section--noche h4 { color: var(--sm-blanco); }
.sm-section--noche .sm-kicker { color: var(--sm-ambar); }
.sm-section--noche a:not(.wp-block-button__link):not(.sm-pill) { color: var(--sm-blanco); text-decoration-color: var(--sm-ambar); }
.sm-section--noche a:not(.wp-block-button__link):not(.sm-pill):hover { color: var(--sm-ambar); }
.sm-section .sm-intro, .sm-section > p { max-width: 68ch; }
@media (min-width: 900px) { .sm-section { padding-top: var(--sm-s8); padding-bottom: var(--sm-s8); } }
/* home hero: text left, portrait right, gradient Noche → Azul */
.sm-home-hero {
  background: linear-gradient(120deg, #070B3F 0%, #0A1A9C 55%, #0A2BE0 100%); color: var(--sm-blanco);
  padding: var(--sm-s7) max(var(--sm-gutter), calc(50% - var(--sm-w-container) / 2)) 0;
  display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sm-s4); align-items: end; overflow: hidden;
}
.sm-home-hero__text { padding-bottom: var(--sm-s5); }
.sm-home-hero .sm-kicker { color: var(--sm-ambar); }
.sm-home-hero h1 { color: var(--sm-blanco); font-size: clamp(2rem, 1.3rem + 3vw, 3.25rem); margin: var(--sm-s3) 0 0; }
.sm-home-hero .sm-pill { margin-top: var(--sm-s3); }
.sm-home-hero p.sm-pill, .sm-section--noche p.sm-pill, .sm-hero .sm-pill { color: var(--sm-tinta); font-size: 14px; } /* pills stay ink-on-white on dark bands (axe color-contrast) */
.sm-home-hero p { font-size: 17px; line-height: 1.6; color: var(--sm-on-noche-soft); max-width: 46ch; margin: var(--sm-s4) 0 0; }
.sm-home-hero .sm-ctas, .sm-home-hero .wp-block-buttons { margin-top: var(--sm-s5); }
.sm-home-hero__photo { margin: 0; align-self: end; display: flex; justify-content: center; }
.sm-home-hero__photo img {
  width: 100%; max-width: 280px; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: 82% 25%; /* the subject sits on the right third of portada-smdani.webp */
  border-radius: 14px 14px 0 0; box-shadow: 0 0 0 4px rgba(255,255,255,.85); display: block;
}
@media (min-width: 900px) {
  .sm-home-hero { grid-template-columns: minmax(0, 1.25fr) minmax(0, .9fr); gap: var(--sm-s5); }
  .sm-home-hero__text { padding-bottom: var(--sm-s7); }
  .sm-home-hero__photo img { max-width: 360px; }
}
.sm-mosaic { margin: var(--sm-s6) 0; }
.sm-mosaic img { width: 100%; height: auto; border-radius: var(--sm-r-card); display: block; }

/* 4. Cards (PLA-08) ---------------------------------------------------------------------------- */
.sm-cards, .sm-interlinking { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sm-s5) 20px; margin: var(--sm-s5) 0 0; }
@media (min-width: 600px) { .sm-cards, .sm-interlinking { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 900px) { .sm-cards, .sm-interlinking { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.sm-cards--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.sm-card {
  position: relative; display: flex; flex-direction: column; min-width: 0; margin: 0;
  background: var(--sm-blanco); border: 1px solid var(--sm-linea); border-radius: var(--sm-r-card); overflow: hidden;
  transition: box-shadow .2s ease, transform .2s ease;
}
.sm-section--superficie .sm-card, .sm-card--raised { border-color: transparent; box-shadow: var(--sm-shadow); }
.sm-section--noche .sm-card { background: var(--sm-noche-2); border-color: rgba(255,255,255,.08); }
.sm-section--noche .sm-card__title, .sm-section--noche .sm-card__title a { color: var(--sm-blanco); }
.sm-section--noche .sm-card__text { color: var(--sm-on-noche-muted); }
.sm-card:hover { box-shadow: 0 1px 2px rgba(7,11,63,.08), 0 16px 32px -20px rgba(7,11,63,.5); transform: translateY(-2px); }
.sm-card:focus-within { outline: 3px solid var(--sm-ambar); outline-offset: 2px; }
.sm-card__thumb { position: relative; margin: 0; line-height: 0; background: var(--sm-superficie); }
.sm-card__thumb img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; display: block; border-radius: 0; }
.sm-card__thumb::after, .sm-card--video .sm-card__thumb::after {
  content: ""; position: absolute; left: 12px; bottom: 12px; width: 40px; height: 40px; border-radius: 50%;
  background: var(--sm-ambar) var(--sm-play-icon) 56% 50% / 16px no-repeat; box-shadow: 0 2px 6px rgba(0,0,0,.3);
}
.sm-card--plain .sm-card__thumb::after, .sm-interlinking .sm-card__thumb::after, .sm-card--no-play .sm-card__thumb::after { content: none; }
.sm-card__kicker { margin: 14px 16px 0; font-family: var(--sm-font-display); font-weight: 750; font-size: 12px; line-height: 1; font-stretch: 72%; letter-spacing: .12em; text-transform: uppercase; color: var(--sm-azul); }
.sm-card__title { margin: 8px 16px 0; font-family: var(--sm-font-display); font-weight: 750; font-size: 18px; line-height: 1.25; color: var(--sm-tinta); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.sm-card__title a { color: inherit; text-decoration: none; }
.sm-card__title a::after { content: ""; position: absolute; inset: 0; } /* whole card clickable */
.sm-card__title a:focus-visible { outline: 0; } /* the card shows the ring via :focus-within */
.sm-card:hover .sm-card__title a { color: var(--sm-azul); }
.sm-card__text { margin: 6px 16px 18px; font-family: var(--sm-font-text); font-size: 15px; line-height: 1.5; color: var(--sm-gris); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.sm-card > :last-child { margin-bottom: 18px; }
.sm-card__thumb:last-child { margin-bottom: 0; }
.sm-card .sm-pill { margin: 10px 16px 0; align-self: flex-start; }
.sm-card--plain { padding: 20px 0 2px; }
.sm-card--plain .sm-card__kicker { margin-top: 0; }

/* 5. Video (PLA-06, A11Y-04) — WP YouTube Lyte markup: .lyte-wrapper > .lyMe > .lyte > .pL (.tC .tT, .play) */
.sm-video { margin: var(--sm-s6) auto; max-width: var(--sm-w-wide); }
.sm-video .lyte-wrapper { width: 100% !important; max-width: 100% !important; margin: 0 !important; } /* !important: Lyte sets inline width/margin */
.sm-video .lyMe, .sm-video .lyte { width: 100% !important; height: auto !important; aspect-ratio: 16 / 9; } /* !important: Lyte inline width/height */
.sm-video .lyte { position: relative; border-radius: var(--sm-r-card); overflow: hidden; background: var(--sm-noche); box-shadow: var(--sm-shadow); }
.sm-video .lyte .pL { position: absolute; inset: 0; width: 100%; height: 100%; background-size: cover; background-position: center; cursor: pointer; }
.sm-video .lyte .tC { position: absolute; inset: 0 0 auto 0; padding: 14px 16px; background: linear-gradient(rgba(7,11,63,.75), rgba(7,11,63,0)); }
.sm-video .lyte .tT { font-family: var(--sm-font-display); font-weight: 600; font-size: 15px; line-height: 1.3; color: var(--sm-blanco); text-shadow: none; }
.sm-video .lyte .play, .lyte .play.sm-play {
  position: absolute; left: 50%; top: 50%; width: 72px; height: 72px; margin: 0; transform: translate(-50%, -50%); opacity: 1;
  border-radius: 50%; background: var(--sm-ambar) var(--sm-play-icon) 56% 50% / 28px no-repeat !important; /* !important: Lyte's own sprite */
  box-shadow: 0 4px 14px rgba(0,0,0,.35); transition: transform .15s ease;
}
.sm-video .lyte:hover .play, .sm-video .lyte .play:focus-visible { transform: translate(-50%, -50%) scale(1.06); }
.sm-video .lyte .ctrl { display: none; }
.sm-video iframe { display: block; width: 100%; aspect-ratio: 16 / 9; height: auto; border-radius: var(--sm-r-card); }
.sm-video__caption { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; margin: 10px 4px 0; font-family: var(--sm-font-display); font-weight: 500; font-size: 14px; line-height: 1.4; color: var(--sm-gris); }
.sm-video__caption a { color: var(--sm-azul); white-space: nowrap; }
.sm-video__caption a::before { content: "▶ "; color: var(--sm-rojo); font-size: .8em; }

/* 7. Rating box (PLA-11) — WP-PostRatings [ratings] markup ----------------------------------- */
.sm-rating { background: var(--sm-superficie); border-radius: var(--sm-r-card); padding: 20px 24px; margin: var(--sm-s7) 0 var(--sm-s5); text-align: left; }
.sm-rating__label { margin: 0 0 8px; font-family: var(--sm-font-display); font-weight: 700; font-size: 16px; line-height: 1.3; color: var(--sm-tinta); }
.sm-rating .post-ratings, .post-ratings { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; font-family: var(--sm-font-display); font-size: 14px; line-height: 1.3; color: var(--sm-gris); }
.post-ratings img, .post-ratings-loading img { width: 24px !important; height: 24px !important; margin: 0 1px !important; } /* !important: plugin emits width/height=16 attributes and its own CSS */
.post-ratings-text { flex-basis: 100%; }

/* 8. FAQ (Spectra .uagb-faq kept) ----------------------------------------------------------- */
.sm-faq { padding: var(--sm-s5) 0 0; }
.sm-faq h2 { margin-bottom: var(--sm-s4); }
.entry-content .sm-faq .wp-block-uagb-faq .uagb-faq-item, #content .sm-faq .uagb-faq-child__outer-wrap {
  background: var(--sm-blanco); border: 1px solid var(--sm-linea); border-radius: var(--sm-r-card); margin: 0 0 8px; overflow: hidden; box-shadow: none;
}
.entry-content .sm-faq .wp-block-uagb-faq .uagb-faq-questions-button {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 0; padding: 16px 18px; background: transparent; border: 0; border-radius: 0;
  color: var(--sm-tinta); font-family: var(--sm-font-display); font-weight: 700; font-size: 17px; line-height: 1.35; text-align: left; cursor: pointer;
}
.entry-content .sm-faq .wp-block-uagb-faq .uagb-faq-questions-button:hover { background: var(--sm-superficie); color: var(--sm-azul); }
.entry-content .sm-faq .wp-block-uagb-faq .uagb-question { font: inherit; color: inherit; margin: 0; flex: 1 1 auto; }
.entry-content .sm-faq .wp-block-uagb-faq .uagb-faq-icon-wrap { order: 2; flex: none; }
.entry-content .sm-faq .wp-block-uagb-faq .uagb-icon svg { width: 14px; height: 14px; fill: var(--sm-azul); }
.entry-content .sm-faq .wp-block-uagb-faq .uagb-faq-content { padding: 0 18px 18px; margin: 0; background: transparent; }
.entry-content .sm-faq .wp-block-uagb-faq .uagb-faq-content p { font-size: 17px; line-height: 1.6; margin: 0 0 12px; color: var(--sm-texto); }
.entry-content .sm-faq .wp-block-uagb-faq .uagb-faq-content p:last-child { margin-bottom: 0; }

/* 9. Footer (PLA-12, TEC-05) ------------------------------------------------------------------ */
.site-footer { background: var(--sm-noche); }
.sm-footer { background: var(--sm-noche); color: var(--sm-on-noche-muted); padding: var(--sm-s7) var(--sm-gutter) var(--sm-s5); font-family: var(--sm-font-display); font-weight: 500; font-size: 15px; line-height: 1.6; }
.sm-footer__grid { max-width: var(--sm-w-container); margin-inline: auto; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sm-s6) var(--sm-s5); }
.sm-footer__brand .sm-brand__link { padding: 0; }
.sm-footer__motto { font-family: var(--sm-font-text); font-style: italic; font-weight: 400; font-size: 17px; line-height: 1.45; color: var(--sm-blanco); margin: var(--sm-s3) 0 0; max-width: 32ch; }
.sm-footer__heading, .sm-footer__subheading { color: var(--sm-blanco); font-family: var(--sm-font-display); font-weight: 700; font-size: 13px; line-height: 1.2; letter-spacing: .1em; text-transform: uppercase; font-stretch: 80%; margin: 0 0 10px; }
.sm-footer__subheading { color: var(--sm-ambar); font-size: 12px; margin-bottom: 6px; }
.sm-footer ul { list-style: none; margin: 0; padding: 0; }
.sm-footer li { margin: 0 0 4px; padding: 0; }
.sm-footer li::before { content: none; }
.sm-footer a { color: var(--sm-on-noche); text-decoration: none; }
.sm-footer a:hover { color: var(--sm-ambar); text-decoration: underline; text-underline-offset: 3px; }
.sm-footer__sections { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sm-s4); }
.sm-footer__social { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: var(--sm-s4) 0 0; }
.sm-footer__social a { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; }
.sm-footer__social svg { width: 18px; height: 18px; fill: currentColor; flex: none; }
.sm-footer__projects { margin-top: var(--sm-s5); }
.sm-footer__bottom { grid-column: 1 / -1; border-top: 1px solid rgba(255,255,255,.15); padding-top: 14px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 16px; font-size: 13px; line-height: 1.5; color: #A9AEDB; }
.sm-footer__bottom p { margin: 0; }
@media (min-width: 600px) {
  .sm-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sm-footer__brand { grid-column: 1 / -1; }
  .sm-footer__sections { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sm-footer__col--sections { grid-column: 1 / -1; }
}
@media (min-width: 1025px) {
  .sm-footer__grid { grid-template-columns: 1.2fr 2.3fr .8fr .8fr; }
  .sm-footer__brand, .sm-footer__col--sections { grid-column: auto; }
}

/* 10. 404 (ERR-07) ---------------------------------------------------------------------------- */
.sm-404 { max-width: var(--sm-w-wide); margin: 0 auto; padding: var(--sm-s5) 0 var(--sm-s7); }
.sm-404 .sm-kicker { color: var(--sm-azul); }
.sm-404__title { margin: var(--sm-s3) 0 var(--sm-s4); }
.sm-404__text { max-width: 60ch; font-size: var(--sm-fs-body); margin: 0; }
.sm-404 .sm-cards { margin-top: var(--sm-s6); }
.sm-404__actions { margin-top: var(--sm-s6); display: flex; flex-wrap: wrap; gap: 10px; }

/* 11. Timeline, collab pills, follow cards, interlinking, divider, affiliates wrapper ---------- */
.sm-timeline { margin: var(--sm-s6) 0 0; }
.sm-timeline__chapter { position: relative; padding: 0 0 var(--sm-s6) 28px; border-left: 3px solid var(--sm-linea); scroll-margin-top: 80px; }
.sm-timeline__chapter::before { content: ""; position: absolute; left: -10px; top: .35em; width: 17px; height: 17px; border-radius: 50%; background: var(--sm-ambar); box-shadow: 0 0 0 4px var(--sm-blanco); }
.sm-timeline__chapter:last-child { border-left-color: transparent; padding-bottom: 0; }
.sm-timeline__year { display: block; margin: 0 0 6px; font-family: var(--sm-font-display); font-weight: 750; font-size: var(--sm-fs-label); line-height: 1; font-stretch: 72%; letter-spacing: .12em; text-transform: uppercase; color: var(--sm-azul); }
.sm-timeline__chapter > h2 { margin-top: 0; }
@media (min-width: 900px) { .sm-timeline__chapter { padding-left: 40px; } }
.sm-collab { display: flex; flex-wrap: wrap; gap: 8px; margin: var(--sm-s4) 0 0; padding: 0; list-style: none; }
.sm-collab > li, .sm-collab > p, .sm-collab > span, .sm-collab > a { margin: 0; }
.sm-collab > li::before { content: none; }
.sm-collab .sm-pill, .sm-collab > li, .sm-collab > span, .sm-collab > a { display: inline-flex; align-items: center; gap: 6px; background: var(--sm-blanco); color: var(--sm-tinta); font-family: var(--sm-font-display); font-weight: 700; font-size: 14px; line-height: 1.2; padding: 8px 12px; border: 1px solid var(--sm-linea); border-radius: 8px; text-decoration: none; }
.sm-section--noche .sm-collab > * { border-color: transparent; box-shadow: 0 2px 0 rgba(0,0,0,.2); }
.sm-follow { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; margin: var(--sm-s5) 0 0; }
@media (min-width: 600px) { .sm-follow { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.sm-follow > * { margin: 0; padding: 24px; background: var(--sm-blanco); border: 1px solid var(--sm-linea); border-top: 4px solid var(--sm-azul); border-radius: var(--sm-r-card); box-shadow: var(--sm-shadow); }
.sm-follow > .sm-follow__youtube, .sm-follow > .sm-follow__card--youtube { border-top-color: var(--sm-rojo); }
.sm-follow > * > h3, .sm-follow > * > h2 { margin: 0 0 8px; font-size: 1.25rem; }
.sm-follow > * > p { margin: 0 0 16px; font-size: 16px; color: var(--sm-gris); }
.sm-follow > * > :last-child { margin-bottom: 0; }
.sm-interlinking { margin: var(--sm-s6) 0 0; }
.sm-interlinking .sm-card__title { -webkit-line-clamp: 2; }
/* MAR-07 curved divider: only between dark (top) and light (bottom) bands */
.sm-divider-curve { height: 48px; margin: 0; line-height: 0; background: var(--sm-noche) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 48' preserveAspectRatio='none'%3E%3Cpath d='M0 48C300 0 900 0 1200 48Z' fill='%23fff'/%3E%3C/svg%3E") center bottom / 100% 100% no-repeat; }
.sm-divider-curve--superficie { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 48' preserveAspectRatio='none'%3E%3Cpath d='M0 48C300 0 900 0 1200 48Z' fill='%23F3F4FA'/%3E%3C/svg%3E"); }
.sm-divider-curve--azul { background-color: var(--sm-azul); }
/* affiliates wrapper (PLA-07): «Material que uso» on Superficie + disclosure */
.sm-affiliates { background: var(--sm-superficie); border-radius: var(--sm-r-card); padding: var(--sm-s5); margin: var(--sm-s6) auto; max-width: var(--sm-w-wide); }
.sm-affiliates > h2, .sm-affiliates > h3 { margin: 0 0 var(--sm-s4); }
.sm-affiliates__note, .sm-affiliates > p:last-child { margin: var(--sm-s4) 0 0; font-family: var(--sm-font-display); font-weight: 500; font-size: 13px; line-height: 1.4; color: var(--sm-gris); }
@media (min-width: 900px) { .sm-affiliates { padding: var(--sm-s6); } }

/* 6. AAWP 3.x (ERR-03, PLA-07, A11Y-03, TEC-03) — last on purpose, higher specificity than the plugin CSS */
.entry-content .aawp .aawp-grid, .entry-content .aawp-grid {
  display: grid !important; /* !important: AAWP uses flex + percentage widths */
  grid-template-columns: minmax(0, 1fr); gap: 12px; margin: 0; padding: 0; align-items: stretch;
}
.entry-content .aawp-grid__item, .entry-content .aawp-grid .aawp-grid__item {
  width: auto !important; max-width: none !important; flex: none !important; padding: 0 !important; margin: 0 !important; height: auto !important; /* !important: AAWP inline/column widths (keeps the old CLS fix) */
}
.entry-content .aawp .aawp-product, .entry-content .aawp-product.aawp-product--vertical {
  position: relative; display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 12px 14px; align-items: start;
  height: auto !important; /* !important: keeps the CLS fix from Additional CSS */
  margin: 0; padding: 14px; background: var(--sm-blanco); border: 1px solid var(--sm-linea); border-radius: var(--sm-r-card); box-shadow: none;
  font-family: var(--sm-font-display); text-align: left;
}
.entry-content .aawp-product > *:not(.aawp-product__thumb):not(.aawp-product__ribbon) { min-width: 0; }
.entry-content .aawp-product .aawp-product__thumb, .entry-content .aawp-product [class*="aawp-product__thumb"] {
  grid-row: 1 / span 3; aspect-ratio: 1 / 1; width: 100%; min-height: 0; border-radius: var(--sm-r-img); background: var(--sm-superficie);
  display: grid; place-items: center; overflow: hidden; padding: 6px;
}
.entry-content .aawp-product .aawp-product__image--link { display: block; width: 100%; height: 100%; min-height: 0; }
.entry-content .aawp-product .aawp-product__image, .entry-content .aawp-product .aawp-product__thumb img {
  display: block; width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; min-height: 0;
}
.entry-content .aawp-product .aawp-product__title, .entry-content .aawp-product [class*="aawp-product__title"] {
  margin: 0; font-family: var(--sm-font-display); font-weight: 700; font-size: 15px; line-height: 1.3; color: var(--sm-tinta);
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.entry-content .aawp-product .aawp-product__title a { color: inherit; text-decoration: none; }
.entry-content .aawp-product .aawp-product__title a:hover { color: var(--sm-azul); text-decoration: underline; }
.entry-content .aawp-product .aawp-product__description { display: none; }
.entry-content .aawp-product .aawp-product__info, .entry-content .aawp-product .aawp-product__rating { font-size: 13px; color: var(--sm-gris); margin: 0; }
.entry-content .aawp-product .aawp-star-rating, .entry-content .aawp-product [class*="aawp-star-rating"] { color: var(--sm-ambar); }
.entry-content .aawp-product .aawp-product__footer { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0; padding: 0; border: 0; }
.entry-content .aawp-product .aawp-product__pricing { margin: 0; line-height: 1; }
.entry-content .aawp-product .aawp-product__price { font-family: var(--sm-font-display); font-weight: 700; font-size: 16px; color: var(--sm-tinta); font-variant-numeric: tabular-nums; }
.entry-content .aawp-product .aawp-product__price--old { font-weight: 500; font-size: 13px; color: var(--sm-gris); text-decoration: line-through; margin-right: 6px; }
.entry-content .aawp-product .aawp-product__price--current { color: var(--sm-tinta); }
/* ribbons: amber on Noche, 12px caps (A11Y-03) */
.entry-content .aawp-product .aawp-product__ribbon, .entry-content .aawp [class*="aawp-product__ribbon"] {
  position: absolute; top: 10px; left: 10px; z-index: 1; margin: 0; transform: none; width: auto;
  background: var(--sm-noche) !important; color: var(--sm-ambar) !important; /* !important: AAWP ribbon colours are hard-coded per modifier */
  font-family: var(--sm-font-display); font-weight: 700; font-size: 12px; line-height: 1; letter-spacing: .06em; text-transform: uppercase;
  padding: 5px 7px; border-radius: 4px; box-shadow: none;
}
.entry-content .aawp-product .aawp-product__ribbon--sale { background: var(--sm-ambar) !important; color: var(--sm-tinta) !important; } /* !important: see above */
/* buttons: affiliate amber (SIS-05) */
.entry-content .aawp .aawp-button, .entry-content .aawp-product .aawp-button, .entry-content .aawp-button.aawp-button--amazon, .entry-content [class*="aawp-button"] {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 10px 16px; margin: 0;
  background: var(--sm-ambar) !important; background-image: none !important; color: var(--sm-tinta) !important; border: 0 !important; /* !important: AAWP button gradients, borders and colours */
  border-radius: var(--sm-r-btn); box-shadow: none !important; text-shadow: none !important; /* !important: AAWP button shadows */
  font-family: var(--sm-font-display); font-weight: 700; font-size: 14px; line-height: 1; text-decoration: none;
}
.entry-content [class*="aawp-button"]:hover { background: #E3A300 !important; color: var(--sm-tinta) !important; } /* !important: pairs with the rule above */
.entry-content .aawp a:focus-visible, .entry-content .aawp-button:focus-visible { outline: 3px solid var(--sm-ambar) !important; outline-offset: 2px !important; } /* !important: AAWP sets outline:none (A11Y-01) */
.entry-content .aawp .aawp-disclaimer, .entry-content .aawp-disclaimer { font-size: 12px; color: var(--sm-gris); }
@media (min-width: 600px) {
  .entry-content .aawp .aawp-grid, .entry-content .aawp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .entry-content .aawp .aawp-product, .entry-content .aawp-product.aawp-product--vertical { grid-template-columns: minmax(0, 1fr); align-content: start; }
  .entry-content .aawp-product .aawp-product__thumb, .entry-content .aawp-product [class*="aawp-product__thumb"] { grid-row: auto; padding: 12px; }
  .entry-content .aawp-product .aawp-product__description { display: block; font-size: 14px; line-height: 1.45; color: var(--sm-texto); font-family: var(--sm-font-text); }
  .entry-content .aawp-product .aawp-product__description ul { margin: 0; padding-left: 1.1em; list-style: disc; }
  .entry-content .aawp-product .aawp-product__description li { margin: 0 0 2px; padding: 0; }
  .entry-content .aawp-product .aawp-product__description li::before { content: none; }
  .entry-content .aawp-product .aawp-product__footer { margin-top: auto; }
}
@media (min-width: 1025px) {
  .entry-content .aawp .aawp-grid, .entry-content .aawp-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .entry-content .aawp-grid--cols-2, .entry-content .aawp-grid[class*="cols-2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .entry-content .aawp-grid--cols-3, .entry-content .aawp-grid[class*="cols-3"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
/* standalone box products (26727) share a grid inside .sm-affiliates__grid */
.sm-affiliates .aawp + .aawp { margin-top: 12px; }
@media (min-width: 600px) {
  .sm-affiliates__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .sm-affiliates__grid .aawp + .aawp { margin-top: 0; }
}
@media (min-width: 1025px) { .sm-affiliates__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* AAWP: the "saved" amount ships white on a light badge (2.3:1); ink on ámbar instead. A11Y-03/A11Y-07. */
.entry-content .aawp-product__price--saved { color: var(--sm-tinta) !important; background: var(--sm-ambar) !important; border-radius: 4px; padding: 2px 6px; } /* !important: AAWP inline/plugin CSS */
.entry-content .aawp-product__reviews, .entry-content .aawp-product__price, .entry-content .aawp-disclaimer { font-size: 14px; }

/* Specificity fixes vs content.css image defaults (design-system review 2026-10-01) */
.entry-content figure.sm-card__thumb { margin: 0; }
.entry-content .sm-card__thumb img { border-radius: 0; }
.entry-content .wp-block-image.sm-mosaic img { border-radius: var(--sm-r-card); }
