/* Styles du site SereniAzur (hors utilitaires Tailwind) */
  :root{
    --paper:#F2F7FA; --frost:#E1EDF4; --line:#CFDFEA; --ink:#0A1A2F; --ink2:#12263F; --mist:#5A6B7E;
    --ice:#1E9BD7; --ice-light:#7FD8F8; --ice-deep:#0A6A99; --heat:#FF5A36;
    --ease: cubic-bezier(.16,1,.3,1);
  }
  html{ scroll-behavior:smooth; scroll-padding-top:84px; -webkit-text-size-adjust:100%; }
  body{ font-family:'Instrument Sans',sans-serif; background:var(--paper); color:var(--ink); overflow-x:hidden; }
  .font-display{ font-family:'Archivo',sans-serif; font-stretch:112%; }
  .font-display.narrow{ font-stretch:100%; }
  .tnum{ font-variant-numeric: tabular-nums; }
  ::selection{ background:var(--ice); color:var(--ink); }
  :focus-visible{ outline:2px solid var(--ice); outline-offset:3px; border-radius:8px; }

  /* ---------- Header ---------- */
  .hdr{ color:#fff; transition:background-color .35s var(--ease), color .35s var(--ease), box-shadow .35s var(--ease); }
  .hdr.is-solid, body.menu-open .hdr{ color:var(--ink); }
  .hdr.is-solid{ background:rgba(242,247,250,.84); -webkit-backdrop-filter:blur(14px) saturate(1.4); backdrop-filter:blur(14px) saturate(1.4); box-shadow:0 1px 0 rgba(10,26,47,.08); }
  .hdr .hdr-cta{ background:#fff; color:var(--ink); }
  .hdr.is-solid .hdr-cta{ background:var(--ink); color:#fff; }
  .hdr .hdr-link{ opacity:.82; transition:opacity .2s; position:relative; }
  .hdr .hdr-link:hover{ opacity:1; }
  .hdr .hdr-link::after{ content:""; position:absolute; left:0; right:0; bottom:-6px; height:2px; background:var(--ice); transform:scaleX(0); transform-origin:left; transition:transform .35s var(--ease); }
  .hdr .hdr-link:hover::after{ transform:scaleX(1); }

  .hdr .logo-couleur{ display:none; }
  .hdr.is-solid .logo-couleur, body.menu-open .hdr .logo-couleur{ display:block; }
  .hdr.is-solid .logo-blanc, body.menu-open .hdr .logo-blanc{ display:none; }

  /* Burger */
  .burger{ position:relative; width:46px; height:46px; border-radius:14px; border:1px solid currentColor; border-color:color-mix(in srgb, currentColor 28%, transparent); }
  .burger i{ position:absolute; left:13px; right:13px; height:2px; border-radius:2px; background:currentColor; transition:transform .5s var(--ease), opacity .25s, width .4s var(--ease); }
  .burger i:nth-child(1){ top:16px; }
  .burger i:nth-child(2){ top:22px; right:19px; }
  .burger i:nth-child(3){ top:28px; }
  body.menu-open .burger i:nth-child(1){ transform:translateY(6px) rotate(45deg); }
  body.menu-open .burger i:nth-child(2){ opacity:0; transform:translateX(-8px); }
  body.menu-open .burger i:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

  /* ---------- Menu plein écran ---------- */
  .menu{ clip-path:circle(0px at calc(100% - 39px) 32px); visibility:hidden; transition:clip-path .75s cubic-bezier(.77,0,.18,1), visibility 0s linear .75s; }
  .menu.open{ clip-path:circle(160vmax at calc(100% - 39px) 32px); visibility:visible; transition:clip-path .75s cubic-bezier(.77,0,.18,1), visibility 0s; }
  .menu .m-item{ opacity:0; transform:translateY(28px); transition:opacity .5s var(--ease), transform .7s var(--ease); }
  .menu.open .m-item{ opacity:1; transform:none; transition-delay:calc(.22s + var(--i) * .06s); }
  .menu .m-watermark{ transform:translateY(40px); opacity:0; transition:transform 1.2s var(--ease), opacity 1s; }
  .menu.open .m-watermark{ transform:none; opacity:1; transition-delay:.25s; }
  .m-link .m-arrow{ transform:translateX(-8px); opacity:0; transition:all .35s var(--ease); }
  .m-link:hover .m-arrow, .m-link:focus-visible .m-arrow{ transform:none; opacity:1; }
  body.menu-open{ overflow:hidden; }

  /* ---------- Hero ---------- */
  .hero-img{ transform:scale(1.08); animation:heroZoom 2.8s var(--ease) forwards; }
  @keyframes heroZoom{ to{ transform:scale(1); } }
  .hero-veil{ background:linear-gradient(180deg, rgba(10,26,47,.80) 0%, rgba(10,26,47,.42) 34%, rgba(10,26,47,.52) 62%, rgba(10,26,47,.90) 100%); }
  @media (min-width:1024px){
    .hero-veil{ background:linear-gradient(90deg, rgba(10,26,47,.86) 0%, rgba(10,26,47,.55) 45%, rgba(10,26,47,.15) 75%, rgba(10,26,47,.25) 100%), linear-gradient(180deg, rgba(10,26,47,.45) 0%, transparent 30%, transparent 70%, rgba(10,26,47,.6) 100%); }
  }
  .mask{ display:block; overflow:hidden; padding-bottom:.06em; }
  .mask > span{ display:block; transform:translateY(105%); animation:lineUp 1.1s var(--ease) forwards; }
  @keyframes lineUp{ to{ transform:none; } }
  .fade-in{ opacity:0; transform:translateY(18px); animation:fadeIn 1s var(--ease) forwards; }
  @keyframes fadeIn{ to{ opacity:1; transform:none; } }

  /* ---------- Thermostat (signature) ---------- */
  .thermo{ --th:#FF5A36; position:relative; border-radius:30px; padding:22px; color:#fff;
    background:linear-gradient(160deg, rgba(255,255,255,.18), rgba(255,255,255,.06));
    border:1px solid rgba(255,255,255,.24);
    -webkit-backdrop-filter:blur(22px) saturate(1.3); backdrop-filter:blur(22px) saturate(1.3);
    box-shadow:0 40px 80px -30px rgba(3,10,20,.65), inset 0 1px 0 rgba(255,255,255,.25); }
  .thermo::before{ content:""; position:absolute; inset:-1px; border-radius:inherit; pointer-events:none;
    background:radial-gradient(120% 60% at 50% 0%, color-mix(in srgb, var(--th) 26%, transparent), transparent 70%); transition:background .6s; }
  .unit{ position:relative; height:54px; border-radius:16px; background:linear-gradient(180deg,#fff,#E9F1F6); box-shadow:0 10px 24px -12px rgba(0,0,0,.45), inset 0 -2px 0 rgba(10,26,47,.06); }
  .unit .slot{ position:absolute; left:14px; right:14px; bottom:9px; height:7px; border-radius:6px; background:#C9D7E1; overflow:hidden; }
  .unit .slot::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--th) 70%, #fff), transparent); transform:translateX(-100%); animation:slotSweep 3.2s ease-in-out infinite; }
  @keyframes slotSweep{ to{ transform:translateX(100%); } }
  .led{ width:7px; height:7px; border-radius:50%; background:var(--th); box-shadow:0 0 10px var(--th), 0 0 2px var(--th); transition:background .6s, box-shadow .6s; }
  .air path{ fill:none; stroke:var(--th); stroke-width:2.2; stroke-linecap:round; stroke-dasharray:46 220; opacity:.75; animation:airflow 2.6s linear infinite; transition:stroke .6s; }
  .air path:nth-child(2){ animation-delay:-.9s; opacity:.5; }
  .air path:nth-child(3){ animation-delay:-1.7s; opacity:.35; }
  @keyframes airflow{ from{ stroke-dashoffset:266; } to{ stroke-dashoffset:0; } }
  .dial-arc{ transition:stroke .5s; filter:drop-shadow(0 0 10px color-mix(in srgb, var(--th) 55%, transparent)); }
  .seg-th button{ transition:background .3s, color .3s; }
  .seg-th button[aria-pressed="true"]{ background:#fff; color:var(--ink); }
  .th-btn{ width:40px; height:40px; border-radius:12px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.28); transition:background .2s, transform .15s; }
  .th-btn:hover{ background:rgba(255,255,255,.14); }
  .th-btn:active{ transform:scale(.94); }

  /* ---------- Marquee ---------- */
  .marquee{ display:flex; width:max-content; animation:marquee 38s linear infinite; }
  .marquee-wrap:hover .marquee{ animation-play-state:paused; }
  @keyframes marquee{ to{ transform:translateX(-50%); } }

  /* ---------- Reveal ---------- */
  .reveal{ opacity:0; transform:translateY(26px); transition:opacity .9s var(--ease), transform .9s var(--ease); transition-delay:var(--d,0s); }
  .reveal.in{ opacity:1; transform:none; }

  /* ---------- Services ---------- */
  .svc-row{ transition:background-color .4s var(--ease); }
  .svc-row .svc-idx{ transition:color .3s; }
  .svc-row .svc-arrow{ transition:transform .45s var(--ease), background-color .3s, color .3s; }
  .svc-row:hover{ background:#fff; }
  .svc-row:hover .svc-idx{ color:var(--ice-deep); }
  .svc-row:hover .svc-arrow{ transform:rotate(-45deg); background:var(--ink); color:#fff; }

  /* ---------- Simulateur ---------- */
  .range{ -webkit-appearance:none; appearance:none; width:100%; height:8px; border-radius:99px; outline:none;
    background:linear-gradient(90deg, var(--ice) 0%, var(--ice) var(--p,20%), rgba(255,255,255,.14) var(--p,20%)); }
  .range::-webkit-slider-thumb{ -webkit-appearance:none; width:28px; height:28px; border-radius:50%; background:#fff; border:6px solid var(--ice); box-shadow:0 4px 16px rgba(45,180,232,.5); cursor:grab; }
  .range::-moz-range-thumb{ width:18px; height:18px; border-radius:50%; background:#fff; border:6px solid var(--ice); box-shadow:0 4px 16px rgba(45,180,232,.5); cursor:grab; }
  .range:focus-visible::-webkit-slider-thumb{ outline:2px solid #fff; outline-offset:3px; }
  .seg{ display:grid; grid-auto-flow:column; grid-auto-columns:1fr; gap:4px; padding:4px; border-radius:14px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); }
  .seg input{ position:absolute; opacity:0; pointer-events:none; }
  .seg label{ text-align:center; padding:10px 6px; border-radius:10px; font-size:.875rem; font-weight:600; color:rgba(255,255,255,.7); cursor:pointer; transition:background .25s, color .25s; }
  .seg input:checked + label{ background:var(--ice); color:var(--ink); }
  .seg input:focus-visible + label{ outline:2px solid #fff; outline-offset:2px; }
  .switch{ position:relative; width:46px; height:26px; flex:none; border-radius:99px; background:rgba(255,255,255,.18); transition:background .25s; }
  .switch::after{ content:""; position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:50%; background:#fff; transition:transform .3s var(--ease); }
  input:checked + .switch{ background:var(--ice); }
  input:checked + .switch::after{ transform:translateX(20px); }
  input:focus-visible + .switch{ outline:2px solid #fff; outline-offset:2px; }
  .bump{ animation:bump .45s var(--ease); }
  @keyframes bump{ 0%{ transform:translateY(8px); opacity:.2; } 100%{ transform:none; opacity:1; } }

  /* ---------- Réalisations ---------- */
  .shot img{ transition:transform 1.1s var(--ease); }
  .shot:hover img{ transform:scale(1.07); }

  /* ---------- Avis (carrousel mobile) ---------- */
  .snap{ scroll-padding-inline:16px; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  .snap::-webkit-scrollbar{ display:none; }
  .snap > *{ scroll-snap-align:start; }

  /* ---------- FAQ ---------- */
  details summary::-webkit-details-marker{ display:none; }
  details[open] .faq-ico{ transform:rotate(45deg); background:var(--ink); color:#fff; }
  .faq-ico{ transition:transform .4s var(--ease), background-color .3s, color .3s; }
  details[open] .faq-body{ animation:fadeIn .5s var(--ease); }

  /* ---------- Formulaire ---------- */
  .field{ width:100%; border-radius:14px; border:1px solid var(--line); background:var(--paper); padding:13px 15px; font-size:1rem; color:var(--ink); transition:border-color .2s, box-shadow .2s, background .2s; }
  .field::placeholder{ color:#687789; }
  .field:focus{ outline:none; border-color:var(--ice); background:#fff; box-shadow:0 0 0 4px rgba(45,180,232,.18); }
  .chip input{ position:absolute; opacity:0; pointer-events:none; }
  .chip span{ display:inline-flex; align-items:center; gap:6px; padding:9px 14px; border-radius:99px; border:1px solid var(--line); font-size:.875rem; font-weight:600; color:var(--mist); cursor:pointer; transition:all .2s; }
  .chip input:checked + span{ background:var(--ink); border-color:var(--ink); color:#fff; }
  .chip input:focus-visible + span{ outline:2px solid var(--ice); outline-offset:2px; }

  /* ---------- Barre d'action mobile ---------- */
  .actionbar{ transform:translateY(140%); transition:transform .5s var(--ease); }
  .actionbar.show{ transform:none; }

  /* ---------- Progression ---------- */
  #progress{ position:fixed; top:0; left:0; height:2px; width:100%; transform-origin:left; transform:scaleX(0); z-index:70; background:linear-gradient(90deg, var(--ice-light), var(--ice)); }

  .btn-shine{ position:relative; overflow:hidden; isolation:isolate; }
  .btn-shine::after{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(110deg, transparent 30%, rgba(255,255,255,.55) 50%, transparent 70%); transform:translateX(-120%); }
  .btn-shine:hover::after{ transition:transform .9s var(--ease); transform:translateX(120%); }

  @media (prefers-reduced-motion: reduce){
    *, *::before, *::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
    .reveal{ opacity:1; transform:none; }
    .marquee{ animation:none; }
  }

  /* ---------- Pages légales ---------- */
  .legal h2{ font-family:'Archivo',sans-serif; font-stretch:112%; font-weight:800; font-size:1.35rem; letter-spacing:-.01em; margin-top:2.75rem; padding-top:1.5rem; border-top:1px solid #CFDFEA; }
  .legal h2:first-of-type{ margin-top:0; padding-top:0; border-top:0; }
  .legal h3{ font-weight:700; margin-top:1.5rem; }
  .legal p, .legal li{ color:#3E4E61; line-height:1.75; }
  .legal ul{ list-style:disc; padding-left:1.25rem; margin-top:.75rem; }
  .legal li + li{ margin-top:.35rem; }
  .legal a{ color:#0A6A99; text-decoration:underline; text-underline-offset:3px; }
  .legal table{ width:100%; border-collapse:collapse; margin-top:1rem; font-size:.95rem; }
  .legal th, .legal td{ text-align:left; vertical-align:top; padding:.75rem; border-bottom:1px solid #E1EDF4; }
  .legal th{ font-weight:700; color:#0A1A2F; background:#F2F7FA; }
  .legal td{ color:#3E4E61; }
  .tablewrap{ overflow-x:auto; }
  .todo{ background:#FDE68A; color:#7C2D12; font-weight:700; padding:.05em .35em; border-radius:4px; }
  .legal dl{ display:grid; grid-template-columns:minmax(0,200px) 1fr; gap:.5rem 1.5rem; margin-top:1rem; }
  .legal dt{ font-weight:600; color:#0A1A2F; }
  .legal dd{ color:#3E4E61; }
  @media (max-width:640px){ .legal dl{ grid-template-columns:1fr; gap:.15rem; } .legal dd{ margin-bottom:.8rem; } }

  /* ---------- Menu déroulant « Services » ---------- */
  .dd{ position:relative; }
  .dd-panel{ position:absolute; top:100%; left:-20px; padding-top:18px; opacity:0; visibility:hidden; transform:translateY(6px); transition:opacity .25s var(--ease), transform .35s var(--ease), visibility 0s linear .25s; }
  .dd:hover .dd-panel, .dd:focus-within .dd-panel{ opacity:1; visibility:visible; transform:none; transition-delay:0s; }
  .dd-panel ul{ width:340px; background:#fff; color:var(--ink); border-radius:20px; padding:10px; box-shadow:0 30px 60px -20px rgba(10,26,47,.35); border:1px solid var(--line); }
  .dd-panel a{ display:block; padding:10px 12px; border-radius:12px; transition:background .2s; }
  .dd-panel a:hover, .dd-panel a:focus-visible, .dd-panel a[aria-current="page"]{ background:var(--paper); }
  .hdr .hdr-link[aria-current="page"]{ opacity:1; }
  .hdr .hdr-link[aria-current="page"]::after{ transform:scaleX(1); }

  /* ---------- Pages intérieures ---------- */
  .crumbs a{ text-decoration:underline; text-underline-offset:3px; text-decoration-color:rgba(255,255,255,.35); }
  .crumbs a:hover{ text-decoration-color:currentColor; }
  .prose-s h2{ font-family:'Archivo',sans-serif; font-stretch:112%; font-weight:800; font-size:clamp(1.5rem,3.6vw,2.1rem); letter-spacing:-.02em; line-height:1.12; color:var(--ink); }
  .prose-s h2 + *{ margin-top:1rem; }
  .prose-s p, .prose-s li{ color:#3E4E61; line-height:1.75; font-size:1.0625rem; }
  .prose-s p + p{ margin-top:1rem; }
  .prose-s ul{ margin-top:1rem; display:grid; gap:.6rem; }
  .prose-s li{ position:relative; padding-left:1.6rem; }
  .prose-s li::before{ content:""; position:absolute; left:0; top:.68em; width:.55rem; height:.55rem; border-radius:50%; background:var(--ice); }
  .prose-s a{ color:var(--ice-deep); text-decoration:underline; text-underline-offset:3px; font-weight:600; }
  .prose-s strong{ color:var(--ink); }
  .prose-s section + section{ margin-top:3rem; padding-top:3rem; border-top:1px solid var(--line); }
  .airlines path{ fill:none; stroke:var(--ice-light); stroke-width:2; stroke-linecap:round; stroke-dasharray:160 520; animation:airflow2 7s linear infinite; }
  .airlines path:nth-child(2){ animation-delay:-2.3s; } .airlines path:nth-child(3){ animation-delay:-4.6s; }
  .airlines.heat path{ stroke:#FF8A6B; }
  @keyframes airflow2{ from{ stroke-dashoffset:680; } to{ stroke-dashoffset:0; } }
  @media (prefers-reduced-motion: reduce){ .airlines path{ animation:none; } }
