/* ================= multi-page additions ================= */
.menu-btn{display:none;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);place-items:center}
.menu-btn i{display:block;width:16px;height:2px;background:currentColor;position:relative;transition:background .3s}
.menu-btn i::before,.menu-btn i::after{content:"";position:absolute;left:0;width:16px;height:2px;background:currentColor;transition:transform .35s}
.menu-btn i::before{top:-5px}.menu-btn i::after{top:5px}
.menu-open .menu-btn i{background:transparent}
.menu-open .menu-btn i::before{transform:translateY(5px) rotate(45deg)}
.menu-open .menu-btn i::after{transform:translateY(-5px) rotate(-45deg)}
@media (max-width:980px){.menu-btn{display:grid}}
.mnav{position:fixed;inset:0;z-index:79;background:var(--bg);padding:calc(90px + env(safe-area-inset-top,0px)) var(--gr) calc(30px + env(safe-area-inset-bottom,0px)) var(--gl);display:flex;flex-direction:column;justify-content:space-between;visibility:hidden;opacity:0;transition:opacity .35s,visibility 0s .35s}
.menu-open .mnav{visibility:visible;opacity:1;transition:opacity .35s}
.mnav nav{display:grid;gap:4px}
.mnav nav a{font-family:var(--display);font-size:clamp(34px,8vw,56px);line-height:1.35;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-block:6px;transform:translateY(16px);opacity:0;transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .5s,color .25s}
.menu-open .mnav nav a{transform:none;opacity:1}
.mnav nav a small{font-family:var(--mono);font-size:12px;color:var(--muted)}
.mnav nav a.on{color:var(--green2)}
.mnav .mfoot{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;color:var(--fg2);font-size:14px}
.menu-open body{overflow:hidden}

