/* ─────────────────────────────────────────────────────────
   devirian — shared stylesheet
   ───────────────────────────────────────────────────────── */

*,*::before,*::after{box-sizing:border-box}
html,body,h1,h2,h3,h4,p,ul,ol,li,figure,dl,dd,fieldset,legend{margin:0;padding:0;border:0}
ul,ol{list-style:none}
img,svg,canvas{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit;background:none;border:0;border-radius:0}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
::selection{background:var(--acid);color:#0B0B0B}

:root{
  --bg:#0B0B0B;
  --bg-2:#141414;
  --bg-3:#1C1C1B;
  --ink:#F2F2EF;
  --ink-2:#8E8E88;
  --ink-3:#575752;
  --ink-4:#333330;
  --line:#2B2B29;
  --line-2:#3D3D3A;
  --acid:#CBFF3C;
  --acid-d:#9FD016;
  --paper:#F2F2EF;
  --red:#FF4B2B;

  --fd:'Archivo',Impact,'Arial Black',sans-serif;
  --fm:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,monospace;

  --pad:clamp(14px,3.2vw,44px);
  --maxw:1560px;
  --hair:1px solid var(--line);
  --nav:60px;
  --ease:cubic-bezier(.7,0,.2,1);
}

html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  font-family:var(--fm);font-weight:400;
  background:var(--bg);color:var(--ink);
  font-size:14px;line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.lock{overflow:hidden}
main{padding-top:var(--nav);position:relative;z-index:1}

.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad);position:relative}

.grid-rules{position:fixed;inset:0;z-index:0;pointer-events:none;
  max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad);
  display:grid;grid-template-columns:repeat(12,1fr)}
.grid-rules i{border-left:1px solid rgba(242,242,239,.035)}
.grid-rules i:last-child{border-right:1px solid rgba(242,242,239,.035)}

/* ─── type ─── */
.dsp{font-family:var(--fd);font-weight:900;text-transform:uppercase;
  line-height:.85;letter-spacing:-.045em}
.d1{font-size:clamp(44px,10.6vw,178px)}
.d2{font-size:clamp(34px,7vw,110px)}
.d2s{font-size:clamp(30px,5.4vw,86px)}
.d3{font-size:clamp(22px,3.4vw,54px);line-height:.92;letter-spacing:-.035em}
.d4{font-family:var(--fd);font-weight:800;text-transform:uppercase;
  font-size:clamp(16px,1.6vw,23px);line-height:1;letter-spacing:-.02em}
.dsp em,.d4 em{font-style:normal;color:var(--acid)}

.lbl{font-family:var(--fm);font-size:11px;font-weight:500;letter-spacing:.15em;
  text-transform:uppercase;color:var(--ink-3)}
.lbl b{color:var(--acid);font-weight:500}
.txt{font-size:14.5px;line-height:1.62;color:var(--ink-2);max-width:58ch}
.txt b{color:var(--ink);font-weight:500}
.txt a{color:var(--acid);border-bottom:1px solid currentColor}
.lead{font-size:clamp(16px,1.4vw,19px);line-height:1.55;color:var(--ink-2);max-width:52ch}
.lead b{color:var(--ink);font-weight:500}

/* ─── section frame ─── */
.sec{position:relative;z-index:2;border-top:var(--hair)}
.sec-in{padding-block:clamp(46px,7vw,104px)}
.sec-hd{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;
  padding-bottom:clamp(24px,3.4vw,44px)}
.sec-hd .n{font-family:var(--fm);font-size:11px;letter-spacing:.15em;color:var(--acid)}
.sec-hd .t{font-family:var(--fm);font-size:11px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--ink-3)}
.sec-hd .r{margin-left:auto;font-family:var(--fm);font-size:11px;letter-spacing:.12em;color:var(--ink-4)}

