/*
  project-tweaks.css
  ============================================================
  Archivo de ajustes visuales del proyecto.
  Sirve para cambiar el aspecto de TODAS las webs generadas
  sin tocar el núcleo PHP.

  DÓNDE ESTÁ
  - Dentro de la web generada: /assets/css/project-tweaks.css
  - Dentro del ZIP generado:  assets/css/project-tweaks.css

  QUÉ TOCAR PRIMERO
  - --tw-max-content  -> ancho general
  - --tw-space-section -> espacio entre secciones
  - --tw-space-card -> padding de tarjetas
  - --tw-menu-size -> tamaño del menú
  - --tw-author-photo -> tamaño de foto de autor
*/

:root{
  --tw-max-content: 1360px;
  --tw-max-reading: 104ch;
  --tw-space-section: 96px;
  --tw-space-card: 40px;
  --tw-space-gap: 34px;
  --tw-space-paragraph: 18px;
  --tw-h1-size: clamp(34px, 3.8vw, 50px);
  --tw-h2-size: clamp(26px, 2.4vw, 36px);
  --tw-h3-size: clamp(20px, 1.8vw, 28px);
  --tw-lead-size: 21px;
  --tw-menu-size: 20px;
  --tw-menu-gap: 24px;
  --tw-menu-pad-y: 15px;
  --tw-menu-pad-x: 18px;
  --tw-btn-size: 17px;
  --tw-btn-pad-y: 16px;
  --tw-btn-pad-x: 24px;
  --tw-btn-radius: 16px;
  --tw-card-radius: 24px;
  --tw-card-img-radius: 22px;
  --tw-author-photo: 96px;
  --tw-author-max: 700px;
  --tw-author-gap: 10px;
  --tw-brand-logo-max-width: 220px;
  --tw-brand-logo-max-height: 56px;
}

