/* Club Baby Shower · plantilla de artículo (prototipo aprobado 2026-10-11). Sistema V2: tokens de la portada.
   Fondo crema #F5EFE5; tarjetas en blanco; botones con estela; motion por scroll solo con transform (contenido siempre visible). */
:root{
  --cbs-page:#FFFDFC;--cbs-cream:#F5EFE5;--cbs-cream-2:#EFE6D8;--cbs-terra:#D99879;--cbs-terra-ink:#9C5338;--cbs-rose:#D6AAA0;
  --cbs-sage:#8A9273;--cbs-mustard:#C7A34F;--cbs-ink:#3E3936;--cbs-ink-soft:#6B625C;--cbs-line:rgba(62,57,54,.12);
  --cbs-serif:"Playfair Display",Georgia,"Times New Roman",serif;--cbs-sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --cbs-r:999px;--cbs-panel-r:clamp(26px,3.2vw,44px);--cbs-spring:cubic-bezier(.34,1.56,.64,1);--cbs-ease:cubic-bezier(.22,.61,.36,1);
  --cbs-gut:clamp(16px,4.5vw,64px);--cbs-hdr:96px;
}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--cbs-hdr) + 20px)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body.cbs-articulo,body.cbs-articulo #page-container,body.cbs-articulo #et-main-area,body.cbs-articulo #main-content{background:var(--cbs-cream)}
body.cbs-articulo #page-container{padding-top:0!important;margin-top:0!important}
body.cbs-articulo #main-content{padding-top:var(--cbs-hdr)}
.cbs-art{color:var(--cbs-ink);font:400 17px/1.7 var(--cbs-sans);-webkit-font-smoothing:antialiased}
.cbs-art *,.cbs-art *::before,.cbs-art *::after{box-sizing:border-box}
.cbs-art :focus-visible{outline:2px solid var(--cbs-terra-ink);outline-offset:3px;border-radius:8px}
.cbs-wrap{max-width:1240px;margin:0 auto;padding-inline:var(--cbs-gut)}
#page-container .cbs-art h1,#page-container .cbs-art h2,#page-container .cbs-art h3,#page-container .cbs-art h4{color:var(--cbs-ink);padding:0;text-wrap:balance}
#page-container .cbs-art p{padding:0}

/* ---------- botones (como la portada) ---------- */
@property --cbs-ang{syntax:"<angle>";inherits:false;initial-value:0deg}
#page-container .cbs-art .btn,#page-container .cbs-art .wp-block-button__link{--bg:var(--cbs-page);--fg:var(--cbs-ink);position:relative;display:inline-flex;align-items:center;gap:10px;padding:16px 26px;border-radius:var(--cbs-r);background:var(--bg);color:var(--fg);font:600 15px/1 var(--cbs-sans);text-decoration:none;border:1px solid var(--cbs-line);transition:transform .4s var(--cbs-spring),box-shadow .4s var(--cbs-ease);isolation:isolate;cursor:pointer}
#page-container .cbs-art .btn svg{width:16px;height:16px;transition:transform .4s var(--cbs-spring)}
#page-container .cbs-art .btn::before,#page-container .cbs-art .btn::after,#page-container .cbs-art .wp-block-button__link::before,#page-container .cbs-art .wp-block-button__link::after{content:"";position:absolute;border-radius:inherit;background:conic-gradient(from var(--cbs-ang),transparent 0 62%,var(--cbs-rose) 76%,var(--cbs-mustard) 88%,var(--cbs-terra) 96%,transparent 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:cbs-spin 3.2s linear infinite;pointer-events:none;z-index:-1}
#page-container .cbs-art .btn::before,#page-container .cbs-art .wp-block-button__link::before{inset:-1.5px;padding:1.5px}
#page-container .cbs-art .btn::after,#page-container .cbs-art .wp-block-button__link::after{inset:-4px;padding:4px;filter:blur(4px);opacity:.55;transition:opacity .4s}
#page-container .cbs-art .btn:hover::after{opacity:.9}
#page-container .cbs-art .btn--primary,#page-container .cbs-art .wp-block-button__link{--bg:var(--cbs-terra);--fg:var(--cbs-ink);border-color:transparent}
#page-container .cbs-art .btn--ink{--bg:var(--cbs-ink);--fg:var(--cbs-page);border-color:transparent}
#page-container .cbs-art .btn--sm{padding:11px 18px;font-size:14px}
#page-container .cbs-art .btn:hover,#page-container .cbs-art .wp-block-button__link:hover{transform:translateY(-2px);box-shadow:0 12px 26px -14px rgba(156,83,56,.55)}
#page-container .cbs-art .btn:hover svg{transform:translateX(4px)}
@keyframes cbs-spin{to{--cbs-ang:360deg}}
@media (prefers-reduced-motion:reduce){#page-container .cbs-art .btn::before,#page-container .cbs-art .btn::after,#page-container .cbs-art .wp-block-button__link::before,#page-container .cbs-art .wp-block-button__link::after{animation:none}}

/* ---------- hero ---------- */
.cbs-hero{padding-block:clamp(20px,4vw,52px) clamp(28px,4vw,48px)}
.cbs-crumbs{display:flex;flex-wrap:wrap;gap:6px;font:500 13px/1.4 var(--cbs-sans);color:var(--cbs-ink-soft);list-style:none;margin:0;padding:0}
.cbs-crumbs li+li::before{content:"/";margin-right:6px;opacity:.5}
.cbs-crumbs a{color:inherit;text-decoration:none}.cbs-crumbs a:hover{color:var(--cbs-terra-ink)}
.cbs-art .cbs-eyebrow{display:inline-flex;align-items:center;gap:10px;font:600 12px/1 var(--cbs-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--cbs-terra-ink)}
.cbs-art .cbs-eyebrow::before{content:"";width:26px;height:1.5px;background:var(--cbs-terra)}
.cbs-hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:end;margin-top:26px}
#page-container .cbs-hero h1{font:900 clamp(38px,5.6vw,76px)/1.02 var(--cbs-serif);letter-spacing:-.025em;margin:16px 0 0}
.cbs-hero h1 em{font-style:italic;color:var(--cbs-terra-ink)}
.cbs-by{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:26px;font:500 14px/1.4 var(--cbs-sans);color:var(--cbs-ink-soft)}
.cbs-who{display:flex;align-items:center;gap:10px;color:var(--cbs-ink);font-weight:600}
.cbs-av{width:38px;height:38px;border-radius:50%;background:var(--cbs-terra);display:grid;place-items:center;font:900 15px/1 var(--cbs-serif);color:var(--cbs-ink)}
.cbs-dot{width:4px;height:4px;border-radius:50%;background:var(--cbs-rose)}
.cbs-aff{margin-top:14px;font:400 13px/1.5 var(--cbs-sans);color:var(--cbs-ink-soft);max-width:46em}
.cbs-feat{margin:0;border-radius:var(--cbs-panel-r);overflow:hidden;aspect-ratio:16/10;max-width:100%;background:var(--cbs-cream-2)}
.cbs-feat img{display:block;width:100%;height:100%;object-fit:cover}
@media (max-width:880px){.cbs-hero-grid{grid-template-columns:1fr}}

