/* Taller Web Pro — page sections and responsive layout. */
/* ---------- hero ---------- */
.hero{position:relative;isolation:isolate;padding-top:clamp(48px,8vh,96px);padding-bottom:clamp(80px,12vh,140px)}
.hero__bg{position:absolute;top:-80px;bottom:0;left:50%;width:100vw;transform:translateX(-50%);z-index:-1;pointer-events:none;overflow:hidden}
.hero__bg::before{content:"";position:absolute;inset:0;
  background:radial-gradient(55% 60% at 76% 42%,rgba(199,163,90,.11),transparent 70%),radial-gradient(35% 35% at 8% 0%,rgba(228,210,163,.05),transparent 70%)}
.hero__bg::after{content:"";position:absolute;inset:0;opacity:.5;
  background-image:linear-gradient(rgba(242,238,230,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(242,238,230,.045) 1px,transparent 1px);background-size:72px 72px;background-position:center top;
  -webkit-mask-image:radial-gradient(60% 70% at 70% 40%,#000 0%,transparent 75%);mask-image:radial-gradient(60% 70% at 70% 40%,#000 0%,transparent 75%)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(24px,4vw,64px);align-items:center;min-height:min(74vh,760px)}
.hero-copy{position:relative;z-index:2}
.cta{display:flex;gap:12px;flex-wrap:wrap}

/* split headline (JS adds the spans; without JS the h1 is plain text) */
.js h1.is-split .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.js h1.is-split .w>span{display:inline-block;transform:translateY(105%);transition:transform .8s var(--ease-out);transition-delay:calc(var(--i) * 40ms + 60ms)}
.js h1.is-split.is-in .w>span{transform:none}

/* ---------- sections ---------- */
section{position:relative;padding-block:clamp(72px,9vw,128px);scroll-margin-top:66px}
section::before{content:"";position:absolute;top:0;left:var(--gutter);right:var(--gutter);max-width:calc(var(--wrap) - 2 * var(--gutter));margin:0 auto;height:1px;background:var(--line);transform-origin:left;transition:transform 1.4s var(--ease-out)}
.js section:not(.is-in)::before{transform:scaleX(0)}
/* Section rhythm: two surfaces, alternating. A = surface-0 (graphite / ivory), B = surface-paper
   (warm charcoal / paper). Pricing and the custom CTA read as one A unit. The surface change
   replaces the hairline divider. */
main>section::before{display:none}
#capacidades,#caso,#por-que,#proceso,.site-footer{background:var(--surface-paper)}
#servicios::before,#proceso::before,#contacto::before{display:none}

/* ---------- footer ---------- */
.site-footer{border-top:1px solid var(--line);padding:72px 0 36px;color:var(--text-2);font-size:14.5px}
.foot{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,.8fr));gap:40px}
.foot .brand{margin-bottom:18px}
.foot__desc{font:500 12.5px/1.4 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--text-2)}
.foot__title{font:500 11.5px/1 var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:18px}
.foot ul{list-style:none;padding:0;display:grid;gap:6px}
.foot a{display:inline-flex;align-items:center;min-height:32px;color:var(--text-1);text-decoration:none;transition:color .3s}
.foot a:hover{color:var(--accent-ink)}
.foot__reply{color:var(--text-2)}
.foot__base{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:56px;padding-top:24px;border-top:1px solid var(--line);font-size:13.5px;color:var(--text-2)}
.foot__base a{display:inline-flex;align-items:center;min-height:44px;color:var(--text-2);text-decoration:none}
.foot__base a:hover{color:var(--accent-ink)}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .hero-grid{grid-template-columns:1fr;min-height:0}

}
@media (max-width:860px){

  .foot{grid-template-columns:1fr 1fr}
  .foot__brand{grid-column:1/-1}
}
@keyframes menuIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@media (max-width:560px){
  body{font-size:16px}
  .cta .btn{flex:1 1 100%}
  .hero{padding-top:28px;padding-bottom:56px}
  .eyebrow{margin-bottom:18px;font-size:11.5px}
  .lead{margin:20px 0 26px}
  .cta{gap:10px}

  h1{letter-spacing:-.012em}

  .ba{aspect-ratio:4/3.4}
  .new .nh{grid-template-columns:1fr 1fr;gap:13%}
  .new .nv span{display:none}
  .new .h{font-size:15px}
  .new .d{font-size:10px;margin-top:6px}
  .new .k{margin-bottom:8px}
  .new .pill{margin-top:10px}
  .old p{font-size:11px}
  .ba__tag{bottom:8px;font-size:12px;letter-spacing:.1em;padding:6px 9px}
  .ba__tag.l{left:8px}.ba__tag.r{right:8px}
  .new .nh{align-items:start;padding-top:7%}
  .old .body{grid-template-columns:1fr}
  .old .side{display:none}
  .frame{padding:8px;border-radius:20px}
  .seg button{padding:10px 14px}
  .foot{grid-template-columns:1fr}
}

/* ---------- hero 2.0: copy ---------- */
.hero h1{font-size:clamp(40px,4.7vw,76px);line-height:1.01;letter-spacing:-.024em;max-width:14.5em}
@media (min-width:1101px){.hero-grid{grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr)}}
.hero h1 em{font-style:italic;font-weight:400;color:var(--accent-ink)}
.hero .lead{color:var(--text-2);max-width:31em}
.hero__price{margin-top:26px;font-size:15px;line-height:1.5;color:var(--text-2);letter-spacing:.01em}
.hero__also{white-space:nowrap}
.hero__amount{font:400 20px/1 var(--font-display);letter-spacing:-.01em;color:var(--text-1);margin-inline:2px}
@media (max-width:560px){.hero h1{font-size:clamp(34px,9.4vw,44px)}.hero__price{margin-top:18px;font-size:15px}.hero__amount{font-size:19px}}

/* ---------- hero 2.0: CSS 3D assembly scene ----------
   Final (assembled) state is the default; JS only adds the entrance and pointer depth. */
.hero__stage{position:relative;z-index:0;width:100%;max-width:640px;aspect-ratio:1/1;justify-self:end;perspective:1800px;perspective-origin:50% 35%;pointer-events:none;--px:0;--py:0;--lx:50%;--ly:30%}
.scene{position:absolute;inset:6% 4% 10% 8%;transform-style:preserve-3d;transform:rotateX(calc(52deg - var(--py) * 4deg)) rotateZ(calc(-34deg + var(--px) * 5deg));transition:transform 1.1s var(--ease-out)}
.scene__glow{position:absolute;inset:16%;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--accent) 22%,transparent),transparent);filter:blur(28px);transform:translateZ(-80px)}
.layer{position:absolute;inset:10%;border-radius:18px;transform-style:preserve-3d;
  --t-final:translate3d(calc(var(--px) * var(--k) * 1px),calc(var(--py) * var(--k) * 1px),calc(var(--z) * 1px));
  transform:var(--t-final);transition:transform 1.1s var(--ease-out),opacity .7s var(--ease);transition-delay:calc(var(--i) * 200ms)}
.layer--grid{--z:0;--k:-6;--i:0;border:1px solid var(--accent-line);background-color:color-mix(in srgb,var(--surface-1) 92%,transparent);
  background-image:linear-gradient(var(--accent-line) 1px,transparent 1px),linear-gradient(90deg,var(--accent-line) 1px,transparent 1px);background-size:26px 26px;
  box-shadow:0 60px 90px -40px hsl(var(--shadow-color) / .55)}
