/* 10th Dimension — 2026 refresh. Bold tech palette, logo retained. */
:root{
  --ink:#0B0C10; --ink-2:#13151C; --ink-3:#1C1F29; --line:rgba(255,255,255,.09);
  --gold:#FFC23D; --gold-brand:#D9AF3F; --violet:#7B5CFF; --cyan:#22D3EE;
  --white:#FFFFFF; --mist:#F4F5F9; --slate:#5B6070; --muted-dark:#A3A8B8;
  --grad:linear-gradient(100deg,var(--gold) 0%,var(--violet) 55%,var(--cyan) 100%);
  --radius:1.25rem;
  --bs-body-font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --bs-body-color:#1A1C23; --bs-link-color:#5B3DF5; --bs-link-hover-color:#3B22C9;
}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{font-family:var(--bs-body-font-family);color:#1A1C23;background:var(--white);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,.display-1,.display-2,.display-3,.display-4,.display-5,.display-6,.font-display{font-family:'Space Grotesk','Inter',sans-serif;font-weight:700;letter-spacing:-.02em}
section{padding:6rem 0}
@media (max-width:767px){section{padding:4rem 0}}
.text-grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.text-gold{color:var(--gold)!important} .text-violet{color:var(--violet)!important} .text-cyan{color:var(--cyan)!important}
.eyebrow{display:inline-flex;align-items:center;gap:.6rem;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;color:var(--violet);margin-bottom:1rem}
.eyebrow::before{content:"";width:1.75rem;height:3px;border-radius:3px;background:var(--grad)}
.dark .eyebrow,.eyebrow.on-dark{color:var(--cyan)}
.section-title{font-size:clamp(2rem,3.6vw,3rem);line-height:1.08}
.lead-muted{color:var(--slate);font-size:1.15rem}
.dark{background:var(--ink);color:#E9EBF2}
.dark .lead-muted,.dark .text-soft{color:var(--muted-dark)}
.bg-mist{background:var(--mist)}

/* Buttons */
.btn{font-family:'Space Grotesk',sans-serif;font-weight:600;border-radius:999px;padding:.7rem 1.5rem;letter-spacing:.01em;transition:transform .15s ease,box-shadow .2s ease,background .2s}
.btn-lg{padding:.9rem 1.9rem}
.btn-primary{--bs-btn-bg:var(--gold);--bs-btn-border-color:var(--gold);--bs-btn-color:var(--ink);--bs-btn-hover-bg:#FFD36E;--bs-btn-hover-border-color:#FFD36E;--bs-btn-hover-color:var(--ink);--bs-btn-active-bg:#F0B020;--bs-btn-active-border-color:#F0B020;--bs-btn-active-color:var(--ink);--bs-btn-disabled-bg:var(--gold);--bs-btn-disabled-border-color:var(--gold);--bs-btn-disabled-color:var(--ink);box-shadow:0 10px 30px -10px rgba(255,194,61,.6)}
.btn-primary:hover{transform:translateY(-2px)}
.btn-violet{background:var(--violet);border-color:var(--violet);color:#fff}
.btn-violet:hover{background:#6A48FF;color:#fff;transform:translateY(-2px)}
.btn-ghost{border:1.5px solid rgba(255,255,255,.35);color:#fff;background:rgba(255,255,255,.04)}
.btn-ghost:hover{border-color:#fff;color:#fff;background:rgba(255,255,255,.1)}
.btn-ink{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn-ink:hover{background:var(--ink-3);color:#fff}

/* Nav: crisp white glass so the original logo stays legible */
.navbar{background:rgba(18,18,18,.97);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid rgba(255,255,255,.08);padding:.7rem 0}
.navbar-brand img{height:44px;width:auto}
@media (max-width:575px){.navbar-brand img{height:36px}}
.navbar .nav-link{font-family:'Space Grotesk',sans-serif;font-weight:600;color:rgba(255,255,255,.88);padding:.5rem .95rem!important;position:relative}
.navbar .nav-link:hover,.navbar .nav-link.active{color:#fff}
.navbar .navbar-toggler-icon{filter:invert(1)}
.navbar .navbar-toggler:focus{box-shadow:0 0 0 .2rem rgba(255,255,255,.25)}
.navbar .nav-link.active::after{content:"";position:absolute;left:.95rem;right:.95rem;bottom:.1rem;height:3px;border-radius:3px;background:var(--grad)}
@media (max-width:991px){.navbar .nav-link.active::after{display:none}.navbar-collapse{padding:1rem 0}}

/* Hero */
.hero{position:relative;min-height:min(92vh,880px);display:flex;align-items:center;padding:9rem 0 5rem;background:var(--ink) url(../img/hero-dimensions.jpg) center right/cover no-repeat;color:#fff;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,12,16,.97) 0%,rgba(11,12,16,.85) 38%,rgba(11,12,16,.2) 75%,rgba(11,12,16,.1) 100%),linear-gradient(0deg,rgba(11,12,16,1) 0%,rgba(11,12,16,0) 30%)}
.hero>.container{position:relative}
.hero h1{font-size:clamp(2.6rem,6vw,5rem);line-height:1.02;margin-bottom:1.5rem}
.hero .lead{color:#C9CDDA;font-size:clamp(1.1rem,1.6vw,1.3rem);max-width:38rem}
.pill-row{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.75rem}
.pill{font-family:'Space Grotesk',sans-serif;font-size:.85rem;font-weight:600;padding:.4rem .9rem;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:#E9EBF2}
.pill i{margin-right:.35rem}
.hero-facts{display:flex;flex-wrap:wrap;gap:2.5rem;margin-top:3.5rem;padding-top:2rem;border-top:1px solid var(--line);max-width:40rem}
.hero-facts strong{display:block;font-family:'Space Grotesk',sans-serif;font-size:1.5rem;color:#fff}
.hero-facts span{font-size:.9rem;color:var(--muted-dark)}

/* Page header (pillar pages) */
.page-hero{position:relative;padding:10rem 0 5rem;background:var(--ink);color:#fff;overflow:hidden}
.page-hero .bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.55}
.page-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,12,16,.96) 0%,rgba(11,12,16,.75) 50%,rgba(11,12,16,.3) 100%)}
.page-hero>.container{position:relative;z-index:1}
.page-hero h1{font-size:clamp(2.4rem,5vw,4.2rem);line-height:1.04}
.page-hero .lead{color:#C9CDDA;max-width:40rem}

/* Gradient rule */
.grad-rule{height:4px;background:var(--grad)}

/* Pillar cards */
.pillar-card{height:100%;border-radius:var(--radius);background:var(--ink-2);border:1px solid var(--line);overflow:hidden;color:#E9EBF2;transition:transform .25s ease,border-color .25s,box-shadow .25s;display:flex;flex-direction:column}
.pillar-card:hover{transform:translateY(-6px);border-color:rgba(123,92,255,.55);box-shadow:0 30px 60px -30px rgba(123,92,255,.55)}
.pillar-card .img{aspect-ratio:16/10;background-size:cover;background-position:center;position:relative}
.pillar-card .img::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--ink-2) 0%,rgba(19,21,28,0) 55%)}
.pillar-card .body{padding:1.75rem 1.75rem 2rem;display:flex;flex-direction:column;flex:1}
.pillar-card h3{font-size:1.6rem;color:#fff}
.pillar-card p{color:var(--muted-dark)}
.pillar-card ul{list-style:none;padding:0;margin:0 0 1.5rem}
.pillar-card li{padding:.35rem 0 .35rem 1.6rem;position:relative;color:#D5D8E3}
.pillar-card li::before{content:"";position:absolute;left:0;top:.8rem;width:.6rem;height:.6rem;border-radius:2px;background:var(--gold)}
.pillar-card .num{font-family:'Space Grotesk',sans-serif;font-size:.8rem;letter-spacing:.2em;color:var(--cyan);font-weight:600}
.pillar-card .more{margin-top:auto;font-family:'Space Grotesk',sans-serif;font-weight:600;color:var(--gold);text-decoration:none}
.pillar-card .more i{transition:transform .2s}
.pillar-card:hover .more i{transform:translateX(4px)}

/* Feature tiles */
.tile{height:100%;padding:2rem;border-radius:var(--radius);background:#fff;border:1px solid #E6E8EF;transition:border-color .2s,transform .2s,box-shadow .2s}
.tile:hover{border-color:var(--violet);transform:translateY(-3px);box-shadow:0 20px 40px -25px rgba(91,61,245,.45)}
.tile h3{font-size:1.25rem;margin:1rem 0 .6rem}
.tile p{color:var(--slate);margin-bottom:0}
.dark .tile{background:var(--ink-2);border-color:var(--line)}
.dark .tile p{color:var(--muted-dark)} .dark .tile h3{color:#fff}
.icon-box{width:3.25rem;height:3.25rem;border-radius:.9rem;display:grid;place-items:center;font-size:1.4rem;color:var(--ink);background:var(--gold)}
.icon-box.violet{background:var(--violet);color:#fff}
.icon-box.cyan{background:var(--cyan);color:var(--ink)}
.icon-box.outline{background:transparent;border:1.5px solid var(--line);color:var(--cyan)}

/* Steps */
.steps{counter-reset:step}
.step{position:relative;padding:1.75rem 1.5rem 1.5rem;border-radius:var(--radius);background:var(--ink-2);border:1px solid var(--line);height:100%}
.step::before{counter-increment:step;content:"0" counter(step);font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:2.4rem;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;display:block;margin-bottom:.9rem}
.step h3{font-size:1.2rem;color:#fff}
.step p{color:var(--muted-dark);margin:0}

/* Timeline (project delivery) */
.timeline{position:relative;padding-left:2.5rem}
.timeline::before{content:"";position:absolute;left:.7rem;top:.5rem;bottom:.5rem;width:3px;border-radius:3px;background:linear-gradient(180deg,var(--violet),var(--cyan),var(--gold))}
.timeline .item{position:relative;padding-bottom:2.5rem}
.timeline .item:last-child{padding-bottom:0}
.timeline .item::before{content:"";position:absolute;left:-2.25rem;top:.35rem;width:1.1rem;height:1.1rem;border-radius:4px;background:var(--ink);border:3px solid var(--violet)}
.timeline .item:last-child::before{border-color:var(--gold)}
.timeline h3{font-size:1.4rem}
.timeline p{color:var(--slate)}

/* Spotlight band */
.spotlight{position:relative;overflow:hidden}
.spotlight::before{content:"";position:absolute;width:60rem;height:60rem;right:-25rem;top:-30rem;background:radial-gradient(circle,rgba(123,92,255,.35) 0%,rgba(123,92,255,0) 60%);pointer-events:none}
.spotlight::after{content:"";position:absolute;width:50rem;height:50rem;left:-25rem;bottom:-30rem;background:radial-gradient(circle,rgba(34,211,238,.18) 0%,rgba(34,211,238,0) 60%);pointer-events:none}
.spotlight>.container{position:relative;z-index:1}
.img-frame{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);box-shadow:0 40px 80px -40px rgba(0,0,0,.7)}
.img-frame img{display:block;width:100%;height:auto}

/* About */
.about-card{border-radius:var(--radius);padding:2.5rem;background:var(--ink);color:#E9EBF2;position:relative;overflow:hidden}
.about-card::before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:var(--grad)}
.about-card .big{font-family:'Space Grotesk',sans-serif;font-size:1.6rem;line-height:1.3;color:#fff}
.check-list{list-style:none;padding:0}
.check-list li{padding:.45rem 0 .45rem 2rem;position:relative}
.check-list li::before{content:"\F26E";font-family:'bootstrap-icons';position:absolute;left:0;top:.4rem;color:var(--violet);font-size:1.15rem}
.dark .check-list li::before{color:var(--cyan)}

/* Clients */
.client-logo{max-height:56px;max-width:100%;width:auto;filter:grayscale(1);opacity:.65;transition:filter .2s,opacity .2s}
.client-logo:hover{filter:none;opacity:1}

/* Contact */
.contact{position:relative;overflow:hidden}
.contact::before{content:"";position:absolute;width:55rem;height:55rem;left:-20rem;top:-25rem;background:radial-gradient(circle,rgba(255,194,61,.16) 0%,rgba(255,194,61,0) 60%)}
.contact>.container{position:relative}
.contact-card{border:0;border-radius:var(--radius);box-shadow:0 40px 80px -40px rgba(0,0,0,.8)}
.contact-card .form-control{border-radius:.75rem;padding:.75rem 1rem;border-color:#DDE0E8;background:#FAFBFD}
.contact-card .form-control:focus{border-color:var(--violet);box-shadow:0 0 0 .25rem rgba(123,92,255,.2);background:#fff}
.contact-card .form-label{font-weight:600;font-size:.9rem}
.contact a.link-light{text-decoration-color:rgba(255,255,255,.35)}

/* Footer */
footer{background:#07080B;color:var(--muted-dark)}
footer h5{font-family:'Space Grotesk',sans-serif;color:#fff;font-size:1rem;letter-spacing:.04em}
footer a{color:#D5D8E3;text-decoration:none}
footer a:hover{color:var(--gold)}
footer li{padding:.2rem 0}
.footer-logo{height:52px;width:auto}
.footer-brand{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:1.35rem;color:#fff}

/* Cookie bar */
.cookie-bar{position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:1080;background:var(--ink-3);color:#E9EBF2;border:1px solid var(--line);border-radius:1rem;box-shadow:0 20px 50px -20px rgba(0,0,0,.6);max-width:44rem;margin:0 auto}

/* Simple centre pages (404, thanks) */
.center-page{min-height:100vh;display:flex;align-items:center;padding:8rem 0 4rem}
.big-code{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:clamp(5rem,16vw,10rem);line-height:1}

/* Reveal on scroll */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}