/* SRBD — shared styles for service pages */
@font-face{
  font-family:'Space Grotesk';font-style:normal;font-weight:100 900;font-display:swap;
  src:url('space-grotesk.woff2') format('woff2');
}
:root{
  --bg:#0A0908;--bg-2:#100E0C;--panel:rgba(255,255,255,0.02);
  --ink:#F6F1E9;--muted:#9C9284;--muted-2:#6E665B;
  --sand:#E4A85D;--sand-hi:#F4CE93;--sand-lo:#C1712B;
  --line:rgba(228,168,93,0.16);--line-soft:rgba(255,255,255,0.07);
  --grad-sand:linear-gradient(135deg,var(--sand-hi),var(--sand) 45%,var(--sand-lo));
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:'Space Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--sand);color:#100E0C}
a{color:inherit;text-decoration:none}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(60% 55% at 80% -10%,rgba(228,168,93,0.16),transparent 60%),radial-gradient(45% 45% at 8% 6%,rgba(193,113,43,0.10),transparent 60%);
  animation:bgpulse 9s ease-in-out infinite}
.wrap{position:relative;z-index:1}
.container{width:min(1000px,92vw);margin:0 auto}

/* ---- FLASH ANIMATIONS ---- */
@keyframes shimmer{to{background-position:200% center}}
@keyframes shine{to{left:130%}}
@keyframes glowpulse{0%,100%{opacity:.55;transform:scale(1)}50%{opacity:1;transform:scale(1.06)}}
@keyframes bgpulse{0%,100%{opacity:.85}50%{opacity:1}}
@keyframes popin{0%{opacity:0;transform:translateY(30px) scale(.96);filter:blur(6px)}100%{opacity:1;transform:none;filter:blur(0)}}
@keyframes floatUp{0%{opacity:0;transform:translateY(40px)}100%{opacity:1;transform:none}}

.shine-text{
  background:linear-gradient(110deg,#FBF6EE 15%,#F4CE93 38%,#E4A85D 50%,#FBF6EE 62%,#C9BCA9 120%);
  background-size:220% auto;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:shimmer 4.5s linear infinite;
}
.pulse-dot{animation:glowpulse 2.4s ease-in-out infinite}

/* ---- HEADER ---- */
header{position:fixed;top:0;left:0;right:0;z-index:50;padding:18px 0;transition:padding .35s,background .35s,border-color .35s;border-bottom:1px solid transparent}
header.scrolled{padding:12px 0;background:rgba(10,9,8,0.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line-soft)}
.nav{width:min(1180px,92vw);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{font-weight:700;font-size:22px;letter-spacing:.14em}
.brand span{color:var(--sand)}
.nav-links{display:flex;gap:30px;font-size:14px;color:var(--muted)}
.nav-links a{transition:color .2s}.nav-links a:hover{color:var(--ink)}
@media(max-width:820px){.nav-links{display:none}}
.btn{display:inline-flex;align-items:center;gap:10px;font-family:inherit;cursor:pointer;font-size:14px;font-weight:500;letter-spacing:.02em;padding:12px 22px;border-radius:100px;border:1px solid transparent;transition:transform .2s,box-shadow .3s,background .3s,color .2s;position:relative;overflow:hidden}
.btn-primary{background:var(--grad-sand);color:#1a1206;box-shadow:0 8px 30px rgba(228,168,93,0.22)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 44px rgba(228,168,93,0.4)}
.btn-primary::after{content:"";position:absolute;top:0;left:-120%;width:55%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg)}
.btn-primary:hover::after{animation:shine .8s ease}
.btn-primary .arrow{transition:transform .25s}.btn-primary:hover .arrow{transform:translateX(4px)}
.btn-ghost{border:1px solid var(--line-soft);color:var(--ink)}
.btn-ghost:hover{border-color:var(--sand);color:var(--sand)}

/* ---- REVEAL ---- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}.reveal.d4{transition-delay:.32s}.reveal.d5{transition-delay:.4s}
.pop.in{animation:popin .9s cubic-bezier(.2,.7,.2,1) both}

/* ---- SERVICE HERO ---- */
.svc-hero{padding:170px 0 70px;position:relative}
.backlink{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:var(--muted);margin-bottom:30px;transition:color .2s,gap .2s}
.backlink:hover{color:var(--sand);gap:12px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:12.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--sand);margin-bottom:26px}
.eyebrow::before{content:"";width:34px;height:1px;background:var(--grad-sand)}
.svc-hero h1{font-size:clamp(40px,7vw,86px);font-weight:700;line-height:1.02;letter-spacing:-.02em;max-width:16ch;margin-bottom:26px;animation:floatUp 1s cubic-bezier(.2,.7,.2,1) both}
.svc-lead{color:var(--muted);font-size:clamp(16px,1.8vw,20px);max-width:56ch;margin-bottom:38px}
.svc-hero .btn-primary{padding:15px 28px;font-size:15px}

/* ---- SECTIONS ---- */
section.blk{padding:80px 0;position:relative}
.tag{font-size:12.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--sand);margin-bottom:18px;display:flex;align-items:center;gap:10px}
.tag::before{content:"";width:26px;height:1px;background:var(--grad-sand)}
.sec-title{font-size:clamp(26px,3.6vw,40px);font-weight:600;line-height:1.1;letter-spacing:-.01em;max-width:22ch}
.sec-desc{color:var(--muted);margin-top:18px;font-size:17px;max-width:54ch}