.guide{position:absolute;top:0;bottom:0;width:1px;background:var(--accent);opacity:.55}
.guide.g1{left:8%}.guide.g2{left:50%;opacity:.5}.guide.g3{right:8%}
.layer--wire{--z:80;--k:4;--i:1;border:1px dashed color-mix(in srgb,var(--text-1) 30%,transparent);background:color-mix(in srgb,var(--surface-0) 40%,transparent)}
.wf{position:absolute;border:1px solid color-mix(in srgb,var(--text-1) 32%,transparent);border-radius:6px}
.wf--nav{left:6%;right:6%;top:6%;height:7%}.wf--h{left:6%;top:21%;width:50%;height:9%}.wf--h2{left:6%;top:33%;width:36%;height:6%}
.wf--btn{left:6%;top:44%;width:22%;height:7%;border-radius:999px}.wf--img{right:6%;top:21%;width:32%;height:37%}
.wf--c1,.wf--c2,.wf--c3{top:66%;height:26%;width:27%}.wf--c1{left:6%}.wf--c2{left:36.5%}.wf--c3{left:67%}
.layer--design{--z:170;--k:10;--i:2;overflow:hidden;border:1px solid var(--accent-line);
  background:linear-gradient(155deg,var(--surface-1),var(--surface-0) 70%);box-shadow:0 70px 110px -44px hsl(var(--shadow-color) / .7)}
