/*
Theme Name: TXPrayer
Description: Tema personalizado basado en WEB MOCKUPS/txprayer. Base de desarrollo.
Version: 0.1.0
Requires PHP: 8.0
Text Domain: txprayer
*/
.tx-content{max-width:1200px;margin:auto;padding:calc(var(--h-header) + 3rem) var(--pad) 4rem;min-height:65vh}
.tx-content h1{font-size:clamp(2rem,5vw,4rem);margin-bottom:2rem}
.tx-content h2{font-size:clamp(1.5rem,3vw,2.5rem);margin-bottom:1rem}
.tx-content p,.tx-content figure{margin-bottom:1.25rem}
.tx-content img{max-width:100%;height:auto}
.tx-entry{padding:2rem 0;border-bottom:1px solid var(--lilac)}
.tx-menu{display:flex;gap:1rem;list-style:none;padding:0;flex-wrap:wrap}
.tx-skip{position:fixed;left:1rem;top:-100px;background:white;padding:1rem;z-index:99999}
.tx-skip:focus{top:1rem}
.single-txprayer_producto .photo{background:#fff;border:0}
.single-txprayer_producto .photo img{object-fit:contain;width:100%;height:100%;padding:1rem}
.card-img img{object-fit:contain;background:#fff}
.site-footer{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}
.site-footer>div,.site-footer nav{min-width:0;overflow-wrap:anywhere}
.tx-footer-menu{display:flex;flex-direction:column;gap:.5rem;list-style:none;margin:0;padding:0}
@media(max-width:700px){.site-footer{grid-template-columns:1fr;gap:2rem}}

.compare-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.45}
.pane-info{position:relative;text-shadow:0 1px 8px #1d1b54}
.handle{touch-action:none}.hero h1{overflow-wrap:break-word}
.site-header{width:max-content;max-width:calc(100% - 2rem);flex-wrap:nowrap}
.site-header .logo,.site-header nav,.site-header .tx-header-cta{flex:0 0 auto}
.site-header .tx-menu{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;gap:clamp(.9rem,2vw,1.6rem);margin:0;padding:0;list-style:none}
.site-header .tx-menu>li{flex:0 0 auto;margin:0;padding:0}
.tx-header-cta{font-size:1rem}
/* Compact navigation: same row for the brand and actions, links in a dropdown. */
.tx-menu-toggle{display:none;align-items:center;justify-content:center;gap:.55rem;min-height:44px;padding:.65rem .85rem;border:1px solid rgba(255,255,255,.28);border-radius:999px;background:transparent;color:white;font:inherit;font-size:.85rem;font-weight:600;cursor:pointer}
.tx-menu-icon{width:18px;height:12px;border-top:2px solid currentColor;border-bottom:2px solid currentColor;position:relative}
.tx-menu-icon::after{content:"";position:absolute;left:0;right:0;top:3px;border-top:2px solid currentColor}
body.admin-bar .site-header{top:46px}
html{scroll-padding-top:120px}
@media(max-width:1100px){
 .site-header{width:calc(100% - 2rem);max-width:760px;display:flex;flex-wrap:wrap;gap:.75rem;padding:.65rem .75rem .65rem 1.2rem;border-radius:32px;top:12px}
 .site-header .logo{margin-right:auto;font-size:1rem}
 .site-header .tx-header-cta{order:1;font-size:.85rem;padding:.75rem 1.1rem;min-height:44px;display:flex;align-items:center;justify-content:center}
 .site-header .tx-menu-toggle{order:2;flex:0 0 auto}
 .site-header.tx-nav-ready .tx-menu-toggle{display:flex}
 .site-header nav{display:block;order:3;width:100%;white-space:normal}
 .site-header .tx-menu{display:flex;flex-direction:column;align-items:stretch;gap:.25rem}
 .site-header nav a{display:block;padding:.85rem 1rem;border-radius:12px;font-size:1rem;min-height:44px}
 .site-header nav a:hover,.site-header nav a[aria-current="page"]{background:rgba(255,255,255,.07)}
 .site-header.tx-nav-ready nav{display:none;position:absolute;top:calc(100% + .6rem);left:0;width:100%;padding:.75rem;background:rgba(29,27,84,.98);border:1px solid rgba(255,255,255,.18);border-radius:22px;box-shadow:0 18px 45px rgba(0,0,0,.2);max-height:calc(100dvh - 150px);overflow-y:auto}
 .site-header.tx-menu-open nav{display:block}
 .tx-menu-open .tx-menu-icon{border:0}
 .tx-menu-open .tx-menu-icon::before,.tx-menu-open .tx-menu-icon::after{content:"";position:absolute;top:5px;left:0;right:0;border-top:2px solid currentColor;transform:rotate(45deg)}
 .tx-menu-open .tx-menu-icon::after{transform:rotate(-45deg)}
 .hero{min-height:85svh;padding:9rem var(--pad) 5rem}
 .hero h1{font-size:clamp(2.5rem,7.5vw,5.3rem);line-height:1.08}
 .hero-cta{gap:1.25rem}
 .fam-side{position:static}
 .fam-pin{grid-template-columns:1fr;gap:1rem;min-height:0;padding:4rem var(--pad)}
}
@media(max-width:782px){body.admin-bar .site-header{top:58px}.intro-grid{grid-template-columns:1fr;gap:1.5rem}}
@media(max-width:480px){
 .site-header{width:calc(100% - 1rem);padding:.5rem .6rem;gap:.4rem;border-radius:26px}
 .site-header .logo{font-size:.8rem;letter-spacing:.01em}
 .site-header .tx-header-cta{font-size:.7rem;padding:.6rem .65rem}
 .tx-menu-toggle{font-size:.75rem;padding:.6rem .65rem;gap:.4rem}
 .hero{min-height:80svh;padding-top:8rem;padding-bottom:5rem}
 .hero h1{font-size:clamp(2rem,8.4vw,2.7rem)}
 .hero-cta{align-items:flex-start;flex-direction:column;gap:1rem}
 .hero-cta .btn{padding:.9rem 1.3rem}
 .scroll-hint{display:none}
 .compare-sec,.intro{padding:3.5rem var(--pad)}
 .pane-info strong{font-size:1.3rem}.pane-info b{font-size:1rem}.pane-info small{font-size:.7rem}
 .cta-final{padding:4rem var(--pad)}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
/* Reference layout; readable fallback when motion is unavailable. */
.fam-stage:not(.tx-families-animated) .fam{display:block;margin-bottom:3rem}
.fam-stage.tx-families-animated .fam{display:none}
.fam-stage.tx-families-animated .fam.on{display:block}
@media(min-width:769px){.home .hero{min-height:100svh;padding:calc(var(--h-header) + 4rem) var(--pad) 5rem}.home .hero h1{font-size:clamp(2rem,8.2vw,7.5rem);line-height:1}.home .fam-pin{min-height:100vh;grid-template-columns:minmax(220px,1fr) 2fr;gap:3rem;padding:6rem var(--pad);align-items:center}}