/* Window Film Solution — feuille de style du site */
:root{
  --paper:#F7F9FA; --white:#FFFFFF; --ink:#0D1518; --muted:#5C6B72;
  --hair:#E3E9EB; --hair-d:rgba(234,242,244,.20); --wash:#EDF5F7;
  --deep:#0B2E37; --tint:#0E6A80; --tint-br:#1E8FA8; --tint-lt:#6FD3E8;
  --cream:#EAF2F4;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:"Manrope",-apple-system,"Segoe UI",sans-serif;
  font-size:17px;line-height:1.62;font-weight:400;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{display:block;max-width:100%}
p{margin:0}
figure{margin:0}
blockquote{margin:0}
button{font-family:inherit}
a{color:inherit;text-decoration:none}
h1,h2,h3{margin:0;font-weight:500}

.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--ink);color:#fff;
  padding:14px 22px;border-radius:0 0 4px 0}
.skip:focus{left:0}

.wrap{width:100%;max-width:1320px;margin:0 auto;padding-inline:48px}
.sec{padding-block:140px}
.sec-s{padding-block:96px}
.band{background:var(--white);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.dark{background:var(--deep);color:var(--cream)}

.lab{font-size:11.5px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:14px;color:var(--tint)}
.lab::before{content:"";width:28px;height:1px;background:currentColor;display:block}
.lab.on-dark{color:var(--tint-lt)}

.h2{font-family:"Instrument Serif",Georgia,serif;font-weight:400;letter-spacing:-.018em;
  line-height:1.02;font-size:clamp(38px,5vw,74px);margin:24px 0 0}
.h2 em{font-style:italic;color:var(--tint)}
.h2.on-dark{color:var(--cream)}
.h2.on-dark em{color:var(--tint-lt)}
.lede{font-size:19px;color:var(--muted);max-width:56ch;margin-top:26px;font-weight:300}
.lede.on-dark{color:rgba(234,242,244,.72)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;font-size:14px;
  font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:17px 30px;min-height:54px;
  border:0;border-radius:999px;cursor:pointer;
  transition:transform .25s cubic-bezier(.2,.7,.3,1),background .25s ease,color .25s ease,box-shadow .25s ease}
.btn-ink{background:var(--ink);color:var(--paper)}
.btn-ink:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(13,21,24,.26)}
.btn-lt{background:var(--cream);color:var(--deep)}
.btn-lt:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(0,0,0,.28)}
.btn-line{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px rgba(13,21,24,.24)}
.btn-line:hover{box-shadow:inset 0 0 0 1px var(--ink);transform:translateY(-3px)}
.btn-line.on-dark{color:var(--cream);box-shadow:inset 0 0 0 1px rgba(234,242,244,.32)}
.btn-line.on-dark:hover{box-shadow:inset 0 0 0 1px var(--cream)}
.btn-sm{padding:12px 22px;min-height:46px;font-size:12.5px}
:focus-visible{outline:2px solid var(--tint);outline-offset:3px}

@keyframes rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@supports (animation-timeline: view()){
  .rv{animation:rise .01s linear both;animation-timeline:view();animation-range:entry 4% cover 26%}
  .rv-f{animation:fade .01s linear both;animation-timeline:view();animation-range:entry 2% cover 24%}
}
@keyframes intro{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:translateY(0)}}
.in{animation:intro 1s cubic-bezier(.2,.75,.25,1) both}
.i1{animation-delay:.12s}.i2{animation-delay:.26s}.i3{animation-delay:.4s}.i4{animation-delay:.54s}

/* header */
.hdr{position:sticky;top:0;z-index:70;background:rgba(247,249,250,.86);
  backdrop-filter:blur(14px);border-bottom:1px solid var(--hair)}
.hdr-in{display:flex;align-items:center;gap:30px;height:84px}
.mark{display:flex;flex-direction:column;line-height:1}
.mark b{font-family:"Instrument Serif",Georgia,serif;font-size:23px;font-weight:400;letter-spacing:-.01em}
.mark span{font-size:9.5px;font-weight:600;letter-spacing:.38em;text-transform:uppercase;
  color:var(--tint);margin-top:5px}