.layer--design::after{content:"";position:absolute;inset:0;background:radial-gradient(42% 42% at var(--lx) var(--ly),color-mix(in srgb,var(--accent-hi) 18%,transparent),transparent 70%)}
.ds{position:absolute;border-radius:5px;background:color-mix(in srgb,var(--text-1) 14%,transparent)}
.ds--logo{left:6%;top:7%;width:14%;height:4%;background:color-mix(in srgb,var(--text-1) 70%,transparent)}
.ds--nav{left:38%;top:8%;width:30%;height:2.4%}
.ds--cta{right:6%;top:6.5%;width:13%;height:5%;border-radius:999px;background:var(--accent)}
.ds--h{left:6%;top:21%;width:52%;height:6.5%;background:color-mix(in srgb,var(--text-1) 86%,transparent)}
.ds--h2{left:6%;top:30.5%;width:38%;height:6.5%;background:var(--accent)}
.ds--p{left:6%;top:41%;width:44%;height:2.4%}.ds--p2{left:6%;top:45.5%;width:32%;height:2.4%}
.ds--btn{left:6%;top:53%;width:20%;height:6%;border-radius:999px;background:var(--accent)}
.ds--img{right:6%;top:20%;width:32%;height:40%;border-radius:10px;background:linear-gradient(165deg,#6b5841,#2d261e 62%,#41372b);box-shadow:inset 0 0 0 1px var(--accent-line)}
.ds--c1,.ds--c2,.ds--c3{top:68%;height:23%;width:27%;border-radius:9px;background:color-mix(in srgb,var(--text-1) 6%,transparent);box-shadow:inset 0 0 0 1px var(--line)}
.ds--c1{left:6%}.ds--c2{left:36.5%}.ds--c3{left:67%}
.layer--components{--z:250;--k:16;--i:3}
.cmp{position:absolute;display:flex;align-items:center;gap:10px;border-radius:14px;background:var(--surface-1);border:1px solid var(--line-strong);box-shadow:0 30px 50px -22px hsl(var(--shadow-color) / .75);font:500 13px/1 var(--font-text);color:var(--text-1);white-space:nowrap}
.cmp--input{left:-6%;top:28%;padding:16px 18px;min-width:44%;flex-direction:column;align-items:flex-start}
.cmp--input b{font:600 10px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}
.cmp--input i{display:block;width:100%;height:2px;background:var(--accent)}
.cmp--button{right:2%;top:56%;padding:15px 24px;border-radius:999px;background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:600}
.cmp--chart{left:10%;bottom:-6%;padding:16px 18px;height:26%;align-items:flex-end;gap:8px}
.cmp--chart i{display:block;width:12px;border-radius:3px 3px 0 0;background:color-mix(in srgb,var(--text-1) 22%,transparent)}
.cmp--chart i:nth-child(1){height:30%}.cmp--chart i:nth-child(2){height:55%}.cmp--chart i:nth-child(3){height:42%}.cmp--chart i:nth-child(4){height:78%;background:var(--accent)}.cmp--chart i:nth-child(5){height:64%}
.layer--mobile{--z:320;--k:22;--i:4;inset:auto -4% 0 auto;width:28%;aspect-ratio:9/18.5}
.phone{position:absolute;inset:0;border-radius:22px;overflow:hidden;border:1px solid var(--accent-line);background:linear-gradient(170deg,var(--surface-1),var(--surface-0));box-shadow:0 40px 70px -24px hsl(var(--shadow-color) / .85)}
.ph{position:absolute;border-radius:4px;background:color-mix(in srgb,var(--text-1) 16%,transparent)}
.ph--bar{left:10%;top:6%;width:40%;height:3%;background:color-mix(in srgb,var(--text-1) 60%,transparent)}
.ph--h{left:10%;top:18%;width:78%;height:5%;background:color-mix(in srgb,var(--text-1) 82%,transparent)}
.ph--h2{left:10%;top:25.5%;width:56%;height:5%;background:var(--accent)}
.ph--img{left:10%;right:10%;top:37%;height:30%;border-radius:8px;background:linear-gradient(165deg,#6b5841,#2d261e 62%,#41372b)}
.ph--btn{left:10%;top:74%;width:50%;height:6%;border-radius:999px;background:var(--accent)}
.chip-live{position:absolute;left:-12%;top:-15%;display:inline-flex;align-items:center;gap:8px;padding:9px 13px;border-radius:999px;background:var(--surface-1);border:1px solid var(--accent-line);font:600 11px/1 var(--font-mono);letter-spacing:.06em;color:var(--text-1);white-space:nowrap;box-shadow:0 20px 40px -18px hsl(var(--shadow-color) / .8)}
.chip-live i{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 22%,transparent)}
@media (max-width:1100px){.hero__stage{justify-self:center;max-width:560px;margin-top:clamp(40px,8vw,80px)}}
@media (max-width:860px){
  .layer--wire,.layer--components{display:none}
  .layer{transition-duration:.9s;transition-delay:calc(var(--i) * 160ms)}
  .layer--design{--z:90}
  .layer--mobile{--z:150}
}
@media (max-width:560px){
  .hero{padding-top:20px}
  .hero__stage{max-width:300px;margin-top:8px}
  .hero-grid{row-gap:8px}
  .scene{inset:16% 10% 2% 8%}
  .layer--mobile{width:30%;right:-1%}
  .chip-live{font-size:9.5px;padding:7px 10px;top:-17%}
}

/* ---------- capabilities: three pillars, three visual languages ---------- */
.pillars{padding-block:clamp(72px,9vw,128px)}
/* editorial single-column section heading: H2, then supporting text directly below */
.pillars__intro,.projects__intro,.services__head{max-width:46em;margin-bottom:clamp(36px,4.8vw,72px)}
.pillars__intro h2,.projects__intro h2,.services__head h2{font-size:clamp(44px,6.4vw,104px);line-height:.95;letter-spacing:-.03em}
.pillars__intro .sub,.projects__intro .sub,.services__head .sub{margin-top:clamp(14px,1.6vw,22px);max-width:36em;font-size:clamp(17px,1.25vw,18px);line-height:1.55;color:var(--text-2)}

.pillar{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(32px,5vw,88px);align-items:center;padding-block:clamp(32px,4vw,56px)}
.pillar+.pillar{border-top:1px solid var(--line)}
/* the section already pads its edges; first/last rows do not double it */
.pillar:first-of-type,.project:first-of-type{padding-top:0}.pillar:last-child,.project:last-child{padding-bottom:0}
.pillar__text .tlink{margin-top:20px}
.pillar--software{grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)}
.pillar--software .pillar__visual{order:2}
/* automation: a wider text column (~30em) so its headline reads in two lines */
.pillar--automation{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.pillar__kicker{font:500 12.5px/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:22px}
.pillar__text h3{font:400 clamp(30px,3.2vw,48px)/1.04 var(--font-display);letter-spacing:-.02em;text-wrap:balance}
.pillar__text>p:not(.pillar__kicker){color:var(--text-2);margin-top:18px;max-width:30em}
.tags{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px;margin:24px 0 28px}
.tags li{font-size:13.5px;padding:7px 12px;border-radius:999px;border:1px solid var(--line-strong);color:var(--text-1)}
.pillar__visual{position:relative;min-height:300px}
/* web: framed page that scrolls with the reader, phone in front */
.pv--web{aspect-ratio:16/11;min-height:0}
.pv-web__frame{position:absolute;inset:0 12% 6% 0;border-radius:var(--r-frame);overflow:hidden;border:1px solid var(--line-strong);background:var(--surface-1);box-shadow:0 50px 90px -50px hsl(var(--shadow-color) / .7)}
.pv-web__page{position:absolute;left:0;right:0;top:0;height:170%;transform:translateY(calc(var(--scroll,0) * -24%));transition:transform .2s linear}
.pw{position:absolute;display:block;border-radius:6px;background:color-mix(in srgb,var(--text-1) 12%,transparent)}
.pv-web__page .pw--nav{left:5%;right:5%;top:3%;height:3%;background:color-mix(in srgb,var(--text-1) 9%,transparent)}
.pv-web__page .pw--h{left:5%;top:10%;width:52%;height:5%;background:color-mix(in srgb,var(--text-1) 82%,transparent)}
.pv-web__page .pw--h2{left:5%;top:16.5%;width:36%;height:5%;background:var(--accent)}
.pv-web__page .pw--btn{left:5%;top:25%;width:18%;height:3.6%;border-radius:999px;background:var(--accent)}
.pv-web__page .pw--img{right:5%;top:9%;width:34%;height:21%;border-radius:12px;background:linear-gradient(160deg,#6b5841,#2d261e 62%,#41372b)}
.pv-web__page .pw--row{left:5%;right:5%;top:35%;height:1px;background:var(--line-strong)}
.pv-web__page .pw--c1,.pv-web__page .pw--c2,.pv-web__page .pw--c3{top:39%;width:28%;height:14%;border-radius:12px;background:color-mix(in srgb,var(--text-1) 6%,transparent);box-shadow:inset 0 0 0 1px var(--line)}
.pv-web__page .pw--c1{left:5%}.pv-web__page .pw--c2{left:36%}.pv-web__page .pw--c3{left:67%}
.pv-web__page .pw--band{left:0;right:0;top:58%;height:18%;border-radius:0;background:var(--surface-paper)}
.pv-web__page .pw--foot{left:5%;right:5%;top:82%;height:10%;background:color-mix(in srgb,var(--text-1) 7%,transparent)}
.pv-web__phone{position:absolute;right:0;bottom:0;width:27%;aspect-ratio:9/18.5;border-radius:24px;border:1px solid var(--accent-line);background:var(--surface-1);box-shadow:0 40px 70px -26px hsl(var(--shadow-color) / .8);overflow:hidden}
.pv-web__phone .pw--h{left:10%;top:12%;width:78%;height:5%;background:color-mix(in srgb,var(--text-1) 80%,transparent)}
.pv-web__phone .pw--img{left:10%;right:10%;top:24%;height:34%;border-radius:10px;background:linear-gradient(160deg,#6b5841,#2d261e 62%,#41372b)}
.pv-web__phone .pw--btn{left:10%;top:66%;width:56%;height:6%;border-radius:999px;background:var(--accent)}
/* software: application interface */
.pv--software{min-height:0}
.pv-app{display:grid;grid-template-columns:150px 1fr;border-radius:var(--r-frame);overflow:hidden;border:1px solid var(--line-strong);background:var(--surface-1);font-family:var(--font-mono);box-shadow:0 50px 90px -50px hsl(var(--shadow-color) / .7);aspect-ratio:16/10.5}
.pv-app__side{display:flex;flex-direction:column;gap:4px;padding:22px 14px;background:var(--surface-2);border-right:1px solid var(--line)}
.pv-app__side b{font-weight:500;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-1);margin:0 8px 14px}
.pv-app__side span{font-size:12.5px;color:var(--text-2);padding:9px 10px;border-radius:9px}
.pv-app__side span.on{background:var(--surface-1);color:var(--text-1)}
.pv-app__main{display:grid;grid-template-rows:auto 1fr auto;gap:18px;padding:22px 24px;min-width:0}
.pv-app__top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.pv-app__search{flex:1;max-width:220px;font-size:12px;color:var(--text-2);padding:9px 12px;border-radius:9px;border:1px solid var(--line-strong)}
.pv-app__chip{font-size:11px;color:var(--text-1);padding:7px 10px;border-radius:999px;border:1px solid var(--accent-line);display:inline-flex;gap:7px;align-items:center}
.pv-app__chip::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent)}
.pv-app__chart{display:flex;align-items:flex-end;gap:3.5%;padding:16px;border-radius:14px;border:1px solid var(--line);min-height:110px;transition:opacity .9s var(--ease) .25s,transform .9s var(--ease-out) .25s}
.pv-app__chart i{flex:1;border-radius:4px 4px 0 0;background:color-mix(in srgb,var(--text-1) 16%,transparent);height:var(--h)}
.pv-app__chart i:nth-child(1){--h:38%;--n:0}.pv-app__chart i:nth-child(2){--h:56%;--n:1}.pv-app__chart i:nth-child(3){--h:44%;--n:2}.pv-app__chart i:nth-child(4){--h:70%;--n:3}
.pv-app__chart i:nth-child(5){--h:62%;--n:4}.pv-app__chart i:nth-child(6){--h:84%;--n:5;background:var(--accent)}.pv-app__chart i:nth-child(7){--h:66%;--n:6}.pv-app__chart i:nth-child(8){--h:76%;--n:7}
/* the chart fades up as one element (motion budget: one animated element, not eight) */
.js .pv--software:not(.is-in) .pv-app__chart{opacity:0;transform:translateY(10px)}
.pv-app__rows{display:grid;gap:6px}
.pv-app__rows span{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-radius:9px;background:color-mix(in srgb,var(--text-1) 4%,transparent);font-size:12.5px;color:var(--text-1)}
.pv-app__rows b{font-weight:400}
.st{font-style:normal;font-size:11px;padding:4px 9px;border-radius:999px;border:1px solid var(--line-strong);color:var(--text-2)}
.st--go{border-color:var(--accent-line);color:var(--accent-ink)}
.st--done{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
/* automation: connected process */
.pv--automation{display:grid;place-items:center;border-radius:var(--r-frame);background:radial-gradient(70% 70% at 50% 50%,var(--accent-wash),transparent 70%)}
.pv-flow{width:100%;height:auto;overflow:visible}
.pv-flow__path{fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round;stroke-dasharray:400;stroke-dashoffset:0;transition:stroke-dashoffset 1.4s var(--ease-io)}
.pv-flow__path--soft{stroke:var(--line-strong);stroke-dasharray:4 6}
.js .pv--automation:not(.is-in) .pv-flow__path:not(.pv-flow__path--soft){stroke-dashoffset:400}
.pv-flow__path:nth-of-type(2){transition-delay:.35s}.pv-flow__path:nth-of-type(3){transition-delay:.5s}
.pv-node rect{fill:var(--surface-1);stroke:var(--line-strong);stroke-width:1}
.pv-node circle{fill:var(--accent)}
.pv-node text{font:500 15px var(--font-mono);fill:var(--text-1)}
.pv-node--hub rect{fill:var(--accent);stroke:var(--accent)}
.pv-node--hub text{fill:var(--on-accent)}.pv-node--hub circle{fill:var(--on-accent)}
.pv-node--soft rect{stroke-dasharray:4 5}
@media (max-width:1100px){
  .pillar,.pillar--software,.pillar--automation{grid-template-columns:1fr}
  .pillar--software .pillar__visual{order:0}
}
@media (max-width:560px){
  .pillar__visual{min-height:240px}
  .pv--web{aspect-ratio:16/12}
  .pv-app{grid-template-columns:96px 1fr;aspect-ratio:auto;min-height:260px}
  .pv-app__side{padding:16px 8px}.pv-app__side span{font-size:11px;padding:7px 6px}.pv-app__side span:nth-child(n+5){display:none}
  .pv-app__main{padding:14px;gap:12px}.pv-app__search{display:none}
  .pv--automation{min-height:260px}
  .pv-node text{font-size:18px}
}

/* ---------- projects: large editorial presentations ---------- */
.projects{padding-block:clamp(72px,9vw,128px)}
.project{display:grid;gap:clamp(28px,4vw,64px);align-items:center;padding-block:clamp(32px,4vw,56px);min-height:360px}
.project+.project{border-top:1px solid var(--line)}
.project--large-left{grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr)}
.project--large-right{grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr)}
.project--split{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
.project--split .project__visual,.project--large-right .project__visual{order:2}
/* text-only entry: used until approved imagery exists; an intentional framed card, no empty frame */
.project--text{display:block;min-height:0}
.project__card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px clamp(28px,4vw,64px);align-items:end;padding:clamp(28px,4vw,56px);border-radius:var(--r-frame);background:var(--surface-1);border:1px solid var(--line-strong)}
.project__domain{margin-top:12px;font:500 13px/1.3 var(--font-mono);letter-spacing:.04em;color:var(--text-2)}
.project--text .project__name{font-size:clamp(48px,6.4vw,104px);line-height:.92;letter-spacing:-.035em}
.project--text .project__purpose{margin-top:0;font-size:clamp(17px,1.4vw,19px);color:var(--text-1);max-width:28em}
.project__visual{position:relative;border-radius:var(--r-frame);overflow:hidden;min-height:320px;aspect-ratio:16/10;background:var(--surface-0);border:1px solid var(--line-strong);box-shadow:0 60px 100px -60px hsl(var(--shadow-color) / .8)}
.project__category{font:500 12.5px/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:16px}
.project__name{font:400 clamp(32px,3.4vw,54px)/1 var(--font-display);letter-spacing:-.025em;overflow-wrap:break-word}
.project__purpose{color:var(--text-2);margin-top:16px;max-width:30em}
.project__note{margin-top:20px;font-size:var(--fs-small);color:var(--text-1);display:inline-flex;gap:10px;align-items:center}
.project__disclaimer{margin-top:14px;font-size:14px;line-height:1.5;color:var(--text-2);max-width:30em}
.project__note::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent)}
.project__text .btn{margin-top:24px}
@media (max-width:1100px){
  .project--large-left,.project--large-right,.project--split,.project__card{grid-template-columns:1fr}
}
@media (max-width:560px){.project{min-height:420px}.project__visual{min-height:260px;aspect-ratio:4/3.4}}

/* ---------- featured case ---------- */
.case{padding-block:clamp(72px,9vw,128px)}
.case__head{max-width:900px;margin-bottom:clamp(40px,5vw,72px)}
.case__kicker{font:500 12.5px/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:22px}
.case__head h2{font-size:clamp(40px,5.6vw,88px);line-height:.98;letter-spacing:-.028em;max-width:13em}
.case__head .sub{color:var(--text-2);max-width:40em;margin-top:24px}
.case__foot{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:32px 72px;align-items:start;margin-top:clamp(40px,5vw,64px);max-width:1180px;margin-inline:auto}
.case__changes{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;counter-reset:ch}
.case__changes li{display:grid;gap:10px;padding-top:20px;border-top:1px solid var(--line-strong);counter-increment:ch}
.case__changes li::before{content:counter(ch,decimal-leading-zero);font:500 12.5px/1 var(--font-mono);color:var(--accent-ink);letter-spacing:.1em}
.case__changes b{font:400 22px/1.15 var(--font-display);color:var(--text-1)}
.case__changes span{color:var(--text-2);font-size:15.5px}
.case__cta{display:grid;gap:16px;justify-items:start}
.case__note{font-size:var(--fs-small);color:var(--text-2)}
@media (max-width:1100px){.case__foot{grid-template-columns:1fr}}
@media (max-width:760px){.case__changes{grid-template-columns:1fr;gap:18px}}

/* ---------- recreated product representations (labels only, no data) ---------- */
.project__visual--mock{margin:0;display:flex;flex-direction:column;background:var(--surface-2);padding:14px;gap:10px}
.project__visual--mock>div{flex:1;min-height:0;border-radius:calc(var(--r-frame) - 12px);overflow:hidden}
.project__caption{font:500 11px/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--text-2);padding:2px 6px}
/* Fiscal Pro: calm, document-oriented, light by nature */
.mk-fiscal{--k-bg:#F6F2EA;--k-panel:#FFFDF8;--k-ink:#1E1C19;--k-sub:#6A645B;--k-line:rgba(30,28,25,.1);--k-acc:#B48A3E;
  display:grid;grid-template-columns:200px 1fr;background:var(--k-bg);color:var(--k-ink);font-family:var(--font-text)}
