/* Mensajes editoriales sobre la navegación y detalles de interacción. */
.announcement{--announcement-bg:#f3eaf8;--announcement-accent:#6a3f86;position:relative;z-index:45;background:linear-gradient(110deg,var(--announcement-bg),#fff8ed);border-bottom:1px solid #dcd8e2;color:#172f40;overflow:hidden}
.announcement[data-tone="pool"]{--announcement-bg:#dcf7fb;--announcement-accent:#116c86}
.announcement[data-tone="electric"]{--announcement-bg:#fff4bd;--announcement-accent:#755a00}
.announcement[data-tone="commercial"]{--announcement-bg:#eee1fb;--announcement-accent:#654183}
.announcement:before{content:"";position:absolute;width:240px;height:240px;right:12%;top:-195px;border-radius:50%;background:#fff9;filter:blur(12px);pointer-events:none}
.announcement-inner{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;min-height:62px}
.announcement-track{min-width:0}
.announcement-slide{display:flex;align-items:center;flex-wrap:nowrap;gap:9px 17px;padding:8px 0;animation:announcement-enter .25s ease both}
.announcement-slide[hidden]{display:none!important}
.announcement-tag{flex-shrink:0;padding:5px 9px;border:1px solid currentColor;border-radius:999px;color:var(--announcement-accent);font-size:.68rem;font-weight:900;letter-spacing:.08em;line-height:1.2}
.announcement-message{font-size:.89rem;font-weight:750;line-height:1.3}
.announcement-slide a{color:var(--announcement-accent);font-size:.85rem;font-weight:850;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;white-space:nowrap}
.announcement-slide a:hover{text-decoration-thickness:2px}
.announcement-controls{display:flex;align-items:center}
.announcement-controls button{display:grid;place-items:center;width:30px;height:30px;padding:0;border:1px solid #768b97;border-radius:50%;background:#ffffffad;color:#173647;cursor:pointer;transition:transform .18s ease,background .18s ease}
.announcement-controls button:hover{transform:translateY(-2px);background:#fff}
@keyframes announcement-enter{from{opacity:.35;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}

body{--area-glow:#b9e8ef}
body[data-area="piscinas"],body[data-area="tinajas"],body[data-area="jacuzzis"],body[data-area="color"]{--area-glow:#a5eaf2}
body[data-area="electricidad"]{--area-glow:#f3e58a}
body[data-area="comercial"],body[data-area="tienda"]{--area-glow:#dec8f3}
.site-header .nav-quote,.btn,.float-wa{transition:transform .22s ease,box-shadow .22s ease,background-color .22s ease,border-color .22s ease}
.site-header .nav-quote{border-radius:999px;background:#e6f5f8;color:#102d40;border:1px solid #b9d7df;box-shadow:0 5px 18px #102d4012}
.site-header .nav-quote:hover{transform:translateY(-2px);background:var(--area-glow);box-shadow:0 10px 22px #102d4028}
.btn:hover{transform:translateY(-2px);filter:none;box-shadow:0 10px 24px #102d4029}
.btn:active,.site-header .nav-quote:active,.float-wa:active{transform:translateY(0) scale(.98)}
.view[data-view="piscinas"] .btn:not(.outline),.view[data-view="tinajas"] .btn:not(.outline),.view[data-view="jacuzzis"] .btn:not(.outline){background:#b9eef4;border-color:#71c9d8;color:#102d40}
.view[data-view="electricidad"] .btn:not(.outline){background:#fff0a3;border-color:#e7c955;color:#102d40}
.view[data-view="comercial"] .btn:not(.outline),.view[data-view="tienda"] .btn:not(.outline){background:#ead7f7;border-color:#c4a0df;color:#35214b}
.float-wa{box-shadow:0 0 0 5px var(--area-glow),0 12px 28px #0b6c3c3b}
.float-wa:hover{transform:translateY(-4px);box-shadow:0 0 0 7px var(--area-glow),0 18px 32px #0b6c3c59}
.home-solution strong span{display:inline-block;transition:transform .2s ease}
.home-solution:hover strong span{transform:translate(3px,-3px)}
.quick-shop{background:linear-gradient(130deg,#f9fcfd,#f4f8fb 62%,#f7f1fc)}
.quick-shop .section-head p{margin:8px 0 0;color:#506878}
.quick-shop-track{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
.quick-shop-card{display:flex;flex-direction:column;min-width:0;overflow:hidden;border:1px solid #d9e5e9;border-radius:20px;background:#fff;text-decoration:none;box-shadow:0 8px 24px #102d400b;transition:transform .22s ease,box-shadow .22s ease}
.quick-shop-card:hover{transform:translateY(-5px);box-shadow:0 16px 32px #102d4026}
.quick-shop-card:focus-visible{outline:3px solid #176b99;outline-offset:3px}
.quick-shop-art{display:grid;place-items:center;height:190px;padding:16px;overflow:hidden;background:#def5f8}
.quick-shop-card:nth-child(2) .quick-shop-art{background:#e6f6f8}
.quick-shop-card:nth-child(3) .quick-shop-art{background:#fff2bd}
.quick-shop-card:nth-child(4) .quick-shop-art{background:#eee1f9}
.quick-shop-art img{width:100%;height:100%;object-fit:contain;transition:transform .3s ease}
.quick-shop-card:hover .quick-shop-art img{transform:scale(1.06)}
.quick-shop-copy{display:flex;flex-direction:column;gap:8px;flex:1;padding:19px}
.quick-shop-copy small{color:#557082;font-size:.69rem;font-weight:900;letter-spacing:.1em}
.quick-shop-copy strong{color:#132f40;font-size:1.15rem;line-height:1.2}
.quick-shop-copy>span{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;color:#34576b;font-size:.86rem;font-weight:700}
.quick-shop-copy b{color:#165d79;font-size:1.25rem}
.quick-shop-hint{display:none}
@media(max-width:800px){.announcement-inner{grid-template-columns:minmax(0,1fr) auto;gap:7px;min-height:64px}.announcement-slide{display:flex;align-items:center;flex-wrap:nowrap;gap:9px;padding:7px 0}.announcement-tag{display:none}.announcement-message{flex:1;min-width:0;font-size:.76rem;line-height:1.3}.announcement-slide a{flex-shrink:0;font-size:.73rem}.announcement-controls button{width:29px;height:29px}}
@media(max-width:800px){.quick-shop-track{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(215px,64%);grid-template-columns:none;gap:13px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-inline:contain;padding:3px 3px 15px}.quick-shop-card{scroll-snap-align:start}.quick-shop-art{height:165px}.quick-shop-hint{display:block;margin:8px 0 0;color:#506878;font-size:.78rem}}
@media(max-width:390px){.announcement-inner{gap:4px}.announcement-slide{gap:6px}.announcement-slide a{font-size:.69rem}}
@media(prefers-reduced-motion:reduce){.announcement-slide{animation:none}.announcement-controls button,.site-header .nav-quote,.btn,.float-wa,.home-solution strong span,.quick-shop-card,.quick-shop-art img{transition:none}.announcement-controls button:hover,.site-header .nav-quote:hover,.btn:hover,.float-wa:hover,.home-solution:hover strong span,.quick-shop-card:hover,.quick-shop-card:hover .quick-shop-art img{transform:none}}