/*
Theme Name: DigiDwar 24x7
Theme URI: https://digidwar24x7.com/
Author: DigiDwar 24x7
Author URI: https://digidwar24x7.com/
Description: Custom DigiDwar 24x7 digital marketing agency WordPress theme with responsive animated homepage and dedicated About, Service and Contact pages.
Version: 4.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: digidwar-24x7
*/


  :root{
    --ink:#120A1C;
    --ink-2:#1B1128;
    --paper:#F5F3F2;
    --muted:#ACA6BA;
    --line: rgba(245,243,242,0.12);
    --cyan:#33D6E8;
    --violet:#6C5CE7;
    --magenta:#E85FD1;
    --grad: linear-gradient(100deg, var(--cyan) 0%, var(--violet) 52%, var(--magenta) 100%);
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{ background:#150C22; }
  body{
    background:
      radial-gradient(ellipse 1100px 800px at 10% 0%, rgba(51,214,232,0.22), transparent 55%),
      radial-gradient(ellipse 1200px 900px at 90% 20%, rgba(232,95,209,0.18), transparent 55%),
      radial-gradient(ellipse 1400px 1200px at 50% 60%, rgba(108,92,231,0.22), transparent 60%),
      radial-gradient(ellipse 1100px 900px at 12% 92%, rgba(51,214,232,0.15), transparent 55%),
      radial-gradient(ellipse 1200px 1000px at 92% 98%, rgba(232,95,209,0.15), transparent 55%),
      linear-gradient(170deg, #170D24 0%, #120A1C 50%, #1B0F22 100%);
    background-attachment:fixed;
    color:var(--paper);
    font-family:'Inter', sans-serif;
    overflow-x:hidden;
    cursor:none;
    position:relative;
  }
  body::before{
    content:'';
    position:fixed; inset:0; z-index:500; pointer-events:none;
    opacity:0.045; mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }
  @media (hover:none), (pointer:coarse){ body{ cursor:auto; } }
  ::selection{ background:var(--violet); color:var(--paper); }
  a{ color:inherit; }
  img{ max-width:100%; display:block; }

  /* ---------- custom cursor ---------- */
  .cursor-dot, .cursor-ring{
    position:fixed; top:0; left:0; z-index:999;
    pointer-events:none;
    transform:translate(-50%,-50%);
    border-radius:50%;
  }
  .cursor-dot{
    width:6px; height:6px; background:var(--paper);
  }
  .cursor-ring{
    width:34px; height:34px;
    border:1px solid rgba(243,241,238,0.35);
    transition:width .25s ease, height .25s ease, border-color .25s ease, background .25s ease;
  }
  .cursor-ring.hover{
    width:64px; height:64px;
    border-color:transparent;
    background:var(--grad);
    opacity:0.18;
  }
  @media (hover:none), (pointer:coarse){ .cursor-dot,.cursor-ring{ display:none; } }

  /* ---------- NAV ---------- */
  nav{
    position:fixed; top:0; left:0; right:0; z-index:50;
    display:flex; align-items:center; justify-content:space-between;
    padding:20px 5vw;
    backdrop-filter:blur(14px);
    background:linear-gradient(to bottom, rgba(6,5,10,0.55), rgba(6,5,10,0));
  }
  .brand{ display:flex; align-items:center; gap:12px; }
  .brand img{ width:38px; height:38px; }
  .brand-name{
    font-family:'Fraunces', serif; font-weight:600; font-size:1.15rem;
    letter-spacing:-0.01em;
  }
  .nav-right{ display:flex; align-items:center; gap:34px; }
  .nav-links{ display:flex; gap:24px; font-size:0.83rem; }
  .nav-links a{ text-decoration:none; opacity:0.72; transition:opacity .2s; position:relative; }
  .nav-links a::after{
    content:''; position:absolute; left:0; right:0; bottom:-4px; height:1px;
    background:var(--grad); transform:scaleX(0); transform-origin:left;
    transition:transform .3s ease;
  }
  .nav-links a:hover{ opacity:1; }
  .nav-links a:hover::after{ transform:scaleX(1); }
  .nav-social{ display:flex; gap:16px; }
  .nav-social a{ opacity:0.75; transition:opacity .2s; }
  .nav-social a:hover{ opacity:1; }
  .nav-social svg{ width:17px; height:17px; }
  @media (max-width:760px){ .nav-links{ display:none; } }

  /* ---------- SCROLLYTELL HERO ---------- */
  .scrollytell{ position:relative; height:100vh; }
  .stage{
    position:relative; height:100vh; width:100%;
    overflow:hidden; display:flex; align-items:center; justify-content:center;
  }
  .orb{
    position:absolute; border-radius:50%; filter:blur(90px);
    pointer-events:none; z-index:0;
    animation:drift 16s ease-in-out infinite;
  }
  .orb-1{ width:420px; height:420px; background:rgba(51,214,232,0.16); top:8%; left:8%; }
  .orb-2{ width:480px; height:480px; background:rgba(232,95,209,0.14); bottom:2%; right:6%; animation-delay:-6s; animation-duration:19s; }
  .orb-3{ width:360px; height:360px; background:rgba(108,92,231,0.15); top:38%; right:28%; animation-delay:-11s; animation-duration:14s; }
  @keyframes drift{
    0%, 100%{ transform:translate(0,0) scale(1); }
    50%{ transform:translate(30px,-24px) scale(1.08); }
  }
  .bg-word{
    position:absolute; left:50%; top:38%; transform:translate(-50%,-50%);
    font-family:'Fraunces', serif; font-weight:600;
    font-size:min(15vw, 210px);
    letter-spacing:-0.02em;
    color:transparent;
    -webkit-text-stroke:1px rgba(245,243,242,0.08);
    white-space:nowrap; pointer-events:none; user-select:none; z-index:0;
    -webkit-mask-image:linear-gradient(to bottom, black 0%, black 45%, transparent 80%);
    mask-image:linear-gradient(to bottom, black 0%, black 45%, transparent 80%);
  }
  @media (max-width:760px){
    .bg-word{ font-size:min(26vw, 140px); top:30%; -webkit-text-stroke:1px rgba(245,243,242,0.06); }
  }
  .bg-word .fill{
    position:absolute; left:0; top:0;
    background:var(--grad); -webkit-background-clip:text; background-clip:text;
    -webkit-text-stroke:0; color:transparent; display:inline-block;
    clip-path:inset(0 100% 0 0);
  }
  .act{
    position:absolute; inset:0; display:flex; flex-direction:column;
    align-items:center; justify-content:center; padding:0 6vw;
    z-index:1; opacity:0;
  }
  .act-1{ opacity:1; }

  .rail{ position:absolute; right:5vw; top:50%; transform:translateY(-50%); display:flex; flex-direction:column; gap:14px; z-index:5; }
  .rail-dot{ width:6px; height:6px; border-radius:50%; background:rgba(245,243,242,0.25); transition:background .3s, transform .3s; }
  .rail-dot.active{ background:var(--paper); transform:scale(1.6); }
  @media (max-width:760px){ .rail{ display:none; } }

  .act-index{ position:absolute; top:100px; left:6vw; font-family:'IBM Plex Mono', monospace; font-size:0.72rem; color:var(--muted); letter-spacing:0.06em; z-index:5; }
  .act-index b{ color:var(--paper); }

  .eyebrow{ font-family:'IBM Plex Mono', monospace; font-size:0.72rem; letter-spacing:0.14em; color:var(--cyan); text-transform:uppercase; margin-bottom:22px; }
  .act-1 h1{ font-family:'Fraunces', serif; font-weight:500; font-size:clamp(2.6rem, 6.4vw, 4.6rem); line-height:1.05; text-align:center; letter-spacing:-0.015em; max-width:16ch; }
  .act-1 h1 em{ font-style:italic; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .act-1 p{ margin-top:26px; max-width:52ch; text-align:center; color:var(--muted); font-size:1.08rem; line-height:1.6; }
  .act-1 .hero-ctas{ margin-top:42px; display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
  .scroll-cue{ margin-top:48px; font-family:'IBM Plex Mono', monospace; font-size:0.7rem; letter-spacing:0.1em; color:var(--muted); display:flex; align-items:center; gap:10px; }
  .scroll-cue .bar{ width:1px; height:30px; background:rgba(245,243,242,0.2); position:relative; overflow:hidden; }
  .scroll-cue .bar i{ content:''; position:absolute; left:0; top:-100%; width:100%; height:100%; background:var(--grad); animation:runline 1.8s ease-in-out infinite; display:block; }
  @keyframes runline{ 0%{top:-100%;} 100%{top:100%;} }

  .act-title{ font-family:'Fraunces', serif; font-weight:500; font-size:clamp(1.6rem,3.2vw,2.3rem); margin-bottom:38px; letter-spacing:-0.01em; text-align:center; }
  .act-sub{ color:var(--muted); font-size:0.92rem; margin-top:-24px; margin-bottom:44px; text-align:center; }
  .services-list{ display:flex; flex-direction:column; width:min(680px, 86vw); }
  .service-row{ display:flex; align-items:baseline; gap:22px; padding:17px 4px; border-top:1px solid var(--line); opacity:1; transform:none; }
  .service-row:last-child{ border-bottom:1px solid var(--line); }
  .service-row .num{ font-family:'IBM Plex Mono', monospace; font-size:0.72rem; color:var(--cyan); width:24px; flex-shrink:0; }
  .service-row .name{ font-family:'Fraunces', serif; font-weight:500; font-size:clamp(1.05rem,2.2vw,1.4rem); flex:1; }
  .service-row .tag{ font-family:'IBM Plex Mono', monospace; font-size:0.68rem; color:var(--muted); text-align:right; flex-shrink:0; }
  @media (max-width:760px){ .service-row .tag{ display:none; } }
  .act-3 .client-grid{ width:min(720px, 88vw); max-width:min(720px, 88vw); }

  .stat-bar{
    position:relative; z-index:2; max-width:1080px; margin:90px auto 0;
    display:grid; grid-template-columns:repeat(4, 1fr); gap:1px;
    background:var(--line); border:1px solid var(--line); border-bottom:none;
  }
  .stat{ background:rgba(8,6,14,0.42); backdrop-filter:blur(16px); padding:34px 20px; text-align:center; }
  .stat-num{ display:block; font-family:'Fraunces', serif; font-weight:600; font-size:2rem; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .stat-label{ display:block; margin-top:8px; font-family:'IBM Plex Mono', monospace; font-size:0.7rem; letter-spacing:0.05em; color:var(--muted); text-transform:uppercase; }
  @media (max-width:760px){ .stat-bar{ grid-template-columns:1fr 1fr; } }
  .client-card{
    flex:1 1 260px; border:1px solid var(--line); padding:32px 26px; opacity:1; transform: none;
    transition:border-color .3s, box-shadow .3s, background .3s;
    background:rgba(8,6,14,0.42); backdrop-filter:blur(16px);
  }
  .client-card:hover{ border-color:rgba(243,241,238,0.22); box-shadow:0 20px 60px -20px rgba(108,92,231,0.4); background:rgba(8,6,14,0.6); }
  .client-badge{
    width:38px; height:38px; border-radius:50%; margin-bottom:18px;
    display:flex; align-items:center; justify-content:center;
    font-family:'Fraunces', serif; font-weight:600; font-size:1rem; color:var(--ink);
    background:var(--grad);
  }
  .client-card .cname{ font-family:'Fraunces', serif; font-weight:600; font-size:1.15rem; margin-bottom:10px; letter-spacing:-0.01em; }
  .client-card .cdesc{ color:var(--muted); font-size:0.88rem; line-height:1.55; }

  .section-sub{ color:var(--muted); font-size:0.95rem; text-align:center; max-width:52ch; margin:-30px auto 50px; }

  /* ---------- CATEGORIZED SERVICES ---------- */
  .service-categories{ display:grid; grid-template-columns:repeat(2, 1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
  .service-cat{ background:rgba(8,6,14,0.42); backdrop-filter:blur(16px); padding:40px 36px; opacity:1; transform:none; }
  .service-cat .cat-head{ display:flex; align-items:center; gap:14px; margin-bottom:22px; }
  .service-cat .cat-icon{
    width:40px; height:40px; border-radius:50%; flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
    background:var(--grad); color:var(--ink); font-family:'Fraunces', serif; font-weight:600; font-size:1.1rem;
  }
  .service-cat h3{ font-family:'Fraunces', serif; font-weight:500; font-size:1.3rem; letter-spacing:-0.01em; }
  .service-cat ul{ list-style:none; display:flex; flex-direction:column; gap:11px; }
  .service-cat li{ color:var(--muted); font-size:0.9rem; padding-left:18px; position:relative; }
  .service-cat li::before{ content:''; position:absolute; left:0; top:8px; width:6px; height:1px; background:var(--cyan); }
  @media (max-width:860px){ .service-categories{ grid-template-columns:1fr; } }

  /* ---------- WORK / RESULTS ---------- */
  .client-grid{ display:flex; gap:20px; max-width:1080px; margin:0 auto; flex-wrap:wrap; justify-content:center; }
  .work-card{
    flex:1 1 320px; border:1px solid var(--line); padding:34px 30px; opacity:1; transform:none;
    transition:border-color .3s, box-shadow .3s, background .3s;
    background:rgba(8,6,14,0.42); backdrop-filter:blur(16px);
  }
  .work-card:hover{ border-color:rgba(243,241,238,0.22); box-shadow:0 20px 60px -20px rgba(108,92,231,0.4); background:rgba(8,6,14,0.6); }
  .work-card .client-badge{ margin-bottom:18px; }
  .work-card .wname{ font-family:'Fraunces', serif; font-weight:600; font-size:1.2rem; margin-bottom:6px; letter-spacing:-0.01em; }
  .work-card .windustry{ font-family:'IBM Plex Mono', monospace; font-size:0.7rem; color:var(--cyan); text-transform:uppercase; letter-spacing:0.05em; margin-bottom:18px; display:block; }
  .work-meta{ display:flex; flex-direction:column; gap:12px; margin-bottom:18px; }
  .work-meta div{ font-size:0.85rem; color:var(--muted); }
  .work-meta b{ color:var(--paper); font-weight:500; }
  .work-card .wdesc{ color:var(--muted); font-size:0.88rem; line-height:1.6; }

  /* ---------- MARQUEE ---------- */
  .marquee{
    position:relative; z-index:2; overflow:hidden;
    border-top:1px solid var(--line); border-bottom:1px solid var(--line);
    padding:22px 0; background:transparent;
    white-space:nowrap;
  }
  .marquee-track{
    display:inline-flex; gap:0;
    animation:marquee 26s linear infinite;
  }
  .marquee-track span{
    font-family:'IBM Plex Mono', monospace; font-size:0.82rem; letter-spacing:0.08em;
    text-transform:uppercase; color:var(--muted); padding:0 28px;
    display:inline-flex; align-items:center; gap:28px;
  }
  .marquee-track span i{ font-style:normal; width:5px; height:5px; border-radius:50%; background:var(--grad); display:inline-block; }
  @keyframes marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

  /* ---------- SECTIONS BELOW ---------- */
  section.panel{ position:relative; z-index:2; background:transparent; }
  .about{ padding:150px 6vw 130px; position:relative; }
  .about::before{
    content:''; position:absolute; top:0; left:6vw; right:6vw; height:1px;
    background:linear-gradient(90deg, transparent, rgba(51,214,232,0.4), rgba(232,95,209,0.4), transparent);
  }
  .about-grid{ max-width:1080px; margin:0 auto; display:grid; grid-template-columns:1.1fr 1fr; gap:80px; align-items:start; }
  .about-label{ font-family:'IBM Plex Mono', monospace; font-size:0.72rem; letter-spacing:0.12em; color:var(--cyan); text-transform:uppercase; margin-bottom:22px; }
  .about h2{ font-family:'Fraunces', serif; font-weight:500; font-size:clamp(1.8rem,3.4vw,2.6rem); line-height:1.2; letter-spacing:-0.01em; }
  .about-col p{ color:var(--muted); font-size:1rem; line-height:1.7; margin-bottom:20px; }
  @media (max-width:860px){ .about-grid{ grid-template-columns:1fr; gap:36px; } }

  .services-panel{ padding:0 6vw 150px; }
  .services-panel-inner{ max-width:1080px; margin:0 auto; }
  .panel-head{ display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:56px; flex-wrap:wrap; gap:20px; }
  .panel-head h2{ font-family:'Fraunces', serif; font-weight:500; font-size:clamp(1.8rem,3.4vw,2.6rem); letter-spacing:-0.01em; }
  .panel-head p{ color:var(--muted); max-width:34ch; font-size:0.95rem; line-height:1.6; }
  .cards-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
  .service-card{
    background:rgba(8,6,14,0.42); backdrop-filter:blur(16px);
    padding:40px 30px; opacity:1; transform: none;
    position:relative; overflow:hidden;
    transition:background .35s ease;
  }
  .service-card::before{
    content:''; position:absolute; top:0; left:0; right:0; height:2px;
    background:var(--grad); transform:scaleX(0); transform-origin:left;
    transition:transform .4s ease;
  }
  .service-card:hover{ background:rgba(8,6,14,0.62); }
  .service-card:hover::before{ transform:scaleX(1); }
  .service-card .sc-num{
    font-family:'IBM Plex Mono', monospace; font-size:0.7rem; color:var(--muted);
    display:flex; align-items:center; justify-content:center;
    width:34px; height:34px; border-radius:50%; border:1px solid var(--line);
    margin-bottom:26px; transition:border-color .3s;
  }
  .service-card:hover .sc-num{ border-color:rgba(51,214,232,0.5); color:var(--cyan); }
  .service-card h3{ font-family:'Fraunces', serif; font-weight:500; font-size:1.2rem; margin-bottom:12px; letter-spacing:-0.01em; }
  .service-card p{ color:var(--muted); font-size:0.86rem; line-height:1.6; }
  @media (max-width:860px){ .cards-grid{ grid-template-columns:1fr; } }

  /* ---------- PROCESS ---------- */
  .process{ padding:0 6vw 150px; }
  .process-inner{ max-width:1080px; margin:0 auto; }
  .process-steps{ display:grid; grid-template-columns:repeat(4, 1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
  .process-step{ background:rgba(8,6,14,0.42); backdrop-filter:blur(16px); padding:36px 26px; opacity:1; transform:none; }
  .process-step .ps-num{ font-family:'Fraunces', serif; font-weight:600; font-size:2.2rem; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; display:block; margin-bottom:18px; }
  .process-step h3{ font-family:'Fraunces', serif; font-weight:500; font-size:1.05rem; margin-bottom:10px; }
  .process-step p{ color:var(--muted); font-size:0.85rem; line-height:1.55; }
  @media (max-width:860px){ .process-steps{ grid-template-columns:1fr 1fr; } }
  @media (max-width:520px){ .process-steps{ grid-template-columns:1fr; } }

  /* ---------- PLATFORMS STRIP ---------- */
  .platforms{ padding:0 6vw 150px; text-align:center; }
  .platforms-inner{ max-width:900px; margin:0 auto; }
  .platforms-label{ font-family:'IBM Plex Mono', monospace; font-size:0.72rem; letter-spacing:0.12em; color:var(--muted); text-transform:uppercase; margin-bottom:30px; }
  .platform-row{ display:flex; flex-wrap:wrap; justify-content:center; gap:14px; }
  .platform-chip{
    font-family:'IBM Plex Mono', monospace; font-size:0.82rem; color:var(--paper);
    border:1px solid var(--line); border-radius:100px; padding:10px 22px;
    background:rgba(8,6,14,0.35); opacity:1; transform:none;
    transition:border-color .3s, background .3s;
  }
  .platform-chip:hover{ border-color:rgba(51,214,232,0.5); background:rgba(8,6,14,0.55); }

  /* ---------- FAQ ---------- */
  .faq{ padding:0 6vw 150px; }
  .faq-inner{ max-width:820px; margin:0 auto; }
  .faq-item{ border-top:1px solid var(--line); opacity:1; transform:none; }
  .faq-item:last-child{ border-bottom:1px solid var(--line); }
  .faq-q{
    display:flex; align-items:center; justify-content:space-between; gap:20px;
    padding:24px 4px; cursor:none; background:none; border:none; width:100%;
    text-align:left; font-family:'Fraunces', serif; font-size:1.05rem; color:var(--paper);
  }
  .faq-q .plus{ font-family:'IBM Plex Mono', monospace; font-size:1.1rem; color:var(--cyan); transition:transform .3s ease; flex-shrink:0; }
  .faq-item.open .faq-q .plus{ transform:rotate(45deg); }
  .faq-a{ max-height:0; overflow:hidden; transition:max-height .35s ease; }
  .faq-a p{ color:var(--muted); font-size:0.92rem; line-height:1.6; padding:0 4px 24px; max-width:65ch; }
  .faq-item.open .faq-a{ max-height:220px; }

  .cta{ padding:160px 6vw; text-align:center; border-top:1px solid var(--line); position:relative; overflow:hidden; }
  .cta::before{
    content:''; position:absolute; left:50%; top:50%; width:600px; height:400px;
    transform:translate(-50%,-50%); border-radius:50%;
    background:radial-gradient(ellipse, rgba(108,92,231,0.16), transparent 70%);
    filter:blur(40px); pointer-events:none;
  }
  .cta-inner{ max-width:720px; margin:0 auto; position:relative; }
  .cta h2{ font-family:'Fraunces', serif; font-weight:500; font-size:clamp(2rem,4.4vw,3.2rem); letter-spacing:-0.01em; margin-bottom:26px; line-height:1.15; }
  .cta p{ color:var(--muted); font-size:1.05rem; margin-bottom:44px; }
  .cta-buttons{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
  .btn{
    display:inline-flex; align-items:center; gap:10px;
    font-family:'IBM Plex Mono', monospace; font-size:0.82rem; letter-spacing:0.02em;
    padding:16px 30px; border-radius:100px; text-decoration:none;
    position:relative; overflow:hidden; transition:box-shadow .3s, transform .2s;
  }
  .btn-primary{ background:var(--grad); color:var(--ink); font-weight:600; }
  .btn-primary:hover{ box-shadow:0 12px 40px -8px rgba(232,95,209,0.5); }
  .btn-outline{ border:1px solid rgba(243,241,238,0.28); color:var(--paper); }
  .btn-outline:hover{ border-color:rgba(243,241,238,0.55); }

  /* ---------- PROFESSIONAL DIGIDWAR FOOTER ---------- */
  footer.site-footer{
    padding:0;
    display:block;
    font-family:'Inter',sans-serif;
    font-size:inherit;
    color:var(--muted);
    border-top:1px solid var(--line);
    position:relative;
    overflow:hidden;
    background:rgba(8,6,14,.34);
  }
  footer.site-footer::before{
    content:'';
    position:absolute;
    left:6vw;
    right:6vw;
    top:0;
    height:1px;
    background:var(--grad);
    opacity:.72;
  }
  .footer-main{
    width:min(1180px,88vw);
    margin:0 auto;
    padding:72px 0 52px;
    display:grid;
    grid-template-columns:1.25fr .85fr 1.2fr .7fr;
    gap:46px;
    position:relative;
    z-index:1;
  }
  .footer-brand-name{
    display:inline-block;
    font-family:'Fraunces',serif;
    font-size:clamp(1.8rem,3vw,2.55rem);
    font-weight:600;
    letter-spacing:-.03em;
    color:var(--paper);
    text-decoration:none;
    margin-bottom:14px;
  }
  .footer-brand-name span{
    background:var(--grad);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
  .footer-brand p{
    max-width:34ch;
    font-size:.9rem;
    line-height:1.7;
    color:var(--muted);
  }
  .footer-kicker{
    display:block;
    margin-bottom:19px;
    font-family:'IBM Plex Mono',monospace;
    font-size:.67rem;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:var(--cyan);
  }
  .footer-col{
    min-width:0;
  }
  .footer-col a,
  .footer-col address{
    display:block;
    color:var(--paper);
    text-decoration:none;
    font-style:normal;
    font-size:.88rem;
    line-height:1.75;
    overflow-wrap:anywhere;
  }
  .footer-col a{
    width:max-content;
    max-width:100%;
    transition:color .2s ease, transform .2s ease;
  }
  .footer-col a + a{ margin-top:6px; }
  .footer-col a:hover{ color:var(--cyan); transform:translateX(3px); }
  .footer-col address{ color:var(--muted); max-width:28ch; }
  .footer-links{ display:flex; flex-direction:column; gap:7px; }
  .footer-links a{ color:var(--muted); }
  .footer-bottom{
    width:min(1180px,88vw);
    margin:0 auto;
    padding:22px 0 30px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    border-top:1px solid var(--line);
    font-family:'IBM Plex Mono',monospace;
    font-size:.68rem;
    color:var(--muted);
    position:relative;
    z-index:1;
  }
  footer.site-footer .foot-social{ display:flex; gap:18px; }
  footer.site-footer .foot-social a{ color:var(--paper); opacity:.7; transition:opacity .2s,color .2s; }
  footer.site-footer .foot-social a:hover{ opacity:1; color:var(--cyan); }
  footer.site-footer .foot-social svg{ width:16px; height:16px; display:block; }

  @media (max-width:900px){
    .footer-main{ grid-template-columns:1fr 1fr; gap:38px 32px; padding-top:58px; }
  }
  @media (max-width:560px){
    .footer-main{ grid-template-columns:1fr; gap:34px; padding:50px 0 38px; }
    .footer-brand p,.footer-col address{ max-width:none; }
    .footer-bottom{ align-items:flex-start; flex-direction:column; padding-bottom:26px; }
  }

@media (prefers-reduced-motion: reduce){
    *{ animation:none !important; transition:none !important; }
  }


  /* ---------- REFERENCE-STYLE HERO (hero only) ---------- */
  .scrollytell{
    position:relative;
    height:auto;
    background:transparent;
    color:var(--paper);
    overflow:hidden;
  }
  .scrollytell .stage{
    position:relative;
    height:auto;
    min-height:760px;
    width:100%;
    overflow:hidden;
    display:block;
    padding:118px 6vw 70px;
    background:transparent;
  }
  .reference-hero{
    position:relative;
    z-index:1;
    width:min(1280px,100%);
    min-height:570px;
    margin:0 auto;
    display:flex;
    align-items:center;
  }
  .hero-slides{
    position:relative;
    width:100%;
    min-height:570px;
  }
  .hero-slide{
    position:absolute;
    inset:0;
    display:grid;
    grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
    align-items:center;
    gap:72px;
    padding:34px 70px;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateX(22px);
    transition:opacity .45s ease, transform .55s cubic-bezier(.2,.75,.25,1), visibility .45s;
  }
  .hero-slide.active{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateX(0);
  }
  .hero-copy{ text-align:center; max-width:610px; margin:0 auto; }
  .hero-kicker{
    display:inline-flex;
    align-items:center;
    gap:9px;
    margin-bottom:22px;
    font-family:'IBM Plex Mono',monospace;
    font-size:.72rem;
    font-weight:500;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:var(--cyan);
  }
  .hero-kicker::before{
    content:'';
    width:26px;
    height:1px;
    background:var(--cyan);
  }
  .hero-copy h1,.hero-copy h2{
    margin:0;
    font-family:'Inter',sans-serif;
    font-size:clamp(2.7rem,4.8vw,4.6rem);
    line-height:1.08;
    font-weight:700;
    letter-spacing:-.045em;
    color:var(--paper);
  }
  .hero-copy h2{font-size:clamp(2.55rem,4.3vw,4.2rem);}
  .hero-copy h1 span,.hero-copy h2 span{
    background:var(--grad);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
  .hero-copy>p{
    max-width:52ch;
    margin:28px auto 0;
    font-size:clamp(1rem,1.35vw,1.18rem);
    line-height:1.7;
    color:var(--muted);
  }
  .hero-actions{
    margin-top:36px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:22px;
    flex-wrap:wrap;
  }
  .hero-main-btn{
    background:var(--grad)!important;
    color:var(--ink)!important;
    border:none!important;
    border-radius:30px!important;
    padding:15px 29px!important;
    font-family:'Inter',sans-serif!important;
    font-size:.82rem!important;
    font-weight:700!important;
    letter-spacing:.02em!important;
    text-transform:uppercase;
    box-shadow:0 10px 30px rgba(108,92,231,.20);
  }
  .hero-main-btn:hover{ box-shadow:0 14px 38px rgba(232,95,209,.30)!important; }
  .hero-text-link{
    text-decoration:none;
    color:var(--paper);
    font-size:.9rem;
    font-weight:600;
    border-bottom:1px solid rgba(245,243,242,.28);
    padding-bottom:4px;
  }
  .hero-visual{
    position:relative;
    width:100%;
    min-height:430px;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .rank-visual{ flex-direction:column; overflow:visible; }
  .rank-copy{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:16px;
    font-family:Georgia,'Times New Roman',serif;
    color:var(--paper);
    margin-bottom:-8px;
  }
  .rank-small{ font-size:clamp(2.4rem,4.4vw,4.8rem); line-height:1; }
  .rank-on{ align-self:flex-end; margin-bottom:-30px; }
  .rank-one-wrap{
    position:relative;
    width:180px;
    height:180px;
    border:13px solid rgba(164,164,164,.5);
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(8,6,14,.58);
    box-shadow:0 18px 45px rgba(0,0,0,.28), inset 0 0 0 2px rgba(245,243,242,.12);
    transform:rotate(-4deg);
    z-index:2;
  }
  .rank-one-wrap::after{
    content:'';
    position:absolute;
    width:135px;
    height:18px;
    right:-111px;
    top:138px;
    border-radius:16px;
    background:linear-gradient(90deg,#8b8795,var(--paper) 22%,var(--paper) 100%);
    transform:rotate(35deg);
    transform-origin:left center;
    box-shadow:0 4px 9px rgba(0,0,0,.15);
  }
  .rank-one{ font-family:Georgia,'Times New Roman',serif; font-size:5.2rem; line-height:1; font-weight:700; color:var(--paper); }
  .google-word{
    margin-top:4px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:Arial,Helvetica,sans-serif;
    font-size:clamp(4.2rem,7.2vw,7.4rem);
    font-weight:500;
    letter-spacing:-.07em;
    line-height:1;
  }
  .google-word span:nth-child(1),.google-word span:nth-child(4){color:#4285f4;}
  .google-word span:nth-child(2),.google-word span:nth-child(6){color:#ea4335;}
  .google-word span:nth-child(3){color:#fbbc05;}
  .google-word span:nth-child(5){color:#34a853;}
  .rank-note{
    max-width:410px;
    margin-top:26px;
    text-align:center;
    font-size:.88rem;
    line-height:1.55;
    color:var(--muted);
  }
  .services-visual{
    align-content:center;
    flex-direction:column;
    gap:0;
    padding:20px 8px;
  }
  .hero-service-line{
    width:min(640px,100%);
    display:grid;
    grid-template-columns:42px minmax(170px,1fr) minmax(150px,.9fr);
    align-items:center;
    gap:18px;
    padding:18px 10px;
    border-top:1px solid var(--line);
  }
  .hero-service-line:last-child{border-bottom:1px solid var(--line);}
  .hero-service-line b{font-family:'IBM Plex Mono',monospace;font-size:.72rem;color:var(--cyan);}
  .hero-service-line span{font-family:'Fraunces',serif;font-size:1.23rem;font-weight:600;color:var(--paper);}
  .hero-service-line small{font-size:.75rem;line-height:1.45;color:var(--muted);text-align:right;}
  .brands-visual{ flex-direction:column; gap:18px; padding:30px 10px; }
  .hero-brand-card{
    width:min(610px,100%);
    display:flex;
    gap:18px;
    align-items:flex-start;
    padding:28px;
    border:1px solid var(--line);
    background:rgba(8,6,14,.42);
    backdrop-filter:blur(16px);
    box-shadow:0 15px 45px rgba(0,0,0,.16);
  }
  .hero-brand-badge{
    width:46px;height:46px;border-radius:50%;flex:0 0 auto;
    display:flex;align-items:center;justify-content:center;
    background:var(--grad);color:var(--ink);font-family:'Fraunces',serif;font-weight:700;
  }
  .hero-brand-card strong{display:block;font-family:'Fraunces',serif;font-size:1.2rem;color:var(--paper);margin-bottom:8px;}
  .hero-brand-card p{font-size:.86rem;line-height:1.55;color:var(--muted);}
  .hero-arrow{
    position:absolute;
    top:50%;
    z-index:12;
    width:48px;height:48px;
    margin-top:-24px;
    border:0;
    background:transparent;
    color:var(--paper);
    cursor:none;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:2.7rem;
    font-weight:300;
    line-height:1;
    transition:transform .2s ease,opacity .2s ease;
  }
  .hero-arrow:hover{transform:scale(1.08);}
  .hero-arrow-prev{left:0;}
  .hero-arrow-next{right:0;}
  .hero-count{
    position:absolute;
    left:50%;
    bottom:4px;
    transform:translateX(-50%);
    display:flex;
    align-items:center;
    gap:7px;
    font-family:'IBM Plex Mono',monospace;
    font-size:.7rem;
    letter-spacing:.06em;
    color:var(--muted);
  }
  .hero-count b{color:var(--paper);font-size:.78rem;}
  .hero-dotted{
    position:absolute;
    z-index:0;
    width:240px;
    height:240px;
    border:4px dotted rgba(51,214,232,.70);
    border-radius:50%;
    opacity:.9;
    pointer-events:none;
  }
  .hero-dotted-top{left:-145px;top:-120px;clip-path:inset(42% 0 0 48%);}
  .hero-dotted-bottom{right:-145px;bottom:-145px;clip-path:inset(0 45% 48% 0);}
  .reference-hero::before{
    content:'';
    position:absolute;
    left:33px;
    top:52px;
    width:16px;
    height:16px;
    border-right:5px solid var(--paper);
    border-bottom:5px solid var(--paper);
    transform:rotate(45deg);
    opacity:.92;
  }
  .scrollytell .orb{
    display:block;
    z-index:0;
    opacity:1;
    animation-iteration-count:infinite;
  }
  @media (max-width:1050px){
    .scrollytell .stage{padding:108px 4vw 64px;}
    .hero-slide{gap:34px;padding:30px 55px;}
    .hero-service-line{grid-template-columns:34px 1fr;}
    .hero-service-line small{display:none;}
    .rank-one-wrap{width:150px;height:150px;border-width:11px;}
    .rank-one{font-size:4.4rem;}
    .rank-one-wrap::after{width:112px;right:-92px;top:117px;height:16px;}
  }
  @media (max-width:760px){
    .scrollytell .stage{min-height:920px;padding:105px 18px 55px;}
    .reference-hero,.hero-slides{min-height:760px;}
    .hero-slide{
      grid-template-columns:1fr;
      grid-template-rows:auto 1fr;
      gap:22px;
      padding:28px 42px 50px;
      align-content:center;
    }
    .hero-copy h1,.hero-copy h2{font-size:clamp(2.35rem,10vw,3.4rem);}
    .hero-copy>p{font-size:.98rem;line-height:1.62;margin-top:20px;}
    .hero-actions{margin-top:25px;gap:14px;}
    .hero-main-btn{padding:14px 22px!important;font-size:.74rem!important;}
    .hero-visual{min-height:300px;}
    .rank-small{font-size:2.4rem;}
    .rank-one-wrap{width:112px;height:112px;border-width:8px;}
    .rank-one{font-size:3.2rem;}
    .rank-one-wrap::after{width:82px;right:-68px;top:88px;height:12px;}
    .google-word{font-size:clamp(3.6rem,18vw,5.5rem);}
    .rank-note{display:none;}
    .brands-visual{padding:4px;gap:12px;}
    .hero-brand-card{padding:18px;}
    .hero-brand-card p{font-size:.8rem;}
    .hero-service-line{padding:13px 4px;}
    .hero-service-line span{font-size:1rem;}
    .hero-arrow{width:38px;height:38px;font-size:2rem;top:auto;bottom:4px;cursor:pointer;}
    .hero-arrow-prev{left:calc(50% - 86px);}
    .hero-arrow-next{right:calc(50% - 86px);}
    .hero-count{bottom:13px;}
    .hero-dotted-top{left:-175px;top:-135px;}
    .hero-dotted-bottom{right:-175px;bottom:-160px;}
    .reference-hero::before{left:22px;top:34px;transform:scale(.8) rotate(45deg);}
  }


  /* ---------- ANTIGRAVITY-STYLE FLOATING GLASS BUBBLE ---------- */
  .antigravity-bubble-scene{
    position:absolute;
    z-index:1;
    right:4.5%;
    top:50%;
    width:clamp(270px,31vw,430px);
    aspect-ratio:1;
    transform:translateY(-50%);
    pointer-events:none;
    filter:drop-shadow(0 38px 48px rgba(0,0,0,.30));
  }
  .antigravity-bubble{
    position:absolute;
    inset:0;
    border-radius:50%;
    overflow:hidden;
    isolation:isolate;
    border:1px solid rgba(255,255,255,.32);
    background:
      radial-gradient(circle at 26% 22%, rgba(255,255,255,.92) 0 1.5%, rgba(255,255,255,.36) 5%, transparent 15%),
      radial-gradient(circle at 31% 28%, rgba(135,255,246,.40) 0 8%, transparent 26%),
      radial-gradient(circle at 70% 22%, rgba(255,103,214,.78) 0 9%, rgba(255,103,214,.28) 18%, transparent 36%),
      radial-gradient(circle at 78% 68%, rgba(255,45,157,.60) 0 11%, rgba(255,45,157,.20) 24%, transparent 45%),
      radial-gradient(circle at 34% 78%, rgba(48,111,255,.55) 0 12%, rgba(48,111,255,.17) 30%, transparent 50%),
      radial-gradient(circle at 48% 45%, rgba(255,255,255,.11) 0 28%, rgba(255,255,255,.04) 52%, transparent 72%),
      linear-gradient(140deg, rgba(143,255,243,.18) 0%, rgba(132,92,231,.14) 42%, rgba(232,95,209,.22) 76%, rgba(255,255,255,.07) 100%);
    box-shadow:
      inset 26px 18px 46px rgba(255,255,255,.18),
      inset -34px -30px 76px rgba(45,54,194,.30),
      inset 10px -18px 38px rgba(51,214,232,.12),
      0 0 95px rgba(232,95,209,.16),
      0 0 45px rgba(51,214,232,.10);
    backdrop-filter:blur(12px) saturate(150%);
    -webkit-backdrop-filter:blur(12px) saturate(150%);
    animation:antigravityFloat 8.5s cubic-bezier(.45,.05,.55,.95) infinite;
    will-change:transform;
  }
  .antigravity-bubble::before{
    content:'';
    position:absolute;
    inset:5%;
    border-radius:50%;
    z-index:2;
    background:
      radial-gradient(ellipse at 35% 14%, rgba(255,255,255,.86) 0 1.8%, rgba(255,255,255,.28) 8%, transparent 23%),
      radial-gradient(ellipse at 82% 42%, rgba(255,255,255,.38) 0 1.2%, transparent 12%),
      linear-gradient(118deg, transparent 12%, rgba(255,255,255,.20) 26%, transparent 39%);
    filter:blur(.15px);
    opacity:.9;
    animation:antigravityHighlight 6.5s ease-in-out infinite alternate;
  }
  .antigravity-bubble::after{
    content:'';
    position:absolute;
    inset:-18%;
    border-radius:44% 56% 53% 47% / 48% 44% 56% 52%;
    z-index:1;
    background:
      conic-gradient(from 225deg,
        transparent 0 13%,
        rgba(51,214,232,.20) 19%,
        transparent 32%,
        rgba(232,95,209,.34) 48%,
        rgba(255,255,255,.10) 56%,
        transparent 69%,
        rgba(108,92,231,.24) 82%,
        transparent 100%);
    filter:blur(24px);
    mix-blend-mode:screen;
    opacity:.84;
    animation:antigravitySwirl 11s linear infinite;
  }
  .bubble-glint{
    position:absolute;
    display:block;
    z-index:4;
    border-radius:999px;
    pointer-events:none;
  }
  .bubble-glint-a{
    width:54%;
    height:10%;
    left:7%;
    top:11%;
    border-top:2px solid rgba(255,255,255,.66);
    transform:rotate(-24deg);
    filter:blur(.2px);
    opacity:.6;
  }
  .bubble-glint-b{
    width:18%;
    height:7%;
    right:10%;
    top:26%;
    background:radial-gradient(ellipse, rgba(255,255,255,.46), transparent 72%);
    transform:rotate(24deg);
    opacity:.7;
  }
  .bubble-glow{
    position:absolute;
    z-index:-1;
    width:72%;
    height:72%;
    right:-9%;
    bottom:-11%;
    border-radius:50%;
    background:radial-gradient(circle, rgba(232,95,209,.28), rgba(108,92,231,.12) 42%, transparent 72%);
    filter:blur(34px);
    animation:antigravityGlow 7s ease-in-out infinite alternate;
  }
  @keyframes antigravityFloat{
    0%,100%{ transform:translate3d(0,0,0) rotate(-3deg) scale(1); }
    20%{ transform:translate3d(15px,-18px,0) rotate(1deg) scale(1.018); }
    42%{ transform:translate3d(-8px,-34px,0) rotate(4deg) scale(.995); }
    64%{ transform:translate3d(-18px,-10px,0) rotate(0deg) scale(1.024); }
    82%{ transform:translate3d(9px,12px,0) rotate(-2deg) scale(1.008); }
  }
  @keyframes antigravityHighlight{
    0%{ transform:translate3d(-5px,-4px,0) rotate(-3deg) scale(.98); opacity:.72; }
    100%{ transform:translate3d(12px,8px,0) rotate(4deg) scale(1.04); opacity:1; }
  }
  @keyframes antigravitySwirl{
    from{ transform:rotate(0deg) scale(1); }
    50%{ transform:rotate(180deg) scale(1.05); }
    to{ transform:rotate(360deg) scale(1); }
  }
  @keyframes antigravityGlow{
    from{ transform:translate3d(-6px,2px,0) scale(.94); opacity:.65; }
    to{ transform:translate3d(10px,-8px,0) scale(1.08); opacity:1; }
  }
  .hero-slides{ z-index:2; }
  .hero-arrow,.hero-count{ z-index:4; }

  @media (max-width:1050px){
    .antigravity-bubble-scene{right:2%;width:clamp(240px,34vw,350px);opacity:.9;}
  }
  @media (max-width:760px){
    .antigravity-bubble-scene{
      width:230px;
      right:-72px;
      top:61%;
      opacity:.72;
      filter:drop-shadow(0 24px 34px rgba(0,0,0,.24));
    }
  }

  @media (hover:none),(pointer:coarse){.hero-arrow{cursor:pointer;}}



  /* ---------- DIGIDWAR CONTINUOUS RESULTS LOOP ---------- */
  .dd-loop-showcase{
    position:relative;
    overflow:hidden;
    padding:100px 0 110px;
    isolation:isolate;
    background:
      radial-gradient(ellipse 620px 380px at 50% 55%, rgba(108,92,231,.18), transparent 66%),
      radial-gradient(ellipse 420px 260px at 45% 52%, rgba(51,214,232,.09), transparent 72%);
  }
  .dd-loop-showcase::before{
    content:'';
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(90deg, var(--ink) 0%, transparent 12%, transparent 88%, var(--ink) 100%);
    z-index:8;
  }
  .dd-loop-inner{
    position:relative;
    width:min(1260px,100%);
    margin:0 auto;
    padding:0 22px;
    z-index:2;
  }
  .dd-loop-kicker{
    font-family:'IBM Plex Mono',monospace;
    font-size:.7rem;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:var(--cyan);
    text-align:center;
    margin-bottom:12px;
  }
  .dd-loop-title{
    font-family:'Fraunces',serif;
    font-size:clamp(2rem,4.7vw,4.6rem);
    font-weight:500;
    line-height:1.02;
    letter-spacing:-.035em;
    text-align:center;
    max-width:900px;
    margin:0 auto;
  }
  .dd-loop-title em{
    font-weight:500;
    font-style:italic;
    background:var(--grad);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
  .dd-loop-sub{
    width:min(660px,92%);
    margin:18px auto 0;
    text-align:center;
    color:var(--muted);
    font-size:.93rem;
    line-height:1.65;
  }
  .dd-loop-stage{
    position:relative;
    height:clamp(430px,48vw,590px);
    margin-top:34px;
    perspective:1400px;
    transform-style:preserve-3d;
    overflow:visible;
    touch-action:pan-y;
  }
  .dd-loop-stage::before{
    content:'';
    position:absolute;
    left:50%; top:50%;
    width:min(850px,72vw);
    height:min(300px,26vw);
    min-height:170px;
    transform:translate(-50%,-42%) rotateX(64deg);
    border:1px solid rgba(245,243,242,.10);
    border-radius:50%;
    box-shadow:
      0 0 0 1px rgba(51,214,232,.03),
      0 0 80px rgba(108,92,231,.12),
      inset 0 0 60px rgba(232,95,209,.05);
    pointer-events:none;
  }
  .dd-loop-stage::after{
    content:'';
    position:absolute;
    left:50%; top:54%;
    width:min(460px,48vw);
    aspect-ratio:1;
    transform:translate(-50%,-50%);
    border-radius:50%;
    background:radial-gradient(circle, rgba(108,92,231,.18), rgba(51,214,232,.07) 34%, transparent 68%);
    filter:blur(10px);
    opacity:.9;
    pointer-events:none;
  }
  .dd-loop-card{
    --depth:.5;
    position:absolute;
    left:50%; top:50%;
    width:clamp(260px,29vw,390px);
    aspect-ratio:1.48;
    margin-left:calc(clamp(260px,29vw,390px) / -2);
    margin-top:calc((clamp(260px,29vw,390px) / 1.48) / -2);
    border:1px solid rgba(245,243,242,.16);
    border-radius:20px;
    background:linear-gradient(160deg, rgba(30,20,45,.92), rgba(9,7,15,.94));
    box-shadow:0 30px 80px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.08);
    overflow:hidden;
    will-change:transform,opacity,filter;
    transform-style:preserve-3d;
    backface-visibility:hidden;
    pointer-events:none;
  }
  .dd-loop-card::before{
    content:'';
    position:absolute;
    inset:0;
    z-index:1;
    background:
      linear-gradient(120deg, rgba(255,255,255,.07), transparent 21%),
      radial-gradient(circle at 84% 10%, rgba(232,95,209,.16), transparent 29%),
      radial-gradient(circle at 12% 88%, rgba(51,214,232,.12), transparent 30%);
    pointer-events:none;
  }
  .dd-loop-card-head{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    height:42px;
    padding:0 15px;
    border-bottom:1px solid rgba(245,243,242,.10);
    background:rgba(255,255,255,.018);
  }
  .dd-loop-dots{display:flex;gap:5px;}
  .dd-loop-dots i{width:6px;height:6px;border-radius:50%;background:rgba(245,243,242,.24);display:block;}
  .dd-loop-card-tag{
    font-family:'IBM Plex Mono',monospace;
    font-size:.58rem;
    letter-spacing:.1em;
    text-transform:uppercase;
    color:rgba(245,243,242,.54);
    white-space:nowrap;
  }
  .dd-loop-card-body{
    position:relative;
    z-index:2;
    height:calc(100% - 42px);
    padding:18px;
    display:grid;
    grid-template-columns:1.05fr .85fr;
    gap:14px;
  }
  .dd-loop-card-copy{min-width:0;display:flex;flex-direction:column;justify-content:space-between;}
  .dd-loop-card-num{
    font-family:'IBM Plex Mono',monospace;
    font-size:.62rem;
    color:var(--cyan);
    letter-spacing:.08em;
  }
  .dd-loop-card h3{
    margin:8px 0 6px;
    font-family:'Fraunces',serif;
    font-size:clamp(1.05rem,1.7vw,1.5rem);
    font-weight:500;
    line-height:1.05;
    letter-spacing:-.02em;
  }
  .dd-loop-card p{
    color:rgba(172,166,186,.82);
    font-size:clamp(.62rem,.9vw,.75rem);
    line-height:1.45;
  }
  .dd-loop-metric{
    margin-top:12px;
    display:inline-flex;
    width:max-content;
    max-width:100%;
    align-items:center;
    gap:7px;
    border:1px solid rgba(51,214,232,.20);
    background:rgba(51,214,232,.05);
    border-radius:999px;
    padding:5px 8px;
    font-family:'IBM Plex Mono',monospace;
    font-size:.55rem;
    color:var(--paper);
  }
  .dd-loop-metric::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px rgba(51,214,232,.9);}
  .dd-loop-mini{
    min-width:0;
    align-self:stretch;
    border:1px solid rgba(245,243,242,.08);
    border-radius:12px;
    padding:10px;
    background:rgba(7,5,13,.5);
    display:flex;
    flex-direction:column;
    gap:8px;
  }
  .dd-loop-mini-row{height:7px;border-radius:99px;background:rgba(245,243,242,.08);overflow:hidden;}
  .dd-loop-mini-row span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,rgba(51,214,232,.72),rgba(108,92,231,.72),rgba(232,95,209,.72));}
  .dd-loop-mini-chart{margin-top:auto;height:58%;display:flex;align-items:flex-end;gap:5px;border-bottom:1px solid rgba(245,243,242,.08);padding:0 2px 7px;}
  .dd-loop-mini-chart i{flex:1;min-width:4px;border-radius:5px 5px 1px 1px;background:linear-gradient(180deg,rgba(108,92,231,.80),rgba(51,214,232,.26));box-shadow:0 0 16px rgba(108,92,231,.12);}
  .dd-loop-center-mark{
    position:absolute;
    left:50%;bottom:10px;
    transform:translateX(-50%);
    z-index:30;
    font-family:'IBM Plex Mono',monospace;
    font-size:.62rem;
    letter-spacing:.16em;
    text-transform:uppercase;
    color:rgba(245,243,242,.38);
    white-space:nowrap;
  }
  .dd-loop-center-mark::before,
  .dd-loop-center-mark::after{content:'';display:inline-block;width:34px;height:1px;background:rgba(245,243,242,.14);vertical-align:middle;margin:0 10px;}
  @media (max-width:760px){
    .dd-loop-showcase{padding:74px 0 82px;}
    .dd-loop-inner{padding:0 12px;}
    .dd-loop-sub{font-size:.84rem;}
    .dd-loop-stage{height:390px;margin-top:24px;}
    .dd-loop-card{width:236px;margin-left:-118px;margin-top:-80px;border-radius:16px;aspect-ratio:1.48;}
    .dd-loop-card-head{height:34px;padding:0 11px;}
    .dd-loop-card-body{height:calc(100% - 34px);padding:12px;gap:9px;}
    .dd-loop-card h3{font-size:1.02rem;margin:5px 0 4px;}
    .dd-loop-card p{font-size:.58rem;line-height:1.4;}
    .dd-loop-metric{font-size:.48rem;padding:4px 6px;margin-top:7px;}
    .dd-loop-mini{padding:7px;gap:6px;border-radius:9px;}
    .dd-loop-mini-row{height:5px;}
    .dd-loop-mini-chart{gap:3px;padding-bottom:5px;}
    .dd-loop-center-mark{bottom:2px;font-size:.52rem;}
    .dd-loop-center-mark::before,.dd-loop-center-mark::after{width:18px;margin:0 6px;}
  }
  @media (prefers-reduced-motion:reduce){
    .dd-loop-card{transition:none!important;}
  }



  /* ---------- LAUNCH NAV / SERVICES MEGA MENU ---------- */
  nav .brand{text-decoration:none;}
  .services-nav{position:relative;}
  .services-trigger{
    appearance:none;border:0;background:transparent;color:var(--paper);font:inherit;
    font-size:.83rem;opacity:.72;display:flex;align-items:center;gap:7px;cursor:pointer;
    padding:0;position:relative;transition:opacity .2s;
  }
  .services-trigger::after{
    content:'';position:absolute;left:0;right:0;bottom:-4px;height:1px;background:var(--grad);
    transform:scaleX(0);transform-origin:left;transition:transform .3s ease;
  }
  .services-trigger:hover,.services-nav.open .services-trigger,.services-nav:focus-within .services-trigger{opacity:1;}
  .services-trigger:hover::after,.services-nav.open .services-trigger::after,.services-nav:focus-within .services-trigger::after{transform:scaleX(1);}
  .services-chevron{display:inline-block;transition:transform .25s ease;}
  .services-nav.open .services-chevron,.services-nav:hover .services-chevron,.services-nav:focus-within .services-chevron{transform:rotate(180deg);}
  .services-menu{
    position:fixed;z-index:70;top:72px;left:50%;width:min(880px,90vw);padding:14px;
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;
    background:rgba(18,10,28,.96);backdrop-filter:blur(22px);border:1px solid var(--line);
    box-shadow:0 28px 70px rgba(0,0,0,.34);opacity:0;visibility:hidden;
    transform:translate(-50%,12px) scale(.985);transition:opacity .22s ease,transform .22s ease,visibility .22s;
  }
  .services-nav:hover .services-menu,.services-nav.open .services-menu,.services-nav:focus-within .services-menu{
    opacity:1;visibility:visible;transform:translate(-50%,0) scale(1);
  }
  .services-menu a{
    display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:start;text-decoration:none;
    padding:15px;border:1px solid transparent;background:rgba(8,6,14,.42);transition:border-color .2s,background .2s,transform .2s;
  }
  .services-menu a:hover{border-color:rgba(245,243,242,.18);background:rgba(108,92,231,.09);transform:translateY(-2px);}
  .services-menu b{font-family:'IBM Plex Mono',monospace;font-size:.66rem;color:var(--cyan);padding-top:3px;}
  .services-menu strong{display:block;font-family:'Fraunces',serif;font-size:1rem;font-weight:500;}
  .services-menu small{display:block;color:var(--muted);font-size:.72rem;line-height:1.45;margin-top:4px;}
  .audit-nav-link{opacity:1!important;font-family:'IBM Plex Mono',monospace;font-size:.72rem!important;padding:9px 14px;border:1px solid rgba(245,243,242,.22);border-radius:999px;}
  .audit-nav-link::after{display:none!important;}
  .nav-menu-toggle{display:none;width:42px;height:42px;border:1px solid var(--line);background:rgba(8,6,14,.45);align-items:center;justify-content:center;flex-direction:column;gap:5px;cursor:pointer;}
  .nav-menu-toggle span{width:18px;height:1px;background:var(--paper);display:block;transition:transform .25s,opacity .25s;}
  nav.menu-open .nav-menu-toggle span:nth-child(1){transform:translateY(6px) rotate(45deg);}
  nav.menu-open .nav-menu-toggle span:nth-child(2){opacity:0;}
  nav.menu-open .nav-menu-toggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}
  #services,.service-cat,#about,#contact,#free-seo-audit{scroll-margin-top:100px;}

  /* ---------- SOURCE-INSPIRED GROWTH STACK / GIANT LOOP ---------- */
  .growth-stack{overflow:hidden;padding:95px 0 105px;border-top:1px solid var(--line);}
  .growth-loop{overflow:hidden;border-bottom:1px solid var(--line);padding-bottom:24px;margin-bottom:64px;}
  .growth-loop-track{display:flex;width:max-content;gap:52px;animation:growthGiantLoop 34s linear infinite;will-change:transform;}
  .growth-loop span{
    white-space:nowrap;font-family:'Fraunces',serif;font-size:clamp(3rem,7vw,7.2rem);font-weight:600;
    letter-spacing:-.045em;color:transparent;-webkit-text-stroke:1px rgba(245,243,242,.42);
  }
  @keyframes growthGiantLoop{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  .growth-stack-inner{width:min(1180px,88vw);margin:0 auto;}
  .growth-tool-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:50px;}
  .growth-tool{min-height:180px;background:rgba(8,6,14,.42);backdrop-filter:blur(16px);padding:24px;display:flex;flex-direction:column;justify-content:center;animation:growthToolFloat 5.4s ease-in-out infinite;}
  .growth-tool:nth-child(2n){animation-delay:.55s}.growth-tool:nth-child(3n){animation-delay:1.05s}
  @keyframes growthToolFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
  .growth-tool b{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;background:var(--grad);color:var(--ink);font-family:'IBM Plex Mono',monospace;font-size:.72rem;}
  .growth-tool strong{font-family:'Fraunces',serif;font-size:1.05rem;font-weight:500;margin-top:18px;}
  .growth-tool small{color:var(--muted);font-size:.72rem;line-height:1.45;margin-top:5px;}

  /* ---------- CLIENT LINKS ---------- */
  .client-link-card{text-decoration:none;color:inherit;min-height:255px;display:flex;flex-direction:column;}
  .client-link-card .wdesc{margin-top:auto;}
  .client-visit{display:block;margin-top:18px;font-family:'IBM Plex Mono',monospace;font-size:.69rem;color:var(--cyan);}

  /* ---------- REVIEWS ---------- */
  .reviews{padding:110px 6vw;border-top:1px solid var(--line);}
  .reviews-inner{max-width:1180px;margin:0 auto;}
  .reviews-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
  .review-card{background:rgba(8,6,14,.42);backdrop-filter:blur(16px);padding:34px;min-height:240px;display:flex;flex-direction:column;}
  .review-label{font-family:'IBM Plex Mono',monospace;font-size:.62rem;color:var(--cyan);letter-spacing:.08em;}
  .review-card h3{font-family:'Fraunces',serif;font-size:1.25rem;font-weight:500;margin:18px 0 12px;}
  .review-card p{color:var(--muted);font-size:.9rem;line-height:1.65;}
  .review-card a{margin-top:auto;padding-top:24px;text-decoration:none;font-family:'IBM Plex Mono',monospace;font-size:.7rem;color:var(--cyan);}
  .audience-review{background:rgba(108,92,231,.08);}

  /* ---------- FREE SEO AUDIT ---------- */
  .seo-audit{padding:120px 6vw;border-top:1px solid var(--line);position:relative;overflow:hidden;}
  .seo-audit::before{content:'';position:absolute;right:-150px;top:5%;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(51,214,232,.13),transparent 68%);filter:blur(26px);pointer-events:none;}
  .audit-inner{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:start;position:relative;}
  .audit-copy h2{font-family:'Fraunces',serif;font-weight:500;font-size:clamp(2rem,4.5vw,3.8rem);line-height:1.04;letter-spacing:-.025em;margin:18px 0;}
  .audit-copy p{color:var(--muted);line-height:1.7;max-width:52ch;}
  .audit-checks{border-top:1px solid var(--line);}
  .audit-checks>div{display:grid;grid-template-columns:46px 1fr;gap:14px;padding:18px 0;border-bottom:1px solid var(--line);align-items:center;}
  .audit-checks b{font-family:'IBM Plex Mono',monospace;font-size:.66rem;color:var(--cyan);}
  .audit-checks span{font-size:.9rem;color:var(--paper);}
  .audit-checks .btn{margin-top:28px;}

  @media (max-width:980px){
    .growth-tool-grid{grid-template-columns:repeat(2,1fr);}
    .audit-inner{grid-template-columns:1fr;gap:42px;}
  }
  @media (max-width:760px){
    nav{padding:16px 5vw;background:rgba(18,10,28,.82);}
    .nav-menu-toggle{display:flex;margin-left:auto;}
    .nav-right{display:none;position:absolute;top:74px;left:0;right:0;padding:20px 5vw 24px;background:rgba(18,10,28,.98);border-bottom:1px solid var(--line);backdrop-filter:blur(20px);}
    nav.menu-open .nav-right{display:flex;flex-direction:column;align-items:stretch;gap:22px;}
    .nav-links{display:flex!important;flex-direction:column;gap:0;align-items:stretch;}
    .nav-links>a,.services-trigger{width:100%;padding:13px 0;font-size:.88rem;text-align:left;justify-content:space-between;}
    .nav-links>a::after,.services-trigger::after{bottom:5px;}
    .audit-nav-link{margin-top:10px;width:max-content!important;padding:10px 14px!important;}
    .services-menu{position:static;width:100%;padding:8px 0 12px;grid-template-columns:1fr;background:transparent;border:0;box-shadow:none;display:none;opacity:1;visibility:visible;transform:none;}
    .services-nav:hover .services-menu{display:none;}
    .services-nav.open .services-menu,.services-nav:focus-within .services-menu{display:grid;transform:none;}
    .services-menu a{padding:12px;background:rgba(8,6,14,.34);}
    .nav-social{padding-top:4px;}
    .growth-tool-grid,.reviews-grid{grid-template-columns:1fr;}
    .growth-loop{margin-bottom:46px;}
    .growth-stack,.reviews,.seo-audit{padding-top:84px;padding-bottom:84px;}
  }




/* ---------- CLIENTS & RESULTS polished ---------- */
.client-reviews{
  padding:110px 0 120px;
  position:relative;
}
.client-reviews .section-inner{
  width:min(1180px,88vw);
  margin:0 auto;
}
.client-reviews .section-kicker{
  font-family:'IBM Plex Mono',monospace;
  letter-spacing:.14em;
  font-size:.72rem;
  font-weight:700;
  color:var(--cyan);
  margin-bottom:14px;
}
.client-reviews h2{
  margin:0 0 14px;
  max-width:760px;
}
.client-reviews .section-intro{
  max-width:760px;
  margin:0 0 44px;
  color:var(--muted);
  line-height:1.7;
}
.client-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.client-card{
  position:relative;
  min-height:220px;
  padding:30px 28px;
  border:1px solid var(--line);
  border-radius:20px;
  background:linear-gradient(145deg,rgba(18,16,34,.78),rgba(8,6,14,.52));
  box-shadow:0 18px 50px rgba(0,0,0,.12);
  opacity:1 !important;
  transform:none !important;
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
  overflow:hidden;
}
.client-card::after{
  content:'';
  position:absolute;
  width:130px;height:130px;
  right:-70px;top:-70px;
  border-radius:50%;
  background:var(--grad);
  opacity:.10;
  pointer-events:none;
}
.client-card:hover{
  transform:translateY(-5px) !important;
  border-color:rgba(243,241,238,.28);
  box-shadow:0 24px 70px rgba(0,0,0,.22);
}
.client-number{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;height:34px;
  border-radius:50%;
  font-family:'IBM Plex Mono',monospace;
  font-size:.68rem;
  border:1px solid var(--line);
  color:var(--muted);
}
.client-card h3{
  margin:26px 0 10px;
  font-family:'Fraunces',serif;
  font-size:1.35rem;
  line-height:1.18;
  letter-spacing:-.02em;
  color:var(--paper);
}
.client-card p{
  margin:0;
  color:var(--muted);
  line-height:1.6;
  font-size:.9rem;
}
.client-tag{
  display:inline-flex;
  margin-top:20px;
  padding:7px 11px;
  border-radius:999px;
  font-family:'IBM Plex Mono',monospace;
  font-size:.65rem;
  letter-spacing:.04em;
  text-transform:uppercase;
  border:1px solid rgba(243,241,238,.18);
  color:var(--paper);
  background:rgba(243,241,238,.04);
}
.review-note{
  margin-top:22px;
  padding:24px 26px;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(8,6,14,.38);
}
.review-note strong{
  display:block;
  font-family:'IBM Plex Mono',monospace;
  font-size:.72rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--cyan);
  margin-bottom:8px;
}
.review-note p{
  margin:0;
  color:var(--muted);
  line-height:1.65;
}
@media (max-width:900px){
  .client-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:560px){
  .client-grid{grid-template-columns:1fr;}
  .client-reviews{padding:75px 0 85px;}
}

/* ---------- DIRECT CONTACT CTA — polished ---------- */
.cta{
  padding:120px 6vw 130px;
  text-align:center;
  border-top:1px solid var(--line);
  position:relative;
  overflow:hidden;
}
.cta::before{
  content:'';
  position:absolute;
  left:50%;top:50%;
  width:720px;height:430px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(108,92,231,.16),transparent 70%);
  filter:blur(40px);
  pointer-events:none;
}
.cta-inner{
  max-width:820px;
  margin:0 auto;
  position:relative;
}
.cta .cta-kicker{
  display:inline-block;
  margin-bottom:18px;
  font-family:'IBM Plex Mono',monospace;
  font-size:.68rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--cyan);
}
.cta h2{
  font-family:'Fraunces',serif;
  font-weight:500;
  font-size:clamp(2.1rem,4.4vw,3.35rem);
  letter-spacing:-.02em;
  margin-bottom:18px;
  line-height:1.12;
}
.cta p{
  max-width:620px;
  margin:0 auto 38px;
  color:var(--muted);
  font-size:1.02rem;
  line-height:1.7;
}
.cta-buttons{
  display:flex;
  gap:14px;
  justify-content:center;
  flex-wrap:wrap;
}
.cta-contact-btn{
  min-width:245px;
  justify-content:center;
  padding:16px 24px;
  border-radius:14px;
}
.cta-contact-btn .cta-icon{
  display:grid;
  place-items:center;
  width:28px;height:28px;
  border:1px solid currentColor;
  border-radius:50%;
  font-size:.75rem;
}
.cta-contact-btn .cta-copy{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
}
.cta-contact-btn .cta-copy small{
  font-family:'Inter',sans-serif;
  font-size:.68rem;
  letter-spacing:.02em;
  opacity:.72;
}

/* ==========================================================================
   DIGIDWAR INNER PAGES & INTERACTIVE FORMS ENHANCEMENTS
   ========================================================================== */

/* Navigation Active State */
.nav-links > a.active, .services-trigger.active, .audit-nav-link.active {
  opacity: 1 !important;
  color: var(--paper) !important;
}
.nav-links > a.active::after, .services-trigger.active::after {
  transform: scaleX(1) !important;
}

/* Inner Page Hero */
.inner-hero {
  padding: 150px 6vw 70px;
  position: relative;
  text-align: center;
  border-bottom: 1px solid var(--line);
  background: radial-gradient(circle at 50% 10%, rgba(108, 92, 231, 0.18), transparent 70%);
}
.inner-hero-content {
  max-width: 860px;
  margin: 0 auto;
}
.inner-hero h1 {
  font-family: 'Fraunces', serif;
  font-size: clamp(2.4rem, 5vw, 4.2rem);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -0.03em;
  margin: 18px 0;
}
.inner-hero h1 span {
  background: var(--grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.inner-hero p {
  color: var(--muted);
  font-size: 1.15rem;
  line-height: 1.7;
  max-width: 680px;
  margin: 0 auto 30px;
}

/* Quick Service Jump Pills */
.service-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  margin-top: 24px;
}
.service-pills .pill {
  padding: 8px 16px;
  background: rgba(8, 6, 14, 0.6);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.74rem;
  text-decoration: none;
  transition: all 0.25s ease;
}
.service-pills .pill:hover {
  background: rgba(108, 92, 231, 0.2);
  border-color: var(--cyan);
  color: var(--paper);
  transform: translateY(-2px);
}

/* Service Detail Sections */
.service-detail-section {
  padding: 90px 6vw;
  border-bottom: 1px solid var(--line);
  scroll-margin-top: 90px;
}
.service-detail-section.alt-bg {
  background: rgba(8, 6, 14, 0.35);
}
.service-detail-inner {
  max-width: 1180px;
  margin: 0 auto;
}
.service-detail-header {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 20px;
}
.service-num-badge {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: var(--grad);
  color: var(--ink);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 1.2rem;
  font-weight: 700;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.service-sublabel {
  display: block;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.72rem;
  color: var(--cyan);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.service-detail-header h2 {
  font-family: 'Fraunces', serif;
  font-size: clamp(1.8rem, 3.5vw, 2.7rem);
  font-weight: 500;
  letter-spacing: -0.02em;
  margin: 0;
}
.service-lead {
  font-size: 1.15rem;
  color: #d6cee0;
  line-height: 1.7;
  max-width: 860px;
  margin-bottom: 40px;
}
.service-specs-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 30px;
  margin-bottom: 40px;
}
.spec-card {
  background: rgba(18, 10, 28, 0.6);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 32px;
  backdrop-filter: blur(16px);
}
.spec-card h3,
.spec-card h4 {
  font-family: 'Fraunces', serif;
  font-size: 1.15rem;
  font-weight: 500;
  margin-bottom: 18px;
  color: var(--paper);
}
.spec-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.spec-card ul li {
  position: relative;
  padding-left: 24px;
  margin-bottom: 14px;
  color: var(--muted);
  line-height: 1.6;
  font-size: 0.95rem;
}
.spec-card ul li::before {
  content: "\2713";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--cyan);
  font-weight: bold;
}
.spec-card p {
  color: var(--muted);
  line-height: 1.65;
  font-size: 0.95rem;
}
.tech-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}
.tech-tags span {
  padding: 5px 12px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--line);
  border-radius: 6px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.72rem;
  color: #ddd;
}
.service-action-bar {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

/* About Us Pillars */
.about-pillars {
  padding: 100px 6vw;
  border-top: 1px solid var(--line);
}
.pillars-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 48px;
}
.pillar-card {
  background: rgba(18, 10, 28, 0.5);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 38px;
  position: relative;
  overflow: hidden;
  transition: transform 0.25s ease, border-color 0.25s ease;
}
.pillar-card:hover {
  transform: translateY(-4px);
  border-color: rgba(245, 243, 242, 0.3);
}
.pillar-num {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.8rem;
  color: var(--cyan);
  margin-bottom: 16px;
}
.pillar-card h3 {
  font-family: 'Fraunces', serif;
  font-size: 1.45rem;
  font-weight: 500;
  margin-bottom: 14px;
}
.pillar-card p {
  color: var(--muted);
  line-height: 1.7;
  font-size: 0.95rem;
  margin: 0;
}

/* Contact & Audit Layout */
.contact-section {
  padding: 80px 6vw 120px;
}
.contact-grid {
  max-width: 1180px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 50px;
  align-items: start;
}
.info-card {
  background: rgba(18, 10, 28, 0.6);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 36px;
  backdrop-filter: blur(16px);
}
.info-kicker {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.72rem;
  color: var(--cyan);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  display: block;
  margin-bottom: 8px;
}
.info-card h2 {
  font-family: 'Fraunces', serif;
  font-size: 1.6rem;
  margin-bottom: 14px;
}
.contact-methods {
  display: flex;
  flex-direction: column;
  gap: 22px;
  margin-top: 28px;
}
.method-item {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.method-icon {
  font-size: 1.4rem;
  line-height: 1;
}
.method-item strong {
  display: block;
  font-size: 0.85rem;
  color: var(--muted);
  margin-bottom: 3px;
}
.method-item a {
  color: var(--paper);
  text-decoration: none;
  font-size: 1.05rem;
  transition: color 0.2s;
}
.method-item a:hover {
  color: var(--cyan);
}
.next-steps-list {
  list-style: none;
  padding: 0;
  margin: 18px 0 0;
}
.next-steps-list li {
  margin-bottom: 14px;
  color: var(--muted);
  line-height: 1.55;
  font-size: 0.92rem;
}
.next-steps-list strong {
  color: var(--paper);
}

/* Contact Form */
.contact-form-card {
  background: rgba(18, 10, 28, 0.75);
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 44px;
  backdrop-filter: blur(20px);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.3);
}
.contact-form-card h2 {
  font-family: 'Fraunces', serif;
  font-size: 1.85rem;
  margin-bottom: 8px;
}
.digidwar-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.form-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.form-group label {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.76rem;
  color: #bbb;
  letter-spacing: 0.04em;
}
.form-group input,
.form-group select,
.form-group textarea {
  width: 100%;
  padding: 14px 16px;
  background: rgba(8, 6, 14, 0.6);
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--paper);
  font-family: 'Inter', sans-serif;
  font-size: 0.95rem;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  outline: none;
  border-color: var(--cyan);
  box-shadow: 0 0 0 2px rgba(51, 214, 232, 0.2);
}
.form-group select {
  cursor: pointer;
}
.form-group select option {
  background: #120A1C;
  color: #fff;
}
.btn-block {
  width: 100%;
  padding: 16px;
  font-size: 1rem;
  justify-content: center;
  cursor: pointer;
}
.privacy-note {
  font-size: 0.78rem;
  color: var(--muted);
  text-align: center;
  margin: 8px 0 0;
}

/* Alerts */
.alert {
  padding: 16px 20px;
  border-radius: 10px;
  margin-bottom: 24px;
  font-size: 0.92rem;
  line-height: 1.5;
}
.alert-success {
  background: rgba(16, 185, 129, 0.15);
  border: 1px solid rgba(16, 185, 129, 0.4);
  color: #6ee7b7;
}
.alert-danger {
  background: rgba(239, 68, 68, 0.15);
  border: 1px solid rgba(239, 68, 68, 0.4);
  color: #fca5a5;
}
.alert-danger ul {
  margin: 8px 0 0 20px;
  padding: 0;
}

/* SEO Audit Points List */
.audit-points-list {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.audit-point-item {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.audit-num {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.85rem;
  color: var(--cyan);
  background: rgba(51, 214, 232, 0.1);
  padding: 4px 8px;
  border-radius: 6px;
  flex-shrink: 0;
}
.audit-point-item strong {
  display: block;
  font-size: 0.98rem;
  color: var(--paper);
  margin-bottom: 4px;
}
.audit-point-item p {
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.5;
  margin: 0;
}

/* Case Studies / Work */
.case-study-cards {
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.case-study-card {
  background: rgba(18, 10, 28, 0.6);
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 48px;
  backdrop-filter: blur(16px);
  position: relative;
  overflow: hidden;
}
.case-badge {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.72rem;
  color: var(--cyan);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 12px;
}
.case-study-card h2 {
  font-family: 'Fraunces', serif;
  font-size: clamp(1.8rem, 3vw, 2.5rem);
  font-weight: 500;
  letter-spacing: -0.02em;
  margin: 0 0 14px;
}
.case-intro {
  font-size: 1.1rem;
  color: var(--muted);
  line-height: 1.65;
  max-width: 820px;
  margin-bottom: 34px;
}
.case-details-grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr 0.8fr;
  gap: 30px;
  padding: 30px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  margin-bottom: 28px;
}
.case-col h4 {
  font-family: 'Fraunces', serif;
  font-size: 1.1rem;
  font-weight: 500;
  margin-bottom: 12px;
}
.case-col p {
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.6;
}
.case-col ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.case-col ul li {
  position: relative;
  padding-left: 20px;
  margin-bottom: 10px;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.5;
}
.case-col ul li::before {
  content: '→';
  position: absolute;
  left: 0;
  color: var(--cyan);
}
.highlight-col {
  background: rgba(108, 92, 231, 0.12);
  border: 1px solid rgba(108, 92, 231, 0.3);
  border-radius: 14px;
  padding: 22px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
}
.metric-box {
  display: flex;
  flex-direction: column;
}
.metric-val {
  font-family: 'Fraunces', serif;
  font-size: 2.2rem;
  font-weight: 700;
  color: var(--cyan);
  line-height: 1;
}
.metric-lbl {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.72rem;
  color: var(--paper);
  text-transform: uppercase;
  margin-top: 4px;
}
.case-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.case-tags span {
  padding: 6px 14px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--line);
  border-radius: 999px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.72rem;
  color: #ccc;
}

/* Responsive Overrides */
@media (max-width: 980px) {
  .service-specs-grid,
  .pillars-grid,
  .contact-grid,
  .case-details-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .form-row {
    grid-template-columns: 1fr;
  }
}

/* Left-align the About page service summary */
.dd-about-summary .stat {
  align-items: flex-start;
  text-align: left;
}

.dd-about-summary .stat-num {
  justify-content: flex-start;
}

.dd-about-summary .stat-label {
  text-align: left;
}
/* Centre the About page service summary */
.stat-bar.dd-about-summary .stat {
  align-items: center;
  text-align: center;
}

.stat-bar.dd-about-summary .stat-num {
  justify-content: center;
  text-align: center;
}

.stat-bar.dd-about-summary .stat-label {
  width: 100%;
  text-align: center;
}
/* Centre the complete About summary row */
#primary .stat-bar.dd-about-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  width: 100%;
  max-width: 1200px;
  margin: 60px auto !important;
  padding: 0 24px;
  box-sizing: border-box;
  float: none;
}

#primary .dd-about-summary .stat {
  width: auto;
  min-width: 0;
  align-items: center;
  text-align: center;
}

@media (max-width: 768px) {
  #primary .stat-bar.dd-about-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 380px) {
  #primary .stat-bar.dd-about-summary {
    grid-template-columns: 1fr;
  }
}
/* Use the normal mouse pointer */
.cursor-dot,
.cursor-ring {
  display: none !important;
}

body {
  cursor: auto !important;
}

a,
button,
.btn,
.faq-q,
.hero-arrow {
  cursor: pointer !important;
}

/* DigiDwar: improve About and Services section alignment */

#about .about-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
  align-items: start;
  gap: clamp(32px, 6vw, 100px);
}

#about .about-grid > div,
#about .about-col {
  min-width: 0;
}

#about .about-col p:first-child {
  margin-top: 0;
}

#about .about-col p:last-child {
  margin-bottom: 0;
}

#services .services-panel-inner {
  display: block;
  width: min(100% - 48px, 1240px);
  margin-inline: auto;
}

#services .panel-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
  align-items: start;
  gap: clamp(32px, 6vw, 100px);
  margin-bottom: 40px;
}

#services .panel-head h2 {
  margin-top: 0;
  max-width: 650px;
}