.mk-fiscal__side{display:flex;flex-direction:column;gap:4px;padding:22px 16px;border-right:1px solid var(--k-line);background:var(--k-panel)}
.mk-fiscal__brand{font:500 20px/1 var(--font-display);margin:0 8px 18px}
.mk-fiscal__side span{font-size:13px;color:var(--k-sub);padding:9px 10px;border-radius:9px}
.mk-fiscal__side span.on{background:var(--k-bg);color:var(--k-ink);font-weight:600}
.mk-fiscal__main{display:grid;grid-template-rows:auto auto 1fr;gap:18px;padding:22px 26px;min-width:0}
.mk-fiscal__head{display:flex;justify-content:space-between;align-items:center}
.mk-fiscal__head b{font:400 26px/1 var(--font-display)}
.mk-chip{font:500 11px/1 var(--font-mono);padding:7px 10px;border-radius:999px;background:var(--k-acc);color:#161513}
.mk-fiscal__tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.mk-tile{display:grid;gap:14px;padding:16px;border-radius:14px;background:var(--k-panel);border:1px solid var(--k-line)}
.mk-tile span{font:500 11.5px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--k-sub)}
.mk-bar{display:block;height:8px;border-radius:99px;background:var(--k-line);position:relative;overflow:hidden}
.mk-bar::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);border-radius:inherit;background:var(--k-acc)}
.mk-dots{display:flex;gap:6px}.mk-dots b{width:10px;height:10px;border-radius:50%;background:var(--k-line)}.mk-dots b.on{background:var(--k-acc)}
.mk-fiscal__list{display:grid;gap:8px;align-content:start}
.mk-fiscal__list span{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:11px 14px;border-radius:11px;background:var(--k-panel);border:1px solid var(--k-line);font-size:13.5px}
.mk-fiscal__list b{font-weight:500}
.mk-doc{width:16px;height:20px;border-radius:3px;border:1.5px solid var(--k-sub);position:relative}
.mk-st{font:500 11px/1 var(--font-mono);font-style:normal;padding:5px 9px;border-radius:999px;border:1px solid var(--k-line);color:var(--k-sub)}
.mk-st--ok{border-color:var(--k-acc);color:#7A5A1F}
@media (max-width:760px){
  .mk-fiscal{grid-template-columns:1fr}.mk-fiscal__side{display:none}
  .mk-fiscal__tiles{grid-template-columns:1fr 1fr}.mk-fiscal__tiles .mk-tile:nth-child(3){display:none}
  .mk-fiscal__main{padding:16px;gap:12px}.mk-fiscal__list span:nth-child(n+4){display:none}
}
/* ArbitTerminal: dense, technical, dark by nature */
.mk-arb{--a-bg:#0F1112;--a-panel:#16191B;--a-line:rgba(230,236,240,.09);--a-ink:#E6ECEF;--a-sub:#8D979C;--a-acc:#C7A35A;--a-b:#7C8A92;
  display:grid;grid-template-rows:auto 1fr auto;gap:12px;padding:16px;background:var(--a-bg);color:var(--a-ink);font-family:var(--font-mono)}
.mk-arb__bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.mk-arb__bar b{font-weight:500;font-size:14px;letter-spacing:.04em;margin-right:auto}
.mk-arb__st{display:inline-flex;align-items:center;gap:7px;font-size:11px;padding:6px 10px;border-radius:999px;border:1px solid var(--a-line);color:var(--a-sub)}
.mk-arb__st i{width:6px;height:6px;border-radius:50%;background:var(--a-acc)}
.mk-arb__st--risk i{background:var(--a-b)}
.mk-arb__grid{display:grid;grid-template-columns:1fr .8fr 1fr;gap:10px;min-height:0}
.mk-arb__venue,.mk-arb__mid{border:1px solid var(--a-line);border-radius:12px;background:var(--a-panel);padding:12px;display:grid;align-content:start;gap:10px}
.mk-arb h4{font:500 11px/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--a-sub)}
.mk-depth{display:grid;gap:5px}
.mk-depth i{display:block;height:9px;width:var(--w);border-radius:2px;background:color-mix(in srgb,var(--a-acc) 55%,transparent)}
.mk-depth i.b{background:color-mix(in srgb,var(--a-b) 55%,transparent);justify-self:end}
.mk-gauge{position:relative;height:10px;border-radius:99px;background:var(--a-line);margin-top:6px}
.mk-gauge i{position:absolute;left:30%;width:28%;top:0;bottom:0;border-radius:inherit;background:var(--a-acc)}
.mk-arb__label{font-size:11px;color:var(--a-sub)}
.mk-arb__exec{display:flex;justify-content:space-between;align-items:center;font-size:11.5px;padding:9px 10px;border-radius:9px;border:1px solid var(--a-line)}
.mk-arb__exec b{font-weight:500;color:var(--a-acc)}
.mk-arb__log{display:grid;gap:4px;padding:10px 12px;border-radius:12px;border:1px solid var(--a-line);font-size:11px;color:var(--a-sub)}
.mk-arb__log span{display:flex;gap:9px;align-items:center}
.mk-arb__log i{width:5px;height:5px;border-radius:50%;background:var(--a-acc)}
@media (max-width:760px){
  .mk-arb__grid{grid-template-columns:1fr 1fr}.mk-arb__mid{grid-column:1/-1;order:-1}
  .mk-arb__log{display:none}
  .project__visual--mock{aspect-ratio:auto!important;min-height:0}
}