/* ---------- índice + lectura ---------- */
.cbs-body{display:grid;grid-template-columns:250px minmax(0,1fr);gap:clamp(32px,6vw,96px);padding-bottom:clamp(48px,7vw,96px)}
.cbs-side-in{position:sticky;top:calc(var(--cbs-hdr) + 20px);display:grid;gap:22px}
.cbs-toc-t{font:600 12px/1 var(--cbs-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--cbs-ink-soft);margin:0 0 14px}
#page-container .cbs-toc ol{list-style:none;margin:0;padding:0;display:grid;gap:2px;border-left:1.5px solid var(--cbs-line)}
.cbs-toc a{display:block;padding:7px 0 7px 16px;margin-left:-1.5px;border-left:1.5px solid transparent;font:500 14px/1.35 var(--cbs-sans);text-decoration:none;color:var(--cbs-ink-soft);transition:color .3s,border-color .3s}
.cbs-toc .h3 a{padding-left:30px;font-size:13px}
.cbs-toc a:hover{color:var(--cbs-ink)}
.cbs-toc a.on{color:var(--cbs-ink);font-weight:700;border-left-color:var(--cbs-terra-ink)}
.cbs-mini{background:var(--cbs-page);border-radius:24px;padding:20px;box-shadow:0 18px 40px -34px rgba(62,57,54,.45)}
.cbs-mini strong{display:block;font:700 18px/1.25 var(--cbs-serif)}
.cbs-mini span{display:block;font:400 13px/1.5 var(--cbs-sans);color:var(--cbs-ink-soft);margin:6px 0 14px}
.cbs-toc-m{display:none}
@media (max-width:980px){
  .cbs-body{grid-template-columns:minmax(0,1fr)}
  .cbs-side{display:none}
  .cbs-toc-m{display:block;background:var(--cbs-page);border-radius:24px;margin:28px 0 0;box-shadow:0 18px 40px -34px rgba(62,57,54,.45)}
  .cbs-toc-m summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:18px 22px;font:600 15px/1 var(--cbs-sans)}
  .cbs-toc-m summary::-webkit-details-marker{display:none}
  #page-container .cbs-toc-m ol{list-style:none;margin:0;padding:0 22px 16px}
  .cbs-toc-m a{display:block;padding:7px 0;font:500 14px/1.35 var(--cbs-sans);color:var(--cbs-ink-soft);text-decoration:none}
  .cbs-toc-m .h3 a{padding-left:14px;font-size:13px}
}