#services .panel-head p {
  margin-top: 0;
  max-width: 560px;
}

@media (max-width: 760px) {
  #about .about-grid,
  #services .panel-head {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
  }

  #services .services-panel-inner {
    width: min(100% - 36px, 1240px);
  }

  #services .panel-head {
    margin-bottom: 28px;
  }
}


/* DigiDwar hero slider: mobile responsive alignment */
@media (max-width: 760px) {

  #heroSlider {
    overflow: hidden;
  }

  #heroSlider .hero-slides {
    width: 100%;
    min-width: 0;
  }

  #heroSlider .hero-slide {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
    padding: 72px 22px 90px;
    box-sizing: border-box;
    min-width: 0;
  }

  #heroSlider .hero-copy {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    text-align: left;
  }

  #heroSlider .hero-copy h1,
  #heroSlider .hero-copy h2 {
    font-size: clamp(34px, 9vw, 48px);
    line-height: 1.08;
    overflow-wrap: anywhere;
  }

  #heroSlider .hero-copy p {
    font-size: 16px;
    line-height: 1.65;
    overflow-wrap: anywhere;
  }

  #heroSlider .hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
  }

  #heroSlider .hero-visual,
  #heroSlider .hero-services-visual,
  #heroSlider .brands-visual {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
    box-sizing: border-box;
  }

  #heroSlider .hero-services-visual {
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  #heroSlider .hero-service-line {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 6px 10px;
    width: 100%;
    padding: 12px 0;
    box-sizing: border-box;
  }

  #heroSlider .hero-service-line b {
    grid-row: span 2;
  }

  #heroSlider .hero-service-line span,
  #heroSlider .hero-service-line small {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  #heroSlider .brands-visual {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  #heroSlider .hero-brand-card {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 12px;
    width: 100%;
    box-sizing: border-box;
    padding: 14px;
  }

  #heroSlider .hero-brand-copy {
    min-width: 0;
  }

  #heroSlider .hero-brand-copy strong,
  #heroSlider .hero-brand-copy p {
    overflow-wrap: anywhere;
  }

  #heroSlider .hero-arrow {
    z-index: 20;
    touch-action: manipulation;
  }

  #heroSlider .hero-count {
    z-index: 20;
  }
}