/* ---------- services: typographic rows at different scales ---------- */
.services{padding-block:clamp(72px,9vw,128px)}
.svc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(28px,4vw,64px);border-top:1px solid var(--line-strong);padding-top:clamp(24px,3vw,36px)}
.svc-col__name{font:500 13px/1.2 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:14px}
.svc-col__list{list-style:none;padding:0;margin:0}
.svc-col__list li{padding:9px 0 9px 22px;position:relative;color:var(--text-1);border-bottom:1px solid var(--line)}
.svc-col__list li::before{content:"";position:absolute;left:0;top:20px;width:10px;height:1px;background:var(--accent)}
.svc-maint{margin-top:clamp(28px,3vw,40px);color:var(--text-2);max-width:56em}
.svc-maint b{color:var(--text-1);font-weight:600;margin-right:6px}
.svc-maint .tlink{margin-left:6px}
/* ---------- why: statement + numbered commitments ---------- */
.why{padding-block:clamp(72px,9vw,128px)}
.why__statement{font-size:clamp(40px,6vw,96px);line-height:.98;letter-spacing:-.03em;max-width:12em;margin-bottom:clamp(48px,6vw,88px)}
.why__list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 64px;counter-reset:w}
.why__list li{display:grid;grid-template-columns:72px 1fr;gap:4px 16px;padding:22px 0;border-top:1px solid var(--line-strong);counter-increment:w;align-content:start}
.why__list li::before{content:counter(w,decimal-leading-zero);grid-row:span 2;font:300 44px/1 var(--font-display);color:var(--accent-ink);letter-spacing:-.02em}
.why__list b{font:400 22px/1.2 var(--font-display);color:var(--text-1)}
.why__list span{color:var(--text-2);font-size:15.5px}
@media (max-width:860px){
  .svc-grid{grid-template-columns:1fr;gap:28px}
  .why__list{grid-template-columns:1fr}
}

/* ---------- process: theme-aware paper band ---------- */
.process{--fade:clamp(48px,5vw,72px);background:var(--surface-paper);padding-block:calc(var(--fade) + clamp(36px,4.5vw,64px))}
/* soft tonal transitions into the neighbouring surfaces (replaces the section divider) */
.process::before,.process::after{content:"";display:block;position:absolute;left:0;right:0;max-width:none;margin:0;height:var(--fade);transform:none!important;transition:none;pointer-events:none}
.process::before{top:0;background:linear-gradient(var(--surface-0),var(--surface-paper))}
.process::after{bottom:0;background:linear-gradient(var(--surface-paper),var(--surface-0))}
.process__head{margin-bottom:clamp(40px,5vw,72px)}
.process__kicker{font:500 12.5px/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:16px}
.process__head h2{font-size:clamp(40px,5vw,80px);line-height:.98;letter-spacing:-.03em}
.process__steps{--num:clamp(96px,10vw,160px);position:relative;list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(24px,3vw,48px)}
.process__steps::before{content:"";position:absolute;left:0;right:0;top:calc(var(--num) * .9 + 14px);height:1px;background:var(--line-strong);transform-origin:left;transition:transform 1.6s var(--ease-io) .15s}
.js .process__steps:not(.is-in)::before{transform:scaleX(0)}
.process__step{display:flex;flex-direction:column;gap:clamp(32px,3vw,44px);min-width:0}
.process__num{font:300 var(--num)/.9 var(--font-display);letter-spacing:-.05em;color:var(--accent-hi);font-variant-numeric:lining-nums}
.process__step h3{font:400 clamp(22px,2vw,28px)/1.15 var(--font-display);color:var(--text-1)}
.process__step p{color:var(--text-2);margin-top:10px;max-width:22em}
@media (max-width:1100px) and (min-width:761px){.process__steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:56px}.process__steps::before{display:none}}
@media (max-width:760px){
  .process__steps{--num:64px;grid-template-columns:1fr;gap:0}
  .process__steps::before{top:8px;bottom:8px;left:calc(var(--num) * .5);right:auto;width:1px;height:auto;transform-origin:top}
  .js .process__steps:not(.is-in)::before{transform:scaleY(0)}
  .process__step{flex-direction:row;align-items:flex-start;gap:20px;padding-block:18px}
  .process__num{flex:none;width:var(--num);text-align:center;background:var(--surface-paper);position:relative;font-size:52px;padding-block:4px}
}

/* ---------- pricing ----------
   Cards share rows (subgrid): name · price · IVA line · inclusions · CTA · details. Every card is
   the same height and every CTA sits on the same line, even when one card's details are open. */