.nav{display:flex;gap:34px;margin-left:auto}
.nav a{font-size:14.5px;font-weight:500;color:var(--muted);position:relative;padding-block:4px}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--ink);
  transform:scaleX(0);transform-origin:left;transition:transform .32s cubic-bezier(.2,.7,.3,1)}
.nav a:hover{color:var(--ink)}
.nav a:hover::after{transform:scaleX(1)}
.tel{font-size:14.5px;font-weight:600;white-space:nowrap}
.tel:hover{color:var(--tint)}
.langlink{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--muted);
  padding:9px 12px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--hair);min-height:40px;
  display:inline-flex;align-items:center;transition:all .2s ease}
.langlink:hover{color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}

/* hero */
.hero{position:relative;height:min(94vh,900px);min-height:560px;overflow:hidden;background:var(--ink)}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:kb 26s ease-out both}
@keyframes kb{from{transform:scale(1.001)}to{transform:scale(1.09)}}
.hero-scrim{position:absolute;inset:0;
  background:linear-gradient(105deg,rgba(8,18,22,.84) 0%,rgba(8,18,22,.54) 42%,rgba(8,18,22,.14) 78%)}
.hero-in{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;
  justify-content:flex-end;padding-bottom:78px}
.hero h1{font-family:"Instrument Serif",Georgia,serif;font-weight:400;color:#fff;
  font-size:clamp(44px,7vw,104px);line-height:.97;letter-spacing:-.022em;max-width:16ch}
.hero h1 em{font-style:italic;color:var(--tint-lt)}
.hero-sub{color:rgba(255,255,255,.86);font-size:19px;font-weight:300;max-width:48ch;margin-top:26px}
.hero-acts{display:flex;flex-wrap:wrap;gap:14px;margin-top:38px}
.hero-meta{position:absolute;top:44px;left:0;right:0;z-index:2}
.hero-meta .lab{color:rgba(255,255,255,.8)}
.cue{position:absolute;right:48px;bottom:78px;z-index:3;display:flex;flex-direction:column;
  align-items:center;gap:12px;color:rgba(255,255,255,.7);font-size:10.5px;font-weight:600;
  letter-spacing:.24em;text-transform:uppercase;writing-mode:vertical-rl}
.cue i{width:1px;height:58px;background:rgba(255,255,255,.4);display:block;position:relative;overflow:hidden}
.cue i::after{content:"";position:absolute;left:0;top:-58px;width:1px;height:58px;background:#fff;
  animation:drop 2.6s cubic-bezier(.6,0,.2,1) infinite}
@keyframes drop{0%{transform:translateY(0)}60%,100%{transform:translateY(116px)}}

/* soumission rapide */
.quick{background:var(--wash);border-bottom:1px solid var(--hair)}
.quick-in{display:grid;grid-template-columns:auto 1fr;gap:56px;align-items:center;padding-block:38px}
.quick-t{font-family:"Instrument Serif",Georgia,serif;font-size:29px;line-height:1.12;
  letter-spacing:-.014em;margin-top:14px;max-width:16ch}