/* DigiDwar mobile slider layout correction */
@media (max-width: 760px) {
  .scrollytell,
  .scrollytell .stage {
    height: auto !important;
    min-height: 0 !important;
  }

  .scrollytell .stage {
    padding: 88px 0 50px !important;
    overflow: hidden;
  }

  .reference-hero,
  .hero-slides {
    width: 100% !important;
    min-height: 0 !important;
  }

  .hero-slide {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    gap: 24px !important;
    padding: 42px 22px 76px !important;
    box-sizing: border-box;
  }

  .hero-slide.active {
    position: relative !important;
    inset: auto !important;
  }

  .hero-copy {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    text-align: left !important;
  }

  .hero-copy h1,
  .hero-copy h2 {
    font-size: clamp(30px, 8vw, 42px) !important;
    line-height: 1.12 !important;
    overflow-wrap: normal !important;
  }

  .hero-copy > p {
    max-width: 100% !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
    margin: 18px 0 0 !important;
  }

  .hero-actions {
    justify-content: flex-start !important;
    margin-top: 24px !important;
  }

  .hero-visual {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 200px !important;
  }
}  

/* DigiDwar: restore desktop hero slider alignment */
@media (min-width: 761px) {
  .scrollytell .stage {
    min-height: 760px !important;
    padding: 118px 6vw 70px !important;
    display: block !important;
  }

  .reference-hero {
    width: min(1280px, 100%) !important;
    min-height: 570px !important;
    display: flex !important;
    align-items: center !important;
    margin: 0 auto !important;
  }

  .hero-slides {
    position: relative !important;
    width: 100% !important;
    min-height: 570px !important;
  }

  .hero-slide {
    position: absolute !important;
    inset: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr) !important;
    grid-template-rows: auto !important;
    align-items: center !important;
    gap: 48px !important;
    padding: 34px 70px !important;
    box-sizing: border-box !important;
  }

  .hero-slide.active {
    position: absolute !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateX(0) !important;
  }

  .hero-copy {
    width: 100% !important;
    max-width: 610px !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    text-align: left !important;
  }

  .hero-copy h1,
  .hero-copy h2 {
    font-size: clamp(2.4rem, 4.2vw, 4.2rem) !important;
    line-height: 1.08 !important;
  }

  .hero-copy > p {
    margin: 24px 0 0 !important;
    max-width: 52ch !important;
    line-height: 1.7 !important;
  }

  .hero-actions {
    justify-content: flex-start !important;
  }

  .hero-visual {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 400px !important;
  }
}

