/* Site SAFAND — feuille de style (charte validée sur les maquettes) */
@font-face{font-family:Inter;src:url(../fonts/inter-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url(../fonts/inter-latin-500-normal.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url(../fonts/inter-latin-600-normal.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url(../fonts/inter-latin-700-normal.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}

@font-face{font-family:"Playfair";src:url(../fonts/playfair-display-latin-500-normal.woff2) format("woff2");font-display:swap;font-weight:500;font-style:normal}
@font-face{font-family:"Playfair";src:url(../fonts/playfair-display-latin-600-normal.woff2) format("woff2");font-display:swap;font-weight:600;font-style:normal}
@font-face{font-family:"Playfair";src:url(../fonts/playfair-display-latin-700-normal.woff2) format("woff2");font-display:swap;font-weight:700;font-style:normal}
@font-face{font-family:"Playfair";src:url(../fonts/playfair-display-latin-500-italic.woff2) format("woff2");font-display:swap;font-weight:500;font-style:italic}
:root{
  --green:#1C3F06;--leaf:#3E7B1F;--mint:#EAF2E3;--orange:#F29B09;--gold:#DF9C3B;--gold2:#FAC647;
  --ink:#191A17;--muted:#6B6F66;--paper:#FFFFFF;--sand:#F3F8EE;--line:#E3EADC;--night:#141414;--night2:#1F1F1F;--white:#fff;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Inter,system-ui,sans-serif;color:var(--ink);background:var(--paper);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
h1,h2,h3,.serif{font-family:"Playfair",Georgia,serif;font-weight:600;letter-spacing:-.01em;line-height:1.08}
a{color:inherit;text-decoration:none}
.wrap{max-width:1200px;margin:0 auto;padding:0 40px}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--leaf)}
.dark .eyebrow{color:var(--gold)}
.muted{color:var(--muted)}
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 24px;border-radius:999px;font-weight:600;font-size:15px;border:1.5px solid transparent;white-space:nowrap}
.btn svg{width:18px;height:18px;flex:none}
.btn-green{background:var(--green);color:#fff}
.btn-ghost{border-color:var(--line);background:#fff;color:var(--ink)}
.btn-gold{background:var(--gold);color:#17120a}
.btn-line-gold{border-color:rgba(223,156,59,.6);color:var(--gold2)}
.btn-sm{padding:10px 18px;font-size:14px}

/* Barre du haut et navigation */
.topbar{background:var(--green);color:#DDE8D4;font-size:13px}
.topbar .wrap{display:flex;justify-content:space-between;padding-top:9px;padding-bottom:9px}
.topbar b{color:#fff;font-weight:600}
.nav{background:rgba(251,250,246,.96);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:84px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{height:52px}
.brand .name{font-family:"Playfair",serif;font-weight:700;font-size:30px;letter-spacing:.12em;color:var(--green)}
.menu{display:flex;gap:34px;font-size:15px;font-weight:500}
.menu a.on{color:var(--green);font-weight:600;box-shadow:0 2px 0 var(--orange);padding-bottom:6px}

/* Accueil : bandeau principal */
.hero .wrap{display:grid;grid-template-columns:1.02fr .98fr;gap:64px;align-items:center;padding-top:72px;padding-bottom:84px}
.hero h1{font-size:76px;color:var(--green);margin:18px 0 22px}
.hero h1 em{font-style:italic;font-weight:500;color:var(--orange)}
.hero p.lead{font-size:19px;color:#3d4138;max-width:520px}
.cta{display:flex;gap:14px;margin-top:34px}
.proof{display:flex;gap:34px;margin-top:44px;padding-top:26px;border-top:1px solid var(--line)}
.proof div b{display:block;font-family:"Playfair",serif;font-size:30px;font-weight:700;color:var(--green);line-height:1}
.proof div span{font-size:13px;color:var(--muted)}
.hero-visual{position:relative}
.hero-visual .photo{border-radius:28px;overflow:hidden;aspect-ratio:1/1.02;box-shadow:0 30px 60px -30px rgba(28,63,6,.45)}
.hero-visual .photo img{width:100%;height:100%;object-fit:cover;display:block}
.float{position:absolute;background:#fff;border-radius:18px;padding:16px 18px;box-shadow:0 18px 40px -18px rgba(0,0,0,.28);display:flex;gap:12px;align-items:center;font-size:13.5px;line-height:1.35}
.float b{display:block;font-size:15px}
.float .dot{width:42px;height:42px;border-radius:50%;background:var(--mint);display:grid;place-items:center;color:var(--green);flex:none}
.float.f1{left:-34px;bottom:54px}
.float.f2{right:-22px;top:42px}

/* Sections */
section{padding:92px 0}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:44px;gap:40px}
.sec-head h2{font-size:52px;color:var(--green);margin-top:12px}
.sec-head p{max-width:440px;color:var(--muted)}
.dark{background:var(--night);color:#EDEAE2}
.dark .sec-head h2{color:#fff}
.dark .muted,.dark .sec-head p{color:#A8A498}
.sand{background:var(--sand)}

/* Trois univers */
.univers{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.uni{border-radius:24px;padding:34px 32px;min-height:330px;display:flex;flex-direction:column;justify-content:space-between;border:1px solid var(--line);background:#fff}
.uni .logo{height:96px;display:flex;align-items:center}
.uni .logo img{max-height:96px;max-width:240px}
.uni h3{font-size:30px;margin:18px 0 8px}
.uni p{font-size:15px;color:var(--muted)}
.uni .more{margin-top:22px;font-weight:600;font-size:14.5px;display:flex;gap:8px;align-items:center;color:var(--green)}
.uni.black{background:var(--night);border-color:#2a2a2a;color:#EDEAE2}
.uni.black p{color:#A8A498}
.uni.black .more{color:var(--gold2)}

/* Produits */
.products{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.prod{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;display:flex;flex-direction:column}
.prod .art{aspect-ratio:1/1.02;overflow:hidden}
.prod .art img{width:100%;height:100%;object-fit:cover;object-position:center 30%;display:block}
.prod .body{padding:16px 16px 18px;display:flex;flex-direction:column;gap:6px;flex:1}
.prod h3{font-size:25px;color:var(--green)}
.prod .comp{font-size:12.5px;color:var(--muted);min-height:36px}
.tag{display:inline-block;align-self:flex-start;font-size:11.5px;font-weight:600;padding:4px 10px;border-radius:999px;background:var(--mint);color:var(--green)}
.prod .row{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:12px}
.prod .price{font-weight:700;font-size:15px}
.prod .price small{display:block;font-weight:400;font-size:11.5px;color:var(--muted)}
.add{width:38px;height:38px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-size:22px;line-height:1}

/* Étapes */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.step{background:#fff;border-radius:20px;padding:28px;border:1px solid var(--line)}
.step .n{font-family:"Playfair",serif;font-size:44px;font-weight:700;color:var(--orange);line-height:1}
.step h3{font-size:25px;margin:10px 0 6px;color:var(--green)}
.step p{font-size:14.5px;color:var(--muted)}
.loyal{margin-top:22px;border-radius:24px;background:var(--green);color:#fff;padding:34px 40px;display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center}
.loyal h3{font-size:36px}
.loyal p{color:#CFE0C4;margin-top:8px;font-size:15px}
.stamps{display:grid;grid-template-columns:repeat(10,1fr);gap:8px}
.stamp{aspect-ratio:1;border-radius:50%;border:1.5px dashed rgba(255,255,255,.45);display:grid;place-items:center;font-size:12px;color:rgba(255,255,255,.6)}
.stamp.on{background:var(--orange);border:0;color:#3a2500;font-weight:700}
.stamp.gift{background:#fff;border:0;color:var(--green);font-weight:700}

/* Emplacements de photos et vidéos à fournir */
.ph{position:relative;border-radius:20px;overflow:hidden;background:linear-gradient(135deg,#2a2a2a,#1b1b1b);display:grid;place-items:center;color:#8f8a7c;font-size:12.5px;text-align:center;border:1px solid #2e2e2e}
.ph.light{background:linear-gradient(135deg,#ECE7DB,#F6F2E9);color:#8a8676;border-color:var(--line)}
.ph .in{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px}
.ph .play{width:54px;height:54px;border-radius:50%;border:1.5px solid currentColor;display:grid;place-items:center}
.ph .play svg{width:20px;height:20px;margin-left:3px}
.ph .cam svg{width:30px;height:30px}

/* Résidence */
.resid{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center}
.resid h2{font-size:52px;color:#fff;margin:14px 0 16px}
.feats{display:grid;grid-template-columns:1fr 1fr;gap:12px 24px;margin:26px 0 30px;font-size:14.5px;color:#D9D5CA}
.feats div{display:flex;gap:10px;align-items:center}
.feats i{width:8px;height:8px;border-radius:50%;background:var(--gold);flex:none}
.gallery{display:grid;grid-template-columns:1.25fr 1fr;grid-template-rows:230px 190px;gap:14px}
.gallery .ph:first-child{grid-row:1/3}

/* Agency */
.services{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.svc{border:1px solid #2c2c2c;border-radius:22px;overflow:hidden;background:var(--night2)}
.svc .ph{border-radius:0;border:0;height:190px}
.svc .t{padding:24px 26px 28px}
.svc h3{font-size:28px;color:#fff;margin-bottom:8px}
.svc p{font-size:14.5px;color:#A8A498}

/* Avis */
.reviews{display:grid;grid-template-columns:1fr 1fr 1fr;gap:22px}
.rev{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px}
.stars{color:var(--orange);letter-spacing:3px;font-size:15px}
.rev p{margin:12px 0 16px;font-size:15px}
.rev .who{font-size:13px;color:var(--muted)}
.score{display:flex;align-items:baseline;gap:10px}
.score b{font-family:"Playfair",serif;font-size:64px;color:var(--green);line-height:1}

/* Pied de page */
footer{background:var(--green);color:#CFE0C4;padding:64px 0 28px;font-size:14.5px}
footer .cols{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.1fr;gap:44px}
footer h4{color:#fff;font-size:13px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:16px;font-family:Inter,sans-serif;font-weight:600}
footer li{list-style:none;margin-bottom:9px}
footer .fbrand{font-family:"Playfair",serif;font-size:34px;font-weight:700;letter-spacing:.12em;color:#fff}
footer .qr{background:#fff;border-radius:16px;padding:10px;width:132px}
footer .qr img{width:100%;display:block}
footer .legal{border-top:1px solid rgba(255,255,255,.16);margin-top:44px;padding-top:20px;display:flex;justify-content:space-between;font-size:13px;color:#A9C29A}

/* Pages intérieures */
.page-hero{padding:64px 0 54px}
.page-hero h1{font-size:64px;color:var(--green);margin:14px 0 14px}
.page-hero.dark h1{color:#fff}
.chips{display:flex;gap:10px;margin-top:26px;flex-wrap:wrap}
.chip{padding:9px 16px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:14px;font-weight:500}
.chip.on{background:var(--green);color:#fff;border-color:var(--green)}
.shop{display:grid;grid-template-columns:1fr 430px;gap:34px;align-items:start}
.shop .products{grid-template-columns:repeat(3,1fr)}
.detail{background:#fff;border:1px solid var(--line);border-radius:24px;padding:26px;position:sticky;top:20px}
.detail .top{display:flex;gap:18px}
.detail .top img{width:130px;height:150px;object-fit:cover;border-radius:16px}
.detail h2{font-size:38px;color:var(--green)}
.nut{width:100%;border-collapse:collapse;font-size:13.5px;margin-top:10px}
.nut td{padding:7px 0;border-bottom:1px solid var(--line)}
.nut td:last-child{text-align:right;font-weight:600}
.qty{display:flex;align-items:center;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.qty span{width:44px;height:44px;display:grid;place-items:center;font-size:18px}
.qty b{width:36px;text-align:center}
.cartline{display:flex;gap:12px;align-items:center;margin-top:18px}
.cartline .btn{flex:1;justify-content:center}
.note{font-size:12.5px;color:var(--muted);margin-top:12px}
.apts{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.apt{border:1px solid #2c2c2c;border-radius:22px;overflow:hidden;background:var(--night2)}
.apt .ph{height:220px;border-radius:0;border:0}
.apt .t{padding:22px 24px 24px}
.apt h3{font-size:28px;color:#fff}
.apt .meta{display:flex;gap:14px;font-size:13px;color:#A8A498;margin:8px 0 16px}
.apt .foot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #2c2c2c;padding-top:16px}
.apt .foot b{color:var(--gold2);font-size:15px}
.form{background:#fff;color:var(--ink);border-radius:24px;padding:30px}
.form h3{font-size:32px;color:var(--green);margin-bottom:6px}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}
.field{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:#3d4138}
.field span.in{border:1px solid var(--line);border-radius:12px;padding:13px 14px;font-weight:400;color:#8a8676;background:var(--paper)}
.field.full{grid-column:1/3}
.split{display:grid;grid-template-columns:1.15fr .85fr;gap:44px;align-items:start}

/* Compléments : variantes claires (Agency) et sombres (Résidence) */
.agency{background:#fff}
.services.light .svc{background:#fff;border-color:var(--line)}
.services.light .svc h3{color:#282828}
.services.light .svc p{color:var(--muted)}
.ph .cam,.ph .play{color:var(--gold)}
.ph.light .cam{color:#B98A3E}
body.night{background:var(--night)}
body.night .nav{background:#fff}
.page-hero.dark{background:var(--night)}
.page-hero.dark .cta{margin-top:28px}
.chip.gold.on{background:var(--gold);border-color:var(--gold);color:#17120a}
.page-hero.agency h1{margin-top:18px}
.brand .name{line-height:1}
body{font-variant-numeric:lining-nums}
.hero h1{font-size:64px}
.ph::after{content:"";position:absolute;inset:10px;border:1px dashed rgba(223,156,59,.28);border-radius:13px;pointer-events:none}
.ph.light::after{border-color:rgba(185,138,62,.35)}
.apt .foot b{white-space:nowrap;font-size:14px}
.apt .foot .btn{padding:9px 14px;font-size:13px}

/* Titres en Playfair Display : tailles ajustées */
h1,h2,h3,.serif{font-weight:500;letter-spacing:-.015em;line-height:1.14}
.hero h1{font-size:52px}.hero h1 em{font-weight:500}
.sec-head h2,.resid h2{font-size:41px}
.page-hero h1{font-size:50px}
.uni h3{font-size:24px}.prod h3{font-size:20px}.step h3{font-size:20px}.loyal h3{font-size:28px}.svc h3{font-size:22px}
.detail h2{font-size:30px}.apt h3{font-size:22px}.form h3{font-size:25px}
.brand .name{font-size:25px;font-weight:600}footer .fbrand{font-size:28px;font-weight:600}
.step .n{font-size:38px;font-weight:600}.proof div b{font-size:24px;font-weight:600}
.uni .logo{height:110px}.uni .logo img{max-height:110px}
.uni.white .more{color:#B07A22}
footer .qrnote{font-size:12.5px;color:#A9C29A;margin-top:10px;max-width:120px}
.sec-head .lg{height:64px;margin-bottom:22px;display:block}

.lab2{font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--leaf);margin-top:18px}
.fmt{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px}
.fmt span{border:1.5px solid var(--line);border-radius:12px;padding:8px 4px;text-align:center;font-weight:700;font-size:14px;background:#fff}
.fmt span small{display:block;font-weight:500;font-size:12px;color:var(--muted)}
.fmt span.on{border-color:var(--green);background:var(--mint);color:var(--green)}
.recv{display:grid;gap:6px;margin-top:10px;padding-top:10px;border-top:1px solid #cfdcc4}
.recv label{display:flex;gap:9px;align-items:center;font-size:13.5px}
.recv i{width:16px;height:16px;border-radius:50%;border:1.5px solid #9aa79a;background:#fff;flex:none}
.recv label.on i{border:5px solid var(--green)}

/* Pied de page : mention du concepteur, discrète */
footer .legal{align-items:center;gap:20px}
footer .credit{display:inline-flex;align-items:center;gap:8px;font-size:12px;opacity:.6;letter-spacing:.02em;color:inherit;white-space:nowrap}
footer .credit img{height:14px}
/* En-tête et pied aux couleurs de chaque univers */
body.th-res .topbar,body.th-res footer{background:#0d0d0d}
body.th-res footer{color:#bdb6a8;border-top:1px solid #2a2a2a}body.th-res footer .legal{color:#8f887b;border-color:rgba(255,255,255,.1)}
body.th-res .nav .btn-green,body.th-ag .nav .btn-green{background:var(--gold);color:#17120a}
body.th-res .menu a.on,body.th-ag .menu a.on{color:#282828;box-shadow:0 2px 0 var(--gold)}
body.th-res .brand .name,body.th-ag .brand .name{color:#282828}
body.th-ag .topbar,body.th-ag footer{background:#282828}
body.th-ag footer{color:#d3cdc1}body.th-ag footer .legal{color:#a39c8f;border-color:rgba(255,255,255,.12)}
body.th-ag .topbar b,body.th-res .topbar b{color:var(--gold2)}
body.th-ag footer .qrnote,body.th-res footer .qrnote{color:#a39c8f}

.fmt{grid-template-columns:repeat(3,1fr)}
.xhead{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin:56px 0 22px}
.xhead h3{font-size:32px;color:var(--green)}.xhead p{max-width:440px;font-size:15px}
.xgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.xcard{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;display:flex;flex-direction:column}
.xcard .ph{height:150px;border-radius:0;border:0}
.xcard .b{padding:16px 18px 18px;display:flex;flex-direction:column;gap:6px;flex:1}
.xcard h3{font-size:20px;color:var(--green)}.xcard p{font-size:13px;color:var(--muted);flex:1}
.xcard .xf{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.xcard .more{font-size:13.5px;font-weight:600;color:var(--green)}
.tag.soft{background:var(--sand);color:#6b5a3a}

.pf{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-top:8px}
.pf span{border:1px solid var(--line);border-radius:8px;padding:5px 2px;text-align:center;font-size:10.5px;color:var(--muted);line-height:1.25;white-space:nowrap}
.pf span b{display:block;font-size:11.5px;color:var(--ink)}
.pf span.on{border-color:var(--green);background:var(--mint)}.pf span.on b{color:var(--green)}
.prod .row{padding-top:10px}

/* Charte de la cliente : jus = vert, orange, blanc ; résidence et agence = noir et or */
.tag.soft{background:#FFF3DF;color:#8a5a00}
.dark2{background:#0d0d0d}
.dark .step{background:#1F1F1F;border-color:#2c2c2c}.dark .step h3{color:#fff}.dark .step p{color:#A8A498}
.dark .services .svc h3{color:#fff}
body.th-res .nav,body.th-ag .nav{background:#0d0d0d;border-bottom-color:#2a2a2a}
body.th-res .menu a,body.th-ag .menu a{color:#E8E2D4}
body.th-res .menu a.on,body.th-ag .menu a.on{color:var(--gold2);box-shadow:0 2px 0 var(--gold)}
body.th-res .brand .name,body.th-ag .brand .name{color:var(--gold2)}
body.th-ag .topbar,body.th-ag footer,body.th-res .topbar,body.th-res footer{background:#0d0d0d}
body.th-ag footer{color:#bdb6a8;border-top:1px solid #2a2a2a}body.th-ag footer .legal{color:#8f887b;border-color:rgba(255,255,255,.1)}
body.th-ag footer h4,body.th-res footer h4{color:var(--gold2)}
body.th-ag .chip,body.th-res .chip{background:#fff}
.page-hero.dark.agency h1{color:#fff}

.ph.light{background:linear-gradient(135deg,#EAF2E3,#F6FAF2);color:#5f7a52;border-color:var(--line)}
.ph.light .cam{color:var(--leaf)}.ph.light::after{border-color:rgba(62,123,31,.25)}
body.th-ag .form h3,body.th-res .form h3{color:#141414}
body.th-ag .form .muted,body.th-res .form .muted{color:#6B6F66}

.rsv{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.rs{background:var(--night2);border:1px solid #2c2c2c;border-radius:22px;padding:28px 26px;display:flex;flex-direction:column}
.rs .ico{width:46px;height:46px;border-radius:50%;border:1.5px solid var(--gold);color:var(--gold2);display:grid;place-items:center;font-size:20px}
.rs h3{color:#fff;font-size:24px;margin:16px 0 8px}.rs p{color:#A8A498;font-size:14.5px;flex:1}
.rs .pr{display:flex;gap:10px;margin-top:20px}.rs .pr div{flex:1;border:1px solid #333;border-radius:14px;padding:10px 12px}
.rs .pr span{display:block;font-size:12px;color:#A8A498}.rs .pr b{color:var(--gold2);font-size:16px}


/* ───────── Site en production : éléments interactifs, médias réels, téléphone ───────── */
html{scroll-behavior:smooth}
img{max-width:100%}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
.btn,.chip,.add,.pf span,.fmt span,.qty button{cursor:pointer;transition:filter .15s,background .15s,border-color .15s,transform .1s}
.btn:hover,.add:hover{filter:brightness(1.08)}.btn:active,.add:active{transform:scale(.97)}
.btn:focus-visible,.chip:focus-visible,.add:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.pf span:focus-visible,.fmt span:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.media{position:relative;overflow:hidden;background:#111}
.media img,.media video{width:100%;height:100%;object-fit:cover;display:block}
.svc .media{height:190px}.apt .media{height:220px}.xcard .media{height:150px}.gallery .media{border-radius:20px}.gallery .media:first-child{grid-row:1/3}
.hero-media{height:400px;border-radius:20px}
.add{border:0}
.prod.cache,.ligne-prod.cache{display:none}
.prod.vedette{outline:2px solid var(--green);outline-offset:-1px}
/* Formulaires réels */
.field input,.field select,.field textarea{border:1px solid var(--line);border-radius:12px;padding:12px 14px;font:inherit;font-weight:400;font-size:15px;color:var(--ink);background:var(--paper);width:100%;min-width:0}
.field textarea{min-height:84px;resize:vertical}
.field small{font-weight:400;color:var(--muted);font-size:12px}
.chip input{position:absolute;opacity:0;pointer-events:none}
.chip:has(input:checked){background:var(--gold);border-color:var(--gold);color:#17120a}
.form .err{color:#A0321F;font-size:13px;margin-top:10px;min-height:18px}
/* Panier */
.panier{background:var(--mint);border-radius:16px;padding:16px 18px;margin-top:18px;font-size:14px}
.panier .l{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:3px 0}
.panier .l button{color:var(--muted);font-size:17px;line-height:1;padding:0 4px}
.panier .tot{display:flex;justify-content:space-between;border-top:1px solid #cfdcc4;margin-top:8px;padding-top:8px;font-weight:700}
.panier .vide{color:var(--muted)}
.recv label{cursor:pointer}.recv input{position:absolute;opacity:0}
.recv label:has(input:checked) i{border:5px solid var(--green)}
.qty button{width:44px;height:44px;display:grid;place-items:center;font-size:18px}
.flottant{position:fixed;right:18px;bottom:18px;z-index:30;box-shadow:0 12px 30px -10px rgba(0,0,0,.4);display:none}
.flottant.vu{display:inline-flex}
.flottant em{font-style:normal;background:var(--orange);color:#2b1c00;border-radius:999px;padding:1px 9px;font-size:13px}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,30px);opacity:0;background:var(--ink);color:#fff;padding:12px 18px;border-radius:12px;font-size:14px;z-index:40;transition:.25s;pointer-events:none}
.toast.vu{opacity:1;transform:translate(-50%,0)}
/* Sur commande : lignes de produits */
.lignes{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.ligne-prod{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;font-size:13.5px;border-top:1px solid var(--line);padding-top:8px}
.ligne-prod b{display:block;font-size:14px}.ligne-prod small{color:var(--muted);font-size:12px;display:block}
.ligne-prod select{border:1px solid var(--line);border-radius:8px;padding:5px 6px;font:inherit;font-size:12.5px;background:#fff;max-width:118px}
.ligne-prod .add{width:32px;height:32px;font-size:18px}
.xgrid{grid-template-columns:repeat(2,1fr)}
.xcard .b p{flex:none}
/* Navigation sur téléphone */
.burger{display:none;width:44px;height:44px;border-radius:12px;align-items:center;justify-content:center}
.burger span,.burger span::before,.burger span::after{display:block;width:20px;height:2px;background:currentColor;position:relative;content:""}
.burger span::before{position:absolute;top:-6px}.burger span::after{position:absolute;top:6px}
body.th-res .burger,body.th-ag .burger{color:#fff}
.mentions{max-width:760px}.mentions h2{font-size:26px;color:var(--green);margin:34px 0 10px}.mentions p,.mentions li{margin-bottom:8px;color:#3d4138}.mentions ul{padding-left:20px}
footer a:hover{color:#fff}
@media (max-width:1100px){
  .wrap{padding:0 24px}
  .products{grid-template-columns:repeat(3,1fr)}
  .shop{grid-template-columns:minmax(0,1fr)}.detail{position:static}
  .hero .wrap{grid-template-columns:1fr;gap:40px}
  .float.f1{left:12px}.float.f2{right:12px}
  footer .cols{grid-template-columns:1fr 1fr}
  .univers,.services,.apts,.rsv{grid-template-columns:1fr 1fr}
}
@media (max-width:820px){
  .topbar .wrap{flex-direction:column;gap:2px;text-align:center}
  .nav .wrap{height:68px}
  .menu{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;background:inherit;border-bottom:1px solid var(--line);padding:8px 24px 16px;z-index:20}
  .nav{position:relative;z-index:20}.nav.ouvert .menu{display:flex}
  body.th-res .menu,body.th-ag .menu{background:#0d0d0d}
  .menu a{padding:12px 0;border-bottom:1px solid rgba(127,127,127,.15)}.menu a.on{box-shadow:none}
  .burger{display:inline-flex}
  .nav .btn-sm{display:none}
  section{padding:60px 0}
  .sec-head,.xhead{flex-direction:column;align-items:flex-start;gap:12px}
  .sec-head h2,.resid h2{font-size:32px}
  .hero h1{font-size:40px}.page-hero h1{font-size:38px}
  .cta{flex-wrap:wrap}
  .proof{flex-wrap:wrap;gap:20px}
  .univers,.services,.apts,.rsv,.steps,.reviews,.xgrid,.split,.resid,.loyal{grid-template-columns:minmax(0,1fr)}
  .split>*,.resid>*{min-width:0}
  .shop .products,.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .gallery{grid-template-columns:1fr;grid-template-rows:auto}.gallery .ph,.gallery .media{height:220px}.gallery .ph:first-child,.gallery .media:first-child{grid-row:auto}
  .page-hero .wrap{flex-direction:column;align-items:flex-start!important}
  .page-hero .wrap>img{height:110px!important}
  .hero-media,.page-hero .ph{height:240px!important}
  .fields{grid-template-columns:minmax(0,1fr)}.field.full{grid-column:auto}
  .loyal{padding:26px 22px}.stamps{gap:5px}
  footer .cols{grid-template-columns:1fr}
  footer .legal{flex-direction:column;align-items:flex-start}
  .float{display:none}
  .detail .top img{width:96px;height:110px}
}
@media (max-width:420px){.shop .products,.products{grid-template-columns:minmax(0,1fr)}.prod .art{aspect-ratio:4/3}.prod .art img{object-position:center 12%}}
.topbar b{white-space:nowrap}
.ligne-prod select{max-width:150px}
.rs .pr{flex-wrap:wrap}
.form,.field,.detail{min-width:0}
.field input,.field select,.field textarea{max-width:100%;box-sizing:border-box}
input[type=date]{min-width:0;-webkit-appearance:none;appearance:none;min-height:46px}
@media (max-width:820px){.cartline .btn{white-space:normal;text-align:center;line-height:1.3}.form{padding:22px 18px}}
.chip{position:relative}.field .chip input,.chip input{width:1px;height:1px;padding:0;border:0}

/* ───────── Animations (discrètes, désactivées si l'appareil demande moins de mouvement) ───────── */
@media (prefers-reduced-motion:no-preference){
  /* Apparition au défilement : uniquement quand le script est actif (sans script, tout reste visible) */
  html.anim .rv{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.7,.2,1) var(--d,0s),transform .7s cubic-bezier(.2,.7,.2,1) var(--d,0s)}
  html.anim .rv.vu{opacity:1;transform:none}
  /* Bandeau d'accueil à l'ouverture */
  .hero .eyebrow,.hero h1,.hero .lead,.hero .cta,.hero .proof,.page-hero .eyebrow,.page-hero h1,.page-hero p,.page-hero .cta,.page-hero .chips{animation:monte .8s cubic-bezier(.2,.7,.2,1) both}
  .hero h1,.page-hero h1{animation-delay:.08s}.hero .lead,.page-hero p{animation-delay:.16s}.hero .cta,.page-hero .cta,.page-hero .chips{animation-delay:.24s}.hero .proof{animation-delay:.32s}
  .hero-visual .photo{animation:zoom 1.1s cubic-bezier(.2,.7,.2,1) both .1s}
  .float{animation:flotte 6s ease-in-out infinite}.float.f1{animation-delay:-3s}
  @keyframes monte{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
  @keyframes zoom{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
  @keyframes flotte{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
  /* Cartes : légère élévation au survol, image qui s'approche */
  .prod,.uni,.svc,.apt,.xcard,.rs,.step,.rev{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s}
  .prod:hover,.uni:hover,.svc:hover,.apt:hover,.xcard:hover,.rs:hover,.step:hover{transform:translateY(-6px);box-shadow:0 22px 40px -24px rgba(28,63,6,.35)}
  .dark .svc:hover,.dark .apt:hover,.dark .rs:hover,.uni.black:hover{box-shadow:0 22px 40px -22px rgba(0,0,0,.8);border-color:rgba(223,156,59,.45)}
  .prod .art img,.media img,.hero-visual .photo img{transition:transform .8s cubic-bezier(.2,.7,.2,1)}
  .prod:hover .art img,.svc:hover .media img,.apt:hover .media img,.xcard:hover .media img,.gallery .media:hover img{transform:scale(1.06)}
  .uni .more,.xcard .more{transition:gap .25s,letter-spacing .25s}.uni:hover .more{gap:14px}
  .uni .logo img{transition:transform .5s cubic-bezier(.2,.7,.2,1)}.uni:hover .logo img{transform:scale(1.05)}
  .ph .play{transition:transform .3s,background .3s}.ph:hover .play{transform:scale(1.1);background:rgba(223,156,59,.12)}
  /* Liens du menu : soulignement qui se dessine */
  .menu a{position:relative}
  .menu a:not(.on)::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .3s}
  body.th-res .menu a:not(.on)::after,body.th-ag .menu a:not(.on)::after{background:var(--gold)}
  .menu a:hover::after{transform:scaleX(1)}
  /* Boutons */
  .btn{transition:transform .2s,box-shadow .25s,filter .2s,background .2s}
  .btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px -12px rgba(0,0,0,.45)}
  .btn-ghost:hover,.btn-line-gold:hover{border-color:currentColor}
  .add{transition:transform .2s,box-shadow .2s}.add:hover{transform:scale(1.1) rotate(90deg)}
  .add.ok{animation:pop .45s}
  .flottant.bump{animation:pop .45s}
  @keyframes pop{0%{transform:scale(1)}40%{transform:scale(1.22)}100%{transform:scale(1)}}
  .chip{transition:background .2s,border-color .2s,color .2s,transform .2s}.chip:hover{transform:translateY(-1px);border-color:var(--leaf)}
  .pf span:hover,.fmt span:hover{border-color:var(--leaf)}
  /* Carte de fidélité : les tampons se remplissent un à un */
  html.anim .stamps.rv .stamp.on{transform:scale(0);transition:transform .45s cubic-bezier(.3,1.6,.5,1) calc(.2s + var(--i) * .09s)}
  html.anim .stamps.rv.vu .stamp.on{transform:scale(1)}
  /* Panier : nouvelle ligne */
  .panier .l{animation:monte .35s both}
  /* En-tête qui reste visible au défilement */
  .nav{position:sticky;top:0;z-index:25;transition:box-shadow .3s,background .3s}
  .nav.ombre{box-shadow:0 8px 24px -16px rgba(0,0,0,.35)}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ───────── Page de liens (derrière le code QR) */
body.liens{background:var(--green);color:#fff;min-height:100vh;min-height:100dvh}
.lwrap{max-width:460px;margin:0 auto;padding:44px 20px calc(28px + env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center}
.llogo{width:120px;height:120px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 16px 40px -18px rgba(0,0,0,.6)}
.llogo img{width:84px;height:84px;object-fit:contain}
.liens h1{font-size:40px;letter-spacing:.14em;margin-top:22px;font-weight:700}
.lsous{color:#CFE0C4;text-align:center;margin-top:6px;font-size:15.5px;line-height:1.5}
.llist{display:grid;gap:12px;width:100%;margin-top:30px}
.lk{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 18px;border-radius:18px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.2);transition:transform .15s ease,background .15s ease}
.lk:hover,.lk:focus-visible{background:rgba(255,255,255,.15);transform:translateY(-1px)}
.lk b{display:block;font-size:16.5px;font-weight:600}
.lk small{display:block;color:#CFE0C4;font-size:13.5px;margin-top:2px}
.lk svg{width:20px;height:20px;flex:none;opacity:.85}
.lk.wa{background:var(--orange);border-color:var(--orange);color:#231600}
.lk.wa small{color:#4a3000}
.lk.wa:hover{background:#f6a826}
.lsoc{display:flex;flex-wrap:wrap;gap:10px}
.lsoc .soc{flex:1 1 30%}
.soc{display:flex;flex-direction:column;justify-content:center;text-align:center;padding:12px 6px;border-radius:16px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.2);font-weight:600;font-size:15px}
.soc:hover{background:rgba(255,255,255,.15)}
.soc b{font-weight:600}.soc small{color:#CFE0C4;font-size:12.5px;font-weight:500;margin-top:1px}
.lzeny{margin-top:30px;font-size:12.5px;color:rgba(255,255,255,.55);display:flex;align-items:center;gap:7px}
.lzeny img{opacity:.7}
@media (prefers-reduced-motion:reduce){.lk{transition:none}.lk:hover{transform:none}}

/* ───────── Carte à imprimer (A6) */
body.carteqr{background:#EFEBE3;display:flex;flex-direction:column;align-items:center;padding:30px 16px}
.cq{width:105mm;min-height:148mm;background:#fff;border-radius:6mm;padding:9mm 8mm;display:flex;flex-direction:column;align-items:center;text-align:center;box-shadow:0 20px 50px -30px rgba(0,0,0,.4)}
.cqlogo{width:30mm;height:auto}
.cq h1{color:var(--green);font-size:25pt;margin-top:4mm}
.cq p{color:var(--muted);font-size:10pt;margin-top:2.5mm;line-height:1.4}
.cqcode{width:48mm;height:48mm;margin-top:6mm;padding:3mm;border:.6mm solid var(--green);border-radius:4mm}
.cqcode svg{width:100%;height:100%;display:block}
.cq p.cqurl{color:var(--green);font-weight:600;font-size:9.5pt;margin-top:2.5mm;letter-spacing:.02em}
.cqtags{display:flex;flex-wrap:wrap;justify-content:center;gap:2mm;margin-top:4mm}
.cqtags span{background:var(--mint);color:var(--green);font-weight:600;font-size:8.5pt;padding:1.2mm 3mm;border-radius:99px}
.cqaide{margin-top:16px;color:var(--muted);font-size:13px;max-width:420px;text-align:center}
@page{size:105mm 148mm;margin:0}
@media print{body.carteqr{background:#fff;padding:0}.cq{box-shadow:none;border-radius:0}.cqaide{display:none}}

/* Petits écrans (≤ 380 px) : les boutons longs passent à la ligne au lieu de déborder */
@media (max-width:400px){.btn{white-space:normal;text-align:center;max-width:100%}}
@media screen and (max-width:440px){body.carteqr{padding:16px 8px}.cq{width:100%;min-height:0;padding:7mm 5mm}.cqcode{width:min(48mm,62vw);height:min(48mm,62vw)}}
/* Jus en images : mosaïque (vidéo verticale, photos de la cliente) */
.mosaique{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:250px;grid-auto-flow:dense;gap:14px}
.mosaique .media,.mosaique .ph{border-radius:18px;height:auto}
.mosaique .m-haut{grid-row:span 2}.mosaique .m-large{grid-column:span 2}
.mosaique .m-video{background:#0d0d0d}.mosaique .m-video video{object-fit:cover}
.mosaique .media img{transition:transform .8s cubic-bezier(.2,.7,.2,1)}.mosaique .media:hover img{transform:scale(1.04)}
/* Stand de Bonanjo (accueil) */
.stand-bloc{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px;align-items:center}
.stand-bloc .stand-photo{border-radius:22px;aspect-ratio:1/1;max-height:560px;height:auto}
.stand-bloc h2{margin:8px 0 12px}
.stand-adr{display:flex;gap:10px;align-items:flex-start;margin:18px 0 10px;font-weight:600}.stand-adr svg{width:20px;height:20px;flex:none;color:var(--green);margin-top:2px}
.horaires{list-style:none;padding:0;margin:0 0 22px;border-top:1px solid var(--line)}
.horaires li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:15px}.horaires b{font-weight:600}
@media (max-width:820px){
  .mosaique{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:190px;gap:10px}
  .stand-bloc{grid-template-columns:minmax(0,1fr);gap:24px}
}
.mosaique .m-bas img{object-position:center 88%}
/* Vidéo en boucle (sans son) à la place du logo, en tête de la page des jus */
.hero-boucle{flex:none;width:420px;aspect-ratio:16/9;border-radius:22px;box-shadow:0 18px 40px rgba(28,63,6,.18)}
@media (max-width:820px){.hero-boucle{display:none}}
/* Commande envoyée directement depuis le site */
.envois{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.envois .btn{width:100%;justify-content:center}
.envois .btn[aria-disabled="true"]{opacity:.45;cursor:not-allowed}
.envois .btn.actif{box-shadow:0 0 0 3px rgba(28,63,6,.18)}
.p-form{margin-top:16px;padding:16px;border:1px solid var(--line);border-radius:16px;background:#fff;display:flex;flex-direction:column;gap:12px}
.p-form .field{display:flex;flex-direction:column;gap:6px;font-size:13.5px;font-weight:600;margin:0}
.p-form .field small{font-weight:500;color:var(--muted)}
.p-form input,.p-form select,.p-form textarea{font:inherit;font-weight:500;font-size:15px;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;width:100%;min-width:0;color:inherit}
.p-form input:focus,.p-form select:focus,.p-form textarea:focus{outline:2px solid var(--green);outline-offset:1px;border-color:transparent}
.p-form #p-livr{display:flex;flex-direction:column;gap:12px}.p-form #p-livr[hidden]{display:none}
.p-titre{font-size:15px}
.p-jus{display:flex;flex-direction:column;gap:6px;padding:10px 12px;background:#F4F8EE;border-radius:12px;font-size:13.5px}
.piege{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.p-erreur{margin:0;padding:10px 12px;border-radius:10px;background:#FFF1E6;color:#8A3B00;font-size:14px;font-weight:600}
.p-form .btn{width:100%;justify-content:center}.p-form .btn:disabled{opacity:.6;cursor:wait}
.p-ok{margin-top:16px;padding:18px;border-radius:16px;background:#EEF6E6;border:1px solid #CFE2BD;display:flex;flex-direction:column;gap:8px;outline:none}
.p-ok .p-titre{color:var(--green);font-size:17px}.p-ok p{margin:0}.p-ok .p-tot{font-weight:700}.p-ok .btn{align-self:flex-start;margin-top:4px}
.p-form[hidden],.p-ok[hidden],.p-erreur[hidden]{display:none}
/* Safand Residence : vidéo verticale de présentation, visites en vidéo, visuel de marque en attendant les photos */
.hero-portrait{width:min(100%,360px);aspect-ratio:3/4;height:auto!important;margin-left:auto;border-radius:24px;box-shadow:0 24px 60px rgba(0,0,0,.5)}
.visites{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.visites figure{margin:0}
.visites .media{aspect-ratio:9/16;border-radius:20px;border:1px solid #2c2c2c}
.visites figcaption{margin-top:12px;color:#D9D5CA;font-size:14.5px;font-weight:600}
.apt-marque{height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:radial-gradient(circle at 50% 35%,#2a2418,#141414 70%);border-bottom:1px solid #2c2c2c}
.apt-marque img{height:84px;opacity:.9}.apt-marque span{color:#A8A498;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase}
/* Safand Agency : photos des équipes, grille tarifaire du protocole */
.media.pos-haut img{object-position:center 18%}
.lien-tarifs{display:inline-block;margin-top:10px;color:var(--gold2);font-weight:600;font-size:14px;text-decoration:none}
.tarifs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.tarif{border:1px solid #3a3222;border-radius:20px;padding:26px 24px;background:linear-gradient(180deg,#1c1a15,#141414);display:flex;flex-direction:column;gap:10px}
.tarif .duree{font-family:"Playfair Display",serif;font-size:30px;color:#fff}
.tarif b{color:var(--gold2);font-size:22px}
.tarif p{color:#A8A498;font-size:14.5px;margin:0;flex:1}
.tarif .btn{align-self:flex-start;margin-top:6px}
.notes-tarifs{margin:24px 0 0;padding:0;list-style:none;display:grid;gap:8px;color:#A8A498;font-size:14px}
.notes-tarifs li{padding-left:22px;position:relative}.notes-tarifs li::before{content:"";position:absolute;left:4px;top:.55em;width:7px;height:7px;border-radius:50%;background:var(--gold)}
@media (max-width:820px){
  .visites{grid-template-columns:repeat(3,minmax(220px,1fr));overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}
  .visites figure{scroll-snap-align:start}
  .tarifs{grid-template-columns:minmax(0,1fr)}
  .hero-portrait{margin:8px auto 0}
}
/* Accueil : photo des hôtesses cadrée sur les visages ; bouton vers Safand Agency */
.media.pos-visages img{object-position:center 8%}
.plus-agency{margin-top:28px;text-align:center}

/* ───────── Safand Ice (glaçons) : bleu royal et cyan du logo, blanc givré */
:root{--ice:#1238C9;--ice2:#16A6E6;--ice3:#7FD6F7;--ice-nuit:#0A1F5C;--givre:#EEF7FF;--givre2:#DCEFFF}
.btn-ice{background:linear-gradient(135deg,var(--ice),#1E5BE0);color:#fff;box-shadow:0 10px 24px -12px rgba(18,56,201,.7)}
.btn-ice-line{border-color:rgba(18,56,201,.35);color:var(--ice);background:#fff}
body.th-ice .topbar,body.th-ice footer{background:var(--ice-nuit)}
body.th-ice .topbar b{color:var(--ice3)}
body.th-ice footer{color:#BFD3F2}body.th-ice footer h4{color:var(--ice3)}body.th-ice footer .legal{color:#8EA6CF;border-color:rgba(255,255,255,.12)}
body.th-ice .brand .name{color:var(--ice)}
body.th-ice .menu a.on{color:var(--ice);box-shadow:0 2px 0 var(--ice2)}
body.th-ice .nav .btn-green,body.th-ice .flottant{background:var(--ice)}
body.th-ice .eyebrow{color:var(--ice2)}
body.th-ice .sec-head h2,body.th-ice .ice-h2{color:var(--ice-nuit)}
body.th-ice .chip:has(input:checked){background:var(--ice);border-color:var(--ice);color:#fff}
.ice-hero{position:relative;overflow:hidden;background:radial-gradient(1100px 520px at 85% 10%,#D3ECFF 0,rgba(211,236,255,0) 60%),linear-gradient(180deg,#F5FBFF,var(--givre))}
.ice-hero .wrap{position:relative}
.ice-hero h1{color:var(--ice-nuit);font-size:62px;margin:14px 0 18px}
.ice-hero h1 em{font-style:italic;font-weight:500;color:var(--ice2)}
.ice-hero .lead{font-size:18px;color:#34466E;max-width:540px}
.ice-logo{display:block;width:150px;height:auto;margin-bottom:18px;filter:drop-shadow(0 10px 18px rgba(18,56,201,.18))}
.flocons{position:absolute;inset:0;pointer-events:none;opacity:.55;background-image:radial-gradient(circle,rgba(127,214,247,.55) 1.5px,transparent 2px),radial-gradient(circle,rgba(18,56,201,.18) 1px,transparent 1.5px);background-size:46px 46px,29px 29px;background-position:0 0,13px 17px;mask-image:linear-gradient(90deg,transparent 0,#000 55%)}
.ice-visuel{position:relative}
.ice-ph.ph,.ice-ph.media{border-radius:28px;overflow:hidden}
.ice-ph.ph{background:linear-gradient(150deg,#E4F4FF 0,#C6E6FF 55%,#A8D8FB 100%);border:1px solid #CBE5FA;color:#3A5B8C}
.ice-ph.ph::after{border-color:rgba(18,56,201,.25)}
.ice-ph.ph .cam{color:var(--ice)}
.ice-ph.ph::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,rgba(255,255,255,.65) 0,rgba(255,255,255,0) 38%,rgba(255,255,255,0) 62%,rgba(255,255,255,.35) 100%);pointer-events:none}
.ice-photo{height:470px;box-shadow:0 40px 70px -40px rgba(10,31,92,.55)}
.ice-photo img,.ice-machine img{width:100%;height:100%;object-fit:cover}
.ice-float{left:-30px;bottom:40px}.ice-float .dot{background:var(--givre2);color:var(--ice)}
.ice-sec{background:#fff}
.ice-pale{background:var(--givre)}
.ice-usages{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.ice-usage{border:1px solid #DCE9F7;border-radius:24px;padding:30px;background:linear-gradient(180deg,#fff,#F7FBFF);transition:transform .25s,box-shadow .25s}
.ice-usage:hover{transform:translateY(-4px);box-shadow:0 22px 40px -28px rgba(18,56,201,.45)}
.ice-usage h3{font-size:25px;color:var(--ice-nuit);margin:18px 0 8px}
.ice-usage p{font-size:14.5px;color:#5A6A86}
.ico-ice{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--ice2),var(--ice));flex:none;box-shadow:0 10px 20px -12px rgba(18,56,201,.8)}
.ico-ice svg{width:26px;height:26px}
.ice-sombre{background:linear-gradient(160deg,var(--ice-nuit) 0,#0E2E86 100%);color:#DCE8FA}
.ice-sombre h2{color:#fff;font-size:46px;margin:12px 0 14px}
.ice-sombre .eyebrow{color:var(--ice3)}
.ice-sombre .muted{color:#AFC3E6}
.ice-prod{grid-template-columns:1fr 1fr;align-items:center;gap:56px}
.ice-machine{height:460px}
.ice-sombre .ice-ph.ph{background:linear-gradient(150deg,#16388F,#0F2C78);border-color:#2A4CA6;color:#AFC3E6}
.ice-sombre .ice-ph.ph .cam{color:var(--ice3)}.ice-sombre .ice-ph.ph::after{border-color:rgba(127,214,247,.35)}
.ice-points{list-style:none;display:grid;gap:18px;margin-top:28px}
.ice-points li{display:flex;gap:14px;align-items:flex-start}
.ice-points li>svg{width:24px;height:24px;color:var(--ice3);flex:none;margin-top:2px}
.ice-points b{display:block;color:#fff;font-size:16px}
.ice-points span{font-size:14.5px;color:#AFC3E6}
.ice-devis{display:flex;gap:24px;align-items:center;border-radius:26px;padding:30px 34px;background:linear-gradient(135deg,var(--givre),#fff);border:1px solid #D3E6F8}
.ice-devis h3{font-size:28px;color:var(--ice-nuit);margin-bottom:6px}
.ice-devis p{color:#5A6A86;font-size:15px;max-width:640px}
.ice-devis .btn{margin-left:auto}
.ice-formats{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}
.ice-format{border:1px solid #DCE9F7;border-radius:22px;padding:26px;display:flex;flex-direction:column;gap:10px;background:#fff}
.ice-format h3{font-size:23px;color:var(--ice-nuit);margin-top:6px}
.ice-format p{font-size:14px;color:#5A6A86}
.ice-format b{font-size:22px;color:var(--ice)}
.ice-format .btn{align-self:flex-start;margin-top:auto}
.ice-steps{grid-template-columns:1fr;gap:14px;margin-top:26px}
.ice-steps .step{display:flex;gap:18px;align-items:center;padding:20px 22px;border-color:#D3E6F8}
.ice-steps .step .n{color:var(--ice2)}
.ice-steps .step h3{color:var(--ice-nuit);margin:0 0 2px}
.ice-conseil{margin-top:26px;border-radius:22px;padding:24px 26px;background:#fff;border:1px dashed #A9CDEE}
.ice-conseil h3{font-size:21px;color:var(--ice-nuit);display:flex;gap:10px;align-items:center;margin-bottom:10px}
.ice-conseil h3 svg{width:22px;height:22px;color:var(--ice2)}
.ice-conseil ul{padding-left:18px;color:#4A5B78;font-size:14.5px;display:grid;gap:6px}
.ice-form{border:1px solid #D3E6F8;box-shadow:0 30px 60px -40px rgba(10,31,92,.45)}
.ice-form h3{color:var(--ice-nuit)}
.ice-form .field input:focus,.ice-form .field select:focus{outline:2px solid var(--ice3);border-color:var(--ice2)}
.ice-recv{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}
.ice-jus{padding-top:0}
.ice-bandeau{display:flex;gap:26px;align-items:center;border-radius:26px;padding:24px 30px;background:var(--sand);border:1px solid var(--line)}
.ice-bandeau img{height:76px}
.ice-bandeau h3{font-size:26px;color:var(--green)}
.ice-bandeau p{color:var(--muted);font-size:14.5px}
.ice-bandeau .btn{margin-left:auto}
/* Carte de l'accueil */
@media (min-width:1101px){.univers{grid-template-columns:repeat(4,minmax(0,1fr))}.uni{padding:30px 26px}.uni h3{font-size:24px}}
.uni.ice{background:linear-gradient(170deg,#F2F9FF 0,#DDEFFF 100%);border-color:#CFE4F8}
.uni.ice h3{color:var(--ice-nuit)}.uni.ice p{color:#4D6083}.uni.ice .more{color:var(--ice)}
@media (max-width:1100px){.ice-usages{grid-template-columns:1fr 1fr}.ice-hero h1{font-size:50px}}
@media (max-width:820px){
  .ice-usages,.ice-prod{grid-template-columns:minmax(0,1fr)}
  .ice-hero h1{font-size:38px}.ice-sombre h2{font-size:32px}
  .ice-logo{width:116px}
  .ice-photo{height:300px}.ice-machine{height:280px}
  .ice-devis,.ice-bandeau{flex-direction:column;align-items:flex-start;padding:24px}
  .ice-devis .btn,.ice-bandeau .btn{margin-left:0}
}
.field[hidden]{display:none}
.ice-h2{font-size:42px;margin:12px 0 4px}
.ice-sombre .ice-ph.ph::before{background:linear-gradient(115deg,rgba(255,255,255,.12) 0,rgba(255,255,255,0) 40%)}
@media (max-width:820px){.ice-h2{font-size:30px}}

/* Safand Ice : finitions */
.ice-hero{padding-bottom:110px}
.ice-lueurs{position:absolute;inset:0;pointer-events:none;background:radial-gradient(420px 320px at 12% 18%,rgba(127,214,247,.28),transparent 70%),radial-gradient(520px 380px at 78% 62%,rgba(18,56,201,.10),transparent 70%),radial-gradient(300px 220px at 92% 8%,rgba(22,166,230,.20),transparent 70%)}
.ice-etincelles{position:absolute;inset:0;pointer-events:none}
.ice-etincelles i{position:absolute;width:16px;height:16px;transform:scale(var(--s));opacity:.75;clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);background:radial-gradient(circle,#fff 0 22%,rgba(127,214,247,.95) 45%,rgba(22,166,230,.5) 75%)}
@media (prefers-reduced-motion:no-preference){.ice-etincelles i{animation:scintille 3.6s ease-in-out var(--t) infinite}}
@keyframes scintille{0%,100%{opacity:.2;transform:scale(calc(var(--s) * .6)) rotate(0)}50%{opacity:1;transform:scale(var(--s)) rotate(45deg)}}
.ice-vague{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:70px;display:block}
.ice-vague path{fill:#fff}
.ice-sombre{position:relative;padding-top:130px}
.ice-vague.v-haut{top:-1px;bottom:auto;transform:scaleY(-1)}
.ice-logo-fond{display:grid;place-items:center;width:178px;height:178px;border-radius:50%;margin-bottom:20px;background:radial-gradient(circle at 35% 30%,#fff 0,rgba(255,255,255,.9) 48%,rgba(220,239,255,.55) 68%,rgba(220,239,255,0) 71%)}
.ice-logo-fond .ice-logo{width:150px;margin:0;filter:drop-shadow(0 8px 14px rgba(18,56,201,.22))}
.ice-cadre{position:relative;padding:10px;border-radius:36px;background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(214,236,255,.6));border:1px solid rgba(255,255,255,.9);box-shadow:0 40px 80px -46px rgba(10,31,92,.6),inset 0 1px 0 #fff}
.ice-cadre .ice-photo{box-shadow:none}
.ice-cadre-sombre{background:linear-gradient(145deg,rgba(127,214,247,.22),rgba(18,56,201,.15));border-color:rgba(127,214,247,.28);box-shadow:0 40px 80px -40px rgba(0,0,0,.6)}
.ice-cadre .media{position:relative}
.ice-cadre .media::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,transparent 60%,rgba(10,31,92,.28));pointer-events:none}
.ice-float{left:-22px;bottom:46px;border:1px solid #E1EEFB}
.btn-ice,.btn-ice-line{transition:transform .2s,box-shadow .2s,background .2s}
.btn-ice:hover{transform:translateY(-2px);box-shadow:0 16px 30px -14px rgba(18,56,201,.8)}
.btn-ice-line:hover{background:var(--givre);border-color:var(--ice2)}
.ice-usage{position:relative;overflow:hidden}
.ice-usage::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--ice2),var(--ice));transform:scaleX(0);transform-origin:left;transition:transform .35s}
.ice-usage:hover::before{transform:scaleX(1)}
.ice-steps .step .n{flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font-size:26px;background:linear-gradient(135deg,var(--givre),#fff);border:1px solid #CFE4F8;color:var(--ice)}
.ice-sec .sec-head p{color:#5A6A86}
.ice-pale{background:linear-gradient(180deg,var(--givre),#F7FBFF)}
@media (max-width:820px){.ice-hero{padding-bottom:80px}.ice-sombre{padding-top:96px}.ice-logo-fond{width:136px;height:136px}.ice-logo-fond .ice-logo{width:112px}.ice-cadre{padding:7px;border-radius:28px}.ice-etincelles i:nth-child(n+5){display:none}}

/* ───────── Finitions de tout le site */
[id]{scroll-margin-top:100px}
::selection{background:rgba(242,155,9,.28)}
.uni .logo img{max-width:100%;object-fit:contain;object-position:left center}
.field>span{display:block}.field>span small{font-weight:400}
/* Visuel d'attente (photo pas encore reçue) : sobre, aux couleurs de l'univers */
.ph::after{display:none}
.ph .in{gap:12px}
.ph-ico{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:rgba(223,156,59,.12);color:var(--gold);border:1px solid rgba(223,156,59,.3)}
.ph-ico svg{width:26px;height:26px}
.ph-leg{font-family:"Playfair",Georgia,serif;font-style:italic;font-size:15px;max-width:240px;line-height:1.35;color:#B7AE9C}
.ph{background:radial-gradient(120% 90% at 20% 0,#2c2a25 0,#1b1b1b 60%)}
.ph.light{background:radial-gradient(120% 90% at 20% 0,#F4F9EF 0,#E6F0DD 70%)}
.ph.light .ph-ico{background:#fff;color:var(--leaf);border-color:#D5E5C8}
.ph.light .ph-leg{color:#4E6B41}
.ice-ph.ph .ph-ico{background:rgba(255,255,255,.75);color:var(--ice);border-color:#CBE5FA}
.ice-ph.ph .ph-leg{color:#2E4E86}
.ice-sombre .ice-ph.ph .ph-ico{background:rgba(127,214,247,.14);color:var(--ice3);border-color:rgba(127,214,247,.35)}
.ice-sombre .ice-ph.ph .ph-leg{color:#C6D6F1}
.ph .ph-ico .play-ico,.ph-ico svg[fill=currentColor]{margin-left:3px}
/* Bande Safand Ice de l'accueil */
.ice-accueil{padding:70px 0;background:linear-gradient(180deg,#0d0d0d 0,#0d0d0d 50%,#fff 50%)}
.ice-bande{display:flex;align-items:center;gap:34px;padding:34px 40px;border-radius:30px;background:radial-gradient(600px 300px at 90% 0,rgba(127,214,247,.35),transparent 70%),linear-gradient(135deg,#F3FAFF,#DDEFFF);border:1px solid #CFE4F8;box-shadow:0 40px 80px -50px rgba(10,31,92,.6);transition:transform .25s,box-shadow .25s}
.ice-bande:hover{transform:translateY(-3px);box-shadow:0 46px 90px -50px rgba(10,31,92,.7)}
.ice-bande img{width:132px;height:auto;flex:none;filter:drop-shadow(0 8px 14px rgba(18,56,201,.2))}
.ice-bande .eyebrow{color:var(--ice2)}
.ice-bande h2{font-size:34px;color:var(--ice-nuit);margin:8px 0 8px}
.ice-bande p{color:#4D6083;font-size:15px;max-width:620px}
.ice-bande .btn{margin-left:auto;flex:none}
@media (max-width:820px){.ice-bande{flex-direction:column;align-items:flex-start;padding:26px}.ice-bande h2{font-size:27px}.ice-bande .btn{margin-left:0;white-space:normal}.ice-bande img{width:100px}}
/* Page de liens : logos des univers */
.lk.avec-logo{justify-content:flex-start}
.lk.avec-logo>span{flex:1}
.lk-logo{width:46px;height:46px;border-radius:12px;background:#fff;display:grid;place-items:center;flex:none;overflow:hidden;box-shadow:0 4px 10px -6px rgba(0,0,0,.4)}
.lk-logo img{max-width:40px;max-height:40px;object-fit:contain}
.lk-logo:has(img[src*="logo-residence"]),.lk-logo:has(img[src*="logo-agency"]){background:#141414}
.lk-logo.lettre{background:linear-gradient(145deg,#1d1d1d,#0d0d0d);color:var(--gold2);font:600 24px/1 "Playfair",Georgia,serif;font-style:normal;border:1px solid rgba(223,156,59,.45)}
.lk-logo.lettre::before{content:attr(data-l)}
/* Photo du distributeur (format portrait) */
.ice-machine.media{height:auto;aspect-ratio:967/1280;max-height:720px}
.ice-machine.media img{object-position:center 30%}
.ice-prod{align-items:center}