.pricing{padding-block:clamp(56px,6vw,96px)}
.pricing__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.7fr);gap:12px 64px;align-items:end;margin-bottom:clamp(24px,3vw,40px)}
.pricing__kicker{font:500 12.5px/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:12px}
.pricing__head h2{font-size:clamp(36px,4vw,60px);line-height:1;letter-spacing:-.03em;max-width:14em}
.pricing__head .sub{color:var(--text-2);justify-self:end;max-width:26em}
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.plan{position:relative;display:flex;flex-direction:column;padding:clamp(22px,2vw,30px);border-radius:var(--r-panel);background:var(--surface-1);border:1px solid var(--line)}
@supports (grid-template-rows:subgrid){
  .plan{display:grid;grid-row:span 6;grid-template-rows:subgrid;row-gap:0;align-content:start}
}
.plan h3{font:400 clamp(22px,1.9vw,27px)/1.1 var(--font-display);color:var(--text-1);align-self:start}
.plan--featured h3{padding-right:120px}
.plan__price{margin-top:16px;display:flex;flex-direction:column;gap:6px}
.plan__from{font:600 13px/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-1)}
.plan__amount{font:400 clamp(38px,3.3vw,50px)/1 var(--font-display);letter-spacing:-.03em;color:var(--text-1);white-space:nowrap}
.plan__tax{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin-top:8px;font-size:14.5px}
.plan__iva{color:var(--text-1);font-weight:600}
.plan__net{color:var(--text-2)}
.plan__net::before{content:"·";margin-right:12px;color:var(--text-2)}
.plan__inc{list-style:none;padding:14px 0 0;margin:16px 0 0;border-top:1px solid var(--line)}
.plan__inc li{padding:4px 0 4px 26px;position:relative;color:var(--text-1);font-size:15px;line-height:1.45}
.plan__inc li::before{content:"";position:absolute;left:3px;top:11px;width:10px;height:5px;border-left:1.5px solid var(--accent);border-bottom:1.5px solid var(--accent);transform:rotate(-45deg)}
.plan__btn{width:100%;min-height:52px;margin-top:18px;align-self:end}
.plan__exc{margin-top:12px;border-top:1px solid var(--line);padding-top:4px;font-size:14.5px;color:var(--text-2)}
.plan__exc summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;min-height:44px;color:var(--text-1);font-weight:600}
.plan__exc summary::-webkit-details-marker{display:none}
.plan__exc summary::after{content:"+";font:300 22px/1 var(--font-display);color:var(--accent-ink);transition:transform .3s var(--ease)}
.plan__exc[open] summary::after{transform:rotate(45deg)}
.plan__exc summary:focus-visible{outline:2px solid var(--focus);outline-offset:4px;border-radius:4px}
.plan__exc-label{margin-top:10px;font:500 12.5px/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--text-2)}
.plan__exc ul{list-style:none;padding:4px 0 0;margin:0}
.plan__exc li{padding:4px 0 4px 20px;position:relative}
.plan__exc li::before{content:"";position:absolute;left:2px;top:14px;width:9px;height:1px;background:var(--text-2)}
.plan__exc .plan__rules li,.plan__exc .plan__more li{color:var(--text-1)}
@supports not (grid-template-rows:subgrid){.plan__btn{margin-top:auto}}
.plan--featured{background:var(--surface-2);border-color:var(--accent-line);box-shadow:0 48px 70px -48px hsl(var(--shadow-color) / .45)}
.plan--featured::after{content:"";position:absolute;left:32px;right:32px;top:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent)}
.plan__tag{position:absolute;top:clamp(22px,2vw,30px);right:clamp(22px,2vw,30px);font:500 11px/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--on-accent);background:var(--accent);padding:7px 10px;border-radius:999px}
.pricing__notice{margin-top:20px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 28px;align-items:start;padding:18px clamp(18px,2.4vw,28px);border-radius:var(--r-panel);border:1px solid var(--accent-line);background:linear-gradient(120deg,var(--accent-wash),transparent 70%)}
.pricing__notice-kicker{font:600 13px/1.6 var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink)}
.pricing__notice ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 28px;font-size:15px;color:var(--text-1)}
.pricing__notice b{font-weight:600}
@media (max-width:860px){.pricing__head{grid-template-columns:1fr}.pricing__head .sub{justify-self:start}.plans{grid-template-columns:1fr}.pricing__notice{grid-template-columns:1fr}.pricing__notice ul{grid-template-columns:1fr}}

/* ---------- custom software / automation CTA ---------- */
.custom{padding-top:0}
.custom::before{display:none}
.custom__panel{position:relative;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px clamp(40px,6vw,96px);padding:clamp(36px,5vw,72px);border-radius:var(--r-frame);background:var(--surface-1);border:1px solid var(--line)}
.custom__panel::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 80% at 0% 0%,var(--accent-wash),transparent 70%)}
.custom__kicker,.custom__label{font:500 12.5px/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:16px}
.custom__label{color:var(--text-2)}
.custom h2{font-size:clamp(38px,4.4vw,68px);line-height:1;letter-spacing:-.03em}
.custom__quote{display:inline-block;margin-top:18px;padding:8px 14px;border-radius:999px;border:1px solid var(--accent-line);font:500 13px/1 var(--font-mono);letter-spacing:.06em;color:var(--text-1)}
.custom__lead{color:var(--text-2);margin:20px 0 30px;max-width:28em}
.custom__factors ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}
.custom__factors li{padding:14px 0;border-top:1px solid var(--line-strong);font:400 clamp(18px,1.5vw,21px)/1.25 var(--font-display);color:var(--text-1)}
.custom__note{margin-top:22px;color:var(--text-2);font-size:var(--fs-small)}
@media (max-width:860px){.custom__panel{grid-template-columns:1fr}.custom .btn{width:100%}}
@media (max-width:480px){.custom__factors ul{grid-template-columns:1fr}}

