/* menorcavisit.com : feuille propre au site (2 novembre 2026). Fonds clairs, sable et mer, pierre sèche des murets de Minorque. */
:root{--sable:#f7f2e8;--sable-2:#efe6d3;--blanc:#fffdf8;--mer:#0b6e79;--mer-2:#08525a;--lagon:#d5efec;--encre:#1f2a30;--gris:#5b666c;
--terre:#b5522e;--trait:#e2d8c3;--r:14px;--ombre:0 1px 2px rgba(31,42,48,.06),0 6px 18px rgba(31,42,48,.06);
--titre:"Fraunces",Georgia,"Times New Roman",serif;--texte:"Source Sans 3",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--sable);color:var(--encre);font:17px/1.65 var(--texte)}
a{color:var(--mer)}a:hover{color:var(--mer-2)}img{max-width:100%;height:auto;display:block}
.cadre{max-width:1120px;margin:0 auto;padding:0 16px}
.texte{max-width:760px}
/* en-tête */
.bandeau{background:var(--blanc);border-bottom:1px solid var(--trait);position:sticky;top:0;z-index:20}
.bandeau .cadre{display:flex;align-items:center;gap:18px;min-height:64px}
.marque{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--encre);font:600 21px/1 var(--titre);letter-spacing:.2px}
.marque svg{flex:none}
.rubr{display:flex;gap:4px;margin-left:auto;flex-wrap:wrap}
.rubr a{text-decoration:none;color:var(--encre);padding:8px 11px;border-radius:999px;font-weight:600;font-size:15px}
.rubr a:hover,.rubr a[aria-current]{background:var(--lagon);color:var(--mer-2)}
.btn-menu{display:none;margin-left:auto;background:none;border:1px solid var(--trait);border-radius:10px;padding:8px 12px;font:600 15px var(--texte);color:var(--encre)}
@media(max-width:880px){.rubr{display:none;position:absolute;left:0;right:0;top:64px;background:var(--blanc);flex-direction:column;padding:10px 16px 18px;border-bottom:1px solid var(--trait)}
.rubr.ouvert{display:flex}.btn-menu{display:block}}
/* fil et titre */
.fil{font-size:14px;color:var(--gris);margin:22px 0 8px}.fil a{color:var(--gris)}
h1,h2,h3{font-family:var(--titre);line-height:1.2;color:var(--encre)}
h1{font-size:clamp(30px,5vw,44px);margin:6px 0 12px;font-weight:600}
h2{font-size:clamp(23px,3.2vw,29px);margin:44px 0 12px;font-weight:600}
h3{font-size:20px;margin:26px 0 8px}
.dates{font-size:14px;color:var(--gris);margin:0 0 18px}
/* entête de page : bande de vague */
.tete{background:linear-gradient(180deg,var(--blanc),var(--sable));border-bottom:1px solid var(--trait);padding-bottom:26px}
.chapo{font-size:19px;color:#344047;max-width:760px}
/* encadré « en deux minutes » */
.deuxmin{background:var(--blanc);border:1px solid var(--trait);border-left:5px solid var(--mer);border-radius:var(--r);padding:16px 20px;margin:22px 0;box-shadow:var(--ombre)}
.deuxmin p.lib{margin:0 0 6px;font:600 13px/1 var(--texte);letter-spacing:1.2px;text-transform:uppercase;color:var(--mer)}
.deuxmin ul{margin:0;padding-left:20px}.deuxmin li{margin:4px 0}
/* sommaire */
.sommaire{background:var(--sable-2);border-radius:var(--r);padding:14px 18px;margin:20px 0}
.sommaire summary{cursor:pointer;font-weight:700}
.sommaire ol{margin:10px 0 0;padding-left:22px}.sommaire li{margin:3px 0}
/* réponse courte */
.reponse{background:var(--lagon);border-radius:10px;padding:12px 16px;margin:8px 0 14px;font-weight:600;color:#123b40}
/* tableaux */
.tab{overflow-x:auto;margin:16px 0;border:1px solid var(--trait);border-radius:12px;background:var(--blanc)}
table{border-collapse:collapse;width:100%;font-size:15.5px}
th,td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--trait);vertical-align:top}
th{background:#f3ecdc;font-weight:700;white-space:nowrap}tr:last-child td{border-bottom:0}
/* réserver */
.reserver{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin:20px 0}
.resa{background:var(--blanc);border:1px solid var(--trait);border-radius:var(--r);padding:16px;box-shadow:var(--ombre);display:flex;flex-direction:column;gap:8px}
.resa .q{font:600 13px/1 var(--texte);letter-spacing:1px;text-transform:uppercase;color:var(--terre)}
.resa p{margin:0;font-size:15.5px}
.resa a.go{margin-top:auto;display:inline-block;text-align:center;background:var(--mer);color:#fff;text-decoration:none;font-weight:700;border-radius:10px;padding:10px 14px}
.resa a.go:hover{background:var(--mer-2)}
.mention{font-size:13px;color:var(--gris)}
/* fiche lieu */
.infos-lieu{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin:18px 0}
.infos-lieu div{background:var(--blanc);border:1px solid var(--trait);border-radius:12px;padding:10px 14px}
.infos-lieu b{display:block;font-size:12.5px;letter-spacing:1px;text-transform:uppercase;color:var(--gris);font-weight:600}
/* FAQ */
.faq details{background:var(--blanc);border:1px solid var(--trait);border-radius:12px;margin:8px 0;padding:12px 16px}
.faq summary{cursor:pointer;font-weight:700}
.faq details p{margin:8px 0 0}
/* sources */
.sources{font-size:15px;color:#3b464c;border-top:1px dashed var(--trait);margin-top:36px;padding-top:12px}
.sources li{margin:4px 0}
/* cartes (accueil, rubriques, à lire ensuite) */
.cartes{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));margin:18px 0}
.carte{background:var(--blanc);border:1px solid var(--trait);border-radius:var(--r);padding:16px 18px;text-decoration:none;color:var(--encre);box-shadow:var(--ombre);display:flex;flex-direction:column;gap:6px}
.carte:hover{border-color:var(--mer)}
.carte .r{font:600 12.5px/1 var(--texte);letter-spacing:1.1px;text-transform:uppercase;color:var(--terre)}
.carte strong{font:600 19px/1.25 var(--titre)}
.carte span.d{font-size:15px;color:var(--gris)}
.rubriques{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));margin:18px 0}
.rubriques a{background:var(--blanc);border:1px solid var(--trait);border-radius:var(--r);padding:14px;text-decoration:none;color:var(--encre)}
.rubriques a b{display:block;font:600 18px var(--titre);color:var(--mer-2)}.rubriques a span{font-size:14.5px;color:var(--gris)}
/* accueil : grande photo */
.hero{position:relative;background:#0b4f57 center/cover no-repeat;color:#fff;min-height:min(78vh,640px);display:flex;align-items:flex-end}
.hero-voile{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,40,46,.05) 0%,rgba(8,40,46,.35) 45%,rgba(8,40,46,.82) 100%)}
.hero-texte{position:relative;width:100%;padding-top:120px;padding-bottom:40px}
.hero h1{color:#fff;font-size:clamp(36px,6.5vw,64px);max-width:820px;margin:4px 0 14px;text-shadow:0 2px 18px rgba(0,0,0,.25)}
.hero .chapo{color:#eef6f5;max-width:720px;font-size:18.5px}
.sur-titre{margin:0;font:600 13px/1 var(--texte);letter-spacing:2.4px;text-transform:uppercase;color:#bfe9e4}
.faits{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));max-width:900px}
.faits li{background:rgba(255,253,248,.12);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(6px);border-radius:14px;padding:11px 14px}
.faits b{display:block;font:600 15px var(--titre);color:#fff}.faits span{font-size:14px;color:#d8ebe9}
/* article : pastille de rubrique, photo à la une */
.pastille{display:inline-block;margin-top:6px;background:var(--lagon);color:var(--mer-2);text-decoration:none;font:700 12.5px/1 var(--texte);letter-spacing:1.2px;text-transform:uppercase;padding:7px 11px;border-radius:999px}
.une{margin-top:6px;margin-bottom:18px}.une img{width:100%;border-radius:20px;box-shadow:0 18px 40px -18px rgba(11,79,87,.55);aspect-ratio:16/9;object-fit:cover}
/* cartes illustrées */
.carte.avec-photo{padding:0;overflow:hidden}.carte img{aspect-ratio:16/9;object-fit:cover;width:100%;transition:transform .5s}
.carte:hover img{transform:scale(1.04)}.corps-carte{display:flex;flex-direction:column;gap:6px;padding:14px 18px 18px}
/* température colorée du frais au chaud */
td.t{font-weight:700;white-space:nowrap}
.t0{background:#dcecf7}.t1{background:#e3f0f2}.t2{background:#e9f4ee}.t3{background:#f1f6e3}.t4{background:#f8f3da}
.t5{background:#fbecd0}.t6{background:#fbe1c4}.t7{background:#f9d3b8}.t8{background:#f6c2a8}.t9{background:#f2ae96}
td{min-width:64px}td.n{white-space:nowrap}
/* outil météo */
.meteo{background:var(--blanc);border:1px solid var(--trait);border-radius:20px;padding:16px;box-shadow:var(--ombre);margin:14px 0 26px}
.meteo-attente{margin:8px 4px;color:var(--gris)}
.m-jours{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(86px,1fr);gap:8px;overflow-x:auto;padding-bottom:6px}
.m-jour{border:1px solid var(--trait);background:var(--sable);border-radius:14px;padding:9px 6px;display:flex;flex-direction:column;align-items:center;gap:3px;font:600 13.5px var(--texte);color:var(--encre);cursor:pointer}
.m-jour b{font-size:24px;line-height:1.1}.m-jour.actif{background:var(--mer);border-color:var(--mer);color:#fff}
.m-fiche h3{margin:18px 0 10px;font-size:19px}.m-fiche h3::first-letter{text-transform:uppercase}
.m-chiffres{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.m-chiffres div{background:var(--lagon);border-radius:12px;padding:10px 12px}.m-chiffres b{display:block;font:600 21px var(--titre);color:var(--mer-2)}
.m-chiffres span{font-size:13.5px;color:#2e4a4e}
.m-criques{list-style:none;padding:0;margin:0;display:grid;gap:6px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.m-criques li{border:1px solid var(--trait);border-radius:12px;padding:8px 10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-weight:600}
.m-criques small{color:var(--gris);font-weight:400}
.m-pastille{font:700 11.5px/1 var(--texte);letter-spacing:.6px;text-transform:uppercase;padding:5px 8px;border-radius:999px}
.m-abritée .m-pastille,.m-calme .m-pastille{background:#d6f0dc;color:#1d5b2c}.m-partiellement-abritée .m-pastille{background:#f8edc9;color:#6b5310}
.m-exposée .m-pastille{background:#f6d6cc;color:#7a2a14}.m-exposée{opacity:.75}
.m-source{font-size:13px;color:var(--gris);margin:14px 2px 0}
/* bandeau météo de l'accueil et pastille des criques */
.meteo-bandeau{position:relative;margin:-34px auto 0;max-width:1088px;background:var(--blanc);border:1px solid var(--trait);border-radius:20px;box-shadow:0 18px 36px -20px rgba(11,79,87,.45);padding:16px 18px;z-index:2}
.mb-titre{font:700 12.5px/1 var(--texte);letter-spacing:1.6px;text-transform:uppercase;color:var(--terre);margin-bottom:10px}
.mb-chiffres{list-style:none;margin:0;padding:0;display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.mb-chiffres b{display:block;font:600 22px var(--titre);color:var(--mer-2)}.mb-chiffres span{font-size:14px;color:var(--gris)}
.mb-cote b::first-letter{text-transform:uppercase}
.mb-lien{display:inline-block;margin-top:12px;font-weight:700}
.mc{border-radius:12px;padding:10px 14px;margin:14px 0;font-size:15.5px}.mc a{margin-left:6px}
.mc-abritee,.mc-calme{background:#d6f0dc;color:#1d5b2c}.mc-moyen{background:#f8edc9;color:#6b5310}.mc-exposee{background:#f6d6cc;color:#7a2a14}
.lien-meteo{background:var(--mer)!important;color:#fff!important}
/* pied */
.vague-pied{display:block;width:100%;height:60px;margin-top:60px}
.pied{margin-top:0;background:#163c42;color:#e6efee;padding:34px 0 26px;font-size:15px}
.pied a{color:#e6efee}.pied .cols{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.pied h4{font:600 16px var(--titre);margin:0 0 8px;color:#fff}.pied ul{list-style:none;margin:0;padding:0}.pied li{margin:4px 0}
.pied .bas{border-top:1px solid rgba(255,255,255,.18);margin-top:22px;padding-top:14px;font-size:13.5px;color:#c4d4d2}
/* formulaire */
form.contact{display:grid;gap:12px;max-width:560px}form.contact input,form.contact textarea{font:inherit;padding:10px 12px;border:1px solid var(--trait);border-radius:10px;background:#fff}
form.contact button{background:var(--mer);color:#fff;border:0;border-radius:10px;padding:11px 16px;font:700 16px var(--texte);cursor:pointer}
.piege{position:absolute;left:-5000px}
