/* Hexagone Météo — Espace pro [pro-accueil] v1.0.0 */
.hxp{--hxp-encre:#0f1d2e;--hxp-doux:#526173;--hxp-filet:rgba(11,40,80,.12);--hxp-carte:#fff;--hxp-pale:#f3f7fb;--hxp-bleu:#0b5ccf;--hxp-vert:#12a150;--hxp-or:#f2a900;
	--hxp-v:#12a150;--hxp-o:#f08a00;--hxp-r:#e3141b;--hxp-n:#8a96a6;
	--hxp-degrade:var(--pro-degrade,linear-gradient(115deg,#0b5ccf,#12a150,#f2a900,#e8590c,#0b5ccf));
	color:var(--hxp-encre);font-size:16px;line-height:1.5;display:block;overflow:hidden}
.hxp *{box-sizing:border-box}
.hxp img{max-width:100%;height:auto;display:block}
.hxp-int{max-width:1200px;margin:0 auto;padding:0 16px}
.hxp h1,.hxp h2,.hxp h3{color:var(--hxp-encre);margin:0;letter-spacing:-.01em}
.hxp h2{font-size:clamp(25px,3.2vw,36px);font-weight:850;line-height:1.15}
.hxp h3{font-size:18px;font-weight:800;line-height:1.25}
.hxp p{margin:0}
.hxp-sur,.hxp-sur2{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--hxp-bleu);margin-bottom:10px}
.hxp-sur2--clair{color:#9cc6ff}
.hxp-chapo{font-size:17px;color:var(--hxp-doux);margin-top:10px;max-width:720px}
.hxp-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:999px;font-weight:800;font-size:16px;text-decoration:none!important;white-space:nowrap}
.hxp-btn.msl-pro-btn{color:#fff}
.hxp-btn--sec{background:#fff;color:var(--hxp-encre)!important;border:2px solid var(--hxp-encre)}
.hxp-btn--sec:hover{background:var(--hxp-encre);color:#fff!important}
.hxp-lien{display:inline-flex;gap:6px;align-items:center;color:var(--hxp-bleu);font-weight:800;text-decoration:none!important;margin-top:auto;padding-top:10px}
.hxp-lien span{transition:transform .2s}
.hxp-lien:hover span{transform:translateX(4px)}
.hxp-lien--clair{color:#9cc6ff}

/* feux */
.hxp-feu{display:inline-flex;align-items:center;gap:7px;padding:4px 11px 4px 9px;border-radius:999px;font-size:13px;font-weight:850;background:#eef2f6;color:var(--hxp-encre);white-space:nowrap}
.hxp-feu i{width:10px;height:10px;border-radius:50%;background:var(--hxp-n)}
.hxp-feu--v{background:#e3f6ea;color:#0b6b35}.hxp-feu--v i{background:var(--hxp-v);box-shadow:0 0 0 4px rgba(18,161,80,.18)}
.hxp-feu--o{background:#fff1dc;color:#9a4d00}.hxp-feu--o i{background:var(--hxp-o);box-shadow:0 0 0 4px rgba(240,138,0,.2)}
.hxp-feu--r{background:#fde4e4;color:#a40e13}.hxp-feu--r i{background:var(--hxp-r);box-shadow:0 0 0 4px rgba(227,20,27,.18);animation:hxp-pouls 1.6s ease-in-out infinite}
@keyframes hxp-pouls{50%{box-shadow:0 0 0 7px rgba(227,20,27,0)}}

/* 1. héros */
.hxp-heros{position:relative;padding:28px 0 36px;background:radial-gradient(1100px 500px at 85% 0%,rgba(18,161,80,.10),transparent 60%),radial-gradient(900px 500px at 0% 100%,rgba(11,92,207,.10),transparent 60%)}
.hxp-heros__int{display:grid;gap:28px}
.hxp-heros h1{font-size:clamp(34px,5.4vw,60px);line-height:1.04;font-weight:900;letter-spacing:-.025em}
.hxp-heros h1 em{font-style:normal;background:var(--hxp-degrade);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:hxp-glisse 9s linear infinite}
@keyframes hxp-glisse{to{background-position:300% 0}}
.hxp-heros__intro{font-size:18px;color:var(--hxp-doux);margin-top:14px;max-width:580px}
.hxp-heros__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.hxp-chiffres{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:12px 18px;max-width:560px}
.hxp-chiffres li{display:flex;flex-direction:column;border-left:3px solid var(--hxp-vert);padding-left:10px}
.hxp-chiffres b{font-size:24px;font-weight:900;line-height:1.1}
.hxp-chiffres span{font-size:13px;color:var(--hxp-doux)}
.hxp-heros__vis{position:relative;margin:0}
.hxp-ecran{position:relative;border-radius:18px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(11,40,80,.55),0 0 0 1px rgba(11,40,80,.08);transform:perspective(1400px) rotateY(-4deg) rotateX(2deg);transition:transform .6s}
.hxp-heros__vis:hover .hxp-ecran{transform:none}
.hxp-direct{position:absolute;left:12px;bottom:12px;display:inline-flex;align-items:center;gap:7px;background:rgba(15,29,46,.82);color:#fff;font-size:12.5px;font-weight:750;padding:6px 11px;border-radius:999px;backdrop-filter:blur(4px)}
.hxp-direct i{width:8px;height:8px;border-radius:50%;background:#ff5a4a;animation:hxp-pouls2 1.4s infinite}
@keyframes hxp-pouls2{50%{opacity:.3}}
.hxp-flotte{position:relative;margin:-26px 12px 0 auto;max-width:330px;background:#fff;border-radius:16px;padding:12px 14px;box-shadow:0 18px 40px -18px rgba(11,40,80,.5);border:1px solid var(--hxp-filet);display:flex;flex-direction:column;gap:6px;z-index:2}
.hxp-flotte__t{font-size:12.5px;font-weight:800;color:var(--hxp-doux);text-transform:uppercase;letter-spacing:.04em}
.hxp-flotte .hxp-feu{align-self:flex-start}
.hxp-flotte b{font-size:15px;line-height:1.35}

/* sections */
.hxp-sec{padding:44px 0}
.hxp-sec--outils{background:linear-gradient(180deg,var(--hxp-pale),#fff)}
.hxp-tete{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px}
.hxp-dep{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:var(--hxp-doux)}
.hxp-dep select{font:inherit;font-weight:750;color:var(--hxp-encre);padding:9px 12px;border-radius:12px;border:1.5px solid var(--hxp-filet);background:#fff;max-width:240px}

/* 2. décision du jour */
.hxp-grands{display:grid;gap:16px}
.hxp-m{display:flex;flex-direction:column;background:var(--hxp-carte);border-radius:20px;overflow:hidden;border:1px solid var(--hxp-filet);box-shadow:0 14px 34px -26px rgba(11,40,80,.55);transition:transform .25s,box-shadow .25s}
.hxp-m:hover{transform:translateY(-3px);box-shadow:0 22px 44px -26px rgba(11,40,80,.6)}
.hxp-m__img{display:block;aspect-ratio:16/8;overflow:hidden;background:#dfe7ef}
.hxp-m__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.hxp-m:hover .hxp-m__img img{transform:scale(1.04)}
.hxp-m__txt{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:16px 18px 18px;flex:1}
.hxp-m__v{font-size:16.5px;font-weight:750;line-height:1.35}
.hxp-m__v--attente{color:var(--hxp-doux);font-weight:600}
.hxp-m__r{font-size:14px;color:var(--hxp-doux)}
.hxp-m__quoi{font-size:13px;color:var(--hxp-doux);border-top:1px dashed var(--hxp-filet);padding-top:8px;width:100%}
.hxp-petits{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:8px}
.hxp-petits a{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center;padding:10px 14px;border-radius:14px;background:#fff;border:1px solid var(--hxp-filet);text-decoration:none!important;color:var(--hxp-encre)}
.hxp-petits a:hover{border-color:var(--hxp-bleu)}
.hxp-petits b{font-size:15px}
.hxp-petits__v{grid-column:2;font-size:13.5px;color:var(--hxp-doux);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hxp-pt{grid-row:1/3;width:12px;height:12px;border-radius:50%;background:var(--hxp-n)}
.hxp-pt--v{background:var(--hxp-v)}.hxp-pt--o{background:var(--hxp-o)}.hxp-pt--r{background:var(--hxp-r)}
.hxp-note{margin-top:14px!important;font-size:14px;color:var(--hxp-doux)}

/* 3. outils */
.hxp-outils{display:grid;gap:18px}
.hxp-o{display:flex;flex-direction:column;gap:6px}
.hxp-o__img{display:block;border-radius:16px;overflow:hidden;box-shadow:0 16px 36px -24px rgba(11,40,80,.6);margin-bottom:8px;aspect-ratio:16/10;background:#0e1a2b}
.hxp-o__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.hxp-o:hover .hxp-o__img img{transform:scale(1.03)}
.hxp-o p{font-size:15px;color:var(--hxp-doux)}

/* 4. preuve */
.hxp-preuve{background:radial-gradient(800px 400px at 15% 50%,rgba(232,89,12,.25),transparent 60%),linear-gradient(120deg,#0d1b2e,#14284a);color:#dce6f2;padding:44px 0}
.hxp-preuve__int{display:grid;gap:22px;align-items:center}
html body .hxp .hxp-preuve h2,html body .hxp .hxp-fin h2{color:#fff!important}
.hxp-preuve p{color:#c3d1e2;margin-top:10px;font-size:16.5px;max-width:720px}
.hxp-preuve__chiffre{display:flex;align-items:baseline;gap:10px}
.hxp-preuve__chiffre b{font-size:clamp(84px,12vw,140px);font-weight:900;line-height:.9;background:linear-gradient(135deg,#ffb347,#ff5a4a);-webkit-background-clip:text;background-clip:text;color:transparent}
.hxp-preuve__chiffre span{font-size:20px;font-weight:800;color:#fff;max-width:120px;line-height:1.15}

/* 5. station */
.hxp-station{display:grid;gap:24px;align-items:center}
.hxp-station__img{margin:0;border-radius:20px;overflow:hidden;box-shadow:0 20px 44px -28px rgba(11,40,80,.6)}
.hxp-station__txt{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.hxp-bientot{font-size:11px;letter-spacing:.04em;background:#fff1dc;color:#9a4d00;border-radius:999px;padding:3px 9px}
.hxp-coches{list-style:none;margin:14px 0 20px;padding:0;display:grid;gap:8px}
.hxp-coches li{position:relative;padding-left:30px;font-size:15.5px}
.hxp-coches li::before{content:"";position:absolute;left:0;top:2px;width:20px;height:20px;border-radius:50%;background:var(--hxp-vert) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/14px no-repeat}

/* 6. formules */
.hxp-sec--formules{background:var(--hxp-pale)}
.hxp-formules{display:grid;gap:14px}
.hxp-f{display:flex;flex-direction:column;gap:8px;background:#fff;border-radius:18px;padding:20px;border:1px solid var(--hxp-filet)}
.hxp-f h3{display:flex;align-items:center;gap:8px}
.hxp-f p{color:var(--hxp-doux);font-size:15px}
.hxp-f--vedette{position:relative;border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,var(--hxp-degrade) border-box;background-size:auto,300% 100%;animation:hxp-glisse 9s linear infinite}

/* 7. fin */
.hxp-fin{padding:40px 0 56px}
.hxp-fin__int{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;background:linear-gradient(120deg,#0b5ccf,#12a150);border-radius:24px;padding:28px 24px;color:#fff}
.hxp-fin h2{color:#fff;font-size:clamp(22px,2.6vw,30px)}
.hxp-fin p{color:#e5f3ec;margin-top:6px;max-width:560px}
.hxp-fin .hxp-btn--sec{background:transparent;color:#fff!important;border-color:#fff}
.hxp-fin .msl-pro-btn{background:#fff!important;color:#0b5ccf!important}

@media (prefers-reduced-motion:reduce){.hxp *{animation:none!important;transition:none!important}}

/* tablette et plus */
@media (min-width:640px){
	.hxp-chiffres{grid-template-columns:repeat(4,1fr)}
	.hxp-grands{grid-template-columns:repeat(2,1fr)}
	.hxp-petits{grid-template-columns:repeat(2,1fr)}
	.hxp-outils{grid-template-columns:repeat(2,1fr)}
	.hxp-formules{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:980px){
	.hxp-heros{padding:48px 0 56px}
	.hxp-heros__int{grid-template-columns:1.02fr 1fr;align-items:center;gap:44px}
	.hxp-flotte{position:absolute;left:-34px;bottom:-30px;margin:0}
	.hxp-grands{grid-template-columns:repeat(4,1fr)}
	.hxp-petits{grid-template-columns:repeat(3,1fr)}
	.hxp-outils{grid-template-columns:repeat(3,1fr)}
	.hxp-preuve__int{grid-template-columns:auto 1fr;gap:44px}
	.hxp-station{grid-template-columns:1.1fr 1fr;gap:44px}
	.hxp-sec{padding:64px 0}
	.hxp-fin__int{padding:36px 40px}
}
/* téléphone : héros resserré */
@media (max-width:639px){
	.hxp-heros{padding-top:18px}
	.hxp-heros__intro{font-size:16.5px}
	.hxp-heros__actions .hxp-btn{flex:1 1 auto}
	.hxp-ecran{transform:none}
	.hxp-m__img{aspect-ratio:16/7}
	.hxp-dep{width:100%}.hxp-dep select{flex:1;max-width:none}
	.hxp-direct{top:10px;bottom:auto}
	/* les 4 grands métiers en rangée qu'on fait glisser du doigt */
	.hxp-grands{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin:0 -16px;padding:4px 16px 14px;scrollbar-width:none}
	.hxp-grands::-webkit-scrollbar{display:none}
	.hxp-m{flex:0 0 84%;scroll-snap-align:center}
	.hxp-m__img{aspect-ratio:16/8}
	.hxp-m__quoi{display:none}
}

/* thème sombre du site */
html.msl-sombre .hxp{--hxp-encre:#e9eef4;--hxp-doux:#a9b6c6;--hxp-filet:rgba(255,255,255,.12);--hxp-carte:#15202e;--hxp-pale:#101a26}
html.msl-sombre .hxp-petits a,html.msl-sombre .hxp-f,html.msl-sombre .hxp-flotte,html.msl-sombre .hxp-dep select{background:#15202e}
html.msl-sombre .hxp-btn--sec{background:transparent}
html.msl-sombre .hxp-f--vedette{background:linear-gradient(#15202e,#15202e) padding-box,var(--hxp-degrade) border-box;background-size:auto,300% 100%}
html.msl-sombre .hxp-sec--outils{background:linear-gradient(180deg,#101a26,transparent)}