/* Fix only the services slide on desktop */
@media (min-width: 1100px) {
  #heroSlider .hero-slide[data-slide="1"] {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) !important;
    gap: 32px !important;
  }

  #heroSlider .hero-slide[data-slide="1"] > .hero-visual.hero-services-visual {
    width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
  }

  #heroSlider .hero-slide[data-slide="1"] .hero-service-line {
    display: grid !important;
    grid-template-columns: 30px minmax(0, 1fr) !important;
    gap: 8px 12px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  #heroSlider .hero-slide[data-slide="1"] .hero-service-line small {
    grid-column: 2 !important;
    text-align: left !important;
  }
}
.review-slot[hidden] {
  display: none !important;
}
/* About page team */
.dd-team {
  padding: 60px 6vw;
}

.dd-team-inner {
  max-width: 1080px;
  margin: 0 auto;
}

.dd-team-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.dd-team-card {
  padding: 32px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(8, 6, 14, 0.42);
}

.dd-team-card h3 {
  margin-bottom: 10px;
  color: var(--paper);
  font-size: 1.4rem;
  line-height: 1.3;
}

.dd-team-card p {
  color: var(--muted);
  font-size: 1rem;
  line-height: 1.7;
}

.dd-team-card .dd-team-role {
  margin-bottom: 16px;
  color: var(--cyan);
  font-weight: 600;
}

@media (max-width: 640px) {
  .dd-team-grid {
    grid-template-columns: 1fr;
  }

  .dd-team-card {
    padding: 24px;
  }
}
.about-col .dd-about-clients p strong {
  display: inline;
  color: #ffffff;
  font-weight: 600;
}
/* Pause decorative animations on mobile */
@media (max-width: 760px) {
  .scrollytell .orb,
  .antigravity-bubble,
  .antigravity-bubble::before,
  .antigravity-bubble::after,
  .bubble-glow {
    animation: none !important;
  }
}