:root{
    --bg:#FCFCFC;
    --panel:#F5F7FA;
    --panel-blue:#F5F7FA;
    --ink:#111827;
    --primary:#111827;
    --ink-soft:#EEF1F4;
    --slate:#5B6472;
    --slate-soft:#9CA6B0;
    --line:#E5E7EB;
    --secondary:#4B6D98;
    --secondary-soft:#F0F4FA;
    --tertiary:#5F7267;
    --tertiary-soft:#F0F4F1;
    --quaternary:#A85830;
    --white:#FFFFFF;
  }
  *{ box-sizing:border-box; margin:0; padding:0; }
  html{ scroll-behavior:smooth; }
  body{ background:var(--bg); color:var(--ink); font-family:'Inter Tight',sans-serif; font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased; }
  .eyebrow{ font-family:'Inter Tight',sans-serif; font-weight:700; font-size:12px; letter-spacing:0.08em; text-transform:uppercase; display:flex; align-items:center; gap:10px; color:var(--secondary); }
  .eyebrow::before{ content:''; width:20px; height:1px; background:currentColor; display:inline-block; }
  h1,h3{ font-family:'Geist',sans-serif; font-weight:600; letter-spacing:-0.01em; }
  h2{ font-family:'Source Serif 4',serif; font-weight:600; letter-spacing:-0.005em; }
  a{ color:inherit; }
  .wrap{ max-width:1080px; margin:0 auto; padding:0 40px; }

  nav{ position:sticky; top:0; z-index:50; background:var(--primary); border-bottom:1px solid rgba(255,255,255,0.08); }
  nav .wrap{ display:flex; justify-content:space-between; align-items:center; height:64px; }
  .nav-brand{ display:flex; align-items:center; gap:10px; }
  .nav-avatar{ width:30px; height:30px; border-radius:50%; object-fit:cover; flex-shrink:0; display:block; border:1.5px solid rgba(255,255,255,0.25); }
  .nav-name{ font-family:'Inter Tight',sans-serif; font-weight:700; font-size:17px; color:var(--white); }
  .nav-back{ font-family:'Inter Tight',sans-serif; font-weight:600; font-size:12px; letter-spacing:0.01em; color:rgba(255,255,255,0.75); display:flex; align-items:center; gap:8px; text-decoration:none; transition:color .2s ease; }
  .nav-back:hover{ color:var(--secondary); }
  .nav-right{ display:flex; align-items:center; gap:26px; }
  .nav-divider{ width:1px; height:18px; background:rgba(255,255,255,0.18); }
  .nav-linkedin{ display:flex; align-items:center; color:rgba(255,255,255,0.75); transition:color .2s ease; }
  .nav-linkedin:hover{ color:var(--secondary); }

  header.hero{ padding:88px 0 0; }
  .hero-meta-row{ display:flex; justify-content:space-between; align-items:flex-start; color:var(--slate); margin-bottom:34px; }
  .hero h1{ font-family:'Source Serif 4',serif; font-size:clamp(34px,5vw,56px); line-height:1.1; max-width:820px; margin-bottom:24px; font-weight:600; letter-spacing:-0.01em; }
  .hero h1 .accent-green{ color:var(--secondary); }
  .hero-sub{ max-width:600px; font-size:18px; color:var(--slate); margin-bottom:46px; }
  .hero-meta{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .hero-meta > div{ background:var(--white); padding:14px 16px; display:flex; flex-direction:column; gap:6px; }
  .hero-meta > div:first-child{ padding-left:40px; }
  .hero-meta > div:last-child{ padding-right:40px; }
  .hero-meta .label{ font-family:'Inter Tight',sans-serif; font-weight:500; font-size:10px; letter-spacing:0.02em; color:var(--secondary); line-height:1; margin:0; }
  .hero-meta .value{ font-size:12px; font-weight:500; color:var(--ink); line-height:1; margin:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .product-system{ background:var(--primary); border-bottom:1px solid var(--line); padding:32px 0; }
  .product-system-eyebrow{ font-family:'Inter Tight',sans-serif; font-weight:700; font-size:10px; letter-spacing:0.12em; text-transform:uppercase; color:#969DA5; margin-bottom:24px; }
  .product-system-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:rgba(255,255,255,0.1); border-radius:8px; overflow:hidden; }
  .product-system-card{ background:var(--primary); padding:24px 28px; }
  .product-system-card.internal{ background:#1C2332; }
  .product-system-row{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
  .product-system-tag{ font-family:'Inter Tight',sans-serif; font-weight:500; font-size:10px; letter-spacing:0.1em; text-transform:uppercase; color:#8FB3E0; }
  .product-system-tag.muted{ color:#969DA5; }
  .product-system-idx{ font-family:'Inter Tight',sans-serif; font-weight:600; font-size:10px; color:#969DA5; }
  .product-system-title{ font-size:15px; font-weight:600; color:var(--white); margin-bottom:8px; }
  .product-system-card p{ font-size:14.5px; color:#969DA5; line-height:1.6; }
  .glossary-item strong{ color:var(--ink); }

  .diagram-wrap{ background:var(--panel); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .diagram-wrap svg{ display:block; width:100%; height:auto; }
  .diagram-caption{ padding:16px 0 34px; font-weight:600; }
  .diagram-caption .wrap{ display:flex; justify-content:space-between; font-family:'Inter Tight',sans-serif; font-size:11.5px; letter-spacing:0.01em; }
  .diagram-caption .before-tag{ color:var(--secondary); }
  .diagram-caption .after-tag{ color:var(--ink); }

  section{ padding:96px 0; border-bottom:1px solid var(--line); }
  section.panel{ background:var(--panel); }
  .section-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:40px; margin-bottom:52px; }
  .section-head h2{ font-size:clamp(24px,3.2vw,34px); max-width:600px; }
  .section-head .note{ max-width:280px; font-size:14.5px; color:var(--slate); padding-bottom:4px; }

  .chip-list{ display:flex; flex-direction:column; }
  .chip{ display:flex; align-items:baseline; gap:16px; padding:15px 0; border-top:1px solid var(--line); font-size:15px; }
  .chip:last-child{ border-bottom:1px solid var(--line); }
  .chip .n{ font-family:'Inter Tight',sans-serif; font-weight:500; font-size:11px; color:var(--secondary); flex-shrink:0; width:22px; }

  .phase{ display:grid; grid-template-columns:110px 1fr; gap:32px; padding:40px 0; border-top:1px solid var(--line); }
  .phase:first-child{ border-top:none; padding-top:0; }
  .phase-num{ font-family:'Inter Tight',sans-serif; font-weight:700; font-size:12px; color:var(--ink); letter-spacing:0.01em; padding-top:4px; }
  .phase-num .big{ display:block; font-family:'Inter Tight',sans-serif; font-size:38px; color:var(--ink); font-weight:600; line-height:1; margin-top:6px; }
  .phase h3{ font-size:21px; margin-bottom:12px; font-weight:600; }
  .phase p{ color:var(--slate); font-size:15px; max-width:640px; }
  .phase .tag{ display:inline-block; font-family:'Inter Tight',sans-serif; font-weight:500; font-size:10.5px; letter-spacing:0.02em; color:var(--ink); background:var(--ink-soft); border-radius:20px; padding:6px 13px; margin-top:16px; }
  .evidence-block{ background:var(--white); border:1px solid var(--line); border-radius:12px; padding:36px 40px; margin:8px 0 40px; box-shadow:0 1px 3px rgba(14,42,71,0.05); }
  .evidence-eyebrow{ font-family:'Inter Tight',sans-serif; font-weight:700; font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--secondary); margin-bottom:12px; }
  .evidence-block h4{ font-family:'Inter Tight',sans-serif; font-size:20px; font-weight:600; margin-bottom:16px; line-height:1.35; }
  .evidence-block p{ font-size:15px; color:var(--slate); line-height:1.65; max-width:760px; margin-bottom:16px; }
  .evidence-block svg{ display:block; width:100%; height:auto; margin:28px 0 18px; }
  .evidence-legend{ display:flex; flex-wrap:wrap; gap:24px; margin-bottom:20px; font-size:13px; color:var(--slate); }
  .evidence-legend .dot{ display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:8px; }

  .impact-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
  .lifecycle-section{ background:var(--primary); padding:120px 0; position:relative; overflow:hidden; }
  .lifecycle-section::before, .lifecycle-section::after{ content:''; position:absolute; border-radius:50%; filter:blur(90px); pointer-events:none; z-index:0; }
  .lifecycle-section::before{ width:420px; height:420px; top:-140px; left:-120px; background:rgba(75,109,152,0.35); }
  .lifecycle-section::after{ width:380px; height:380px; bottom:-160px; right:-100px; background:rgba(183,89,26,0.22); }
  .lifecycle-section .wrap{ position:relative; z-index:1; }
  .lifecycle-hero .section-head .eyebrow{ color:#8FB3E0; }
  .lifecycle-section h2{ color:var(--white); }
  .lifecycle-section .note{ color:#969DA5; }
  .lifecycle-image-halo{ position:relative; padding:48px 0; border-radius:20px; background:radial-gradient(ellipse 78% 65% at 50% 46%, rgba(75,109,152,0.55), transparent 70%), radial-gradient(ellipse 45% 45% at 88% 80%, rgba(95,114,103,0.25), transparent 70%); }
  .lifecycle-image-halo img{ display:block; width:100%; height:auto; border-radius:10px; box-shadow:0 30px 80px rgba(0,0,0,0.45), 0 10px 30px rgba(0,0,0,0.3); }
  .lifecycle-figure{ margin:0; }
  .lifecycle-hero{ display:block; margin-bottom:64px; }
  .lifecycle-hero .lifecycle-figure{ margin-top:36px; }

  .kpi-section{ background:var(--panel); padding:96px 0; border-bottom:1px solid var(--line); }
  .kpi-groups{ display:flex; flex-direction:column; gap:20px; margin-top:8px; }
  .kpi-group{ background:var(--white); border:1px solid var(--line); border-radius:10px; overflow:hidden; }
  .kpi-group-head{ background:var(--white); border-bottom:1px solid var(--line); padding:24px 28px; }
  .kpi-group-eyebrow{ font-family:'Inter Tight',sans-serif; font-weight:500; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--secondary); margin-bottom:18px; }
  .kpi-group-flow{ display:flex; align-items:flex-start; gap:24px; }
  .kpi-flow-col{ flex:1; min-width:0; }
  .kpi-group-problem-label{ font-family:'Inter Tight',sans-serif; font-size:10.5px; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:var(--slate); margin-bottom:8px; }
  .kpi-group-solution-label{ font-family:'Inter Tight',sans-serif; font-size:10.5px; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:var(--secondary); margin-bottom:8px; }
  .kpi-flow-text{ font-size:14.5px; color:var(--ink); line-height:1.55; }
  .kpi-flow-arrow{ flex-shrink:0; width:28px; height:14px; color:var(--secondary); align-self:flex-start; margin-top:27px; }
  .kpi-flow-arrow svg{ display:block; width:100%; height:100%; }
  .kpi-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); }
  .kpi-card{ background:var(--white); padding:20px 24px; display:flex; flex-direction:column; }
  .kpi-target{ font-size:26px; font-weight:700; color:var(--secondary); line-height:1; margin-bottom:6px; }
  .kpi-name{ font-size:13px; font-weight:600; color:var(--ink); margin-bottom:6px; }
  .kpi-desc{ font-size:12px; color:var(--slate); line-height:1.55; }
  .kpi-footnote{ margin-top:32px; font-size:12px; color:var(--slate); max-width:680px; line-height:1.65; }
  .impact-grid.cols-4{ grid-template-columns:repeat(4,1fr); }
  .impact-card{ background:var(--white); border:1px solid var(--line); border-radius:4px; padding:34px 30px; }
  .impact-card .eyebrow{ margin-bottom:20px; }
  .impact-card ul{ list-style:none; display:flex; flex-direction:column; gap:13px; }
  .impact-card li{ font-size:14.5px; color:var(--slate); padding-left:18px; position:relative; line-height:1.5; }
  .impact-card li::before{ content:''; position:absolute; left:0; top:8px; width:6px; height:6px; background:var(--ink); border-radius:50%; }

  .quote-section{ padding:100px 0; background:var(--panel); border-bottom:1px solid var(--line); }
  .thesis-statement{ font-family:'Source Serif 4',serif; font-size:clamp(22px,2.8vw,30px); font-weight:600; color:var(--ink); line-height:1.4; max-width:760px; margin-bottom:44px; }
  blockquote{ font-family:'Inter Tight',sans-serif; font-size:clamp(22px,3.2vw,32px); font-weight:400; line-height:1.4; max-width:820px; color:var(--ink); }
  blockquote::before, blockquote::after{ color:var(--secondary); }
  blockquote::before{ content:'“'; }
  blockquote::after{ content:'”'; }
  .quote-highlight{ color:var(--secondary); font-weight:600; }
  .quote-attr{ margin-top:26px; font-family:'Inter Tight',sans-serif; font-weight:600; font-size:13px; color:var(--slate); letter-spacing:0.01em; }

  .demo-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:36px; }
  .demo-item{ border-top:2px solid var(--ink); padding-top:16px; }
  .demo-item p{ font-size:14.5px; color:var(--slate); }
  .demo-item .k{ font-weight:600; display:block; margin-bottom:8px; font-size:15.5px; }

  footer{ padding:100px 0 70px; border-bottom:none; background:var(--primary); }
  footer h2{ font-size:clamp(19px,2.2vw,24px); font-weight:600; max-width:520px; margin-bottom:40px; color:var(--white); }
  .footer-links{ display:flex; gap:28px; flex-wrap:wrap; margin-bottom:48px; }
  .footer-links a{ font-family:'Inter Tight',sans-serif; font-weight:600; font-size:12.5px; letter-spacing:0.01em; text-decoration:none; color:#969DA5; border-bottom:1px solid rgba(255,255,255,0.2); padding-bottom:3px; transition:color .2s ease, border-color .2s ease; }
  .footer-links a:hover{ color:#8FB3E0; border-color:#8FB3E0; }
  .contact-list{ display:flex; flex-direction:column; max-width:380px; }
  .contact-row{ display:flex; align-items:center; justify-content:flex-start; gap:16px; width:100%; padding:16px 0; border-top:1px solid rgba(255,255,255,0.12); color:inherit; text-decoration:none; font-family:'Inter Tight',sans-serif; cursor:pointer; background:none; border-left:none; border-right:none; border-bottom:none; text-align:left; }
  .contact-list a.contact-row:last-child, .contact-list button.contact-row:last-child{ border-bottom:1px solid rgba(255,255,255,0.12); }
  .contact-row-icon{ flex-shrink:0; width:20px; height:20px; display:flex; align-items:center; justify-content:center; color:#8FB3E0; }
  .contact-detail{ display:block; font-size:16px; font-weight:500; color:var(--white); transition:color .2s ease; }
  .contact-row:hover .contact-detail{ color:#8FB3E0; }

  @media (max-width:860px){
    .wrap{ padding:0 24px; }
    .hero-meta{ grid-template-columns:1fr; }
    .hero-meta > div{ padding-left:22px; padding-right:22px; }
    .hero-meta > div:first-child, .hero-meta > div:last-child{ padding-left:22px; padding-right:22px; }
    .product-system-grid{ grid-template-columns:1fr; }
    .impact-grid{ grid-template-columns:1fr; }
    .impact-grid.cols-4{ grid-template-columns:repeat(2,1fr); }
    .kpi-cards{ grid-template-columns:1fr; }
    .kpi-group-flow{ flex-direction:column; align-items:flex-start; gap:14px; }
    .kpi-flow-arrow{ transform:rotate(90deg); margin-left:4px; }
    .demo-grid{ grid-template-columns:1fr; gap:26px; }
    .phase{ grid-template-columns:1fr; gap:8px; }
    .section-head{ flex-direction:column; align-items:flex-start; gap:16px; }
    section{ padding:60px 0; }
    .lifecycle-section{ padding:72px 0; }
  }
  @media (max-width:600px){
    .wrap{ padding:0 20px; }
    .impact-grid.cols-4{ grid-template-columns:1fr; }
    header.hero{ padding:56px 0 0; }
  }