.container,.section>.container,.hero>.container,main.section>.container{max-width:var(--tw-max-content)!important;margin-left:auto!important;margin-right:auto!important}
body,.hero,.hero *,.section h1,.section h2,.section h3,.section p,.section li,.section ul,.section ol,.content-box,.content-box h1,.content-box h2,.content-box h3,.content-box p,.content-box li,.content-box ul,.content-box ol,.category-card,.category-card h3,.category-card p,.product-card,.product-card h3,.product-card p,.faq-page-box,.faq-page-box h1,.faq-page-box h2,.faq-page-box p,.review-content,.review-content h2,.review-content p,.review-content li,.family-intro-media,.family-intro-media p{text-align:center!important}
.hero-grid,.grid.grid-2,.grid.grid-1,.container.grid.grid-1,.container.grid.grid-2,.home-stack,main.section .grid.grid-2{grid-template-columns:minmax(0,1fr)!important;max-width:var(--tw-max-content)!important;margin-left:auto!important;margin-right:auto!important;gap:var(--tw-space-gap)!important}
.section{padding:var(--tw-space-section) 0!important}.hero{padding:calc(var(--tw-space-section) + 10px) 0 60px!important}
.content-box,.card,.product-card,.category-card,.author-box-inner,.faq-list details{border-radius:var(--tw-card-radius)!important}
.content-box,.hero-single-card,.home-single-box,.author-box-inner{padding:var(--tw-space-card)!important}
.content-box p,.content-box ul,.content-box ol,.hero-single-card p,.hero-single-card .lead,.hero-single-card .note,.home-single-box p,.author-copy p{max-width:var(--tw-max-reading)!important;margin-left:auto!important;margin-right:auto!important}
p{margin-top:0!important;margin-bottom:var(--tw-space-paragraph)!important} ul,ol{padding-left:0!important;list-style-position:inside!important}
.btn-row{justify-content:center!important;gap:20px!important;flex-wrap:wrap!important;margin-top:28px!important}.btn-row + p,.btn-row + .note{margin-top:22px!important}.note{margin-top:20px!important}
h1{font-size:var(--tw-h1-size)!important;line-height:1.08!important;margin-bottom:24px!important}h2{font-size:var(--tw-h2-size)!important;line-height:1.12!important;margin-bottom:18px!important}h3{font-size:var(--tw-h3-size)!important;line-height:1.18!important;margin-bottom:14px!important}.lead{font-size:var(--tw-lead-size)!important;max-width:82ch!important;margin-left:auto!important;margin-right:auto!important;margin-bottom:24px!important}
.nav-main,.nav{display:flex!important;flex-wrap:wrap!important;justify-content:center!important;align-items:center!important;gap:var(--tw-menu-gap)!important}.nav-main a,.nav a{font-size:var(--tw-menu-size)!important;font-weight:800!important;padding:var(--tw-menu-pad-y) var(--tw-menu-pad-x)!important;border-radius:14px!important}
.site-header{position:sticky;top:0;z-index:80;background:rgba(255,255,255,.94);backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid rgba(15,23,42,.06)}
.header-row{display:grid!important;grid-template-columns:auto 1fr auto!important;align-items:center!important;gap:20px!important}
.brand.brand-logo-only{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:14px!important;min-width:0!important;max-width:100%!important}
.brand-experts{height:42px!important;width:auto!important;flex:0 0 auto!important}
.brand-official{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-width:120px!important;max-width:100%!important;padding:8px 14px!important;overflow:hidden!important;background:linear-gradient(180deg,#fff 0%,#f8fafc 100%)!important;border:1px solid rgba(15,23,42,.08)!important;border-radius:14px!important;flex:0 0 auto!important}
.brand-official img{max-width:var(--tw-brand-logo-max-width)!important;max-height:var(--tw-brand-logo-max-height)!important;width:auto!important;height:auto!important;object-fit:contain!important;display:block!important;visibility:visible!important;opacity:1!important}
.brand-logo-only .brand-name,.brand-logo-only .site-title,.brand-logo-only .site-name,.skip-link{display:none!important}
.back-to-top,.scroll-top{position:fixed!important;right:18px!important;bottom:18px!important;width:46px!important;height:46px!important;border-radius:999px!important;display:flex!important;align-items:center!important;justify-content:center!important;box-shadow:0 16px 30px rgba(15,23,42,.18)!important;background:#111827!important;color:#fff!important;border:none!important;opacity:1!important;pointer-events:auto!important;transform:none!important;z-index:120!important;text-decoration:none!important;font-weight:800!important}.back-to-top.is-visible,.scroll-top.is-visible{opacity:1!important;pointer-events:auto!important;transform:none!important}
.btn,button.btn,a.btn{font-size:var(--tw-btn-size)!important;padding:var(--tw-btn-pad-y) var(--tw-btn-pad-x)!important;border-radius:var(--tw-btn-radius)!important}
.home-category-grid,.grid.grid-4,.product-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(280px,380px))!important;justify-content:center!important;gap:var(--tw-space-gap)!important}
.category-card,.product-card{width:100%!important;max-width:380px!important;margin-left:auto!important;margin-right:auto!important}
.category-body,.product-card-body{display:flex!important;flex-direction:column!important;align-items:center!important;gap:18px!important;padding:26px 26px 32px!important}
.category-card img,.product-card img,.photo-slot img,.editorial-main img,.editorial-stack img,.family-intro-media img{border-radius:var(--tw-card-img-radius)!important;image-rendering:auto!important;background:#fff!important}
.category-card img,.product-card img{object-fit:contain!important;max-height:260px!important}
.family-intro-media{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:18px!important;margin:0 auto 32px!important}.family-intro-media img{width:auto!important;max-width:min(100%,920px)!important;height:auto!important;max-height:420px!important;object-fit:contain!important;box-shadow:0 20px 50px rgba(15,23,42,.10)!important;background:#fff!important}
.faq-list{max-width:980px!important;margin:0 auto!important;gap:24px!important}.faq-list summary{justify-content:center!important;text-align:center!important;padding:24px 28px!important}.faq-list details p{padding:0 28px 28px!important;text-align:center!important}
.author-box{padding:34px 0 62px!important}.author-box-inner{max-width:var(--tw-author-max)!important;margin:0 auto!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:var(--tw-author-gap)!important;text-align:center!important}.author-photo{width:var(--tw-author-photo)!important;height:var(--tw-author-photo)!important;border-radius:999px!important;object-fit:cover!important;margin:0 auto 10px!important}.author-copy{display:flex!important;flex-direction:column!important;align-items:center!important;gap:10px!important;width:100%!important}.author-copy h2{font-size:clamp(24px,2vw,30px)!important;margin-bottom:4px!important}.author-copy p,.author-role,.author-note{text-align:center!important;margin-left:auto!important;margin-right:auto!important}.author-note a{word-break:break-word!important}
.site-footer{padding:62px 0 70px!important;margin-top:84px!important}.site-footer .legal-list{justify-items:center!important;text-align:center!important;gap:16px!important}.site-footer p,.site-footer .text-soft{text-align:center!important}
@media (max-width:760px){:root{--tw-max-content:94vw;--tw-max-reading:92vw;--tw-space-section:64px;--tw-space-card:24px;--tw-space-gap:24px;--tw-menu-size:17px;--tw-btn-size:16px;--tw-author-photo:92px;--tw-brand-logo-max-width:150px;--tw-brand-logo-max-height:40px}.header-row{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important}.brand.brand-logo-only{flex:1 1 auto!important;min-width:0!important;justify-content:flex-start!important}.brand-official{padding:6px 10px!important}.nav{display:none!important}.nav.open,.nav[data-open="true"]{position:fixed!important;left:0!important;right:0!important;top:72px!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;text-align:center!important;padding:12px 14px 16px!important;background:linear-gradient(180deg,#ffffff,#f3f5f7)!important;border-radius:0 0 20px 20px!important;border:1px solid var(--line)!important;border-top:none!important;box-shadow:0 18px 34px rgba(15,23,42,.12)!important;width:100vw!important;max-width:none!important;z-index:60!important}.nav.open a,.nav[data-open="true"] a{width:100%!important;min-height:48px!important;display:flex!important;align-items:center!important;justify-content:center!important;border-radius:14px!important;background:#ffffff!important;border:1px solid rgba(17,24,39,.08)!important;margin:4px 0!important;padding:14px 16px!important}.menu-toggle{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:46px!important;height:46px!important;border-radius:12px!important;z-index:91!important}.home-category-grid,.grid.grid-4,.product-grid{grid-template-columns:minmax(0,1fr)!important}.editorial-montage{grid-template-columns:minmax(0,1fr)!important}}
@media (max-width:980px){.hero-grid,.grid.grid-2{gap:28px!important}}
/* v2 plantilla maestra: jerarquía más clara, H1 > imagen > texto y móvil más fino */
.hero-single-card{display:flex!important;flex-direction:column!important;align-items:center!important;gap:0!important}
.hero-single-card > .hero-kicker{margin-bottom:14px!important}
.hero-single-card > h1{max-width:18ch!important;margin-bottom:18px!important}
.hero-single-card > .family-intro-media,.hero-single-card > .photo-slot,.hero-single-card > .hero-media{order:2!important;width:100%!important;max-width:920px!important;margin:4px auto 22px!important}
.hero-single-card > .lead{order:3!important;max-width:70ch!important;margin-bottom:18px!important}
.hero-single-card > .btn-row{order:4!important;margin-top:0!important}
.hero-single-card > .note,.hero-single-card > .text-soft{order:5!important;max-width:64ch!important;margin-top:16px!important}
.family-intro-media img,.photo-slot img,.hero-media img,.hero-photo{width:100%!important;max-width:920px!important;height:auto!important;max-height:460px!important;object-fit:contain!important;background:#fff!important}
.home-single-box .photo-slot{margin-top:20px!important;margin-bottom:22px!important}
.content-box p,.home-single-box p,.hero-single-card p{max-width:72ch!important}
.home-category-grid,.product-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))!important}
.category-card,.product-card{max-width:none!important}
.category-card img,.product-card img{max-height:250px!important}
.section{padding:72px 0!important}
.hero{padding:76px 0 38px!important}
.site-header .nav a{white-space:nowrap!important}
@media (max-width:760px){
  .hero-single-card > h1{max-width:14ch!important}
  .hero-single-card > .family-intro-media,.hero-single-card > .photo-slot,.hero-single-card > .hero-media{margin:2px auto 18px!important}
  .hero-single-card > .lead{font-size:18px!important;line-height:1.55!important}
  .btn-row{gap:12px!important}
  .btn-row .btn{width:min(100%,420px)!important}
  .hero-single-card,.content-box,.home-single-box{padding:22px 18px!important}
  .section{padding:56px 0!important}
  .hero{padding:58px 0 30px!important}
  .site-footer{padding-bottom:96px!important}
}
@media (min-width:761px){
  .hero-single-card > h1{max-width:20ch!important}
}