.cbs-read{max-width:680px;min-width:0}
.cbs-tldr{background:var(--cbs-page);border-radius:28px;padding:clamp(22px,3vw,32px);box-shadow:0 22px 50px -40px rgba(62,57,54,.55)}
.cbs-tldr__k{display:flex;align-items:center;gap:10px;font:700 12px/1 var(--cbs-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--cbs-terra-ink)}
.cbs-tldr__k i{font-style:normal;padding:5px 9px;border-radius:var(--cbs-r);background:var(--cbs-cream);color:var(--cbs-ink);letter-spacing:.08em}
#page-container .cbs-tldr p{margin:14px 0 0;font:500 clamp(18px,1.7vw,20px)/1.6 var(--cbs-sans)}
.cbs-tldr strong{background:linear-gradient(transparent 62%,rgba(217,152,121,.35) 0)}
#page-container .cbs-read h2{font:900 clamp(30px,3.4vw,42px)/1.1 var(--cbs-serif);letter-spacing:-.02em;margin:64px 0 0}
#page-container .cbs-read h3{font:700 clamp(21px,2vw,25px)/1.25 var(--cbs-serif);margin:36px 0 0}
#page-container .cbs-read h4{font:700 18px/1.3 var(--cbs-sans);margin:28px 0 0}
#page-container .cbs-read p,#page-container .cbs-read ul,#page-container .cbs-read ol{margin:16px 0 0;line-height:1.7}
#page-container .cbs-read ul,#page-container .cbs-read ol{padding:0 0 0 1.2em}
.cbs-read li{margin-top:8px}
.cbs-read li::marker{color:var(--cbs-terra-ink)}
.cbs-read a{color:var(--cbs-terra-ink);text-underline-offset:3px}
.cbs-read figure,.cbs-read .wp-block-image{margin:28px 0 0}
.cbs-read img{max-width:100%;height:auto;border-radius:22px}
.cbs-read figcaption{font:400 13px/1.5 var(--cbs-sans);color:var(--cbs-ink-soft);margin-top:10px;text-align:left}
.cbs-read blockquote,.cbs-read .wp-block-quote{margin:28px 0 0;padding:18px 22px;border-left:3px solid var(--cbs-terra);background:var(--cbs-cream-2);border-radius:0 18px 18px 0;font:500 17px/1.6 var(--cbs-sans)}
.cbs-read .wp-block-table{margin:28px 0 0;overflow-x:auto}
.cbs-read table{width:100%;border-collapse:collapse;background:var(--cbs-page);border-radius:18px;overflow:hidden;font-size:15px}
.cbs-read th,.cbs-read td{padding:12px 14px;border-bottom:1px solid var(--cbs-line);text-align:left;vertical-align:top}
.cbs-read th{font-weight:600;background:var(--cbs-cream-2)}
.cbs-read .wp-block-buttons{margin-top:20px;display:flex;flex-wrap:wrap;gap:12px}
.cbs-read hr,.cbs-read .wp-block-separator{border:0;height:1px;background:var(--cbs-line);margin:40px 0 0}
.cbs-read .wp-block-spacer{max-height:32px}
/* «Dato útil»: grupo con la clase cbs-dato */
.cbs-read .cbs-dato{margin-top:24px;padding:16px 20px;border-radius:18px;background:var(--cbs-cream-2);font:500 15px/1.5 var(--cbs-sans)}
.cbs-read .cbs-dato strong:first-child{color:var(--cbs-terra-ink);font-weight:600}

/* ---------- paneles ---------- */
.cbs-panel{position:relative;border-radius:var(--cbs-panel-r);overflow:hidden;transform-origin:50% 0}
.cbs-reg{background:var(--cbs-terra);padding:clamp(32px,5vw,64px)}
.cbs-reg-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center}
#page-container .cbs-reg h2{font:900 clamp(34px,4.4vw,58px)/1.02 var(--cbs-serif);letter-spacing:-.025em;margin:14px 0 0}
.cbs-reg h2 em{font-style:italic}
.cbs-art .cbs-reg .cbs-eyebrow{color:var(--cbs-ink)}.cbs-art .cbs-reg .cbs-eyebrow::before{background:var(--cbs-ink)}
.cbs-reg .cbs-lead{margin:18px 0 0;max-width:30em}
.cbs-reg-ctas{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;margin-top:28px}
.cbs-txt{font:600 15px/1.3 var(--cbs-sans);color:var(--cbs-ink);text-underline-offset:4px}
#page-container .cbs-steps{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.cbs-steps li{display:flex;gap:16px;align-items:center;background:var(--cbs-page);border-radius:22px;padding:16px 18px;box-shadow:0 18px 30px -28px rgba(62,57,54,.6)}
.cbs-steps b{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--cbs-cream);font:900 17px/1 var(--cbs-serif)}
.cbs-steps span{font:500 15px/1.4 var(--cbs-sans)}
.cbs-steps small{display:block;color:var(--cbs-ink-soft);font-size:13px}
@media (max-width:880px){.cbs-reg-grid{grid-template-columns:1fr}}

