  :root{
    --ink:#FFFFFF;
    --surface:#F8FAFD;
    --surface-2:#EEF2F8;
    --mist:#F5F7FB;
    --border:#E2E8F1;
    --navy:#003670;
    --navy-deep:#001F45;
    --mint:#003670;
    --mint-dim:#6C86A8;
    --signal:#0CA89C;
    --signal-text:#08766F;
    --signal-tint:#E3F6F3;
    --kill:#C43B3B;
    --kill-dim:#E8B4B4;
    --kill-tint:#FBEAEA;
    --text:#0B162B;
    --text-mute:#30405C;
    --text-faint:#43516A;
    --display: 'Space Grotesk', sans-serif;
    --serif: 'Playfair Display', serif;
    --body: 'Space Grotesk', sans-serif;
    --mono: 'JetBrains Mono', monospace;
    --shadow-sm: 0 1px 2px rgba(9,30,66,0.06), 0 1px 1px rgba(9,30,66,0.04);
    --shadow-md: 0 10px 24px -8px rgba(0,54,112,0.16), 0 2px 6px rgba(0,54,112,0.06);
    --shadow-lg: 0 24px 48px -12px rgba(0,32,74,0.22), 0 4px 12px rgba(0,32,74,0.08);
    --card-shadow: var(--shadow-sm);
    --r-sm: 10px;
    --r-md: 16px;
    --r-lg: 22px;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth; scroll-padding-top:100px;}
  body{
    background:var(--ink);
    color:var(--text);
    font-family:var(--body);
    line-height:1.6;
    text-rendering:optimizeLegibility;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
    position:relative;
  }
  img, svg{max-width:100%;}
  /* subtle transaction-line texture supporting the payment-flow theme */
  body::before{
    content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
    background-image:repeating-linear-gradient(180deg, rgba(0,54,112,0.030) 0px, rgba(0,54,112,0.030) 1px, transparent 1px, transparent 34px);
    opacity:0.55;
  }
  body > *{position:relative; z-index:1;}
  @media (prefers-reduced-motion: reduce){
    *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
  }
  a{color:inherit;}
  section[id]{scroll-margin-top:100px;}
  .wrap{max-width:1180px; margin:0 auto; padding:0 32px;}
  ::selection{background:var(--navy); color:#fff;}
  :focus-visible{outline:2px solid var(--signal); outline-offset:3px; border-radius:4px;}

  /* ---------- NAV (floating glass pill) ---------- */
  nav{
    position:fixed; top:14px; left:50%; transform:translateX(-50%); z-index:100;
    width:calc(100% - 32px); max-width:1320px;
    background:rgba(255,255,255,0.72); backdrop-filter:blur(18px) saturate(180%); -webkit-backdrop-filter:blur(18px) saturate(180%);
    border:1px solid rgba(255,255,255,0.7);
    border-radius:100px;
    box-shadow:0 8px 28px -8px rgba(0,32,74,0.14), 0 1px 3px rgba(0,32,74,0.05);
    transition:box-shadow .3s ease, background .3s ease, top .3s ease, width .3s ease;
  }
  nav.scrolled{
    background:rgba(255,255,255,0.88);
    box-shadow:0 12px 34px -8px rgba(0,32,74,0.20), 0 2px 8px rgba(0,32,74,0.08);
    top:10px;
  }
  nav .wrap{display:flex; align-items:center; justify-content:space-between; height:60px; max-width:none; padding:0 10px 0 22px;}
  .brand{display:flex; align-items:center; gap:11px; font-family:var(--display); font-weight:600; font-size:16px; letter-spacing:0.02em; text-decoration:none;}
  .brand img{height:30px; width:auto; display:block;}
  .brand .brand-text{display:flex; flex-direction:column; line-height:1.2;}
  .brand .brand-text .product{font-size:17px; font-family:var(--serif); font-weight:700; color:var(--navy);}
  .brand .brand-text .company{font-family:var(--mono); font-size:10px; font-weight:500; color:var(--text-faint); letter-spacing:0.06em; text-transform:uppercase;}
  .brand .dot{width:8px; height:8px; border-radius:50%; background:var(--signal); box-shadow:0 0 10px var(--signal);}

  .navlinks{display:flex; align-items:center; gap:20px; font-size:10.5px; color:var(--text-mute); font-family:var(--mono); font-weight:500;}
  .navlinks a{position:relative; text-decoration:none; transition:color .22s ease, background-color .22s ease, box-shadow .22s ease, transform .22s cubic-bezier(.2,.8,.2,1);}
  .navlinks a:not(.nav-cta){padding:7px 9px; margin:-7px -9px; border-radius:100px;}
  .navlinks a:not(.nav-cta):hover,.navlinks a:not(.nav-cta):focus-visible{color:var(--navy); background:rgba(255,255,255,.82); box-shadow:0 9px 22px -12px rgba(0,54,112,.55), inset 0 0 0 1px rgba(0,54,112,.09); transform:translateY(-2px);}
  .navlinks a[aria-current="page"]:not(.nav-cta){color:var(--navy); background:rgba(255,255,255,.58); box-shadow:inset 0 0 0 1px rgba(0,54,112,.07);}
  .navlinks .nav-cta{padding:10px 15px; border-radius:100px; background:var(--navy); color:#fff; font-weight:600; box-shadow:var(--shadow-sm);}
  .navlinks .nav-cta:hover{color:#fff; background:var(--navy-deep); transform:translateY(-1px);}
  .menu-toggle{
    display:none; width:42px; height:42px; padding:0; border:1px solid var(--border); border-radius:50%;
    background:#fff; color:var(--navy); align-items:center; justify-content:center; cursor:pointer;
  }
  .menu-toggle span,
  .menu-toggle::before,
  .menu-toggle::after{
    content:""; display:block; width:17px; height:1.5px; border-radius:2px; background:currentColor;
    transition:transform .2s ease, opacity .2s ease;
  }
  .menu-toggle span{margin:4px 0;}
  .menu-toggle[aria-expanded="true"] span{opacity:0;}
  .menu-toggle[aria-expanded="true"]::before{transform:translateY(5.5px) rotate(45deg);}
  .menu-toggle[aria-expanded="true"]::after{transform:translateY(-5.5px) rotate(-45deg);}

  /* ---------- LOGO BANNER (lockup) ---------- */
  .logo-banner{
    background:linear-gradient(135deg, var(--navy), var(--navy-deep)); border-radius:var(--r-lg); padding:26px 40px;
    display:flex; align-items:center; margin-bottom:56px; overflow:hidden; position:relative;
    box-shadow: var(--shadow-lg);
  }
  .logo-banner::after{
    content:""; position:absolute; right:-60px; top:-60px; width:220px; height:220px; border-radius:50%;
    background:rgba(255,255,255,0.06);
  }
  .logo-banner .pill{
    background:#FFFFFF; border-radius:100px; padding:12px 34px 12px 12px;
    display:flex; align-items:center; gap:20px; box-shadow:0 10px 30px rgba(0,10,30,0.25);
    position:relative; z-index:1; animation:pillFloat 5s ease-in-out infinite;
  }
  @keyframes pillFloat{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-6px);}
  }
  .logo-banner .pill img{height:52px; width:auto; display:block;}
  .logo-banner .pill .wordmark{font-family:var(--serif); font-weight:700; font-size:24px; color:#0A0A0A; line-height:1; letter-spacing:-0.01em;}
  .logo-banner .pill .tagline{font-family:var(--body); font-size:12.5px; color:#4A4A4A; margin-top:5px;}
  @media (max-width:640px){
    .logo-banner{padding:18px;}
    .logo-banner .pill{padding:10px 20px 10px 10px; gap:14px;}
    .logo-banner .pill img{height:38px;}
    .logo-banner .pill .wordmark{font-size:19px;}
  }

  /* ---------- HERO ---------- */
  header.hero{
    position:relative; padding:150px 0 100px;
    background:
      radial-gradient(ellipse 900px 520px at 82% -8%, rgba(0,54,112,0.09), transparent 62%),
      radial-gradient(ellipse 640px 420px at 6% 14%, rgba(12,168,156,0.07), transparent 60%);
    overflow:hidden;
  }
  header.hero::before{
    content:""; position:absolute; width:520px; height:520px; border-radius:50%;
    background:radial-gradient(circle, rgba(0,54,112,0.08), transparent 70%);
    top:-180px; right:-120px; z-index:0; animation:driftA 14s ease-in-out infinite;
  }
  header.hero::after{
    content:""; position:absolute; width:380px; height:380px; border-radius:50%;
    background:radial-gradient(circle, rgba(196,59,59,0.045), transparent 70%);
    bottom:-140px; left:-100px; z-index:0; animation:driftB 16s ease-in-out infinite;
  }
  @keyframes driftA{
    0%,100%{transform:translate(0,0) scale(1);}
    50%{transform:translate(-40px,30px) scale(1.08);}
  }
  @keyframes driftB{
    0%,100%{transform:translate(0,0) scale(1);}
    50%{transform:translate(30px,-25px) scale(1.1);}
  }
  header.hero .wrap{position:relative; z-index:1;}
  .eyebrow{
    display:inline-flex; align-items:center; gap:9px;
    font-family:var(--mono); font-size:11.5px; letter-spacing:0.14em; text-transform:uppercase;
    color:var(--navy); border:1px solid rgba(0,54,112,0.18); background:rgba(0,54,112,0.045);
    padding:7px 14px 7px 12px; border-radius:100px; margin-bottom:30px; box-shadow:var(--shadow-sm);
  }
  h1{
    font-family:var(--display); font-weight:700;
    font-size:clamp(36px, 5.8vw, 72px); line-height:1.03; letter-spacing:-0.02em;
    max-width:900px;
  }
  h1 .accent{color:var(--navy);}
  .hero-sub{
    margin-top:26px; max-width:600px; color:var(--text-mute); font-size:17.5px; line-height:1.65;
  }
  .hero-actions{margin-top:42px; display:flex; gap:16px; flex-wrap:wrap;}
  .btn{
    font-family:var(--mono); font-size:13px; letter-spacing:0.03em; text-decoration:none;
    padding:15px 28px; border-radius:100px; display:inline-flex; align-items:center; gap:8px;
    transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
  }
  .btn-primary{
    background:linear-gradient(135deg, var(--navy), var(--navy-deep)); color:#fff; font-weight:600; position:relative;
    box-shadow: var(--shadow-md);
  }
  .btn-primary:hover{transform:translateY(-2px); box-shadow:0 16px 34px -8px rgba(0,54,112,0.34);}
  .btn-primary.pulse::before{
    content:""; position:absolute; inset:0; border-radius:100px;
    animation:btnPulse 2.4s ease-out infinite; pointer-events:none;
  }
  @keyframes btnPulse{
    0%{box-shadow:0 0 0 0 rgba(0,54,112,0.4);}
    70%{box-shadow:0 0 0 14px rgba(0,54,112,0);}
    100%{box-shadow:0 0 0 0 rgba(0,54,112,0);}
  }
  .btn-ghost{border:1px solid var(--border); color:var(--text); background:#fff;}
  .btn-ghost:hover{border-color:var(--mint-dim); color:var(--navy); transform:translateY(-2px); box-shadow:var(--shadow-sm);}

  /* ---------- SERVICE OVERVIEW ---------- */
  .service-overview{background:var(--navy-deep); color:#fff; position:relative; overflow:hidden;}
  .service-overview::before{content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 86% 18%, rgba(12,168,156,.2), transparent 28%), linear-gradient(115deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size:auto, 42px 42px;}
  .service-overview .wrap{position:relative; z-index:1;}
  .service-overview .kicker{color:#88D4CD;}
  .service-overview h2{color:#fff; max-width:800px;}
  .service-overview .section-lead{color:#C9D7E8;}
  .buying-grid{margin-top:52px; display:grid; grid-template-columns:1.15fr .925fr .925fr; gap:18px; align-items:stretch;}
  .buying-card{padding:30px; border:1px solid rgba(255,255,255,.16); border-radius:var(--r-md); background:rgba(255,255,255,.07); backdrop-filter:blur(8px); display:flex; flex-direction:column; box-shadow:0 20px 50px rgba(0,0,0,.12);}
  .buying-card:first-child{background:#fff; color:var(--text); transform:translateY(-8px);}
  .buying-card .buyer-tag{font-family:var(--mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:#88D4CD; font-weight:700;}
  .buying-card:first-child .buyer-tag{color:var(--signal-text);}
  .buying-card h3{font-family:var(--display); font-size:22px; line-height:1.25; margin:14px 0 10px;}
  .buying-card > p{color:#C9D7E8; font-size:14px;}
  .buying-card:first-child > p{color:var(--text-mute);}
  .buyer-fit{margin:22px 0 24px; padding-top:18px; border-top:1px solid rgba(255,255,255,.15);}
  .buying-card:first-child .buyer-fit{border-color:var(--border);}
  .buyer-fit strong{display:block; font-family:var(--mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; margin-bottom:9px; color:#fff;}
  .buying-card:first-child .buyer-fit strong{color:var(--navy);}
  .buyer-fit ul{padding-left:18px; color:#DCE7F3; font-size:13px; line-height:1.75;}
  .buying-card:first-child .buyer-fit ul{color:var(--text-mute);}
  .buying-card .btn{margin-top:auto; justify-content:center;}
  .buying-card:not(:first-child) .btn-ghost{border-color:rgba(255,255,255,.28); background:transparent; color:#fff;}
  .buying-card:not(:first-child) .btn-ghost:hover{background:#fff; color:var(--navy-deep);}
  .purchase-note{margin-top:28px; color:#B9C9DB; font-size:13px; display:flex; gap:12px; align-items:flex-start;}
  .purchase-note::before{content:""; width:8px; height:8px; margin-top:7px; border-radius:50%; background:var(--signal); flex:0 0 auto;}

  /* signature trace visual */
  .trace-panel{
    margin-top:64px; border:1px solid var(--border); background:#fff;
    border-radius:var(--r-md); overflow:hidden; box-shadow:var(--shadow-lg);
  }
  .trace-head{
    display:flex; justify-content:space-between; align-items:center;
    padding:14px 22px; border-bottom:1px solid var(--border);
    font-family:var(--mono); font-size:11px; color:var(--text-mute); letter-spacing:0.06em;
  }
  .trace-head .status{color:var(--signal-text); display:flex; align-items:center; gap:6px; font-weight:600;}
  .trace-head .status .blip{width:6px;height:6px;border-radius:50%;background:var(--signal); animation:pulse 1.6s infinite;}
  @keyframes pulse{0%,100%{opacity:1;} 50%{opacity:0.3;}}
  .trace-body{position:relative; height:180px;}
  svg.trace{width:100%; height:100%; display:block;}
  .trace-legend{
    display:flex; gap:24px; padding:14px 22px; border-top:1px solid var(--border);
    font-family:var(--mono); font-size:11px; color:var(--text-mute); flex-wrap:wrap;
  }
  .trace-legend span{display:flex; align-items:center; gap:6px;}
  .swatch{width:10px; height:10px; border-radius:3px;}

  /* ---------- LIVE FEED TICKER ---------- */
  .live-feed{border-top:1px solid var(--border); background:var(--mist);}
  .live-feed-head{
    display:flex; justify-content:space-between; align-items:center;
    padding:12px 22px; font-family:var(--mono); font-size:10.5px; letter-spacing:0.08em;
    text-transform:uppercase; color:var(--text-faint); border-bottom:1px solid var(--border);
  }
  .live-feed-list{height:168px; overflow:hidden; position:relative;}
  .feed-row{
    display:flex; align-items:center; gap:12px; padding:9px 22px;
    font-family:var(--mono); font-size:12px; border-bottom:1px solid var(--border);
    animation: feedIn .4s ease;
    background:#FFFFFF;
  }
  @keyframes feedIn{
    from{opacity:0; transform:translateY(-10px);}
    to{opacity:1; transform:translateY(0);}
  }
  .feed-dot{width:8px; height:8px; border-radius:50%; flex-shrink:0;}
  .feed-dot.ok{background:var(--signal); box-shadow:0 0 8px rgba(12,168,156,0.5);}
  .feed-dot.bad{background:#C43B3B; box-shadow:0 0 8px rgba(196,59,59,0.55); animation:feedPulse 1s ease 2;}
  @keyframes feedPulse{
    0%,100%{transform:scale(1);} 50%{transform:scale(1.5);}
  }
  .feed-id{color:var(--text-mute); min-width:118px;}
  .feed-amt{color:var(--text); min-width:76px;}
  .feed-status{margin-left:auto; font-size:11px; letter-spacing:0.04em;}
  .feed-status.ok{color:var(--signal);}
  .feed-status.bad{color:#C43B3B;}
  .feed-lat{color:var(--text-faint); font-size:11px; min-width:52px; text-align:right;}

  /* ---------- ICONS (chip treatment) ---------- */
  .card-icon{
    width:46px; height:46px; display:flex; align-items:center; justify-content:center;
    margin-bottom:20px; border-radius:13px;
    background:rgba(0,54,112,0.07); color:var(--navy);
  }
  .card-icon.kill{background:var(--kill-tint); color:var(--kill);}
  .card-icon svg{width:22px; height:22px;}

  /* ---------- VECTOR CARDS ---------- */
  .vector-cards{margin-top:20px; display:grid; grid-template-columns:repeat(5,1fr); gap:12px;}
  @media (max-width:900px){.vector-cards{grid-template-columns:repeat(2,1fr);}}
  .vector-card{
    border:1px solid var(--border); border-radius:var(--r-sm); padding:16px 14px; background:#fff;
    text-align:left; box-shadow:var(--shadow-sm); transition:box-shadow .2s ease, transform .2s ease;
  }
  .vector-card:hover{box-shadow:var(--shadow-md); transform:translateY(-3px);}
  .vector-card .vc-icon{width:20px; height:20px; color:var(--navy); margin-bottom:14px;}
  .vector-card .vc-label{font-family:var(--mono); font-size:12.5px; color:var(--text); display:block; margin-bottom:4px; font-weight:600;}
  .vector-card .vc-sub{font-size:11.5px; color:var(--text-faint);}

  /* ---------- FLOWCHART PANEL ---------- */
  .flow-panel{
    margin-top:56px; border:1px solid var(--border); background:#fff;
    border-radius:var(--r-md); overflow:hidden; box-shadow:var(--shadow-lg);
  }
  .flow-body{padding:28px 20px; overflow-x:auto;}
  .flow-body svg{display:block; margin:0 auto; min-width:640px;}

  /* ---------- SECTION SHARED ---------- */
  section{padding:112px 0;}
  section:nth-of-type(even){background:var(--mist);}
  section.accordion-section.is-collapsed{padding-top:46px; padding-bottom:46px;}
  .kicker{
    font-family:var(--mono); font-size:11.5px; letter-spacing:0.16em; text-transform:uppercase;
    color:var(--navy); margin-bottom:14px; display:flex; align-items:center; gap:10px; font-weight:600;
  }
  .kicker::before{content:""; width:22px; height:1.5px; background:var(--mint-dim); display:inline-block;}
  h2{
    font-family:var(--display); font-weight:600; font-size:clamp(28px,3.6vw,42px);
    letter-spacing:-0.015em; max-width:720px; line-height:1.12;
  }
  .accordion-section h2{max-width:none; margin:0;}
  .section-dropdown-toggle{
    width:100%; display:grid; grid-template-columns:minmax(0,1fr) 52px; gap:24px; align-items:center;
    padding:0; border:0; background:transparent; color:inherit; font:inherit; text-align:left; cursor:pointer;
  }
  .section-dropdown-label{display:block; max-width:720px;}
  .section-dropdown-icon{
    width:48px; height:48px; justify-self:end; position:relative; border:1px solid var(--border); border-radius:50%;
    background:#fff; box-shadow:var(--shadow-sm); transition:transform .22s ease, border-color .22s ease, background .22s ease;
  }
  .section-dropdown-icon::before{
    content:""; position:absolute; left:50%; top:50%; width:10px; height:10px;
    border-right:2px solid var(--navy); border-bottom:2px solid var(--navy);
    transform:translate(-50%,-68%) rotate(45deg);
  }
  .section-dropdown-toggle:hover .section-dropdown-icon{border-color:var(--mint-dim); background:var(--mint-pale);}
  .section-dropdown-toggle[aria-expanded="true"] .section-dropdown-icon{transform:rotate(180deg);}
  .section-dropdown-content{padding-top:18px;}
  .section-dropdown-content[hidden]{display:none;}
  .section-lead{color:var(--text-mute); max-width:640px; margin-top:16px; font-size:16.5px; line-height:1.6;}

  /* ---------- PROBLEM ---------- */
  .problem-grid{margin-top:56px; display:grid; grid-template-columns:1fr 1fr; gap:20px;}
  @media (max-width:800px){.problem-grid{grid-template-columns:1fr;}}
  .problem-card{background:#fff; padding:34px; border:1px solid var(--border); border-radius:var(--r-md);}
  .problem-card .tag{font-family:var(--mono); font-size:11px; color:var(--kill); letter-spacing:0.08em; text-transform:uppercase; margin-bottom:14px; display:block; font-weight:600;}
  .problem-card p{color:var(--text-mute); font-size:15px; line-height:1.6;}
  .problem-card h3{font-family:var(--display); font-size:19px; font-weight:600; margin-bottom:10px;}

  /* ---------- PILLARS ---------- */
  .pillars{margin-top:56px; display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
  @media (max-width:900px){.pillars{grid-template-columns:1fr;}}
  .pillar{border:1px solid var(--border); border-radius:var(--r-md); padding:30px; background:#fff;}
  .pillar .num{font-family:var(--mono); color:var(--navy); font-size:11.5px; letter-spacing:0.1em; margin-bottom:16px; display:block; font-weight:600;}
  .pillar h3{font-family:var(--display); font-size:19px; margin-bottom:10px;}
  .pillar p{color:var(--text-mute); font-size:14.5px; line-height:1.6;}

  /* ---------- HOW IT WORKS ---------- */
  .stages{margin-top:64px; position:relative;}
  .stage{
    display:grid; grid-template-columns:80px 1fr; gap:28px;
    padding:36px 0; border-top:1px solid var(--border); position:relative;
  }
  .stage:first-child{border-top:1px solid var(--border);}
  .stage-num{
    font-family:var(--mono); font-size:13px; color:var(--navy); padding-top:4px;
  }
  .stage-num .roman{display:block; font-size:26px; font-family:var(--display); color:var(--text); font-weight:600;}
  .stage-content h3{font-family:var(--display); font-size:21px; margin-bottom:10px;}
  .stage-content p{color:var(--text-mute); font-size:15px; max-width:640px; line-height:1.6;}
  .vector-tags{margin-top:18px; display:flex; flex-wrap:wrap; gap:10px;}
  .vector-tags span{
    font-family:var(--mono); font-size:12px; padding:6px 12px; border-radius:100px;
    border:1px solid var(--border); color:var(--text-mute); background:#fff;
  }
  .payload{
    margin-top:18px; font-family:var(--mono); font-size:12.5px; color:var(--navy);
    background:var(--navy); color:#CFE0F5; border:1px solid var(--navy-deep); border-radius:10px;
    padding:18px 20px; white-space:pre; overflow-x:auto; box-shadow:var(--shadow-md);
  }

  /* ---------- VALIDATION ---------- */
  .stat-grid{margin-top:56px; display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
  @media (max-width:900px){.stat-grid{grid-template-columns:1fr;}}
  .stat-card{border:1px solid var(--border); border-radius:var(--r-md); padding:28px; background:#fff;}
  .stat-card .source{display:block; font-family:var(--mono); font-size:11px; font-style:normal; color:var(--text-faint); text-transform:uppercase; letter-spacing:0.08em; margin-bottom:6px;}
  .stat-card h3{font-family:var(--display); font-size:18px; margin-bottom:22px; min-height:44px;}
  .metric-row{display:flex; justify-content:space-between; align-items:baseline; padding:9px 0; border-top:1px solid var(--border);}
  .metric-row:first-of-type{border-top:none;}
  .metric-row .label{font-size:13px; color:var(--text-mute); font-family:var(--mono);}
  .metric-row .val{font-family:var(--mono); font-size:16px; font-weight:700; color:var(--navy);}
  .n-count{margin-top:16px; font-family:var(--mono); font-size:11.5px; color:var(--text-faint);}

  /* ---------- COMPLIANCE ---------- */
  .compliance-panel{
    margin-top:48px; border:1px solid var(--border); border-radius:var(--r-md); padding:38px;
    background:#fff;
    display:grid; grid-template-columns:1fr 1fr; gap:36px; box-shadow:var(--shadow-sm);
  }
  @media (max-width:800px){.compliance-panel{grid-template-columns:1fr;}}
  .compliance-panel h3{font-family:var(--display); font-size:16px; margin-bottom:12px; color:var(--navy);}
  .compliance-panel p{color:var(--text-mute); font-size:14.5px; line-height:1.6;}
  .compliance-panel ul{margin-top:14px; padding-left:0; list-style:none;}
  .compliance-panel li{
    font-size:14px; color:var(--text-mute); padding:8px 0 8px 20px; position:relative;
    border-top:1px solid var(--border);
  }
  .compliance-panel li:first-child{border-top:none;}
  .compliance-panel li::before{content:"—"; position:absolute; left:0; color:var(--text-faint);}
  .privacy-architecture{margin-top:72px; padding-top:56px; border-top:1px solid var(--border);}
  .privacy-architecture > h3{
    font-family:var(--display); font-weight:600; font-size:clamp(26px,3.2vw,38px);
    letter-spacing:-0.015em; max-width:720px; line-height:1.12;
  }

  /* ---------- MILESTONES ---------- */
  .timeline{margin-top:56px; display:flex; flex-direction:column;}
  .milestone{
    display:grid; grid-template-columns:140px 1fr; gap:24px; padding:20px 0;
    border-top:1px solid var(--border); align-items:start;
  }
  .milestone:last-child{border-bottom:1px solid var(--border);}
  .milestone .status{font-family:var(--mono); font-size:11px; letter-spacing:0.06em; text-transform:uppercase; padding-top:2px; font-weight:600;}
  .status.done{color:var(--signal-text);}
  .status.dev{color:#8A551C;}
  .milestone .desc h3{font-family:var(--display); font-size:16px; font-weight:600; margin-bottom:4px;}
  .milestone .desc p{color:var(--text-mute); font-size:13.5px; font-family:var(--mono);}

  /* ---------- SERVICES ---------- */
  .problem-card, .pillar, .stat-card, .service-card{
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    box-shadow: var(--card-shadow);
  }
  .problem-card:hover, .pillar:hover, .stat-card:hover, .service-card:hover{
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg);
    border-color:transparent;
  }
  .services-grid{margin-top:56px; display:grid; grid-template-columns:repeat(auto-fit, minmax(230px, 1fr)); gap:20px;}
  .service-card{
    border:1px solid var(--border); border-radius:var(--r-md); padding:28px 26px; background:#fff;
  }
  .service-card h3{font-family:var(--display); font-size:16.5px; font-weight:600; margin-bottom:8px; color:var(--text);}
  .service-card p{color:var(--text-mute); font-size:13.5px; line-height:1.55;}
  .service-card .svc-tag{
    display:inline-block; font-family:var(--mono); font-size:10px; letter-spacing:0.08em; text-transform:uppercase;
    color:var(--navy); background:rgba(0,54,112,0.06); border:1px solid var(--mint-dim);
    padding:3.5px 10px; border-radius:100px; margin-bottom:14px; font-weight:600;
  }

  /* ---------- CTA / FOOTER ---------- */
  .cta{
    padding:130px 0; text-align:center;
    background:
      radial-gradient(ellipse 800px 420px at 50% 0%, rgba(0,54,112,0.07), transparent 70%),
      radial-gradient(ellipse 500px 320px at 85% 100%, rgba(12,168,156,0.05), transparent 70%);
  }
  .cta h2{margin:0 auto; max-width:640px;}
  .cta .section-dropdown-label{margin:0 auto;}
  .cta .section-dropdown-toggle{text-align:center;}
  .cta .section-lead{margin-left:auto; margin-right:auto;}
  .cta-actions{margin-top:38px; display:flex; gap:16px; justify-content:center; flex-wrap:wrap;}
  .contact-details{
    margin:56px auto 0; max-width:940px; display:grid; grid-template-columns:.8fr 1fr 1.6fr;
    text-align:left; border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden;
    background:rgba(255,255,255,0.82); box-shadow:var(--shadow-md);
  }
  .contact-item{padding:28px 30px; border-left:1px solid var(--border);}
  .contact-item:first-child{border-left:0;}
  .contact-label{
    display:block; margin-bottom:9px; color:var(--text-faint); font-family:var(--mono);
    font-size:10px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  }
  .contact-value{color:var(--text); font-family:var(--display); font-size:15px; font-weight:600; line-height:1.55; text-decoration:none;}
  a.contact-value{transition:color .2s ease;}
  a.contact-value:hover{color:var(--signal);}
  @media (max-width:800px){
    .contact-details{grid-template-columns:1fr;}
    .contact-item{border-left:0; border-top:1px solid var(--border);}
    .contact-item:first-child{border-top:0;}
  }
  footer{padding:44px 0; border-top:1px solid var(--border);}
  footer .wrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;}
  footer .fbrand{font-family:var(--mono); font-size:12px; color:var(--text-faint); max-width:640px; line-height:1.6;}
  footer .flinks{display:flex; gap:20px; font-family:var(--mono); font-size:12px; color:var(--text-faint);}

  .reveal{opacity:1; transform:none;}
  .js .reveal{opacity:0; transform:translateY(20px); transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1);}
  .js .reveal.in{opacity:1; transform:translateY(0);}

  /* ---------- RESPONSIVE ---------- */
  @media (max-width:800px){
    html{scroll-padding-top:92px;}
    .wrap{padding-left:22px; padding-right:22px;}
    nav{width:calc(100% - 24px); top:10px; border-radius:24px;}
    nav.scrolled{top:8px;}
    nav .wrap{height:auto; min-height:58px; padding:0 8px 0 16px; flex-wrap:wrap;}
    .brand{min-width:0;}
    .brand .brand-text .product{font-size:16px;}
    .brand .brand-text .company{font-size:9px;}
    .menu-toggle{display:flex; flex-direction:column; flex-shrink:0;}
    .navlinks{
      display:grid; grid-template-columns:1fr 1fr; width:100%; max-height:0; overflow:hidden;
      gap:8px 12px; padding:0 8px; opacity:0; visibility:hidden; pointer-events:none;
      transition:max-height .25s ease, opacity .2s ease, padding .25s ease;
    }
    nav.menu-open .navlinks{max-height:calc(100dvh - 92px); padding:8px 8px 16px; opacity:1; visibility:visible; pointer-events:auto; overflow-y:auto; overscroll-behavior:contain;}
    .navlinks a{min-height:44px; display:flex; align-items:center; margin:0; padding:10px 8px; border-top:1px solid var(--border); border-radius:10px; font-size:12px;}
    header.hero{padding:118px 0 72px;}
    section{padding:82px 0;}
    .logo-banner{margin-bottom:42px;}
    .trace-panel{margin-top:48px;}
    .trace-head{align-items:flex-start; gap:10px; flex-wrap:wrap;}
    .trace-head > span:first-child{max-width:70%; line-height:1.45;}
    .trace-legend{gap:10px 18px;}
    .trace-legend > span[style]{margin-left:0 !important; width:100%;}
    .problem-grid, .pillars, .stat-grid, .services-grid, .timeline{margin-top:42px;}
    .flow-panel{margin-top:42px;}
    .compliance-panel{padding:28px; gap:28px;}
    .privacy-architecture{margin-top:56px; padding-top:44px;}
    .cta{padding:88px 0;}
    .contact-details{margin-top:42px;}
    .contact-item{padding:24px;}
    .contact-value{overflow-wrap:anywhere;}
    footer .wrap{align-items:flex-start; flex-direction:column;}
  }

  @media (max-width:560px){
    .wrap{padding-left:18px; padding-right:18px;}
    nav{width:calc(100% - 16px);}
    .brand{gap:8px;}
    .brand img{height:27px;}
    .brand .brand-text .company{display:none;}
    .logo-banner{padding:14px; border-radius:16px;}
    .logo-banner .pill{width:100%; padding:10px 14px 10px 10px; gap:12px;}
    .logo-banner .pill img{height:34px;}
    .logo-banner .pill .wordmark{font-size:18px;}
    .logo-banner .pill .tagline{font-size:10.5px; line-height:1.35;}
    .eyebrow{font-size:9.5px; line-height:1.45; letter-spacing:.1em; border-radius:15px; margin-bottom:22px;}
    h1{font-size:clamp(34px, 11vw, 46px); line-height:1.06; overflow-wrap:anywhere;}
    h1 br{display:none;}
    .hero-sub{margin-top:20px; font-size:15.5px; line-height:1.6;}
    .hero-actions, .cta-actions{gap:11px;}
    .btn{width:100%; justify-content:center; padding:14px 18px; text-align:center;}
    .trace-head, .trace-legend, .live-feed-head{padding-left:14px; padding-right:14px;}
    .trace-head > span:first-child{max-width:100%;}
    .trace-body{height:150px;}
    .trace-legend{flex-direction:column;}
    .feed-row{gap:8px; padding:9px 14px; font-size:11px;}
    .feed-id, .feed-merchant{display:none;}
    .feed-amt{min-width:66px;}
    .feed-lat{min-width:38px;}
    .feed-status{font-size:9.5px;}
    .vector-cards{grid-template-columns:1fr;}
    .vector-card{padding:18px;}
    section{padding:68px 0;}
    section.accordion-section.is-collapsed{padding-top:30px; padding-bottom:30px;}
    h2{font-size:clamp(28px, 8.5vw, 36px); overflow-wrap:anywhere;}
    .section-dropdown-toggle{grid-template-columns:minmax(0,1fr) 42px; gap:14px;}
    .section-dropdown-icon{width:40px; height:40px;}
    .section-lead{font-size:15px;}
    .kicker{font-size:10px; letter-spacing:.12em; align-items:flex-start;}
    .kicker::before{margin-top:7px; flex-shrink:0;}
    .problem-card, .pillar, .stat-card, .service-card{padding:24px 22px;}
    .stage{grid-template-columns:48px 1fr; gap:16px; padding:28px 0;}
    .stage-num .roman{font-size:22px;}
    .stage-content h3{font-size:19px;}
    .payload{font-size:11px; padding:15px;}
    .flow-body{padding:18px 12px; scrollbar-width:thin;}
    .flow-body svg{min-width:600px;}
    .flow-body::after{content:"Swipe to view the full payment flow"; display:block; margin-top:12px; color:var(--text-faint); font-family:var(--mono); font-size:9.5px; letter-spacing:.05em; text-align:center;}
    .metric-row{gap:14px;}
    .metric-row .label{font-size:11.5px;}
    .compliance-panel{padding:22px;}
    .milestone{grid-template-columns:1fr; gap:8px; padding:18px 0;}
    .milestone .status{padding-top:0;}
    .cta{padding:72px 0;}
    .contact-details{border-radius:16px;}
    footer{padding:34px 0;}
    footer .flinks{gap:12px 18px; flex-wrap:wrap;}
  }

  @media (max-width:420px){
    .navlinks{grid-template-columns:1fr;}
    nav.menu-open .navlinks{padding-bottom:12px;}
    .navlinks .nav-cta{grid-column:auto;}
    header.hero{padding-top:106px;}
    .logo-banner .pill{align-items:flex-start;}
    .hero-actions, .cta-actions, .service-actions{display:grid; grid-template-columns:1fr;}
    .credibility-strip span, .audience-row span{width:100%; justify-content:flex-start;}
    .audience-row strong{width:100%; margin:0 0 2px;}
    .quick-link{width:100%; justify-content:center; text-align:center; overflow-wrap:anywhere;}
  }

  @media (hover:none){
    .problem-card:hover, .pillar:hover, .stat-card:hover, .service-card:hover, .vector-card:hover,
    .btn-primary:hover, .btn-ghost:hover{transform:none;}
  }

  /* ---------- CUSTOMER-FACING EXTENSIONS ---------- */
  .credibility-strip{margin-top:28px; display:flex; flex-wrap:wrap; gap:10px; max-width:920px;}
  .credibility-strip span{display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border:1px solid var(--border); border-radius:100px; background:rgba(255,255,255,.82); color:var(--text-mute); font-family:var(--mono); font-size:10.5px; box-shadow:var(--shadow-sm);}
  .credibility-strip span::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--signal); flex:0 0 auto;}
  .solutions-grid{margin-top:52px; display:grid; grid-template-columns:repeat(12,1fr); gap:18px;}
  .solution-card{grid-column:span 4; min-height:180px; padding:26px; border:1px solid var(--border); border-radius:var(--r-md); background:#fff; box-shadow:var(--card-shadow); transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;}
  .solution-card.wide{grid-column:span 6;}
  .solution-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:transparent;}
  .solution-num{display:block; margin-bottom:16px; color:var(--navy); font-family:var(--mono); font-size:10px; letter-spacing:.1em;}
  .solution-card h3{font-family:var(--display); font-size:17px; line-height:1.35; margin-bottom:8px;}
  .solution-card p{color:var(--text-mute); font-size:13.5px; line-height:1.6;}
  .audience-row{margin-top:28px; display:flex; flex-wrap:wrap; gap:10px; align-items:center;}
  .audience-row strong{font-family:var(--mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--navy); margin-right:6px;}
  .audience-row span{padding:7px 11px; background:var(--surface); border:1px solid var(--border); border-radius:100px; color:var(--text-mute); font-size:12px;}
  .why-grid{margin-top:52px; display:grid; grid-template-columns:repeat(4,1fr); gap:18px;}
  .why-card{padding:25px; border:1px solid var(--border); border-radius:var(--r-md); background:#fff; box-shadow:var(--card-shadow); transition:transform .25s ease, box-shadow .25s ease;}
  .why-card:hover{transform:translateY(-5px); box-shadow:var(--shadow-lg);}
  .why-card h3{font-family:var(--display); font-size:15.5px; margin-bottom:7px;}
  .why-card p{color:var(--text-mute); font-size:13px; line-height:1.55;}
  .validation-note{margin-top:24px; padding:18px 20px; border-left:3px solid var(--signal); background:var(--signal-tint); color:var(--text); font-size:13.5px; line-height:1.6; border-radius:0 var(--r-sm) var(--r-sm) 0;}
  .service-family{margin-top:56px;}
  .service-family + .service-family{margin-top:72px; padding-top:58px; border-top:1px solid var(--border);}
  .family-heading{display:grid; grid-template-columns:minmax(240px,.75fr) 1.25fr; gap:32px; align-items:end;}
  .family-heading h3{font-family:var(--display); font-size:clamp(25px,3vw,38px); line-height:1.12;}
  .family-heading p{color:var(--text-mute); max-width:680px;}
  .services-grid.expanded{margin-top:34px; grid-template-columns:repeat(3,1fr);}
  .service-card ul{margin-top:13px; padding-left:18px; color:var(--text-mute); font-size:13px; line-height:1.65;}
  .service-note{margin-top:24px; padding:17px 20px; border:1px solid var(--border); border-radius:var(--r-sm); background:var(--surface); font-size:13px; color:var(--text-mute);}
  .process{margin-top:28px; display:grid; grid-template-columns:repeat(5,1fr); border:1px solid var(--border); border-radius:var(--r-md); overflow:hidden; background:#fff;}
  .process-step{padding:18px; border-left:1px solid var(--border);}
  .process-step:first-child{border-left:0;}
  .process-step span{display:block; font-family:var(--mono); color:var(--signal-text); font-size:10px; margin-bottom:7px;}
  .process-step strong{font-family:var(--display); font-size:13px; line-height:1.35;}
  .service-actions{margin-top:28px; display:flex; flex-wrap:wrap; gap:12px;}
  .team-grid{margin-top:52px; display:grid; grid-template-columns:repeat(12,1fr); gap:20px;}
  .team-card{grid-column:span 4; padding:26px; border:1px solid var(--border); border-radius:var(--r-md); background:#fff; box-shadow:var(--card-shadow); min-width:0; transition:transform .25s ease, box-shadow .25s ease;}
  .team-card:hover{transform:translateY(-5px); box-shadow:var(--shadow-lg);}
  .team-card:nth-child(4), .team-card:nth-child(5){grid-column:span 6;}
  .avatar{width:54px; height:54px; display:grid; place-items:center; overflow:hidden; border-radius:15px; margin-bottom:22px; background:linear-gradient(145deg,var(--navy),var(--navy-deep)); color:#fff; font-family:var(--mono); font-size:14px; font-weight:700; letter-spacing:.05em; box-shadow:var(--shadow-md);}
  .avatar img{display:block; width:100%; height:100%; object-fit:cover;}
  .team-card h3{font-family:var(--display); font-size:18px; line-height:1.35; overflow-wrap:anywhere;}
  .team-card h3 a{text-decoration:none;}
  .team-card h3 a:hover{text-decoration:underline; text-decoration-color:var(--signal); text-underline-offset:4px;}
  .team-role{margin-top:7px; color:var(--text-mute); font-size:13px;}
  .linkedin-link{margin-top:20px; display:inline-flex; align-items:center; gap:8px; color:var(--navy); font-family:var(--mono); font-size:11px; font-weight:600; text-decoration:none;}
  .linkedin-link svg{width:17px; height:17px; flex:0 0 auto;}
  .linkedin-link::after{content:"↗"; font-size:12px;}
  .company-panel{margin-top:48px; display:grid; grid-template-columns:.8fr 1.2fr; gap:40px; padding:38px; border:1px solid var(--border); border-radius:var(--r-lg); background:#fff; box-shadow:var(--shadow-md);}
  .company-panel h3{font-family:var(--display); font-size:24px; margin-bottom:10px;}
  .company-panel p{color:var(--text-mute); font-size:13.5px;}
  .company-details{display:grid; grid-template-columns:1fr 1fr; gap:18px 28px;}
  .company-detail dt{font-family:var(--mono); font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-faint); margin-bottom:5px;}
  .company-detail dd{font-size:13.5px; font-weight:600; overflow-wrap:anywhere;}
  .company-detail.wide{grid-column:1/-1;}
  .patent-line{margin-top:24px; padding-top:20px; border-top:1px solid var(--border); font-family:var(--mono); font-size:11.5px; color:var(--text-mute);}
  .inquiry-grid{margin-top:46px; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; text-align:left;}
  .inquiry-card{padding:26px; border:1px solid var(--border); border-radius:var(--r-md); background:#fff; box-shadow:var(--card-shadow); display:flex; flex-direction:column; align-items:flex-start; transition:transform .25s ease, box-shadow .25s ease;}
  .inquiry-card:hover{transform:translateY(-5px); box-shadow:var(--shadow-lg);}
  .inquiry-card h3{font-family:var(--display); font-size:18px; margin-bottom:9px;}
  .inquiry-card p{color:var(--text-mute); font-size:13px; margin-bottom:22px; flex:1;}
  .inquiry-card .btn{width:100%;}
  .faq-list{margin-top:46px; display:grid; grid-template-columns:1fr 1fr; gap:16px;}
  .faq-item{border:1px solid var(--border); border-radius:var(--r-md); background:#fff; padding:24px; box-shadow:var(--card-shadow);}
  .faq-item h3{font-family:var(--display); font-size:18px; line-height:1.35; margin-bottom:10px;}
  .faq-item p{color:var(--text-mute); font-size:14px; line-height:1.65;}
  .contact-quick{margin-top:20px; display:flex; justify-content:center; flex-wrap:wrap; gap:10px;}
  .quick-link{display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:10px 14px; border:1px solid var(--border); border-radius:100px; background:#fff; color:var(--navy); font-family:var(--mono); font-size:11px; font-weight:600; text-decoration:none;}
  .quick-link:hover{border-color:var(--navy); transform:translateY(-1px);}
  .footer-main{display:grid; grid-template-columns:1.2fr .8fr; gap:36px; width:100%;}
  .footer-links{display:flex; justify-content:flex-end; flex-wrap:wrap; gap:12px 18px;}
  .footer-links a{font-family:var(--mono); font-size:11px; color:var(--text-mute); text-decoration:none;}
  .footer-links a:hover{text-decoration:underline; text-underline-offset:4px;}
  .copyright{width:100%; padding-top:22px; border-top:1px solid var(--border); font-family:var(--mono); font-size:11px; color:var(--text-faint);}
  .sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}

  @media (max-width:1280px){
    nav{border-radius:24px;}
    nav .wrap{height:auto; min-height:58px; flex-wrap:wrap;}
    .menu-toggle{display:flex; flex-direction:column; flex-shrink:0;}
    .navlinks{display:grid; grid-template-columns:1fr 1fr; width:100%; max-height:0; overflow:hidden; gap:8px 12px; padding:0 8px; opacity:0; visibility:hidden; pointer-events:none; transition:max-height .25s ease, opacity .2s ease, padding .25s ease;}
    nav.menu-open .navlinks{max-height:calc(100dvh - 92px); padding:8px 8px 16px; opacity:1; visibility:visible; pointer-events:auto; overflow-y:auto; overscroll-behavior:contain;}
    .navlinks a{min-height:44px; display:flex; align-items:center; margin:0; padding:10px 8px; border-top:1px solid var(--border); border-radius:10px; font-size:12px;}
    .navlinks .nav-cta{margin-top:8px; border-top:0; text-align:center; grid-column:1/-1;}
    .solution-card, .solution-card.wide{grid-column:span 6;}
    .buying-grid{grid-template-columns:1fr;}
    .buying-card:first-child{transform:none;}
    .why-grid{grid-template-columns:1fr 1fr;}
    .services-grid.expanded{grid-template-columns:1fr 1fr;}
    .process{grid-template-columns:1fr 1fr;}
    .process-step{border-top:1px solid var(--border);}
    .process-step:nth-child(odd){border-left:0;}
    .team-card{grid-column:span 6;}
    .team-card:nth-child(5){grid-column:1/-1;}
    .company-panel{grid-template-columns:1fr;}
    .inquiry-grid{grid-template-columns:1fr;}
  }
  @media (max-width:560px){
    .credibility-strip{display:grid;}
    .solutions-grid, .team-grid{display:block;}
    .solution-card, .team-card{margin-top:14px; min-height:0; padding:22px;}
    .why-grid, .services-grid.expanded, .company-details, .faq-list{grid-template-columns:1fr;}
    .family-heading{grid-template-columns:1fr; gap:14px;}
    .process{grid-template-columns:1fr;}
    .process-step, .process-step:nth-child(odd){border-left:0; border-top:1px solid var(--border);}
    .process-step:first-child{border-top:0;}
    .company-panel{padding:24px 20px;}
    .company-detail.wide{grid-column:auto;}
    .footer-main{grid-template-columns:1fr; gap:20px;}
    .footer-links{justify-content:flex-start;}
  }
  @media (max-width:420px){
    .navlinks{grid-template-columns:1fr;}
    .navlinks .nav-cta{grid-column:auto; justify-content:center;}
    .contact-quick{display:grid; grid-template-columns:1fr;}
  }
  @media (hover:none){
    .solution-card:hover, .team-card:hover, .why-card:hover, .inquiry-card:hover{transform:none;}
  }
  @media (max-width:1280px){
    html:not(.js) nav{position:static; left:auto; transform:none; margin:12px auto 0;}
    html:not(.js) .menu-toggle{display:none;}
    html:not(.js) .navlinks{display:flex; flex-wrap:wrap; max-height:none; overflow:visible; opacity:1; visibility:visible; pointer-events:auto; padding:8px 0 14px;}
    html:not(.js) .navlinks a{border:0; padding:8px;}
    html:not(.js) .navlinks .nav-cta{margin:0;}
  }

  /* ---------- RESPONSIVE REFINEMENTS ---------- */
  h1, h2, h3, .family-heading, .contact-value, .company-detail dd{overflow-wrap:anywhere;}
  .feed-row > *, .stage-content, .buying-card, .faq-item{min-width:0;}

  @media (max-width:1280px){
    body.menu-active{overflow:hidden;}
    nav{max-height:calc(100dvh - 20px);}
    nav.menu-open{overflow:hidden;}
    nav.menu-open .navlinks{max-height:calc(100vh - 92px); max-height:calc(100dvh - 92px);}
    .buying-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
    .buying-card:first-child{grid-column:1/-1;}
    .footer-links{justify-content:flex-start;}
  }

  @media (max-width:900px){
    .wrap{padding-left:24px; padding-right:24px;}
    header.hero{padding-top:126px; padding-bottom:78px;}
    .logo-banner{padding:22px 24px;}
    .hero-sub{max-width:680px;}
    .trace-panel, .flow-panel{border-radius:14px;}
    .family-heading{grid-template-columns:1fr; align-items:start; gap:14px;}
    .service-family + .service-family{margin-top:58px; padding-top:48px;}
    .company-panel{gap:28px;}
  }

  @media (max-width:700px){
    .wrap{padding-left:18px; padding-right:18px;}
    .buying-grid{grid-template-columns:1fr; gap:14px; margin-top:38px;}
    .buying-card:first-child{grid-column:auto;}
    .buying-card{padding:25px;}
    .services-grid.expanded, .why-grid, .faq-list{grid-template-columns:1fr;}
    .faq-list{margin-top:34px;}
    .service-family{margin-top:42px;}
    .service-family + .service-family{margin-top:46px; padding-top:40px;}
    .company-details{grid-template-columns:1fr;}
    .company-detail.wide{grid-column:auto;}
    .contact-quick{display:grid; grid-template-columns:1fr 1fr;}
    .quick-link{justify-content:center; text-align:center;}
  }

  @media (max-width:480px){
    html{scroll-padding-top:82px;}
    nav{top:max(8px, env(safe-area-inset-top)); width:calc(100% - 16px); border-radius:20px;}
    nav.scrolled{top:max(6px, env(safe-area-inset-top));}
    nav .wrap{min-height:54px; padding-left:14px; padding-right:6px;}
    .menu-toggle{width:40px; height:40px;}
    header.hero{padding-top:98px; padding-bottom:58px;}
    .logo-banner{margin-bottom:34px;}
    .hero-actions{margin-top:32px;}
    .credibility-strip{margin-top:22px;}
    .buying-card, .faq-item, .company-panel, .inquiry-card{padding:21px 19px;}
    .buying-card h3{font-size:20px;}
    .buyer-fit{margin-top:18px;}
    .section-dropdown-toggle{grid-template-columns:minmax(0,1fr) 38px; gap:10px;}
    .section-dropdown-icon{width:38px; height:38px;}
    .stage{grid-template-columns:1fr; gap:10px;}
    .stage-num{display:flex; align-items:baseline; gap:10px; padding-top:0;}
    .stage-num .roman{display:inline;}
    .payload{font-size:10px; padding:13px;}
    .trace-head .status{white-space:normal;}
    .feed-row{padding-left:12px; padding-right:12px;}
    .feed-lat{display:none;}
    .metric-row .val{font-size:18px;}
    .contact-quick{grid-template-columns:1fr;}
    .footer-links{display:grid; grid-template-columns:1fr 1fr; width:100%;}
    .copyright{line-height:1.6;}
  }

  @media (max-width:350px){
    .wrap{padding-left:14px; padding-right:14px;}
    h1{font-size:32px;}
    .logo-banner .pill{padding-right:10px;}
    .logo-banner .pill .tagline{font-size:9.5px;}
    .footer-links{grid-template-columns:1fr;}
  }

/* ---------- DATASCHUTZ JOURNAL ---------- */
.blog-page{--blog-paper:#F4F1E8; --blog-sheet:#FCFBF7; --blog-ink:#001F45; background:var(--blog-paper);}
.blog-page::before{
  background-image:linear-gradient(rgba(0,31,69,.026) 1px,transparent 1px),linear-gradient(90deg,rgba(0,31,69,.026) 1px,transparent 1px);
  background-size:36px 36px;
  opacity:.75;
}
.blog-page .section-site-header{background:rgba(244,241,232,.9); border-color:rgba(0,31,69,.12); box-shadow:0 10px 36px -30px rgba(0,31,69,.8);}
.blog-page .section-menu summary,.blog-page .section-menu-links{background:#FAF8F2;}
.blog-page .section-main > .blog-hero{position:relative; min-height:auto; overflow:hidden; padding:86px 0 104px; background:transparent; isolation:isolate;}
.blog-page .section-main > .blog-hero::after{content:"J"; position:absolute; right:-.04em; top:-.34em; z-index:-1; color:var(--navy); font-family:var(--serif); font-size:min(72vw,940px); font-weight:700; line-height:1; opacity:.026; pointer-events:none;}
.blog-masthead{position:relative; display:grid; grid-template-columns:minmax(0,1fr) 112px 250px; gap:42px; align-items:end;}
.blog-heading{max-width:860px;}
.blog-edition{display:flex; align-items:center; gap:12px; color:var(--navy); font-family:var(--mono); font-size:10px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;}
.blog-edition::before{content:""; width:28px; height:2px; background:var(--signal);}
.blog-edition span{color:var(--text-faint); font-weight:500;}
.blog-page .section-main .blog-heading .section-page-title{max-width:880px; margin-top:24px; color:var(--navy-deep); font-family:var(--serif); font-size:clamp(54px,7.2vw,96px); font-weight:700; line-height:.94; letter-spacing:-.045em;}
.blog-intro{max-width:700px; margin-top:30px; color:var(--text-mute); font-size:18px; line-height:1.72;}
.blog-seal{width:104px; height:104px; display:grid; grid-template-columns:auto auto; align-items:center; justify-content:center; gap:8px; align-self:start; margin-top:4px; border:1px solid rgba(0,31,69,.25); border-radius:50%; background:rgba(252,251,247,.48); color:var(--navy); box-shadow:inset 0 0 0 5px var(--blog-paper),inset 0 0 0 6px rgba(0,31,69,.13); transform:rotate(6deg);}
.blog-seal span{font-family:var(--serif); font-size:30px; font-weight:700; line-height:1;}
.blog-seal small{padding-left:8px; border-left:1px solid rgba(0,31,69,.22); font-family:var(--mono); font-size:7px; font-weight:700; letter-spacing:.08em; line-height:1.5; text-transform:uppercase;}
.blog-issue{padding:22px 0 6px 22px; border-left:1px solid rgba(0,31,69,.25);}
.blog-issue-label{display:block; margin-bottom:12px; color:var(--signal-text); font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;}
.blog-issue strong{display:block; color:var(--navy-deep); font-family:var(--serif); font-size:23px; line-height:1.16;}
.blog-issue time{display:block; margin-top:18px; color:var(--text-faint); font-family:var(--mono); font-size:10px;}
.blog-topics{position:sticky; top:82px; z-index:20; display:flex; align-items:center; flex-wrap:wrap; gap:9px; margin-top:54px; padding:12px 14px; border:1px solid rgba(0,31,69,.14); border-radius:100px; background:rgba(252,251,247,.84); box-shadow:0 16px 34px -28px rgba(0,31,69,.8); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);}
.blog-topics span{margin-right:8px; color:var(--text-faint); font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;}
.blog-topics a{padding:7px 12px; border:1px solid rgba(0,31,69,.16); border-radius:100px; background:rgba(255,255,255,.36); color:var(--navy); font-family:var(--mono); font-size:10px; font-weight:600; text-decoration:none; transition:transform .2s ease,background-color .2s ease,border-color .2s ease;}
.blog-topics a:hover,.blog-topics a:focus-visible{transform:translateY(-2px); border-color:var(--signal); background:#fff;}
.blog-feature{display:grid; grid-template-columns:minmax(0,1.12fr) minmax(380px,.88fr); min-height:520px; margin-top:52px; overflow:hidden; border:1px solid rgba(0,31,69,.16); border-radius:28px; background:var(--blog-sheet); box-shadow:0 34px 80px -52px rgba(0,31,69,.78); transition:box-shadow .35s ease,transform .35s cubic-bezier(.2,.8,.2,1);}
.blog-feature:hover{box-shadow:0 42px 88px -48px rgba(0,31,69,.82); transform:translateY(-4px);}
.blog-feature-copy{display:flex; flex-direction:column; align-items:flex-start; padding:58px 56px 52px; background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(244,241,232,.52));}
.blog-meta{display:flex; flex-wrap:wrap; gap:8px 18px; color:var(--text-faint); font-family:var(--mono); font-size:9px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;}
.blog-meta span+span::before{content:"/"; margin-right:18px; color:rgba(0,31,69,.3);}
.blog-feature h2{max-width:720px; margin-top:26px; color:var(--navy-deep); font-family:var(--serif); font-size:clamp(38px,4.4vw,60px); font-weight:700; line-height:1.02; letter-spacing:-.035em;}
.blog-deck{max-width:670px; margin-top:24px; color:var(--text-mute); font-size:17px; line-height:1.65;}
.blog-feature-points{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:34px; padding-top:26px; border-top:1px solid var(--border);}
.blog-feature-points p{color:var(--text-mute); font-size:12.5px; line-height:1.6;}
.blog-feature-points strong{display:block; margin-bottom:7px; color:var(--navy); font-family:var(--mono); font-size:9px; letter-spacing:.1em; text-transform:uppercase;}
.blog-feature-footer{width:100%; display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-top:auto; padding-top:34px;}
.blog-byline{display:flex; align-items:center; gap:11px; color:var(--navy-deep);}
.blog-byline-mark{width:38px; height:38px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--navy); color:#fff; font-family:var(--serif); font-size:15px; font-weight:700; box-shadow:0 0 0 4px rgba(0,54,112,.08);}
.blog-byline strong,.blog-byline small{display:block;}
.blog-byline strong{font-family:var(--mono); font-size:9px; letter-spacing:.04em;}
.blog-byline small{margin-top:3px; color:var(--text-faint); font-family:var(--mono); font-size:8px;}
.blog-feature-link{display:inline-flex; align-items:center; gap:9px; color:var(--navy); font-family:var(--mono); font-size:10px; font-weight:700; text-align:right; text-decoration:none;}
.blog-feature-link span{transition:transform .2s ease;}
.blog-feature-link:hover span{transform:translate(3px,-3px);}
.blog-feature-visual{position:relative; min-height:520px; overflow:hidden; background:var(--navy-deep); color:#fff; isolation:isolate;}
.blog-feature-visual::before{content:""; position:absolute; inset:0; z-index:-1; background:radial-gradient(circle at 50% 45%,rgba(12,168,156,.25),transparent 28%),linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px); background-size:auto,38px 38px,38px 38px;}
.blog-feature-visual::after{content:""; position:absolute; inset:18px; border:1px solid rgba(255,255,255,.12); pointer-events:none;}
.signal-caption{position:absolute; top:38px; left:38px; z-index:4;}
.signal-caption span,.signal-readout span{display:block; color:#8FD5CF; font-family:var(--mono); font-size:8px; font-weight:700; letter-spacing:.13em; text-transform:uppercase;}
.signal-caption strong{display:block; margin-top:6px; font-family:var(--mono); font-size:10px; font-weight:500;}
.signal-orbit{position:absolute; top:50%; left:50%; border:1px solid rgba(143,213,207,.28); border-radius:50%; transform:translate(-50%,-50%);}
.signal-orbit-one{width:270px; height:270px;}
.signal-orbit-two{width:390px; height:390px; border-style:dashed; animation:signalSpin 32s linear infinite;}
@keyframes signalSpin{to{transform:translate(-50%,-50%) rotate(360deg);}}
.signal-core{position:absolute; top:50%; left:50%; z-index:3; width:112px; height:112px; display:flex; align-items:center; justify-content:center; border:1px solid rgba(255,255,255,.34); border-radius:50%; background:rgba(12,168,156,.18); box-shadow:0 0 0 14px rgba(12,168,156,.05); font-family:var(--mono); font-size:10px; font-weight:700; letter-spacing:.08em; line-height:1.35; text-align:center; text-transform:uppercase; transform:translate(-50%,-50%);}
.signal-node{position:absolute; z-index:2; padding:7px 10px; border:1px solid rgba(255,255,255,.2); border-radius:100px; background:rgba(0,31,69,.82); color:#D8E5F3; font-family:var(--mono); font-size:8px; letter-spacing:.08em; text-transform:uppercase;}
.signal-node::before{content:""; display:inline-block; width:5px; height:5px; margin-right:6px; border-radius:50%; background:var(--signal); box-shadow:0 0 9px rgba(12,168,156,.8); vertical-align:1px;}
.signal-node{animation:signalFloat 5s ease-in-out infinite;}
.signal-node-location{animation-delay:-1.2s;}
.signal-node-session{animation-delay:-2.6s;}
.signal-node-merchant{animation-delay:-3.8s;}
@keyframes signalFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}}
.signal-node-device{top:27%; left:16%;}
.signal-node-location{top:29%; right:11%;}
.signal-node-session{bottom:27%; left:13%;}
.signal-node-merchant{right:13%; bottom:24%;}
.signal-readout{position:absolute; right:38px; bottom:38px; z-index:4; text-align:right;}
.signal-readout strong{display:block; margin-top:5px; color:#fff; font-family:var(--serif); font-size:27px;}
.blog-page .section-main > .blog-index{position:relative; min-height:auto; padding:104px 0 112px; border-top:1px solid rgba(0,31,69,.12); background:linear-gradient(180deg,#FBFAF6 0%,#F7F4EC 100%);}
.blog-section-head{display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,410px); gap:60px; align-items:end;}
.blog-section-head h2{max-width:none; margin-top:18px; color:var(--navy-deep); font-family:var(--serif); font-size:clamp(46px,6vw,76px); font-weight:700; line-height:1; letter-spacing:-.035em;}
.blog-section-head>p{padding-bottom:4px; color:var(--text-mute); font-size:15px; line-height:1.7;}
.blog-grid{display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr); gap:18px; margin-top:54px;}
.blog-card{position:relative; display:flex; flex-direction:column; min-height:360px; overflow:hidden; padding:36px; border:1px solid rgba(0,31,69,.14); border-radius:20px; background:#fff; box-shadow:0 8px 24px -24px rgba(0,31,69,.65); transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease,border-color .25s ease; isolation:isolate;}
.blog-card::before{content:""; position:absolute; top:0; left:0; width:100%; height:4px; background:linear-gradient(90deg,var(--navy),var(--signal)); transform:scaleX(.16); transform-origin:left; transition:transform .35s cubic-bezier(.2,.8,.2,1);}
.blog-card::after{content:attr(data-index); position:absolute; right:18px; bottom:-38px; z-index:-1; color:var(--navy); font-family:var(--serif); font-size:150px; font-weight:700; line-height:1; opacity:.035; pointer-events:none;}
.blog-card>*{position:relative; z-index:1;}
.blog-card-wide{grid-column:1/-1; min-height:330px; padding-right:min(15vw,180px);}
.blog-card:hover{transform:translateY(-5px); border-color:rgba(0,54,112,.32); box-shadow:0 24px 50px -36px rgba(0,31,69,.72);}
.blog-card:hover::before{transform:scaleX(1);}
.blog-card:nth-child(3n+2):not(.blog-card-dark){background:linear-gradient(145deg,#FFFFFF 0%,#F0F6F5 100%);}
.blog-card:nth-child(3n):not(.blog-card-dark){background:linear-gradient(145deg,#FFFFFF 0%,#F3F5F9 100%);}
.blog-card h3{max-width:760px; margin-top:42px; color:var(--navy-deep); font-family:var(--serif); font-size:clamp(27px,3vw,40px); font-weight:700; line-height:1.08; letter-spacing:-.025em;}
.blog-card>p{max-width:720px; margin-top:18px; color:var(--text-mute); font-size:14px; line-height:1.7;}
.blog-note{margin-top:auto; padding-top:28px; border-top:1px solid transparent; transition:border-color .2s ease;}
.blog-note[open]{border-color:rgba(0,31,69,.1);}
.blog-note summary{display:flex; align-items:center; gap:9px; min-height:42px; color:var(--navy); cursor:pointer; font-family:var(--mono); font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; list-style:none;}
.blog-note summary::-webkit-details-marker{display:none;}
.blog-note summary::before{content:"+"; width:24px; height:24px; display:inline-flex; align-items:center; justify-content:center; border:1px solid rgba(0,54,112,.25); border-radius:50%; font-size:14px; transition:transform .2s ease,background-color .2s ease,color .2s ease;}
.blog-note[open] summary::before{content:"−"; background:var(--navy); color:#fff; transform:rotate(180deg);}
.blog-note>p{max-width:720px; padding:16px 0 4px 33px; color:var(--text-mute); font-size:13px; line-height:1.72; animation:blogNoteIn .25s ease both;}
@keyframes blogNoteIn{from{opacity:0;transform:translateY(-5px);}to{opacity:1;transform:translateY(0);}}
.blog-card-dark{border-color:var(--navy-deep); background:radial-gradient(circle at 90% 20%,rgba(12,168,156,.18),transparent 28%),var(--navy-deep); box-shadow:0 22px 46px -32px rgba(0,31,69,.9);}
.blog-card-dark::before{background:linear-gradient(90deg,#8FD5CF,var(--signal));}
.blog-card-dark::after{color:#fff; opacity:.045;}
.blog-card-dark h3{color:#fff;}
.blog-card-dark>p,.blog-card-dark .blog-note>p{color:#C9D7E8;}
.blog-card-dark .blog-meta{color:#9EB1C8;}
.blog-card-dark .blog-meta span+span::before{color:rgba(255,255,255,.25);}
.blog-card-dark .blog-note summary{color:#8FD5CF;}
.blog-card-dark .blog-note summary::before{border-color:rgba(143,213,207,.5);}
.blog-card-dark .blog-note[open] summary::before{background:var(--signal); color:var(--navy-deep);}
.blog-cta{position:relative; display:grid; grid-template-columns:1.15fr .85fr auto; gap:36px; align-items:center; margin-top:72px; overflow:hidden; padding:42px; border:1px solid rgba(0,31,69,.14); border-radius:22px; background:linear-gradient(120deg,#F4F1E8 0%,#E9F3F1 100%); box-shadow:0 24px 56px -44px rgba(0,31,69,.75);}
.blog-cta::after{content:"↗"; position:absolute; right:21%; bottom:-72px; color:var(--navy); font-family:var(--serif); font-size:190px; line-height:1; opacity:.035; pointer-events:none;}
.blog-cta span{color:var(--signal-text); font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;}
.blog-cta h2{margin-top:8px; color:var(--navy-deep); font-family:var(--serif); font-size:clamp(28px,3vw,40px); font-weight:700; line-height:1.05;}
.blog-cta>p{color:var(--text-mute); font-size:13px; line-height:1.6;}
.blog-cta .btn{white-space:nowrap;}
@media (max-width:1024px){
  .blog-masthead{grid-template-columns:minmax(0,1fr) 104px; gap:34px;}
  .blog-issue{grid-column:1/-1; max-width:480px;}
  .blog-feature{grid-template-columns:1fr;}
  .blog-feature-visual{min-height:430px;}
  .blog-cta{grid-template-columns:1fr auto;}
  .blog-cta>p{grid-column:1/-1; grid-row:2; max-width:620px;}
}
@media (max-width:760px){
  .blog-page .section-main > .blog-hero{padding:62px 0 76px;}
  .blog-page .section-main .blog-heading .section-page-title{font-size:clamp(46px,13vw,68px);}
  .blog-intro{font-size:16px;}
  .blog-seal{width:90px; height:90px;}
  .blog-seal span{font-size:25px;}
  .blog-topics{position:static; align-items:flex-start; border-radius:18px;}
  .blog-topics span{width:100%; margin-bottom:4px;}
  .blog-feature-copy{padding:38px 28px;}
  .blog-feature-points{grid-template-columns:1fr; gap:18px;}
  .blog-feature-footer{align-items:flex-start; flex-direction:column;}
  .blog-feature-link{text-align:left;}
  .blog-feature-visual{min-height:380px;}
  .signal-orbit-two{width:320px; height:320px;}
  .signal-orbit-one{width:220px; height:220px;}
  .blog-page .section-main > .blog-index{padding:76px 0 82px;}
  .blog-section-head{grid-template-columns:1fr; gap:20px;}
  .blog-grid{grid-template-columns:1fr; margin-top:40px;}
  .blog-card,.blog-card-wide{grid-column:auto; min-height:0; padding:28px;}
  .blog-card h3{margin-top:32px;}
  .blog-cta{grid-template-columns:1fr; padding:30px 26px;}
  .blog-cta>p{grid-column:auto; grid-row:auto;}
  .blog-cta .btn{width:100%; justify-content:center;}
}
@media (max-width:480px){
  .blog-masthead{grid-template-columns:1fr;}
  .blog-seal{position:absolute; right:0; top:-8px; width:76px; height:76px; opacity:.78;}
  .blog-seal span{font-size:21px;}
  .blog-seal small{font-size:6px;}
  .blog-heading{padding-top:72px;}
  .blog-edition{align-items:flex-start; flex-wrap:wrap; gap:7px 10px;}
  .blog-edition span{width:100%; padding-left:38px;}
  .blog-page .section-main .blog-heading .section-page-title{margin-top:20px; font-size:clamp(42px,14.5vw,58px);}
  .blog-feature-copy{padding:32px 22px;}
  .blog-feature h2{font-size:36px;}
  .blog-meta{gap:7px 12px;}
  .blog-meta span+span::before{margin-right:12px;}
  .blog-feature-visual{min-height:330px;}
  .signal-caption{top:30px; left:30px;}
  .signal-readout{right:30px; bottom:30px;}
  .signal-node{font-size:7px; padding:6px 8px;}
  .signal-node-location{right:5%;}
  .signal-node-device{left:5%;}
  .signal-node-session{left:4%;}
  .signal-node-merchant{right:5%;}
  .signal-orbit-two{width:270px; height:270px;}
  .signal-orbit-one{width:190px; height:190px;}
  .signal-core{width:92px; height:92px; font-size:9px;}
  .blog-card,.blog-card-wide{padding:24px 21px;}
  .blog-card h3{font-size:30px;}
  .blog-card::after{right:10px; bottom:-24px; font-size:112px;}
  .blog-note>p{padding-left:0;}
}
@media (hover:none){
  .blog-feature:hover,.blog-card:hover{transform:none;}
  .blog-card:hover::before{transform:scaleX(.16);}
}

/* ---------- STANDALONE SECTION PAGES ---------- */
.section-page{min-height:100vh; display:flex; flex-direction:column;}
.section-site-header{position:sticky; top:0; z-index:100; border-bottom:1px solid var(--border); background:rgba(255,255,255,.94); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);}
.section-header-inner{width:min(100% - 40px,1180px); min-height:72px; margin:0 auto; display:flex; align-items:center; gap:18px;}
.section-page-brand{display:inline-flex; align-items:center; gap:10px; color:var(--navy); text-decoration:none; font-family:var(--serif); font-size:19px; font-weight:700;}
.section-page-brand img{width:36px; height:36px;}
.section-home-link{margin-left:auto; color:var(--text-mute); text-decoration:none; font-family:var(--mono); font-size:11px; font-weight:600;}
.section-home-link:hover{color:var(--navy);}
.section-menu{position:relative;}
.section-menu summary{min-height:42px; display:flex; align-items:center; padding:9px 15px; border:1px solid var(--border); border-radius:100px; color:var(--navy); background:#fff; cursor:pointer; font-family:var(--mono); font-size:11px; font-weight:600; list-style:none; transition:transform .22s cubic-bezier(.2,.8,.2,1), box-shadow .22s ease, border-color .22s ease;}
.section-menu summary::-webkit-details-marker{display:none;}
.section-menu summary::after{content:"+"; margin-left:9px; font-size:15px; line-height:1;}
.section-menu[open] summary::after{content:"−";}
.section-menu summary:hover,.section-menu summary:focus-visible{border-color:rgba(0,54,112,.28); box-shadow:0 10px 24px -14px rgba(0,54,112,.7); transform:translateY(-2px);}
.section-menu-links{position:absolute; top:calc(100% + 10px); right:0; width:min(320px,calc(100vw - 28px)); max-height:calc(100vh - 100px); overflow:auto; display:grid; gap:6px; padding:10px; border:1px solid var(--border); border-radius:16px; background:#fff; box-shadow:var(--shadow-lg);}
.section-menu-links a{min-height:42px; display:flex; align-items:center; padding:9px 11px; border-radius:9px; color:var(--text-mute); text-decoration:none; font-family:var(--mono); font-size:11px; transition:color .2s ease, background-color .2s ease, box-shadow .2s ease, transform .22s cubic-bezier(.2,.8,.2,1);}
.section-menu-links a:hover,.section-menu-links a:focus-visible{color:var(--navy); background:var(--surface-2); box-shadow:inset 3px 0 0 var(--signal), 0 8px 18px -14px rgba(0,54,112,.8); transform:translateX(5px);}
.section-menu-links a[aria-current="page"]{color:var(--navy); background:var(--surface-2); box-shadow:inset 3px 0 0 rgba(12,168,156,.55);}
.product-showcase{margin-top:52px; display:grid; gap:24px;}
.product-panel{position:relative; overflow:hidden; padding:38px; border:1px solid var(--border); border-radius:var(--r-lg); background:#fff; box-shadow:var(--card-shadow);}
.product-panel::after{content:""; position:absolute; width:220px; height:220px; right:-100px; bottom:-130px; border-radius:50%; background:rgba(0,54,112,.055); pointer-events:none;}
.product-panel-primary{border-color:rgba(12,168,156,.35); background:linear-gradient(135deg,#fff 0%,#F4FBFA 100%);}
.product-panel-heading{position:relative; z-index:1; display:flex; align-items:flex-start; justify-content:space-between; gap:24px;}
.product-index,.product-detail-label{display:block; color:var(--signal-text); font-family:var(--mono); font-size:10px; font-weight:700; letter-spacing:.11em; text-transform:uppercase;}
.product-panel h2{margin-top:12px; font-family:var(--display); font-size:clamp(32px,4vw,48px); line-height:1; letter-spacing:-.025em;}
.product-name{margin-top:9px; color:var(--navy); font-family:var(--mono); font-size:12px; font-weight:600;}
.product-status{flex:0 0 auto; padding:8px 12px; border:1px solid rgba(12,168,156,.28); border-radius:100px; background:var(--signal-tint); color:var(--signal-text); font-family:var(--mono); font-size:10px; font-weight:700; text-transform:uppercase;}
.product-status-development{border-color:var(--border); background:var(--surface); color:var(--text-mute);}
.product-summary{position:relative; z-index:1; max-width:850px; margin-top:28px; color:var(--text-mute); font-size:16px; line-height:1.7;}
.product-details{position:relative; z-index:1; margin-top:28px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px;}
.product-details > div{padding:20px; border:1px solid var(--border); border-radius:var(--r-sm); background:rgba(255,255,255,.72);}
.product-details p{margin-top:8px; color:var(--text-mute); font-size:13.5px; line-height:1.6;}
.product-actions{position:relative; z-index:1; margin-top:28px; display:flex; flex-wrap:wrap; gap:12px;}
.section-main{flex:1;}
.section-main > section{min-height:calc(100vh - 150px); background:var(--ink);}
.section-main > section.service-overview{background:var(--navy-deep);}
.section-main .section-page-title{font-family:var(--display); font-weight:600; font-size:clamp(28px,3.6vw,42px); letter-spacing:-.015em; max-width:760px; line-height:1.12;}
.section-page .reveal{opacity:1; transform:none;}
.section-page-footer{padding:30px 0; border-top:1px solid var(--border); background:#fff;}
.section-footer-inner{width:min(100% - 40px,1180px); margin:0 auto; display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; color:var(--text-faint); font-family:var(--mono); font-size:11px;}
.section-footer-links{display:flex; gap:16px; flex-wrap:wrap;}
.section-footer-links a{color:var(--text-mute); text-decoration:none;}
.section-footer-links a:hover{text-decoration:underline; text-underline-offset:4px;}
@media(max-width:640px){
  .section-header-inner{width:min(100% - 24px,1180px); min-height:64px; gap:10px;}
  .section-page-brand{font-size:16px;}
  .section-page-brand img{width:32px; height:32px;}
  .section-home-link{display:none;}
  .section-menu{margin-left:auto;}
  .section-main > section{padding-top:72px; padding-bottom:72px;}
  .section-footer-inner{width:min(100% - 28px,1180px);}
  .product-showcase{margin-top:38px; gap:18px;}
  .product-panel{padding:26px 22px;}
  .product-panel-heading{display:block;}
  .product-status{display:inline-flex; margin-top:18px;}
  .product-details{grid-template-columns:1fr; gap:12px;}
  .product-actions{display:grid; grid-template-columns:1fr;}
  .product-actions .btn{justify-content:center; text-align:center;}
}