.quick-f{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:22px;align-items:end}
.qf{display:flex;flex-direction:column;gap:7px}
.qf label{font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.qf input{width:100%;background:transparent;border:0;border-bottom:1px solid rgba(13,21,24,.22);
  color:var(--ink);font-family:inherit;font-size:16.5px;padding:10px 2px;min-height:46px;
  border-radius:0;transition:border-color .25s ease}
.qf input:focus{outline:none;border-bottom-color:var(--tint)}

/* marquee */
.mq{border-bottom:1px solid var(--hair);background:var(--white);overflow:hidden}
.mq-t{display:flex;width:max-content;animation:slide 44s linear infinite}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.mq-s{display:flex;align-items:center;padding-block:22px}
.mq-s span{font-size:12px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;
  color:var(--muted);display:flex;align-items:center;white-space:nowrap}
.mq-s span::after{content:"";width:4px;height:4px;border-radius:50%;background:var(--tint-br);
  display:block;margin-inline:36px}

/* manifeste */
.mani{display:grid;grid-template-columns:5fr 7fr;gap:80px;align-items:start}
.mani-q{font-family:"Instrument Serif",Georgia,serif;font-size:clamp(30px,3.3vw,46px);
  line-height:1.16;letter-spacing:-.015em}
.mani-q em{font-style:italic;color:var(--tint)}
.facts{margin-top:64px;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--hair);
  border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.fact{background:var(--paper);padding:34px 28px 34px 0}
.fact b{display:block;font-family:"Instrument Serif",Georgia,serif;font-size:46px;font-weight:400;
  line-height:1;letter-spacing:-.02em}
.fact span{display:block;font-size:14px;color:var(--muted);margin-top:12px;max-width:26ch}

/* services */
.svc{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:start;margin-top:64px}
.svc-sticky{position:sticky;top:120px}
.svc-sticky img{width:100%;aspect-ratio:3 / 4;object-fit:cover;border-radius:4px}
.svc-item{padding-block:56px;border-bottom:1px solid var(--hair)}
.svc-item:first-child{padding-top:0}
.svc-num{font-size:11.5px;font-weight:600;letter-spacing:.24em;color:var(--tint)}
.svc-item h3{font-family:"Instrument Serif",Georgia,serif;font-weight:400;font-size:38px;
  letter-spacing:-.015em;margin-top:16px}
.svc-item p{color:var(--muted);margin-top:16px;font-weight:300;font-size:17px}
.svc-item ul{list-style:none;padding:0;margin:26px 0 0;display:flex;flex-direction:column;gap:12px}
.svc-item li{display:flex;gap:14px;font-size:15.5px}
.svc-item li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--tint-br);
  margin-top:10px;flex-shrink:0}
.svc-shot{margin-top:30px;border-radius:4px;overflow:hidden}
.svc-shot img{width:100%;aspect-ratio:3 / 2;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.3,1)}
.svc-shot:hover img{transform:scale(1.045)}

