@font-face{font-family:"Space Grotesk";src:url('../brand/fonts/SpaceGrotesk.ttf') format('truetype');font-weight:300 700;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url('../brand/fonts/JetBrainsMono.ttf') format('truetype');font-weight:100 800;font-display:swap}
:root{
  --red:#FF3040;--red-d:#bd1322;--ink:#0B0B0E;--ink-2:#62626c;--bg:#faf9f8;--bg-2:#F5F5F7;--card:#fff;--line:#e8e5e3;
  --r-s:10px;--r-m:16px;--r-l:28px;--shadow:0 12px 32px -16px rgba(30,20,20,.22);
  --font:"Space Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--font-mono:"JetBrains Mono",monospace;--wrap:1240px;--gut:clamp(18px,4vw,40px)
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.55}
svg{max-width:100%}a{color:inherit;text-decoration:none}ul{list-style:none;margin:0;padding:0}
h1,h2,h3,p,figure,blockquote{margin:0}button{font:inherit}
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:8px 14px;border-radius:8px;z-index:100}.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--red);outline-offset:3px;border-radius:6px}
.red{color:var(--red)}.ic{flex:none}[hidden]{display:none!important}

h1{font-size:clamp(2.5rem,5.6vw,4rem);line-height:1.05;font-weight:800;letter-spacing:-.035em}
h2{font-size:clamp(1.8rem,3.2vw,2.5rem);line-height:1.1;font-weight:800;letter-spacing:-.03em}
h3{font-size:1.02rem;font-weight:700}
.lead{font-size:1.05rem;color:var(--ink-2);max-width:52ch}.muted{color:var(--ink-2)}
.eyebrow{display:flex;align-items:center;gap:12px;font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin-bottom:14px}
.eyebrow::before{content:"";width:34px;height:2px;background:var(--red)}
.eyebrow.light{color:#fff}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:700;font-size:.9rem;padding:14px 24px;border-radius:12px;border:1.5px solid transparent;cursor:pointer;transition:transform .15s,background .15s}
.btn-red{background:linear-gradient(180deg,#f0141f,var(--red-d));color:#fff;box-shadow:0 10px 22px -10px rgba(227,6,19,.75)}
.btn-red:hover{transform:translateY(-2px)}
.btn-ghost{background:#fff;border-color:var(--line)}.btn-ghost:hover{border-color:var(--ink)}
.btn-outline{border-color:rgba(255,255,255,.6);color:#fff}.btn-outline:hover{background:#fff;color:var(--ink)}
.btn-row{display:flex;flex-wrap:wrap;gap:14px}
.play{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--ink);color:#fff}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(250,249,248,.88);backdrop-filter:blur(12px)}
.bar{display:flex;align-items:center;gap:28px;height:76px}
.logo{display:inline-flex;align-items:center;gap:6px}
.logo-t{font-size:1.45rem;font-weight:800;letter-spacing:-.01em}.logo-t sup{font-size:.4em;vertical-align:top}
.logo.light .logo-t,.site-footer .logo-t{color:var(--ink)}
.nav{display:flex;gap:34px;margin-inline:auto;font-weight:600;font-size:.88rem}
.nav a{position:relative;padding:6px 0;transition:color .28s ease}
.nav a.active{color:var(--ink)}
.nav a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;background:var(--red);border-radius:2px;transform:scaleX(0);transform-origin:left center;transition:transform .32s cubic-bezier(.22,1,.36,1)}
.nav a.active::after,.nav a:not(.btn):focus-visible::after{transform:scaleX(1)}
.nav a:not(.btn):focus-visible{color:var(--red)}
@media(hover:hover){.nav a:not(.btn):hover{color:var(--red)}.nav a:not(.btn):hover::after{transform:scaleX(1)}}
.nav-cta{display:none}
.bar-actions{display:flex;align-items:center;gap:16px}
.lang{position:relative;isolation:isolate;display:flex;background:#ebe9e8;border-radius:10px;padding:3px;font-weight:700;font-size:.78rem}
.lang::before{content:"";position:absolute;inset:3px auto 3px 3px;width:calc((100% - 6px)/2);background:#fff;border-radius:8px;box-shadow:0 1px 3px rgba(0,0,0,.12);pointer-events:none;z-index:-1;transition:transform .3s cubic-bezier(.22,1,.36,1),background-color .25s ease}
.lang:has(a:nth-child(2).on)::before{transform:translateX(100%)}
.lang a{flex:1;text-align:center;padding:6px 11px;border-radius:8px;color:var(--ink-2);transition:color .25s ease,background-color .25s ease}
.lang a.on{color:var(--ink)}
@media(hover:hover){
  .lang:has(a:first-child:hover)::before{transform:translateX(0);background:#fff5f6}
  .lang:has(a:nth-child(2):hover)::before{transform:translateX(100%);background:#fff5f6}
  .lang a:hover{color:var(--red)}
}
.lang:has(a:first-child:focus-visible)::before{transform:translateX(0)}
.lang:has(a:nth-child(2):focus-visible)::before{transform:translateX(100%)}
.lang a:active{background-color:#ffdce2}
.lang a:focus-visible{outline:2px solid var(--red);outline-offset:-2px;border-radius:8px}
.burger{display:none;width:44px;height:44px;background:none;border:0;padding:10px;cursor:pointer;flex-direction:column;justify-content:center;gap:6px}
.burger span{display:block;height:2.5px;background:var(--ink);border-radius:2px;transition:.2s}
.burger[aria-expanded=true] span:nth-child(1){transform:translateY(8.5px) rotate(45deg)}
.burger[aria-expanded=true] span:nth-child(2){opacity:0}
.burger[aria-expanded=true] span:nth-child(3){transform:translateY(-8.5px) rotate(-45deg)}

/* hero */
.hero{position:relative;isolation:isolate;overflow:hidden;padding-top:clamp(16px,3vw,36px);background:radial-gradient(60% 70% at 75% 30%,rgba(227,6,19,.09),transparent 70%)}
.hero > .wrap{position:relative;z-index:1}
.hero-wave{position:absolute;z-index:0;pointer-events:none;right:-25px;top:-45px;width:clamp(210px,25vw,360px);height:auto;opacity:1;overflow:visible}
.hero-wave-ribbon{transform-box:view-box;transform-origin:100% 0;animation:hero-wave-sway 3s ease-in-out infinite alternate;will-change:transform}
@keyframes hero-wave-sway{from{transform:translate(-20px,-15px) rotate(-9deg) scaleX(.88)}to{transform:translate(16px,30px) rotate(9deg) scaleX(1.12)}}
@media(max-width:900px){.hero-wave{width:190px;right:-45px;top:-45px;opacity:.95}}
@media(prefers-reduced-motion:reduce){.hero-wave-ribbon{animation:none}}
.hero-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:10px;align-items:center}
.hero h1{margin-bottom:20px}
.hero .lead{margin-bottom:28px;color:var(--ink);font-size:1rem;max-width:44ch}
.proof{display:flex;align-items:center;gap:14px;margin-top:28px;font-size:.82rem}
.proof b{display:block}.proof small{color:var(--ink-2)}
.faces{display:flex}.faces i{width:36px;height:36px;border-radius:50%;border:2px solid #fff;margin-left:-9px;display:grid;place-items:center;font-style:normal;font-weight:700;font-size:.8rem;color:#fff;background:linear-gradient(135deg,#2b2b31,#6a6a72)}
.faces i:first-child{margin-left:0}
.hero-visual{position:relative}
.hv{width:100%;display:block;filter:drop-shadow(0 24px 30px rgba(120,10,16,.22))}
.pills{position:absolute;right:0;top:6%;display:grid;gap:10px;width:min(210px,40%)}
.pills li{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.92);border:1px solid var(--line);border-radius:12px;padding:11px 14px;font-weight:600;font-size:.78rem;box-shadow:var(--shadow)}
.pills .ic{color:var(--red)}
@media(prefers-reduced-motion:no-preference){
  .pills li{animation:pill-glow 6s ease-in-out infinite}
  .pills li .ic{animation:pill-icon 6s ease-in-out infinite}
  .pills li:nth-child(2){animation-delay:-1.4s}
  .pills li:nth-child(3){animation-delay:-2.8s}
  .pills li:nth-child(4){animation-delay:-4.2s}
  .pills li:nth-child(2) .ic{animation-delay:-1.4s}
  .pills li:nth-child(3) .ic{animation-delay:-2.8s}
  .pills li:nth-child(4) .ic{animation-delay:-4.2s}
}
@keyframes pill-glow{0%,100%{box-shadow:var(--shadow)}50%{box-shadow:0 8px 24px -10px rgba(227,6,19,.22)}}
@keyframes pill-icon{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
.statbar{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid var(--line);border-radius:var(--r-m);box-shadow:var(--shadow);margin-top:10px;position:relative}
.statbar li{display:flex;align-items:center;gap:16px;padding:22px 26px;border-left:1px solid var(--line)}
.statbar li:first-child{border:0}.statbar .ic{color:var(--red)}
.statbar b{display:block;font-size:1.5rem;font-weight:800;line-height:1.1}
.statbar small{font-size:.82rem;color:var(--ink-2)}

/* sections */
.section{padding-block:clamp(32px,4vw,48px)}.section.tight{padding-top:10px}
.section + .section{padding-top:20px}
.head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:22px}
.head .muted{max-width:38ch;font-size:.92rem}
.svc-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.svc{position:relative;display:flex;flex-direction:column;gap:6px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-m);padding:0 16px 18px;overflow:hidden;box-shadow:var(--shadow);transition:transform .2s,border-color .2s}
.svc:hover{transform:translateY(-4px);border-color:rgba(227,6,19,.4)}
.svc-art{margin:0 -16px 8px;background:linear-gradient(180deg,#fde6e7,#fff);padding:10px 14px 0}
.svc-art svg{display:block;width:100%;height:auto;max-height:140px}
.svc h3{font-size:.95rem}.svc p{font-size:.8rem;color:var(--ink-2);padding-bottom:26px}
.go{position:absolute;right:14px;bottom:14px;width:28px;height:28px;border-radius:50%;background:#fdeaeb;color:var(--red);display:grid;place-items:center}

.chips{display:flex;flex-wrap:wrap;gap:10px}
.chips button{background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 18px;font-size:.78rem;font-weight:600;cursor:pointer;color:var(--ink)}
.chips button[aria-selected=true]{background:var(--red);border-color:var(--red);color:#fff}
.proj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.proj{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden;box-shadow:var(--shadow)}
.proj-art{position:relative;aspect-ratio:16/9.2;overflow:hidden}
.proj-art svg{width:100%;height:100%;display:block;transition:transform .4s}.proj:hover .proj-art svg{transform:scale(1.04)}
.tag{position:absolute;left:12px;top:12px;z-index:1;background:rgba(255,255,255,.18);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.3);color:#fff;font-size:.68rem;font-weight:600;padding:4px 10px;border-radius:8px}
.proj-body{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 16px}
.proj-body h3{font-size:1.1rem}.proj-body p{font-size:.78rem;color:var(--ink-2)}
.round-s{width:32px;height:32px;border:1px solid var(--line);border-radius:9px;display:grid;place-items:center;flex:none}
.empty{text-align:center;color:var(--ink-2);padding:30px}

.why{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) minmax(0,1fr);gap:34px;align-items:center}
.why > *{min-width:0}
#why{overflow:clip}
.why h2{margin-bottom:14px}.why .muted{font-size:.9rem;max-width:44ch}
.why-list{display:grid;gap:14px}
.why-list li{display:flex;gap:16px;align-items:center;padding-bottom:14px;border-bottom:1px solid var(--line)}
.why-list li:last-child{border:0}.why-list .ic{color:var(--red)}
.why-list b{display:block;font-size:.92rem}.why-list small{font-size:.8rem;color:var(--ink-2)}
.why-art svg{width:100%;display:block}

.arrows{display:flex;gap:10px}
.round{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#fff;display:grid;place-items:center;cursor:pointer}
.round:hover{background:var(--ink);color:#fff}
.rev-track{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.rev{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:20px 22px;display:flex;flex-direction:column;gap:12px;box-shadow:var(--shadow)}
.stars{display:flex;gap:2px;color:var(--red)}
.rev p{font-size:.88rem}
.rev figcaption{display:flex;align-items:center;gap:12px}
.rev figcaption b{display:block;font-size:.85rem}.rev figcaption small{font-size:.75rem;color:var(--ink-2)}
.avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#2b2b31,#6a6a72);color:#fff;font-weight:700;display:grid;place-items:center}
.qm{position:absolute;right:18px;bottom:6px;font-size:4.5rem;font-weight:800;line-height:1;color:#ececec}

.cta-wrap{padding-block:20px 36px}
.cta{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:clamp(26px,4vw,40px) clamp(24px,5vw,56px);border-radius:var(--r-l);color:#fff;background:linear-gradient(110deg,#150507,#3a070c 55%,#2a050a)}
.cta-wave{position:absolute;inset:auto 0 0 0;width:100%;height:70%;pointer-events:none}
.cta-l,.cta .btn-row{position:relative;z-index:1}
.cta h2{margin-bottom:8px}.cta-l p:last-child{opacity:.85;font-size:.92rem;max-width:44ch}

/* inner pages */
.page-head{padding-bottom:6px}.page-head h1{font-size:clamp(2.2rem,5vw,3.3rem);margin-bottom:14px}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.detail{display:grid;grid-template-columns:170px 1fr;gap:22px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:18px;box-shadow:var(--shadow)}
.detail .svc-art{margin:0;border-radius:12px}
.detail h2{font-size:1.4rem;margin-bottom:6px}
.ticks li{padding-left:24px;position:relative;margin-top:8px;font-weight:600;font-size:.88rem}
.ticks li::before{content:"";position:absolute;left:0;top:.45em;width:11px;height:6px;border-left:2.5px solid var(--red);border-bottom:2.5px solid var(--red);transform:rotate(-45deg)}
.contact-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:22px;align-items:start}
.form,.info{background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:28px;box-shadow:var(--shadow)}
.form{display:grid;gap:16px}
.form label{display:grid;gap:7px;font-weight:600;font-size:.85rem}
.form input,.form select,.form textarea{font:inherit;padding:13px 14px;border:1.5px solid var(--line);border-radius:var(--r-s);background:#fff;width:100%}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px rgba(227,6,19,.15)}
.form em{color:var(--red);font-style:normal;font-size:.8rem;font-weight:500}
.hp{position:absolute;left:-9999px;opacity:0;height:0}
.notice{padding:12px 16px;border-radius:var(--r-s);font-weight:600;font-size:.9rem}
.notice.ok{background:#e6f6ec;color:#0c6b34}.notice.err{background:#fde8ea;color:#a30410}
.info h2{font-size:1.3rem;margin-bottom:16px}

/* footer */
.site-footer{background:#fff;border-top:1px solid var(--line);padding-top:44px}
.foot-grid{display:grid;grid-template-columns:1.1fr .8fr 1.1fr 1.4fr 1.3fr;gap:30px}
.foot-brand p{margin:6px 0 16px;font-size:.88rem;color:var(--ink-2)}
.site-footer h3{font-size:.92rem;margin-bottom:14px}
.foot-links li{margin-bottom:8px;font-size:.82rem;color:var(--ink-2)}.foot-links a:hover,.foot-contact a:hover{color:var(--red)}
.foot-contact li{display:flex;gap:10px;align-items:center;margin-bottom:12px;font-size:.84rem}
.foot-contact .ic{color:var(--red)}
.avail i{width:9px;height:9px;border-radius:50%;background:#22c55e;flex:none;margin:0 4px}
.social{display:flex;gap:8px}
.social a{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--line);border-radius:10px}.social a:hover{border-color:var(--red);color:var(--red)}
.news p{font-size:.82rem;color:var(--ink-2);margin-bottom:12px}
.sub{display:flex;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.sub input[type=email]{flex:1;min-width:0;border:0;padding:12px 14px;font:inherit;font-size:.82rem}
.sub input:focus{outline:none}
.sub button{width:46px;border:0;background:var(--red);color:#fff;display:grid;place-items:center;cursor:pointer}
.sub-msg{font-weight:600}.sub-msg.ok{color:#0c6b34!important}.sub-msg.err{color:var(--red-d)!important}
.foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:30px;padding-block:20px;border-top:1px solid var(--line);font-size:.78rem;color:var(--ink-2)}
.legal{display:flex;gap:28px}.legal a:hover{color:var(--red)}

/* tablet */
@media (max-width:1100px){
  .svc-grid{grid-template-columns:repeat(3,1fr)}
  .foot-grid{grid-template-columns:repeat(3,1fr)}
  .foot-brand{grid-column:1/-1}
  .why{grid-template-columns:1fr 1fr}.why-art{grid-column:1/-1;max-width:420px}
}
@media (max-width:900px){
  .bar{height:68px;justify-content:space-between;gap:12px}
  .bar-actions{margin-left:auto;flex-shrink:0;gap:12px}
  .hide-m{display:none}.burger{display:flex}
  .nav{position:fixed;inset:68px 0 auto 0;flex-direction:column;gap:0;margin:0;background:var(--bg);padding:10px var(--gut) 24px;border-bottom:1px solid var(--line);box-shadow:0 20px 30px -20px rgba(0,0,0,.25);transform:translateY(-12px);opacity:0;visibility:hidden;transition:.2s}
  .nav.open{transform:none;opacity:1;visibility:visible}
  .nav a{padding:14px 0;font-size:1rem;border-bottom:1px solid var(--line)}.nav a:not(.btn)::after{display:none}.nav a.active{color:var(--red)}
  .nav-cta{display:inline-flex;margin-top:16px;border:0!important;color:#fff!important}
  .hero-grid{grid-template-columns:1fr;gap:24px}
  .hero-visual{order:0;width:100%;max-width:560px;min-width:0;margin:0 auto;padding:0}
  .hero .hv{width:100%;height:auto;aspect-ratio:2 / 1;object-fit:contain;filter:drop-shadow(0 10px 12px rgba(65,20,20,.12))}
  .pills{display:none}
  .statbar{grid-template-columns:repeat(2,1fr)}
  .statbar li:nth-child(3){border-left:0}.statbar li:nth-child(n+3){border-top:1px solid var(--line)}
  .proj-grid{grid-template-columns:1fr 1fr}
  .rev-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
  .rev{flex:0 0 min(340px,86%);scroll-snap-align:start}
  .grid2,.contact-grid{grid-template-columns:1fr}
}
@media (max-width:620px){
  .svc-grid{grid-template-columns:repeat(2,1fr)}
  .proj-grid{grid-template-columns:1fr}
  .why{grid-template-columns:1fr}
  .detail{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}.foot-grid>div:nth-child(4),.news{grid-column:1/-1}
  .statbar li{padding:16px 14px;gap:10px}.statbar .ic{width:26px;height:26px}
  .foot-bottom{flex-direction:column}.legal{flex-wrap:wrap;gap:16px}
  .cta{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* Generated artwork preserves the card geometry. */
.svc-art img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain}
.svc-art{padding:0;background:transparent}
.proj-art img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s}
.proj:hover .proj-art img{transform:scale(1.04)}
.why-art img{display:block;width:100%;height:auto}
.cta{background:#150507}
.cta-wave{display:none}
/* Subtle background motion stays behind the readable CTA content. */
.cta{isolation:isolate}
.cta-silk-bg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
@media(prefers-reduced-motion:no-preference){
  .cta.cta-in-view .cta-silk-image{filter:url(#cta-local-wave)}
  .cta.scroll-enter .cta-l>*{animation:cta-content .8s cubic-bezier(.22,1,.36,1) both}
  .cta.scroll-enter .cta-l>:nth-child(2){animation-delay:.12s}
  .cta.scroll-enter .cta-l>:nth-child(3){animation-delay:.24s}
  .cta.scroll-enter .btn-row{animation:cta-content .8s cubic-bezier(.22,1,.36,1) .36s both}
  .cta .btn-red .ic{transition:translate .25s ease}
  .cta .btn-red:hover .ic,.cta .btn-red:focus-visible .ic{translate:3px -3px}
}
@keyframes cta-content{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1000px) and (max-width:1100px){.svc-grid{grid-template-columns:repeat(6,1fr)}.why{grid-template-columns:1.1fr 1fr 1fr}.why-art{grid-column:auto}.nav{gap:24px}.bar{gap:18px}}



/* Hero composition follows the supplied reference. */
@media(min-width:901px){
  .hero{padding-top:12px}
  .hero-grid{grid-template-columns:44% 56%;gap:0;align-items:center;min-height:clamp(310px,31vw,390px)}
  .hero-copy{position:relative;z-index:2;padding-bottom:20px}
  .hero h1{font-size:clamp(2.45rem,3.8vw,3.5rem);margin-bottom:14px}
  .hero .eyebrow{margin-bottom:14px}
  .hero .lead{font-size:.9rem;line-height:1.35;margin-bottom:18px;max-width:42ch}
  .hero .proof{margin-top:20px}
  .hero-visual{align-self:stretch;display:flex;align-items:flex-end;margin-left:-80px;width:calc(100% + 80px);height:auto;min-height:clamp(310px,31vw,390px);min-width:0}
  .hero .hv{position:absolute;left:0;bottom:-4px;width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:none}
  .hero .pills{right:0;top:12%;width:clamp(166px,17vw,210px);gap:7px;z-index:3}
  .hero .pills li{min-height:48px;padding:10px 14px}
  .hero .statbar{margin-top:0}
}


/* A single, consistent icon family in square service tiles. */
.svc{aspect-ratio:1;display:flex;align-items:center;justify-content:center;gap:12px;padding:18px 10px;text-align:center;box-shadow:none}
.svc .svc-art{margin:0;width:clamp(64px,7.5vw,102px);flex:none;background:none}
.svc .svc-art img{width:100%;height:auto;aspect-ratio:1;object-fit:contain}
.svc h3{font-size:clamp(.76rem,1.1vw,.95rem);line-height:1.3;max-width:100%;min-height:2.6em;display:flex;align-items:center;justify-content:center}
.detail .svc-art img{aspect-ratio:1;max-width:112px;margin-inline:auto}
@media(max-width:900px){.svc .svc-art{width:clamp(72px,12vw,112px)}.svc h3{font-size:.95rem}}
@media(max-width:380px){.svc{padding:12px 8px;gap:8px}.svc .svc-art{width:64px}.svc h3{font-size:.8rem}}
/* Red and black 3D service icon pack. */
.svc{background:linear-gradient(155deg,#fff9fa,#fff1f2);border-color:#f4e3e5;padding:12px 10px;gap:4px}
.svc .svc-art{width:76%;max-width:132px}
.svc .svc-art img{display:block;aspect-ratio:1;object-fit:contain}
.svc h3{flex:none}
@media(max-width:900px){.svc .svc-art{width:72%;max-width:148px}}
@media(max-width:380px){.svc .svc-art{width:66%}}
.svc{display:grid;grid-template-rows:minmax(0,1fr) auto;justify-items:center;gap:4px}
.svc .svc-art{width:100%;height:100%;min-height:0;max-width:none}
.svc .svc-art img{width:100%;height:100%;object-fit:contain}
.svc h3{margin:0;min-height:2.6em}
/* Home ribbons and soft red accents */
.about-process{padding:28px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,#fff,#fff5f5)}
.about-process h3{font-size:1.35rem;line-height:1.25;margin-bottom:24px}
.about-process .eyebrow{font-size:.65rem}
.about-process ol{list-style:none;padding:0;margin:0;display:grid;gap:22px}
.about-process li{display:flex;gap:14px;align-items:flex-start}
.about-process li>span{color:var(--red);font-size:.75rem;font-weight:800;padding-top:3px}
.about-process li b{font-size:.9rem}
.about-process li p{font-size:.8rem;color:var(--ink-2);margin-top:4px}
.back-top{position:fixed;bottom:24px;right:24px;z-index:60;display:grid;place-items:center;width:46px;height:46px;border:1px solid #ff5360;border-radius:50%;background:var(--red);color:white;box-shadow:0 6px 20px #e3061333;cursor:pointer}
.back-top svg{transform:rotate(-45deg)}
.svc,.proj,.rev{transition:transform .35s ease,box-shadow .35s ease,opacity .5s ease}
.reveal-pending{opacity:0;translate:0 14px}
.scroll-enter{animation:scroll-enter 1.1s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms) both}
@keyframes scroll-enter{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}
.btn:active,.back-top:active{transform:scale(.96)}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.svc:hover,.proj:hover,.rev:hover{transform:translateY(-5px);box-shadow:0 16px 32px rgba(90,25,35,.12)}.btn-ghost:hover{transform:translateY(-2px);box-shadow:0 8px 20px #16161a12}.back-top:hover{transform:translateY(-4px)}}
@media(prefers-reduced-motion:reduce){.reveal-pending{opacity:1;translate:none}.scroll-enter{animation:none}}
.hero{padding-bottom:120px;background:radial-gradient(ellipse at 100% 8%,#ffe1e5 0,transparent 38%),linear-gradient(160deg,#fcf9f9,#fff 65%,#fff1f3)}
.hero-wave-bottom{position:absolute;bottom:-1px;left:0;width:100%;height:120px;z-index:0;pointer-events:none;overflow:visible;-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 45%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0%,#000 45%,transparent 100%)}
.hero::after{content:"";position:absolute;z-index:0;pointer-events:none;inset:auto 0 0;height:55px;background:linear-gradient(to bottom,transparent,var(--bg))}
.wave-front,.wave-back{transform-origin:center bottom;animation:home-ribbon-flow 4s ease-in-out infinite alternate}
.wave-back{animation-delay:-2s;animation-duration:5s}
@keyframes home-ribbon-flow{from{transform:translateY(8px) scaleY(.85)}to{transform:translateY(-8px) scaleY(1.15)}}
.hero .proof>span:last-child{border-left:1px solid #f4a8b0;padding-left:18px}
.hero .statbar{overflow:hidden;border-color:#f0e7e9;box-shadow:0 12px 28px rgba(128,32,48,.09)}
.hero .statbar .ic{box-sizing:content-box;padding:11px;border-radius:15px;background:#fdebed;color:var(--red)}
.hero .btn-red{background:linear-gradient(160deg,#ff1022,#c80010);box-shadow:0 8px 20px rgba(227,6,19,.22);border-color:#ff5360}
@media(max-width:900px){.hero{padding-top:28px;padding-bottom:96px}.hero-wave-bottom{height:90px}.hero h1{letter-spacing:-.045em;line-height:1.02}.hero .statbar{margin-top:24px}.hero-wave{width:190px;right:-45px;top:-45px}}
@media(max-width:380px){.hero .statbar .ic{padding:8px;width:22px;height:22px}.hero .statbar li{gap:8px;padding:16px 10px}}
@media(prefers-reduced-motion:reduce){.wave-front,.wave-back{animation:none}}

.about-portrait{width:100%;max-width:320px;justify-self:center;border-radius:24px;overflow:hidden;background:#f2eeec;box-shadow:0 16px 40px rgba(50,25,25,.08)}
.about-portrait img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
@media(max-width:900px) and (min-width:621px){.about-portrait{grid-column:1/-1}}

.about-portrait{width:min(100%,230px);max-width:100%;position:relative;margin:0;align-self:center}
.about-portrait img{position:static;max-width:100%;width:100%;height:auto;transform:none}
.about-portrait figcaption{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;background:#fff;font-size:1rem;font-weight:800}
.about-portrait figcaption span{font-size:.65rem;letter-spacing:.12em;color:var(--ink-2);font-weight:600}
@media(min-width:901px){
  .why{align-items:start;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) 180px;gap:clamp(24px,3vw,44px)}
  .about-portrait{width:100%;max-width:180px;align-self:start;justify-self:start}
  .about-portrait img{aspect-ratio:4/5;object-fit:contain;object-position:center}
  .about-portrait figcaption{padding:12px 14px;font-size:.85rem}
  .about-portrait figcaption span{font-size:.55rem;letter-spacing:.06em}
}
.about-portrait{padding:5px;border:1px solid #e6d7d9;border-radius:22px;background:linear-gradient(145deg,#fff,#f5e6e8);box-shadow:0 12px 28px rgba(55,24,30,.1)}
.about-portrait img{border-radius:17px;image-rendering:auto}
.about-portrait figcaption{position:absolute;bottom:13px;left:13px;right:13px;padding:10px 12px;border:1px solid rgba(255,255,255,.6);border-left:3px solid var(--red);border-radius:10px;background:rgba(255,255,255,.9);backdrop-filter:blur(12px);box-shadow:0 4px 14px #16161a0d}

/* Consistent spacing between content groups across pages. */
.hero{padding-bottom:64px}
.hero-wave-bottom{height:76px}
.hero + .section{padding-top:24px}
.eyebrow{margin-bottom:12px}
.svc,.proj,.detail{box-shadow:0 3px 12px rgba(30,20,20,.035)}
.rev{box-shadow:none}
.head > div{min-width:0}
.head .muted{line-height:1.5}
.page-head + .section{padding-top:24px}
.site-footer{padding-top:32px}
.foot-grid{gap:24px}
@media(max-width:900px){
  .hero{padding-bottom:48px}
  .hero-wave-bottom{height:60px}
  .hero-grid{gap:18px}
  .hero .statbar{margin-top:16px}
  .why{gap:24px}
  .head{gap:12px;margin-bottom:20px}
}
@media(max-width:620px){
  .section{padding-block:30px}
  .section + .section{padding-top:14px}
  .head{align-items:flex-start}
  .head .muted{max-width:100%}
  .cta-wrap{padding-block:14px 28px}
  .cta{padding:24px;gap:18px;border-radius:18px}
  .form,.info{padding:20px}
  .foot-grid{gap:24px 18px}
}

/* Imported identity: local fonts, folded symbol and brand accents. */
.brand-logo{display:block;width:170px;height:auto}
.eyebrow,.tag,.lang,.about-portrait figcaption span{font-family:var(--font-mono)}
h1,h2,h3,.logo{font-weight:700}
.hero h1{font-weight:700}
.hero .btn-red,.btn-red{background:linear-gradient(160deg,#D91E30,var(--red-d));border-color:#FF3040}
@media(max-width:620px){.brand-logo{width:142px}.bar-actions{gap:8px}}

/* Current supplied logo replaces the home laptop artwork. */
.hero .hero-brand{display:flex;align-items:center;justify-content:center;margin-left:0;width:100%;min-width:0}
.hero .hero-brand .hv{position:static;width:58%;max-width:300px;height:auto;aspect-ratio:153/103;object-fit:contain;filter:none;margin-right:130px}
@media(max-width:900px){.hero .hero-brand{min-height:0;padding:20px 0}.hero .hero-brand .hv{width:50%;max-width:220px;margin:0}}

/* Pointer feedback uses the native cursor and leaves touch layouts unchanged. */
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .mouse-card,.mouse-button{position:relative;isolation:isolate}
  .mouse-card{transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s,border-color .3s,opacity .5s}
  .mouse-card::after,.mouse-button::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:2;opacity:0;transition:opacity .35s;background:radial-gradient(circle 190px at var(--mouse-x,50%) var(--mouse-y,50%),rgba(255,48,64,.1),transparent 75%)}
  .mouse-card.mouse-active{transform:perspective(1000px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translateY(-3px);border-color:rgba(255,48,64,.25);box-shadow:0 12px 26px rgba(50,20,25,.09)}
  .mouse-active::after{opacity:1}
  .mouse-button{overflow:hidden;transition:transform .25s,box-shadow .25s,background .25s}
  .mouse-button::after{background:radial-gradient(circle 95px at var(--mouse-x,50%) var(--mouse-y,50%),rgba(255,255,255,.25),transparent 75%)}
  .mouse-button:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(50,20,25,.12)}
  .mouse-button:active{transform:translateY(0) scale(.98)}
  .nav a{transition:color .2s}
  .nav a:hover{color:var(--red)}
  .hero-visual .hv{transition:filter .4s}
  .hero-visual:hover .hv{filter:drop-shadow(0 10px 22px rgba(227,6,19,.15))}
}

.custom-cursor-dot,.custom-cursor-ring{display:none;position:fixed;top:0;left:0;pointer-events:none;z-index:10000}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .custom-cursor-on,.custom-cursor-on *{cursor:none!important}
  .custom-cursor-on .custom-cursor-dot,.custom-cursor-on .custom-cursor-ring{display:block}
  .custom-cursor-dot::before{content:"";position:absolute;width:6px;height:6px;left:-3px;top:-3px;border-radius:50%;background:var(--red);box-shadow:0 0 0 1px rgba(255,255,255,.8)}
  .custom-cursor-ring::before{content:"";position:absolute;width:30px;height:30px;left:-15px;top:-15px;border:1px solid var(--red);border-radius:50%;background:rgba(255,48,64,.035);transition:width .25s,height .25s,left .25s,top .25s,background .25s;box-shadow:0 0 0 1px rgba(255,255,255,.25)}
  .custom-cursor-link .custom-cursor-ring::before{width:46px;height:46px;left:-23px;top:-23px;background:rgba(255,48,64,.09)}
}

/* Flowing contours echo the folded ribbon in the brand symbol. */
.hero-streams{position:absolute;z-index:0;pointer-events:none;right:-8%;top:0;width:80%;height:100%;opacity:.65;mask-image:linear-gradient(90deg,transparent,#000 30%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 30%)}
.stream-drift{transform-origin:center;animation:stream-drift 12s ease-in-out infinite alternate}
.stream-highlight{animation:stream-travel 9s linear infinite;opacity:.65}
.stream-highlight-second{animation-delay:-4.5s;animation-duration:12s;opacity:.4}
@keyframes stream-travel{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
@keyframes stream-drift{from{transform:translateY(-8px) rotate(-1deg)}to{transform:translateY(12px) rotate(1deg)}}
@media(max-width:900px){.hero-streams{width:110%;right:-35%;height:75%;top:10%;opacity:.4}}
@media(prefers-reduced-motion:reduce){.stream-drift,.stream-highlight{animation:none}.stream-highlight{display:none}}

/* Scope-based packages: consistent hierarchy without invented rates. */
#pricing{scroll-margin-top:90px}
.pricing .head h2{max-width:20ch}
.pricing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.pricing-card{display:flex;flex-direction:column;min-width:0;padding:26px;border:1px solid var(--line);border-radius:16px;background:#fff}
.pricing-card-featured{border-color:#f0bdc3;background:linear-gradient(145deg,#fff,#fff5f6)}
.pricing-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;color:var(--red)}
.pricing-number{font:500 .72rem var(--font-mono);color:var(--ink-2)}
.pricing-card h3{font-size:1.3rem;letter-spacing:-.03em;margin-bottom:8px}
.pricing-description{font-size:.88rem;color:var(--ink-2);min-height:3.1em}
.pricing-quote{display:grid;gap:3px;margin:22px 0;padding-bottom:20px;border-bottom:1px solid var(--line)}
.pricing-quote strong{font-size:1.3rem;letter-spacing:-.03em}
.pricing-quote>span{font-size:.75rem;color:var(--ink-2)}
.pricing-features{display:grid;gap:12px;margin-bottom:28px}
.pricing-features li{display:flex;align-items:flex-start;gap:10px;font-size:.84rem}
.pricing-features .ic{color:var(--red);margin-top:3px}
.pricing-card>.btn{margin-top:auto;justify-content:space-between}
.pricing-note{font-size:.82rem;color:var(--ink-2);margin-top:20px}
.pricing-note a{color:var(--ink);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--red)}
@media(min-width:901px){.nav{gap:clamp(12px,1.6vw,24px)}}
@media(max-width:900px){.pricing-card{padding:20px}.pricing-grid{gap:12px}}
@media(max-width:700px){.pricing-grid{grid-template-columns:1fr}.pricing-description{min-height:0}.pricing-top{margin-bottom:16px}.pricing-quote{margin:18px 0}.pricing .head h2{max-width:100%}}

/* New service artwork: white linework and red highlights on black. */
.svc{background:#000;border-color:#252529;color:#F5F5F7;padding:12px 10px 16px}
.svc .svc-art{background:#000;overflow:hidden}
.svc .svc-art img{object-fit:contain}
.svc h3{color:#F5F5F7;font-weight:600}
.detail .svc-art{background:#000;border-radius:14px;overflow:hidden;padding:8px}
.detail .svc-art img{max-width:100%;width:100%;height:auto}
.newsletter-form{flex-wrap:wrap}.newsletter-consent{display:flex!important;align-items:flex-start;gap:8px;width:100%;font-size:.7rem;color:var(--ink-2);padding-top:8px}.newsletter-consent input{width:14px!important;height:14px;flex:none;margin:3px 0}

/* Services read as concise offers, with compact white-on-black icon badges. */
#services .svc-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
#services .svc{display:grid;grid-template-columns:64px minmax(0,1fr) 18px;grid-template-rows:auto;align-items:start;justify-items:stretch;gap:16px;aspect-ratio:auto;min-height:174px;padding:24px;text-align:left;background:#fff;border:1px solid #e6e3e3;border-radius:14px;color:var(--ink);box-shadow:none}
#services .svc .svc-art{width:64px;height:64px;max-width:64px;margin:0;padding:0;background:#000;border-radius:14px;overflow:hidden}
#services .svc .svc-art img{display:block;width:100%;height:100%;aspect-ratio:1;object-fit:contain}
#services .service-copy{min-width:0;padding-top:2px}
#services .svc h3{display:block;min-height:0;margin:0 0 9px;font-size:1.02rem;line-height:1.3;color:var(--ink);font-weight:700;text-align:left}
#services .svc p{padding:0;margin:0;font-size:.83rem;line-height:1.55;color:var(--ink-2)}
#services .service-arrow{color:#89838a;padding-top:3px;transition:color .25s,translate .25s}
@media(hover:hover) and (prefers-reduced-motion:no-preference){#services .svc:hover{border-color:#efb9c1;box-shadow:0 8px 22px #30141a08}#services .svc:hover .service-arrow{color:var(--red);translate:2px -2px}}
@media(max-width:1100px){#services .svc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){#services .svc-grid{grid-template-columns:1fr;gap:12px}#services .svc{min-height:0;padding:20px;gap:14px;grid-template-columns:56px minmax(0,1fr) 18px}#services .svc .svc-art{width:56px;height:56px;border-radius:12px}#services .svc h3{font-size:1rem;margin-bottom:6px}#services .svc p{font-size:.8rem}}

/* Correct optical offsets in the generated PNG canvases. */
.svc-art img[src$="services-white/web.png"]{transform:translate(-5.57%,-2.93%)}
.svc-art img[src$="services-white/brand.png"]{transform:translate(.10%,-3.71%)}
.svc-art img[src$="services-white/ux.png"]{transform:translate(5.37%,-2.93%)}
.svc-art img[src$="services-white/ai.png"]{transform:translate(-5.27%,3.61%)}
.svc-art img[src$="services-white/auto.png"]{transform:translate(.29%,3.52%)}
.svc-art img[src$="services-white/bot.png"]{transform:translate(5.57%,2.93%)}
#services .svc{align-items:center}
#services .service-copy{padding-top:0}
#services .service-arrow{align-self:start}

/* White artwork becomes dark linework on the light service surfaces. */
#services .svc .svc-art,.detail .svc-art{background:transparent;border-radius:0}
#services .svc .service-icon{display:flex;align-items:center;justify-content:center;background:#ffebee;border-radius:20px;color:#ff304f}
#services .service-icon .ic{width:32px;height:32px;flex-shrink:0;stroke-width:1.8}
@media(max-width:620px){#services .svc .service-icon{border-radius:17px}#services .service-icon .ic{width:29px;height:29px}}
.svc-art img[src*="services-white/"]{filter:invert(1);mix-blend-mode:multiply}
.newsletter-form{display:block;margin:0;border:0;background:none}.newsletter-email-row{width:100%;min-height:44px}.newsletter-email-row:focus-within{border-color:var(--red);box-shadow:0 0 0 2px rgba(255,48,64,.12)}.newsletter-form .newsletter-consent{margin-top:10px;padding:0;border:0;background:none;line-height:1.5}

/* Website discovery quiz entry points. */
.quiz-invite{display:flex;align-items:center;gap:18px;padding:24px;margin-top:24px;border:1px solid #f0d9de;border-radius:18px;background:linear-gradient(110deg,#fff2f5,#fff)}
.quiz-invite-icon{display:grid;place-items:center;width:54px;height:54px;flex:none;border-radius:17px;background:#ffe5eb;color:var(--red)}
.quiz-invite>div{flex:1;min-width:0}.quiz-invite h3{font-size:1.1rem;margin-bottom:5px}.quiz-invite p{font-size:.85rem;color:var(--ink-2)}.quiz-invite>.btn{flex-shrink:0;font-size:.82rem}
.contact-quiz-link{margin-top:20px;color:var(--ink-2);font-size:.9rem}.contact-quiz-link a{display:inline-flex;align-items:center;gap:6px;color:var(--red);text-decoration:underline;text-underline-offset:4px}
@media(max-width:700px){.quiz-invite{flex-wrap:wrap;padding:20px;gap:14px}.quiz-invite>.btn{width:100%}.quiz-invite h3{font-size:1rem}.quiz-invite p{font-size:.8rem}}

/* Service detail cards follow the Home icon treatment. */
.services-catalog{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.service-detail{display:flex;flex-direction:column;min-width:0;scroll-margin-top:110px;padding:30px;background:#fff;border:1px solid var(--line);border-radius:18px;transition:border-color .25s,box-shadow .25s}
.service-detail-heading{display:flex;align-items:center;gap:18px;margin-bottom:20px}.service-detail-heading h2{font-size:clamp(1.15rem,2vw,1.45rem);line-height:1.3;letter-spacing:-.025em}
.service-detail .service-icon{display:flex;align-items:center;justify-content:center;flex:none;width:64px;height:64px;background:#ffebee;border-radius:20px;color:#ff304f}.service-detail .service-icon .ic{width:32px;height:32px;stroke-width:1.8}
.service-detail>.muted{font-size:.92rem;line-height:1.75;max-width:48ch}.service-detail-features{display:grid;gap:10px;margin:24px 0;font-size:.85rem}.service-detail-features li{display:flex;align-items:center;gap:10px}.service-detail-features .ic{color:var(--red)}
.service-detail-link{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:20px;border-top:1px solid var(--line);font-size:.84rem;font-weight:600}.service-detail-link .ic{color:var(--red);transition:translate .25s}
@media(hover:hover){.service-detail:hover{border-color:#efb9c1;box-shadow:0 8px 24px #30141a08}.service-detail-link:hover{color:var(--red)}.service-detail-link:hover .ic{translate:2px -2px}}
@media(max-width:700px){.services-catalog{grid-template-columns:1fr;gap:16px}.service-detail{padding:24px}.service-detail-heading{gap:14px;margin-bottom:16px}.service-detail .service-icon{width:56px;height:56px;border-radius:17px}.service-detail .service-icon .ic{width:29px;height:29px}}
@media(prefers-reduced-motion:reduce){.service-detail,.service-detail-link .ic{transition:none}}