
    :root{
      --bg:#272731;
      --bg-elev:#111114;
      --bg-elev-2:#17171b;
      --border:rgba(245,243,239,0.10);
      --border-strong:rgba(245,243,239,0.20);
      --text:#f5f3ef;
      --text-dim:#93939c;
      --text-faint:#57575f;
      --accent:#3ee8c8;
      --accent-dim:rgba(62,232,200,0.12);
      --accent-line:rgba(62,232,200,0.35);
      --mono:'JetBrains Mono', monospace;
      --display:'Space Grotesk', sans-serif;
      --body:'Inter', sans-serif;
    }
    *{margin:0;padding:0;box-sizing:border-box;}
    html{scroll-behavior:smooth;}
    body{
      background:var(--bg);
      color:var(--text);
      font-family:var(--body);
      line-height:1.5;
      -webkit-font-smoothing:antialiased;
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none;}
    ::selection{background:var(--accent);color:#08110f;}

    /* background grid texture */
    .grid-bg{
      position:fixed;inset:0;pointer-events:none;z-index:0;
      background-image:
        linear-gradient(var(--border) 1px, transparent 1px),
        linear-gradient(90deg, var(--border) 1px, transparent 1px);
      background-size:64px 64px;
      opacity:0.35;
      mask-image:radial-gradient(ellipse 80% 60% at 50% 0%, black 30%, transparent 75%);
    }

    .wrap{max-width:1180px;margin:0 auto;padding:0 32px;position:relative;z-index:1;}
    @media(max-width:640px){.wrap{padding:0 20px;}}

    .eyebrow{
      font-family:var(--mono);
      font-size:12px;
      letter-spacing:0.14em;
      text-transform:uppercase;
      color:var(--accent);
      display:flex;align-items:center;gap:10px;
      margin-bottom:20px;
    }
    .eyebrow::before{
      content:'';width:16px;height:1px;background:var(--accent);
    }

    h1,h2,h3{font-family:var(--display);font-weight:600;letter-spacing:-0.02em;color:var(--text);}

    /* ===== NAV ===== */
    header{
      position:fixed;top:0;left:0;right:0;z-index:100;
      background:rgba(10,10,12,0.72);
      backdrop-filter:blur(14px);
      border-bottom:1px solid var(--border);
    }
    nav{
      max-width:1180px;margin:0 auto;padding:0 32px;
      height:72px;display:flex;align-items:center;justify-content:space-between;
    }
    @media(max-width:640px){nav{padding:0 20px;}}
    .logo{
      font-family:var(--body);font-weight:500;font-size:16px;
      letter-spacing:-0.06em;
    }
    .logo span{color:var(--accent);}
    .nav-links{display:flex;align-items:center;gap:40px;}
    .nav-links a{
      font-size:14px;color:var(--text-dim);transition:color 0.2s ease;
      position:relative;
    }
    .nav-links a:hover{color:var(--text);}
    .nav-cta{
      font-family:var(--mono);font-size:13px;
      border:1px solid var(--border-strong);
      padding:10px 18px;border-radius:2px;
      display:flex;align-items:center;gap:8px;
      transition:all 0.2s ease;
    }
    .nav-cta:hover{border-color:var(--accent);color:var(--accent);}
    .nav-mid{display:flex;align-items:center;gap:40px;}
    .menu-btn{display:none;background:none;border:none;color:var(--text);cursor:pointer;font-family:var(--mono);font-size:13px;gap:8px;align-items:center;}
    @media(max-width:860px){
      .nav-mid .nav-links{display:none;}
      .menu-btn{display:flex;}
      .nav-cta{display:none;}
    }
    .mobile-panel{
      display:none;position:fixed;top:72px;left:0;right:0;bottom:0;
      background:var(--bg);z-index:99;border-top:1px solid var(--border);
      flex-direction:column;padding:40px 20px;gap:28px;
    }
    .mobile-panel.open{display:flex;}
    .mobile-panel a{font-family:var(--display);font-size:28px;}
    .mobile-panel .nav-cta{display:inline-flex;width:fit-content;margin-top:12px;}

    /* ===== HERO ===== */
    .hero{
      padding:200px 0 120px;position:relative;
    }
    .hero-headline{
      font-size:clamp(38px, 6.4vw, 78px);
      line-height:1.04;
      max-width:920px;
      margin-bottom:28px;
    }
    .hero-headline em{
      font-style:normal;color:var(--accent);
    }
    .hero-sub{
      font-size:18px;color:var(--text-dim);max-width:560px;margin-bottom:44px;line-height:1.65;
    }
    .btn-row{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:88px;}
    .btn{
      font-family:var(--mono);font-size:14px;padding:15px 26px;border-radius:2px;
      display:inline-flex;align-items:center;gap:10px;transition:all 0.2s ease;
      cursor:pointer;
    }
    .btn-primary{background:var(--accent);color:#07130f;font-weight:500;}
    .btn-primary:hover{background:#5cf0d4;transform:translateY(-1px);}
    .btn-secondary{border:1px solid var(--border-strong);color:var(--text);}
    .btn-secondary:hover{border-color:var(--text-dim);}

    .mock-frame{
      position:relative;border:1px solid var(--border-strong);
      border-radius:6px;overflow:hidden;background:var(--bg-elev);
      box-shadow:0 60px 120px -40px rgba(0,0,0,0.7);
    }
    .mock-topbar{
      display:flex;align-items:center;gap:8px;padding:14px 18px;
      border-bottom:1px solid var(--border);
    }
    .mock-dot{width:8px;height:8px;border-radius:50%;background:var(--border-strong);}
    .mock-topbar span{
      font-family:var(--mono);font-size:11px;color:var(--text-faint);margin-left:12px;
    }
    .mock-body{display:grid;grid-template-columns:180px 1fr;min-height:340px;}
    @media(max-width:640px){.mock-body{grid-template-columns:1fr;}}
    .mock-side{border-right:1px solid var(--border);padding:20px 16px;display:flex;flex-direction:column;gap:10px;}
    @media(max-width:640px){.mock-side{display:none;}}
    .mock-side .bar{height:8px;background:var(--bg-elev-2);border-radius:2px;}
    .mock-side .bar.short{width:60%;}
    .mock-side .bar.accent{background:var(--accent-dim);border:1px solid var(--accent-line);}
    .mock-main{padding:24px;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
    @media(max-width:640px){.mock-main{grid-template-columns:1fr 1fr;padding:16px;}}
    .mock-card{
      border:1px solid var(--border);border-radius:4px;padding:16px;
      display:flex;flex-direction:column;gap:10px;min-height:120px;
    }
    .mock-card .cbar{height:6px;background:var(--bg-elev-2);border-radius:2px;}
    .mock-card .cbar.w60{width:60%;}
    .mock-card .cbar.w40{width:40%;}
    .mock-card .cnum{font-family:var(--mono);font-size:20px;color:var(--accent);margin-top:auto;}
    .mock-card.wide{grid-column:span 2;}
    @media(max-width:640px){.mock-card.wide{grid-column:span 2;}}

    section{padding:120px 0;border-top:1px solid var(--border);position:relative;}
    .section-head{max-width:640px;margin-bottom:64px;}
    .section-head h2{font-size:clamp(28px,4vw,44px);line-height:1.1;}

    /* ===== PROBLEM ===== */
    .problem-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);}
    @media(max-width:800px){.problem-grid{grid-template-columns:1fr;}}
    .problem-card{background:var(--bg);padding:40px 32px;}
    .problem-num{font-family:var(--mono);color:var(--accent);font-size:13px;margin-bottom:24px;display:block;}
    .problem-card h3{font-size:20px;margin-bottom:12px;font-weight:600;}
    .problem-card p{color:var(--text-dim);font-size:15px;line-height:1.65;}
    .problem-close{
      margin-top:56px;font-family:var(--display);font-size:22px;color:var(--text);
      display:flex;align-items:center;gap:14px;
    }
    .problem-close::before{content:'';width:36px;height:1px;background:var(--accent);}

    /* ===== SERVICES ===== */
    .services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
    @media(max-width:900px){.services-grid{grid-template-columns:1fr;}}
    .service-card{
      border:1px solid var(--border);border-radius:6px;padding:36px 30px;
      transition:border-color 0.25s ease, transform 0.25s ease;
      display:flex;flex-direction:column;min-height:280px;
    }
    .service-card:hover{border-color:var(--accent-line);transform:translateY(-4px);}
    .service-tag{font-family:var(--mono);font-size:12px;color:var(--text-faint);letter-spacing:0.08em;margin-bottom:28px;}
    .service-card h3{font-size:22px;margin-bottom:14px;line-height:1.25;}
    .service-card p{color:var(--text-dim);font-size:14.5px;line-height:1.6;margin-bottom:28px;flex-grow:1;}
    .service-link{font-family:var(--mono);font-size:13px;color:var(--accent);display:inline-flex;align-items:center;gap:8px;}

    /* ===== DIFFERENTIATOR ===== */
    .diff-section{background:var(--bg-elev);}
    .diff-head{text-align:center;max-width:720px;margin:0 auto 72px;}
    .diff-head h2{font-size:clamp(30px,5vw,50px);}
    .diff-row{
      display:flex;align-items:center;justify-content:center;gap:0;flex-wrap:wrap;
      margin-bottom:72px;
    }
    .diff-stat{
      text-align:center;padding:0 40px;
      display:flex;flex-direction:column;align-items:center;gap:8px;
    }
    .diff-stat .num{font-family:var(--display);font-size:44px;color:var(--accent);font-weight:700;}
    .diff-stat .label{font-family:var(--mono);font-size:11px;color:var(--text-dim);letter-spacing:0.1em;text-align:center;line-height:1.6;}
    .diff-plus{font-family:var(--mono);font-size:22px;color:var(--text-faint);}
    @media(max-width:760px){.diff-plus{display:none;}.diff-stat{padding:16px 20px;}}
    .diff-copy{max-width:640px;margin:0 auto;text-align:center;font-size:19px;color:var(--text-dim);line-height:1.7;}
    .diff-copy strong{color:var(--text);font-weight:600;}

    /* ===== WORK ===== */
    .case{
      display:grid;grid-template-columns:0.9fr 1.1fr;gap:56px;align-items:center;
      padding:56px 0;border-top:1px solid var(--border);
    }
    .case:first-of-type{border-top:none;}
    @media(max-width:860px){.case{grid-template-columns:1fr;gap:28px;}}
    .case-visual .mock-frame{box-shadow:none;}
    .case-num{font-family:var(--mono);font-size:13px;color:var(--accent);margin-bottom:20px;}
    .case-info h3{font-size:26px;margin-bottom:14px;}
    .case-tags{font-family:var(--mono);font-size:12px;color:var(--text-faint);letter-spacing:0.06em;margin-bottom:18px;}
    .case-info p{color:var(--text-dim);font-size:15px;line-height:1.65;margin-bottom:24px;max-width:440px;}
    .case-link{font-family:var(--mono);font-size:13px;color:var(--text);display:inline-flex;gap:8px;border-bottom:1px solid var(--border-strong);padding-bottom:4px;transition:border-color 0.2s;}
    .case-link:hover{border-color:var(--accent);color:var(--accent);}

    /* ===== AGENCY ===== */
    .agency{background:var(--bg-elev);}
    .agency-top{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:end;margin-bottom:64px;}
    @media(max-width:800px){.agency-top{grid-template-columns:1fr;gap:24px;}}
    .agency-top h2{font-size:clamp(28px,4vw,42px);}
    .agency-top p{color:var(--text-dim);font-size:17px;line-height:1.7;}
    .agency-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);margin-bottom:48px;}
    @media(max-width:800px){.agency-cols{grid-template-columns:1fr;}}
    .agency-col{background:var(--bg-elev);padding:32px 28px;}
    .agency-col h4{font-family:var(--mono);font-size:14px;color:var(--accent);margin-bottom:12px;letter-spacing:0.04em;}
    .agency-col p{color:var(--text-dim);font-size:14.5px;line-height:1.6;}

    /* ===== PROCESS ===== */
    .process-list{border-top:1px solid var(--border);}
    .process-item{
      display:grid;grid-template-columns:90px 1fr;gap:32px;
      padding:28px 0;border-bottom:1px solid var(--border);
      align-items:baseline;
    }
    .process-item .pnum{font-family:var(--mono);color:var(--accent);font-size:14px;}
    .process-item h3{font-size:19px;margin-bottom:6px;}
    .process-item p{color:var(--text-dim);font-size:14.5px;}

    /* ===== ABOUT ===== */
    .about-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;}
    @media(max-width:800px){.about-grid{grid-template-columns:1fr;gap:40px;}}
    .about-copy h2{font-size:clamp(26px,3.6vw,36px);margin-bottom:20px;line-height:1.2;}
    .about-copy p{color:var(--text-dim);font-size:16px;line-height:1.75;}
    .cap-block{margin-bottom:28px;}
    .cap-block:last-child{margin-bottom:0;}
    .cap-title{font-family:var(--mono);font-size:12px;color:var(--text-faint);letter-spacing:0.1em;margin-bottom:14px;}
    .cap-title.primary{color:var(--accent);}
    .cap-tags{display:flex;flex-wrap:wrap;gap:8px;}
    .cap-tag{
      font-family:var(--mono);font-size:12.5px;border:1px solid var(--border);
      padding:7px 12px;border-radius:2px;color:var(--text-dim);
    }
    .cap-block.primary .cap-tag{border-color:var(--accent-line);color:var(--text);background:var(--accent-dim);}

    /* ===== FINAL CTA ===== */
    .final-cta{
      text-align:center;padding:160px 0;background:var(--bg-elev);
    }
    .final-cta h2{font-size:clamp(32px,6vw,60px);line-height:1.1;max-width:820px;margin:0 auto 44px;}
    .final-cta .tags{font-family:var(--mono);font-size:12.5px;color:var(--text-faint);margin-top:36px;letter-spacing:0.06em;}

    /* ===== CONTACT ===== */
    .contact-grid{display:grid;grid-template-columns:0.8fr 1.2fr;gap:64px;}
    @media(max-width:800px){.contact-grid{grid-template-columns:1fr;gap:36px;}}
    .contact-side h2{font-size:clamp(26px,3.6vw,36px);margin-bottom:16px;}
    .contact-side p{color:var(--text-dim);font-size:15.5px;line-height:1.7;}
    form{display:flex;flex-direction:column;gap:24px;}
    .form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
    @media(max-width:560px){.form-row{grid-template-columns:1fr;}}
    .field{display:flex;flex-direction:column;gap:8px;}
    .field label{font-family:var(--mono);font-size:12px;color:var(--text-faint);letter-spacing:0.06em;text-transform:uppercase;}
    .field input, .field textarea, .field select{
      background:transparent;border:none;border-bottom:1px solid var(--border-strong);
      color:var(--text);font-family:var(--body);font-size:15px;padding:10px 2px;
      transition:border-color 0.2s ease;
    }
    .field select option{background:var(--bg-elev);}
    .field input:focus, .field textarea:focus, .field select:focus{
      outline:none;border-color:var(--accent);
    }
    .chip-group{display:flex;flex-wrap:wrap;gap:10px;}
    .chip{
      font-family:var(--mono);font-size:12.5px;border:1px solid var(--border-strong);
      padding:9px 14px;border-radius:20px;cursor:pointer;color:var(--text-dim);
      transition:all 0.2s ease;user-select:none;
    }
    .chip.active{border-color:var(--accent);color:var(--accent);background:var(--accent-dim);}
    .field textarea{resize:vertical;min-height:90px;border:1px solid var(--border-strong);padding:12px;}
    .submit-row{margin-top:12px;}
    .btn-submit{
      font-family:var(--mono);font-size:14px;background:var(--accent);color:#07130f;
      padding:16px 30px;border:none;border-radius:2px;cursor:pointer;font-weight:500;
      display:inline-flex;align-items:center;gap:10px;transition:all 0.2s ease;
    }
    .btn-submit:hover{background:#5cf0d4;transform:translateY(-1px);}

    /* ===== FOOTER ===== */
    footer{
      border-top:1px solid var(--border);
      background:#0d0d10;
      padding:72px 0 24px;
    }
    .footer-grid{
      display:grid;
      grid-template-columns:1.55fr 1fr 1fr 1fr;
      gap:52px;
      padding-bottom:56px;
    }
    .footer-brand .logo{
      font-family:var(--body);font-weight:500;font-size:16px;letter-spacing:-0.06em;
      display:inline-block;
      margin-bottom:18px;
    }
    .footer-brand .footer-partner{
      color:var(--text);
      font-family:var(--display);
      font-size:17px;
      line-height:1.4;
      max-width:310px;
      margin-bottom:14px;
    }
    .footer-brand .footer-description{
      color:var(--text-dim);
      font-size:13.5px;
      line-height:1.65;
      max-width:340px;
      margin-bottom:20px;
    }
    .footer-location{
      font-family:var(--mono);
      font-size:11px;
      color:var(--text-faint);
      letter-spacing:.04em;
    }
    .footer-col h4{
      font-family:var(--mono);
      font-size:11px;
      color:var(--text-faint);
      letter-spacing:.12em;
      margin-bottom:18px;
    }
    .footer-links{
      display:flex;
      flex-direction:column;
      gap:11px;
    }
    .footer-links a{
      font-size:13.5px;
      color:var(--text-dim);
      transition:color .2s ease;
    }
    .footer-links a:hover{
      color:var(--text);
    }
    .footer-talk{
      display:flex;
      flex-direction:column;
      gap:12px;
    }
    .footer-talk .footer-cta{
      font-family:var(--mono);
      font-size:13px;
      color:var(--accent);
      display:inline-flex;
      align-items:center;
      gap:8px;
      margin-bottom:4px;
    }
    .footer-email{
      font-family:var(--mono);
      font-size:12px;
      color:var(--text-dim);
      word-break:break-word;
    }
    .footer-credibility{
      border-top:1px solid var(--border);
      border-bottom:1px solid var(--border);
      padding:28px 0;
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:32px;
    }
    .footer-cred h5{
      font-family:var(--mono);
      font-size:10px;
      color:var(--text-faint);
      letter-spacing:.12em;
      margin-bottom:8px;
    }
    .footer-cred p{
      font-family:var(--mono);
      font-size:11px;
      color:var(--text-dim);
      letter-spacing:.03em;
      line-height:1.7;
    }
    .footer-bottom{
      padding-top:26px;
      display:grid;
      grid-template-columns:1fr 1fr;
      align-items:start;
      gap:32px;
    }
    .footer-bottom-left p,
    .footer-legal,
    .footer-disclaimer{
      font-family:var(--mono);
      font-size:11px;
      color:var(--text-dim);
      line-height:1.7;
    }
    .footer-bottom-left .brand {
      font-family:var(--body);
      font-weight: 500;letter-spacing:-0.06em;
    }
    .footer-legal{
      display:flex;
      justify-content:flex-end;
      gap:20px;
      margin-bottom:7px;
    }
    .footer-legal a{
      color:var(--text-dim);
      transition:color .2s ease;
    }
    .footer-legal a:hover{
      color:var(--text);
    }
    .footer-disclaimer{
      text-align:right;
      max-width:none;
      color:var(--text-faint);
    }
    @media(max-width:680px){
      .footer-bottom{
        grid-template-columns:1fr;
        gap:16px;
      }
      .footer-legal{
        justify-content:flex-start;
      }
      .footer-disclaimer{
        text-align:left;
      }
    }
    @media(max-width:900px){
      .footer-grid{
        grid-template-columns:1.5fr 1fr 1fr;
      }
      .footer-brand{
        grid-column:1 / -1;
      }
    }
    @media(max-width:680px){
      footer{padding:56px 0 24px;}
      .footer-grid{
        grid-template-columns:1fr 1fr;
        gap:40px 28px;
        padding-bottom:48px;
      }
      .footer-brand{
        grid-column:1 / -1;
      }
      .footer-credibility{
        grid-template-columns:1fr;
        gap:24px;
      }
    }

    .reveal{opacity:0;transform:translateY(24px);transition:opacity 0.7s ease, transform 0.7s ease;}
    .reveal.in{opacity:1;transform:translateY(0);}

    @media (prefers-reduced-motion: reduce){
      *{transition:none !important; scroll-behavior:auto !important;}
      .reveal{opacity:1;transform:none;}
    }

    .service-hero{padding:170px 0 100px;border-top:none}
    .service-hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
    .service-hero h1{font-size:clamp(42px,5.8vw,72px);line-height:1.02;max-width:720px;margin-bottom:28px}
    .service-intro{font-size:18px;color:var(--text-dim);max-width:620px;line-height:1.7;margin-bottom:32px}
    .service-cred{font-family:var(--mono);font-size:11px;color:var(--text-faint);letter-spacing:.06em;margin-top:18px}
    .portal{border:1px solid var(--border-strong);border-radius:6px;overflow:hidden;background:var(--bg-elev);box-shadow:0 50px 100px -50px rgba(0,0,0,.8)}
    .portal-top{height:44px;display:flex;align-items:center;gap:7px;padding:0 15px;border-bottom:1px solid var(--border)}
    .dot{width:7px;height:7px;border-radius:50%;background:var(--border-strong)}
    .portal-url{margin-left:10px;font:9px var(--mono);color:var(--text-faint)}
    .portal-body{display:grid;grid-template-columns:145px 1fr;min-height:390px}
    .portal-side{padding:20px 14px;border-right:1px solid var(--border)}
    .portal-brand{height:11px;width:74px;background:var(--accent-dim);border:1px solid var(--accent-line);margin-bottom:28px}
    .portal-nav{display:flex;flex-direction:column;gap:12px}
    .portal-nav i{display:block;height:7px;width:80%;background:var(--bg-elev-2);border-radius:2px}
    .portal-nav i.active{width:92%;background:var(--accent-dim);border:1px solid var(--accent-line)}
    .portal-main{padding:22px}
    .line{height:7px;background:var(--bg-elev-2);border-radius:2px;margin-bottom:9px}
    .line.big{width:55%;height:10px}.line.mid{width:38%}.line.short{width:48%}
    .portal-cards{display:grid;grid-template-columns:1.4fr 1fr;gap:12px;margin-top:22px}
    .pcard{border:1px solid var(--border);border-radius:4px;padding:14px;min-height:105px}
    .pcard.large{grid-row:span 2;min-height:222px}
    .metric{font:28px var(--display);color:var(--accent);margin-top:22px}
    .bar{height:6px;background:var(--accent-dim);border:1px solid var(--accent-line);margin-top:34px;width:82%}
    .section{padding:110px 0;border-top:1px solid var(--border)}
    .section-head{max-width:720px;margin-bottom:54px}
    .section-head h2{font-size:clamp(30px,4vw,46px);line-height:1.08}
    .section-head p{color:var(--text-dim);font-size:16px;line-height:1.7;margin-top:16px}
    .problem-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--border);border:1px solid var(--border)}
    .problem-item{background:var(--bg);padding:25px 28px;display:flex;gap:14px;color:var(--text-dim);font-size:14.5px}
    .problem-item:before{content:"×";color:var(--accent);font-family:var(--mono)}
    .bridge{margin-top:36px;padding-left:20px;border-left:1px solid var(--accent-line);max-width:760px;color:var(--text);font-size:18px;line-height:1.7}
    .build-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .build-card{border:1px solid var(--border);border-radius:5px;padding:30px 26px;min-height:225px;display:flex;flex-direction:column}
    .build-card .num{font:11px var(--mono);color:var(--accent);margin-bottom:26px}
    .build-card h3{font-size:20px;margin-bottom:10px}.build-card p{color:var(--text-dim);font-size:14px;line-height:1.65;margin-top:auto}
    .agency{background:var(--bg-elev)}
    .agency-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:70px}
    .agency-grid h2{font-size:clamp(30px,4vw,44px);line-height:1.08}
    .agency-options{border-top:1px solid var(--border)}
    .agency-option{display:grid;grid-template-columns:180px 1fr;gap:28px;padding:24px 0;border-bottom:1px solid var(--border)}
    .agency-option h3{font:12px var(--mono);color:var(--accent)}.agency-option p{color:var(--text-dim);font-size:14.5px;line-height:1.6}
    .projects{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
    .project{border:1px solid var(--border);padding:17px;font:11.5px var(--mono);color:var(--text-dim);min-height:58px;display:flex;align-items:center}
    .case{display:grid;grid-template-columns:1.15fr .85fr;gap:64px;align-items:center}
    .case h2{font-size:clamp(28px,3.5vw,40px);margin-bottom:28px}
    .detail{border-top:1px solid var(--border);padding:16px 0}.detail strong{display:block;font:10px var(--mono);color:var(--text-faint);letter-spacing:.1em;margin-bottom:6px}.detail p{color:var(--text-dim);font-size:14px;line-height:1.55}
    .cta{text-align:center;background:var(--bg-elev);padding:120px 0;border-top:1px solid var(--border)}.cta h2{font-size:clamp(34px,5vw,58px);line-height:1.08;max-width:760px;margin:0 auto 18px}.cta p{color:var(--text-dim);margin-bottom:30px}
    @media(max-width:900px){.service-hero-grid,.agency-grid,.case{grid-template-columns:1fr;gap:45px}.build-grid{grid-template-columns:1fr 1fr}.projects{grid-template-columns:1fr 1fr}}
    @media(max-width:640px){.service-hero{padding:145px 0 80px}.problem-grid,.build-grid,.projects{grid-template-columns:1fr}.portal-body{grid-template-columns:105px 1fr;min-height:300px}.portal-side{padding:15px 9px}.portal-main{padding:15px}.agency-option{grid-template-columns:1fr;gap:8px}.section{padding:80px 0}.cta{padding:90px 0}}

    /* ===== LWC + SLDS TECHNICAL PAGE ===== */
    .tech-hero{padding:170px 0 110px;border-top:none}
    .tech-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
    .tech-hero h1{font-size:clamp(42px,5.7vw,72px);line-height:1.02;max-width:760px;margin-bottom:28px}
    .tech-intro{font-size:18px;color:var(--text-dim);max-width:650px;line-height:1.7;margin-bottom:32px}
    .tech-code-label{font:10px var(--mono);letter-spacing:.1em;color:var(--accent);margin-top:20px}

    .component-window{border:1px solid var(--border-strong);background:var(--bg-elev);border-radius:6px;overflow:hidden}
    .component-header{height:44px;border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 15px;gap:7px}
    .component-header .dot{width:7px;height:7px;border-radius:50%;background:var(--border-strong)}
    .component-header .label{margin-left:10px;font:9px var(--mono);color:var(--text-faint)}
    .component-content{padding:22px}
    .component-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}
    .component-title strong{font:12px var(--mono);color:var(--text-dim);letter-spacing:.04em}
    .component-title span{font:9px var(--mono);color:var(--accent);border:1px solid var(--accent-line);padding:5px 7px}
    .component-table{border:1px solid var(--border)}
    .table-head,.table-row{display:grid;grid-template-columns:1.2fr .8fr .7fr .5fr;gap:12px;padding:13px 12px}
    .table-head{font:9px var(--mono);color:var(--text-faint);border-bottom:1px solid var(--border);text-transform:uppercase}
    .table-row{font:10px var(--mono);color:var(--text-dim);border-bottom:1px solid var(--border)}
    .table-row:last-child{border-bottom:0}
    .status{color:var(--accent)}
    .component-footer{display:flex;justify-content:space-between;margin-top:18px;font:9px var(--mono);color:var(--text-faint)}

    .tech-section{padding:110px 0;border-top:1px solid var(--border)}
    .tech-head{max-width:720px;margin-bottom:54px}
    .tech-head h2{font-size:clamp(30px,4vw,46px);line-height:1.08}
    .tech-head p{color:var(--text-dim);font-size:16px;line-height:1.7;margin-top:16px}

    .tech-build-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .tech-build-card{border:1px solid var(--border);padding:30px 26px;min-height:220px;display:flex;flex-direction:column;border-radius:5px}
    .tech-build-card .num{font:11px var(--mono);color:var(--accent);margin-bottom:27px}
    .tech-build-card h3{font-size:20px;margin-bottom:10px}
    .tech-build-card p{margin-top:auto;color:var(--text-dim);font-size:14px;line-height:1.65}

    .workflow-section{background:var(--bg-elev)}
    .workflow{border:1px solid var(--border);display:grid;grid-template-columns:repeat(7,1fr);overflow:hidden}
    .workflow-step{min-height:165px;padding:22px 16px;border-right:1px solid var(--border);position:relative;display:flex;flex-direction:column;justify-content:center}
    .workflow-step:last-child{border-right:0}
    .workflow-step:not(:last-child):after{content:"→";position:absolute;right:-8px;top:50%;transform:translateY(-50%);z-index:2;background:var(--bg-elev);padding:0 2px;color:var(--accent);font-family:var(--mono);font-size:13px}
    .workflow-step .step-no{font:10px var(--mono);color:var(--accent);margin-bottom:15px}
    .workflow-step strong{font:12px var(--mono);color:var(--text-dim);line-height:1.45}
    .workflow-caption{margin-top:45px;max-width:700px}
    .workflow-caption h2{font-size:clamp(28px,3.8vw,42px);line-height:1.08;margin-bottom:15px}
    .workflow-caption p{font-size:16px;color:var(--text-dim);line-height:1.7}

    .capability-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border)}
    .capability{background:var(--bg);padding:30px}
    .capability h3{font:11px var(--mono);color:var(--accent);letter-spacing:.1em;margin-bottom:20px}
    .capability ul{list-style:none;margin:0;padding:0}
    .capability li{padding:11px 0;border-bottom:1px solid var(--border);font-size:14px;color:var(--text-dim)}
    .capability li:last-child{border-bottom:0}

    .agency-tech{background:var(--bg-elev)}
    .agency-tech-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
    .agency-tech h2{font-size:clamp(30px,4vw,44px);line-height:1.08}
    .handoff{border-top:1px solid var(--border)}
    .handoff-row{padding:22px 0;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;gap:25px}
    .handoff-row span{font:10px var(--mono);color:var(--text-faint);letter-spacing:.08em}
    .handoff-row strong{text-align:right;font:13px var(--mono);color:var(--text-dim)}

    .tech-cta{text-align:center;background:var(--bg-elev);padding:120px 0;border-top:1px solid var(--border)}
    .tech-cta h2{font-size:clamp(34px,5vw,58px);line-height:1.08;max-width:780px;margin:0 auto 34px}

    @media(max-width:1000px){
      .tech-hero-grid{grid-template-columns:1fr}
      .workflow{grid-template-columns:repeat(4,1fr)}
      .workflow-step:nth-child(4){border-right:0}
      .workflow-step:nth-child(4):after{display:none}
      .workflow-step:nth-child(n+5){border-top:1px solid var(--border)}
    }
    @media(max-width:800px){
      .tech-build-grid,.capability-grid,.agency-tech-grid{grid-template-columns:1fr 1fr}
    }
    @media(max-width:640px){
      .tech-hero{padding:145px 0 80px}
      .tech-section{padding:80px 0}
      .tech-build-grid,.capability-grid{grid-template-columns:1fr}
      .workflow{grid-template-columns:1fr}
      .workflow-step{min-height:100px;border-right:0!important;border-bottom:1px solid var(--border)}
      .workflow-step:last-child{border-bottom:0}
      .workflow-step:after{display:none!important}
      .agency-tech-grid{grid-template-columns:1fr}
      .handoff-row{display:block}
      .handoff-row strong{display:block;text-align:left;margin-top:8px}
      .component-content{padding:14px}
      .table-head,.table-row{grid-template-columns:1.3fr .8fr .7fr;padding:10px 8px}
      .table-head span:nth-child(4),.table-row span:nth-child(4){display:none}
    }

    /* ===== SALESFORCE UI RESCUE PAGE ===== */
    .rescue-hero{padding:170px 0 110px;border-top:none}
    .rescue-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
    .rescue-hero h1{font-size:clamp(42px,5.7vw,72px);line-height:1.02;max-width:760px;margin-bottom:28px}
    .rescue-intro{font-size:18px;color:var(--text-dim);max-width:650px;line-height:1.7;margin-bottom:32px}
    .rescue-cred{font:11px var(--mono);color:var(--text-faint);letter-spacing:.06em;margin-top:18px}

    .broken-ui{border:1px solid var(--border-strong);background:var(--bg-elev);border-radius:6px;overflow:hidden;box-shadow:0 50px 100px -50px rgba(0,0,0,.8)}
    .broken-top{height:44px;border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 15px;gap:7px}
    .broken-top .dot{width:7px;height:7px;border-radius:50%;background:var(--border-strong)}
    .broken-top .label{margin-left:10px;font:9px var(--mono);color:var(--text-faint)}
    .broken-body{padding:22px}
    .broken-title{height:10px;width:55%;background:var(--bg-elev-2);margin-bottom:10px}
    .broken-sub{height:6px;width:32%;background:var(--border-strong);margin-bottom:24px}
    .broken-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
    .broken-card{border:1px solid var(--border);padding:15px;min-height:105px}
    .broken-card.wide{grid-column:span 2;min-height:86px}
    .broken-line{height:6px;background:var(--bg-elev-2);margin-bottom:9px;width:80%}
    .broken-line.short{width:43%}
    .broken-alert{margin-top:15px;border:1px solid var(--accent-line);padding:11px 13px;color:var(--accent);font:9px var(--mono);letter-spacing:.04em}
    .misalign{display:flex;justify-content:space-between;align-items:center;margin-top:18px;font:9px var(--mono);color:var(--text-faint)}
    .misalign b{font-weight:400;color:var(--accent)}

    .rescue-section{padding:110px 0;border-top:1px solid var(--border)}
    .rescue-head{max-width:760px;margin-bottom:50px}
    .rescue-head h2{font-size:clamp(30px,4vw,46px);line-height:1.08}
    .pain-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--border);border:1px solid var(--border)}
    .pain-item{background:var(--bg);padding:30px;min-height:125px;display:flex;align-items:center}
    .pain-item h3{font-size:20px;line-height:1.25;max-width:430px}
    .pain-item:nth-child(odd){background:var(--bg-elev)}
    .step-in{text-align:center;padding:75px 0 15px}
    .step-in h2{font-size:clamp(40px,6vw,70px);line-height:1;color:var(--accent)}

    .fix-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .fix-card{border:1px solid var(--border);border-radius:5px;padding:30px 26px;min-height:220px;display:flex;flex-direction:column}
    .fix-card .num{font:11px var(--mono);color:var(--accent);margin-bottom:27px}
    .fix-card h3{font-size:20px;margin-bottom:10px}
    .fix-card p{margin-top:auto;color:var(--text-dim);font-size:14px;line-height:1.65}

    .compare-section{background:var(--bg-elev)}
    .compare{display:grid;grid-template-columns:1fr 70px 1fr;gap:25px;align-items:center}
    .compare-side{border:1px solid var(--border);padding:18px}
    .compare-label{font:10px var(--mono);color:var(--text-faint);letter-spacing:.12em;margin-bottom:16px}
    .compare-side.after .compare-label{color:var(--accent)}
    .compare-screen{border:1px solid var(--border);background:var(--bg);min-height:310px;padding:18px}
    .compare-screen .mock-nav{height:22px;border-bottom:1px solid var(--border);margin-bottom:18px}
    .compare-screen .mock-heading{height:10px;width:52%;background:var(--bg-elev-2);margin-bottom:8px}
    .compare-screen .mock-copy{height:6px;width:34%;background:var(--border-strong);margin-bottom:20px}
    .before-ui .mock-boxes{display:grid;grid-template-columns:1fr 1fr;gap:8px}
    .before-ui .mock-box{height:90px;border:1px solid var(--border);background:var(--bg-elev-2)}
    .before-ui .mock-box:nth-child(3){grid-column:span 2;height:55px}
    .after-ui .mock-boxes{display:grid;grid-template-columns:1.4fr .8fr;gap:8px}
    .after-ui .mock-box{height:95px;border:1px solid var(--border)}
    .after-ui .mock-box.large{grid-row:span 2;height:198px}
    .after-ui .mock-accent{height:6px;background:var(--accent-dim);border:1px solid var(--accent-line);margin-top:10px;width:70%}
    .compare-arrow{font:18px var(--mono);color:var(--accent);text-align:center}

    .process-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
    .process-step{padding:28px 24px;border-right:1px solid var(--border);min-height:205px}
    .process-step:last-child{border-right:0}
    .process-step .num{font:11px var(--mono);color:var(--accent);display:block;margin-bottom:32px}
    .process-step h3{font-size:19px;margin-bottom:10px}
    .process-step p{color:var(--text-dim);font-size:14px;line-height:1.6}

    .agency-rescue{background:var(--bg-elev)}
    .agency-rescue-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:70px;align-items:start}
    .agency-rescue h2{font-size:clamp(30px,4vw,44px);line-height:1.08}
    .agency-quote{border-left:1px solid var(--accent-line);padding:5px 0 5px 25px;font-size:18px;color:var(--text-dim);line-height:1.7}
    .agency-quote strong{display:block;color:var(--text);margin-bottom:14px}

    .rescue-cta{text-align:center;background:var(--bg-elev);padding:120px 0;border-top:1px solid var(--border)}
    .rescue-cta h2{font-size:clamp(34px,5vw,58px);line-height:1.08;max-width:780px;margin:0 auto 34px}
    .rescue-cta p{color:var(--text-dim);margin-bottom:30px}

    @media(max-width:900px){
      .rescue-hero-grid,.agency-rescue-grid{grid-template-columns:1fr}
      .fix-grid{grid-template-columns:1fr 1fr}
      .process-grid{grid-template-columns:1fr 1fr}
      .process-step:nth-child(2){border-right:0}
      .process-step:nth-child(n+3){border-top:1px solid var(--border)}
      .compare{grid-template-columns:1fr}
      .compare-arrow{transform:rotate(90deg)}
    }
    @media(max-width:640px){
      .rescue-hero{padding:145px 0 80px}
      .rescue-section{padding:80px 0}
      .pain-grid,.fix-grid,.process-grid{grid-template-columns:1fr}
      .process-step{border-right:0!important;border-bottom:1px solid var(--border)}
      .process-step:last-child{border-bottom:0}
      .pain-item{min-height:105px}
      .broken-body{padding:14px}
    }

    /* ===== INSIGHTS PAGE ===== */
    .insights-hero{padding:170px 0 100px;border-top:none}
    .insights-hero h1{font-size:clamp(48px,7vw,88px);line-height:.98;max-width:900px;margin:18px 0 25px}
    .insights-intro{font-size:18px;color:var(--text-dim);max-width:690px;line-height:1.75}
    .featured{padding:70px 0 110px;border-top:1px solid var(--border)}
    .featured-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:22px}
    .featured-card{border:1px solid var(--border);background:var(--bg-elev);padding:38px;min-height:420px;display:flex;flex-direction:column}
    .featured-visual{min-height:250px;border:1px solid var(--border);background:var(--bg);padding:22px;margin-bottom:28px;position:relative;overflow:hidden}
    .visual-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;height:100%}
    .visual-grid span{border:1px solid var(--border);background:var(--bg-elev-2)}
    .visual-grid span:nth-child(3n){background:var(--accent-dim);border-color:var(--accent-line)}
    .featured-card h2{font-size:clamp(27px,3vw,40px);line-height:1.1;margin:10px 0 15px}
    .featured-card p{color:var(--text-dim);line-height:1.65;font-size:14px}
    .meta{font:10px var(--mono);color:var(--text-faint);letter-spacing:.08em}
    .read{margin-top:auto;padding-top:25px;color:var(--accent);font:11px var(--mono)}
    .insights-section{padding:105px 0;border-top:1px solid var(--border)}
    .section-title{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:42px}
    .section-title h2{font-size:clamp(30px,4vw,46px);line-height:1.08}
    .filter{font:10px var(--mono);color:var(--text-faint);border:1px solid var(--border);padding:9px 12px}
    .article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .article{border:1px solid var(--border);padding:26px;min-height:300px;display:flex;flex-direction:column;transition:transform .2s,border-color .2s}
    .article:hover{transform:translateY(-3px);border-color:var(--border-strong)}
    .article .tag{font:10px var(--mono);color:var(--accent);letter-spacing:.08em;margin-bottom:55px}
    .article h3{font-size:21px;line-height:1.25;margin-bottom:12px}
    .article p{font-size:13.5px;color:var(--text-dim);line-height:1.65}
    .article .read{margin-top:auto}
    .topics{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
    .topic{border:1px solid var(--border);padding:20px;font:11px var(--mono);color:var(--text-dim);min-height:65px;display:flex;align-items:center}
    .newsletter{background:var(--bg-elev);border-top:1px solid var(--border);padding:100px 0}
    .newsletter-inner{max-width:820px}
    .newsletter h2{font-size:clamp(32px,4.5vw,52px);line-height:1.08;margin-bottom:16px}
    .newsletter p{color:var(--text-dim);line-height:1.7;margin-bottom:28px}
    .newsletter-form{display:flex;gap:10px;max-width:600px}
    .newsletter-form input{flex:1;background:var(--bg);border:1px solid var(--border);padding:14px 15px;color:var(--text);font:12px var(--mono);outline:none}
    .newsletter-form input:focus{border-color:var(--accent-line)}
    @media(max-width:900px){.featured-grid{grid-template-columns:1fr}.article-grid{grid-template-columns:1fr 1fr}.topics{grid-template-columns:1fr 1fr}}
    @media(max-width:640px){.insights-hero{padding:145px 0 80px}.insights-section{padding:80px 0}.article-grid,.topics{grid-template-columns:1fr}.newsletter-form{flex-direction:column}.featured-card{padding:25px}}
  