:root{--forest:#15382B;--deep:#0C2219;--lime:#C8E35A;--lav:#C9C6E8;--soft:#DDDAF0;--cream:#F8F4EB}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--deep);font-family:Roboto,system-ui,sans-serif}
a{color:var(--deep)}
h1,h2,h3,p{margin:0}
p{font-size:18px;line-height:1.6;color:var(--deep)}
.wrap{max-width:1280px;margin:0 auto}
.hl{font-family:"Noto Serif Display",Georgia,serif;font-style:italic;font-weight:400;font-stretch:62.5%;font-size:1.16em;letter-spacing:0}
.big{font-size:clamp(52px,9vw,140px);line-height:.9;font-weight:900;letter-spacing:-.04em}
.sec{font-size:clamp(38px,5.6vw,84px);line-height:.95;font-weight:900;letter-spacing:-.03em}
.mid{font-size:clamp(30px,4vw,56px);line-height:1;font-weight:900;letter-spacing:-.02em}
.tickbar{display:block;background:var(--forest);color:var(--lime);text-decoration:none;overflow:hidden;padding:12px 0}
.tick{display:flex;gap:40px;width:max-content;font-weight:900;font-size:16px;animation:tick 30s linear infinite}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.tick{animation:none}}
.top{padding:18px 24px}
.nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px}
.links{display:flex;flex-wrap:wrap;gap:2px}
.links a{text-decoration:none;font-weight:700;padding:12px 14px;border-radius:999px}
.links a:hover,.links a.on{background:var(--lav)}
.wm{display:inline-block;line-height:0}
.wm img{display:block;width:150px;min-width:120px;height:auto}
footer .wm img{width:170px}
.tagline{color:var(--lime);font-weight:900;font-size:17px}
.btn{display:inline-block;text-decoration:none;font-weight:900;font-size:18px;padding:17px 30px;border-radius:999px;text-align:center}
.btn-f{background:var(--forest);color:var(--cream)}.btn-f:hover{background:var(--deep);color:var(--lime)}
.btn-l{background:var(--lime);color:var(--deep);border:3px solid var(--forest);padding:14px 27px}.btn-l:hover{background:var(--cream);color:var(--deep)}
.btn-o{background:var(--cream);color:var(--deep);border:3px solid var(--forest);padding:14px 27px}
.btn-sm{font-size:15px;padding:13px 22px}
.btns{display:flex;flex-wrap:wrap;gap:12px}
.pill{display:inline-block;align-self:flex-start;font-size:14px;font-weight:900;padding:8px 16px;border-radius:999px}
.p-f{background:var(--forest);color:var(--cream)}.p-l{background:var(--lime);color:var(--deep)}.p-v{background:var(--lav);color:var(--deep)}.p-c{background:var(--cream);color:var(--deep)}
.tilt{transform:rotate(-3deg)}
.shadow{box-shadow:4px 4px 0 var(--deep)}
.sec-pad{padding:36px 24px}
.panel{border-radius:56px;padding:48px 40px;position:relative;overflow:hidden}
.lav{background:var(--lav)}.lime{background:var(--lime)}.forest{background:var(--forest);color:var(--cream)}.deep{background:var(--deep);color:var(--cream)}.creamb{background:var(--cream)}.soft{background:var(--soft)}
.forest p,.deep p{color:var(--soft)}
.forest a.btn-l,.deep a.btn-l{border-color:var(--lime)}
.center{display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px}
.stack{display:flex;flex-direction:column;gap:20px}
.blob1{position:absolute;left:-90px;top:-90px;width:300px;height:300px;background:var(--lime);border-radius:50%}
.blob2{position:absolute;right:-60px;bottom:-110px;width:340px;height:340px;background:var(--soft);border-radius:46% 54% 50% 50%}
.rel{position:relative}
.ph{display:flex;align-items:center;justify-content:center;text-align:center;padding:20px;font-size:12px;font-weight:700;letter-spacing:.14em;background:var(--soft);color:var(--deep)}
.hero-img{width:100%;max-width:820px;height:320px;border-radius:999px}
.row{display:flex;flex-wrap:wrap;gap:24px}
.row > *{flex:1 1 320px;min-width:0}
.head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px}
.head p{max-width:440px}
.grid4{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.step{border-radius:120px 120px 40px 40px;padding:56px 26px 30px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;min-height:470px}
.step h3{font-size:30px;line-height:1;font-weight:900}
.step .price{font-size:46px;font-weight:900}
.step .price small{font-size:16px;display:block}
.step p{font-size:16px}
.step .btn{margin-top:auto}
.s1{background:var(--lime)}.s2{background:var(--lav)}.s3{background:var(--forest);color:var(--cream)}.s3 p{color:var(--soft)}.s3 .price{color:var(--lime)}.s4{background:var(--cream);border:3px dashed var(--forest)}
.card{border-radius:36px;padding:32px;display:flex;flex-direction:column;gap:12px}
.card h3{font-size:26px;font-weight:900;line-height:1.1}
.card p{font-size:16px}
.num{font-size:15px;font-weight:900;letter-spacing:.08em}
.dots{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;align-items:flex-end}
.dot{width:74px;height:74px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:900;border:3px solid var(--forest);background:var(--cream)}
.dot.one{background:var(--lime);width:96px;height:96px;font-size:36px}
.dot.seven{background:var(--lav);opacity:.55;border-style:dashed}
.dotlbl{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;width:100%;max-width:720px;font-weight:900}
.ticks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.ticks li{font-size:17px;line-height:1.5;padding-left:34px;position:relative}
.ticks li:before{content:"";position:absolute;left:0;top:4px;width:20px;height:20px;border-radius:50%;background:var(--lime);border:2px solid var(--forest)}
.forest .ticks li:before{border-color:var(--lime);background:var(--forest)}
.logos{display:flex;flex-wrap:wrap;justify-content:center;gap:14px}
.logos span{background:var(--cream);border-radius:999px;padding:18px 30px;font-size:13px;font-weight:700;letter-spacing:.12em}
.mosaic{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.mosaic .ph{height:240px;border-radius:32px}
.arch{border-radius:999px 999px 32px 32px !important}
.cup{border-radius:32px 32px 999px 999px !important}
.chain{display:flex;align-items:center;justify-content:center}
.chain img{width:110px}
.faq{display:flex;flex-direction:column;gap:14px}
.faq details{background:var(--cream);border-radius:28px;padding:22px 28px}
.faq summary{font-weight:900;font-size:20px;cursor:pointer}
.faq p{margin-top:10px;font-size:16px}
.howto{counter-reset:s;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.howto li{background:var(--cream);border-radius:32px;padding:26px;counter-increment:s;display:flex;flex-direction:column;gap:8px}
.howto li:before{content:counter(s);width:46px;height:46px;border-radius:50%;background:var(--lime);border:3px solid var(--forest);display:flex;align-items:center;justify-content:center;font-weight:900;font-size:20px}
.howto b{font-size:20px}
.howto span{font-size:16px;line-height:1.55;color:var(--deep)}
.news form{width:100%;max-width:640px;display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.news input{flex:1 1 300px;min-width:0;font:inherit;font-size:18px;padding:17px 24px;border-radius:999px;border:3px solid var(--lime);background:var(--cream);color:var(--deep)}
.news button,.cform button{font:inherit;font-size:18px;font-weight:900;padding:17px 30px;border-radius:999px;border:0;background:var(--lime);color:var(--deep);cursor:pointer}
.sr{position:absolute;left:-9999px}
.cform{display:flex;flex-direction:column;gap:14px;width:100%}
.cform label{font-weight:900;font-size:15px}
.cform input,.cform textarea{font:inherit;font-size:17px;padding:16px 20px;border-radius:24px;border:3px solid var(--forest);background:var(--cream);color:var(--deep)}
.cform button{background:var(--forest);color:var(--cream);align-self:flex-start}
.note{font-size:14px;color:var(--deep)}
.forest .note,.deep .note{color:var(--soft)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.stat{border-radius:32px;padding:24px;display:flex;flex-direction:column;gap:4px}
.stat b{font-size:36px;font-weight:900}
.stat span{font-size:15px;line-height:1.45}
footer{background:var(--deep);color:var(--soft);padding:56px 24px 40px}
.fwrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:28px;align-items:flex-start}

footer a{color:var(--cream);text-decoration:none}
.flinks{display:flex;flex-wrap:wrap;gap:6px 22px}
.flinks a{padding:8px 0}
@media (max-width:700px){.panel{padding:32px 20px;border-radius:40px}.outline{padding:28px 20px;border-radius:40px}.sec-pad{padding:24px 16px}.top{padding:14px 16px}.hero-img{height:220px}.step{min-height:0}}
/* brand readability: light grounds inside dark panels always take forest and deep forest text */
.forest .lime,.forest .lav,.forest .creamb,.forest .soft,.deep .lime,.deep .lav,.deep .creamb,.deep .soft{color:var(--deep)}
.forest .lime p,.forest .lav p,.forest .creamb p,.forest .soft p,.forest .lime span,.forest .lav span,.forest .creamb span,.forest .soft span,.deep .lime p,.deep .lav p,.deep .creamb p,.deep .soft p{color:var(--deep)}
.news .note,.news label{color:var(--soft)}
.outline{border:3px solid var(--forest);border-radius:56px;padding:40px}
/* light cards inside forest or deep forest panels: all text deep forest */
.forest .lime,.forest .lav,.forest .creamb,.forest .soft,.deep .lime,.deep .lav,.deep .creamb,.deep .soft,.forest .lime *,.forest .lav *,.forest .creamb *,.forest .soft *,.deep .lime *,.deep .lav *,.deep .creamb *,.deep .soft *{color:var(--deep)!important}
.art{width:180px;height:auto;align-self:flex-start}
@media (max-width:700px){.outline{padding:28px 20px;border-radius:40px}}
h1,h2,h3,summary,.pill,.btn{text-wrap:balance}
p,li,span,b,label{text-wrap:pretty}
input,textarea,button,select{font-family:inherit}
.duo{display:grid;grid-template-columns:1.55fr 1fr;gap:24px;align-items:center;width:100%;max-width:920px;margin-top:8px}
.duo figure{margin:0;position:relative}
.duo img{display:block;width:100%;height:auto;object-fit:cover}
.duo-a img{aspect-ratio:3/2;border-radius:48px 180px 48px 180px}
.duo-b{transform:rotate(3deg)}
.duo-b img{aspect-ratio:1/1;border-radius:54% 46% 52% 48% / 48% 54% 46% 52%;border:4px solid var(--forest);filter:brightness(1.18) contrast(1.04) saturate(1.06)}
.duo .pill{position:absolute;white-space:nowrap;box-shadow:4px 4px 0 var(--deep)}
.duo-a .pill{left:20px;bottom:-14px;transform:rotate(-3deg)}
.duo-b .pill{left:50%;bottom:-16px;transform:translateX(-50%) rotate(-6deg)}
@media (max-width:700px){.duo{gap:14px}.duo-a img{border-radius:24px 80px 24px 80px}.duo .pill{font-size:11px;padding:6px 10px}.duo-a .pill{left:8px}}
@media (max-width:700px){.duo-b .pill{white-space:normal;width:max-content;max-width:140px;text-align:center;line-height:1.2}}
.awards{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;max-width:960px}
.award{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;width:124px;height:124px;border-radius:50%;background:var(--forest);color:var(--cream);padding:14px;font-size:13px;line-height:1.25;font-weight:700;box-shadow:4px 4px 0 var(--deep)}
.award b{color:var(--lime);font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:900;margin-bottom:6px}
.award:nth-child(odd){transform:rotate(-4deg)}
.award:nth-child(even){transform:rotate(3deg)}
.awards-label{font-size:15px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--deep);margin-top:8px}
@media (max-width:700px){.award{width:118px;height:118px;padding:12px;font-size:12px}.award b{font-size:10px}}
.mosaic .pic{padding:8px}
.mosaic .pic img{display:block;width:100%;height:100%;object-fit:cover;border-radius:24px}
.mosaic .arch.pic img{border-radius:999px 999px 24px 24px}
.mosaic .pic img.contain{object-fit:contain;background:#FBC6EC}
.award b{font-size:10px;letter-spacing:.04em;max-width:96px;line-height:1.2}
.mosaic .pic{position:relative}
.mosaic .pic img.bright{filter:brightness(1.16) contrast(1.04) saturate(1.06)}
.pic-tag{position:absolute;left:14px;bottom:14px;letter-spacing:0;white-space:nowrap;transform:rotate(-4deg);box-shadow:4px 4px 0 var(--deep)}
@media (max-width:700px){.pic-tag{font-size:11px;padding:6px 10px;left:10px;bottom:10px}}
.snaps{display:grid;grid-template-columns:1.7fr 1fr;align-items:center;width:100%;max-width:860px;margin-top:12px}
.snaps figure{margin:0;position:relative}
.snap-a{transform:rotate(-3deg);z-index:1}
.snap-a img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:36px;border:8px solid var(--cream);box-shadow:6px 6px 0 var(--deep)}
.snap-b{transform:rotate(4deg);margin-left:-40px;z-index:2}
.snap-b img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;border-radius:999px 999px 36px 36px;border:4px solid var(--forest)}
.snaps .pill{position:absolute;white-space:nowrap;letter-spacing:0;box-shadow:4px 4px 0 var(--deep)}
.snap-a .pill{left:24px;bottom:-12px;transform:rotate(-3deg)}
.snap-b .pill{left:50%;bottom:-14px;transform:translateX(-50%) rotate(-5deg)}
@media (max-width:700px){.snap-a img{border-width:5px;border-radius:24px}.snap-b{margin-left:-20px}.snaps .pill{font-size:11px;padding:6px 10px}.snap-a .pill{left:10px}}
.snap-b img{aspect-ratio:1/1;border-radius:50%}
@media (max-width:700px){.snap-b .pill{white-space:normal;width:max-content;max-width:110px;text-align:center;line-height:1.2;left:auto;right:-4px;transform:rotate(-5deg)}}
.snaps{grid-template-columns:1.3fr 1fr;max-width:940px}
.snap-b{margin-left:-56px}
@media (max-width:700px){.snap-b{margin-left:-28px}}
/* headlines 20% smaller (31 October 2026) */
.big{font-size:clamp(42px,7.2vw,112px)}
.sec{font-size:clamp(30px,4.5vw,67px)}
.mid{font-size:clamp(24px,3.2vw,45px)}
.step h3{font-size:24px}
.card h3{font-size:21px}
/* six card grids: always three per row on desktop */
.grid3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.grid3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.grid3{grid-template-columns:1fr}}
.together{margin:20px auto 28px;position:relative;width:100%;max-width:760px;transform:rotate(-2deg)}
.together img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:48px;border:8px solid var(--cream);box-shadow:6px 6px 0 var(--deep)}
.together .pill{position:absolute;left:50%;bottom:-18px;transform:translateX(-50%) rotate(-3deg);box-shadow:4px 4px 0 var(--deep);letter-spacing:0;white-space:nowrap;font-size:16px;padding:10px 20px}
@media (max-width:700px){.together img{border-width:5px;border-radius:28px}.together .pill{font-size:12px;padding:7px 12px;white-space:normal;width:max-content;max-width:240px;text-align:center;line-height:1.2}}
.touch-label{color:var(--lime);font-size:15px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;margin-top:28px}
.touch{display:flex;flex-direction:column;gap:12px;margin-top:4px;width:100%}
.touch-row{display:flex;flex-wrap:wrap;gap:10px}
.touch-row .pill{flex:1 1 auto;text-align:center;align-self:auto;white-space:nowrap}
.touch .pill{font-size:15px;padding:10px 18px;box-shadow:3px 3px 0 var(--deep)}
@media (max-width:700px){.touch .pill{font-size:13px;padding:8px 14px}}