/* ---------- FAQ (mismo aspecto que la portada) ---------- */
.cbs-faqsec{padding-block:clamp(56px,8vw,110px)}
.cbs-faq-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(30px,5vw,80px);align-items:start}
.cbs-faq-intro{position:sticky;top:calc(var(--cbs-hdr) + 40px)}
#page-container .cbs-faqsec h2{font:900 clamp(34px,4.4vw,58px)/1.02 var(--cbs-serif);letter-spacing:-.025em;margin:14px 0 0}
.cbs-faq-intro .cbs-lead{color:var(--cbs-ink-soft);max-width:24em;margin:20px 0 0}
.cbs-qs{display:grid;gap:12px}
.cbs-q{background:var(--cbs-page);border-radius:24px;box-shadow:0 18px 40px -34px rgba(62,57,54,.45);overflow:hidden}
.cbs-q summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:22px 24px;font:700 clamp(18px,1.6vw,21px)/1.3 var(--cbs-serif);color:var(--cbs-ink)}
.cbs-q summary::-webkit-details-marker{display:none}
.cbs-q summary:focus-visible{outline:2px solid var(--cbs-terra-ink);outline-offset:-4px;border-radius:24px}
.cbs-art .cbs-pm{flex:none;width:34px;height:34px;border-radius:50%;background:var(--cbs-cream);display:grid;place-items:center;transition:transform .5s var(--cbs-spring),background .3s}
.cbs-art .cbs-pm svg{width:14px;height:14px;stroke:var(--cbs-ink);stroke-width:2;stroke-linecap:round}
.cbs-q[open] .cbs-pm,.cbs-toc-m[open] .cbs-pm{transform:rotate(45deg);background:var(--cbs-terra)}
.cbs-q__a{padding:0 24px 22px;color:var(--cbs-ink-soft);max-width:38em}
#page-container .cbs-q__a p{margin:0 0 10px}
.cbs-q__a a{color:var(--cbs-terra-ink);font-weight:500}
@media (max-width:880px){.cbs-faq-grid{grid-template-columns:1fr}.cbs-faq-intro{position:static}}

/* ---------- motion de marca (scroll-driven; nunca oculta contenido) ---------- */
@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline:view()){
    .cbs-rise{animation:cbs-rise linear both;animation-timeline:view();animation-range:entry 0% entry 70%}
    .cbs-tldr,.cbs-tin,.cbs-qs .cbs-q{animation:cbs-tin linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
  }
}
@keyframes cbs-rise{from{transform:translateY(80px) scale(.97)}to{transform:none}}
@keyframes cbs-tin{from{transform:translateY(36px)}to{transform:none}}

/* 1.0.2 · retoques tras la primera migración (post 3164) */
/* Párrafos con fondo de color heredado de Gutenberg (p. ej. «Te puede interesar»): recuadro de la marca */
#page-container .cbs-read p.has-background{background:var(--cbs-cream-2)!important;color:var(--cbs-ink)!important;border-radius:16px;padding:14px 18px}
/* Encabezados que venían centrados: alineados a la izquierda como el resto */
#page-container .cbs-read .has-text-align-center:is(h2,h3,h4){text-align:left}
/* Crédito de las ideas de Instagram */
#page-container .cbs-read p.cbs-credito{font-size:14px;color:var(--cbs-ink-soft);margin-top:10px}
/* Firma en móvil: sin puntos separadores sueltos */
@media (max-width:560px){.cbs-dot{display:none}.cbs-by{gap:6px 14px}}

/* 1.0.3 · ficha de producto sin foto (como en Pesca): nombre, para qué sirve y botón. Sin precios. */
#page-container .cbs-read .cbs-producto{background:var(--cbs-page);border-radius:22px;padding:18px 20px;margin-top:20px;box-shadow:0 18px 40px -34px rgba(62,57,54,.45);display:grid;gap:6px}
#page-container .cbs-read p.cbs-producto__nombre{margin:0;font:700 18px/1.3 var(--cbs-serif);color:var(--cbs-ink)}
#page-container .cbs-read p.cbs-producto__txt{margin:0;font-size:15px;line-height:1.5;color:var(--cbs-ink-soft)}
#page-container .cbs-read .cbs-producto .wp-block-buttons{margin-top:8px}
#page-container .cbs-read .wp-block-columns{gap:14px;margin-top:20px}
#page-container .cbs-read .wp-block-column .cbs-producto{margin-top:0;height:100%}