/* avantages */
.adv{display:grid;grid-template-columns:repeat(4,1fr);margin-top:70px;border-top:1px solid var(--hair)}
.adv-i{padding:40px 34px 46px 0;border-right:1px solid var(--hair);position:relative}
.adv-i:last-child{border-right:0;padding-right:0}
.adv-i::before{content:"";position:absolute;top:-1px;left:0;width:100%;height:1px;
  background:var(--tint-br);transform:scaleX(0);transform-origin:left;
  transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.adv-i:hover::before{transform:scaleX(1)}
.adv-n{font-family:"Instrument Serif",Georgia,serif;font-size:19px;color:var(--tint)}
.adv-i h3{font-size:20px;font-weight:600;margin-top:22px;letter-spacing:-.005em}
.adv-i p{font-size:15px;color:var(--muted);margin-top:12px;font-weight:300}

/* galerie */
.gal-head{display:flex;justify-content:space-between;align-items:flex-end;gap:36px;flex-wrap:wrap}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{border:0;cursor:pointer;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  padding:11px 18px;min-height:44px;border-radius:999px;transition:all .22s ease;
  background:transparent;color:var(--muted);box-shadow:inset 0 0 0 1px var(--hair)}
.chip:hover{color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.chip.is-on{background:var(--ink);color:var(--paper);box-shadow:none}
.gal{display:grid;grid-template-columns:repeat(6,1fr);gap:20px;margin-top:52px}
.gcard{position:relative;overflow:hidden;border-radius:4px;background:#0B1114;
  transition:opacity .45s ease,filter .45s ease}
.gcard.w2{grid-column:span 2}
.gcard.w3{grid-column:span 3}
.gcard.dim{opacity:.18;filter:grayscale(1)}
.gcard img{width:100%;aspect-ratio:4 / 3;object-fit:cover;transition:transform .9s cubic-bezier(.2,.7,.3,1)}
.gcard:hover img{transform:scale(1.06)}
.gveil{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top,rgba(8,18,22,.88) 0%,rgba(8,18,22,.18) 46%,rgba(8,18,22,0) 70%)}
.gtxt{position:absolute;left:22px;right:22px;bottom:20px;
  transform:translateY(8px);opacity:.94;transition:transform .45s ease,opacity .45s ease}
.gcard:hover .gtxt{transform:translateY(0);opacity:1}
.gtxt b{display:block;font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:var(--tint-lt)}
.gtxt span{display:block;font-size:16px;color:#fff;margin-top:7px;font-weight:400}

/* pose */
.pose{position:relative;overflow:hidden;background:var(--ink)}
.pose img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;opacity:.5}
.pose-in{position:relative;z-index:2;padding-block:170px}
.pose blockquote{font-family:"Instrument Serif",Georgia,serif;font-size:clamp(30px,4vw,60px);
  line-height:1.1;letter-spacing:-.018em;color:#fff;max-width:20ch}
.pose-by{margin-top:32px;font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  color:var(--tint-lt)}

/* étapes */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:56px;margin-top:70px}
.step{padding-top:38px;border-top:1px solid var(--hair)}
.step b{font-size:11.5px;font-weight:600;letter-spacing:.24em;color:var(--tint);display:block}
.step h3{font-family:"Instrument Serif",Georgia,serif;font-weight:400;font-size:30px;
  margin-top:18px;letter-spacing:-.012em}
.step p{color:var(--muted);margin-top:14px;font-weight:300;font-size:16px}

/* faq */
.faq{margin-top:56px;border-top:1px solid var(--hair)}
.qrow{border-bottom:1px solid var(--hair)}
.qbtn{width:100%;display:flex;align-items:flex-start;gap:26px;cursor:pointer;
  padding:30px 0;min-height:64px;list-style:none}
.qbtn::-webkit-details-marker{display:none}
.qnum{font-family:"Instrument Serif",Georgia,serif;font-size:16px;color:var(--tint);
  padding-top:6px;flex-shrink:0}
.qtxt{font-family:"Instrument Serif",Georgia,serif;font-size:25px;font-weight:400;flex-grow:1;
  letter-spacing:-.012em;line-height:1.24;transition:color .22s ease}
.qbtn:hover .qtxt{color:var(--tint)}
.qsign{width:22px;height:22px;flex-shrink:0;position:relative;margin-top:8px}
.qsign::before,.qsign::after{content:"";position:absolute;background:var(--ink);left:50%;top:50%;
  transform:translate(-50%,-50%);transition:opacity .2s ease}
.qsign::before{width:13px;height:1.5px}
.qsign::after{width:1.5px;height:13px;opacity:1}
.qrow[open] .qsign::after{opacity:0}
.ans{padding:0 0 32px 42px;font-size:17px;color:var(--muted);max-width:74ch;font-weight:300;
  animation:rise .4s cubic-bezier(.2,.7,.3,1) both}
.ans p + p{margin-top:14px}

/* formulaire */
.q-in{display:grid;grid-template-columns:5fr 7fr;gap:80px;align-items:start}
.qpts{list-style:none;padding:0;margin:40px 0 0;display:flex;flex-direction:column;gap:22px}
.qpts li{display:flex;gap:18px;color:rgba(234,242,244,.84);font-size:16px;font-weight:300}
.qpts li b{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--tint-lt);padding-top:4px}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:26px 24px}
.f{display:flex;flex-direction:column;gap:9px}
.f.full{grid-column:1 / -1}
.f label{font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(234,242,244,.62)}
.f input,.f select,.f textarea{width:100%;background:transparent;border:0;
  border-bottom:1px solid var(--hair-d);color:var(--cream);font-family:inherit;font-size:16.5px;
  padding:11px 2px;min-height:48px;border-radius:0;transition:border-color .25s ease}