.inc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:44px}
@media(max-width:760px){.inc-grid{grid-template-columns:1fr}}
.inc{padding:26px 26px 30px;border-radius:18px;background:var(--panel);border:1px solid var(--line-soft);transition:transform .4s cubic-bezier(.2,.7,.2,1),border-color .4s,background .4s}
.inc:hover{transform:translateY(-6px);background:rgba(255,255,255,0.035);border-color:var(--line)}
.inc .dot{width:9px;height:9px;border-radius:50%;background:var(--grad-sand);margin-bottom:18px;box-shadow:0 0 16px rgba(228,168,93,.6)}
.inc h3{font-size:19px;font-weight:600;margin-bottom:9px;letter-spacing:-.01em}
.inc p{color:var(--muted);font-size:14.5px}

.lead-block{max-width:60ch}
.lead-block p{color:#D9CFBF;font-size:17px;margin-bottom:16px}
.lead-block p strong{color:var(--ink)}

/* ---- OTHER SERVICES ---- */
.more-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:40px}
@media(max-width:760px){.more-grid{grid-template-columns:1fr}}
.more-card{padding:22px;border-radius:14px;border:1px solid var(--line-soft);background:var(--panel);display:flex;justify-content:space-between;align-items:center;gap:14px;transition:border-color .3s,background .3s,transform .3s}
.more-card:hover{border-color:var(--sand);background:rgba(255,255,255,0.04);transform:translateY(-3px)}
.more-card span{font-size:15px;font-weight:500}
.more-card .ar{color:var(--sand)}

/* ---- CTA BAND ---- */
.cta-band{padding:110px 0;text-align:center;position:relative;overflow:hidden}
.cta-band::before{content:"";position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);width:760px;height:480px;max-width:120vw;background:radial-gradient(closest-side,rgba(228,168,93,0.2),transparent 70%);animation:bgpulse 6s ease-in-out infinite;pointer-events:none}
.cta-band h2{font-size:clamp(32px,5.5vw,64px);font-weight:600;line-height:1.03;letter-spacing:-.02em;position:relative}
.cta-band p{color:var(--muted);margin:20px auto 36px;max-width:46ch;font-size:17px;position:relative}
.cta-band .btn-primary{padding:16px 30px;font-size:15px}
.cta-band .mail{margin-top:28px;font-size:14px;color:var(--muted-2);position:relative}
.cta-band .mail a{color:var(--sand);border-bottom:1px solid var(--line)}

