*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;line-height:1.7;color:#111;background:#fff}
.Hero_block__p3JYC{max-width:900px;margin:0 auto;padding:0 28px}
.Card_title__UDT8O{background:#111;color:#fff;padding:64px 0;margin-bottom:48px}
.Card_title__UDT8O h1{font-size:42px;font-weight:800;letter-spacing:-1px;margin-bottom:8px}
.Card_title__UDT8O p{font-size:18px;opacity:.7}
.Card_title__UDT8O a{color:#fff;text-decoration:none;font-size:22px;font-weight:800}
.Content_wrap__rINNe{padding:0}
.Wrapper_body__FSWhY{padding:32px 0;border-left:4px solid #111;padding-left:24px;margin-bottom:28px}
.Wrapper_body__FSWhY h2{font-size:24px;font-weight:700;margin-bottom:6px}
.Wrapper_body__FSWhY h2 a{color:#111;text-decoration:none}
.Wrapper_body__FSWhY h2 a:hover{text-decoration:underline}
.Wrapper_body__FSWhY .Layout_text__VTtis{font-size:12px;font-weight:600;text-transform:uppercase;color:#888;letter-spacing:1px;margin-bottom:8px}
.Wrapper_body__FSWhY p{font-size:15px;color:#444;margin-bottom:10px}
.Article_body__J4eED{display:inline-block;background:#111;color:#fff;padding:8px 20px;font-size:13px;font-weight:700;text-decoration:none;text-transform:uppercase;letter-spacing:1px}
.Article_body__J4eED:hover{background:#333}
.Footer_box__UhsWG{padding-bottom:60px}
.Footer_box__UhsWG h1{font-size:38px;font-weight:800;letter-spacing:-1px;margin-bottom:10px}
.Footer_box__UhsWG time{font-size:12px;font-weight:600;text-transform:uppercase;color:#888;letter-spacing:1px;display:block;margin-bottom:28px}
.Footer_box__UhsWG h2{font-size:26px;font-weight:700;margin:40px 0 14px}
.Footer_box__UhsWG h3{font-size:20px;font-weight:700;margin:32px 0 10px}
.Footer_box__UhsWG p{margin-bottom:18px;font-size:17px}
.Footer_box__UhsWG ul,.Footer_box__UhsWG ol{margin:0 0 18px 24px}
.Footer_box__UhsWG a{color:#111;font-weight:600;text-decoration:underline}
.Footer_box__UhsWG img{max-width:100%;height:auto;margin:20px 0}
.Page_head__Blr9N{background:#111;color:#888;padding:28px 0;margin-top:48px;text-align:center;font-size:12px}
.Page_head__Blr9N a{color:#888;text-decoration:none}
.Banner_body__BHQ21{background:#222;color:#aaa;padding:14px 20px;margin-bottom:24px;font-size:13px;font-style:italic}
.Module_text__ITSM1{background:#1a1a1a;color:#888;padding:14px 20px;margin-top:32px;font-size:12px;border-top:3px solid #444}
.Article_root__EQlsp{font-size:12px;font-weight:600;text-transform:uppercase;color:#666;letter-spacing:1px;margin:-20px 0 28px;padding-left:12px;border-left:2px solid #ccc}
.Section_block__CTR6o{margin:0 0 24px}
.Page_inner__gtKnZ{width:100%;height:auto;border-radius:0}
.Wrapper_content__FPBq3{border-left:4px solid #111;padding-left:24px;margin-top:48px}
.Wrapper_content__FPBq3 h3{font-size:18px;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:12px}
.Wrapper_content__FPBq3 ul{list-style:none;padding:0}
.Wrapper_content__FPBq3 li{padding:6px 0}
.Wrapper_content__FPBq3 a{color:#111;text-decoration:underline;font-weight:600}
.Footer_area__4LIqH{border-left:4px solid #ddd;padding-left:24px;margin-top:36px}
.Footer_area__4LIqH ul{list-style:none;padding:0}
.Footer_area__4LIqH li{padding:6px 0;font-size:16px}
.Footer_area__4LIqH a{color:#111;text-decoration:none;font-weight:600}
.Footer_area__4LIqH a:hover{text-decoration:underline}
.Footer_area__4LIqH .Layout_text__VTtis{margin:0 0 0 8px}
/* === Theme === */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&family=Playfair+Display:wght@400;700&display=swap');
body{font-family:'Montserrat',sans-serif;color:#2D2D2D;background:#FFF9FB}
.Card_title__UDT8O{background:#4A154B;color:#fff}
.Card_title__UDT8O h1{font-family:'Playfair Display',serif;color:#fff}
.Card_title__UDT8O p{color:rgba(255,255,255,.75)}
.Card_title__UDT8O a{color:#fff;text-decoration:none}
.card h2{font-family:'Playfair Display',serif}
.card h2 a{color:#4A154B}
.card h2 a:hover{color:#D81B60}
.read-more{color:#D81B60}
.article-content h1{font-family:'Playfair Display',serif}
.article-content h2{font-family:'Playfair Display',serif}
.article-content a{color:#D81B60}
.article-content img{border-radius:8px}
.affiliate-disclosure{border-radius:8px}
.ymyl-disclaimer{border-radius:8px}
/* === Custom === */
/*
 * un-nail-es — custom.css
 * Palette  : vino profundo + magenta esmalte (nail-polish tones, not spa-clinical)
 * Fonts    : Playfair Display (display/serif) + Montserrat (text + tracked meta)
 * Template : bold
 */

/* ─── Design tokens ─────────────────────────────────────────── */
:root {
  --color-primary:       #4A0E2E;
  --color-primary-dark:  #2E0A1D;
  --color-accent:        #D81B60;
  --color-accent-dark:   #A8134A;
  --color-bg:            #FFF9FB;
  --color-surface:       #FDEEF3;
  --color-text:          #2B1B22;
  --color-muted:         #7C5C68;
  --color-border:        #F0D3DE;
  --color-link:          #D81B60;
  --color-link-hover:    #A8134A;
  --color-header-bg:     #4A0E2E;
  --color-header-text:   #FFF6F9;
  --color-footer-bg:     #2E0A1D;
  --color-footer-text:   #E3B9C9;

  --font-heading:        'Playfair Display', Georgia, serif;
  --font-body:            'Montserrat', system-ui, sans-serif;
  --font-size-base:       18px;
  --font-size-sm:         15px;
  --line-height-body:     1.7;
  --line-height-heading:  1.25;

  --border-radius:        8px;
  --max-w-wide:         1100px;
}

/* ─── Reset / base ──────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html, body { overflow-x: hidden; }

:root body {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--font-size-base);
  line-height: var(--line-height-body);
  color: var(--color-text);
  background-color: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
:root img { max-width: 100%; height: auto; }
:root ::selection { background-color: rgba(216, 27, 96, 0.20); color: var(--color-text); }

:root h1, :root h2, :root h3, :root h4 {
  font-family: var(--font-heading);
  font-weight: 700;
  line-height: var(--line-height-heading);
  color: var(--color-primary);
  margin: 1.5em 0 0.55em;
}
:root h1 { font-size: clamp(1.9rem, 4vw, 2.5rem); margin-top: 0; }
:root h2 { font-size: clamp(1.4rem, 3vw, 1.85rem); margin-top: 1.7em; }
:root h3 { font-size: clamp(1.15rem, 2.5vw, 1.35rem); font-weight: 600; }
:root h4 { font-size: 1.05rem; font-weight: 600; font-style: italic; }

:root p { max-width: 68ch; margin: 0 0 1.2em; }
:root a {
  color: var(--color-link);
  text-decoration: underline;
  text-decoration-color: var(--color-accent-dark);
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  font-weight: 500;
  transition: color 0.2s ease;
}
:root a:hover { color: var(--color-link-hover); }
:root strong, :root b { color: var(--color-primary); font-weight: 700; }
:root em { font-style: italic; }

:root ul, :root ol { padding-left: 1.5em; margin: 0 0 1.2em; max-width: 66ch; }
:root li { margin-bottom: 0.5em; line-height: var(--line-height-body); }
:root li::marker { color: var(--color-accent-dark); }

:root blockquote {
  border-left: 3px solid var(--color-accent);
  padding: 1.1em 1.6em;
  margin: 2em 0;
  background-color: var(--color-surface);
  border-radius: 0 var(--border-radius) var(--border-radius) 0;
  font-style: italic;
  color: var(--color-primary);
}
:root blockquote p { margin-bottom: 0; max-width: none; }
:root hr { border: none; border-top: 1px solid var(--color-border); margin: 2.5em auto; max-width: 32ch; }

:root time { font-size: var(--font-size-sm); color: var(--color-muted); }
:root table { width: 100%; border-collapse: collapse; margin: 2.2em 0; }
:root th, :root td { padding: 0.75em 0.6em; text-align: left; border-bottom: 1px solid var(--color-border); }
:root tr:nth-child(even) { background-color: var(--color-surface); }

/* === QA round-1 fixes (2026-07-21T20:38:43+0800) === */

/* ------------------------------------------------------------------
   EDITORIAL SIGNATURE PASS — "Manicurismo" / Antonia Buendía, Puebla.
   Palette unchanged (vino #4A0E2E + magenta esmalte #D81B60); the QA
   note was that magenta only surfaced in one badge, so it is promoted
   to the page-level moment colour: masthead rule, hero drop cap, the
   two band labels, the dinkus. Signature: an almond-nail mark (inline
   SVG) in the masthead, again as the article dinkus, again in the
   footer. Structure: hero → "Selección de Antonia" band → archive grid.
   Selectors are element/structural only (the deploy obfuscates class
   names) and carry two class-weight units (:root + :nth-of-type) so
   they outrank the template's `.hash h2` descendant pairs.
   Homepage scope = main:has(>div>h2); article/page scope =
   main:has(>article); title block = main:has(>hgroup).
   ------------------------------------------------------------------ */

/* --- 1. WEBFONTS -------------------------------------------------
   site.css concatenates template → theme → custom, so the two @import
   rules that used to live here landed after style rules and Chromium
   dropped them: the site was rendering in system fallbacks. @font-face
   is position-independent, so declare the faces instead. ----------- */
@font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 400 800; font-display: swap; src: url(https://fonts.gstatic.com/s/playfairdisplay/v40/nuFiD-vYSZviVYUb_rj3ij__anPXDTzYgEM86xQ.woff2) format('woff2'); }
@font-face { font-family: 'Playfair Display'; font-style: italic; font-weight: 400 600; font-display: swap; src: url(https://fonts.gstatic.com/s/playfairdisplay/v40/nuFkD-vYSZviVYUb_rj3ij__anPXDTnogkk7yRZrPA.woff2) format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 300 800; font-display: swap; src: url(https://fonts.gstatic.com/s/montserrat/v31/JTUSjIg1_i6t8kCHKm459WlhyyTh89Y.woff2) format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: italic; font-weight: 400; font-display: swap; src: url(https://fonts.gstatic.com/s/montserrat/v31/JTUFjIg1_i6t8kCHKm459Wx7xQYXK0vOoz6jq6R9WXh0ppC8MLnbtg.woff2) format('woff2'); }

/* --- 2. SIGNATURE MARK + shared measure --------------------------- */
:root {
  --nail-mark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 32'%3E%3Cpath d='M12 1.5C16.8 9 20.5 17.5 20.5 22c0 5.2-3.8 8.6-8.5 8.6S3.5 27.2 3.5 22C3.5 17.5 7.2 9 12 1.5z' fill='%23D81B60'/%3E%3Cpath d='M4.9 24.4c2.3-2.7 11.9-2.7 14.2 0' fill='none' stroke='%23FFF6F9' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  --nail-dinkus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 18'%3E%3Cg fill='%234A0E2E' fill-opacity='.4'%3E%3Cpath d='M6 1.2C8.4 5.6 10.5 9.7 10.5 12c0 2.8-2 4.6-4.5 4.6S1.5 14.8 1.5 12C1.5 9.7 3.6 5.6 6 1.2z'/%3E%3Cpath d='M58 1.2c2.4 4.4 4.5 8.5 4.5 10.8 0 2.8-2 4.6-4.5 4.6s-4.5-1.8-4.5-4.6c0-2.3 2.1-6.4 4.5-10.8z'/%3E%3C/g%3E%3Cpath d='M32 .5c2.7 5 5 9.6 5 12.1 0 3.1-2.2 5.1-5 5.1s-5-2-5-5.1c0-2.5 2.3-7.1 5-12.1z' fill='%23D81B60'/%3E%3C/svg%3E");
  --editorial-w: min(1140px, 92vw);
}

/* --- 3. MASTHEAD -------------------------------------------------
   No usable /theme-assets photo (both 404), so the masthead is built
   from lacquer-deep wine gradients + the nail mark + an italic
   manifesto line in Antonia's voice. ------------------------------ */
:root > body > div:first-child {
  background-color: var(--color-primary);
  background-image:
    radial-gradient(120% 130% at 50% -20%, rgba(216, 27, 96, 0.30) 0%, rgba(216, 27, 96, 0) 58%),
    linear-gradient(168deg, #5C1338 0%, #4A0E2E 52%, #2A0919 100%);
  padding: 74px 0 58px;
  margin-bottom: 66px;
  border-bottom: 3px solid var(--color-accent);
  text-align: center;
}
:root > body > div:first-child > div:nth-of-type(1) { max-width: var(--editorial-w); margin: 0 auto; padding: 0 28px; }
:root > body > div:first-child > div:nth-of-type(1):has(> h1)::before { content: ""; display: block; width: 26px; height: 35px; margin: 0 auto 22px; background: var(--nail-mark) center / contain no-repeat; }
:root > body > div:first-child > div:nth-of-type(1) > h1 { font-family: var(--font-heading); font-style: italic; font-weight: 500; font-size: clamp(46px, 8.5vw, 82px); line-height: 0.98; letter-spacing: -0.025em; color: var(--color-header-text); margin: 0; }
:root > body > div:first-child > div:nth-of-type(1) > h1::before { content: "PUEBLA, M\0000C9XICO\0000A0\0000B7\0000A0MANICURISTA AUTODIDACTA"; display: block; font-family: var(--font-body); font-style: normal; font-size: 10.5px; font-weight: 700; letter-spacing: 0.34em; text-indent: 0.34em; color: rgba(255, 246, 249, 0.62); margin-bottom: 20px; }
/* the long SEO description drops back to a quiet deck */
:root > body > div:first-child > div:nth-of-type(1) > p:nth-of-type(1) { font-family: var(--font-body); font-size: 13.5px; line-height: 1.6; color: rgba(255, 246, 249, 0.56); max-width: 62ch; margin: 20px auto 0; }
/* manifesto — the one-sentence promise of the site */
:root > body > div:first-child > div:nth-of-type(1):has(> h1)::after { content: "Lo que cuesta cada set, lo que deja, y lo que no te dicen en el curso."; display: block; width: fit-content; max-width: 46ch; margin: 26px auto 0; padding-top: 22px; border-top: 2px solid var(--color-accent); font-family: var(--font-heading); font-style: italic; font-size: clamp(17px, 2.2vw, 21px); line-height: 1.4; color: rgba(255, 246, 249, 0.9); }
/* article / static-page masthead: compact wordmark, left aligned */
:root > body > div:first-child:has(> div > a) { padding: 34px 0 30px; margin-bottom: 46px; text-align: left; }
:root > body > div:first-child > div:nth-of-type(1) > a { font-family: var(--font-heading); font-style: italic; font-weight: 500; font-size: 27px; letter-spacing: -0.015em; color: var(--color-header-text); text-decoration: none; display: inline-flex; align-items: center; gap: 11px; }
:root > body > div:first-child > div:nth-of-type(1) > a::before { content: ""; width: 15px; height: 20px; background: var(--nail-mark) center / contain no-repeat; }

/* --- 4. HOMEPAGE: base card (hairlines + typography, no boxes) ---- */
:root main:nth-of-type(1):has(> div > h2) { max-width: var(--editorial-w); margin: 0 auto; padding: 0 28px 8px; }
:root main:nth-of-type(1):has(> div > h2) > div { background: transparent; border: 0; border-radius: 0; padding: 0; margin: 0 0 40px; box-shadow: none; position: relative; }
:root main:nth-of-type(1):has(> div > h2) > div > p:nth-of-type(1) { font-family: var(--font-body); font-size: 10.5px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--color-accent-dark); margin: 0 0 12px; max-width: none; }
:root main:nth-of-type(1):has(> div > h2) > div > h2 { font-family: var(--font-heading); font-weight: 700; font-size: 23px; line-height: 1.16; letter-spacing: -0.012em; margin: 0 0 12px; padding: 0; border: 0; max-width: 30ch; }
:root main:nth-of-type(1):has(> div > h2) > div > h2::before { content: none; }
:root main:nth-of-type(1):has(> div > h2) > div > h2 > a { color: var(--color-primary); text-decoration: none; font-weight: 700; background-image: linear-gradient(var(--color-accent), var(--color-accent)); background-size: 0 2px; background-position: 0 100%; background-repeat: no-repeat; transition: background-size 0.32s ease, color 0.2s ease; }
:root main:nth-of-type(1):has(> div > h2) > div > h2 > a:hover { color: var(--color-accent); background-size: 100% 2px; }
:root main:nth-of-type(1):has(> div > h2) > div > p:nth-of-type(2) { font-family: var(--font-body); font-size: 14.5px; line-height: 1.62; color: var(--color-muted); margin: 0 0 16px; max-width: 54ch; }
/* CTA: the template ships an English "Read Now" label on a Spanish
   site — swap the rendered label; the anchor and its target are kept. */
:root main:nth-of-type(1):has(> div > h2) > div > a { display: inline-block; background: transparent; color: var(--color-accent-dark); border: 0; border-radius: 0; padding: 0; font-size: 0; letter-spacing: 0; text-decoration: none; transition: color 0.18s ease, background-color 0.18s ease; }
:root main:nth-of-type(1):has(> div > h2) > div > a::after { content: "LEER LA NOTA\0000A0\002192"; font-family: var(--font-body); font-size: 11px; font-weight: 700; letter-spacing: 0.16em; }
:root main:nth-of-type(1):has(> div > h2) > div > a:hover { color: var(--color-accent); background: transparent; }

/* --- 5. THE HERO MOMENT (newest post) ---------------------------- */
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1) { padding: 4px 0 46px; margin-bottom: 46px; border-bottom: 3px double var(--color-border); }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1) > h2 { font-size: clamp(34px, 5.4vw, 60px); line-height: 1.02; letter-spacing: -0.022em; max-width: 17ch; margin: 0 0 22px; }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1) > p:nth-of-type(1) { font-size: 11px; color: var(--color-accent); margin-bottom: 18px; }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1) > p:nth-of-type(2) { font-family: var(--font-heading); font-size: 19px; line-height: 1.52; color: var(--color-text); max-width: 46ch; margin-bottom: 26px; }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1) > p:nth-of-type(2)::first-letter { float: left; font-family: var(--font-heading); font-size: 3.5em; line-height: 0.8; font-weight: 700; color: var(--color-accent); margin: 6px 10px 0 0; }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1)::before { content: "LA M\0000C1S RECIENTE"; display: inline-block; font-family: var(--font-body); font-size: 10px; font-weight: 700; letter-spacing: 0.28em; color: var(--color-accent-dark); border: 1px solid var(--color-accent); border-radius: 999px; padding: 6px 15px 5px; margin-bottom: 22px; }
/* metadata rail — keeps the full-width hero row from sitting half empty */
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1)::after { content: "POR ANTONIA BUEND\0000CDA\00000AMANICURISTA EN CASA\00000APUEBLA, MX"; display: block; white-space: pre-line; font-family: var(--font-body); font-size: 10px; font-weight: 700; letter-spacing: 0.24em; line-height: 2.1; color: var(--color-muted); margin-top: 30px; padding-top: 16px; border-top: 1px solid var(--color-border); }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1) > a { border: 1px solid var(--color-primary); border-radius: 999px; padding: 13px 28px 12px; color: var(--color-primary); }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1) > a::after { content: "LEER LA NOTA COMPLETA\0000A0\002192"; font-size: 11.5px; }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1) > a:hover { background-color: var(--color-primary); border-color: var(--color-primary); color: #FFF6F9; }

/* --- 6. SELECCIÓN DE ANTONIA (cards 2-4) — the change of gear ---- */
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(n+2):nth-of-type(-n+4) { background-color: #FFFFFF; border-top: 2px solid var(--color-primary); padding: 24px 24px 26px; box-shadow: 0 2px 14px rgba(74, 14, 46, 0.06); }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(n+2):nth-of-type(-n+4) > h2 { font-size: 20px; }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(n+2):nth-of-type(-n+4) > p:nth-of-type(2) { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(n+2):nth-of-type(-n+4) > p:nth-of-type(1)::before { display: block; font-family: var(--font-heading); font-style: italic; font-size: 30px; font-weight: 400; letter-spacing: 0; line-height: 1; color: var(--color-primary); opacity: 0.42; margin-bottom: 8px; }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(2) > p:nth-of-type(1)::before { content: "I"; }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(3) > p:nth-of-type(1)::before { content: "II"; }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(4) > p:nth-of-type(1)::before { content: "III"; }
/* band label anchored above the row so it grows upward when it wraps */
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(2)::before { content: "LO QUE LEER\0000CDA PRIMERO\0000A0\002014\0000A0SELECCI\0000D3N DE ANTONIA"; position: absolute; left: 0; bottom: calc(100% + 18px); width: 100%; padding-bottom: 10px; border-bottom: 1px solid var(--color-border); font-family: var(--font-body); font-size: 10.5px; font-weight: 700; letter-spacing: 0.28em; color: var(--color-accent); }

/* --- 7. CHRONOLOGICAL ARCHIVE (cards 5+) ------------------------- */
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(n+5):not(:last-of-type) { border-top: 1px solid var(--color-border); padding: 26px 0 4px; margin-bottom: 0; }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(n+5):not(:last-of-type) > h2 { font-size: 20px; }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(n+5):not(:last-of-type) > p:nth-of-type(2) { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
:root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(5)::before { content: "TODAS LAS NOTAS, EN ORDEN"; position: absolute; left: 0; bottom: calc(100% + 20px); width: 100%; padding-bottom: 10px; border-bottom: 2px solid var(--color-primary); font-family: var(--font-body); font-size: 10.5px; font-weight: 700; letter-spacing: 0.28em; color: var(--color-primary); }

/* --- 8. OLDER-POSTS LIST (was reading as an unstyled widget) ----- */
:root main:nth-of-type(1):has(> div > h2) > div:last-of-type { border-left: 0; border-top: 3px double var(--color-border); padding: 34px 0 0; margin: 56px 0 0; }
:root main:nth-of-type(1):has(> div > h2) > div:last-of-type::before { content: "DEL ARCHIVO\0000A0\002014\0000A0NOTAS ANTERIORES"; display: block; font-family: var(--font-body); font-size: 10.5px; font-weight: 700; letter-spacing: 0.28em; color: var(--color-accent-dark); margin-bottom: 20px; }
:root main:nth-of-type(1):has(> div > h2) > div:last-of-type > ul { list-style: none; padding: 0; margin: 0; max-width: none; }
:root main:nth-of-type(1):has(> div > h2) > div:last-of-type > ul > li { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; padding: 12px 0; margin: 0; border-bottom: 1px dotted var(--color-border); }
:root main:nth-of-type(1):has(> div > h2) > div:last-of-type > ul > li > a { font-family: var(--font-heading); font-size: 17px; font-weight: 700; line-height: 1.3; color: var(--color-primary); text-decoration: none; }
:root main:nth-of-type(1):has(> div > h2) > div:last-of-type > ul > li > a:hover { color: var(--color-accent); }
:root main:nth-of-type(1):has(> div > h2) > div:last-of-type > ul > li > span:nth-of-type(1) { flex: none; font-family: var(--font-body); font-size: 10px; font-weight: 700; letter-spacing: 0.18em; color: var(--color-muted); margin: 0; }

/* --- 9. DESKTOP GRID: hero (1 row) → picks (3 up) → archive (2 up) */
@media (min-width: 900px) {
  :root main:nth-of-type(1):has(> div > h2) { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); column-gap: 40px; row-gap: 0; align-items: start; }
  :root main:nth-of-type(1):has(> div > h2) > div { grid-column: 1 / -1; }
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1) { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); column-gap: 52px; }
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1) > p:nth-of-type(1) { grid-column: 1; grid-row: 1; }
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1) > h2 { grid-column: 1; grid-row: 2; }
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1) > p:nth-of-type(2) { grid-column: 1; grid-row: 3; }
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1) > a { grid-column: 1; grid-row: 4; justify-self: start; }
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1)::before { grid-column: 2; grid-row: 1; justify-self: end; margin-bottom: 0; }
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1)::after { grid-column: 2; grid-row: 2 / span 3; justify-self: end; text-align: right; max-width: 210px; margin-top: 6px; }
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(n+2):nth-of-type(-n+4) { grid-column: span 2; margin-top: 86px; margin-bottom: 30px; }
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(n+5):not(:last-of-type) { grid-column: span 3; }
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(5),
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(6) { margin-top: 76px; }
  /* band labels rule off the whole row, not just their own column
     (3 cards + 2 gaps, then 2 cards + 1 gap) */
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(2)::before { width: calc(300% + 80px); }
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(5)::before { width: calc(200% + 40px); }
  :root main:nth-of-type(1):has(> div > h2) > div:last-of-type > ul { columns: 2; column-gap: 56px; }
  :root main:nth-of-type(1):has(> div > h2) > div:last-of-type > ul > li { break-inside: avoid; }
}

/* --- 10. ARTICLE + STATIC PAGES ---------------------------------- */
:root main:nth-of-type(1):has(> article) { max-width: min(786px, 100%); margin: 0 auto; padding: 0 28px 60px; }
:root main:nth-of-type(1):has(> hgroup) > hgroup { margin-bottom: 38px; }
:root main:nth-of-type(1):has(> hgroup) > hgroup::before { content: "NOTAS DE TALLER"; display: block; font-family: var(--font-body); font-size: 10.5px; font-weight: 700; letter-spacing: 0.32em; color: var(--color-accent); margin-bottom: 18px; }
:root main:nth-of-type(1):has(> article) > hgroup > h1,
:root main:nth-of-type(1):has(> article) > article > h1 { font-family: var(--font-heading); font-weight: 700; font-size: clamp(33px, 5.2vw, 54px); line-height: 1.04; letter-spacing: -0.02em; color: var(--color-primary); margin: 0 0 20px; }
:root main:nth-of-type(1):has(> hgroup) > hgroup > time { display: block; font-family: var(--font-body); font-style: normal; font-size: 10.5px; font-weight: 700; letter-spacing: 0.2em; color: var(--color-muted); margin: 0; }
:root main:nth-of-type(1):has(> hgroup) > hgroup > time::after { content: "\0000A0\0000B7\0000A0POR ANTONIA BUEND\0000CDA"; }
:root main:nth-of-type(1):has(> article) > article { max-width: none; margin: 0; }
:root main:nth-of-type(1):has(> article) > article > p { font-size: 17px; line-height: 1.78; color: var(--color-text); margin: 0 0 22px; max-width: none; }
:root main:nth-of-type(1):has(> article) > article > p:nth-of-type(1) { font-size: 19px; line-height: 1.68; }
:root main:nth-of-type(1):has(> article) > article > p:nth-of-type(1)::first-letter { float: left; font-family: var(--font-heading); font-size: 3.6em; line-height: 0.82; font-weight: 700; color: var(--color-accent); margin: 5px 11px 0 0; }
:root main:nth-of-type(1):has(> article) > article > h2 { font-family: var(--font-heading); font-size: 27px; line-height: 1.18; color: var(--color-primary); border: 0; padding: 0; margin: 0 0 18px; }
/* nail dinkus as the section divider */
:root main:nth-of-type(1):has(> article) > article > h2::before { content: ""; display: block; height: 16px; margin: 56px auto 44px; background: var(--nail-dinkus) center / auto 16px no-repeat; }
:root main:nth-of-type(1):has(> article) > article > h3 { font-family: var(--font-heading); font-style: italic; font-weight: 600; font-size: 21px; color: var(--color-accent-dark); margin: 38px 0 14px; }
:root main:nth-of-type(1):has(> article) > article > ul, :root main:nth-of-type(1):has(> article) > article > ol { max-width: none; margin: 0 0 24px; }
:root main:nth-of-type(1):has(> article) > article > ul > li { font-size: 17px; line-height: 1.7; }
:root main:nth-of-type(1):has(> article) > article > blockquote { position: relative; background: transparent; border-left: 2px solid var(--color-accent); border-radius: 0; padding: 4px 0 4px 30px; margin: 38px 0; max-width: none; font-family: var(--font-heading); font-size: 21px; line-height: 1.5; }
:root main:nth-of-type(1):has(> article) > article > blockquote::before { content: "\00201C"; position: absolute; left: -20px; top: -14px; font-family: var(--font-heading); font-size: 74px; line-height: 1; color: var(--color-accent); opacity: 0.28; }
:root main:nth-of-type(1):has(> article) > article > section > img { border-radius: var(--border-radius); box-shadow: 0 8px 26px rgba(74, 14, 46, 0.14); margin: 8px 0 30px; display: block; width: 100%; }
/* affiliate CTAs stay the loudest thing in the body copy (preserved) */
:root main:nth-of-type(1):has(> article) > article a[href^="/best/"] { color: var(--color-accent); font-weight: 700; text-decoration: underline; text-decoration-color: var(--color-accent); text-decoration-thickness: 2px; text-underline-offset: 4px; }
:root main:nth-of-type(1):has(> article) > article a[href^="/best/"]:hover { color: var(--color-accent-dark); background-color: rgba(216, 27, 96, 0.09); }
/* "Importante" disclosure — keep its weight, give it the wine identity */
:root main:nth-of-type(1):has(> article) > article > div:last-child { background-color: var(--color-primary-dark); border: 0; border-top: 3px solid var(--color-accent); border-radius: var(--border-radius); color: rgba(255, 246, 249, 0.82); font-size: 12.5px; line-height: 1.65; padding: 22px 26px; margin-top: 48px; }
:root main:nth-of-type(1):has(> article) > article > div:last-child > strong { color: #F2C9D6; letter-spacing: 0.06em; }
/* related list, matched to the homepage archive treatment */
:root main:nth-of-type(1):has(> article) > div:has(> ul) { border-left: 0; border-top: 3px double var(--color-border); padding: 34px 0 0; margin: 56px 0 0; }
:root main:nth-of-type(1):has(> article) > div:has(> ul) > h3 { font-family: var(--font-body); font-size: 10.5px; font-weight: 700; letter-spacing: 0.28em; text-transform: uppercase; color: var(--color-accent-dark); margin: 0 0 18px; }
:root main:nth-of-type(1):has(> article) > div:has(> ul) > ul { list-style: none; padding: 0; margin: 0; max-width: none; }
:root main:nth-of-type(1):has(> article) > div:has(> ul) > ul > li { padding: 12px 0; margin: 0; border-bottom: 1px dotted var(--color-border); }
:root main:nth-of-type(1):has(> article) > div:has(> ul) > ul > li > a { font-family: var(--font-heading); font-size: 17px; font-weight: 700; line-height: 1.3; color: var(--color-primary); text-decoration: none; }
:root main:nth-of-type(1):has(> article) > div:has(> ul) > ul > li > a:hover { color: var(--color-accent); }

/* --- 11. FOOTER --------------------------------------------------- */
:root > body > footer:last-of-type { background-color: var(--color-footer-bg); border-top: 3px solid var(--color-accent); padding: 46px 0 44px; margin-top: 84px; text-align: center; }
:root > body > footer:last-of-type > div:nth-of-type(1) { max-width: var(--editorial-w); margin: 0 auto; padding: 0 28px; }
:root > body > footer:last-of-type > div:nth-of-type(1)::before { content: ""; display: block; width: 17px; height: 23px; margin: 0 auto 18px; background: var(--nail-mark) center / contain no-repeat; }
:root > body > footer:last-of-type > div:nth-of-type(1) > p { font-family: var(--font-body); font-size: 11px; letter-spacing: 0.14em; line-height: 2.2; color: rgba(227, 185, 201, 0.75); max-width: none; margin: 0; }
:root > body > footer:last-of-type > div:nth-of-type(1) > p > a { color: var(--color-footer-text); text-decoration: none; font-weight: 600; }
:root > body > footer:last-of-type > div:nth-of-type(1) > p > a:hover { color: var(--color-accent); }

/* --- 12. NARROW SCREENS ------------------------------------------- */
@media (max-width: 899px) {
  :root body { font-size: 16px; }
  :root > body > div:first-child { padding: 52px 0 42px; margin-bottom: 44px; }
  :root main:nth-of-type(1):has(> div > h2) > div { grid-column: 1 / -1; }
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1) { padding-bottom: 36px; margin-bottom: 38px; }
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(1)::after { text-align: left; margin-top: 26px; }
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(2) { margin-top: 74px; }
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(5) { margin-top: 74px; }
  :root main:nth-of-type(1):has(> div > h2) > div:nth-of-type(n+2):nth-of-type(-n+4) { margin-bottom: 26px; }
  :root main:nth-of-type(1):has(> div > h2) > div:last-of-type > ul { columns: 1; }
  :root main:nth-of-type(1):has(> div > h2) > div:last-of-type > ul > li { flex-wrap: wrap; gap: 6px; }
  :root main:nth-of-type(1):has(> article) > article > h2::before { margin: 44px auto 34px; }
  :root main:nth-of-type(1):has(> article) > article > blockquote::before { left: -8px; font-size: 58px; }
}


/* === QA tail polish (2026-07-24T16:30:47.241900+00:00) — style Lambda [SB-20] compact tail across templates === */
/* The tail wrapper is always the LAST block child of <main> on the homepage,
   containing title-only rows of older articles. Various templates use different
   inner structures (ul>li / p / direct <a>) — this handles all three. */

:root main > *:last-child:not(:has(h2)):not(:has(h1)):not(:has(article)) {
  grid-column: 1 / -1;
  max-width: min(720px, 92vw);
  margin: 88px auto 0;
  padding: 40px 0 32px;
  border-top: 2px double rgba(0, 0, 0, .16);
  background: transparent;
  box-shadow: none;
}

:root main > *:last-child:not(:has(h2)):not(:has(h1)):not(:has(article))::before {
  content: "\2014  MORE FROM THE ARCHIVE  \2014";
  display: block;
  text-align: center;
  font-family: system-ui, -apple-system, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .28em;
  text-transform: uppercase;
  opacity: .5;
  margin-bottom: 36px;
}

/* Any list / paragraph rows: 2-col on desktop, single on mobile */
:root main > *:last-child ul {
  list-style: none;
  padding: 0;
  margin: 0;
  columns: 2;
  column-gap: 48px;
}
@media (max-width: 899px) {
  :root main > *:last-child ul { columns: 1; }
}

:root main > *:last-child li,
:root main > *:last-child > p,
:root main > *:last-child > a {
  padding: 10px 0;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 15px;
  line-height: 1.4;
  border-bottom: 1px dotted rgba(0, 0, 0, .12);
  break-inside: avoid;
  display: block;
}

:root main > *:last-child li a,
:root main > *:last-child p a,
:root main > *:last-child > a {
  text-decoration: none;
  font-weight: 600;
}

:root main > *:last-child li a:hover,
:root main > *:last-child p a:hover,
:root main > *:last-child > a:hover {
  text-decoration: underline;
}

/* dates (first inline child of li/p) — subtle mono */
:root main > *:last-child p > :first-child,
:root main > *:last-child li > :first-child:not(a) {
  font-family: system-ui, -apple-system, sans-serif;
  font-size: 11px;
  letter-spacing: .1em;
  opacity: .5;
  margin-right: 10px;
}