/* ---------- contact + briefing ---------- */
/* [hidden] must win over the display values below (steps, branches, errors, result) */
.brief[hidden],.brief [hidden]{display:none!important}
.contact{position:relative;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:40px clamp(32px,5vw,72px);align-items:start;padding:clamp(28px,5vw,72px) clamp(20px,5vw,64px);border-radius:var(--r-frame);background:var(--surface-1);border:1px solid var(--line)}
.contact::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(55% 90% at 0% 0%,var(--accent-wash),transparent 70%)}
.contact::after{content:"";position:absolute;left:0;top:0;width:40%;height:1px;background:linear-gradient(90deg,var(--accent),transparent)}
.contact>div{min-width:0}
.contact__kicker{font:500 12.5px/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:18px}
.contact h2{font-size:clamp(32px,3vw,48px);line-height:1.02;letter-spacing:-.03em;max-width:13em}
.contact h2 em{font-style:italic;color:var(--accent-ink)}
.contact__lead{margin-top:22px;color:var(--text-2);max-width:30em}
.contact__alt{margin-top:32px;padding-top:22px;border-top:1px solid var(--line);display:grid;gap:10px;justify-items:start}
.contact__alt-label{font:500 12.5px/1.3 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--text-2)}
.contact__channel{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--text-1);font-weight:600;text-decoration:none;border-bottom:1px solid var(--accent-line)}
.contact__channel:hover{color:var(--accent-ink)}
.contact__email{display:flex;flex-wrap:wrap;align-items:center;gap:4px 16px}
.contact__mail{display:inline-flex;align-items:center;min-height:44px;font:400 clamp(20px,1.9vw,26px)/1.15 var(--font-display);color:var(--text-1);text-decoration:none;letter-spacing:-.01em;user-select:all;-webkit-user-select:all}
.contact__mail:hover{color:var(--accent-ink)}
.contact__copy{min-height:44px;padding:0 4px;border:0;background:none;color:var(--accent-ink);font:600 14.5px/1 var(--font-text);cursor:pointer;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.contact__copy:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
.contact__status{flex-basis:100%;min-height:1.2em;font-size:var(--fs-small);color:var(--text-2)}

.brief{position:relative;padding:clamp(20px,3vw,36px);border-radius:var(--r-panel);background:var(--surface-0);border:1px solid var(--line-strong);box-shadow:0 40px 80px -50px hsl(var(--shadow-color) / .6);scroll-margin-top:84px}
.brief__head{display:grid;gap:10px;margin-bottom:22px}
.brief__title{font:400 clamp(24px,2.2vw,30px)/1.1 var(--font-display);letter-spacing:-.01em}
.brief__title:focus{outline:none}
.brief__title:focus-visible{outline:2px solid var(--focus);outline-offset:4px;border-radius:4px}
.brief__count{font:500 13px/1.3 var(--font-mono);letter-spacing:.06em;color:var(--text-2)}
.brief__bar{height:3px;border-radius:3px;background:var(--line)}
.brief__bar i{display:block;height:100%;width:20%;border-radius:inherit;background:var(--accent);transition:width var(--dur-base) var(--ease-out)}
.brief__context{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;font-size:15px;color:var(--text-1)}
.brief__change{min-height:44px;padding:0 4px;border:0;background:none;color:var(--accent-ink);font:600 14.5px/1 var(--font-text);text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.brief__step{border:0;padding:0;margin:0;min-width:0;display:grid;gap:20px}
.brief__q{font:500 13px/1.3 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--accent-ink);padding:0;margin-bottom:2px}
.brief__note{font-size:15px;color:var(--text-2)}
.brief__summary{padding:12px 14px;border-radius:12px;border:1px solid var(--accent-line);background:var(--accent-wash);color:var(--text-1);font-size:15px;margin-bottom:18px}
.brief__branch{display:grid;gap:20px}

.field{display:grid;gap:8px;min-width:0;border:0;padding:0;margin:0}
.field>label,.field>legend,.field__label{font-weight:600;font-size:15.5px;color:var(--text-1);padding:0}
.field--sr-legend>legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.req{color:var(--accent-ink);font-weight:700}
.opt-label{font-weight:400;color:var(--text-2);font-size:14px}
.field__hint{font-size:14px;color:var(--text-2);margin-top:-2px}
.field__error{font-size:14px;font-weight:600;color:var(--text-1);display:flex;gap:8px;align-items:baseline}
.field__error::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--accent);transform:translateY(-1px)}
.brief input[type=text],.brief input[type=email],.brief input[type=tel],.brief select,.brief textarea{width:100%;min-height:48px;padding:12px 14px;border-radius:12px;border:1px solid var(--line-strong);background:var(--surface-1);color:var(--text-1);font:400 16px/1.4 var(--font-text)}
.brief textarea{min-height:96px;resize:vertical}
.brief input::placeholder,.brief textarea::placeholder{color:var(--text-2);opacity:.8}
.brief input:focus-visible,.brief select:focus-visible,.brief textarea:focus-visible{outline:2px solid var(--focus);outline-offset:1px;border-color:transparent}
.brief [aria-invalid="true"]:is(input,select,textarea),.field--group[aria-invalid="true"] .opts{box-shadow:0 0 0 2px var(--accent)}
.field--group[aria-invalid="true"] .opts{border-radius:12px}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opt,.tile{position:relative;cursor:pointer}
.opt input,.tile input{position:absolute;opacity:0;width:1px;height:1px}
.opt span{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--line-strong);font-size:15px;color:var(--text-1);transition:background-color .2s var(--ease),border-color .2s var(--ease)}
.opt:hover span,.tile:hover span{border-color:var(--accent-line)}
.opt input:checked+span{background:var(--text-1);border-color:var(--text-1);color:var(--surface-0)}
.opt input:focus-visible+span,.tile input:focus-visible+span{outline:2px solid var(--focus);outline-offset:2px}
.field--tiles .opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.tile span{display:grid;gap:4px;height:100%;min-height:72px;padding:14px 16px;border-radius:14px;border:1px solid var(--line-strong);background:var(--surface-1);font:400 19px/1.15 var(--font-display);color:var(--text-1);transition:border-color .2s var(--ease),background-color .2s var(--ease)}
.tile small{font:400 14px/1.35 var(--font-text);color:var(--text-2)}
.tile input:checked+span{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--surface-1));box-shadow:inset 0 0 0 1px var(--accent)}
.tile--sm span{min-height:64px;font-size:17px}
.brief__more{border-top:1px solid var(--line);padding-top:6px}
.brief__more summary{min-height:44px;display:flex;align-items:center;gap:8px;cursor:pointer;font-weight:600;color:var(--text-1);list-style:none}
.brief__more summary::-webkit-details-marker{display:none}
.brief__more summary::before{content:"+";font:300 22px/1 var(--font-display);color:var(--accent-ink);width:16px}
.brief__more[open] summary::before{content:"–"}
.brief__more-body{display:grid;gap:18px;padding-top:12px}
.field--matrix{gap:10px}
.seg-row{border:0;padding:0;margin:0;display:grid;grid-template-columns:minmax(0,9em) minmax(0,1fr);align-items:center;gap:8px 12px}
.seg-row legend{float:left;font-size:15px;color:var(--text-2);padding:0}
.opts--seg{gap:6px}
.opts--seg .opt span{min-height:44px;padding:0 14px}
.brief .field--group[data-field="requirements"] input{margin-top:2px}
.consent{display:grid;grid-template-columns:24px 1fr;gap:12px;align-items:start;font-size:15px;color:var(--text-1);cursor:pointer}
.consent input{width:22px;height:22px;margin:2px 0 0;accent-color:var(--accent)}
.consent a{color:var(--accent-ink);text-underline-offset:3px}
.brief__nav{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center;margin-top:26px;padding-top:20px;border-top:1px solid var(--line)}
.brief__nav .btn{min-height:52px}
.brief__next,.brief__submit{margin-left:auto}
.brief__legal{margin-top:12px;font-size:13.5px;color:var(--text-2)}
.brief__result{display:grid;gap:14px}
.brief__result:focus{outline:none}
.brief__result-kicker{font:500 13px/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink)}
.brief__result-title{font:400 clamp(26px,2.6vw,36px)/1.1 var(--font-display)}
.brief__result p{color:var(--text-2);max-width:34em}
.brief__result-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
.brief__result-actions .btn{min-height:52px}
.brief__preview{margin:0;padding:14px 16px;border-radius:12px;background:var(--surface-1);border:1px solid var(--line);font:400 13.5px/1.55 var(--font-mono);color:var(--text-2);white-space:pre-wrap;overflow-wrap:anywhere}
@media (max-width:860px){.contact{grid-template-columns:1fr;border-radius:24px}.contact__alt{margin-top:24px}}
@media (max-width:560px){
  .field--tiles .opts{grid-template-columns:1fr}
  .tile span{min-height:60px}
  .seg-row{grid-template-columns:1fr}
  .brief__nav .btn{flex:1 1 auto;justify-content:center}
  .brief__back{flex:0 0 auto!important}
}

/* ---------- mobile typography floor: informative labels never under 13px ---------- */
@media (max-width:560px){
  .eyebrow,.pillar__kicker,.project__category,.project__caption,.case__kicker,.seg button,.frame__label,
  .pricing__kicker,.plan__from,.plan__tag,.plan__exc-label,.custom__kicker,.custom__label,.process__kicker,
  .contact__kicker,.contact__alt-label,.foot__desc,.foot__title,.svc-col__name{font-size:13px}
  .eyebrow{letter-spacing:.1em;gap:10px}
  .eyebrow::before{width:28px}
}
/* Launch portfolio demos */
.demo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:2rem 0 4rem}.demo-card{border:1px solid var(--line,rgba(255,255,255,.14));border-radius:18px;padding:1.35rem;background:var(--surface,rgba(255,255,255,.03))}.demo-card h3{margin:.25rem 0 .45rem;font-size:1.35rem}.demo-card p{margin:.25rem 0 .9rem}@media(max-width:850px){.demo-grid{grid-template-columns:1fr 1fr}}@media(max-width:560px){.demo-grid{grid-template-columns:1fr}}


