@font-face{font-family:"Young Serif";font-weight:400;font-display:swap;src:url(fonts/young-serif-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Nunito;font-weight:400;font-display:swap;src:url(fonts/nunito-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Nunito;font-weight:600;font-display:swap;src:url(fonts/nunito-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:Nunito;font-weight:800;font-display:swap;src:url(fonts/nunito-latin-800-normal.woff2) format("woff2")}
:root{--bg:#f3f8f2;--bg2:#e4f1ea;--deep:#0f3b36;--deep2:#3e6a63;--mint:#2fbf9b;--aqua:#8fe0ee;--lemon:#f6dc6e;--g:clamp(18px,5vw,80px)}
*{box-sizing:border-box;margin:0;padding:0}
html,body{overflow-x:clip}html{scroll-behavior:smooth}
body{font:400 17px/1.65 Nunito,system-ui,sans-serif;background:var(--bg);color:var(--deep);-webkit-font-smoothing:antialiased}
a{color:inherit}.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:var(--lemon);padding:8px 12px;z-index:99}
.wrap{max-width:1360px;margin:0 auto;padding:0 var(--g)}
.small{font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:800;color:var(--deep2);margin-bottom:18px}
em{font-style:normal;color:var(--mint)}
.top{position:fixed;inset:0 0 auto 0;z-index:30;display:flex;justify-content:space-between;align-items:center;padding:12px var(--g);background:rgba(243,248,242,.8);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}.brand svg{width:34px;height:34px}.brand b{font:400 24px "Young Serif",serif}
.top nav{display:flex;gap:clamp(14px,2.4vw,34px);align-items:center;font-size:14px;font-weight:600}
.top nav a{text-decoration:none}.top nav a:hover{color:var(--mint)}
.top .tel{background:var(--deep);color:#fff;padding:9px 18px;border-radius:99px;white-space:nowrap}.top .tel:hover{color:#fff;background:var(--mint)}
/* loader */
.load{position:fixed;inset:0;z-index:100;background:#8a7c64;display:grid;place-items:center;color:#fff;transition:clip-path 1.1s cubic-bezier(.7,0,.2,1);clip-path:inset(0 0 0 0)}
.load::before{content:"";position:absolute;inset:0;background:radial-gradient(40% 30% at 20% 30%,rgba(60,48,32,.35),transparent),radial-gradient(35% 30% at 75% 70%,rgba(60,48,32,.4),transparent),radial-gradient(30% 25% at 60% 20%,rgba(60,48,32,.3),transparent)}
.load-in{position:relative;text-align:center}.load-in p{font-size:12px;letter-spacing:.3em;text-transform:uppercase;font-weight:800;opacity:.85}
.load-in b{display:block;font:400 clamp(90px,18vw,220px)/1 "Young Serif",serif}
.squeegee{position:absolute;left:0;right:0;bottom:0;height:10px;background:#fff;box-shadow:0 0 30px 8px rgba(255,255,255,.8);opacity:0}
.load.go{clip-path:inset(0 0 100% 0)}.load.go .squeegee{opacity:1}
.load.out{display:none}
body.lock{overflow:hidden}
/* header */
.tr{display:flex;align-items:center;gap:22px}.privacy{font-size:13px;font-weight:600;text-decoration:none}.privacy:hover{color:var(--mint)}
.mbtn{display:flex;align-items:center;gap:12px;background:var(--deep);color:#fff;border:0;border-radius:99px;padding:10px 20px;font:800 13px Nunito,sans-serif;letter-spacing:.16em;text-transform:uppercase;cursor:pointer}
.mbtn i{width:18px;height:10px;border-block:2px solid #fff;transition:.3s}.mbtn[aria-expanded=true] i{height:2px;border-width:0;background:#fff;transform:rotate(45deg)}
.menu{position:fixed;inset:0;z-index:25;background:var(--deep);color:#fff;padding:110px var(--g) 40px;display:flex;flex-direction:column;justify-content:space-between;clip-path:circle(0 at calc(100% - 80px) 40px);transition:clip-path .7s cubic-bezier(.7,0,.2,1)}
.menu[hidden]{display:flex;visibility:hidden}.menu.on{clip-path:circle(150% at calc(100% - 80px) 40px);visibility:visible}
.menu ul{list-style:none}.menu>ul>li>a{display:flex;gap:22px;align-items:baseline;font:400 clamp(38px,7vw,96px)/1.15 "Young Serif",serif;text-decoration:none}.menu>ul>li>a:hover{color:var(--aqua)}
.menu b{font:800 13px Nunito,sans-serif;letter-spacing:.2em;color:var(--aqua)}
.menu .sub{display:flex;gap:26px;margin:4px 0 8px 54px;flex-wrap:wrap}.menu .sub a{color:#a8d8cf;text-decoration:none;font-size:18px}.menu .sub a:hover{color:#fff}
.menu-f{color:#a8d8cf;font-size:15px}.menu-f a{color:#fff;font-weight:800}
/* hero */
.hero{position:relative;height:100svh;min-height:600px;display:flex;align-items:center;overflow:hidden;background:var(--bg2)}
.slides{position:absolute;inset:0}.sl{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity 1.6s;transform:scale(1.04)}
.sl.on{opacity:1;animation:kb 9s ease-out forwards}@keyframes kb{from{transform:scale(1.04)}to{transform:scale(1.14)}}
.hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(243,248,242,.92) 0,rgba(243,248,242,.7) 45%,rgba(243,248,242,0) 75%)}
.bub{position:absolute;inset:0;pointer-events:none;z-index:2}
.bub i{position:absolute;bottom:-80px;border-radius:50%;pointer-events:auto;cursor:pointer;background:radial-gradient(circle at 30% 28%,rgba(255,255,255,.95) 0 10%,rgba(255,255,255,.15) 30%,rgba(143,224,238,.28) 70%);border:1.5px solid rgba(143,224,238,.9);animation:rise linear forwards}
.bub i.pop{animation:none;transform:scale(1.6);opacity:0;transition:.25s}
@keyframes rise{to{transform:translate(var(--dx),-120vh)}}
.hero-in{position:relative;z-index:3;width:100%;padding-top:70px}
.eyebrow{font-size:12px;letter-spacing:.24em;text-transform:uppercase;font-weight:800;color:var(--deep2);margin-bottom:22px}
h1,.big{font-family:"Young Serif",serif;font-weight:400;line-height:1.04;letter-spacing:-.01em}
h1{font-size:clamp(38px,6.4vw,100px);max-width:11em}
h1 .l{display:block;overflow:hidden;padding:.1em 0 .12em;margin:-.1em 0 -.12em}
h1 .l>span{display:block;transform:translateY(110%)}
body.ready h1 .l>span{animation:up 1.1s cubic-bezier(.2,.8,.2,1) forwards}body.ready h1 .l:nth-child(2)>span{animation-delay:.12s}body.ready h1 .l:nth-child(3)>span{animation-delay:.24s}
@keyframes up{to{transform:none}}
.badge{position:absolute;right:clamp(20px,5vw,80px);bottom:clamp(60px,12vh,120px);width:clamp(110px,12vw,170px);aspect-ratio:1;z-index:3;pointer-events:none}
.badge svg{width:100%;height:100%;animation:spin 18s linear infinite}.badge text{font:800 14px Nunito,sans-serif;letter-spacing:.1em;fill:#fff}
@keyframes spin{to{transform:rotate(360deg)}}
.scroll{position:absolute;left:50%;transform:translateX(-50%);bottom:22px;z-index:3;display:flex;flex-direction:column;align-items:center;gap:10px;text-decoration:none;font-size:11px;letter-spacing:.26em;text-transform:uppercase;font-weight:800}
.scroll i{width:2px;height:40px;background:var(--deep);transform-origin:top;animation:sc 2s ease-in-out infinite}@keyframes sc{0%{transform:scaleY(0)}60%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
/* intro */
.intro{padding:clamp(90px,14vw,190px) 0 clamp(40px,6vw,80px);background:var(--bg)}
.lede{font:400 clamp(26px,3.8vw,56px)/1.25 "Young Serif",serif;max-width:22em}.lede em{color:var(--mint)}
.sec{padding:clamp(70px,10vw,140px) 0;position:relative}
.big{font-size:clamp(38px,6vw,92px)}
.rv{opacity:0;transform:translateY(34px);transition:opacity .9s,transform .9s cubic-bezier(.2,.8,.2,1)}.rv.in{opacity:1;transform:none}
.head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}
.ctrl{display:flex;align-items:center;gap:12px}.cnt{font-size:15px;color:var(--deep2);margin-right:10px}.cnt b{font:400 30px "Young Serif",serif;color:var(--deep)}
.ctrl button{width:54px;height:54px;border-radius:50%;border:2px solid var(--deep);background:none;color:var(--deep);font-size:22px;cursor:pointer;transition:.3s}.ctrl button:hover{background:var(--deep);color:#fff}
/* tuiles */
.strip{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:var(--g);padding:50px var(--g) 20px;scrollbar-width:none;cursor:grab}.strip::-webkit-scrollbar{display:none}
.tile{flex:0 0 clamp(260px,26vw,380px);aspect-ratio:1;scroll-snap-align:start;border-radius:24px;padding:26px;position:relative;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.tile:hover{transform:translateY(-10px) rotate(-1deg)}
.c1{background:var(--aqua)}.c2{background:#b9ecd6}.c3{background:var(--lemon)}.c4{background:#fff;border:2px solid var(--deep)}
.tile .no{position:absolute;top:22px;right:24px;font:400 22px "Young Serif",serif;color:var(--deep2)}
.tile svg{position:absolute;top:24px;left:24px;width:34%;aspect-ratio:1;fill:none;stroke:var(--deep);stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.tile:hover svg{transform:scale(1.18) rotate(-6deg)}
.tile h3{font:400 clamp(24px,2.4vw,32px) "Young Serif",serif;margin-bottom:4px}.tile p{font-size:15px;color:#244b46}
/* savoir-faire */
.sf{background:var(--bg2)}
.rows{margin-top:50px;border-top:2px solid var(--deep)}
.row{display:grid;grid-template-columns:clamp(70px,10vw,140px) 1fr;gap:16px;padding:28px 0;border-bottom:2px solid var(--deep);align-items:baseline}
.row b{font:400 clamp(40px,6vw,76px)/1 "Young Serif",serif;color:var(--aqua);transition:.4s}.row:hover b{color:var(--mint)}
.row h3{font:400 clamp(24px,3vw,34px)/1.2 "Young Serif",serif}.row p{color:var(--deep2);margin-top:6px;max-width:36em}
.ba-l{margin-top:70px}
/* compare */
.ba{background:var(--bg2)}
.cmp{position:relative;margin-top:50px;border-radius:26px;overflow:hidden;border:6px solid var(--deep);aspect-ratio:16/9;max-width:1100px;touch-action:pan-y;user-select:none;background:#fff}
.cmp svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.cmp .before{clip-path:inset(0 calc(100% - var(--p)) 0 0)}
.hdl{position:absolute;top:0;bottom:0;left:var(--p);width:4px;margin-left:-2px;background:#fff;box-shadow:0 0 14px rgba(15,59,54,.4);pointer-events:none}
.hdl span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;background:var(--lemon);border:4px solid var(--deep);display:grid;place-items:center;font-weight:800;font-size:22px}
.cmp input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.cmp:focus-within .hdl span{outline:3px solid var(--mint);outline-offset:3px}
.tag{position:absolute;bottom:14px;background:var(--deep);color:#fff;padding:5px 14px;border-radius:99px;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;pointer-events:none}.tag.l{left:14px}.tag.r{right:14px}
/* experience */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:50px}
.card{background:#fff;border:2px solid var(--deep);border-radius:24px;padding:30px 26px 34px;display:flex;flex-direction:column;gap:12px;min-height:280px}
.card h3{font:400 30px "Young Serif",serif}.card p{color:var(--deep2)}.card .lnk{margin-top:auto;font-weight:800;text-underline-offset:6px;text-decoration-thickness:2px;text-decoration-color:var(--mint)}
.card:nth-child(1){background:#b9ecd6}.card:nth-child(2){background:var(--aqua)}.card:nth-child(3){background:var(--lemon)}
.btn{display:inline-block;background:var(--deep);color:#fff;text-decoration:none;border:0;padding:16px 30px;border-radius:99px;font:800 16px Nunito,sans-serif;cursor:pointer;position:relative;overflow:hidden}
.btn::before{content:"";position:absolute;inset:0;background:var(--mint);transform:translateY(101%);transition:.35s;border-radius:50% 50% 0 0/20% 20% 0 0}.btn span{position:relative;z-index:1}.btn:hover::before{transform:none;border-radius:0}
/* contact */
.contact{background:var(--deep);color:#fff}.contact .small{color:#a8d8cf}.contact em{color:var(--aqua)}
.ct-g{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px)}
.phone{display:block;font:400 clamp(38px,5.4vw,76px)/1 "Young Serif",serif;text-decoration:none;margin:34px 0 22px}.phone:hover{color:var(--aqua)}
address{font-style:normal;color:#cfe8e3}.hrs{margin-top:20px;color:#a8d8cf;font-weight:600}.todo{background:var(--lemon);color:var(--deep);padding:1px 7px;border-radius:4px}
form{display:flex;flex-direction:column;gap:6px;background:#fff;color:var(--deep);padding:clamp(22px,3vw,40px);border-radius:26px}
label{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--deep2);margin-top:10px}
input:not([type=range]),select,textarea{font:400 16px Nunito,sans-serif;padding:12px 0;border:0;border-bottom:2px solid var(--deep);background:transparent;color:var(--deep);border-radius:0;width:100%}
form .btn{margin-top:22px;align-self:flex-start}.hp{position:absolute;left:-9999px}
a:focus-visible,.btn:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--mint);outline-offset:3px}
.form-msg{font-size:14px;min-height:1.4em;margin-top:8px}.form-msg.ok{color:#1c6b32}.form-msg.err{color:#a3261c}.form-msg.info{background:var(--lemon);padding:6px 10px;border-radius:6px}
footer{padding:30px var(--g);background:#0a2b27;color:#bcd8d2;font-size:13.5px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}footer b{color:#fff}
.legal-page{background:var(--bg)}.legal{max-width:760px;margin:0 auto;padding:60px 22px}.legal h1{font-size:clamp(34px,5vw,54px);margin:20px 0}.legal h2{font:400 22px "Young Serif",serif;margin:28px 0 8px}.legal p{margin:8px 0;color:var(--deep2)}.draft{background:var(--lemon);color:var(--deep)!important;padding:10px 14px;border-radius:8px}
@media (max-width:900px){
 .ct-g{grid-template-columns:1fr}.cards{grid-template-columns:1fr}.card{min-height:0}
 .privacy{display:none}.hero::before{background:linear-gradient(180deg,rgba(243,248,242,.9),rgba(243,248,242,.55) 70%,rgba(243,248,242,.2))}
 .hero-in{padding-top:40px}.hero{align-items:flex-start;padding-top:90px}.badge{bottom:90px}
 .tile{flex-basis:76vw}.row{grid-template-columns:60px 1fr}.menu .sub{margin-left:0}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}h1 .l>span{transform:none}.rv{opacity:1;transform:none}.load{display:none}}

body.mopen .top{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;z-index:40}body.mopen .brand b,body.mopen .privacy{color:#fff}.top{z-index:40}
