.meteo24-fullpage {
    min-height: 100vh;
    padding: clamp(24px, 5vw, 64px);
    box-sizing: border-box;
    background:
        radial-gradient(circle at 10% 10%, rgba(39, 141, 176, .22), transparent 30%),
        radial-gradient(circle at 85% 15%, rgba(255, 205, 85, .20), transparent 28%),
        linear-gradient(135deg, #f7fbfd 0%, #ffffff 44%, #edf7f5 100%);
    color: #172033;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.meteo24 * { box-sizing: border-box; }
.meteo24-brandbar {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 28px;
    padding: 12px 16px;
    border-radius: 999px;
    background: rgba(255,255,255,.84);
    border: 1px solid rgba(34,107,143,.18);
    box-shadow: 0 14px 34px rgba(23,43,77,.09);
}
.meteo24-brandmark {
    width: 46px;
    height: 46px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    font-weight: 900;
    color: #fff;
    letter-spacing: .04em;
    background: linear-gradient(135deg, #226b8f, #2f9ab3);
    box-shadow: 0 10px 22px rgba(34,107,143,.24);
}
.meteo24-brandbar strong,
.meteo24-brandbar span { display:block; }
.meteo24-brandbar strong { color:#172033; font-size:16px; }
.meteo24-brandbar span { color:#52606d; font-size:14px; }
.meteo24-header { display: flex; justify-content: space-between; gap: 24px; align-items: center; margin-bottom: 32px; }
.meteo24-kicker { margin: 0 0 8px; text-transform: uppercase; letter-spacing: .12em; font-weight: 800; color: #226b8f; font-size: 14px; }
.meteo24 h1 { margin: 0; font-size: clamp(34px, 6vw, 72px); line-height: 1.02; letter-spacing:-.04em; color:#101828; }
.meteo24 h2 { margin-top: 0; font-size: clamp(22px, 3vw, 34px); letter-spacing:-.025em; color:#101828; }
.meteo24-place { margin: 12px 0 0; font-size: clamp(17px, 2vw, 24px); color:#52606d; }
.meteo24-current { min-width: 190px; padding: 22px; border-radius: 28px; background: rgba(255,255,255,.88); box-shadow: 0 18px 50px rgba(23,43,77,.12); text-align: center; border:1px solid rgba(34,107,143,.13); }
.meteo24-temp { display: block; font-size: clamp(42px, 6vw, 76px); font-weight: 900; line-height: 1; color:#226b8f; }
.meteo24-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, .85fr); gap: 24px; }
.meteo24-card { background: rgba(255,255,255,.88); border: 1px solid rgba(34,107,143,.14); border-radius: 30px; padding: clamp(20px, 3vw, 34px); box-shadow: 0 18px 50px rgba(23,43,77,.10); }
.meteo24-maincard { border-top: 5px solid #226b8f; }
.meteo24-chart-wrap { min-height: 430px; position: relative; }
.meteo24-chart-wrap canvas { width: 100% !important; height: 430px !important; }
.meteo24-text { border-top: 5px solid #f0b43c; }
.meteo24-text p, .meteo24-text li { font-size: 18px; line-height: 1.55; }
.meteo24-text ul { padding-left: 20px; }
.meteo24-hours { margin-top: 24px; display: grid; grid-template-columns: repeat(6, minmax(120px, 1fr)); gap: 14px; }
.meteo24-hour { border-radius: 22px; background: rgba(255,255,255,.78); border: 1px solid rgba(34,107,143,.13); padding: 14px; text-align: center; box-shadow: 0 10px 25px rgba(23,43,77,.07); }
.meteo24-hour-time, .meteo24-hour-temp, .meteo24-hour-rain { display: block; }
.meteo24-hour-time { font-weight: 800; color:#101828; }
.meteo24-hour-icon { display: block; font-size: 30px; margin: 8px 0; }
.meteo24-hour-temp { font-size: 22px; font-weight: 900; color:#226b8f; }
.meteo24-hour-rain { font-size: 13px; color:#52606d; }
.meteo24-error { padding: 20px; border-radius: 16px; background: #fff3f3; color: #8a1f1f; }
.meteo24-trend { margin-top: 24px; border-top: 5px solid #2f9ab3; }
.meteo24-section-head { display: flex; justify-content: space-between; gap: 24px; align-items: flex-start; margin-bottom: 18px; }
.meteo24-section-head h2 { margin-bottom: 0; }
.meteo24-note { max-width: 420px; margin: 0; font-size: 15px; line-height: 1.45; color:#52606d; }
.meteo24-trend-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, .9fr); gap: 22px; align-items: stretch; }
.meteo24-trend-chart-wrap, .meteo24-trend-chart-wrap canvas { min-height: 380px; height: 380px !important; }
.meteo24-days { display: grid; gap: 10px; max-height: 440px; overflow: auto; padding-right: 4px; }
.meteo24-day { display: flex; justify-content: space-between; gap: 16px; padding: 12px 14px; border-radius: 18px; background: rgba(247,251,253,.88); border: 1px solid rgba(34,107,143,.13); }
.meteo24-day strong, .meteo24-day span { display: block; }
.meteo24-day-values { text-align: right; white-space: nowrap; font-size: 14px; }
.meteo24-confidence { font-weight: 900; color:#226b8f; }
.meteo24-about { margin-top:24px; background: linear-gradient(135deg, rgba(34,107,143,.10), rgba(255,255,255,.92)); border-left: 7px solid #226b8f; }
.meteo24-about p { font-size:18px; line-height:1.55; margin-bottom:0; }
.meteo24-about-note { color:#52606d; }
@media (max-width: 980px) { .meteo24-header, .meteo24-grid { grid-template-columns: 1fr; display: grid; } .meteo24-current { width: 100%; } .meteo24-hours { grid-template-columns: repeat(3, minmax(100px, 1fr)); } .meteo24-section-head, .meteo24-trend-layout { display: grid; grid-template-columns: 1fr; } .meteo24-days { max-height: none; } }
@media (max-width: 560px) { .meteo24-fullpage { padding: 18px; } .meteo24-brandbar { border-radius:24px; align-items:flex-start; } .meteo24-hours { grid-template-columns: repeat(2, minmax(100px, 1fr)); } .meteo24-chart-wrap, .meteo24-chart-wrap canvas { height: 340px !important; min-height: 340px; } .meteo24-day { display: grid; } .meteo24-day-values { text-align: left; } .meteo24-trend-chart-wrap, .meteo24-trend-chart-wrap canvas { height: 340px !important; min-height: 340px; } }