/* * pompe-de-relevage.net — thème prn-soupirail (v1.0.0, 03/11/2026). * « Le soupirail sous la façade » : l'eau du sous-sol remonte vers la rue, sous les assises de * pierre calcaire des immeubles de Paris et des Hauts-de-Seine. * * Mode clair UNIQUEMENT : color-scheme:light posé exprès pour qu'un navigateur réglé en sombre * ne réécrive pas les champs ni les boutons. Jetons --sb-* (namespace commun du réseau), * classes .prn-*. Une seule feuille. * * Signature visuelle : * - SOUPIRAIL : cadre de pierre taillée à linteau cintré et clé de voûte, ouverture (la photo), * grille de fonte fine en surimpression, appui de pierre dessous ; * - FAÇADE : assises de pierre calcaire en joints fins (fond des bandeaux), soubassement plus * sombre et trottoir de zinc en pied de hero ; * - PLAQUE : carte arrondie claire à liseré de laiton, quatre vis dessinées aux coins — * formulaire du hero, cartouche « En bref », note de rubrique ; * - ZINC : bandes sombres à joints debout (toits de Paris), pied de page ; * - boutons en pilules (Bleu Seine ou Zinc), arches douces sur les cartes de situation. * Laiton = liserés, vis, icônes ; jamais de texte posé sur un aplat de laiton (APCA < 60). */ /* ===================== 1. JETONS ===================== */ :root{ color-scheme:light; /* Palette : Pierre calcaire / Pierre claire / Zinc des toits / Ardoise / Laiton / Eau / Bleu Seine */ --pierre:#ECE5D8; --pierre-claire:#F7F3EC; --pierre-sombre:#D8CEBC; --blanc:#FFFFFF; --zinc:#3E4A56; --ardoise:#2A323B; --fumee:#566370; --joint:#D9CFBF; --laiton:#B08A3E; --laiton-fonce:#7C5F22; --laiton-pale:#F1E6C9; --eau:#7FA9C4; --eau-pale:#E3EEF4; --seine:#1F5F8B; --seine-fonce:#174A6D; --alarme:#9E2A14; --alarme-fond:#FBE9E4; --remis:#2F7A4B; --remis-fond:#E7F2EA; /* Alias du namespace réseau */ --sb-accent:var(--seine); --sb-accent-clair:var(--eau-pale); --sb-encre:var(--ardoise); --sb-doux:var(--fumee); --sb-filet:var(--joint); --sb-fond-carte:var(--pierre-claire); --sb-surf:var(--pierre); --sb-fonce:var(--ardoise); --sb-sur-fonce:var(--pierre-claire); /* Typo : Gloock (titres, un seul graissage) + Albert Sans (texte, chiffres) */ --f-titre:'Gloock',Georgia,'Times New Roman',serif; --f-corps:'Albert Sans',system-ui,-apple-system,'Segoe UI',sans-serif; --sb-titre:var(--f-titre); /* Rayons : cartes douces, pilules, arches */ --r-carte:16px; --r-tuile:12px; --r-champ:10px; --r-tag:999px; --r-btn:999px; --arche:50% 50% 6px 6px / 12% 12% 6px 6px; /* Ombres froides (zinc), jamais noires */ --ombre-carte:0 1px 2px rgba(42,50,59,.07),0 10px 26px -12px rgba(42,50,59,.22); --ombre-plaque:0 2px 3px rgba(42,50,59,.22),0 30px 50px -22px rgba(42,50,59,.5); --ombre-cadre:0 34px 56px -30px rgba(42,50,59,.55); /* Façade : assises de pierre (joints fins), soubassement (blocs plus grands, plus sombres), joints debout du zinc */ --assises:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='168' height='76'%3E%3Cpath d='M0 .5H168M0 38.5H168M.5 0V38M84.5 38V76' stroke='%233E4A56' stroke-opacity='.11' fill='none'/%3E%3C/svg%3E"); --soubassement:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='96'%3E%3Cpath d='M0 .5H220M0 48.5H220M.5 0V48M110.5 48V96' stroke='%232A323B' stroke-opacity='.2' fill='none'/%3E%3C/svg%3E"); --joints-zinc:repeating-linear-gradient(90deg,transparent 0 88px,rgba(255,255,255,.07) 88px 90px,rgba(0,0,0,.2) 90px 92px,transparent 92px 96px); --conteneur:1280px; --marge:40px; --cadre:12px; } @media (max-width:1180px){ :root{ --marge:28px; } } @media (max-width:760px){ :root{ --marge:16px; --cadre:8px; } } /* ===================== 2. BASE ===================== */ *,*::before,*::after{box-sizing:border-box;} html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;} @media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} } body{ margin:0; min-height:100vh; display:flex;flex-direction:column; background:var(--pierre); color:var(--ardoise); font-family:var(--f-corps); font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased; overflow-x:hidden; } body > header,body > nav,body > main,body > footer{width:100%;} body > main{flex:1 0 auto;} body > footer{margin-top:auto;} img,svg{max-width:100%;display:block;} img{height:auto;} a{color:inherit;text-decoration:none;} button{font:inherit;cursor:pointer;background:none;border:none;color:inherit;} ul{list-style:none;margin:0;padding:0;} h1,h2,h3,h4{font-family:var(--f-titre);font-weight:400;margin:0;color:var(--ardoise);line-height:1.1;letter-spacing:-.005em;} h3,h4{line-height:1.2;} p{margin:0 0 16px;} :focus-visible{outline:3px solid var(--seine);outline-offset:2px;} [hidden]{display:none!important;} .conteneur{max-width:calc(var(--conteneur) + 2*var(--marge));margin-inline:auto;padding-inline:var(--marge);} .prn-accent{color:var(--seine);} .prn-visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;} .prn-skip{position:absolute;left:-9999px;top:0;background:var(--ardoise);color:var(--pierre-claire);padding:12px 20px;z-index:999;border-radius:0 0 12px 0;} .prn-skip:focus{left:0;} /* Apparition : le contenu est TOUJOURS visible (opacity 1) ; avec JS, une section sous le pli se glisse de 16 px, rien d'autre. */ [data-prn-apparait]{transition:transform .6s cubic-bezier(.2,.7,.2,1);} [data-prn-apparait].est-pret{transform:translateY(16px);} [data-prn-apparait].est-pret.est-visible{transform:none;} @media (prefers-reduced-motion:reduce){ [data-prn-apparait],[data-prn-apparait].est-pret{transform:none;transition:none;} } /* ===================== 3. BOUTONS ET ÉTIQUETTES ===================== */ .prn-btn{ display:inline-flex;align-items:center;justify-content:center;gap:10px; height:50px;padding:0 26px;border-radius:var(--r-btn); font-family:var(--f-corps);font-weight:700;font-size:16px;line-height:1;letter-spacing:.005em; background:var(--pierre-claire);color:var(--ardoise);border:1.5px solid var(--zinc); transition:transform .16s ease,box-shadow .16s ease,background .16s ease,color .16s ease,border-color .16s ease; } .prn-btn:hover{transform:translateY(-2px);box-shadow:0 12px 18px -12px rgba(42,50,59,.6);background:var(--blanc);} .prn-btn__fleche{display:inline-flex;transition:transform .16s ease;} .prn-btn:hover .prn-btn__fleche{transform:translateX(3px);} .prn-btn svg{width:18px;height:18px;} .prn-btn--plein{background:var(--seine);color:#fff;border-color:var(--seine);} .prn-btn--plein:hover{background:var(--seine-fonce);border-color:var(--seine-fonce);} .prn-btn--sombre{background:var(--zinc);color:#fff;border-color:var(--zinc);} .prn-btn--sombre:hover{background:var(--ardoise);border-color:var(--ardoise);} .prn-btn--clair,.prn-btn--blanc{background:var(--pierre-claire);color:var(--ardoise);border-color:var(--pierre-claire);} .prn-btn--clair:hover,.prn-btn--blanc:hover{background:#fff;border-color:#fff;} .prn-btn--contour{background:transparent;color:var(--ardoise);border-color:var(--zinc);} .prn-btn--contour:hover{background:var(--zinc);color:#fff;} .prn-section--ardoise .prn-btn--contour,.prn-final .prn-btn--contour{color:var(--pierre-claire);border-color:rgba(247,243,236,.65);} .prn-section--ardoise .prn-btn--contour:hover,.prn-final .prn-btn--contour:hover{background:var(--pierre-claire);color:var(--ardoise);} .prn-btn--grand{height:56px;padding:0 32px;} .prn-btn--pleine-largeur{width:100%;} .prn-btn--espace{margin-top:20px;} .prn-btn:disabled,.prn-btn.est-desactive{opacity:.38;pointer-events:none;box-shadow:none;} /* Surtitre : une petite vis de laiton + une ligne de texte courante (pas de capitales) */ .prn-surtitre{ display:inline-flex;align-items:center;gap:10px;align-self:flex-start; font:600 15px/1.3 var(--f-corps);color:var(--zinc); } .prn-surtitre::before{ content:"";flex:none;width:13px;height:13px;border-radius:50%; background: linear-gradient(38deg,transparent 43%,rgba(66,44,10,.85) 43% 57%,transparent 57%), radial-gradient(circle at 35% 30%,#EBDCAE 0 1.5px,var(--laiton) 3px 100%); box-shadow:inset 0 0 0 1px rgba(124,95,34,.8),0 1px 1px rgba(42,50,59,.25); } .prn-surtitre--sombre,.prn-section--ardoise .prn-surtitre{color:var(--pierre-claire);} /* ===================== 4. EN-TÊTE ===================== */ .prn-header{position:sticky;top:0;z-index:60;background:rgba(247,243,236,.97);border-bottom:2px solid rgba(176,138,62,.7);padding:11px 0;transition:box-shadow .25s ease;} .prn-header.est-colle{box-shadow:0 12px 24px -16px rgba(42,50,59,.45);} .prn-header__ligne{display:flex;align-items:center;gap:18px;} .prn-logo{display:flex;align-items:center;gap:11px;margin-right:auto;} .prn-logo__symbole{width:40px;height:40px;flex:none;} .prn-logo__symbole img,.prn-logo__symbole svg{display:block;width:100%;height:100%;} .prn-logo__texte{font-family:var(--f-titre);font-weight:400;font-size:23px;line-height:1;color:var(--ardoise);white-space:nowrap;} .prn-logo--clair{margin-right:0;} .prn-logo--clair .prn-logo__symbole{width:36px;height:36px;} .prn-logo--clair .prn-logo__texte{color:var(--pierre-claire);} .prn-nav{display:flex;align-items:center;} .prn-nav__liste{display:flex;gap:2px;flex-wrap:nowrap;} .prn-nav__lien{ position:relative;display:inline-flex;align-items:center;height:42px;padding:0 15px;border-radius:999px; font-weight:600;font-size:15px;white-space:nowrap;color:var(--ardoise); transition:background .18s ease,color .18s ease; } .prn-nav__lien:hover{background:var(--pierre);} .prn-nav__lien.est-actif{color:var(--seine);} .prn-nav__lien.est-actif::after{content:"";position:absolute;left:50%;bottom:3px;width:22px;height:3px;margin-left:-11px;border-radius:2px;background:var(--laiton);} .prn-header__cta{height:44px;padding:0 22px;font-size:15px;flex:none;} .prn-nav__bascule{display:none;width:44px;height:44px;border-radius:50%;background:var(--pierre-claire);border:1.5px solid var(--zinc);align-items:center;justify-content:center;flex:none;} .prn-nav__traits,.prn-nav__traits::before,.prn-nav__traits::after{display:block;width:18px;height:2px;border-radius:1px;background:var(--ardoise);} .prn-nav__traits{position:relative;} .prn-nav__traits::before{content:"";position:absolute;top:-6px;} .prn-nav__traits::after{content:"";position:absolute;top:6px;} .prn-mobile-panel{position:fixed;inset:0;background:var(--pierre-claire);z-index:100;display:flex;flex-direction:column;padding:20px var(--marge);transform:translateY(-100%);transition:transform .3s ease;visibility:hidden;} .prn-mobile-panel.est-ouvert{transform:none;visibility:visible;} .prn-mobile-panel__tete{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;} .prn-mobile-panel__tete .prn-nav__bascule{display:flex;} .prn-mobile-panel__tete .prn-nav__bascule svg{width:22px;height:22px;} .prn-mobile-panel__liste{display:flex;flex-direction:column;flex:1;} .prn-mobile-panel__lien{height:58px;display:flex;align-items:center;font-family:var(--f-titre);font-size:23px;border-bottom:1px solid var(--joint);} .prn-mobile-panel__cta{margin-top:20px;} @media (max-width:1180px){ .prn-nav__liste{display:none;} .prn-nav__bascule{display:flex;} .prn-header__cta .prn-header__cta-long{display:none;} } @media (min-width:1181px){ .prn-header__cta-court{display:none;} } @media (max-width:480px){ .prn-header__ligne{gap:10px;} .prn-logo__symbole{width:34px;height:34px;} .prn-logo__texte{font-size:19px;} .prn-header__cta{padding:0 16px;height:42px;} .prn-nav__bascule{width:42px;height:42px;} } /* ===================== 5. BANDES DE SECTION ===================== */ .prn-section{position:relative;padding:clamp(40px,6vh,64px) 0 0;} .prn-section__panneau{max-width:calc(var(--conteneur) + 2*var(--marge));margin-inline:auto;padding:0 var(--marge) clamp(40px,6vh,64px);} .prn-section--claire{background:var(--pierre-claire);border-block:1px solid var(--joint);} .prn-section--pierre{background-color:var(--pierre);background-image:var(--assises);background-size:168px 76px;} .prn-section--ardoise{background-color:var(--ardoise);background-image:var(--joints-zinc);color:rgba(247,243,236,.88);} .prn-section--ardoise h2,.prn-section--ardoise h3{color:var(--pierre-claire);} .prn-section--ardoise::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:linear-gradient(var(--laiton),#8F6F2D);} .prn-section--nue{background:transparent;} .prn-section--nue > .conteneur{padding-block:0 clamp(40px,6vh,64px);} .prn-section__tete{max-width:none;margin-bottom:32px;display:flex;flex-direction:column;align-items:flex-start;gap:14px;} .prn-section__tete h2,.prn-section__panneau > h2{font-size:clamp(30px,3vw,46px);line-height:1.08;} .prn-section__chapo{color:var(--fumee);font-size:19px;margin-top:12px;max-width:44ch;} .prn-section--ardoise .prn-section__chapo{color:rgba(247,243,236,.8);} .prn-panneau-etroit{max-width:880px;} .prn-panneau-centre{text-align:center;} .prn-grille--espace{margin-top:24px;} .prn-appel-final{padding-bottom:0;} /* ===================== 6. LE SOUPIRAIL ET LA PLAQUE ===================== */ /* Le soupirail : cadre de pierre à linteau cintré, ouverture (photo), grille de fonte, appui. Hauteur dictée par ses classes. */ .prn-sou{ position:relative; --pas:24px;--barre:3px;--appui:14px; padding:var(--cadre); border-radius:var(--arche); background:linear-gradient(180deg,#FBF8F2,#E4DBCB); box-shadow:0 0 0 1px rgba(62,74,86,.28),inset 0 2px 0 #fff,var(--ombre-cadre); } /* Appui de fenêtre : une pierre plus large dessous, légèrement en saillie */ .prn-sou::after{ content:"";position:absolute;left:calc(-1 * var(--appui));right:calc(-1 * var(--appui));bottom:calc(-1 * var(--appui));height:var(--appui); border-radius:4px;background:linear-gradient(180deg,#F3EDE1,#CFC4B0); box-shadow:0 0 0 1px rgba(62,74,86,.28),0 12px 16px -10px rgba(42,50,59,.55); } .prn-sou__jour{ position:relative;overflow:hidden;height:100%;min-height:100px; border-radius:50% 50% 3px 3px / 11% 11% 3px 3px; background-color:var(--pierre-sombre);background-image:var(--soubassement);background-size:150px 66px; } .prn-sou__jour img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;margin:0;border-radius:0;} /* Grille de fonte : barreaux fins (reflet + corps) et deux traverses, ombre intérieure — la photo reste lisible */ .prn-sou__grille{ position:absolute;inset:var(--cadre);pointer-events:none; border-radius:50% 50% 3px 3px / 11% 11% 3px 3px; background: linear-gradient(180deg,transparent calc(34% - 2px),rgba(30,37,44,.5) calc(34% - 2px) calc(34% + 2px),transparent calc(34% + 2px)), linear-gradient(180deg,transparent calc(68% - 2px),rgba(30,37,44,.5) calc(68% - 2px) calc(68% + 2px),transparent calc(68% + 2px)), repeating-linear-gradient(90deg,transparent 0 calc(var(--pas) - var(--barre) - 1px),rgba(255,255,255,.16) calc(var(--pas) - var(--barre) - 1px) calc(var(--pas) - var(--barre)),rgba(30,37,44,.52) calc(var(--pas) - var(--barre)) var(--pas)); box-shadow:inset 0 22px 34px -14px rgba(20,26,32,.72),inset 0 -16px 26px -18px rgba(20,26,32,.45),inset 0 0 0 2px rgba(20,26,32,.38); } /* Clé de voûte (hero et en-tête d'article) */ .prn-sou--cle::before{ content:"";position:absolute;z-index:2;left:50%;top:-9px;width:54px;height:26px;margin-left:-27px; clip-path:polygon(0 0,100% 0,86% 100%,14% 100%); background:linear-gradient(180deg,#FFFDF8,#DDD2BF); filter:drop-shadow(0 1px 0 rgba(62,74,86,.45)); } .prn-credit-photo{position:absolute;left:calc(var(--cadre) + 10px);bottom:calc(var(--cadre) + 10px);z-index:3;max-width:56%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:rgba(42,50,59,.82);color:var(--pierre-claire);font-size:11px;line-height:1.3;padding:4px 10px;border-radius:999px;} .prn-credit-photo a{color:var(--pierre-claire);text-decoration:underline;} /* La plaque de laiton vissée : carte claire arrondie, double liseré, quatre vis aux coins */ .prn-plaque{ position:relative;z-index:1; border-radius:18px; background-color:var(--pierre-claire); background-repeat:no-repeat; background-size:9px 9px,9px 9px,9px 9px,9px 9px,12px 12px,12px 12px,12px 12px,12px 12px; background-position:left 9px top 9px,right 9px top 9px,left 9px bottom 9px,right 9px bottom 9px,left 7.5px top 7.5px,right 7.5px top 7.5px,left 7.5px bottom 7.5px,right 7.5px bottom 7.5px; background-image: linear-gradient(38deg,transparent 42%,rgba(66,44,10,.9) 42% 58%,transparent 58%), linear-gradient(-52deg,transparent 42%,rgba(66,44,10,.9) 42% 58%,transparent 58%), linear-gradient(70deg,transparent 42%,rgba(66,44,10,.9) 42% 58%,transparent 58%), linear-gradient(-20deg,transparent 42%,rgba(66,44,10,.9) 42% 58%,transparent 58%), radial-gradient(circle,#EFE1B4 0 1.2px,var(--laiton) 2.4px 4.6px,#7C5F22 5px 5.6px,transparent 6px), radial-gradient(circle,#EFE1B4 0 1.2px,var(--laiton) 2.4px 4.6px,#7C5F22 5px 5.6px,transparent 6px), radial-gradient(circle,#EFE1B4 0 1.2px,var(--laiton) 2.4px 4.6px,#7C5F22 5px 5.6px,transparent 6px), radial-gradient(circle,#EFE1B4 0 1.2px,var(--laiton) 2.4px 4.6px,#7C5F22 5px 5.6px,transparent 6px); box-shadow: inset 0 0 0 2px var(--laiton), inset 0 0 0 5px var(--pierre-claire), inset 0 0 0 6px rgba(176,138,62,.6), var(--ombre-plaque); } .prn-plaque .prn-form{background:transparent;border:0;box-shadow:none;border-radius:0;} .prn-pastille-communes{ color:var(--ardoise);display:flex;align-items:center;gap:10px;background:var(--pierre-claire);border-radius:999px; border:1.5px solid var(--laiton);box-shadow:var(--ombre-carte);padding:8px 16px 8px 10px;font-weight:700;font-size:14px;line-height:1.25; } .prn-pastille-communes__icone{width:30px;height:30px;border-radius:50%;background:var(--laiton-pale);color:var(--laiton-fonce);display:flex;align-items:center;justify-content:center;flex:none;} .prn-pastille-communes__icone svg{width:17px;height:17px;} a.prn-pastille-communes:hover{background:var(--laiton-pale);} .prn-pastille-chiffre{display:flex;flex-direction:column;background:var(--pierre-claire);border:1.5px solid var(--laiton);border-radius:var(--r-tuile);padding:10px 18px;min-width:140px;} .prn-pastille-chiffre__valeur{font:700 28px/1 var(--f-corps);font-variant-numeric:tabular-nums;color:var(--ardoise);} .prn-pastille-chiffre__legende{font-size:14px;color:var(--fumee);margin-top:3px;line-height:1.3;} /* ===================== 7. HERO : BAS DE FAÇADE (accueil, commune, qui sommes-nous) ===================== */ /* Un bas de façade : assises de pierre, soubassement plus sombre, trottoir de zinc. Le soupirail s'ouvre à droite. */ .prn-hero{ position:relative;overflow-x:clip; background-color:var(--pierre-claire);background-image:var(--assises);background-size:168px 76px; border-bottom:10px solid var(--zinc); --col-texte:clamp(420px,36%,600px); } .prn-hero::before{ content:"";position:absolute;left:0;right:0;bottom:0;height:clamp(58px,8.5vh,78px); background-color:var(--pierre-sombre);background-image:var(--soubassement);background-size:220px 96px; box-shadow:inset 0 5px 0 #F0E9DC,inset 0 6px 0 rgba(42,50,59,.3); } .prn-hero__conteneur{ position:relative;z-index:1;max-width:1760px;margin-inline:auto;padding:26px var(--marge) 30px; display:grid;grid-template-columns:minmax(0,var(--col-texte)) minmax(0,1fr); column-gap:clamp(56px,5vw,88px);align-items:stretch; } .prn-hero__texte{padding-top:clamp(12px,3vh,36px);padding-bottom:clamp(56px,7.5vh,72px);} .prn-hero__titre{font-size:clamp(40px,4vw,78px);line-height:.98;letter-spacing:-.012em;margin:18px 0 20px;color:var(--zinc);} .prn-hero__titre .prn-ligne{display:block;white-space:nowrap;} .prn-hero__titre--ville{font-size:clamp(36px,3.5vw,64px);} .prn-hero__titre--ville .prn-ligne{white-space:normal;} .prn-hero__chapo{font-size:clamp(17px,1.2vw,20px);color:var(--fumee);max-width:min(25em,100%);margin-bottom:22px;text-wrap:pretty;} .prn-hero__preuves{display:flex;gap:14px;flex-wrap:wrap;margin-top:6px;} .prn-hero__rassure,.prn-final__rassure{display:flex;flex-wrap:wrap;gap:8px 20px;margin:20px 0 0;font-size:15px;font-weight:600;} .prn-hero__rassure span,.prn-final__rassure span{display:inline-flex;align-items:center;gap:8px;} .prn-hero__rassure svg{width:20px;height:20px;color:var(--remis);flex:none;} .prn-hero__zone{position:relative;min-height:clamp(540px,calc(100vh - 200px),600px);} .prn-sou--hero{position:absolute;top:10px;right:0;bottom:48px;left:clamp(130px,19%,200px);--cadre:14px;--pas:26px;} .prn-sou--hero .prn-sou__jour img{object-position:80% 50%;} .prn-sou--ville .prn-sou__jour img{object-position:50% 60%;} .prn-sou--cle::before{display:block;} /* La plaque-formulaire : déborde du soupirail sur sa gauche */ .prn-hero__form-zone{position:absolute;z-index:5;left:calc(-1 * clamp(28px,3vw,52px));top:20px;width:clamp(390px,28vw,432px);max-width:none;padding:18px 22px 20px;} .prn-hero__badge-minute{ display:flex;align-items:center;gap:8px;margin:0 20px 8px; font:700 13.5px/1.2 var(--f-corps);color:var(--laiton-fonce); } .prn-hero__badge-minute::after{content:"";flex:1;height:1px;background:rgba(176,138,62,.55);} .prn-hero__form-zone .prn-form__noms-etapes{display:none;} .prn-hero__form-zone .prn-form{padding:6px 12px 8px;} .prn-hero--qsn .prn-hero__texte{display:flex;flex-direction:column;justify-content:center;padding-top:0;padding-bottom:clamp(56px,7.5vh,72px);} .prn-hero--qsn .prn-hero__titre .prn-ligne{display:block;} .prn-hero--qsn .prn-qsn-photo{min-height:clamp(380px,46vh,470px);} .prn-hero--qsn .prn-sou--hero{left:0;} .prn-hero--qsn .prn-sou--hero .prn-sou__jour img{object-position:50% 12%;} /* Page commune : la commune est située sur la carte */ .prn-ville-situe{display:flex;align-items:center;gap:16px;background:var(--pierre-claire);border:1.5px solid var(--laiton);border-radius:var(--r-tuile);padding:12px 18px 12px 12px;margin-top:20px;max-width:500px;} .prn-ville-situe .prn-mini-carte{width:140px;flex:none;box-shadow:none;padding:6px;background:var(--pierre);border-radius:8px;} .prn-ville-situe__texte{display:flex;flex-direction:column;gap:4px;font-size:15px;color:var(--fumee);line-height:1.4;} .prn-ville-situe__texte strong{font:400 21px var(--f-titre);color:var(--ardoise);} .prn-ville-situe__texte a{color:var(--seine);font-weight:700;text-decoration:underline;text-underline-offset:3px;margin-top:2px;} @media (max-width:1180px){ .prn-hero::before{height:56px;} .prn-hero__texte,.prn-hero--qsn .prn-hero__texte{padding-bottom:0;} .prn-hero__conteneur{grid-template-columns:minmax(0,1fr);padding:22px var(--marge) 36px;} .prn-hero__texte{padding-top:0;} .prn-hero__zone{min-height:0;display:flex;flex-direction:column;} .prn-sou--hero{position:relative;inset:auto;height:clamp(230px,44vw,420px);--pas:22px;margin-bottom:var(--appui);} .prn-hero__form-zone{position:relative;left:auto;top:auto;width:100%;max-width:520px;margin:-64px auto 0;} .prn-hero--qsn .prn-qsn-photo{min-height:0;} .prn-hero--qsn .prn-sou--hero{height:clamp(230px,44vw,380px);} } @media (max-width:760px){ .prn-hero__conteneur{padding-top:14px;padding-bottom:28px;} .prn-hero__titre{font-size:clamp(34px,10vw,44px);margin:12px 0 10px;} .prn-hero__titre .prn-ligne{display:inline;white-space:normal;} .prn-hero--qsn .prn-hero__titre .prn-ligne{display:inline;} .prn-hero__chapo{font-size:16px;margin-bottom:0;} .prn-hero__rassure{display:none;} .prn-hero--ville .prn-hero__preuves{display:none;} .prn-sou--hero{height:200px;--pas:20px;--barre:2.5px;} .prn-hero__form-zone{margin-top:-50px;padding:16px 14px 16px;} .prn-hero__badge-minute{margin-inline:12px;} .prn-ville-situe{display:none;} .prn-credit-photo{font-size:10px;max-width:66%;} .prn-hero--qsn .prn-hero__preuves{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:14px 0 2px;} .prn-hero--qsn .prn-pastille-chiffre{min-width:0;padding:9px 10px;} .prn-hero--qsn .prn-pastille-chiffre__valeur{font-size:22px;} .prn-hero--qsn .prn-pastille-chiffre__legende{font-size:12px;line-height:1.25;} .prn-hero--qsn .prn-sou--hero{height:220px;} } /* Barre basse collante (mobile) */ .prn-barre-collante{position:fixed;left:0;right:0;bottom:0;z-index:70;background:var(--pierre-claire);border-top:2px solid rgba(176,138,62,.7);box-shadow:0 -10px 24px -14px rgba(42,50,59,.4);padding:10px var(--marge);display:none;} .prn-barre-collante .prn-btn{width:100%;} @media (max-width:760px){ .prn-barre-collante{display:flex;} .prn-footer{padding-bottom:72px;} } /* ===================== 8. LE FORMULAIRE-DIAGNOSTIC ===================== */ .prn-form{background:var(--pierre-claire);border-radius:var(--r-carte);padding:22px 24px 24px;position:relative;overflow:hidden;} .prn-form--pleine{padding:34px 36px 36px;} .prn-form--compacte{padding:12px 14px 14px;} .prn-form__entete{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;} .prn-form__compteur{font:600 14px var(--f-corps);color:var(--fumee);} .prn-form__retour{font-size:13px;color:var(--seine);font-weight:700;display:none;} .prn-form:not([data-pas="0"]) .prn-form__retour{display:inline-flex;} .prn-form[data-pas="0"] .prn-form__retour{display:none;} .prn-form__progression{display:flex;gap:5px;margin-bottom:6px;} .prn-form__segment{flex:1;height:6px;border-radius:3px;background:var(--joint);overflow:hidden;} .prn-form__segment i{display:block;height:100%;width:0;background:var(--seine);transition:width .4s ease;} .prn-form__segment.est-fait i,.prn-form__segment.est-actif i{width:100%;} .prn-form__noms-etapes{display:flex;gap:5px;margin-bottom:16px;} .prn-form__nom-etape{flex:1;font-size:12px;color:var(--fumee);text-align:center;} .prn-form__nom-etape.est-actif{color:var(--ardoise);font-weight:700;} .prn-form__etape{display:none;} .prn-form__etape.est-active{display:block;animation:prnEtape .22s cubic-bezier(.2,.7,.2,1);} @keyframes prnEtape{from{opacity:0;transform:translateX(24px);}to{opacity:1;transform:none;}} @media (prefers-reduced-motion:reduce){ .prn-form__etape.est-active{animation:none;} } .prn-form__question{font:400 23px/1.15 var(--f-titre);color:var(--ardoise);margin-bottom:14px;} .prn-form__question--petite{font:700 14px var(--f-corps);margin:18px 0 8px;} .prn-form--compacte .prn-form__question{font-size:20px;margin-bottom:11px;} .prn-form__tuiles{display:grid;gap:9px;margin-bottom:14px;} .prn-form__tuiles--grille2{grid-template-columns:1fr 1fr;} .prn-form__tuiles--colonne{grid-template-columns:1fr;} .prn-form__tuile{ position:relative;display:flex;align-items:center;gap:12px; min-height:88px;padding:11px 13px;border-radius:var(--r-tuile); background:var(--blanc);border:1.5px solid var(--joint);text-align:left; transition:transform .15s ease,border-color .15s ease,background .15s ease,box-shadow .15s ease; } .prn-form__tuiles--grille2 .prn-form__tuile{flex-direction:column;align-items:flex-start;justify-content:center;} .prn-form__tuiles--colonne .prn-form__tuile{min-height:54px;flex-direction:row;} .prn-form--compacte .prn-form__tuile{min-height:54px;} .prn-form--compacte .prn-form__tuiles--grille2 .prn-form__tuile{min-height:80px;} .prn-form__tuile:hover{transform:translateY(-2px);border-color:var(--zinc);box-shadow:0 10px 16px -12px rgba(42,50,59,.5);} .prn-form__tuile.est-choisi{border-color:var(--seine);box-shadow:inset 0 0 0 1.5px var(--seine);background:var(--eau-pale);} .prn-form__tuile__icone{width:42px;height:42px;border-radius:50%;background:var(--laiton-pale);color:var(--laiton-fonce);display:flex;align-items:center;justify-content:center;flex:none;} .prn-form__tuile__icone svg{width:23px;height:23px;} .prn-form__tuile.est-choisi .prn-form__tuile__icone{background:var(--blanc);color:var(--seine);} .prn-form__tuile__texte{font-weight:700;font-size:15.5px;line-height:1.25;} .prn-form__tuile__sous{display:block;font-size:13px;color:var(--alarme);font-weight:700;} .prn-form__tuile__coche{position:absolute;top:8px;right:8px;width:22px;height:22px;border-radius:50%;background:var(--seine);color:#fff;display:flex;align-items:center;justify-content:center;transform:scale(0);transition:transform .15s cubic-bezier(.34,1.56,.64,1);} .prn-form__tuile.est-choisi .prn-form__tuile__coche{transform:scale(1);} .prn-form__tuile__coche svg{width:12px;height:12px;} .prn-form__segmente{display:flex;gap:6px;margin:6px 0 14px;flex-wrap:wrap;} .prn-form__segmente button{flex:1;min-width:96px;height:44px;border-radius:999px;border:1.5px solid var(--joint);background:var(--blanc);font-weight:700;font-size:14px;transition:background .15s,border-color .15s,color .15s;} .prn-form__segmente button:hover{border-color:var(--zinc);} .prn-form__segmente button.est-choisi{background:var(--seine);border-color:var(--seine);color:#fff;} .prn-form__alerte{display:none;background:var(--alarme-fond);color:var(--alarme);border-left:4px solid var(--alarme);border-radius:8px;padding:10px 14px;font-size:14px;font-weight:600;margin-bottom:12px;} .prn-form__alerte.est-visible{display:block;} .prn-form__champ{margin-bottom:12px;} .prn-form__champ label{display:block;font-size:13px;font-weight:700;margin-bottom:5px;color:var(--ardoise);} .prn-form__champ input,.prn-form__champ select,.prn-form__champ textarea{ width:100%;height:50px;border-radius:var(--r-champ);border:1.5px solid #AEA595; padding:0 14px;font:16px var(--f-corps);background:var(--blanc);color:var(--ardoise); } .prn-form__champ textarea{height:auto;padding:12px 14px;} .prn-form__champ input:focus,.prn-form__champ select:focus,.prn-form__champ textarea:focus{outline:none;border-color:var(--seine);box-shadow:0 0 0 4px rgba(31,95,139,.18);} .prn-form__champ.est-en-erreur input{border-color:var(--alarme);} .prn-form__erreur{display:block;color:var(--alarme);font-size:13px;margin:-4px 0 8px;} .prn-form__indication{display:block;color:var(--fumee);font-size:13px;margin-top:6px;} .prn-form__pilules-rapides{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 14px;} .prn-form__pilule{height:38px;padding:0 14px;border-radius:999px;background:var(--laiton-pale);color:var(--laiton-fonce);font-size:13.5px;font-weight:700;border:1.5px solid transparent;} .prn-form__pilule:hover{border-color:var(--laiton);} .prn-form__pilule.est-choisi{background:var(--seine);color:#fff;} .prn-form__creneaux{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px;} .prn-form__detail-bascule{font-size:13px;color:var(--seine);font-weight:700;margin-bottom:10px;text-decoration:underline;text-underline-offset:3px;} .prn-form__pro,.prn-form__consentement{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--fumee);margin-bottom:12px;} .prn-form__pro{color:var(--ardoise);font-weight:600;align-items:center;} .prn-form__pro input,.prn-form__consentement input{margin-top:2px;accent-color:var(--seine);width:18px;height:18px;flex:none;} .prn-form__rangee{display:grid;grid-template-columns:1fr 1fr;gap:10px;} .prn-form__nav{display:flex;gap:10px;align-items:center;} .prn-form__bouton{flex:1;} .prn-form__piege{position:absolute;left:-9999px;} /* Étape « coordonnées » compacte : ne déborde jamais du hero */ .prn-form [data-etape="coordonnees"] .prn-form__champ{margin-bottom:8px;} .prn-form [data-etape="coordonnees"] .prn-form__champ label{font-size:12.5px;margin-bottom:3px;} .prn-form [data-etape="coordonnees"] .prn-form__champ input{height:42px;font-size:15px;} .prn-form [data-etape="coordonnees"] .prn-form__question{margin-bottom:9px;} .prn-form [data-etape="coordonnees"] .prn-form__question--petite{margin:2px 0 6px;font-size:13px;} .prn-form [data-etape="coordonnees"] .prn-form__creneaux{flex-wrap:nowrap;gap:6px;margin-bottom:8px;} .prn-form [data-etape="coordonnees"] .prn-form__pilule{height:34px;padding:0 10px;font-size:13px;white-space:nowrap;flex:1;} .prn-form [data-etape="coordonnees"] .prn-form__detail-bascule{margin-bottom:6px;} .prn-form [data-etape="coordonnees"] .prn-form__pro{font-size:12.5px;margin-bottom:6px;} .prn-form [data-etape="coordonnees"] .prn-form__consentement{font-size:11.5px;line-height:1.35;margin-bottom:8px;} .prn-form [data-etape="coordonnees"] .prn-btn{height:46px;} .prn-form--pleine [data-etape="coordonnees"] .prn-form__champ input{height:48px;} .prn-form--pleine .prn-form__tuiles--grille2 .prn-form__tuile{min-height:128px;font-size:17px;} .prn-form--pleine .prn-form__tuiles--grille2{gap:12px;} .prn-form--pleine .prn-form__tuile__texte{font-size:17px;} .prn-form--pleine .prn-form__question{font-size:27px;margin-bottom:18px;} .prn-form--pleine [data-etape="coordonnees"] .prn-form__consentement{font-size:13px;} @media (max-width:420px){ .prn-form__rangee{gap:8px;} .prn-form [data-etape="coordonnees"] .prn-form__creneaux{flex-wrap:wrap;} .prn-form{padding:16px 14px 18px;} .prn-form--pleine{padding:22px 16px;} } .prn-form__confirmation{display:none;text-align:left;padding:14px 0;} .prn-form__confirmation.est-visible{display:block;} .prn-form__confirmation-cercle{width:56px;height:56px;border-radius:50%;background:var(--remis-fond);color:var(--remis);display:flex;align-items:center;justify-content:center;margin:0 0 14px;} .prn-form__confirmation-cercle svg{width:28px;height:28px;} .prn-form__confirmation h3{font:400 26px var(--f-titre);} .prn-form__recap{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0;} .prn-form__recap span{background:var(--laiton-pale);color:var(--laiton-fonce);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:700;} .prn-form__suite{max-width:380px;margin:16px 0 0;display:flex;flex-direction:column;gap:10px;} .prn-form__suite li{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--fumee);} .prn-form__suite svg{width:20px;height:20px;color:var(--remis);flex:none;} /* ===================== 9. CARTES ===================== */ .prn-carte{display:flex;flex-direction:column;background:var(--pierre-claire);border:1px solid var(--joint);border-radius:var(--r-carte);overflow:hidden;box-shadow:var(--ombre-carte);transition:transform .2s ease,box-shadow .2s ease;} .prn-carte:hover{transform:translateY(-3px);box-shadow:0 2px 3px rgba(42,50,59,.1),0 22px 34px -16px rgba(42,50,59,.4);} .prn-carte__photo{ position:relative;flex:1 1 auto;min-height:0;aspect-ratio:4/3;max-height:calc(100vh - 260px);overflow:hidden; border-bottom:3px solid var(--laiton); background-color:var(--pierre-sombre);background-image:var(--soubassement);background-size:150px 66px; } .prn-carte__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;} .prn-carte__pastille{position:absolute;left:10px;bottom:10px;display:inline-flex;align-items:center;gap:7px;background:var(--pierre-claire);color:var(--ardoise);font-size:12.5px;font-weight:700;padding:5px 12px 5px 9px;border-radius:999px;box-shadow:0 2px 6px rgba(42,50,59,.3);} .prn-carte__pastille::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--laiton);flex:none;} .prn-carte__corps{padding:16px 18px 18px;display:flex;flex-direction:column;gap:6px;flex:0 0 auto;} .prn-carte__titre{font:400 21px/1.2 var(--f-titre);} .prn-carte:hover .prn-carte__titre{color:var(--seine);} .prn-carte__extrait{color:var(--fumee);font-size:15px;margin:0;} .prn-carte__meta{color:var(--fumee);font-size:13px;margin-top:6px;} .prn-grille-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;} .prn-grille-2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;} .prn-grille-3 .prn-carte__photo{aspect-ratio:4/3;flex:none;} @media (max-width:980px){ .prn-grille-3{grid-template-columns:repeat(2,1fr);} } @media (max-width:620px){ .prn-grille-3,.prn-grille-2{grid-template-columns:1fr;} } /* Guides de l'accueil : 1 grande carte + 3 cartes horizontales */ .prn-guides{display:grid;grid-template-columns:1.2fr 1fr;grid-template-rows:minmax(0,1fr);gap:22px;margin-top:24px;height:clamp(340px,42vh,390px);} .prn-guides__une{min-height:0;} .prn-guides__une .prn-carte{height:100%;} .prn-guides__une .prn-carte__titre{font-size:24px;} .prn-guides__liste{display:flex;flex-direction:column;gap:14px;} .prn-guides__liste .prn-carte{flex-direction:row;flex:1;min-height:0;} .prn-guides__liste .prn-carte__photo{aspect-ratio:auto;flex:0 0 38%;min-height:0;border-bottom:0;border-right:3px solid var(--laiton);} .prn-guides__liste .prn-carte__corps{flex:1 1 auto;min-width:0;padding:10px 16px;gap:4px;justify-content:center;} .prn-guides__liste .prn-carte__titre{font-size:17px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;} .prn-guides__liste .prn-carte__extrait{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;font-size:14px;} .prn-guides__liste .prn-carte__meta{display:none;} .prn-guides__liste .prn-carte__pastille{display:none;} .prn-guides__rubriques{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 0;position:relative;z-index:1;} .prn-pilule-lien{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 8px 0 18px;border-radius:999px;background:var(--blanc);border:1.5px solid var(--joint);color:var(--ardoise);font-weight:700;font-size:15px;transition:background .2s ease,color .2s ease,border-color .2s ease;} .prn-pilule-lien span{background:var(--laiton-pale);border-radius:999px;min-width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;color:var(--laiton-fonce);} .prn-pilule-lien:hover{background:var(--zinc);border-color:var(--zinc);color:#fff;} @media (max-width:980px){ .prn-guides{grid-template-columns:1fr;height:auto;} .prn-guides__une .prn-carte__photo{min-height:240px;} .prn-guides__liste .prn-carte{min-height:120px;} } @media (max-width:560px){ .prn-guides__liste .prn-carte{flex-direction:column;} .prn-guides__liste .prn-carte__photo{flex-basis:auto;aspect-ratio:16/9;border-right:0;border-bottom:3px solid var(--laiton);} } /* ===================== 10. « RECONNAISSEZ VOTRE SITUATION » : 5 CARTES EN ARCHE ===================== */ .prn-situations{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:8px;} .prn-situation{ position:relative;display:block;overflow:hidden;aspect-ratio:4/5;max-height:340px;width:100%; border-radius:50% 50% 14px 14px / 11% 11% 14px 14px; background-color:var(--zinc);box-shadow:0 0 0 1px rgba(62,74,86,.3),var(--ombre-carte); transition:transform .2s ease,box-shadow .2s ease; } .prn-situation img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;} .prn-situation__voile{position:absolute;inset:0;background:linear-gradient(180deg,rgba(42,50,59,.18) 0,rgba(42,50,59,0) 22%,rgba(42,50,59,.9) 100%);} .prn-situation__titre{position:absolute;left:16px;right:16px;bottom:46px;color:#fff;font:400 19px/1.2 var(--f-titre);} .prn-situation__action{position:absolute;left:16px;bottom:16px;display:inline-flex;align-items:center;gap:6px;color:#fff;font-size:13px;font-weight:700;} .prn-situation__action svg{width:14px;height:14px;transition:transform .2s ease;} .prn-situation:hover{transform:translateY(-4px);box-shadow:0 0 0 1px rgba(62,74,86,.3),0 22px 34px -16px rgba(42,50,59,.5);} .prn-situation:hover .prn-situation__action svg{transform:translateX(3px);} @media (max-width:980px){ .prn-situations{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;} .prn-situation{flex:0 0 58%;scroll-snap-align:start;max-height:none;} } @media (max-width:560px){ .prn-situation{flex-basis:72%;} } /* ===================== 11. INTERVENTION ET ÉTAPES À CHEVAL ===================== */ .prn-intervention{position:relative;margin-bottom:48px;} .prn-intervention__photo{aspect-ratio:1400/440;--pas:30px;--appui:12px;} .prn-intervention__photo .prn-sou__jour img{object-position:50% 62%;} .prn-etapes-cheval{position:absolute;left:0;right:0;bottom:-48px;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding-inline:4%;} .prn-etape-carte{position:relative;background:var(--pierre-claire);border-radius:var(--r-carte);border:1.5px solid var(--laiton);box-shadow:var(--ombre-plaque);padding:18px 18px 20px;} .prn-etape-carte__num{position:absolute;top:14px;right:16px;font:700 32px/1 var(--f-corps);color:rgba(176,138,62,.55);font-variant-numeric:tabular-nums;} .prn-etape-carte__icone{display:flex;width:42px;height:42px;border-radius:50%;background:var(--laiton-pale);color:var(--laiton-fonce);align-items:center;justify-content:center;margin-bottom:10px;} .prn-etape-carte__icone svg{width:23px;height:23px;} .prn-etape-carte strong{display:block;color:var(--ardoise);margin-bottom:4px;font:400 19px/1.2 var(--f-titre);} .prn-etape-carte p{margin:0;font-size:14px;color:var(--fumee);} @media (max-width:980px){ .prn-etapes-cheval{position:static;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px;padding-inline:0;} .prn-intervention{margin-bottom:0;} .prn-intervention__photo{aspect-ratio:16/9;} } @media (max-width:560px){ .prn-etapes-cheval{grid-template-columns:1fr;} .prn-etape-carte{padding:14px 16px;} } /* ===================== 12. CARTE DE PARIS ET DES HAUTS-DE-SEINE ===================== */ .prn-zone__grille{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px;align-items:center;} .prn-zone__carte-wrap{position:relative;background:var(--pierre-claire);border-radius:var(--r-carte);border:1.5px solid var(--laiton);box-shadow:var(--ombre-carte);padding:18px 18px 12px;} .prn-zone__carte-wrap svg{width:100%;height:auto;max-height:400px;display:block;margin:0 auto;} .prn-zone__carte-wrap svg path{fill:#EAE3D5;stroke:#fff;stroke-width:2;transition:fill .25s ease;cursor:default;} .prn-zone__carte-wrap svg path[id^="c-"]{fill:#BFD3E0;cursor:pointer;} .prn-zone__carte-wrap svg path[id^="c-"]:nth-of-type(3n){fill:#A8C3D4;} .prn-zone__carte-wrap svg path[id^="c-"]:nth-of-type(3n+1){fill:#CFDFEA;} .prn-zone__carte-wrap svg path[id^="c-"]:hover,.prn-zone__carte-wrap svg path[id^="c-"].est-survolee{fill:var(--seine);} .prn-carte-point{fill:#fff;stroke:var(--seine);stroke-width:2.5;pointer-events:none;} .prn-carte-nom{font:700 15px var(--f-corps);fill:var(--ardoise);pointer-events:none;paint-order:stroke;stroke:#fff;stroke-width:4px;} .prn-zone__etiquette{position:absolute;display:none;background:var(--ardoise);color:var(--pierre-claire);border-radius:999px;padding:7px 14px;font-size:13px;font-weight:700;pointer-events:none;z-index:3;white-space:nowrap;} .prn-zone__etiquette.est-visible{display:block;} .prn-zone__legende{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--fumee);margin:8px 0 0;justify-content:center;} .prn-zone__puce{width:14px;height:14px;border-radius:3px;background:#BFD3E0;box-shadow:inset 0 0 0 2px #fff,0 0 0 1px #8FB0C6;flex:none;} .prn-zone__liste{display:grid;grid-template-columns:repeat(3,1fr);gap:6px 10px;margin-top:16px;} .prn-zone__liste a{display:inline-flex;min-height:36px;align-items:center;padding:0 14px;background:var(--pierre-claire);border:1px solid var(--joint);border-radius:999px;font-weight:700;font-size:13.5px;line-height:1.2;transition:background .15s,color .15s,border-color .15s;} .prn-zone__liste a:hover{background:var(--seine);border-color:var(--seine);color:#fff;} .prn-zone__liste span{display:inline-flex;min-height:36px;align-items:center;padding:0 12px;color:var(--fumee);font-size:13.5px;} @media (max-width:1199px){ .prn-zone__liste{grid-template-columns:repeat(2,1fr);} } @media (max-width:980px){ .prn-zone__grille{grid-template-columns:1fr;gap:24px;} } @media (max-width:560px){ .prn-zone__liste a{padding:0 10px;font-size:13px;} } /* Mini-carte (pages ville, qui sommes-nous, contact) */ .prn-mini-carte{background:var(--pierre-claire);border-radius:var(--r-carte);box-shadow:var(--ombre-carte);padding:12px;width:220px;} .prn-mini-carte svg{width:100%;height:auto;} .prn-mini-carte svg path{fill:#EFE9DC;stroke:#C9BFAE;stroke-width:1;} .prn-mini-carte svg path[id^="c-"]{fill:#BFD3E0;stroke:#fff;} .prn-mini-carte[data-commune-active] svg path.est-active,.prn-mini-carte svg path[id^="c-"].est-active{fill:var(--seine);} .prn-mini-carte--grande{width:100%;padding:24px;} @media (max-width:760px){ .prn-mini-carte--grande{padding:12px;} } /* ===================== 13. LE CONTRÔLE ANNUEL (bande Zinc) ===================== */ .prn-section--ardoise .prn-section__panneau{text-align:left;padding-top:0;padding-bottom:clamp(44px,6vh,64px);} .prn-section--ardoise{padding-top:clamp(44px,6vh,64px);} .prn-section--ardoise h2{max-width:20ch;margin-top:16px;} .prn-entretien{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(40px,6vw,96px);align-items:center;} .prn-entretien__texte{display:flex;flex-direction:column;align-items:flex-start;text-align:left;} .prn-entretien__texte h2{font-size:clamp(30px,3vw,44px);line-height:1.08;margin-top:16px;max-width:17ch;} .prn-entretien__droite{display:flex;flex-direction:column;gap:22px;} .prn-chiffres-grille{display:grid;grid-template-columns:1fr 1fr;gap:20px;width:100%;} .prn-chiffre-geant{display:flex;flex-direction:column;gap:6px;border-top:2px solid var(--laiton);padding-top:12px;} .prn-chiffre-geant data{display:block;font:700 clamp(60px,6vw,92px)/1 var(--f-corps);font-variant-numeric:tabular-nums;color:var(--pierre-claire);letter-spacing:-.02em;} .prn-chiffre-geant span{display:block;max-width:24ch;color:rgba(247,243,236,.8);font-weight:600;font-size:16px;line-height:1.35;} .prn-points{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;} .prn-points li{display:flex;flex-direction:column;gap:2px;background:rgba(247,243,236,.07);border:1px solid rgba(247,243,236,.18);border-radius:var(--r-tuile);padding:11px 16px 12px;} .prn-points strong{color:var(--pierre-claire);font:400 18px/1.2 var(--f-titre);} .prn-points span{font-size:14px;color:rgba(247,243,236,.78);line-height:1.4;} .prn-chiffres-source{margin:20px 0 26px;font-size:14px;color:rgba(247,243,236,.8);max-width:46ch;} .prn-chiffres-source a{color:var(--pierre-claire);text-decoration:underline;text-underline-offset:3px;} @media (max-width:900px){ .prn-entretien{grid-template-columns:1fr;gap:28px;} } @media (max-width:560px){ .prn-chiffre-geant data{font-size:54px;} .prn-points{grid-template-columns:1fr;} } /* ===================== 14. FAQ ===================== */ .prn-faq{columns:2;column-gap:28px;} .prn-faq--une-colonne{columns:1;margin-top:24px;} .prn-faq-item{break-inside:avoid;margin-bottom:12px;border:1px solid var(--joint);border-radius:var(--r-tuile);padding:15px 18px;background:var(--blanc);} .prn-faq-item[open]{border-color:var(--laiton);box-shadow:inset 3px 0 0 var(--laiton);} .prn-faq-item summary{cursor:pointer;font-weight:700;font-size:16px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;} .prn-faq-item summary::-webkit-details-marker{display:none;} .prn-faq-item summary::after{content:"+";font:700 22px/1 var(--f-corps);color:var(--laiton-fonce);flex:none;} .prn-faq-item[open] summary::after{content:"–";} .prn-faq-item p{margin:12px 0 0;color:var(--fumee);} @media (max-width:760px){ .prn-faq{columns:1;} } /* ===================== 15. APPEL FINAL ===================== */ .prn-final{position:relative;color:rgba(247,243,236,.86);} .prn-final--v2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:64px;align-items:center;max-width:calc(var(--conteneur) + 2*var(--marge));margin-inline:auto;padding:clamp(36px,6vh,56px) var(--marge) calc(clamp(36px,6vh,56px) + 10px);background:transparent;} .prn-appel-final{background-color:var(--ardoise);background-image:var(--joints-zinc);border-top:6px solid var(--laiton);} .prn-final__contenu h2{color:var(--pierre-claire);font-size:clamp(32px,3.2vw,48px);line-height:1.08;text-wrap:balance;margin:14px 0 14px;} .prn-final__contenu p{font-size:18px;max-width:34em;margin:0 0 24px;} .prn-final__boutons{display:flex;gap:12px;flex-wrap:wrap;} .prn-final__rassure{color:rgba(247,243,236,.9);margin-top:22px!important;font-size:14px!important;} .prn-final__rassure svg{width:18px;height:18px;color:#8FD1AA;flex:none;} .prn-final__photo{width:100%;aspect-ratio:1000/720;max-height:380px;--cadre:12px;--pas:24px;--appui:12px;} .prn-final__photo .prn-sou__jour img{object-position:50% 45%;} @media (max-width:980px){ .prn-final--v2{grid-template-columns:1fr;padding-block:36px 46px;gap:34px;} .prn-final__photo{max-height:300px;} } /* ===================== 16. PIED DE PAGE ===================== */ .prn-footer{position:relative;background-color:var(--ardoise);background-image:var(--joints-zinc);color:rgba(247,243,236,.78);padding-top:0;} /* liseré de laiton + cordon : le pied se pose comme le soubassement de la façade */ .prn-footer::before{content:"";display:block;height:14px;background:linear-gradient(180deg,var(--laiton) 0 4px,#8F6F2D 4px 6px,var(--zinc) 6px 100%);} .prn-footer__corps,.prn-footer__base{max-width:calc(var(--conteneur) + 2*var(--marge));margin-inline:auto;} .prn-footer__corps{padding:44px var(--marge) 24px;display:grid;grid-template-columns:1.1fr 2.2fr 1fr;gap:48px;} .prn-footer__marque p{color:rgba(247,243,236,.78);max-width:280px;} .prn-footer__devise{margin:14px 0 18px;font-size:15.5px;line-height:1.6;} .prn-footer__colonne h3{color:var(--pierre-claire);font-size:18px;margin-bottom:14px;} .prn-footer__colonne ul{display:flex;flex-direction:column;gap:9px;} .prn-footer__colonne ul.prn-footer__communes{display:block;columns:2;column-gap:28px;} .prn-footer__communes li{break-inside:avoid;margin:0 0 9px;} .prn-footer__communes li > span{font-size:15px;color:rgba(247,243,236,.7);} .prn-footer a{font-size:15px;} .prn-footer__colonne a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px;} .prn-footer__communes li,.prn-footer__communes a{white-space:normal;} .prn-footer__carte{display:inline-flex;margin-top:6px;font-weight:700;color:var(--pierre-claire);text-decoration:underline;text-underline-offset:3px;} .prn-footer__h3-suite{margin-top:26px;} .prn-footer__recherche{display:flex;align-items:center;background:rgba(247,243,236,.08);border:1px solid rgba(247,243,236,.24);border-radius:999px;padding:4px 4px 4px 16px;gap:8px;max-width:280px;} .prn-footer__recherche input{background:none;border:none;color:#fff;font:15px var(--f-corps);width:100%;min-width:0;} .prn-footer__recherche input:focus{outline:none;} .prn-footer__recherche input::placeholder{color:rgba(247,243,236,.66);} .prn-footer__recherche:focus-within{border-color:var(--pierre-claire);} .prn-footer__recherche button{width:38px;height:38px;border-radius:50%;background:var(--seine);display:flex;align-items:center;justify-content:center;color:#fff;flex:none;} .prn-footer__recherche button svg{width:18px;height:18px;} .prn-footer__base{border-top:1px solid rgba(247,243,236,.18);padding:20px var(--marge);display:flex;justify-content:space-between;font-size:14px;flex-wrap:wrap;gap:10px;} .prn-footer__base p{margin:0;} @media (max-width:980px){ .prn-footer__corps{grid-template-columns:1fr 1fr;gap:36px;} .prn-footer__marque{grid-column:1/-1;} } @media (max-width:620px){ .prn-footer__corps{grid-template-columns:1fr;} } .prn-footer__corps > .prn-footer__colonne:nth-child(2){min-width:0;} /* ===================== 17. ARTICLE ===================== */ .prn-fil-ariane{font-size:14px;color:var(--fumee);padding:18px var(--marge) 0;max-width:calc(var(--conteneur) + 2*var(--marge));margin-inline:auto;} .prn-fil-ariane a:hover{color:var(--seine);text-decoration:underline;} /* Bandeau d'en-tête d'article : assises de pierre, photo à la une dans un soupirail, fiche « En bref » en cartouche de laiton */ .prn-article-hero{--fumee:#4C5965;background-color:var(--pierre);background-image:var(--assises);background-size:168px 76px;border-bottom:1px solid var(--joint);margin:20px 0 0;border-top:1px solid var(--joint);} .prn-article-hero .prn-fil-ariane{padding-top:18px;} .prn-article-tete{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:72px;align-items:center;max-width:calc(var(--conteneur) + 2*var(--marge));margin-inline:auto;padding:22px var(--marge) 70px;} .prn-article-tete__titre{font-size:clamp(34px,3.6vw,54px);line-height:1.04;margin:16px 0;color:var(--zinc);} .prn-article-tete__chapo{font-size:20px;color:var(--fumee);max-width:34em;} .prn-article-tete__meta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:20px;font-size:14px;color:var(--fumee);} .prn-article-tete__meta a{font-weight:700;color:var(--ardoise);text-decoration:underline;text-underline-offset:3px;} .prn-article-tete__photo{aspect-ratio:5/4;--cadre:11px;--pas:24px;--barre:2.5px;--appui:12px;} .prn-fiche-enbref{ position:absolute;z-index:4;left:-44px;bottom:-34px;width:232px; background:var(--pierre-claire);border-radius:14px;padding:14px 18px 6px; box-shadow:inset 0 0 0 2px var(--laiton),inset 0 0 0 5px var(--pierre-claire),inset 0 0 0 6px rgba(176,138,62,.6),var(--ombre-plaque); } .prn-fiche-enbref dl{margin:0;padding:3px 3px 0;} .prn-fiche-enbref dl > div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:7px 0;border-bottom:1px solid var(--joint);} .prn-fiche-enbref dl > div:last-child{border-bottom:0;} .prn-fiche-enbref dt{font-size:13px;color:var(--fumee);} .prn-fiche-enbref dd{margin:0;font-weight:700;font-size:14px;color:var(--ardoise);white-space:nowrap;} @media (max-width:980px){ .prn-article-tete{grid-template-columns:1fr;gap:36px;padding-bottom:56px;} .prn-fiche-enbref{left:14px;} } @media (max-width:620px){ .prn-article-tete{padding-top:20px;} .prn-fiche-enbref{width:calc(100% - 40px);left:20px;bottom:-28px;} .prn-fiche-enbref dl{display:flex;gap:14px;flex-wrap:wrap;} .prn-fiche-enbref dl > div{flex-direction:column;border:0;padding:2px 0;gap:0;} } .prn-article-grille{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:40px;align-items:start;max-width:calc(var(--conteneur) + 2*var(--marge));margin-inline:auto;padding:32px var(--marge) 24px;} .prn-article-colonne{display:flex;flex-direction:column;gap:24px;min-width:0;} @media (max-width:1180px){ .prn-article-grille{grid-template-columns:1fr;} .prn-aside-form{position:static;} } .prn-sommaire-carte{background:var(--pierre-claire);border-radius:var(--r-carte);border:1px solid var(--joint);box-shadow:inset 4px 0 0 var(--laiton),var(--ombre-carte);padding:22px 26px 22px 30px;} .prn-sommaire-carte__titre{display:flex;align-items:center;gap:10px;font:400 19px var(--f-titre);color:var(--ardoise);margin:0 0 14px;} .prn-sommaire-carte__titre svg{width:22px;height:22px;color:var(--laiton-fonce);background:var(--laiton-pale);border-radius:50%;padding:5px;box-sizing:content-box;} .prn-sommaire-carte ol{list-style:none;margin:0;padding:0;counter-reset:som;display:grid;grid-template-columns:1fr 1fr;gap:6px 20px;} .prn-sommaire-carte li{counter-increment:som;} .prn-sommaire-carte li a{display:flex;align-items:flex-start;gap:12px;padding:9px 10px;border-radius:10px;font-size:15px;font-weight:600;color:var(--ardoise);line-height:1.35;transition:background .2s ease,color .2s ease;} .prn-sommaire-carte li a::before{content:counter(som);flex:none;width:26px;height:26px;border-radius:50%;background:var(--laiton-pale);color:var(--laiton-fonce);font:700 13px/26px var(--f-corps);text-align:center;} .prn-sommaire-carte li a:hover,.prn-sommaire-carte li.est-actif a{background:var(--eau-pale);color:var(--seine-fonce);} .prn-sommaire-carte li.est-actif a::before{background:var(--seine);color:#fff;} @media (max-width:760px){ .prn-sommaire-carte ol{grid-template-columns:1fr;} .prn-sommaire-carte{padding:18px 18px 18px 22px;} } /* Corps de l'article : panneau clair, rythme vertical constant */ .prn-corps h2{font-size:30px;margin:40px 0 16px;} .prn-corps h3{font-size:23px;margin:28px 0 12px;} .prn-corps p{max-width:68ch;} .prn-corps strong{color:var(--ardoise);} .prn-corps a:not(.prn-btn){color:var(--seine);text-decoration:underline;text-decoration-color:rgba(31,95,139,.45);text-underline-offset:3px;} .prn-corps img{border-radius:10px;margin:20px 0;} .prn-corps table{width:100%;border-collapse:collapse;display:block;overflow-x:auto;} .prn-corps table th,.prn-corps table td{border:1px solid var(--joint);padding:10px 14px;text-align:left;} .prn-corps table th{background:var(--pierre);} .prn-corps--article{background:var(--pierre-claire);border:1px solid var(--joint);border-radius:var(--r-carte);box-shadow:var(--ombre-carte);padding:clamp(24px,4vw,52px);} .prn-corps--article > *{margin-top:0;margin-bottom:20px;} .prn-corps--article > *:last-child{margin-bottom:0;} .prn-corps--article > h2{font-size:clamp(25px,2.1vw,31px);line-height:1.2;margin:44px 0 16px;scroll-margin-top:110px;} .prn-corps--article > h2:first-child{margin-top:0;} .prn-corps--article > h3{font-size:21px;margin:28px 0 10px;} .prn-corps--article > p{font-size:17.5px;line-height:1.7;max-width:none;} .prn-corps--article > .prn-trajet,.prn-corps--article > .prn-etapes,.prn-corps--article > .prn-comparatif,.prn-corps--article > .prn-reperes,.prn-corps--article > aside,.prn-corps--article > section,.prn-corps--article > figure{margin:28px 0;} .prn-corps--article section.faq h2,.prn-corps--article .sources h2{scroll-margin-top:110px;} .prn-corps p.chapo{font-size:19px;color:var(--fumee);} /* Listes : une vis de laiton en guise de puce */ .prn-corps ul:not([class]){list-style:none;padding:0;margin:20px 0;display:flex;flex-direction:column;gap:10px;} .prn-corps ul:not([class]) > li{position:relative;padding:2px 0 2px 32px;} .prn-corps ul:not([class]) > li::before{ content:"";position:absolute;left:4px;top:.52em;width:14px;height:14px;border-radius:50%; background: linear-gradient(38deg,transparent 43%,rgba(66,44,10,.85) 43% 57%,transparent 57%), radial-gradient(circle at 35% 30%,#EBDCAE 0 1.5px,var(--laiton) 3px 100%); box-shadow:inset 0 0 0 1px rgba(124,95,34,.8); } .prn-corps ol:not([class]){padding-left:24px;} .prn-corps ol:not([class]) > li::marker{color:var(--laiton-fonce);font-weight:700;} .prn-corps figure{margin:28px 0;} .prn-corps figure img{border-radius:12px;box-shadow:var(--ombre-carte);margin:0;width:100%;height:auto;} .prn-corps figcaption{font-size:14px;color:var(--fumee);margin-top:8px;} .prn-corps .sources-titre{margin:0 0 8px;font-family:var(--f-titre);color:var(--ardoise);} .prn-corps aside.sources,.prn-corps .sources{background:var(--pierre);border-radius:var(--r-tuile);padding:20px 24px;margin:32px 0;font-size:14px;color:var(--fumee);} .prn-corps .sources h2,.prn-corps .sources h3{font-size:18px;margin:0 0 10px;} .prn-corps .sources ul:not([class]) > li{padding:3px 0 3px 26px;} .prn-corps .sources ul:not([class]) > li::before{top:.5em;left:2px;width:11px;height:11px;} .prn-corps section.faq{background:var(--pierre);border-radius:var(--r-carte);padding:24px;margin:36px 0;} .prn-corps section.faq > h2{margin-top:0;font-size:27px;} .prn-corps div.chiffres-commune{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:24px 0;} .prn-corps aside.bon-a-savoir,.prn-corps figure.info{background:var(--laiton-pale);border-left:4px solid var(--laiton);border-radius:var(--r-tuile);padding:18px 22px;margin:24px 0;} .prn-encadre{border-radius:var(--r-tuile);padding:24px 26px;margin:28px 0;} .prn-encadre strong{display:block;margin-bottom:8px;font-family:var(--f-titre);font-weight:400;} .prn-corps .prn-encadre--retenir{display:flex;flex-direction:column;gap:6px;background:var(--eau-pale);border-left:4px solid var(--seine);border-radius:var(--r-tuile);padding:18px 22px;} .prn-corps .prn-encadre--retenir strong{color:var(--seine-fonce);font-size:19px;margin:0;} .prn-corps .prn-encadre--alerte{display:flex;flex-direction:column;gap:6px;background:var(--alarme-fond);border-left:4px solid var(--alarme);border-radius:var(--r-tuile);padding:18px 22px;margin:24px 0;} .prn-corps .prn-encadre--alerte strong{color:var(--alarme);font-size:19px;} .prn-corps .prn-encadre--alerte span{color:var(--ardoise);} /* Repliables écrits dans le contenu : jamais un triangle brut */ .prn-corps details,.entry-content details{background:var(--blanc);border:1px solid var(--joint);border-radius:var(--r-tuile);margin:10px 0;overflow:hidden;} .prn-corps details[open],.entry-content details[open]{border-color:var(--laiton);box-shadow:inset 3px 0 0 var(--laiton);} .prn-corps summary,.entry-content summary{list-style:none;cursor:pointer;padding:15px 56px 15px 20px;font-weight:700;color:var(--ardoise);position:relative;} .prn-corps summary::-webkit-details-marker,.entry-content summary::-webkit-details-marker{display:none;} .prn-corps summary::after,.entry-content summary::after{content:"+";position:absolute;right:16px;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;background:var(--laiton-pale);color:var(--laiton-fonce);font:700 20px/28px var(--f-corps);text-align:center;} .prn-corps details[open] summary::after,.entry-content details[open] summary::after{content:"–";} .prn-corps details > :not(summary),.entry-content details > :not(summary){padding:0 20px 16px;margin:0;color:var(--fumee);} /* Trajet de l'eau en étapes */ .prn-trajet{list-style:none;counter-reset:trajet;padding:0;margin:28px 0;display:grid;grid-template-columns:repeat(5,1fr);gap:12px;} .prn-trajet li{counter-increment:trajet;background:var(--blanc);border:1px solid var(--joint);border-top:3px solid var(--laiton);border-radius:var(--r-tuile);padding:16px 14px;display:flex;flex-direction:column;gap:6px;position:relative;} .prn-trajet li::before{content:counter(trajet);font:700 28px/1 var(--f-corps);color:var(--laiton);} .prn-trajet strong{font-family:var(--f-titre);font-weight:400;font-size:17px;line-height:1.25;} .prn-trajet span{font-size:14px;color:var(--fumee);line-height:1.45;} @media (max-width:1180px){ .prn-trajet{grid-template-columns:repeat(2,1fr);} } @media (max-width:560px){ .prn-trajet{grid-template-columns:1fr;} } /* Étapes d'un guide : une carte par étape, numérotée */ .prn-etapes:not(.prn-trajet){list-style:none;counter-reset:etape;padding:0;margin:28px 0 8px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;} .prn-etapes:not(.prn-trajet) li{counter-increment:etape;background:var(--blanc);border:1px solid var(--joint);border-top:3px solid var(--laiton);border-radius:var(--r-tuile);padding:16px 16px 18px;display:flex;flex-direction:column;gap:6px;} .prn-etapes:not(.prn-trajet) li::before{content:counter(etape);font:700 30px/1 var(--f-corps);color:var(--laiton);} .prn-etapes:not(.prn-trajet) strong{font-family:var(--f-titre);font-weight:400;font-size:18px;line-height:1.25;color:var(--ardoise);} .prn-etapes:not(.prn-trajet) span{font-size:14.5px;color:var(--fumee);line-height:1.5;} .prn-etapes--cas:not(.prn-trajet) li::before{content:none;} .prn-etapes--cas:not(.prn-trajet) strong{color:var(--seine-fonce);} .prn-corps--article > p.prn-etapes-legende{font-size:14px;line-height:1.5;color:var(--fumee);margin:0 0 28px;} @media (max-width:1180px){ .prn-etapes:not(.prn-trajet){grid-template-columns:repeat(2,minmax(0,1fr));} } @media (max-width:560px){ .prn-etapes:not(.prn-trajet){grid-template-columns:1fr;} } /* Repères chiffrés d'un guide */ .prn-corps .prn-reperes{margin:24px 0;} .prn-corps .prn-repere strong{font-size:30px;} .prn-comparatif--trois{grid-template-columns:repeat(3,minmax(0,1fr));} @media (max-width:760px){ .prn-comparatif--trois{grid-template-columns:1fr;} } /* Comparatif */ .prn-comparatif{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:28px 0;} .prn-comparatif__carte{display:flex;flex-direction:column;gap:8px;border-radius:var(--r-tuile);padding:22px;margin:0;max-width:none!important;} .prn-comparatif__carte strong{font:400 20px var(--f-titre);} .prn-comparatif__carte span{font-size:15px;line-height:1.5;} .prn-comparatif__carte--sans{background:var(--alarme-fond);} .prn-comparatif__carte--sans strong{color:var(--alarme);} .prn-comparatif__carte--avec{background:var(--remis-fond);} .prn-comparatif__carte--avec strong{color:var(--remis);} .prn-comparatif__carte--vous{background:var(--eau-pale);} .prn-comparatif__carte--vous strong{color:var(--seine-fonce);} .prn-comparatif__carte--pro{background:var(--zinc);color:rgba(247,243,236,.88);} .prn-comparatif__carte--pro strong{color:var(--pierre-claire);} @media (max-width:560px){ .prn-comparatif{grid-template-columns:1fr;} } /* Repères en tuiles */ .prn-reperes{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;} .prn-repere{margin:0;background:var(--zinc);color:rgba(247,243,236,.84);border-radius:var(--r-tuile);border-top:3px solid var(--laiton);padding:18px;display:flex;flex-direction:column;gap:6px;max-width:none!important;} .prn-repere strong{color:var(--pierre-claire);font:700 20px/1.15 var(--f-corps);} .prn-repere span{font-size:14px;line-height:1.45;} /* Signature d'auteur : médaillon rond */ .prn-monogramme{display:flex;align-items:center;justify-content:center;background:var(--zinc);color:var(--pierre-claire);font:400 20px var(--f-titre);flex:none;border-radius:50%;box-shadow:0 0 0 2px var(--pierre-claire),0 0 0 4px var(--laiton);} img.prn-portrait-auteur{object-fit:cover;flex:none;padding:0;background:var(--pierre);border-radius:50%;box-shadow:0 0 0 2px var(--pierre-claire),0 0 0 4px var(--laiton);} .prn-auteur-box{display:flex;gap:18px;align-items:flex-start;border-top:1px solid var(--joint);margin-top:40px;padding-top:28px;} .prn-auteur-box .prn-monogramme{width:56px;height:56px;font-size:20px;} .prn-auteur-box__nom{font-weight:700;margin-bottom:2px;} .prn-auteur-box__role{display:block;color:var(--fumee);font-size:14px;margin-bottom:8px;} .prn-auteur-box__bio{color:var(--fumee);font-size:14.5px;margin:0;} .prn-auteur-box--carte{background:var(--pierre-claire);border:1px solid var(--joint);border-radius:var(--r-carte);box-shadow:var(--ombre-carte);padding:22px 26px;margin:0;align-items:center;} .prn-auteur-box img.prn-portrait-auteur,.prn-carte-auteur img.prn-portrait-auteur{width:64px;height:64px;} .prn-article-tete__meta img.prn-portrait-auteur{width:32px;height:32px;box-shadow:0 0 0 1.5px var(--laiton);} @media (max-width:700px){ .prn-auteur-box--carte{align-items:flex-start;padding:20px;gap:14px;} .prn-auteur-box--carte img.prn-portrait-auteur{width:52px;height:52px;} } /* Barre latérale d'article : UN seul bloc collant = barre de lecture + sommaire + formulaire, toujours plus court que la fenêtre */ .prn-aside-form{position:sticky;top:86px;align-self:start;display:flex;flex-direction:column;gap:10px;max-height:calc(100vh - 100px);} .prn-lecture{flex:none;background:var(--pierre-claire);border:1px solid var(--joint);border-radius:var(--r-tuile);padding:8px 14px 10px;} .prn-lecture__texte{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:13px;color:var(--fumee);margin-bottom:7px;} .prn-lecture__texte strong{font-weight:700;color:var(--ardoise);font-variant-numeric:tabular-nums;} .prn-lecture-progress{height:6px;background:var(--joint);border-radius:3px;overflow:hidden;} .prn-lecture-progress__barre{display:block;height:100%;width:100%;background:var(--seine);transform:scaleX(0);transform-origin:left center;} .prn-sommaire-lateral{flex:0 1 auto;min-height:84px;display:flex;flex-direction:column;background:var(--pierre-claire);border:1px solid var(--joint);border-radius:var(--r-carte);box-shadow:inset 4px 0 0 var(--laiton),var(--ombre-carte);padding:14px 10px 8px 18px;overflow:hidden;} .prn-sommaire-lateral .prn-sommaire-carte__titre{flex:none;font-size:16px;margin:0 0 8px;} .prn-sommaire-lateral .prn-sommaire-carte__titre svg{width:18px;height:18px;padding:3px;} .prn-sommaire-lateral ol{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;display:block;list-style:none;margin:0;padding:0 4px 0 0;scrollbar-width:thin;} .prn-sommaire-lateral li{counter-increment:som;} .prn-sommaire-lateral li a{display:flex;gap:9px;align-items:baseline;padding:5px 8px;border-radius:8px;font-size:13.5px;line-height:1.3;font-weight:600;color:var(--ardoise);transition:background .15s,color .15s;} .prn-sommaire-lateral li a::before{content:counter(som);flex:none;width:20px;height:20px;border-radius:50%;background:var(--laiton-pale);color:var(--laiton-fonce);font:700 11.5px/20px var(--f-corps);text-align:center;} .prn-sommaire-lateral li a:hover,.prn-sommaire-lateral li.est-actif a{background:var(--eau-pale);color:var(--seine-fonce);} .prn-sommaire-lateral li.est-actif a::before{background:var(--seine);color:#fff;} .prn-aside-form__carte{flex:none;padding:16px 20px 18px;} .prn-aside-form__carte .prn-form{padding:0 4px;} .prn-aside-form__titre{font:400 18px var(--f-titre);margin:0 0 6px;padding-inline:6px;} /* le formulaire dans la barre : même circuit, gabarit resserré */ .prn-aside-form .prn-form__entete{margin-bottom:6px;} .prn-aside-form .prn-form__noms-etapes{display:none;} .prn-aside-form .prn-form__progression{margin-bottom:12px;} .prn-aside-form .prn-form__question{font-size:18px;margin-bottom:9px;} .prn-aside-form .prn-form__question--petite{font-size:13px;margin:10px 0 6px;} .prn-aside-form .prn-form__tuiles{gap:8px;margin-bottom:10px;} .prn-aside-form .prn-form__tuile,.prn-aside-form .prn-form__tuiles--colonne .prn-form__tuile{min-height:46px;padding:6px 10px;gap:10px;} .prn-aside-form .prn-form__tuiles--grille2 .prn-form__tuile{flex-direction:row;align-items:center;min-height:46px;} .prn-aside-form .prn-form__tuile__icone{width:34px;height:34px;} .prn-aside-form .prn-form__tuile__icone svg{width:19px;height:19px;} .prn-aside-form .prn-form__tuile__texte{font-size:14px;} .prn-aside-form .prn-form__segmente{margin:4px 0 10px;} .prn-aside-form .prn-form__segmente button{height:38px;min-width:0;font-size:13px;} .prn-aside-form .prn-form__alerte{padding:8px 12px;font-size:13px;margin-bottom:10px;} .prn-aside-form .prn-form__champ{margin-bottom:8px;} .prn-aside-form .prn-form__champ input,.prn-aside-form .prn-form__champ select{height:42px;} .prn-aside-form .prn-form [data-etape="coordonnees"] .prn-form__champ input{height:40px;} .prn-aside-form .prn-form__rangee{grid-template-columns:1fr 1fr;gap:8px;} .prn-aside-form .prn-form__pilules-rapides{margin:6px 0 10px;gap:6px;} .prn-aside-form .prn-form__pilule{height:32px;padding:0 11px;font-size:13px;} .prn-aside-form .prn-form__creneaux{margin-bottom:8px;} .prn-aside-form .prn-form__consentement{margin-bottom:8px;font-size:11.5px;} .prn-aside-form .prn-form__pro{font-size:12px;margin-bottom:6px;} @media (max-width:1180px){ .prn-aside-form{position:static;max-height:none;} .prn-lecture,.prn-sommaire-lateral{display:none;} } @media (min-width:1181px){ .prn-article-colonne > .prn-sommaire-carte{display:none;} } @media (prefers-reduced-motion:reduce){ .prn-sommaire-lateral li a{transition:none;} } /* À lire aussi */ .prn-lire-aussi{margin-top:16px;} .prn-lire-aussi__grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin-top:8px;} .prn-lire-aussi__grille .prn-carte{flex-direction:row;} .prn-lire-aussi__grille .prn-carte__photo{aspect-ratio:auto;flex:0 0 44%;min-height:190px;border-bottom:0;border-right:3px solid var(--laiton);} .prn-lire-aussi__grille .prn-carte__corps{flex:1 1 auto;min-width:0;} @media (max-width:620px){ .prn-lire-aussi__grille .prn-carte{flex-direction:column;} .prn-lire-aussi__grille .prn-carte__photo{aspect-ratio:16/10;flex:none;border-right:0;border-bottom:3px solid var(--laiton);} } /* ===================== 18. RUBRIQUE ===================== */ .prn-rubrique-tete{margin:20px 0 0;background-color:var(--pierre);background-image:var(--assises);background-size:168px 76px;border-block:1px solid var(--joint);} .prn-rubrique-tete__interieur{max-width:calc(var(--conteneur) + 2*var(--marge));margin-inline:auto;padding:clamp(34px,5vh,52px) var(--marge) clamp(46px,6vh,64px);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:72px;align-items:center;} .prn-rubrique-tete__interieur--seul{grid-template-columns:minmax(0,1fr);} .prn-rubrique-tete__texte{display:flex;flex-direction:column;align-items:flex-start;gap:14px;} .prn-rubrique-tete h1{font-size:clamp(38px,4.2vw,62px);line-height:1.02;color:var(--zinc);} .prn-rubrique-tete__chapo{font-size:20px;color:#4C5965;max-width:36em;margin:0;} .prn-rubrique-tete__sou{aspect-ratio:5/4;width:100%;max-height:300px;--cadre:10px;--pas:22px;--barre:2.5px;--appui:11px;margin-bottom:var(--appui);justify-self:end;} .prn-rubrique-filtres{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px;} .prn-rubrique-filtres a{height:40px;display:inline-flex;align-items:center;padding:0 16px;border-radius:999px;font-weight:600;font-size:15px;color:var(--ardoise);background:rgba(247,243,236,.8);border:1px solid var(--joint);transition:background .18s ease,color .18s ease,border-color .18s ease;} .prn-rubrique-filtres a:hover{border-color:var(--zinc);} .prn-rubrique-filtres a.est-actif{background:var(--zinc);border-color:var(--zinc);color:#fff;} .prn-rubrique-section > .prn-rubrique-corps{padding-top:40px;} .prn-rubrique-corps{max-width:calc(var(--conteneur) + 2*var(--marge));margin-inline:auto;padding:0 var(--marge) clamp(40px,6vh,64px);display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:40px;align-items:start;} .prn-rubrique-liste{min-width:0;display:flex;flex-direction:column;gap:22px;} .prn-rubrique-une .prn-carte{flex-direction:row;align-items:stretch;} .prn-rubrique-une .prn-carte__photo{flex:0 0 52%;aspect-ratio:auto;max-height:none;min-height:clamp(260px,24vw,340px);border-bottom:0;border-right:3px solid var(--laiton);} .prn-rubrique-une .prn-carte__corps{flex:1 1 auto;min-width:0;justify-content:center;gap:12px;padding:24px clamp(20px,2.4vw,34px);} .prn-rubrique-une .prn-carte__titre{font-size:clamp(25px,2.3vw,34px);line-height:1.12;} .prn-rubrique-une .prn-carte__extrait{font-size:16.5px;} .prn-rubrique-une .prn-carte__corps::after{content:"Lire le guide";align-self:flex-start;margin-top:6px;background:var(--seine);color:#fff;font-weight:700;font-size:15px;padding:0 22px;height:46px;display:inline-flex;align-items:center;border-radius:999px;transition:background .18s ease;} .prn-rubrique-une .prn-carte:hover .prn-carte__corps::after{background:var(--seine-fonce);} .prn-rubrique-grille{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;} .prn-rubrique-grille .prn-carte__photo{aspect-ratio:16/10;flex:none;} /* un guide isolé sur la dernière rangée s'étale sur toute la largeur : jamais de case vide à côté */ .prn-rubrique-grille > .prn-carte:last-child:nth-child(odd){grid-column:1/-1;flex-direction:row;} .prn-rubrique-grille > .prn-carte:last-child:nth-child(odd) .prn-carte__photo{flex:0 0 42%;aspect-ratio:auto;border-bottom:0;border-right:3px solid var(--laiton);min-height:200px;} .prn-rubrique-grille > .prn-carte:last-child:nth-child(odd) .prn-carte__corps{justify-content:center;} .prn-rubrique-vide{padding:40px 0;color:var(--fumee);} .prn-voir-plus{display:flex;justify-content:center;margin-top:20px;} .prn-rubrique-aside{position:sticky;top:96px;} .prn-plaque--note{padding:26px 26px 24px;display:flex;flex-direction:column;gap:12px;} .prn-plaque--note p{margin:0;font-size:15.5px;color:var(--fumee);} .prn-rubrique-aside__titre{font:400 25px/1.15 var(--f-titre);color:var(--ardoise)!important;} .prn-rubrique-aside__note{font-size:13.5px!important;} .prn-rubriques-autres__grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;} .prn-rubrique-vignette{display:flex;flex-direction:column;background:var(--blanc);border:1px solid var(--joint);border-radius:var(--r-carte);overflow:hidden;box-shadow:var(--ombre-carte);transition:transform .2s ease,box-shadow .2s ease;} .prn-rubrique-vignette:hover{transform:translateY(-3px);box-shadow:0 2px 3px rgba(42,50,59,.1),0 22px 34px -16px rgba(42,50,59,.4);} .prn-rubrique-vignette__photo{display:block;position:relative;aspect-ratio:16/8;border-bottom:3px solid var(--laiton);background-color:var(--pierre-sombre);background-image:var(--soubassement);background-size:150px 66px;overflow:hidden;} .prn-rubrique-vignette__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;} .prn-rubrique-vignette__titre{padding:14px 18px 0;font:400 21px/1.2 var(--f-titre);} .prn-rubrique-vignette:hover .prn-rubrique-vignette__titre{color:var(--seine);} .prn-rubrique-vignette__meta{padding:2px 18px 16px;font-size:14px;color:var(--fumee);} .prn-rubrique-carte{margin-top:0;} @media (max-width:1100px){ .prn-rubrique-corps{grid-template-columns:1fr;} .prn-rubrique-aside{position:static;} .prn-plaque--note{max-width:560px;} } @media (max-width:980px){ .prn-rubrique-tete__interieur{grid-template-columns:1fr;gap:34px;} .prn-rubrique-tete__sou{max-width:420px;justify-self:start;} .prn-rubrique-une .prn-carte{flex-direction:column;} .prn-rubrique-une .prn-carte__photo{flex:none;min-height:0;aspect-ratio:16/10;border-right:0;border-bottom:3px solid var(--laiton);} } @media (max-width:760px){ .prn-rubrique-grille{grid-template-columns:1fr;} .prn-rubrique-grille > .prn-carte:last-child:nth-child(odd){flex-direction:column;} .prn-rubrique-grille > .prn-carte:last-child:nth-child(odd) .prn-carte__photo{flex:none;aspect-ratio:16/10;border-right:0;border-bottom:3px solid var(--laiton);} .prn-rubrique-filtres{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;min-width:0;max-width:100%;scrollbar-width:none;-webkit-overflow-scrolling:touch;} .prn-rubrique-filtres::-webkit-scrollbar{display:none;} .prn-rubrique-filtres a{flex:0 0 auto;white-space:nowrap;padding:0 13px;font-size:14px;} .prn-rubrique-tete__texte{width:100%;min-width:0;} } /* Page Zone d'intervention : une vignette par commune, compacte */ .prn-communes-grille{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:8px;} .prn-communes-grille .prn-carte--commune{flex-direction:row;align-items:center;gap:12px;padding:8px;min-height:0;box-shadow:none;} .prn-communes-grille .prn-carte--commune:hover{box-shadow:var(--ombre-carte);} .prn-communes-grille .prn-carte--commune .prn-carte__photo{flex:0 0 64px;width:64px;height:64px;aspect-ratio:1/1;border:0;border-radius:50%;box-shadow:0 0 0 2px var(--pierre-claire),0 0 0 3.5px var(--laiton);} .prn-communes-grille .prn-carte--commune .prn-carte__corps{padding:0;min-width:0;flex:1;gap:0;} .prn-communes-grille .prn-carte--commune .prn-carte__titre{font-size:15px;line-height:1.25;margin:0;overflow-wrap:anywhere;hyphens:auto;} @media (max-width:1180px){ .prn-communes-grille{grid-template-columns:repeat(4,1fr);} } @media (max-width:760px){ .prn-communes-grille{grid-template-columns:repeat(2,1fr);gap:10px;} .prn-communes-grille .prn-carte--commune .prn-carte__photo{flex-basis:48px;width:48px;height:48px;} .prn-communes-grille .prn-carte--commune .prn-carte__titre{font-size:13.5px;} } /* ===================== 19. PAGE COMMUNE ===================== */ .prn-ville-corps .prn-section__panneau.prn-ville-grille{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:56px;align-items:start;} .prn-ville-aside{position:sticky;top:100px;display:flex;flex-direction:column;gap:16px;} .prn-ville-aside__formulaire,.prn-ville-aside__carte{border-radius:var(--r-carte);padding:20px 18px;} .prn-ville-aside__formulaire{background:var(--pierre-claire);border:1.5px solid var(--laiton);box-shadow:var(--ombre-plaque);} .prn-ville-aside__formulaire .prn-form{padding:0;} .prn-ville-aside__carte{display:flex;flex-direction:column;gap:10px;background:var(--pierre);} .prn-ville-aside__titre{font:400 21px/1.2 var(--f-titre);color:var(--ardoise);margin:0 0 12px;} .prn-ville-aside__carte .prn-ville-aside__titre{margin:0;} .prn-ville-aside__liens{display:flex;flex-wrap:wrap;gap:6px;margin:0;} .prn-ville-aside__liens a{background:var(--pierre-claire);border:1px solid var(--joint);border-radius:999px;padding:5px 12px;font-size:13px;font-weight:700;color:var(--ardoise);} .prn-ville-aside__liens a:hover{background:var(--seine);border-color:var(--seine);color:#fff;} @media (max-width:980px){ .prn-ville-corps .prn-section__panneau.prn-ville-grille{grid-template-columns:1fr;gap:32px;} .prn-ville-aside{position:static;} } /* Texte de la page ville en accordéons */ .prn-accordeons{display:flex;flex-direction:column;gap:12px;margin:24px 0;} .prn-accordeon{background:var(--blanc);border:1px solid var(--joint);border-radius:var(--r-tuile);overflow:hidden;} .prn-accordeon[open]{border-color:var(--laiton);box-shadow:inset 3px 0 0 var(--laiton);} .prn-accordeon > summary{list-style:none;cursor:pointer;padding:17px 64px 17px 22px;position:relative;} .prn-accordeon > summary::-webkit-details-marker{display:none;} .prn-accordeon > summary h2,.prn-accordeon > summary h3{font-size:clamp(19px,1.5vw,22px)!important;line-height:1.3;margin:0!important;} .prn-accordeon > summary::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:50%;background:var(--laiton-pale);color:var(--laiton-fonce);font:700 22px/32px var(--f-corps);text-align:center;} .prn-accordeon[open] > summary::after{content:"–";background:var(--seine);color:#fff;} .prn-accordeon__corps{padding:0 22px 20px;} .prn-accordeon__corps > :first-child{margin-top:0;} .prn-ville-corps .prn-corps h2{margin:0;} /* ===================== 20. CONTACT, QUI SOMMES-NOUS, PAGES ANNEXES ===================== */ .prn-bandeau-simple{padding:56px var(--marge) 36px;max-width:calc(var(--conteneur) + 2*var(--marge));margin-inline:auto;} .prn-bandeau-simple h1{font-size:clamp(34px,3.6vw,50px);line-height:1.08;margin-top:14px;color:var(--zinc);} .prn-bandeau-simple__chapo{margin-top:14px;font-size:19px;color:var(--fumee);max-width:40em;} .prn-page-simple{max-width:760px;margin:0 auto 60px;padding-inline:var(--marge);} .prn-deux-colonnes{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start;} .prn-section--pierre .prn-deux-colonnes{align-items:center;} .prn-reassurance-ligne{display:flex;gap:12px;align-items:flex-start;margin-bottom:12px;font-size:15.5px;} .prn-reassurance-ligne svg{width:22px;height:22px;color:var(--laiton-fonce);flex:none;margin-top:2px;} .prn-reassurance-ligne a{color:var(--seine);font-weight:700;text-decoration:underline;text-underline-offset:3px;} /* Contact : deux colonnes de MÊME hauteur (la photo absorbe la hauteur restante à droite) */ .prn-deux-colonnes--egal{align-items:stretch;} .prn-contact-gauche{display:flex;flex-direction:column;} .prn-contact-gauche .prn-plaque--formulaire{flex:1 1 auto;display:flex;flex-direction:column;} .prn-plaque--formulaire .prn-form{flex:1 1 auto;padding:30px 32px 32px;} .prn-contact-droite{display:flex;flex-direction:column;gap:22px;min-width:0;} .prn-contact-photo{flex:1 1 auto;min-height:320px;margin:0 0 var(--appui,14px);--pas:26px;--appui:14px;} .prn-contact-photo .prn-sou__jour{min-height:300px;} .prn-contact-pastille{position:absolute;z-index:4;right:18px;bottom:20px;display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--pierre-claire);border-radius:var(--r-carte);box-shadow:inset 0 0 0 2px var(--laiton),inset 0 0 0 5px var(--pierre-claire),inset 0 0 0 6px rgba(176,138,62,.6),var(--ombre-plaque);padding:12px 14px 10px;color:var(--ardoise);text-decoration:none;} .prn-contact-pastille .prn-mini-carte{width:150px;box-shadow:none;padding:2px;background:transparent;} .prn-contact-pastille__legende{font-weight:700;font-size:13px;line-height:1.25;text-align:center;padding:0 6px 2px;color:var(--seine);} a.prn-contact-pastille:hover .prn-contact-pastille__legende{text-decoration:underline;text-underline-offset:3px;} @media (min-width:761px){ .prn-contact-pastille .prn-mini-carte{width:166px;} } @media (max-width:980px){ .prn-deux-colonnes{grid-template-columns:1fr;gap:36px;} .prn-contact-photo{min-height:260px;flex:none;aspect-ratio:4/3;} } @media (max-width:760px){ a.prn-contact-pastille,.prn-contact-pastille{display:none;} .prn-contact-photo{margin-bottom:var(--appui);} .prn-section--pierre .prn-deux-colonnes{gap:20px;} } .prn-devis-seo .prn-section__panneau{max-width:calc(980px + 2*var(--marge));} .prn-devis-seo .prn-accordeon > summary h3{font-size:clamp(18px,1.4vw,21px)!important;} .prn-devis-seo .prn-accordeon__corps p{font-size:16.5px;line-height:1.7;color:var(--ardoise);max-width:none;} .prn-devis-seo .prn-accordeon__corps a{color:var(--seine);font-weight:700;text-decoration:underline;text-underline-offset:3px;} /* Qui sommes-nous */ .prn-qsn-info__intro{font:400 clamp(21px,1.8vw,26px)/1.4 var(--f-titre);color:var(--ardoise);max-width:46em;margin:0 0 28px;} .prn-qsn-info__grille{display:grid;grid-template-columns:1fr 1.4fr;gap:20px;} .prn-qsn-info__approche{background:var(--zinc);color:rgba(247,243,236,.88);border-radius:var(--r-carte);border-top:4px solid var(--laiton);padding:28px;} .prn-qsn-info__approche h2{color:var(--pierre-claire);font-size:26px;margin:14px 0 10px;} .prn-qsn-info__approche p{margin:0;font-size:16px;line-height:1.6;} .prn-qsn-info__couvre{background:var(--pierre);border-radius:var(--r-carte);padding:28px;} .prn-qsn-info__couvre h2{font-size:26px;margin:0 0 16px;} .prn-qsn-info__tuiles{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;} .prn-qsn-info__tuile{background:var(--pierre-claire);border-radius:var(--r-tuile);border:1.5px solid var(--laiton);padding:16px;margin:0;display:flex;flex-direction:column;gap:6px;} .prn-qsn-info__tuile strong{font:400 18px var(--f-titre);color:var(--ardoise);} .prn-qsn-info__tuile > span:last-child{font-size:14px;color:var(--fumee);line-height:1.45;} .prn-qsn-info__icone{width:40px;height:40px;border-radius:50%;background:var(--laiton-pale);color:var(--laiton-fonce);display:inline-flex;align-items:center;justify-content:center;} .prn-qsn-info__approche .prn-qsn-info__icone{background:rgba(247,243,236,.14);color:var(--pierre-claire);} .prn-qsn-info__icone svg{width:20px;height:20px;} .prn-qsn-info__note{display:flex;gap:10px;align-items:flex-start;margin:22px 0 0;font-size:15px;color:var(--fumee);} .prn-qsn-info__note svg{width:20px;height:20px;color:var(--remis);flex:none;margin-top:2px;} .prn-qsn-info__note a{color:var(--seine);font-weight:700;text-decoration:underline;text-underline-offset:3px;} @media (max-width:980px){ .prn-qsn-info__grille{grid-template-columns:1fr;} .prn-qsn-info__tuiles{grid-template-columns:1fr;} } .prn-cheval-grille{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:24px;} @media (max-width:980px){ .prn-cheval-grille{grid-template-columns:repeat(2,1fr);} } @media (max-width:620px){ .prn-cheval-grille{grid-template-columns:1fr;} } .prn-cheval-grille .prn-etape-carte{box-shadow:var(--ombre-carte);} .prn-carte-auteur{display:flex;gap:20px;align-items:center;background:var(--pierre-claire);border:1px solid var(--joint);border-radius:var(--r-carte);box-shadow:var(--ombre-carte);padding:24px;} .prn-carte-auteur .prn-monogramme{width:72px;height:72px;font-size:24px;} .prn-carte-auteur img.prn-portrait-auteur{width:72px;height:72px;} .prn-carte-auteur .prn-btn{margin-top:12px;height:44px;} .prn-btn--publications{white-space:nowrap;} @media (max-width:620px){ .prn-carte-auteur{flex-direction:column;align-items:flex-start;gap:14px;} } /* Page « Notre équipe » */ .prn-equipe-tete{margin-top:20px;background-color:var(--pierre);background-image:var(--assises);background-size:168px 76px;border-block:1px solid var(--joint);} .prn-equipe-tete__interieur{max-width:calc(var(--conteneur) + 2*var(--marge));margin-inline:auto;padding:clamp(40px,7vh,72px) var(--marge) clamp(40px,6vh,64px);text-align:left;} .prn-equipe-tete h1{font-size:clamp(38px,4.4vw,62px);line-height:1.02;margin:16px 0;color:var(--zinc);} .prn-equipe-tete__chapo{font-size:20px;color:#4C5965;max-width:36em;margin:0;} .prn-equipe__grille{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;} .prn-equipe-carte{display:flex;gap:26px;align-items:flex-start;background:var(--blanc);border:1.5px solid var(--laiton);border-radius:var(--r-carte);padding:28px;box-shadow:var(--ombre-carte);} .prn-equipe-carte img.prn-portrait-auteur,.prn-equipe-carte .prn-monogramme{width:120px;height:120px;font-size:36px;} .prn-equipe-carte__texte{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:8px;} .prn-equipe-carte h2{font-size:28px;line-height:1.1;margin:0;} .prn-equipe-carte__role{margin:0;color:var(--fumee);font-size:14px;font-weight:600;} .prn-equipe-carte__bio{margin:4px 0 8px;font-size:16px;line-height:1.6;color:var(--ardoise);} .prn-equipe__texte{margin-top:36px;max-width:68ch;} @media (max-width:980px){ .prn-equipe__grille{grid-template-columns:1fr;} } @media (max-width:560px){ .prn-equipe-carte{flex-direction:column;gap:16px;padding:20px;} .prn-equipe-carte img.prn-portrait-auteur,.prn-equipe-carte .prn-monogramme{width:96px;height:96px;} .prn-btn--publications{white-space:normal;height:auto;min-height:44px;padding-block:10px;} } .prn-engagements{display:flex;flex-wrap:wrap;gap:10px;} .prn-engagement-pastille{display:flex;align-items:center;gap:10px;background:var(--pierre-claire);border:1.5px solid var(--laiton);color:var(--ardoise);border-radius:999px;padding:8px 16px;font-weight:700;font-size:14px;} .prn-engagement-pastille svg{width:18px;height:18px;color:var(--laiton-fonce);} .prn-page-auteur__tete{display:flex;gap:24px;align-items:center;padding:20px 0;} .prn-page-auteur__tete .prn-monogramme{width:84px;height:84px;font-size:30px;} .prn-page-auteur__tete img.prn-portrait-auteur{width:84px;height:84px;} /* 404, recherche */ .prn-404{text-align:center;padding:90px var(--marge);} .prn-404__symbole{display:block;width:76px;height:76px;margin:0 auto 24px;color:var(--eau);} .prn-404__symbole svg{width:100%;height:100%;stroke-width:1.4;} .prn-404 h1{font-size:40px;margin-bottom:12px;} .prn-404__recherche,.prn-recherche-form{display:flex;gap:10px;max-width:460px;margin:24px auto;} .prn-recherche-form{margin:20px 0 0;max-width:520px;} .prn-404__recherche input,.prn-recherche-form input{flex:1;height:50px;border-radius:999px;border:1.5px solid #AEA595;padding:0 20px;font:16px var(--f-corps);background:var(--blanc);color:var(--ardoise);min-width:0;} .prn-404__recherche input:focus,.prn-recherche-form input:focus{outline:none;border-color:var(--seine);box-shadow:0 0 0 4px rgba(31,95,139,.18);} .prn-404__rubriques{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:20px;} @media (max-width:480px){ .prn-404__recherche,.prn-recherche-form{flex-direction:column;} } /* Page Crédits photos */ .prn-credits{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:20px} .prn-credits__carte{margin:0;background:var(--blanc);border:1px solid var(--joint);border-radius:var(--r-tuile);overflow:hidden;box-shadow:var(--ombre-carte)} .prn-credits__carte img{display:block;width:100%;height:140px;object-fit:cover;border-bottom:3px solid var(--laiton)} .prn-credits__carte figcaption{display:flex;flex-direction:column;gap:4px;padding:12px 14px;font-size:14px;line-height:1.4} .prn-credits__carte span{color:var(--sb-doux)} .prn-credits__carte a{color:var(--seine);font-weight:600} /* Intervention : la photo reste à sa taille réelle (jamais étirée), les 4 étapes se posent à cheval sur son bord droit */ @media (min-width:981px){ .prn-intervention{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center;margin-bottom:0;} .prn-intervention__photo{aspect-ratio:auto;height:clamp(380px,29vw,420px);margin-bottom:var(--appui);--pas:28px;} .prn-intervention__photo .prn-sou__jour img{object-position:50% 30%;} .prn-etapes-cheval{position:relative;z-index:3;left:auto;right:auto;bottom:auto;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:0;margin-left:-72px;} .prn-etape-carte{padding:20px 22px 22px;} .prn-etape-carte p{font-size:15px;} } @media (max-width:980px){ .prn-intervention__photo{width:min(100%,560px);aspect-ratio:4/3;height:auto;margin-bottom:var(--appui);} } /* 03/11 — liens lisibles dans les blocs à fond zinc/ardoise (contraste_reel) */ .prn-repere a,.prn-comparatif__carte--pro a,.prn-section--ardoise .prn-corps a,.prn-appel-final p a{color:#F1D58F;text-decoration:underline;text-underline-offset:3px;} .prn-repere a:hover,.prn-comparatif__carte--pro a:hover{color:#fff;} /* 03/11 — case « je suis un professionnel » (MO-0041) */ .prn-form__case-pro{display:flex;align-items:center;gap:8px;margin:2px 0 6px;font-size:14px;color:var(--ardoise);cursor:pointer;} .prn-form__case-pro input{width:18px;height:18px;accent-color:var(--zinc);flex:none;margin:0;} /* ===================================================================================== PASSE 1 — corrections du jugement visuel du 03/11/2026 (bloc de surcharges, à lire en dernier) ===================================================================================== */ /* [1] Plus AUCUNE grille posée sur une photo. La grille de fonte devient un petit ornement dessiné sur l'appui de pierre, sous l'ouverture : hors de l'image. */ .prn-sou__grille{display:none!important;} .prn-sou::after{ background: repeating-linear-gradient(90deg,#8E99A4 0 1px,#38424C 1px 3.5px,transparent 3.5px 9px) 50% 50% / min(126px,34%) 54% no-repeat, linear-gradient(#1E252C,#1E252C) 50% 50% / min(130px,35%) 64% no-repeat, linear-gradient(180deg,#F3EDE1,#CFC4B0); } /* [5] Hero calé sur la même marge que le logo et les sections (80 px à 1440, 320 px à 1920) */ .prn-hero__conteneur{max-width:calc(var(--conteneur) + 2*var(--marge));} @media (min-width:761px){ .prn-hero__titre{font-size:clamp(40px,4vw,58px);} .prn-hero__titre--ville{font-size:clamp(36px,3.5vw,52px);} } /* [6] Barre collante mobile : visible seulement quand la carte formulaire a quitté l'écran (app.js) */ @media (max-width:760px){ .prn-barre-collante{transform:translateY(110%);visibility:hidden;transition:transform .25s ease,visibility 0s linear .25s;} .prn-barre-collante.est-visible{transform:none;visibility:visible;transition:transform .25s ease;} } @media (prefers-reduced-motion:reduce){ .prn-barre-collante,.prn-barre-collante.est-visible{transition:none;} } /* [7] Pictos du formulaire : trait laiton dans une rondelle de plaque vissée */ .prn-form__tuile__icone{ background: radial-gradient(circle closest-side,var(--pierre-claire) 0 78%,transparent 80%), linear-gradient(150deg,#EAD8A6 0%,var(--laiton) 52%,#8C6A2A 100%); box-shadow:inset 0 0 0 1px rgba(124,95,34,.75),0 1px 2px rgba(42,50,59,.28); color:var(--laiton-fonce); } .prn-form__tuile.est-choisi .prn-form__tuile__icone{ background: radial-gradient(circle closest-side,#fff 0 78%,transparent 80%), linear-gradient(150deg,#A9C8DC 0%,var(--seine) 60%,var(--seine-fonce) 100%); color:var(--seine); } /* [8] Bande « contrôle annuel » : les 4 contrôles en grandes plaques numérotées */ .prn-controles__legende{margin:0 0 4px;font-weight:600;font-size:16px;color:rgba(247,243,236,.86);} .prn-controles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;} .prn-controle{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;column-gap:18px;row-gap:4px;align-items:center;min-height:132px;padding:22px 24px;color:var(--ardoise);} .prn-controle__num{grid-row:1 / 3;min-width:46px;text-align:center;font:400 68px/1 var(--f-titre);color:var(--laiton-fonce);} .prn-controle strong{align-self:end;font:400 23px/1.15 var(--f-titre);color:var(--ardoise);} .prn-controle > span:last-child{align-self:start;font-size:15px;line-height:1.4;color:#4C5965;} @media (max-width:560px){ .prn-controles{grid-template-columns:1fr;gap:12px;} .prn-controle{min-height:0;padding:18px 20px;} .prn-controle__num{font-size:52px;min-width:36px;} } /* [9] Bande d'appel finale en Bleu Seine carrelé : le pied de page reste le seul bloc sombre */ .prn-appel-final{ background-color:var(--seine); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='168' height='76'%3E%3Cpath d='M0 .5H168M0 38.5H168M.5 0V38M84.5 38V76' stroke='%23FFFFFF' stroke-opacity='.12' fill='none'/%3E%3C/svg%3E"); background-size:168px 76px; } .prn-final{color:rgba(255,255,255,.92);} .prn-final__rassure svg{color:#BFE6CD;} /* [10] Accueil « Avant d'appeler » : pastille de rubrique sur chaque vignette */ .prn-guides__liste .prn-carte__pastille{display:inline-flex;left:8px;bottom:8px;max-width:calc(100% - 16px);font-size:11.5px;padding:4px 10px 4px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} /* [2] Étapes d'article : le gras reste DANS la ligne (police et taille du texte) ; seul le titre de l'étape (premier ) prend la police de titre. Plus de flex qui coupe les phrases. */ .prn-etapes:not(.prn-trajet) li{display:block;position:relative;font-size:15.5px;line-height:1.55;color:#4C5965;} .prn-etapes:not(.prn-trajet) li::before{display:block;margin-bottom:8px;} .prn-etapes:not(.prn-trajet) li strong{font:inherit;font-weight:700;color:var(--ardoise);} .prn-etapes:not(.prn-trajet) li > strong:first-child{display:block;margin-bottom:6px;font:400 19px/1.25 var(--f-titre);} .prn-etapes--cas:not(.prn-trajet) li > strong:first-child{color:var(--seine-fonce);} .prn-etapes:not(.prn-trajet) li > span{font-size:inherit;line-height:inherit;color:inherit;} /* Tuiles sombres de repères : un titre court en bloc lisible, la suite en texte courant */ .prn-repere{display:block;font-size:15px;line-height:1.5;} .prn-corps .prn-reperes .prn-repere strong,.prn-reperes .prn-repere strong{font:inherit;font-weight:700;color:var(--pierre-claire);} .prn-corps .prn-reperes .prn-repere > strong:first-child,.prn-reperes .prn-repere > strong:first-child{display:block;margin-bottom:4px;font:700 18px/1.3 var(--f-corps);} .prn-reperes:has(> :nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr));} @media (max-width:560px){ .prn-reperes:has(> :nth-child(4):last-child){grid-template-columns:1fr;} } /* [11] Grille d'étapes qui se remplit : 3 en ligne, 2×2 pour 4 (et 2), frise verticale numérotée pour 5 et plus */ .prn-etapes:not(.prn-trajet){grid-template-columns:repeat(3,minmax(0,1fr));} @media (max-width:1180px){ .prn-etapes:not(.prn-trajet){grid-template-columns:repeat(3,minmax(0,1fr));} } @media (min-width:761px){ .prn-etapes:not(.prn-trajet):has(> li:nth-child(4):last-child), .prn-etapes:not(.prn-trajet):has(> li:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr));} } @media (max-width:760px){ .prn-etapes:not(.prn-trajet){grid-template-columns:1fr;} } .prn-etapes:not(.prn-trajet):has(> li:only-child){grid-template-columns:1fr;} .prn-etapes:not(.prn-trajet):has(> li:nth-child(5)){grid-template-columns:1fr;gap:12px;} .prn-etapes:not(.prn-trajet):has(> li:nth-child(5)) > li{padding:16px 20px 18px 72px;border-top-width:1px;border-left:3px solid var(--laiton);} .prn-etapes:not(.prn-trajet):has(> li:nth-child(5)) > li::before{ position:absolute;left:16px;top:14px;margin:0;width:38px;height:38px;border-radius:50%; display:flex;align-items:center;justify-content:center;font:400 20px/1 var(--f-titre);color:var(--laiton-fonce); background:radial-gradient(circle closest-side,var(--pierre-claire) 0 78%,transparent 80%),linear-gradient(150deg,#EAD8A6,var(--laiton) 52%,#8C6A2A); box-shadow:inset 0 0 0 1px rgba(124,95,34,.75); } .prn-etapes:not(.prn-trajet):has(> li:nth-child(5)) > li:not(:last-child)::after{content:"";position:absolute;left:34px;top:56px;bottom:-13px;width:2px;background:rgba(176,138,62,.45);} /* [12] Comparatif à 2 cartes : même cadre que les autres encadrés */ .prn-comparatif__carte{display:block;border:1px solid var(--joint);border-top:3px solid var(--laiton);box-shadow:var(--ombre-carte);font-size:15.5px;line-height:1.55;} .prn-comparatif > .prn-comparatif__carte:not([class*="prn-comparatif__carte--"]){background:var(--blanc);color:#4C5965;} .prn-comparatif__carte > strong:first-child{display:block;margin-bottom:6px;font:400 20px/1.25 var(--f-titre);} .prn-comparatif > .prn-comparatif__carte:not([class*="prn-comparatif__carte--"]) > strong:first-child{color:var(--ardoise);} .prn-comparatif__carte strong:not(:first-child){font:inherit;font-weight:700;} /* [13] Mini-carte de la page ville : la commune en Bleu Seine plein, un point et son nom, le reste en beige */ .prn-ville-situe .prn-mini-carte{width:172px;background:var(--pierre-claire);box-shadow:inset 0 0 0 1px var(--joint);} .prn-mini-carte[data-commune-active] svg path{fill:#E6DCCB;stroke:#FFFFFF;stroke-width:2;} .prn-mini-carte[data-commune-active] svg path[id^="c-"]{fill:#CDBD9F;stroke:#FFFFFF;stroke-width:2.5;} .prn-mini-carte[data-commune-active] svg path.est-active{fill:var(--seine)!important;stroke:#fff;stroke-width:2.5;} .prn-mini-point{fill:#fff;stroke:var(--seine-fonce);stroke-width:9;pointer-events:none;} .prn-mini-nom{font:700 58px var(--f-corps);fill:var(--ardoise);paint-order:stroke;stroke:#FBF8F2;stroke-width:14px;stroke-linejoin:round;pointer-events:none;} /* [14] Qui sommes-nous : tuiles chiffres de même largeur, côte à côte */ .prn-hero--qsn .prn-hero__preuves{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:520px;} .prn-hero--qsn .prn-pastille-chiffre{min-width:0;} /* [16a] Qui sommes-nous : la voûte de briques en bandeau large (plus l'arche des autres pages) */ .prn-hero--qsn .prn-hero__conteneur{grid-template-columns:minmax(0,1fr);row-gap:26px;} .prn-hero--qsn .prn-hero__texte{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:64px;row-gap:10px;align-items:end;padding:clamp(8px,2vh,24px) 0 0;} .prn-hero--qsn .prn-hero__texte > .prn-surtitre{grid-column:1;grid-row:1;} .prn-hero--qsn .prn-hero__texte > .prn-hero__titre{grid-column:1;grid-row:2 / 4;margin:0;align-self:start;} .prn-hero--qsn .prn-hero__titre .prn-ligne{display:inline;white-space:nowrap;} .prn-hero--qsn .prn-hero__texte > .prn-hero__chapo{grid-column:2;grid-row:1 / 3;margin:0;max-width:34em;} .prn-hero--qsn .prn-hero__texte > .prn-hero__preuves{grid-column:2;grid-row:3;margin:0;} .prn-hero--qsn .prn-qsn-photo{min-height:0;} .prn-hero--qsn .prn-sou--hero{position:relative;inset:auto;left:0;height:clamp(240px,23vw,320px);margin-bottom:var(--appui);} .prn-sou--qsn{ --cadre:20px; border-radius:50% 50% 6px 6px / 72% 72% 6px 6px; background: linear-gradient(180deg,#EFE7DA,#D6CAB4) 50% 100% / 100% calc(var(--cadre) + 1px) no-repeat, repeating-conic-gradient(from -90deg at 50% 100%,#A0705A 0deg 2.1deg,#E8DDCC 2.1deg 2.5deg,#93644F 2.5deg 4.6deg,#E8DDCC 4.6deg 5deg); } .prn-sou--qsn .prn-sou__jour{border-radius:50% 50% 3px 3px / 70% 70% 3px 3px;} .prn-hero--qsn .prn-sou--hero .prn-sou__jour img{object-position:50% 30%;} @media (max-width:980px){ .prn-hero--qsn .prn-hero__texte{display:flex;flex-direction:column;align-items:flex-start;} .prn-hero--qsn .prn-hero__texte > .prn-hero__titre{margin:8px 0 10px;} .prn-hero--qsn .prn-hero__texte > .prn-hero__preuves{margin-top:14px;} } @media (max-width:760px){ .prn-hero--qsn .prn-sou--hero{height:200px;} .prn-sou--qsn{--cadre:14px;} .prn-hero--qsn .prn-hero__preuves{max-width:none;} } /* [16b] Rubrique : une grande photo pleine largeur dans la plinthe (plus d'arche) */ .prn-rubrique-tete{overflow:hidden;} .prn-rubrique-tete__interieur{grid-template-columns:minmax(0,1fr);gap:30px;padding-bottom:0;} .prn-rubrique-tete__sou{ justify-self:stretch;width:auto;max-height:none;aspect-ratio:auto;height:clamp(220px,25vw,380px); margin:0 calc(50% - 50vw);padding:0;border-radius:0; background-color:var(--zinc);background-image:var(--joints-zinc); border-top:4px solid var(--laiton);border-bottom:10px solid var(--zinc);box-shadow:none; } .prn-rubrique-tete__sou::after{display:none;} .prn-rubrique-tete__sou .prn-sou__jour{max-width:1600px;margin-inline:auto;border-radius:0;} .prn-rubrique-tete__sou .prn-sou__jour img{object-position:50% 42%;} @media (max-width:760px){ .prn-rubrique-tete__sou{height:180px;} } /* [15] Contact : plus de bandeau nu ; titre au-dessus de la plaque-formulaire, sur le carrelage */ .prn-contact-tete{padding-top:clamp(18px,3vh,30px);border-top:1px solid var(--joint);} .prn-contact-tete .prn-deux-colonnes--egal{align-items:start;} .prn-contact-titre{font-size:clamp(30px,2.6vw,40px);line-height:1.08;color:var(--zinc);margin:8px 0 14px;} .prn-contact-chapo{margin:0;font-size:17px;line-height:1.55;color:#4C5965;max-width:40em;} .prn-contact-tete .prn-plaque--formulaire .prn-form{padding:20px 26px 22px;} .prn-contact-tete .prn-form--pleine .prn-form__tuiles--grille2 .prn-form__tuile{min-height:92px;} .prn-contact-tete .prn-contact-photo{min-height:300px;} @media (max-width:980px){ .prn-contact-chapo{order:-1;} } /* ===================================================================== PASSE 2 (03/11/2026) — surcharges, rien n'est réécrit au-dessus ===================================================================== */ /* [P2-1] Rubrique : la carte large qui termine une liste impaire garde son texte dans sa colonne */ .prn-carte__corps{min-width:0;} .prn-rubrique-grille > .prn-carte{min-width:0;} .prn-rubrique-grille > .prn-carte:last-child:nth-child(odd) .prn-carte__corps{flex:1 1 0;min-width:0;padding:22px clamp(18px,2.2vw,32px);} .prn-rubrique-grille > .prn-carte:last-child:nth-child(odd) .prn-carte__titre{text-wrap:balance;} /* [P2-2] Bande photo de rubrique : fichiers ≥ 2 048 px, la bande peut couvrir tout l'écran jusqu'à 1 920 px */ .prn-rubrique-tete__sou .prn-sou__jour{max-width:1920px;} /* [P2-3] Tout lien posé sur un fond sombre : laiton clair souligné (le bleu des articles y était illisible) */ .prn-corps .prn-repere a:not(.prn-btn),.prn-repere a:not(.prn-btn), .prn-corps .prn-comparatif__carte--pro a:not(.prn-btn),.prn-comparatif__carte--pro a:not(.prn-btn), .prn-corps .prn-qsn-info__approche a:not(.prn-btn),.prn-qsn-info__approche a:not(.prn-btn), .prn-section--ardoise .prn-corps a:not(.prn-btn),.prn-section--ardoise p a:not(.prn-btn),.prn-section--ardoise li a:not(.prn-btn), .prn-appel-final p a:not(.prn-btn),.prn-corps [style*="background:#3"] a,.prn-corps [style*="background:#2"] a{ color:#F1D58F;text-decoration:underline;text-decoration-color:rgba(241,213,143,.7);text-decoration-thickness:1px;text-underline-offset:3px; } .prn-corps .prn-repere a:not(.prn-btn):hover,.prn-repere a:not(.prn-btn):hover, .prn-corps .prn-comparatif__carte--pro a:not(.prn-btn):hover,.prn-comparatif__carte--pro a:not(.prn-btn):hover, .prn-qsn-info__approche a:not(.prn-btn):hover,.prn-section--ardoise .prn-corps a:not(.prn-btn):hover{color:#FFFFFF;text-decoration-color:#FFFFFF;} /* [P2-4] Accueil et ville en mobile : titre + première rangée de choix entières dans 700 px, une photo reste visible */ @media (max-width:480px){ .prn-hero:has(.prn-hero__form-zone) .prn-hero__chapo{display:none;} .prn-hero:has(.prn-hero__form-zone) .prn-hero__titre{margin-bottom:14px;} .prn-hero:has(.prn-hero__form-zone) .prn-sou--hero{height:158px;} } /* [P2-7] Fiche « En bref » de l'article : une valeur longue revient à la ligne dans sa marge */ .prn-fiche-enbref{width:268px;padding:14px 20px 6px;} .prn-fiche-enbref dd{white-space:normal;text-align:right;text-wrap:balance;min-width:0;} .prn-fiche-enbref dt{flex:none;} @media (max-width:620px){ .prn-fiche-enbref{width:calc(100% - 40px);} .prn-fiche-enbref dd{text-align:left;} } /* [P2-8] Mini-carte de la page ville : recadrée sur la commune (JS), commune remplie en Bleu Seine, traits fins */ .prn-mini-carte[data-commune-active] svg path{vector-effect:non-scaling-stroke;stroke-width:1.5;} .prn-mini-carte[data-commune-active] svg path.est-active{fill:var(--seine)!important;stroke:var(--seine-fonce);stroke-width:2;} .prn-mini-carte .prn-mini-point{display:none;} .prn-ville-situe .prn-mini-carte{width:172px;padding:4px;} /* [P2-9] Qui sommes-nous : grands chiffres (police de texte) dans des tuiles à leur mesure */ .prn-hero--qsn .prn-pastille-chiffre{flex-direction:row;align-items:center;gap:16px;padding:14px 22px;} .prn-hero--qsn .prn-pastille-chiffre__valeur{font:800 clamp(46px,4vw,60px)/.9 var(--f-corps);font-variant-numeric:lining-nums tabular-nums;letter-spacing:-.02em;color:var(--laiton-fonce);flex:none;} .prn-hero--qsn .prn-pastille-chiffre__legende{margin:0;font-size:15px;line-height:1.3;color:var(--ardoise);font-weight:600;} @media (max-width:760px){ .prn-hero--qsn .prn-pastille-chiffre{gap:10px;padding:10px 12px;} .prn-hero--qsn .prn-pastille-chiffre__valeur{font-size:40px;} .prn-hero--qsn .prn-pastille-chiffre__legende{font-size:13px;} } /* [P2-10] Grilles de cartes d'article sans case vide : la grille suit le nombre de cartes */ .prn-comparatif{grid-template-columns:repeat(2,minmax(0,1fr));} .prn-comparatif:has(> :only-child){grid-template-columns:minmax(0,1fr);} .prn-comparatif:has(> :nth-child(3):last-child){grid-template-columns:minmax(0,1fr);} .prn-comparatif:has(> :nth-child(5):last-child){grid-template-columns:repeat(2,minmax(0,1fr));} .prn-comparatif:has(> :nth-child(5):last-child) > :last-child{grid-column:1 / -1;} .prn-reperes:has(> :nth-child(3):last-child),.prn-reperes:has(> :nth-child(6):last-child){grid-template-columns:repeat(3,minmax(0,1fr));} .prn-reperes:has(> :nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr));} .prn-reperes:has(> :nth-child(5):last-child){grid-template-columns:repeat(6,minmax(0,1fr));} .prn-reperes:has(> :nth-child(5):last-child) > *{grid-column:span 2;} .prn-reperes:has(> :nth-child(5):last-child) > :nth-child(4){grid-column:2 / span 2;} @media (min-width:1100px){ .prn-comparatif:has(> :nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr));} .prn-comparatif:has(> :nth-child(5):last-child){grid-template-columns:repeat(6,minmax(0,1fr));} .prn-comparatif:has(> :nth-child(5):last-child) > *{grid-column:span 2;} .prn-comparatif:has(> :nth-child(5):last-child) > :nth-child(4){grid-column:2 / span 2;} } @media (max-width:760px){ .prn-reperes:has(> :nth-child(3):last-child),.prn-reperes:has(> :nth-child(6):last-child),.prn-reperes:has(> :nth-child(5):last-child){grid-template-columns:repeat(2,minmax(0,1fr));} .prn-reperes:has(> :nth-child(3):last-child) > :last-child,.prn-reperes:has(> :nth-child(5):last-child) > :last-child{grid-column:1 / -1;} .prn-reperes:has(> :nth-child(5):last-child) > :nth-child(-n+4){grid-column:auto;} } @media (max-width:560px){ .prn-comparatif,.prn-comparatif:has(> :nth-child(5):last-child),.prn-reperes:has(> *){grid-template-columns:minmax(0,1fr);} .prn-comparatif > *,.prn-reperes > *{grid-column:auto!important;} }