/* page hero */
.phero{position:relative;padding-top:calc(150px + env(safe-area-inset-top,0px));padding-bottom:70px;overflow:hidden;border-bottom:1px solid var(--line)}
.phero .grid{position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse 80% 90% at 70% 0%,#000 10%,transparent 70%);-webkit-mask-image:radial-gradient(ellipse 80% 90% at 70% 0%,#000 10%,transparent 70%);opacity:.5}
.phero .glow{position:absolute;width:50vmax;height:50vmax;inset-inline-end:-10vmax;top:-20vmax;background:radial-gradient(circle,var(--glow),transparent 62%);pointer-events:none}
.phero .mk{position:absolute;width:min(40vw,420px);inset-inline-start:-6%;bottom:-30%;color:rgba(127,127,127,.06)}
.phero .in{position:relative}
.crumbs{display:flex;gap:8px;align-items:center;font-size:13.5px;color:var(--muted)}
.crumbs a:hover{color:var(--green2)}
.phero h1{font-size:clamp(52px,9vw,120px);line-height:1.2;margin-top:18px}
.phero h1 em{font-style:normal;color:var(--green2)}
.phero .lead{font-size:clamp(16px,1.8vw,19px)}
.pnums{display:flex;gap:28px;flex-wrap:wrap;margin-top:30px}
.pnums div{display:grid}
.pnums b{font-family:var(--display);font-size:clamp(30px,3.6vw,44px);line-height:1.2;direction:ltr;text-align:start}
.pnums small{color:var(--muted);font-size:13px}

/* section links */
.more-row{display:flex;justify-content:center;margin-top:34px}
.head2{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap}

/* services page */
.dchips{position:sticky;top:calc(68px + env(safe-area-inset-top,0px));z-index:5;background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.dchips .in{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-block:12px}
.dchips .in::-webkit-scrollbar{display:none}
.dchips a{flex:none;padding:8px 16px;border-radius:99px;border:1px solid var(--line);font-size:14px;color:var(--fg2);transition:background .25s,color .25s,border-color .25s}
.dchips a.on,.dchips a:hover{background:var(--green);border-color:var(--green);color:var(--paper)}
.dept{display:grid;grid-template-columns:.85fr 1.15fr;gap:40px;padding-block:80px;border-bottom:1px solid var(--line);scroll-margin-top:130px}
.dept:last-child{border-bottom:0}
.dept .info{position:sticky;top:150px;align-self:start}
.dept .num{font-family:var(--mono);font-size:13px;color:var(--green2)}
.dept .icx{width:64px;height:64px;border-radius:18px;background:var(--green);color:var(--paper);display:grid;place-items:center;margin-bottom:18px}
.dept .icx svg{width:30px;height:30px}
.dept h2{font-size:clamp(36px,4.6vw,56px);line-height:1.25;margin-top:6px}
.dept .en{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--muted);display:block;margin-top:6px}
.dept p.d{color:var(--fg2);margin-top:14px;max-width:44ch}
.dept .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.dept .tags span{font-size:12.5px;border:1px solid var(--line);border-radius:99px;padding:3px 12px;color:var(--fg2)}
.dept .acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.icards{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-content:start}
.icard{position:relative;border:1px solid var(--line);border-radius:22px;padding:22px;background:var(--card);display:flex;flex-direction:column;justify-content:space-between;gap:30px;min-height:170px;overflow:hidden;transition:border-color .3s,transform .3s}
.icard:hover{border-color:var(--green);transform:translateY(-4px)}
.icard b{font-size:17px;font-weight:600;display:block}
.icard small{color:var(--muted);font-size:12.5px}
.icard .pr{font-family:var(--display);font-size:32px;line-height:1;direction:ltr;text-align:end}
[dir="ltr"] .icard .pr{text-align:start}
.icard .pr em{font-style:normal;font-family:var(--f);font-size:13px;color:var(--muted);margin-left:4px}
.icard .go{position:absolute;top:18px;inset-inline-end:18px;width:34px;height:34px;border-radius:50%;background:var(--card2);display:grid;place-items:center;transition:background .3s,color .3s}
.icard:hover .go{background:var(--green);color:var(--paper)}
.icard.browse{background:var(--green);border-color:var(--green);color:var(--paper);justify-content:center;align-items:flex-start;gap:12px}
.icard.browse .go{background:rgba(250,250,248,.18)}
.icard.browse b{font-family:var(--display);font-size:26px;font-weight:700}
@media (max-width:900px){.dept{grid-template-columns:1fr;gap:26px;padding-block:60px}.dept .info{position:static}}
@media (max-width:520px){.icards{grid-template-columns:1fr}}

/* work page */
.wgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:10px}
.wcard{position:relative;border-radius:24px;overflow:hidden;aspect-ratio:4/5;cursor:pointer;background:var(--card2);text-align:start}
.wcard.wide{grid-column:span 2;aspect-ratio:8/5}
.wcard .cv{position:absolute;inset:0;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.wcard:hover .cv{transform:scale(1.05)}
.wcard .ov{position:absolute;inset:auto 0 0 0;padding:20px;display:flex;justify-content:space-between;align-items:end;gap:10px;background:linear-gradient(transparent,rgba(0,0,0,.55));color:#fff}
.wcard .ov b{font-family:var(--display);font-size:clamp(26px,3vw,36px);display:block;line-height:1.2}
.wcard .ov small{font-size:12.5px;opacity:.85}
.wcard .ov i{width:42px;height:42px;border-radius:50%;background:#FAFAF8;color:#282B32;display:grid;place-items:center;font-style:normal;flex:none;transform:scale(.8);opacity:.85;transition:transform .35s,opacity .35s}
.wcard:hover .ov i{transform:scale(1);opacity:1}
.wcard .cnt{position:absolute;top:16px;inset-inline-start:16px;font-family:var(--mono);font-size:11px;background:rgba(0,0,0,.4);color:#fff;border-radius:99px;padding:2px 10px}
@media (max-width:900px){.wgrid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.wgrid{grid-template-columns:1fr}.wcard.wide{grid-column:auto;aspect-ratio:4/5}}
.lb{position:fixed;inset:0;z-index:150;background:rgba(10,11,13,.94);display:grid;grid-template-rows:auto 1fr auto;padding:calc(16px + env(safe-area-inset-top,0px)) var(--gr) calc(16px + env(safe-area-inset-bottom,0px)) var(--gl);gap:14px;color:#FAFAF8;visibility:hidden;opacity:0;transition:opacity .35s,visibility 0s .35s}
.lb.on{visibility:visible;opacity:1;transition:opacity .35s}
.lb-top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.lb-top b{font-family:var(--display);font-size:28px}
.lb-top small{display:block;color:#A7ADB5;font-size:13px}
.lb-close{width:46px;height:46px;border-radius:50%;border:1px solid rgba(250,250,248,.25);display:grid;place-items:center;font-size:20px}
.lb-stage{position:relative;border-radius:22px;overflow:hidden;min-height:0;touch-action:pan-y;background:#20242A}
.lb-stage .wk-img{position:absolute;inset:0}
.lb-bot{display:flex;justify-content:space-between;align-items:center;gap:12px}
.lb-bot .dots{display:flex;gap:6px}
.lb-bot .dots button{width:28px;height:6px;border-radius:6px;background:rgba(250,250,248,.25);transition:background .3s,width .3s}
.lb-bot .dots button.on{background:#35A27F;width:44px}
.lb-nav{display:flex;gap:8px}
.lb-nav button{width:50px;height:50px;border-radius:50%;border:1px solid rgba(250,250,248,.25);display:grid;place-items:center;font-size:18px}
.lb-nav button:hover{background:#27896D;border-color:#27896D}

/* about page */
.story{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start}
.story .big{font-family:var(--display);font-size:clamp(28px,3.6vw,44px);line-height:1.55}
.story .big em{font-style:normal;color:var(--green2)}
.story .txt{display:grid;gap:16px;color:var(--fg2);font-size:17px}
.mean{position:relative;border-radius:32px;background:var(--green);color:var(--paper);padding:clamp(30px,5vw,64px);overflow:hidden;display:grid;grid-template-columns:1.2fr .8fr;gap:30px;align-items:center}
.mean small{opacity:.8}
.mean h2{font-size:clamp(34px,5vw,64px);line-height:1.35;margin-top:10px}
.mean svg{width:100%;max-width:300px;justify-self:center;color:var(--paper);overflow:visible}
@media (max-width:860px){.story{grid-template-columns:1fr;gap:24px}.mean{grid-template-columns:1fr}.mean svg{max-width:180px}}
.vm2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.vm2 div{border:1px solid var(--line);border-radius:26px;padding:28px;background:var(--card)}
.vm2 .en{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--green2)}
.vm2 h3{font-size:clamp(28px,3vw,38px);margin-top:8px}
.vm2 p{color:var(--fg2);margin-top:10px}
@media (max-width:760px){.vm2{grid-template-columns:1fr}}
.offer{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:40px}
.offer a{border:1px solid var(--line);border-radius:22px;padding:22px;background:var(--card);display:grid;gap:12px;align-content:start;transition:border-color .3s,transform .3s}
.offer a:hover{border-color:var(--green);transform:translateY(-4px)}
.offer .ic{width:48px;height:48px;border-radius:14px;background:var(--card2);color:var(--green2);display:grid;place-items:center}
.offer .ic svg{width:24px;height:24px}
.offer b{font-family:var(--display);font-size:24px;font-weight:700}
.offer p{color:var(--fg2);font-size:14.5px}
@media (max-width:900px){.offer{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.offer{grid-template-columns:1fr}}
.traits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:38px}
.trait{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:24px;padding:24px 22px 22px;background:var(--card);display:flex;flex-direction:column;gap:10px;transition:border-color .35s,transform .35s,background .35s}
.trait .tn{position:absolute;top:14px;inset-inline-end:18px;font-family:var(--display);font-size:56px;line-height:1;color:var(--line);transition:color .35s}
.trait i{font-style:normal;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--green2)}
.trait b{font-family:var(--display);font-size:clamp(22px,2vw,27px);line-height:1.35;margin-top:44px}
.trait p{color:var(--fg2);font-size:14px;line-height:1.75}
.trait:hover{border-color:var(--green);transform:translateY(-4px);background:var(--tint)}
.trait:hover .tn{color:var(--green)}
@media (max-width:1000px){.traits{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.traits{grid-template-columns:1fr}.trait{min-height:0}}

/* process page */
.tl{position:relative;margin-top:50px;width:min(100%,860px);margin-inline:auto}
.tl .rail{position:absolute;top:34px;bottom:34px;inset-inline-start:33px;width:2px;background:var(--line)}
.tl .rail i{position:absolute;inset:0 0 auto 0;height:0;background:var(--green2)}
.tst{display:grid;grid-template-columns:68px 1fr;gap:22px;padding-block:22px;position:relative}
.tst .n{width:68px;height:68px;border-radius:50%;background:var(--bg);border:1px solid var(--line);display:grid;place-items:center;font-family:var(--mono);font-size:14px;color:var(--fg2);position:relative;z-index:1;transition:all .5s}
.tst.on .n{background:var(--green);border-color:var(--green);color:var(--paper)}
.tst .box{border:1px solid var(--line);border-radius:22px;background:var(--card);padding:22px;transition:border-color .5s}
.tst.on .box{border-color:rgba(53,162,127,.45)}
.tst h3{font-size:clamp(26px,3vw,34px)}
.tst p{color:var(--fg2);margin-top:6px}
.tst .meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.tst .meta span{font-family:var(--mono);font-size:11.5px;background:var(--tint);color:var(--green2);padding:3px 10px;border-radius:99px}
.dur{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:40px}
.dur div{border:1px solid var(--line);border-radius:22px;padding:24px;background:var(--card)}
.dur b{font-family:var(--display);font-size:clamp(46px,5vw,64px);line-height:1;display:block}
.dur b em{font-style:normal;font-family:var(--f);font-size:16px;color:var(--green2);margin-inline-start:6px}
.dur span{display:block;margin-top:10px;font-weight:600}
.dur small{color:var(--muted)}
@media (max-width:760px){.dur{grid-template-columns:1fr}}
.infos{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.infos div{border:1px solid var(--line);border-radius:22px;padding:24px;background:var(--card)}
.infos h3{font-size:24px}
.infos p{color:var(--fg2);margin-top:6px}
.infos .pay{margin-top:12px}
@media (max-width:760px){.infos{grid-template-columns:1fr}}

/* faq page */
.ftabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.ftabs button{padding:9px 18px;border-radius:99px;border:1px solid var(--line);font-size:14px;font-weight:600;transition:background .25s,color .25s,border-color .25s}
.ftabs button.on{background:var(--green);border-color:var(--green);color:var(--paper)}
.fhelp{border-radius:26px;background:var(--green);color:var(--paper);padding:26px;margin-top:20px;position:relative;overflow:hidden}
.fhelp h3{font-size:28px}
.fhelp p{opacity:.88;margin-top:6px}
.fhelp .btn{background:var(--paper);color:var(--charcoal);margin-top:16px}
.plinks{display:grid;gap:8px;margin-top:20px}
.plinks a{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border:1px solid var(--line);border-radius:16px;background:var(--card);font-size:15px;transition:border-color .25s}
.plinks a:hover{border-color:var(--green)}

/* contact page */
.chan{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}
.chan a{border:1px solid var(--line);border-radius:22px;padding:22px;background:var(--card);display:grid;gap:22px;transition:border-color .3s,transform .3s}
.chan a:hover{border-color:var(--green);transform:translateY(-4px)}
.chan .ic{width:46px;height:46px;border-radius:50%;background:var(--card2);color:var(--green2);display:grid;place-items:center;transition:background .3s,color .3s}
.chan a:hover .ic{background:var(--green);color:var(--paper)}
.chan .ic svg{width:21px;height:21px}
.chan b{font-size:18px;display:block}
.chan small{font-family:var(--mono);font-size:12.5px;color:var(--muted);direction:ltr;display:inline-block}
@media (max-width:860px){.chan{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.chan{grid-template-columns:1fr}}

/* home CTA band */
.ctab{position:relative;border-radius:36px;background:var(--green);color:var(--paper);padding:clamp(36px,6vw,80px);overflow:hidden;text-align:center}
.ctab svg{position:absolute;width:min(70vw,640px);left:50%;top:50%;transform:translate(-50%,-50%);color:rgba(250,250,248,.08)}
.ctab h2{font-size:clamp(40px,7vw,96px);line-height:1.3;position:relative}
.ctab p{position:relative;opacity:.9;margin:12px auto 0;max-width:44ch}
.ctab .row{position:relative;display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:28px}
.ctab .btn-w{background:var(--paper);color:var(--charcoal)}
.ctab .btn-l{border:1px solid rgba(250,250,248,.5)}
.ctab .btn-l:hover{background:rgba(250,250,248,.12)}