/* ---- FOOTER ---- */
footer{border-top:1px solid var(--line-soft);padding:50px 0 44px}
.foot{width:min(1180px,92vw);margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:24px;align-items:flex-end}
.foot .fb{font-size:32px;font-weight:700;letter-spacing:.14em}
.foot .fb span{color:var(--sand)}
.foot-tag{color:var(--muted);font-size:14px;max-width:24ch;margin-top:8px}
.fmeta{color:var(--muted-2);font-size:13.5px;line-height:1.9}
.fmeta a{color:var(--muted)}.fmeta a:hover{color:var(--sand)}

/* ============ PAGE-SPECIFIC DEMOS ============ */

/* --- CRM builder (platforms page) --- */
.crm-demo{margin-top:44px;perspective:1400px}
.crm-win{max-width:840px;margin:0 auto;border-radius:16px;overflow:hidden;border:1px solid var(--line-soft);background:#0e0c0a;box-shadow:0 44px 100px rgba(0,0,0,.55);transform:translateY(34px) rotateX(7deg);opacity:0;transition:opacity .8s,transform 1s cubic-bezier(.2,.7,.2,1)}
.reveal.in .crm-win{opacity:1;transform:none}
.crm-bar{display:flex;align-items:center;gap:8px;padding:12px 16px;background:#141210;border-bottom:1px solid var(--line-soft)}
.crm-bar .d{width:11px;height:11px;border-radius:50%;background:#2c2a27}
.crm-bar .d:first-child{background:var(--sand)}
.crm-url{margin-left:14px;font-size:12px;color:var(--muted-2);background:#0e0c0a;padding:5px 12px;border-radius:6px;border:1px solid var(--line-soft)}
.crm-body{display:flex;min-height:300px}
.crm-side{width:150px;padding:18px 14px;border-right:1px solid var(--line-soft);background:#100e0c;flex-shrink:0;opacity:0;transform:translateX(-16px);transition:opacity .6s .25s,transform .6s .25s}
.reveal.in .crm-side{opacity:1;transform:none}
.crm-logo{font-size:13px;font-weight:700;letter-spacing:.1em;color:var(--sand);margin-bottom:22px}
.crm-nav span{display:block;height:9px;border-radius:5px;background:rgba(255,255,255,.06);margin-bottom:12px}
.crm-nav span:first-child{width:82%;background:rgba(228,168,93,.28)}
.crm-nav span:nth-child(2){width:60%}.crm-nav span:nth-child(3){width:72%}.crm-nav span:nth-child(4){width:48%}
.crm-main{flex:1;padding:18px}
.crm-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media(max-width:620px){.crm-cols{grid-template-columns:1fr 1fr}.crm-col:last-child{display:none}}
.crm-col{background:rgba(255,255,255,.02);border:1px solid var(--line-soft);border-radius:10px;padding:12px;min-height:60px}
.crm-coltitle{font-size:10.5px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:12px;display:flex;justify-content:space-between}
.crm-coltitle b{color:var(--sand);font-weight:600}
.crm-card{background:#16130f;border:1px solid var(--line-soft);border-radius:8px;padding:11px;margin-bottom:8px;opacity:0;transform:translateY(-16px) scale(.95);transition:opacity .5s,transform .55s cubic-bezier(.2,.7,.2,1);transition-delay:calc(.5s + var(--i,0)*.13s)}
.reveal.in .crm-card{opacity:1;transform:none}
.crm-card .l1{height:8px;width:72%;background:rgba(255,255,255,.16);border-radius:4px;margin-bottom:7px}
.crm-card .l2{height:7px;width:46%;background:rgba(255,255,255,.07);border-radius:4px}
.crm-card .t{display:inline-block;margin-top:9px;font-size:9px;padding:2px 8px;border-radius:20px;background:rgba(228,168,93,.15);color:var(--sand)}
.crm-chart{display:flex;align-items:flex-end;gap:8px;height:56px;margin-top:16px}
.crm-chart span{flex:1;background:var(--grad-sand);border-radius:4px 4px 0 0;height:0;transition:height .9s cubic-bezier(.2,.7,.2,1);transition-delay:calc(1.1s + var(--i,0)*.1s)}
.reveal.in .crm-chart span{height:var(--h)}

/* --- Audit: files into folder (market-entry page) --- */
.audit-demo{margin-top:52px;display:flex;justify-content:center}
.folder{position:relative;width:300px;height:250px}
.folder-tab{position:absolute;top:34px;left:26px;width:120px;height:26px;background:#1a1510;border:1px solid var(--line);border-bottom:none;border-radius:9px 9px 0 0;font-size:11px;color:var(--sand);display:flex;align-items:center;justify-content:center;letter-spacing:.08em;z-index:2}
.folder-front{position:absolute;bottom:0;left:0;right:0;height:130px;background:linear-gradient(180deg,#211a12,#150f09);border:1px solid var(--line);border-radius:8px 16px 16px 16px;z-index:5;box-shadow:0 34px 70px rgba(0,0,0,.55)}
.folder-front::before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:var(--grad-sand);opacity:.55;border-radius:8px 16px 0 0}
.file{position:absolute;left:50%;bottom:52px;width:150px;height:130px;background:#efe9df;border-radius:6px;z-index:3;opacity:0;transform:translateX(-50%) translateY(-180px) rotate(0deg);transition:opacity .5s,transform .8s cubic-bezier(.2,.85,.25,1);transition-delay:calc(var(--i,0)*.2s);box-shadow:0 8px 24px rgba(0,0,0,.4);padding:14px 14px 0}
.reveal.in .file{opacity:1;transform:translateX(-50%) translateY(0) rotate(var(--r,0deg))}
.file i{display:block;height:6px;border-radius:3px;background:#c9beac;margin-bottom:7px}
.file i.h{height:9px;width:60%;background:var(--sand)}
.file i:nth-child(3){width:88%}.file i:nth-child(4){width:70%}.file i:nth-child(5){width:80%}

/* --- Tech & AI: code + network sphere --- */
.tech-demo{margin-top:44px;display:grid;grid-template-columns:1.15fr .85fr;gap:22px;align-items:stretch}
@media(max-width:820px){.tech-demo{grid-template-columns:1fr}}
.code-win{border-radius:14px;overflow:hidden;border:1px solid var(--line-soft);background:#0d0b09;box-shadow:0 30px 70px rgba(0,0,0,.5)}
.code-bar{display:flex;gap:8px;padding:12px 16px;background:#141210;border-bottom:1px solid var(--line-soft)}
.code-bar .d{width:11px;height:11px;border-radius:50%;background:#2c2a27}.code-bar .d:first-child{background:var(--sand)}
.code-body{padding:20px 22px;font-family:ui-monospace,'SF Mono',Menlo,Consolas,monospace;font-size:13px;line-height:1.85}
.code-line{opacity:0;transform:translateY(6px);transition:opacity .4s,transform .4s;transition-delay:calc(var(--i,0)*.16s)}
.reveal.in .code-line{opacity:1;transform:none}
.code-line:last-child::after{content:"";display:inline-block;width:8px;height:15px;background:var(--sand);margin-left:3px;vertical-align:-2px;animation:caret 1s steps(1) infinite}
@keyframes caret{50%{opacity:0}}
.tok-k{color:var(--sand)}.tok-f{color:var(--sand-hi)}.tok-s{color:#cdbb98}.tok-c{color:var(--muted-2)}.tok-t{color:#D9CFBF}
.ai-vis{border-radius:14px;border:1px solid var(--line-soft);background:radial-gradient(120% 120% at 70% 20%,rgba(228,168,93,.08),transparent 60%),#0d0b09;display:flex;align-items:center;justify-content:center;padding:16px;overflow:hidden}
.ai-sphere{width:100%;max-width:280px;height:auto}
.ai-sphere .edge{stroke:rgba(228,168,93,.55);stroke-width:1.2;fill:none;stroke-dasharray:260;stroke-dashoffset:260;transition:stroke-dashoffset 1.2s ease;transition-delay:calc(.3s + var(--i,0)*.12s)}
.reveal.in .ai-sphere .edge{stroke-dashoffset:0}
.ai-sphere .node{fill:var(--sand-hi)}
.ai-sphere .ring{stroke:rgba(228,168,93,.18);fill:none}

/* ============ SCROLL-SCRUBBED + PAGE FX (v2) ============ */
/* CRM: window static, cards & chart driven by scroll --p */
.crm-win{opacity:1;transform:none}
.crm-side{opacity:1;transform:none}
.crm-card{--ip:clamp(0,calc((var(--p,0) - var(--i,0)*0.09)/0.4),1);transition:none;opacity:var(--ip);transform:translateY(calc((var(--ip) - 1) * -26px)) scale(calc(.94 + var(--ip)*.06))}
.crm-chart span{--ip:clamp(0,calc((var(--p,0) - 0.4 - var(--i,0)*0.06)/0.35),1);transition:none;height:calc(var(--ip) * var(--h))}

/* Audit files fall in / out with scroll */
.file{--ip:clamp(0,calc((var(--p,0) - var(--i,0)*0.16)/0.4),1);transition:none;opacity:var(--ip);transform:translateX(-50%) translateY(calc((var(--ip) - 1) * 180px)) rotate(var(--r,0deg))}

/* Structuring: lego/tetris continents */
.lego-stage{position:relative;width:420px;max-width:92vw;height:360px;margin:46px auto 6px}
.lego{position:absolute;width:26px;height:26px;border-radius:5px;background:var(--grad-sand);--ip:clamp(0,calc((var(--p,0) - var(--i,0)*0.014)/0.4),1);opacity:var(--ip);transform:translateY(calc((var(--ip) - 1) * -340px));box-shadow:0 5px 16px rgba(228,168,93,.22),inset 0 -3px 0 rgba(0,0,0,.2)}
.lego::after{content:"";position:absolute;top:5px;left:7px;width:12px;height:5px;border-radius:3px;background:rgba(255,255,255,.2)}

/* Strategy: rotating continents globe (background) */
.svc-hero{overflow:hidden}
.svc-hero .container{position:relative;z-index:2}
.globe-bg{position:absolute;top:50%;right:-4%;transform:translateY(-50%);width:min(560px,88vw);z-index:0;opacity:.4;pointer-events:none}
.globe-bg svg{width:100%;height:auto}
.gb-map{animation:gbspin 26s linear infinite}
@keyframes gbspin{to{transform:translateX(-360px)}}

/* Tech: long auto-scrolling terminal + chip */
.code-body{height:300px;overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent)}
.code-scroll{animation:codescroll 24s linear infinite}
@keyframes codescroll{to{transform:translateY(-50%)}}
.code-line{opacity:1;transform:none;transition:none}
.chip-svg{width:100%;max-width:290px;height:auto;display:block;margin:auto}
.chip-trace{stroke:rgba(228,168,93,.55);stroke-width:1.5;fill:none;stroke-dasharray:6 8;animation:traceflow 2.6s linear infinite}
@keyframes traceflow{to{stroke-dashoffset:-28}}
.chip-core{animation:corepulse 2.2s ease-in-out infinite;transform-origin:center}
@keyframes corepulse{0%,100%{opacity:.65}50%{opacity:1}}

/* Representation: translate on arrival */
[data-translate]{transition:opacity .45s,filter .45s}
.translating{opacity:.1;filter:blur(7px)}
.tr-badge{position:fixed;top:78px;left:50%;transform:translateX(-50%) translateY(-8px);background:rgba(228,168,93,.12);border:1px solid var(--line);color:var(--sand);font-size:12.5px;letter-spacing:.05em;padding:8px 16px;border-radius:100px;opacity:0;transition:opacity .4s,transform .4s;z-index:60;pointer-events:none}
.tr-badge.show{opacity:1;transform:translateX(-50%) translateY(0)}
.tr-badge b{width:7px;height:7px;border-radius:50%;background:var(--sand);display:inline-block;margin-right:8px;vertical-align:1px;animation:corepulse 1.1s ease-in-out infinite}