/* ─── 1 · Hero : une phrase,un mot qui change,l'équerre du logo ─── */
.hero{position:relative;min-height:min(100svh,880px);color:#fff;background:#111 center/cover no-repeat;border-bottom-right-radius:clamp(80px,12vw,180px);overflow:hidden;isolation:isolate;display:flex;align-items:center}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,rgba(0,0,0,.82) 0%,rgba(0,0,0,.6) 55%,rgba(29,134,163,.55) 100%)}
.hero .wrap{width:100%;padding-top:calc(var(--head) + 60px);padding-bottom:110px}
.frame{position:relative;max-width:1080px;padding:44px 72px 40px 0}
.frame svg{position:absolute;top:0;right:0;width:62%;height:78%;overflow:visible}
.frame svg path{fill:none;stroke:var(--sky);stroke-width:9;stroke-linecap:square;stroke-dasharray:1200;stroke-dashoffset:1200;animation:draw 1.6s .3s cubic-bezier(.6,0,.2,1) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.sqn-home .kicker{display:flex;align-items:center;gap:14px;font:700 12.5px/1.4 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.8)}
.sqn-home .kicker::before{content:"";width:46px;height:7px;background:var(--sky);flex:none}
.hero h1{color:#fff;font-size:clamp(26px,3.3vw,46px);line-height:1.2;margin-top:22px;text-wrap:initial}
.rot{color:var(--sky);display:inline-block;white-space:nowrap}
@media (max-width:900px){.rot{white-space:normal;display:inline}}
.rot .w{display:inline-block;transition:opacity .4s ease,transform .4s ease}
.rot .w.out{opacity:0;transform:translateY(12px)}
.dash{display:inline-block;width:.42em;height:.14em;background:#fff;margin-left:.12em;vertical-align:.12em;animation:blink 1.1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.hero .lead{margin-top:24px;font-size:clamp(17px,1.5vw,20px);color:rgba(255,255,255,.86);max-width:48ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.hero-foot{position:absolute;left:0;right:0;bottom:34px}
.hero-foot .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:0 clamp(16px,4.5vw,64px)}
.cities-line{font:700 12px/1.5 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.cities-line b{color:#fff}
@media (max-width:700px){.frame{padding:34px 26px 30px 0}
.frame svg{width:70%}
.hero-foot{display:none}}
/* ─── 2 · Introduction ─── */
.intro{padding-block:clamp(80px,10vw,130px)}
.intro-in{max-width:880px;margin-inline:auto}
.intro p.big{font:400 clamp(21px,2.2vw,29px)/1.6 var(--sans);color:var(--ink)}
.intro p.big strong{color:var(--teal);font-weight:700}
.intro .cta{display:flex;justify-content:flex-end;margin-top:36px}
/* ─── 3 · Domaines : composition avec les formes du logo ─── */
.areas{background:var(--sand);padding-block:clamp(80px,10vw,130px)}
.areas .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,100px);align-items:center}
.compo{width:100%;max-width:520px;aspect-ratio:1;justify-self:start;overflow:visible}
.compo .m{transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.areas-txt{display:grid;gap:22px}
.areas-txt .lead{font-size:18px;max-width:46ch}
.dash-list{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:2px}
.dash-list li{display:grid;grid-template-columns:36px 1fr;align-items:baseline;font-size:clamp(18px,1.55vw,21px);color:var(--ink);padding:6px 0;transition:color .25s,transform .3s}
.dash-list li::before{content:"";width:20px;height:5px;background:var(--sky);transform:translateY(-4px)}
.dash-list li:hover{color:var(--teal);transform:translateX(6px)}
@media (max-width:900px){.areas .wrap{grid-template-columns:1fr}
.compo{max-width:300px}}
/* ─── 4 · Com de crise 2.0 ─── */
section.crise{background:var(--night);color:#C9D0D4;padding-block:clamp(80px,10vw,130px);position:relative;overflow:hidden}
section.crise .wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(40px,6vw,90px);align-items:center}
.sqn-home .badge{display:inline-flex;align-items:center;gap:10px;font:700 12px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#fff;padding:10px 14px;border:1px solid rgba(60,191,230,.55);border-radius:999px;background:rgba(60,191,230,.1)}
.sqn-home .badge i{width:8px;height:8px;border-radius:50%;background:var(--sky);animation:ping 2s infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(60,191,230,.7)}
80%,100%{box-shadow:0 0 0 10px rgba(60,191,230,0)}}
section.crise h2{color:#fff;font-size:clamp(40px,5.4vw,76px);margin-top:22px}
section.crise h2 span{color:var(--sky)}
section.crise .sub{font:700 clamp(17px,1.6vw,21px)/1.35 var(--sans);color:#fff;margin-top:10px}
section.crise .lead{margin-top:20px;max-width:52ch}
section.crise .shifts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:34px;border-top:1px solid rgba(255,255,255,.14)}
section.crise .shift{padding:18px 18px 0 0;display:grid;gap:6px}
section.crise .shift + .shift{padding-left:18px;border-left:1px solid rgba(255,255,255,.14)}
section.crise .shift b{font:700 12px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--sky)}
section.crise .shift span{font-size:15px}
section.crise .facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
section.crise .facts span{font:700 13px/1 var(--sans);letter-spacing:.06em;padding:11px 14px;border-radius:999px;background:rgba(255,255,255,.07);color:#fff}
section.crise .ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.crise-visual{position:relative;justify-self:end;width:100%;max-width:520px}
.crise-visual .ph{aspect-ratio:4/5;border-radius:0 0 0 140px;overflow:hidden;background:#222}
.crise-visual img{width:100%;height:100%;object-fit:cover}
.crise-visual svg{position:absolute;top:-22px;right:-22px;width:62%;height:62%;overflow:visible}
.crise-visual svg path{fill:none;stroke:var(--sky);stroke-width:9;stroke-linecap:square}
.timer{position:absolute;left:-26px;bottom:44px;background:#fff;color:var(--ink);border-radius:16px;padding:16px 20px;display:grid;gap:2px;box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
.timer b{font:normal 40px/1 var(--display);color:var(--teal)}
.timer span{font-size:13.5px;max-width:18ch}
@media (max-width:960px){section.crise .wrap{grid-template-columns:1fr}
.crise-visual{justify-self:start;max-width:420px}
.timer{left:12px}}
@media (max-width:560px){section.crise .shifts{grid-template-columns:1fr}
section.crise .shift,section.crise .shift + .shift{padding:14px 0;border-left:0;border-bottom:1px solid rgba(255,255,255,.1)}}
/* ─── 5 · La différence ─── */
.diff{padding-block:clamp(80px,10vw,130px)}
.diff .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);gap:clamp(40px,6vw,100px);align-items:center}
.diff-txt{display:grid;gap:24px}
.diff-txt p{max-width:52ch}
.diff-points{list-style:none;margin:0;padding:24px 0 0;display:grid;gap:14px;border-top:1px solid var(--line)}
.diff-points li{display:grid;grid-template-columns:64px 1fr;gap:6px 16px;align-items:baseline}
.diff-points b{font:normal 30px/1 var(--display);color:var(--teal)}
.diff-points span{font-size:16.5px}
.portrait{position:relative;margin:0;justify-self:end;width:100%;max-width:440px}
.portrait .ph{border-radius:999px 999px 0 0;overflow:hidden;aspect-ratio:3/4;background:#111}
.portrait img{width:100%;height:100%;object-fit:cover;object-position:center top}
.portrait::after{content:"";position:absolute;left:-18px;bottom:40px;width:120px;height:10px;background:var(--sky)}
.portrait figcaption{margin-top:16px;font-size:15px}
.portrait figcaption b{display:block;font:normal 22px/1.2 var(--display);color:var(--ink);letter-spacing:.04em}
@media (max-width:900px){.diff .wrap{grid-template-columns:1fr}
.portrait{justify-self:start;max-width:360px}}
/* ─── 6 · Références ─── */
.company{background:var(--sand);padding-block:clamp(80px,10vw,120px)}
.company-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:44px}
.sqn-home .arrows{display:flex;gap:10px}
.sqn-home .arrows button{width:54px;height:54px;border-radius:50%;border:1px solid var(--ink);background:transparent;cursor:pointer;font-size:20px;color:var(--ink);transition:background .25s,color .25s}
.sqn-home .arrows button:hover{background:var(--ink);color:#fff}
.sqn-home .rail{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 4 * 18px) / 5);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.sqn-home .rail::-webkit-scrollbar{display:none}
.sqn-home .rail figure{margin:0;scroll-snap-align:start;background:#fff;border-radius:16px;aspect-ratio:4/3;display:grid;place-items:center;padding:18px;transition:box-shadow .3s}
.sqn-home .rail figure:hover{box-shadow:0 18px 40px -24px rgba(0,0,0,.35)}
.sqn-home .rail img{max-height:96px;width:auto;object-fit:contain;filter:grayscale(1);opacity:.7;transition:filter .3s,opacity .3s}
.sqn-home .rail figure:hover img{filter:none;opacity:1}
@media (hover:none){.sqn-home .rail img{filter:none;opacity:1}}
.company .cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:48px}
.company .case{padding-top:18px;display:grid;gap:8px;align-content:start;position:relative}
.company .case::before{content:"";position:absolute;top:0;left:0;width:44px;height:6px;background:var(--sky)}
.company .case small{font:700 12px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
.company .case p{font-size:16.5px;color:var(--ink)}
.cases-note{margin-top:16px;font-size:13.5px;color:var(--muted)}
@media (max-width:1000px){.sqn-home .rail{grid-auto-columns:calc((100% - 2 * 18px) / 3)}}
@media (max-width:640px){.sqn-home .rail{grid-auto-columns:70%}
.company .cases{grid-template-columns:1fr}}
/* ─── 7 · Analyses : grille éditoriale + filtres ─── */
.news{background:var(--sand);padding-block:0 clamp(80px,10vw,130px)}
.news-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:28px}
.news-head .sec-title{max-width:12ch}
.sqn-home .filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:30px}
.sqn-home .filters button{font:700 13px/1 var(--sans);letter-spacing:.06em;padding:11px 16px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.sqn-home .filters button:hover{border-color:var(--ink)}
.sqn-home .filters button[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.sqn-home .mag{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:22px}
.sqn-home .art{position:relative;text-decoration:none;background:#fff;border-radius:18px;overflow:hidden;display:grid;grid-template-rows:auto 1fr;grid-column:span 4;transition:transform .35s,box-shadow .35s}
.sqn-home .art:hover{transform:translateY(-6px);box-shadow:0 30px 60px -34px rgba(0,0,0,.4)}
.sqn-home .art .ph{aspect-ratio:16/10;overflow:hidden;background:#ddd}
.sqn-home .art .ph img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.sqn-home .art:hover .ph img{transform:scale(1.06)}
.sqn-home .art .bd{padding:22px 24px 26px;display:grid;gap:10px;align-content:start}
.sqn-home .art .cat{font:700 11.5px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
.sqn-home .art h3{font:700 20px/1.3 var(--sans);letter-spacing:0;color:var(--ink)}
.sqn-home .art .date{font-size:13.5px;color:var(--muted)}
.sqn-home .art.feat .date{color:rgba(255,255,255,.7)}
.sqn-home .art.type .date{color:#DDF3FA}
.sqn-home .art p{font-size:15.5px;color:var(--text)}
.sqn-home .art .go{margin-top:6px;display:inline-flex;align-items:center;gap:10px;font:700 13px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink)}
.sqn-home .art .go i{width:28px;height:28px;border-radius:50%;border:1px solid currentColor;display:grid;place-items:center;font-style:normal;transition:transform .3s,background .3s,color .3s}
.sqn-home .art:hover .go i{transform:rotate(-45deg);background:var(--blue);border-color:var(--blue);color:#fff}
.sqn-home .art.feat{grid-column:span 7;grid-row:span 2;grid-template-rows:1fr;min-height:560px;border-bottom-right-radius:110px;color:#fff}
.sqn-home .art.feat .ph{position:absolute;inset:0;aspect-ratio:auto}
.sqn-home .art.feat::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(0,0,0,.85) 100%)}
.sqn-home .art.feat .bd{position:relative;z-index:1;align-self:end;padding:clamp(24px,3.4vw,44px);gap:14px}
.sqn-home .art.feat .cat{color:var(--sky)}
.sqn-home .art.feat h3{color:#fff;font-size:clamp(26px,2.8vw,40px);line-height:1.18;max-width:18ch}
.sqn-home .art.feat p{color:rgba(255,255,255,.85);font-size:17px;max-width:48ch}
.sqn-home .art.feat .go{color:#fff}
.sqn-home .tagpill{position:absolute;top:22px;left:22px;z-index:2;font:700 11.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;background:var(--sky);color:var(--night);padding:9px 13px;border-radius:999px}
.sqn-home .art.side{grid-column:span 5;grid-template-rows:none;grid-template-columns:42% 1fr}
.sqn-home .art.side .ph{aspect-ratio:auto;height:100%}
.sqn-home .art.side .bd{padding:20px 22px;align-content:center}
.sqn-home .art.side h3{font-size:18px}
.sqn-home .art.side p{display:none}
.sqn-home .art.type{background:var(--teal);color:#fff;grid-template-rows:1fr}
.sqn-home .art.type .bd{padding:30px 28px;align-content:space-between;min-height:100%}
.sqn-home .art.type .cat{color:#DDF3FA}
.sqn-home .art.type h3{color:#fff;font:normal clamp(24px,2.3vw,32px)/1.14 var(--display);letter-spacing:.03em}
.sqn-home .art.type p{color:#F2FAFD}
.sqn-home .art.type .go{color:#fff}
.sqn-home .art.type .corner{width:70px;height:46px;border-top:8px solid var(--sky);border-right:8px solid var(--sky)}
.sqn-home .art[hidden]{display:none}
@media (max-width:1100px){.sqn-home .art.feat{grid-column:span 12;grid-row:auto;min-height:480px}
.sqn-home .art.side{grid-column:span 6}
.sqn-home .art{grid-column:span 6}}
@media (max-width:680px){.sqn-home .mag{grid-template-columns:1fr}
.sqn-home .art,.sqn-home .art.side,.sqn-home .art.feat{grid-column:auto}
.sqn-home .art.side{grid-template-columns:38% 1fr}
.sqn-home .art.feat{min-height:440px;border-bottom-right-radius:70px}}
/* ─── 8 · Bande contact (couleur du logo) ─── */
.sqn-home .touch{background:var(--teal);color:#fff;overflow:hidden;position:relative}
.sqn-home .touch .wrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(32px,5vw,80px);align-items:center;padding-block:clamp(64px,8vw,110px)}
.sqn-home .touch h2{color:#fff;font-size:clamp(38px,5.2vw,72px)}
.sqn-home .touch h2 span{color:var(--sky)}
.sqn-home .touch p{font-size:19px;max-width:40ch;margin-top:20px}
.sqn-home .touch .btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.sqn-home .touch .logo-shape{justify-self:end;width:100%;max-width:340px;aspect-ratio:1;position:relative}
.sqn-home .touch .logo-shape svg{width:100%;height:100%;overflow:visible}
@media (max-width:860px){.sqn-home .touch .wrap{grid-template-columns:1fr}
.sqn-home .touch .logo-shape{justify-self:start;max-width:200px}}
/* ─── 9 · Formulaire ─── */
.form-sec{padding-block:clamp(80px,10vw,120px)}
.form-sec .wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(36px,6vw,90px);align-items:start}
.form-sec address{font-style:normal;display:grid;gap:4px;font-size:17px;margin-top:22px}
.form-sec address b{color:var(--ink)}
.form-sec address a{color:var(--teal);font-weight:700;margin-top:10px}
[hidden]{display:none!important}
.form-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:clamp(22px,3.4vw,40px);position:relative;box-shadow:0 30px 60px -44px rgba(0,0,0,.35)}
.form-card::before{content:"";position:absolute;top:-8px;right:40px;width:90px;height:8px;background:var(--sky)}
@media (max-width:860px){.form-sec .wrap{grid-template-columns:1fr}}
@media (max-width:540px){form{grid-template-columns:1fr}}