/* Approved portfolio: distinct web experiences and substantial product galleries. */
.projects__intro .project__category,.products__intro .project__category{line-height:1.6}
.demo-grid{gap:24px;margin-bottom:0}
.demo-card{padding:0;overflow:hidden;background:var(--surface-1);border-radius:22px;transition:transform .3s var(--ease),border-color .3s}
.demo-card:hover{transform:translateY(-4px);border-color:var(--accent-line)}
.demo-card__image{display:block;position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--surface-2)}
.demo-card__image img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .6s var(--ease)}
.demo-card:hover .demo-card__image img{transform:scale(1.035)}
.demo-card__image>span{position:absolute;right:12px;bottom:12px;padding:5px 12px;background:#171614;color:#F4F0E8;border:1px solid #76684b;border-radius:30px;font-size:12px}
.demo-card__body{padding:24px}
.demo-card .project__category{display:flex;justify-content:space-between;font-size:11px;line-height:1.4;margin:0 0 12px}
.demo-card h3{font-size:32px;margin:0 0 12px}
.demo-card .project__purpose{font-size:14px;line-height:1.65;min-height:4.9em;margin:0 0 20px}
.demo-card .tlink{font-size:14px}
.products{padding-block:clamp(64px,7vw,112px);background:var(--surface-1)}
.products__intro{margin-bottom:56px;max-width:740px}
.products__intro h2{font-size:clamp(44px,6.4vw,88px)}
.product-showcase{padding-block:40px 56px;border-top:1px solid var(--line-strong)}
.product-showcase:last-child{padding-bottom:0}
.product-showcase__heading{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:32px}
.product-showcase__heading h3{font:400 clamp(40px,5.2vw,68px)/1.1 var(--serif);letter-spacing:-.03em}
.product-showcase__heading .project__category{line-height:1.5}
.product-showcase__statement{font:400 clamp(23px,2.5vw,32px)/1.18 var(--serif);color:var(--text-2)}
.product-showcase__grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:40px;align-items:center}
.product-showcase__copy>p:first-child{font-size:17px;line-height:1.8}
.product-showcase__copy .tags{margin-block:24px;flex-wrap:wrap}
.product-showcase__note{color:var(--text-2);font-size:13px;line-height:1.7;margin-bottom:26px}
.product-gallery{display:grid;grid-template-columns:1fr 1fr;gap:12px;min-width:0}
.gallery-item{margin:0;border-radius:14px;overflow:hidden;border:1px solid var(--line-strong);background:var(--surface-0)}
.gallery-item--main{grid-column:1/-1}
.gallery-open{display:block;text-decoration:none}
.gallery-image{display:block;aspect-ratio:2/1;overflow:hidden;background:#0b1017}
.gallery-image img{width:100%;height:100%;object-fit:cover;object-position:center top;transition:transform .5s var(--ease)}
.gallery-open:hover img{transform:scale(1.02)}
.gallery-item:not(.gallery-item--main) .gallery-image{aspect-ratio:1.7}
[data-product="fiscal-pro"] .gallery-item:not(.gallery-item--main) .gallery-image img{object-fit:cover;object-position:top}
[data-product="arbitterminal"] .gallery-item--main .gallery-image{aspect-ratio:1.55}
[data-product="arbitterminal"] .gallery-item--main .gallery-image img{object-fit:contain;object-position:center;background:radial-gradient(ellipse at center,#1b2434,#080d18 80%)}
.gallery-label{display:flex;justify-content:space-between;gap:8px;padding:12px 14px;font-size:12px;color:var(--text-1)}
.product-viewer{width:min(1340px,96vw);max-width:none;max-height:94dvh;padding:20px;border:1px solid var(--line-strong);border-radius:20px;margin:auto;background:var(--surface-1);color:var(--text-1);box-shadow:0 20px 100px #0008}
.product-viewer::backdrop{background:#080807df;backdrop-filter:blur(8px)}
.viewer-top{display:flex;justify-content:space-between;align-items:center;gap:16px;font-weight:600}
.viewer-top p{font-size:16px;line-height:1.4}
.product-viewer button,.product-viewer a{background:var(--surface-2);border:1px solid var(--line-strong);color:var(--text-1);border-radius:9px;padding:10px 14px;font:500 13px var(--sans);cursor:pointer;text-decoration:none;min-height:44px}
.product-viewer button:hover,.product-viewer a:hover{border-color:var(--accent-ink)}
.viewer-help{font-size:12px;color:var(--text-2);margin:12px 0}
.viewer-controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.viewer-controls>span{padding:0 8px;font-size:13px}
.viewer-scroll{overflow:auto;max-height:67dvh;overscroll-behavior:contain;touch-action:pan-x pan-y pinch-zoom;border-radius:10px;background:#0a0e17}
.viewer-scroll img{margin:auto;width:auto;max-width:100%;max-height:65dvh;object-fit:contain}
.viewer-scroll.is-zoomed img{max-width:none;max-height:none;width:max(100%,1200px);height:auto;object-fit:initial;margin:0}
@media(max-width:900px){.product-showcase__grid{grid-template-columns:1fr;gap:28px}.product-showcase__copy{max-width:700px}.product-gallery{max-width:720px}.product-showcase__statement{font-size:25px}}
@media(max-width:560px){.demo-grid{gap:20px}.demo-card .project__purpose{min-height:0}.product-showcase__heading{display:block;margin-bottom:24px}.product-showcase__statement{margin-top:20px}.product-showcase__statement br{display:none}.product-showcase__heading h3{font-size:clamp(34px,9vw,48px)}.product-showcase__copy>p:first-child{font-size:16px}.product-gallery{gap:8px}.gallery-label{padding:10px;font-size:11px}.gallery-item--main .gallery-image{aspect-ratio:1.6}.product-viewer{padding:12px;width:96vw}.viewer-top{align-items:start}.viewer-top p{font-size:14px}.viewer-close{flex-shrink:0}.viewer-controls{gap:6px}.viewer-controls>span{padding:0 3px}.product-viewer button,.product-viewer a{padding:8px 11px;font-size:12px}.viewer-scroll{max-height:65dvh}}
@media(prefers-reduced-motion:reduce){.demo-card,.demo-card__image img,.gallery-image img{transition:none}}

.viewer-scroll img{height:auto}

/* Shorter mobile portfolio overview; full-size product galleries stay prominent. */
@media(max-width:560px){
 .demo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .demo-card{border-radius:16px;display:flex;flex-direction:column}
 .demo-card__body{padding:16px 14px;display:flex;flex-direction:column;flex:1}
 .demo-card h3{font-size:24px;line-height:1.15}
 .demo-card .project__category{font-size:13px;letter-spacing:.02em;line-height:1.4;margin-bottom:10px}
 .demo-card .project__category span,.demo-card__image>span{display:none}
 .demo-card .project__purpose{font-size:14px;line-height:1.55;margin-bottom:16px}
 .demo-card .tlink{margin-top:auto;font-size:14px}
 .gallery-label,.viewer-help,.product-viewer button,.product-viewer a{font-size:13px}
 .projects,.products,.services,.why{padding-block:56px}
 .why__statement{margin-bottom:32px}
 .why__list li{padding-block:18px;grid-template-columns:52px 1fr}
 .svc-col__list li{padding-block:7px;line-height:1.55}
}

/* ---------- compact product showcases: one main screenshot + a thumbnail strip ----------
   All six real screenshots stay; the secondary two open full size in the viewer. */
.products{padding-block:clamp(56px,6vw,96px)}
.products__intro{margin-bottom:clamp(28px,3.4vw,44px)}
.products__intro h2{font-size:clamp(40px,5.4vw,76px)}
.product-showcase{padding-block:clamp(24px,2.6vw,36px)}
.product-showcase__heading{margin-bottom:18px}
.product-showcase__heading h3{font-size:clamp(34px,4vw,56px)}
.product-showcase__statement{font-size:clamp(20px,2vw,26px)}
@media (min-width:901px){.product-showcase__grid{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(24px,3vw,44px);align-items:start}}
.product-gallery{gap:10px}
.gallery-item--main .gallery-image,[data-product="arbitterminal"] .gallery-item--main .gallery-image{aspect-ratio:16/9}
.gallery-item:not(.gallery-item--main) .gallery-image{aspect-ratio:2.6}
.gallery-label{padding:9px 12px;min-height:40px;align-items:center;overflow-wrap:anywhere;hyphens:auto}
.product-showcase__copy>p:first-child{font-size:16.5px;line-height:1.7}
.product-showcase__copy .tags{margin-block:16px}
.product-showcase__note{margin-bottom:16px}
@media (max-width:560px){.gallery-item:not(.gallery-item--main) .gallery-image{aspect-ratio:2}.product-showcase__copy>p:first-child{font-size:15.5px;line-height:1.65}.product-showcase__statement{display:none}}

/* Demo cards: one link per card ("Ver demo"), stretched over the whole card. */
.demo-card{position:relative}
.demo-card__link{position:static;display:inline-flex;align-items:center;min-height:44px}
.demo-card__link::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:1}
.demo-card__link:focus-visible{outline:none}
.demo-card:has(.demo-card__link:focus-visible){outline:2px solid var(--focus);outline-offset:3px}
@media (max-width:860px){.foot a{min-height:44px}.foot ul{gap:2px}.foot__base span a{padding-inline:4px}}