.inv{background:var(--paper);color:#0B0B0B}
.inv .txt{color:#3A3A36}
.inv .txt b{color:#0B0B0B}
.inv .lead{color:#3A3A36}
.inv .lead b{color:#0B0B0B}
.inv .lbl{color:#6A6A63}
.inv .sec-hd .t{color:#6A6A63}
.inv .sec-hd .n{color:#0B0B0B;background:var(--acid);padding:2px 6px}
.inv .sec-hd .r{color:#9A9A92}
.inv .dsp em{color:#0B0B0B;background:var(--acid);padding:0 .08em}

/* ─── page hero (inner pages) ─── */
.ph{position:relative;z-index:2;padding-block:clamp(48px,8vw,120px) clamp(36px,5vw,72px);
  border-bottom:var(--hair);overflow:hidden}
.ph-k{display:flex;gap:18px;align-items:baseline;margin-bottom:clamp(18px,2.4vw,32px)}
.ph-k .n{font-size:11px;letter-spacing:.15em;color:var(--acid)}
.ph-k .t{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-3)}
.ph h1{max-width:12ch}
.ph-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,70px);align-items:end;
  margin-top:clamp(22px,3vw,40px)}
.ph-row .lead{max-width:46ch}
.ph-act{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.ph-bg{position:absolute;right:var(--pad);bottom:-.1em;font-family:var(--fd);font-weight:900;
  font-size:clamp(120px,22vw,360px);line-height:.8;letter-spacing:-.06em;color:transparent;
  -webkit-text-stroke:1px var(--line);pointer-events:none;user-select:none;z-index:-1}

/* ─── nav ─── */
.nav{position:fixed;inset:0 0 auto;z-index:60;background:rgba(11,11,11,.92);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:var(--hair)}
.nav-in{display:flex;align-items:center;max-width:var(--maxw);margin:0 auto;
  padding-inline:var(--pad);height:var(--nav);gap:clamp(18px,3vw,48px)}
.brand{display:flex;align-items:center;gap:11px;flex:none}
.brand .mk{width:22px;height:22px;flex:none}
.brand b{font-family:var(--fd);font-weight:900;font-size:19px;letter-spacing:-.04em;text-transform:lowercase}
.nav-links{display:flex;align-items:center;gap:clamp(4px,1.2vw,14px);margin-left:auto}
.nav-links a{display:inline-flex;align-items:center;gap:9px;padding:8px 10px;
  font-family:var(--fd);font-weight:700;font-size:13px;letter-spacing:.02em;text-transform:uppercase;
  color:var(--ink-2);transition:color .15s linear}
.nav-links a::before{content:'';width:6px;height:6px;background:var(--acid);
  transform:scale(0);transition:transform .22s var(--ease)}
.nav-links a:hover{color:var(--ink)}
.nav-links a:hover::before{transform:scale(1)}
.nav-links a.on{color:var(--ink)}
.nav-links a.on::before{transform:scale(1)}
.nav-r{display:flex;align-items:center;gap:clamp(10px,1.6vw,22px);flex:none}
.lgs{display:flex;align-items:center;gap:2px;padding:3px;border:1px solid var(--line-2)}
.lgs button{padding:5px 9px;font-family:var(--fm);font-size:11px;font-weight:500;letter-spacing:.08em;
  color:var(--ink-3);transition:color .12s linear,background .12s linear}
.lgs button.on{color:#0B0B0B;background:var(--acid);font-weight:700}
.lgs button:hover:not(.on){color:var(--ink)}
.nav-cta{position:relative;display:inline-flex;align-items:center;gap:10px;height:38px;padding:0 16px 0 15px;
  font-family:var(--fd);font-weight:800;font-size:12px;letter-spacing:.04em;text-transform:uppercase;
  color:#0B0B0B;background:var(--acid);isolation:isolate;overflow:hidden;white-space:nowrap;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%);transition:color .18s linear}
.nav-cta::before{content:'';position:absolute;inset:0;z-index:-1;background:var(--ink);
  transform:translateX(-101%);transition:transform .3s var(--ease)}
.nav-cta:hover::before{transform:none}
.nav-cta .ar{width:16px;height:10px;flex:none;transition:transform .3s var(--ease)}
.nav-cta .ar path{stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:square}
.nav-cta:hover .ar{transform:translateX(4px)}
.bg{display:none;align-items:center;justify-content:center;width:40px;height:40px;margin-right:-10px}
.bg s{display:block;width:20px;height:2px;background:var(--ink);position:relative;text-decoration:none}
.bg s::before,.bg s::after{content:'';position:absolute;left:0;width:20px;height:2px;background:var(--ink);transition:transform .2s var(--ease),top .2s var(--ease)}
.bg s::before{top:-6px} .bg s::after{top:6px}
.bg.on s{background:transparent}
.bg.on s::before{top:0;transform:rotate(45deg)}
.bg.on s::after{top:0;transform:rotate(-45deg)}

.mm{position:fixed;inset:var(--nav) 0 0;z-index:58;background:var(--bg);display:none;flex-direction:column;overflow:auto}
.mm.on{display:flex}
.mm a{border-bottom:var(--hair);padding:20px var(--pad);
  font-family:var(--fd);font-weight:800;font-size:30px;text-transform:uppercase;letter-spacing:-.03em;
  display:flex;justify-content:space-between;align-items:center}
.mm a em{font-family:var(--fm);font-style:normal;font-size:11px;color:var(--acid);letter-spacing:.14em}
.mm a.on{color:var(--acid)}

/* ─── buttons ─── */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:14px;
  height:52px;padding:0 24px 0 22px;
  font-family:var(--fd);font-weight:800;font-size:13px;letter-spacing:.05em;text-transform:uppercase;
  line-height:1;color:#0B0B0B;background:var(--acid);
  isolation:isolate;overflow:hidden;white-space:nowrap;
  clip-path:polygon(0 0,calc(100% - 13px) 0,100% 13px,100% 100%,0 100%);
  transition:color .2s linear}
.btn::before{content:'';position:absolute;inset:0;z-index:-1;background:var(--ink);
  transform:translateX(-101%);transition:transform .32s var(--ease)}
.btn:hover{color:#0B0B0B}
.btn:hover::before{transform:none}
.btn .ar{width:18px;height:11px;flex:none;transition:transform .32s var(--ease)}
.btn:hover .ar{transform:translateX(5px)}
.btn .ar path{stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:square}
.btn:active{transform:translateY(1px)}

.btn-o{background:transparent;color:var(--ink);clip-path:none;
  box-shadow:inset 0 0 0 1px var(--line-2)}
.btn-o::before{background:var(--acid)}
.btn-o::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(var(--acid),var(--acid)) 0 0/12px 2px no-repeat,
    linear-gradient(var(--acid),var(--acid)) 0 0/2px 12px no-repeat,
    linear-gradient(var(--acid),var(--acid)) 100% 100%/12px 2px no-repeat,
    linear-gradient(var(--acid),var(--acid)) 100% 100%/2px 12px no-repeat;
  transition:opacity .2s linear}
.btn-o:hover{color:#0B0B0B}
.btn-o:hover::after{opacity:0}

.btn-ink{background:var(--ink);color:#0B0B0B}
.btn-ink::before{background:var(--acid)}

.btn-dark{background:#0B0B0B;color:var(--acid)}
.btn-dark::before{background:var(--ink)}
.btn-dark:hover{color:#0B0B0B}

.btn-lg{height:62px;padding:0 30px 0 26px;font-size:15px;gap:18px;
  clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%)}
.btn-lg .ar{width:24px;height:12px}
.btn-sm{height:42px;padding:0 16px;font-size:11.5px;gap:10px;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}
.btn-blk{width:100%}

.lnk{display:inline-flex;align-items:center;gap:10px;font-family:var(--fd);font-weight:800;
  font-size:13px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink);position:relative;
  padding-bottom:6px}
.lnk::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--acid);
  transform:scaleX(.28);transform-origin:left;transition:transform .32s var(--ease)}
.lnk:hover::after{transform:none}
.lnk .ar{width:18px;height:11px;transition:transform .32s var(--ease)}
.lnk .ar path{stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:square}
.lnk:hover .ar{transform:translateX(5px)}
.inv .lnk{color:#0B0B0B}

/* ─── hero (home) ─── */
.hero{position:relative;min-height:calc(100svh - var(--nav));display:flex;flex-direction:column;overflow:hidden}
#ascii,#asciiHot{position:absolute;inset:0;z-index:0;margin:0;
  font-family:var(--fm);font-size:12px;line-height:1;letter-spacing:0;
  white-space:pre;overflow:hidden;pointer-events:none;user-select:none}
#ascii{color:#3B3B37}
#asciiHot{color:var(--acid);opacity:.85}
.hero-body{position:relative;z-index:2;flex:1;display:flex;flex-direction:column;justify-content:center;
  padding-block:clamp(40px,7vh,90px)}
.hero h1 span{display:block}
.hero h1{text-shadow:0 0 26px rgba(11,11,11,.9),0 0 8px rgba(11,11,11,.8)}
.hero-sub{margin-top:clamp(22px,3vh,38px);display:flex;flex-wrap:wrap;gap:14px 26px;align-items:flex-start}
.hero-sub .lead{background:var(--bg);box-shadow:.5em 0 0 var(--bg),-.5em 0 0 var(--bg);max-width:44ch}
.hero-act{margin-top:clamp(26px,3.6vh,46px);display:flex;flex-wrap:wrap;gap:12px}
.hero-meta{position:relative;z-index:2;display:flex;gap:0;border-top:var(--hair);background:var(--bg)}
.hero-meta div{flex:1;padding:14px clamp(14px,2.4vw,34px);border-right:var(--hair);
  display:flex;flex-direction:column;gap:5px}
.hero-meta div:last-child{border-right:0}
.hero-meta b{font-family:var(--fd);font-weight:800;font-size:clamp(15px,1.5vw,20px);text-transform:uppercase;letter-spacing:-.01em}

.duo{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr 1fr;
  border-top:var(--hair);background:var(--bg)}
.duo a{padding:clamp(18px,2.4vw,30px) 0;position:relative;overflow:hidden;isolation:isolate;
  transition:color .15s linear}
.duo a:not(:last-child){border-right:var(--hair)}
.duo a::before{content:'';position:absolute;inset:0;background:var(--acid);z-index:-1;
  transform:translateY(101%);transition:transform .3s var(--ease)}
.duo a:hover::before{transform:none}
.duo a .in{padding-inline:clamp(14px,2.4vw,34px);display:flex;flex-direction:column;gap:8px}
.duo a .k{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--acid);transition:color .15s linear}
.duo a .h{font-family:var(--fd);font-weight:900;text-transform:uppercase;letter-spacing:-.035em;
  font-size:clamp(20px,2.4vw,36px);line-height:.9}
.duo a .p{font-size:12.5px;color:var(--ink-3);transition:color .15s linear;display:flex;justify-content:space-between;gap:10px}
.duo a:hover{color:#0B0B0B}
.duo a:hover .k,.duo a:hover .p{color:#0B0B0B}

/* ─── ticker ─── */
.tick{border-top:var(--hair);border-bottom:var(--hair);background:var(--bg);
  overflow:hidden;position:relative;z-index:2;padding:11px 0}
.tick-t{display:flex;width:max-content;animation:mq 34s linear infinite}
.tick span{font-family:var(--fd);font-weight:800;text-transform:uppercase;font-size:15px;
  letter-spacing:-.01em;padding-right:26px;white-space:nowrap;color:var(--ink)}
.tick span s{text-decoration:none;color:var(--acid);padding-right:26px}
@keyframes mq{to{transform:translateX(-50%)}}
.tick:hover .tick-t{animation-play-state:paused}

/* ─── manifesto ─── */
.man{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,70px);align-items:start}
.man-r{padding-top:8px;display:flex;flex-direction:column;gap:18px}
.man-r .txt{max-width:46ch}

/* ─── service cards ─── */
.svc{display:grid;grid-template-columns:repeat(3,1fr);border-left:var(--hair);border-top:var(--hair)}
.svc a{border-right:var(--hair);border-bottom:var(--hair);padding:clamp(18px,2.2vw,30px);
  display:flex;flex-direction:column;gap:14px;min-height:300px;position:relative;isolation:isolate;overflow:hidden;
  transition:color .15s linear}
.svc a::before{content:'';position:absolute;inset:0;background:var(--acid);z-index:-1;
  transform:translateY(101%);transition:transform .3s var(--ease)}
.svc a:hover::before{transform:none}
.svc a:hover{color:#0B0B0B}
.svc .k{font-size:11px;letter-spacing:.15em;color:var(--acid);transition:color .15s linear}
.svc a:hover .k,.svc a:hover .p,.svc a:hover .f{color:rgba(11,11,11,.7)}
.svc h3{font-family:var(--fd);font-weight:900;text-transform:uppercase;letter-spacing:-.035em;
  font-size:clamp(22px,2.6vw,38px);line-height:.9}
.svc .p{font-size:13px;line-height:1.55;color:var(--ink-2);max-width:36ch;transition:color .15s linear}
.svc .f{margin-top:auto;display:flex;justify-content:space-between;align-items:center;
  padding-top:14px;border-top:1px solid var(--line);font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3);transition:color .15s linear}
.svc a:hover .f{border-top-color:rgba(11,11,11,.25)}
.svc .f b{font-family:var(--fd);font-weight:800;font-size:15px;letter-spacing:0;color:inherit}

/* ─── service detail rows ─── */
.rows{border-top:var(--hair)}
.row{display:grid;grid-template-columns:60px 1.1fr 1fr 180px;gap:clamp(14px,2.4vw,40px);
  padding:clamp(22px,2.6vw,36px) 0;border-bottom:var(--hair);align-items:start;
  transition:background .15s linear;position:relative}
.row:hover{background:var(--bg-2)}
.row::before{content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--acid);
  transform:scaleY(0);transition:transform .3s var(--ease)}
.row:hover::before{transform:none}
.row .n{font-size:11px;letter-spacing:.14em;color:var(--ink-3);padding-top:6px}
.row h3{font-family:var(--fd);font-weight:900;text-transform:uppercase;letter-spacing:-.03em;
  font-size:clamp(20px,2.4vw,36px);line-height:.94}
.row .p{font-size:13.5px;line-height:1.6;color:var(--ink-2)}
.row .p ul{margin-top:12px;display:flex;flex-direction:column;gap:5px}
.row .p li{padding-left:16px;position:relative;font-size:12.5px;color:var(--ink-2)}
.row .p li::before{content:'';position:absolute;left:0;top:.6em;width:6px;height:6px;background:var(--acid)}
.row .pr{display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.row .pr b{font-family:var(--fd);font-weight:900;font-size:clamp(22px,2.2vw,32px);letter-spacing:-.03em;color:var(--acid);line-height:1}
.row .pr span{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.inv .rows{border-top-color:rgba(11,11,11,.14)}
.inv .row{border-bottom-color:rgba(11,11,11,.14)}
.inv .row:hover{background:rgba(11,11,11,.045)}
.inv .row .n{color:#9A9A92}
.inv .row .p,.inv .row .p li{color:#4A4A45}
.inv .row .pr b{color:#0B0B0B}
.inv .row .pr span{color:#6A6A63}

/* ─── estimate ─── */
.est{border:var(--hair);background:var(--bg-2);position:relative}
.est-tabs{display:grid;grid-template-columns:repeat(3,1fr);position:relative;border-bottom:var(--hair)}
.est-tab{display:flex;align-items:center;gap:12px;padding:18px clamp(14px,2vw,26px);text-align:left;
  font-family:var(--fd);font-weight:800;font-size:clamp(13px,1.3vw,17px);text-transform:uppercase;letter-spacing:-.01em;
  color:var(--ink-3);border-right:var(--hair);transition:color .15s linear}
.est-tab:last-of-type{border-right:0}
.est-tab i{font-family:var(--fm);font-style:normal;font-size:11px;letter-spacing:.14em;color:var(--ink-4);font-weight:500}
.est-tab.on{color:var(--ink)}
.est-tab.on i,.est-tab.done i{color:var(--acid)}
.est-tab.done{color:var(--ink-2)}
.est-bar{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--line)}
.est-bar s{display:block;height:100%;background:var(--acid);width:33.33%;transition:width .4s var(--ease)}
.est-body{padding:clamp(20px,2.6vw,40px)}
.est-step{display:none}
.est-step.on{display:block;animation:estin .35s var(--ease)}
@keyframes estin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.est-p{font-size:13px;color:var(--ink-2);margin-bottom:clamp(16px,2vw,26px);max-width:60ch}
.est-nav{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:clamp(20px,2.6vw,36px);flex-wrap:wrap}

.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.tile{position:relative;text-align:left;padding:18px 18px 16px;border:1px solid var(--line-2);background:var(--bg);
  display:flex;flex-direction:column;gap:10px;min-height:168px;transition:border-color .15s linear,transform .25s var(--ease)}
.tile:hover{border-color:var(--ink-3);transform:translateY(-2px)}
.tile .k{font-size:11px;letter-spacing:.14em;color:var(--ink-4)}
.tile b{font-family:var(--fd);font-weight:800;font-size:clamp(16px,1.5vw,21px);text-transform:uppercase;letter-spacing:-.02em;line-height:1}
.tile span{font-size:12px;line-height:1.5;color:var(--ink-3)}
.tile .f{margin-top:auto;display:flex;justify-content:space-between;font-size:11px;letter-spacing:.08em;color:var(--ink-2);padding-top:10px;border-top:1px solid var(--line)}
.tile .f i{font-style:normal;color:var(--acid)}
.tile::after{content:'';position:absolute;top:10px;right:10px;width:12px;height:12px;border:1px solid var(--line-2);transition:.15s linear}
.tile.on{border-color:var(--acid);box-shadow:inset 0 0 0 1px var(--acid)}
.tile.on::after{background:var(--acid);border-color:var(--acid)}

.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{display:inline-flex;align-items:center;gap:12px;padding:12px 16px 12px 14px;border:1px solid var(--line-2);background:var(--bg);
  text-align:left;transition:border-color .15s linear,background .15s linear}
.chip:hover{border-color:var(--ink-3)}
.chip .bx{width:14px;height:14px;border:1px solid var(--line-2);display:grid;place-items:center;flex:none}
.chip .bx::after{content:'';width:6px;height:6px;background:var(--acid);transform:scale(0);transition:transform .15s var(--ease)}
.chip.on{border-color:var(--acid);background:var(--bg-3)}
.chip.on .bx{border-color:var(--acid)}
.chip.on .bx::after{transform:scale(1)}
.chip b{font-family:var(--fd);font-weight:700;font-size:13.5px;text-transform:uppercase;letter-spacing:-.01em}
.chip span{font-size:11px;color:var(--ink-3)}
.chip .pr{font-size:11px;color:var(--acid);margin-left:6px}

.est-res{display:grid;grid-template-columns:1.2fr 1fr;border:var(--hair);background:var(--bg)}
.est-big{padding:clamp(20px,2.6vw,36px);border-right:var(--hair);display:flex;flex-direction:column;gap:12px}
.est-big b{font-family:var(--fd);font-weight:900;font-size:clamp(34px,4.6vw,72px);line-height:.9;letter-spacing:-.045em;color:var(--acid)}
.est-big em{font-style:normal;font-size:12px;letter-spacing:.06em;color:var(--ink-2)}
.est-meta{display:flex;flex-direction:column}
.est-meta div{padding:clamp(14px,1.6vw,20px) clamp(18px,2vw,26px);border-bottom:var(--hair);display:flex;flex-direction:column;gap:6px}
.est-meta div:last-child{border-bottom:0}
.est-meta b{font-family:var(--fd);font-weight:800;font-size:clamp(15px,1.5vw,20px);text-transform:uppercase;letter-spacing:-.01em}
.est-lines{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.est-lines span{padding:7px 11px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;border:var(--hair);color:var(--ink-2)}
.est-lines span b{color:var(--acid);font-weight:500;margin-left:6px}
.est-note{margin-top:18px;font-size:12px;line-height:1.6;color:var(--ink-3);max-width:70ch}
.est-sum{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px clamp(20px,2.6vw,40px);border-top:var(--hair)}
.est-sum b{font-family:var(--fd);font-weight:800;font-size:clamp(14px,1.4vw,18px);text-transform:uppercase;letter-spacing:-.01em}
.est-sum b i{font-style:normal;color:var(--acid)}

/* ─── work index ─── */
.wgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:0;border-left:var(--hair);border-top:var(--hair)}
.wk{border-right:var(--hair);border-bottom:var(--hair);display:flex;flex-direction:column;
  position:relative;overflow:hidden;grid-column:span 3;color:inherit}
.wk.big{grid-column:span 6}
.wk.big .wk-body{display:grid;grid-template-columns:1fr 1fr;gap:20px 40px;align-items:start}
.wk.big .wk-body .wk-foot{grid-column:1/-1}
.wk.third{grid-column:span 2}
.wk.third .wk-body h3{font-size:clamp(18px,1.8vw,26px)}
.wk-shot{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--bg-2);border-bottom:var(--hair)}
.wk.big .wk-shot{aspect-ratio:21/9}
.wk-shot img{width:100%;height:100%;object-fit:cover;object-position:top center;
  filter:grayscale(1) contrast(1.16) brightness(.66);
  transition:filter .2s linear,transform .7s var(--ease)}
.wk-shot::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(11,11,11,.55) 0 1px,transparent 1px 3px);
  opacity:.6;transition:opacity .2s linear}
.wk:hover .wk-shot img{filter:none;transform:scale(1.03)}
.wk:hover .wk-shot::after{opacity:0}
.wk-ix{position:absolute;top:0;left:0;z-index:2;background:var(--acid);color:#0B0B0B;
  padding:5px 10px;font-size:11px;font-weight:700;letter-spacing:.12em}
.wk-tag{position:absolute;top:0;right:0;z-index:2;background:var(--bg);
  padding:5px 10px;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--c,var(--acid));border-left:var(--hair);border-bottom:var(--hair)}
.wk-body{padding:clamp(16px,1.8vw,26px);display:flex;flex-direction:column;gap:10px;flex:1;
  transition:background .15s linear,color .15s linear}
.wk:hover .wk-body{background:var(--acid);color:#0B0B0B}
.wk-body h3{font-family:var(--fd);font-weight:900;text-transform:uppercase;letter-spacing:-.03em;
  font-size:clamp(20px,2.4vw,34px);line-height:.94}
.wk-body p{font-size:12.5px;line-height:1.55;color:var(--ink-2);transition:color .15s linear;max-width:44ch}
.wk:hover .wk-body p{color:rgba(11,11,11,.74)}
.wk-foot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding-top:12px;border-top:1px solid var(--line);font-size:11px;letter-spacing:.1em;
  color:var(--ink-4);transition:.15s linear;text-transform:uppercase}
.wk-foot .st{display:flex;gap:18px}
.wk-foot b{color:var(--acid);font-weight:500;transition:color .15s linear}
.wk-foot .go{display:inline-flex;align-items:center;gap:8px;color:var(--ink-2);font-weight:700}
.wk-foot .go .ar{width:16px;height:10px;transition:transform .3s var(--ease)}
.wk-foot .go .ar path{stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:square}
.wk:hover .wk-foot{border-top-color:rgba(11,11,11,.3);color:rgba(11,11,11,.55)}
.wk:hover .wk-foot b,.wk:hover .wk-foot .go{color:#0B0B0B}
.wk:hover .wk-foot .go .ar{transform:translateX(4px)}

/* ─── work list ─── */
.wl{display:flex;flex-direction:column;border-top:var(--hair)}
.wb{position:relative;display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(24px,4vw,72px);align-items:center;
  padding:clamp(34px,5vw,80px) clamp(14px,2vw,32px);border-bottom:var(--hair);overflow:hidden;isolation:isolate;
  cursor:pointer;color:inherit}
.wb.flip .wb-media{order:2}
.wb::before{content:'';position:absolute;inset:0;z-index:-1;background:var(--c);opacity:0;transition:opacity .35s linear}
.wb:hover::before{opacity:.05}
.wb::after{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--c);
  transform:scaleY(0);transform-origin:top;transition:transform .4s var(--ease)}
.wb:hover::after{transform:none}
.wb-ghost{position:absolute;right:clamp(10px,2vw,32px);top:-.08em;font-family:var(--fd);font-weight:900;
  font-size:clamp(120px,18vw,300px);line-height:.85;letter-spacing:-.06em;color:transparent;
  -webkit-text-stroke:1px var(--line);z-index:-1;pointer-events:none;user-select:none;transition:-webkit-text-stroke-color .3s linear}
.wb.flip .wb-ghost{right:auto;left:clamp(10px,2vw,32px)}
.wb:hover .wb-ghost{-webkit-text-stroke-color:var(--c)}
.wb-media .frame{margin-top:0;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.wb-media .frame::before,.wb-media .frame::after{border-color:var(--c)}
.wb-media .frame-shot img{filter:grayscale(1) contrast(1.1) brightness(.7);transition:filter .35s linear,transform .8s var(--ease)}
.wb:hover .wb-media .frame{transform:translateY(-4px);box-shadow:0 30px 60px -30px color-mix(in srgb,var(--c) 45%,transparent)}
.wb:hover .wb-media .frame-shot img{filter:none;transform:scale(1.02)}
.wb-media .frame-bar .live{color:var(--c)}
.wb-text{display:flex;flex-direction:column;gap:16px;min-width:0}
.wb-k{display:flex;align-items:center;gap:12px;font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.wb-k .n{color:var(--c);font-weight:700}
.wb-k .tag{padding:4px 8px;border:1px solid var(--c);color:var(--c)}
.wb-k .yr{color:var(--ink-4);margin-left:auto}
.wb h3{font-family:var(--fd);font-weight:900;text-transform:uppercase;letter-spacing:-.04em;
  font-size:clamp(30px,4.2vw,64px);line-height:.88;transition:transform .4s var(--ease)}
.wb:hover h3{transform:translateX(6px)}
.wb p{font-size:13.5px;line-height:1.6;color:var(--ink-2);max-width:46ch}
.wb-meta{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);
  padding-top:14px;border-top:1px solid var(--line)}
.wb-meta b{color:var(--ink);font-weight:500}
.wb-go{align-self:flex-start;margin-top:6px}
.wb:hover .wb-go{color:#0B0B0B}
.wb:hover .wb-go::before{transform:none}
.wb:hover .wb-go::after{opacity:0}
.wb:hover .wb-go .ar{transform:translateX(5px)}
.cs-side{display:flex;flex-direction:column;align-items:flex-end;gap:14px}
.btn .ext{font-family:var(--fm);font-size:14px}

/* ─── case page ─── */
.cs-hero{position:relative;z-index:2;padding-top:clamp(40px,6vw,88px);overflow:hidden}
.cs-top{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;margin-bottom:clamp(18px,2.4vw,32px)}
.cs-top .back{display:inline-flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-2)}
.cs-top .back:hover{color:var(--acid)}
.cs-top .back .ar{width:16px;height:10px;transform:rotate(180deg)}
.cs-top .back .ar path{stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:square}
.cs-top .ix{margin-left:auto;font-size:11px;letter-spacing:.14em;color:var(--ink-3)}
.cs-top .ix b{color:var(--acid);font-weight:500}
.cs-hero h1{max-width:14ch}
.cs-sub{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,70px);align-items:end;margin-top:clamp(20px,3vw,40px)}
.cs-tags{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.cs-tags span{padding:6px 10px;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;
  border:1px solid var(--line-2);color:var(--ink-2)}
.cs-tags span.c{border-color:var(--c);color:var(--c)}

.cs-meta{display:grid;grid-template-columns:repeat(5,1fr);border:var(--hair);margin-top:clamp(28px,4vw,56px)}
.cs-meta div{padding:14px clamp(12px,1.4vw,20px);border-right:var(--hair);display:flex;flex-direction:column;gap:6px}
.cs-meta div:last-child{border-right:0}
.cs-meta b{font-family:var(--fd);font-weight:800;font-size:clamp(14px,1.3vw,18px);text-transform:uppercase;letter-spacing:-.01em;line-height:1.1}

.frame{position:relative;border:var(--hair);background:var(--bg-2);margin-top:clamp(28px,4vw,56px)}
.frame-bar{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:var(--hair);
  font-size:11px;letter-spacing:.1em;color:var(--ink-3)}
.frame-bar i{width:9px;height:9px;border:1px solid var(--line-2);display:block}
.frame-bar i:first-child{background:var(--c,var(--acid));border-color:transparent}
.frame-bar .url{margin-left:12px;padding:4px 10px;background:var(--bg);border:var(--hair);flex:1;
  max-width:420px;color:var(--ink-2)}
.frame-bar .r{margin-left:auto;color:var(--ink-4)}
.frame-shot{position:relative;overflow:hidden}
.frame-shot img{width:100%;height:auto;display:block}
.frame-shot::after{content:'';position:absolute;inset:0;pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(242,242,239,.04)}
.frame::before,.frame::after{content:'';position:absolute;width:14px;height:14px;pointer-events:none;
  border:2px solid var(--acid);z-index:3}
.frame::before{top:-2px;left:-2px;border-right:0;border-bottom:0}
.frame::after{bottom:-2px;right:-2px;border-left:0;border-top:0}

.cs-cols{display:grid;grid-template-columns:repeat(3,1fr);border-left:var(--hair);border-top:var(--hair)}
.cs-cols>div{padding:clamp(20px,2.4vw,34px);border-right:var(--hair);border-bottom:var(--hair);
  display:flex;flex-direction:column;gap:14px}
.cs-cols h3{font-family:var(--fd);font-weight:900;text-transform:uppercase;letter-spacing:-.03em;
  font-size:clamp(20px,2vw,30px);line-height:.94}
.cs-cols .txt{max-width:none}

.cs-stats{display:grid;grid-template-columns:repeat(4,1fr);border:var(--hair);background:var(--bg-2)}
.cs-stats div{padding:clamp(18px,2.2vw,32px);border-right:var(--hair);display:flex;flex-direction:column;gap:8px}
.cs-stats div:last-child{border-right:0}
.cs-stats b{font-family:var(--fd);font-weight:900;font-size:clamp(34px,4.4vw,72px);line-height:.85;letter-spacing:-.045em;color:var(--acid)}
.cs-stats b em{font-style:normal;font-size:.45em;color:var(--ink-2);letter-spacing:0}
.cs-stats span{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}

.feat{display:grid;grid-template-columns:repeat(2,1fr);border-left:var(--hair);border-top:var(--hair)}
.feat div{padding:clamp(16px,1.8vw,24px);border-right:var(--hair);border-bottom:var(--hair);
  display:grid;grid-template-columns:44px 1fr;gap:6px 14px;transition:background .12s linear}
.feat div:hover{background:var(--bg-2)}
.feat .n{font-size:11px;letter-spacing:.14em;color:var(--acid);padding-top:4px;grid-row:span 2}
.feat b{font-family:var(--fd);font-weight:800;text-transform:uppercase;font-size:15.5px;letter-spacing:-.01em;line-height:1.1}
.feat p{font-size:12.5px;line-height:1.55;color:var(--ink-2)}
.inv .feat{border-color:rgba(11,11,11,.16)}
.inv .feat div{border-color:rgba(11,11,11,.16)}
.inv .feat div:hover{background:rgba(11,11,11,.045)}
.inv .feat .n{color:#0B0B0B;background:var(--acid);padding:2px 5px;height:max-content}
.inv .feat p{color:#4A4A45}

.stack{display:flex;flex-wrap:wrap;gap:8px}
.stack span{padding:7px 12px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  background:var(--bg-2);border:var(--hair);color:var(--ink-2)}
.stack span b{color:var(--acid);font-weight:500;margin-right:6px}

.tl{border-left:2px solid var(--line);display:flex;flex-direction:column}
.tl div{display:grid;grid-template-columns:110px 1fr;gap:14px;padding:14px 0 14px 22px;position:relative;
  border-bottom:1px dashed var(--line)}
.tl div::before{content:'';position:absolute;left:-7px;top:19px;width:12px;height:12px;background:var(--bg);border:2px solid var(--line-2)}
.tl div.ok::before{background:var(--acid);border-color:var(--acid)}
.tl .t{font-size:11px;letter-spacing:.12em;color:var(--ink-3)}
.tl .m{font-size:13px;color:var(--ink-2)}
.tl .m b{color:var(--ink);font-weight:500}

.cs-next{display:grid;grid-template-columns:1fr 1fr;border-top:var(--hair);position:relative;z-index:2}
.cs-next a{padding:clamp(24px,3.6vw,56px) var(--pad);display:flex;flex-direction:column;gap:10px;
  position:relative;isolation:isolate;overflow:hidden;transition:color .15s linear}
.cs-next a:first-child{border-right:var(--hair)}
.cs-next a::before{content:'';position:absolute;inset:0;background:var(--acid);z-index:-1;
  transform:translateY(101%);transition:transform .3s var(--ease)}
.cs-next a:hover::before{transform:none}
.cs-next a:hover{color:#0B0B0B}
.cs-next .k{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-3);transition:color .15s linear}
.cs-next a:hover .k{color:rgba(11,11,11,.6)}
.cs-next .h{font-family:var(--fd);font-weight:900;text-transform:uppercase;letter-spacing:-.035em;
  font-size:clamp(24px,3.6vw,56px);line-height:.9}
.cs-next a:last-child{text-align:right;align-items:flex-end}


/* ─── case gallery / phone ─── */
.gal{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.4vw,36px)}
.gal .gl{margin:0}
.gal .gl.wide{grid-column:1/-1}
.gal .frame{margin-top:0}
.gal .frame::before,.gal .frame::after{border-color:var(--c)}
.gal .frame-bar i:first-child{background:var(--c)}
.gal .frame-shot img{transition:transform .8s var(--ease)}
.gal .gl:hover .frame-shot img{transform:scale(1.015)}
.cs-end{display:grid;grid-template-columns:minmax(260px,420px) 1fr;gap:clamp(28px,5vw,96px);align-items:start}
.phone{position:relative;width:min(100%,360px);aspect-ratio:390/844;border-radius:46px;padding:12px;
  background:linear-gradient(145deg,#2a2a28,#121211);box-shadow:0 0 0 1px #3d3d3a,0 40px 80px -30px color-mix(in srgb,var(--c) 40%,transparent)}
.phone::before{content:'';position:absolute;top:22px;left:50%;transform:translateX(-50%);width:92px;height:26px;border-radius:14px;background:#0b0b0b;z-index:2}
.phone-in{width:100%;height:100%;border-radius:36px;overflow:hidden;background:#000}
.phone-in img{width:100%;height:100%;object-fit:cover;object-position:top}
.cs-want{margin-top:clamp(32px,4.4vw,64px);padding-top:clamp(24px,3vw,40px);border-top:var(--hair);display:flex;flex-direction:column;gap:16px}
.cs-want .txt{max-width:44ch}
.cs-want .cta-act{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
.wk-shot img{object-position:top center}

/* ─── log ─── */
.logbox{border:var(--hair);background:var(--bg-2)}
.log-bar{display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:var(--hair);
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.log-bar .dot{width:8px;height:8px;background:var(--acid);flex:none;animation:blink 1.1s steps(1) infinite}
@keyframes blink{50%{opacity:.15}}
.log-bar .r{margin-left:auto;color:var(--ink-4)}
.log{padding:16px;font-size:12.5px;line-height:1.85;min-height:290px}
.log div{display:flex;gap:12px;opacity:0;animation:lin .18s steps(2) forwards}
@keyframes lin{to{opacity:1}}
.log .t{color:var(--ink-4);flex:none}
.log .m{color:var(--ink-2)}
.log .m b{color:var(--ink);font-weight:500}
.log .ok .m b{color:var(--acid)}
.log .cur{display:inline-block;width:8px;height:14px;background:var(--acid);vertical-align:-2px;animation:blink .9s steps(1) infinite}

/* ─── steps (process) ─── */
.steps{display:grid;grid-template-columns:repeat(4,1fr);border-left:var(--hair);border-top:var(--hair)}
.steps div{padding:clamp(18px,2.2vw,30px);border-right:var(--hair);border-bottom:var(--hair);
  display:flex;flex-direction:column;gap:12px;min-height:240px}
.steps .n{font-family:var(--fd);font-weight:900;font-size:clamp(34px,4vw,64px);line-height:.85;letter-spacing:-.045em;color:transparent;-webkit-text-stroke:1px var(--line-2)}
.steps b{font-family:var(--fd);font-weight:800;text-transform:uppercase;font-size:clamp(16px,1.6vw,22px);letter-spacing:-.02em;line-height:1}
.steps p{font-size:12.5px;line-height:1.55;color:var(--ink-2)}
.steps .d{margin-top:auto;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--acid)}

/* ─── team / values ─── */
.vals{display:grid;grid-template-columns:repeat(3,1fr);border-left:var(--hair);border-top:var(--hair)}
.vals div{padding:clamp(18px,2.2vw,30px);border-right:var(--hair);border-bottom:var(--hair);display:flex;flex-direction:column;gap:12px}
.vals .k{font-size:11px;letter-spacing:.15em;color:var(--acid)}
.vals b{font-family:var(--fd);font-weight:900;text-transform:uppercase;font-size:clamp(20px,2.2vw,32px);letter-spacing:-.03em;line-height:.94}
.vals p{font-size:13px;line-height:1.55;color:var(--ink-2)}

/* ─── faq ─── */
.fq{border-top:var(--hair)}
.fq-i{border-bottom:var(--hair)}
.fq-h{display:flex;align-items:center;gap:18px;padding:20px 0;width:100%;text-align:left;transition:color .1s linear}
.fq-h:hover{color:var(--acid)}
.fq-h .q{flex:1;font-family:var(--fd);font-weight:800;text-transform:uppercase;
  font-size:clamp(15px,1.7vw,23px);letter-spacing:-.02em;line-height:1.1}
.fq-h .x{width:14px;height:14px;position:relative;flex:none}
.fq-h .x::before,.fq-h .x::after{content:'';position:absolute;background:var(--ink-3);transition:transform .25s var(--ease),background .1s}
.fq-h .x::before{left:0;right:0;top:6px;height:2px}
.fq-h .x::after{top:0;bottom:0;left:6px;width:2px}
.fq-i.on .fq-h .x::after{transform:rotate(90deg)}
.fq-i.on .fq-h .x::before,.fq-i.on .fq-h .x::after{background:var(--acid)}
.fq-b{max-height:0;overflow:hidden;transition:max-height .3s var(--ease)}
.fq-i.on .fq-b{max-height:400px}
.fq-b .txt{padding-bottom:22px;max-width:70ch}

/* ─── cta band ─── */
.cta{background:var(--acid);color:#0B0B0B;position:relative;z-index:2}
.cta-in{display:flex;flex-wrap:wrap;gap:24px 40px;align-items:center;justify-content:space-between;
  padding-block:clamp(40px,6vw,88px)}
.cta .dsp{max-width:12ch}
.cta .p{font-size:14px;color:rgba(11,11,11,.7);max-width:40ch;margin-top:12px}
.cta-act{display:flex;flex-wrap:wrap;gap:12px}

/* ─── contact ─── */
.ct-sec{background:var(--acid);color:#0B0B0B;border-top:0}
.ct-sec .sec-hd .n{background:#0B0B0B;color:var(--acid);padding:2px 7px}
.ct-sec .sec-hd .t{color:rgba(11,11,11,.66)}
.ct-sec .sec-hd .r{color:rgba(11,11,11,.42)}
.ct{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,72px);align-items:start}
.ct-p{font-size:15.5px;line-height:1.6;color:rgba(11,11,11,.74);max-width:36ch;margin-top:clamp(16px,2vw,26px)}
.ct-meta{margin-top:clamp(24px,3vw,40px);border-top:1px solid rgba(11,11,11,.22)}
.ct-meta div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;
  padding:12px 0;border-bottom:1px solid rgba(11,11,11,.16)}
.ct-meta .lbl{color:rgba(11,11,11,.55);margin:0}
.ct-meta b{font-family:var(--fd);font-weight:800;font-size:15px;text-transform:uppercase;letter-spacing:-.01em;color:#0B0B0B}

.ct-f{background:var(--bg);color:var(--ink);padding:clamp(18px,2.4vw,32px);
  display:flex;flex-direction:column;gap:14px;box-shadow:12px 12px 0 rgba(11,11,11,.9)}
.fr{display:flex;flex-direction:column;gap:7px}
.fr>span{font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-3)}
.fr input,.fr textarea,.fr select{background:var(--bg-2);border:1px solid var(--line-2);
  padding:12px 14px;font-family:var(--fm);font-size:14px;color:var(--ink);width:100%;transition:border-color .12s linear}
.fr textarea{resize:vertical;min-height:110px;line-height:1.55}
.fr input:focus,.fr textarea:focus,.fr select:focus{outline:none;border-color:var(--acid)}
.fr input::placeholder,.fr textarea::placeholder{color:var(--ink-4)}
.fr2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ct-att{border:1px dashed var(--line-2);padding:11px 14px;font-size:11.5px;line-height:1.55;color:var(--ink-3)}
.ct-att b{color:var(--acid);font-weight:500}
.ct-or{font-size:11.5px;color:var(--ink-4);text-align:center}
.ct-or a{color:var(--acid);border-bottom:1px solid currentColor}

/* ─── footer ─── */
.ft{border-top:var(--hair);position:relative;z-index:2;background:var(--bg)}
.ft-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:24px;padding-block:clamp(32px,4vw,56px) 28px}
.ft-grid .lbl{display:block;margin-bottom:14px}
.ft-grid ul{display:flex;flex-direction:column;gap:9px}
.ft-grid ul a{font-size:12.5px;color:var(--ink-2);transition:color .1s linear}
.ft-grid ul a:hover{color:var(--acid)}
.ft-brand{display:flex;flex-direction:column;gap:14px}
.ft-brand .p{font-size:12.5px;color:var(--ink-3);max-width:32ch;line-height:1.55}
.ft-in{display:flex;flex-wrap:wrap;gap:14px 30px;justify-content:space-between;align-items:center;
  padding-block:18px;border-top:var(--hair);font-size:11px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-4)}
.ft-in a:hover{color:var(--acid)}

/* ─── toast ─── */
.toast{position:fixed;left:var(--pad);bottom:var(--pad);z-index:120;
  background:var(--acid);color:#0B0B0B;padding:13px 18px;
  font-size:11.5px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;
  transform:translateY(200%);visibility:hidden;transition:transform .2s var(--ease),visibility 0s .2s;max-width:calc(100vw - 2*var(--pad))}
.toast.on{transform:none;visibility:visible;transition-delay:0s}

/* ─── reveal ─── */
[data-rv]{opacity:0;transform:translateY(14px);transition:opacity .5s linear,transform .5s var(--ease)}
[data-rv].in{opacity:1;transform:none}
[data-rv][data-d="1"]{transition-delay:.06s}
[data-rv][data-d="2"]{transition-delay:.12s}
[data-rv][data-d="3"]{transition-delay:.18s}

/* ─── responsive ─── */
@media (max-width:1180px){
  .tiles{grid-template-columns:repeat(2,1fr)}
  .row{grid-template-columns:44px 1fr 1fr;gap:14px 20px}
  .row .pr{grid-column:2/-1}
  .cs-stats{grid-template-columns:repeat(2,1fr)}
  .cs-stats div:nth-child(2){border-right:0}
  .cs-stats div:nth-child(-n+2){border-bottom:var(--hair)}
  .cs-meta{grid-template-columns:repeat(3,1fr)}
  .cs-meta div:nth-child(3){border-right:0}
  .cs-meta div:nth-child(-n+3){border-bottom:var(--hair)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .ft-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:880px){
  .nav-links,.nav-cta{display:none}
  .bg{display:flex}
  .grid-rules{grid-template-columns:repeat(4,1fr)}
  .man,.ph-row,.cs-sub,.ct{grid-template-columns:1fr}
  .ph-act,.cs-tags{justify-content:flex-start}
  .duo{grid-template-columns:1fr}
  .duo a:not(:last-child){border-right:0;border-bottom:var(--hair)}
  .svc,.vals{grid-template-columns:1fr}
  .wk,.wk.third,.wk.big{grid-column:span 6}
  .wb{grid-template-columns:1fr;gap:22px;padding-inline:0}
  .wb.flip .wb-media{order:0}
  .wb-ghost{display:none}
  .cs-side{align-items:flex-start}
  .wk.big .wk-body{display:flex}
  .wk.big .wk-shot{aspect-ratio:16/10}
  .cs-cols{grid-template-columns:1fr}
  .gal{grid-template-columns:1fr}
  .cs-end{grid-template-columns:1fr}
  .phone{margin:0 auto}
  .feat{grid-template-columns:1fr}
  .row{grid-template-columns:34px 1fr}
  .row .p,.row .pr{grid-column:2}
  .hero-meta{flex-wrap:wrap}
  .hero-meta div{flex:1 1 50%;border-bottom:var(--hair)}
  .cs-next{grid-template-columns:1fr}
  .cs-next a:first-child{border-right:0;border-bottom:var(--hair)}
  .cs-next a:last-child{text-align:left;align-items:flex-start}
  .ph-bg{display:none}
}
@media (max-width:620px){
  .tiles{grid-template-columns:1fr}
  .est-tabs{grid-template-columns:1fr}
  .est-tab{border-right:0;border-bottom:var(--hair);padding:12px 16px}
  .est-tab:not(.on){display:none}
  .est-res{grid-template-columns:1fr}
  .est-big{border-right:0;border-bottom:var(--hair)}
  .est-nav .btn{width:100%}
  #ascii,#asciiHot{font-size:10px}
  .hero h1 span{box-shadow:.2em 0 0 var(--bg),-.12em 0 0 var(--bg)}
  .cs-stats,.cs-meta,.steps,.ft-grid{grid-template-columns:1fr}
  .cs-stats div,.cs-meta div{border-right:0;border-bottom:var(--hair)}
  .cs-stats div:last-child,.cs-meta div:last-child{border-bottom:0}
  .fr2{grid-template-columns:1fr}
  .tl div{grid-template-columns:1fr;gap:4px}
  .frame-bar .r{display:none}
  .frame-bar .url{max-width:none}
  .btn-lg{height:56px;font-size:13.5px}
  .hero-act .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  [data-rv]{opacity:1;transform:none}
}