/* «Clima» del cliente (prefijo .cl) */
.cl{--cl-ink:#0b1b3d;--cl-muted:#667691;--cl-line:#e3eaf4;--cl-blue:#0b63f6;display:grid;grid-template-columns:minmax(0,1fr);gap:16px;color:var(--cl-ink)}
.cl *{box-sizing:border-box}
.cl [data-cl-body]{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.cl-i{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none}
.cl h2,.cl h3,.cl p{letter-spacing:0}.cl p{margin:0}
.cl-card{border:1px solid var(--cl-line);border-radius:20px;background:#fff;padding:18px;box-shadow:0 6px 22px rgba(11,31,77,.05);min-width:0;display:flex;flex-direction:column;gap:12px}
.cl-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0}.cl-head>div:not(.cl-tabs){min-width:0;flex:1}
.cl .cl-head h2{margin:0;font-size:18px;line-height:1.2;color:var(--cl-ink)}
.cl-head-ico{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#e4efff;color:var(--cl-blue);flex:none}.cl-head-ico.is-amber{background:#fff1c7;color:#c98200}
.cl-muted,.cl-fine,.cl-sub{color:var(--cl-muted);font-size:12.5px;line-height:1.4}.cl-fine{font-size:12px}
.cl-link{margin-left:auto;border:0;background:none;padding:0;color:var(--cl-blue);font:inherit;font-size:13px;font-weight:700;cursor:pointer}.cl-link:hover{text-decoration:underline}
.cl-loading{align-items:center;text-align:center;padding:36px;color:var(--cl-muted)}.cl-loading .cl-i{width:34px;height:34px;color:#9bb0d3}
.cl-source{color:var(--cl-muted);font-size:12px;text-align:center}.cl-source a{color:var(--cl-blue)}

/* Portada */
.cl-hero{position:relative;overflow:hidden;min-height:190px;border-radius:24px;padding:26px;color:#fff;background:#0b3a7a var(--cl-photo,url(/assets/plans-water.webp)) center/cover no-repeat}
.cl-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(95deg,rgba(6,24,64,.82),rgba(6,24,64,.45) 55%,rgba(6,24,64,.1))}
.cl-now{position:relative;display:grid;gap:14px;max-width:560px}
.cl .cl-now h2{margin:0;font-size:clamp(22px,3vw,30px);color:#fff;letter-spacing:-.01em}
.cl-temp{display:flex;align-items:center;gap:14px}.cl-temp .portal-weather-icon{width:74px;height:74px}.cl-temp>strong{font-size:clamp(54px,8vw,76px);line-height:1;letter-spacing:-.03em}
.cl-temp>span{display:grid;gap:2px}.cl-temp>span b{font-size:22px}.cl-temp>span small{font-size:14px;color:#dbe8ff}
.cl-stats{display:flex;flex-wrap:wrap;gap:8px 26px}.cl-stat{display:inline-flex;align-items:center;gap:9px}.cl-stat .cl-i{width:26px;height:26px;color:#cfe1ff}.cl-stat>span{display:grid;line-height:1.2}.cl-stat small{font-size:12px;color:#cfe1ff}.cl-stat b{font-size:15px}
.cl-advice{position:absolute;right:22px;top:20px;width:min(460px,calc(100% - 44px));display:grid;gap:8px;text-align:left;padding:14px 16px;border:0;border-radius:18px;background:rgba(255,255,255,.96);color:var(--cl-ink);font:inherit;cursor:pointer;box-shadow:0 14px 34px rgba(0,0,0,.22)}
.cl-advice-head{display:flex;align-items:center;gap:8px;font-size:14.5px}.cl-advice-head .cl-i{color:#f5a300}
.cl-advice-body{display:flex;align-items:center;gap:12px}.cl-advice-body>span:nth-child(2){display:grid;gap:3px;min-width:0;flex:1}.cl-advice-body b{font-size:17px}.cl-advice-body small{font-size:12.5px;line-height:1.4;color:#41557c}
.cl-advice-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;background:#fff3cf;color:#e09a00;flex:none}.cl-advice-ico .cl-i{width:30px;height:30px}
.cl-advice.is-rain .cl-advice-ico{background:#e4efff;color:#0b63f6}.cl-advice.is-wind .cl-advice-ico,.cl-advice.is-cold .cl-advice-ico{background:#e8f1f8;color:#4b7ba8}.cl-advice.is-mild .cl-advice-ico{background:#dcf5e7;color:#0f8a4c}
.cl-go{width:18px;height:18px;color:#9bb0d3}

/* Pronóstico */
.cl-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-left:auto}.cl-tabs button{padding:8px 16px;border:1px solid var(--cl-line);border-radius:10px;background:#fff;color:#41557c;font:inherit;font-size:13px;font-weight:600;cursor:pointer}.cl-tabs button.is-on{background:#0b63f6;border-color:#0b63f6;color:#fff}
.cl-days{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--cl-n,7),minmax(0,1fr));border:1px solid var(--cl-line);border-radius:16px;overflow:hidden}
.cl-day{display:grid;justify-items:center;align-content:start;gap:4px;padding:14px 8px 12px;text-align:center;box-shadow:-1px -1px 0 var(--cl-line);min-width:0}
.cl-day>b{font-size:14px}.cl-day>small{color:var(--cl-muted);font-size:12px}.cl-day .portal-weather-icon{width:42px;height:42px;margin:2px 0}
.cl-big{font-size:22px;letter-spacing:-.02em}.cl-big small{font-size:15px;color:var(--cl-muted);font-weight:600}
.cl-day.is-hot .cl-big{color:#c0521a}
.cl-meta{display:flex;gap:10px;color:#41557c;font-size:11.5px}.cl-meta span{display:inline-flex;align-items:center;gap:3px}.cl-meta .cl-i{width:13px;height:13px;color:#0b63f6}.cl-meta span:last-child .cl-i{color:#f5a300}
.cl-bar{display:block;width:70%;height:6px;border-radius:999px;background:#eef1f6;overflow:hidden}.cl-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ffb347,#ff6b3d)}.cl-bar.is-blue i{background:linear-gradient(90deg,#8cc2ff,#1a73ff)}
.cl-chip{margin-top:6px;padding:6px 8px;border-radius:9px;font-size:11.5px;font-weight:700;width:100%;white-space:normal;line-height:1.2}
.cl-chip.is-hot{background:#ffe9db;color:#b4421a}.cl-chip.is-ok{background:#dcf5e7;color:#0f6f3f}.cl-chip.is-rain{background:#e4efff;color:#1b4fa8}

/* Filas */
.cl-row{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:16px;align-items:start}.cl-row.is-3{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1.15fr)}
.cl-chart{width:100%;height:auto;font-size:9.5px;fill:#667691}.cl-line-max{fill:none;stroke:#ff7a2f;stroke-width:2.6}.cl-line-min{fill:none;stroke:#1a73ff;stroke-width:2.6}.cl-dot-max{fill:#fff;stroke:#ff7a2f;stroke-width:2.4}.cl-dot-min{fill:#fff;stroke:#1a73ff;stroke-width:2.4}
.cl-val-max,.cl-val-min{fill:#0b1b3d;font-weight:700;font-size:10.5px}.cl-water{stroke:#16a37f;stroke-width:2;stroke-dasharray:5 4}.cl-water-t{fill:#0f7a5e;font-weight:700;font-size:10px}
.cl-legend{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:#41557c;flex-wrap:wrap}.cl-legend i{width:10px;height:10px;border-radius:50%;margin-left:8px}.cl-legend i.is-max{background:#ff7a2f}.cl-legend i.is-min{background:#1a73ff}.cl-legend i.is-water{background:#16a37f}
.cl-hours{display:flex;align-items:flex-end;justify-content:space-between;gap:6px;min-height:150px;padding-top:8px}
.cl-hour{display:grid;justify-items:center;align-items:end;gap:4px;flex:1;min-width:0}.cl-hour b{font-size:12.5px}.cl-hour i{display:block;width:100%;max-width:34px;border-radius:7px 7px 3px 3px}.cl-hour small{color:var(--cl-muted);font-size:11.5px}
.cl-callout{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:#fff6dd}.cl-callout .cl-i{width:30px;height:30px;color:#e09a00}.cl-callout p{font-size:13px;line-height:1.4;color:#5a4a1a}
.cl-uv-body{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:14px;align-items:stretch}
.cl-uv-now{display:grid;align-content:center;justify-items:center;gap:2px;padding:12px;border-radius:16px;background:#fff6e4}.cl-uv-now small{color:var(--cl-muted);font-size:12px}.cl-uv-now strong{font-size:40px;line-height:1}.cl-uv-now span{font-size:13px;font-weight:700;color:#b4421a}
.cl-uv-info{padding:12px 14px;border-radius:16px;background:#fff0ef;display:grid;gap:4px;align-content:start}.cl-uv-info b{display:flex;align-items:center;gap:6px;font-size:13.5px;color:#b4421a}.cl-uv-info b .cl-i{width:16px;height:16px}.cl-uv-info p{font-size:12.5px;line-height:1.4;color:#6b4a47}
.cl-scale{position:relative;display:grid;gap:4px;padding-top:6px}.cl-scale-bar{display:block;height:8px;border-radius:999px;background:linear-gradient(90deg,#3bb54a,#a8cf3a,#f4c230,#f08a2b,#e8412d,#9a3bd3)}.cl-scale i{position:absolute;top:2px;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:#fff;border:3px solid #e8412d;box-shadow:0 1px 4px rgba(0,0,0,.25)}
.cl-scale-labels{display:flex;justify-content:space-between}.cl-scale-labels small{font-size:10.5px;color:var(--cl-muted)}
.cl-bars{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;min-height:130px}.cl-bar-col{display:grid;justify-items:center;align-items:end;gap:4px;flex:1}.cl-bar-col b{font-size:12px}.cl-bar-col i{display:block;width:100%;max-width:26px;border-radius:7px 7px 3px 3px;background:linear-gradient(180deg,#8cc2ff,#1a73ff)}.cl-bar-col small{font-size:11.5px;color:var(--cl-muted)}
.cl-tip-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}.cl-tip-list li{display:flex;align-items:flex-start;gap:12px;padding:8px 6px;border-radius:12px}.cl-tip-list li.is-now{background:#f4f8ff}
.cl-tip-ico{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#fff1c7;color:#c98200;flex:none}.cl-tip-list li:nth-child(2) .cl-tip-ico{background:#e4efff;color:#0b63f6}.cl-tip-list li:nth-child(3) .cl-tip-ico{background:#e8f1f8;color:#4b7ba8}.cl-tip-list li:nth-child(4) .cl-tip-ico{background:#eef1f6;color:#5a6a85}
.cl-tip-list span:last-child{display:grid;gap:1px;min-width:0}.cl-tip-list b{font-size:13.5px}.cl-tip-list small{color:var(--cl-muted);font-size:12.5px;line-height:1.35}.cl-tip-list em{font-style:normal;font-size:11.5px;font-weight:700;color:#b4421a}

/* Avisos y pronóstico largo */
.cl-more{padding:0;gap:0;overflow:hidden}.cl-more>summary{display:flex;align-items:center;gap:12px;padding:16px 18px;cursor:pointer;list-style:none}.cl-more>summary::-webkit-details-marker{display:none}
.cl-more>summary>.cl-i{width:36px;height:36px;padding:8px;border-radius:11px;background:#e4efff;color:var(--cl-blue)}.cl-more>summary>span{display:grid;gap:2px}.cl-more>summary b{font-size:16px}.cl-more>summary small{color:var(--cl-muted);font-size:12.5px}
.cl-more-body{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;padding:0 18px 18px}

body[data-page="panel"] .cl .cl-muted,body[data-page="panel"] .cl .cl-fine,body[data-page="panel"] .cl .cl-sub{color:#667691}
body[data-page="panel"] .cl .cl-advice small{color:#41557c}body[data-page="panel"] .cl .cl-hero p{color:#fff}

@media (max-width:1280px){.cl-row,.cl-row.is-3{grid-template-columns:minmax(0,1fr)}.cl-advice{position:relative;right:auto;top:auto;width:100%;margin-top:18px}.cl-hero{padding:20px}}
@media (max-width:860px){.cl-days{grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}.cl-uv-body{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){.cl-tabs{margin-left:0;width:100%}.cl-tabs button{flex:1 1 40%}.cl-chart{font-size:16px}.cl-val-max,.cl-val-min{font-size:17px}.cl-water-t{font-size:15px}}