.f select option{color:#111}
.f textarea{min-height:92px;resize:vertical}
.f input::placeholder,.f textarea::placeholder{color:rgba(234,242,244,.4)}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-bottom-color:var(--tint-lt)}
.fnote{font-size:13px;color:rgba(234,242,244,.58);margin-top:22px}
.fmsg{grid-column:1 / -1;font-size:14px;font-weight:600;margin:0;min-height:0}
.fmsg:empty{display:none}
.fmsg.ok{color:var(--tint)}
.fmsg.on-dark.ok{color:var(--tint-lt)}
.fmsg.err{color:#C0432E}
.fmsg.on-dark.err{color:#F0A08F}
.quick-f .fmsg{grid-column:1 / -1;margin-top:4px}

/* footer */
.ft{background:var(--ink);color:var(--cream);padding-block:88px 0}
.ft-in{display:grid;grid-template-columns:2fr 1fr 1fr;gap:60px}
.ft .mark b{color:var(--cream)}
.fh{font-size:10.5px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:rgba(234,242,244,.52);margin:0 0 22px}
.ft ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:13px}
.ft a{font-size:15.5px;color:rgba(234,242,244,.84)}
.ft a:hover{color:var(--tint-lt)}
.ft p{font-size:15.5px;color:rgba(234,242,244,.62);margin-top:22px;max-width:32ch;font-weight:300}
.ft-bot{border-top:1px solid rgba(234,242,244,.14);margin-top:72px;padding-block:28px;
  display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;font-size:13px;
  color:rgba(234,242,244,.5)}

.mcta{display:none}

@media (max-width:1080px){
  .wrap{padding-inline:34px}
  .sec{padding-block:100px}
  .quick-in{grid-template-columns:1fr;gap:26px}
  .mani{grid-template-columns:1fr;gap:34px}
  .svc{grid-template-columns:1fr;gap:44px}
  .svc-sticky{position:static}
  .svc-sticky img{aspect-ratio:3 / 2}
  .adv{grid-template-columns:1fr 1fr}
  .adv-i{padding-right:30px}
  .adv-i:nth-child(2n){border-right:0;padding-right:0}
  .q-in{grid-template-columns:1fr;gap:48px}
  .nav{display:none}
  .gal{grid-template-columns:repeat(4,1fr)}
  .cue{display:none}
}
@media (max-width:860px){
  .quick-f{grid-template-columns:1fr 1fr;gap:20px}
  .quick-f .btn{grid-column:1 / -1}
}
@media (max-width:760px){
  .steps{grid-template-columns:1fr;gap:34px}
  .gal{grid-template-columns:repeat(2,1fr)}
  .gcard.w3,.gcard.w2{grid-column:span 2}
  .ft-in{grid-template-columns:1fr 1fr}
  .facts{grid-template-columns:1fr}
  .fact{padding:26px 0}
}
@media (max-width:620px){
  .wrap{padding-inline:20px}
  .sec{padding-block:76px}
  .sec-s{padding-block:60px}
  .hdr-in{height:70px;gap:12px}
  .tel{display:none}
  .hero{height:min(88vh,720px)}
  .hero-in{padding-bottom:58px}
  .quick-f{grid-template-columns:1fr}
  .quick-t{font-size:25px}
  .adv{grid-template-columns:1fr}
  .adv-i{border-right:0;padding:32px 0 34px}
  .gal{grid-template-columns:1fr}
  .gcard.w3,.gcard.w2{grid-column:span 1}
  .fgrid{grid-template-columns:1fr}
  .ans{padding-left:0}
  .qtxt{font-size:21px}
  .pose-in{padding-block:110px}
  .ft-in{grid-template-columns:1fr;gap:38px}
  .hero-acts .btn{width:100%}
  body{padding-bottom:76px}
  .mcta{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:90;padding:11px 16px;gap:10px;
    background:rgba(247,249,250,.96);border-top:1px solid var(--hair);backdrop-filter:blur(12px)}
  .mcta .btn{flex-grow:1}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation:none !important;transition:none !important}
}