:root{
    --cream:#FFFCF3;
    --navy:#1B394F;
    --navy-ink:#12293A;
    --brass:#C48A3E;
    --brass-light:#DDB679;
    --fog:#ECE6D6;
    --slate:#5B7182;
    --line: rgba(27,57,79,0.14);
    --line-light: rgba(255,252,243,0.16);
    --maxw: 1440px;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--cream);
    color:var(--navy);
    font-family:'Inter', sans-serif;
    font-size:16px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  img{max-width:100%; display:block;}
  a{color:inherit; text-decoration:none;}
  .wrap{max-width:var(--maxw); margin:0 auto; padding:0 56px;}
  h1,h2,h3,h4{font-family:'Fraunces', serif; font-weight:600; line-height:1.08; letter-spacing:-0.01em;}
  .eyebrow{
    font-family:'Space Mono', monospace;
    font-size:12.5px;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--brass);
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:18px;
  }
  .eyebrow::before{
    content:"";
    width:8px; height:8px;
    border:1.5px solid var(--brass);
    border-radius:50%;
    box-shadow: inset 0 0 0 2px var(--cream);
    flex-shrink:0;
  }
  .eyebrow.on-dark{ color:var(--brass-light); }
  .eyebrow.on-dark::before{ box-shadow: inset 0 0 0 2px var(--navy); }
  .eyebrow.right{ justify-content:flex-end; }

  .btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    font-family:'Inter', sans-serif;
    font-weight:600;
    font-size:15px;
    padding:15px 26px;
    border-radius:2px;
    border:1.5px solid transparent;
    cursor:pointer;
    transition: transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
    white-space:nowrap;
  }
  .btn-primary{ background:var(--brass); color:var(--navy-ink); }
  .btn-primary:hover{ background:var(--brass-light); transform:translateY(-1px); }
  .btn-ghost{ border-color:currentColor; color:var(--cream); background:transparent; }
  .btn-ghost:hover{ background:rgba(255,252,243,0.08); transform:translateY(-1px); }
  .btn-outline-navy{ border-color:var(--navy); color:var(--navy); background:transparent; }
  .btn-outline-navy:hover{ background:var(--navy); color:var(--cream); }
  .btn svg{ width:14px; height:14px; }

  /* ===== NAV ===== */
  header{
    position:sticky; top:0; z-index:50;
    background:rgba(255,252,243,0.92);
    backdrop-filter: blur(8px);
    border-bottom:1px solid var(--line);
  }
  nav.wrap{
    display:flex; align-items:center; justify-content:space-between;
    height:84px;
  }
  .logo{ display:flex; align-items:center; }
  .logo img{ height:60px; width:auto; object-fit:contain; }

  .nav-links{ display:flex; align-items:center; gap:38px; font-size:14.5px; font-weight:500; }
  .nav-links a{ position:relative; color:var(--navy); padding:4px 0; }
  .nav-links a::after{
    content:""; position:absolute; left:0; right:0; bottom:-2px; height:1.5px;
    background:var(--brass); transform:scaleX(0); transform-origin:left;
    transition:transform .2s ease;
  }
  .nav-links a:hover::after{ transform:scaleX(1); }
  .nav-cta{ display:flex; align-items:center; gap:28px; }
  .nav-cta .btn{ padding:11px 20px; font-size:14px; }
  .menu-toggle{ display:none; background:none; border:none; cursor:pointer; padding:8px; }
  .menu-toggle span{ display:block; width:22px; height:1.5px; background:var(--navy); margin:5px 0; }

  /* ===== HERO ===== */
  .hero{ position:relative; padding:84px 0 76px; overflow:hidden; }
  .hero .wrap{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:64px;
    align-items:center;
  }
  .hero h1{ font-size:clamp(36px, 4vw, 56px); color:var(--navy); margin-bottom:20px; }
  .hero h1 em{ font-style:italic; font-weight:500; color:var(--brass); }
  .hero p.lead{ font-size:17px; color:var(--slate); max-width:460px; margin-bottom:32px; }
  .hero-actions{ display:flex; align-items:center; gap:26px; flex-wrap:wrap; }
  .hero-actions .secondary-link{
    font-size:14.5px; font-weight:600; color:var(--navy);
    display:flex; align-items:center; gap:8px;
    border-bottom:1.5px solid var(--navy); padding-bottom:2px;
  }

  /* ===== SIGNATURE VISUAL: precision growth chart ===== */
  .signature-wrap{ display:flex; align-items:center; justify-content:center; }
  .signature{ width:100%; max-width:460px; }
  .sig-panel{ fill:var(--cream); stroke:var(--line); stroke-width:1; }
  .sig-mono{ font-family:'Space Mono', monospace; letter-spacing:0.08em; }

  /* ===== STATS STRIP ===== */
  .stats-strip{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .stats-row{ display:grid; grid-template-columns:1fr 1fr 1fr; }
  .stat-block{ padding:34px 40px; text-align:center; border-left:1px solid var(--line); }
  .stat-block:first-child{ border-left:none; }
  .stat-num{ font-family:'Space Mono', monospace; font-size:32px; font-weight:700; color:var(--brass); line-height:1; margin-bottom:8px; }
  .stat-label{ font-size:13.5px; color:var(--navy); font-weight:500; max-width:260px; margin:0 auto; }
  .stat-caption{ text-align:center; padding:16px 32px 22px; font-size:13px; color:var(--slate); border-top:1px dashed var(--line); }
  .stat-caption strong{ color:var(--navy); font-weight:600; }

  /* ===== TICK DIVIDER ===== */
  .tick-divider{ width:100%; height:26px; overflow:hidden; }
  .tick-divider svg{ width:100%; height:100%; display:block; }

  /* ===== POSITIONING (dark, image + text) ===== */
  .positioning{ background:var(--navy); color:var(--cream); padding:88px 0; position:relative; }
  .positioning .wrap{
    display:grid;
    grid-template-columns:0.8fr 1.2fr;
    gap:72px;
    align-items:center;
  }
  .focus-visual{ width:100%; aspect-ratio:1/1; max-width:340px; }
  .positioning h2{ font-size:clamp(26px, 3vw, 36px); color:var(--cream); margin-bottom:22px; }
  .positioning p{ font-size:16.5px; color:rgba(255,252,243,0.78); margin-bottom:16px; max-width:560px; }
  .positioning p:last-of-type{ margin-bottom:0; }
  .positioning strong{ color:var(--brass-light); font-weight:600; }

  /* ===== SECTION generic ===== */
  section.pad{ padding:96px 0; }
  .section-head{ max-width:640px; margin-bottom:52px; }
  .section-head.right{ margin-left:auto; text-align:right; }
  .section-head.right .eyebrow{ justify-content:flex-end; }
  .section-head h2{ font-size:clamp(28px, 3.2vw, 38px); margin-bottom:16px; }
  .section-head p{ color:var(--slate); font-size:16.5px; }

  /* ===== SERVICES ===== */
  .services-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
  .service-card{ background:var(--cream); padding:38px 34px; transition:background .2s ease; }
  .service-card:hover{ background:var(--fog); }
  .service-icon{ width:42px; height:42px; margin-bottom:22px; color:var(--navy); }
  .service-icon svg{ width:100%; height:100%; stroke:var(--navy); fill:none; stroke-width:1.4; }
  .service-card h3{ font-size:19px; font-weight:600; margin-bottom:10px; color:var(--navy); }
  .service-card p{ font-size:14.5px; color:var(--slate); line-height:1.55; }

  /* ===== PROCESS (stepper with connector) ===== */
  .process{ background:var(--fog); }
  .stepper{ position:relative; display:grid; grid-template-columns:repeat(4, 1fr); gap:0; }
  .stepper::before{
    content:""; position:absolute; top:26px; left:calc(12.5% - 0px); right:calc(12.5% - 0px); height:1px;
    background-image: linear-gradient(90deg, var(--brass) 0 8px, transparent 8px 16px);
    background-size:16px 1px; background-repeat:repeat-x; z-index:0;
  }
  .step{ position:relative; z-index:1; padding:0 26px; text-align:left; }
  .step-marker{
    width:52px; height:52px; border-radius:50%; background:var(--fog);
    border:1.5px solid var(--navy); display:flex; align-items:center; justify-content:center;
    margin-bottom:22px; position:relative;
  }
  .step-marker svg{ width:22px; height:22px; stroke:var(--navy); fill:none; stroke-width:1.5; }
  .step-num{
    position:absolute; top:-8px; right:-8px; width:22px; height:22px; border-radius:50%;
    background:var(--brass); color:var(--navy-ink); font-family:'Space Mono', monospace; font-size:11px; font-weight:700;
    display:flex; align-items:center; justify-content:center;
  }
  .step h3{ font-size:19px; margin-bottom:8px; color:var(--navy); }
  .step p{ color:var(--slate); font-size:14.5px; line-height:1.55; }

  /* ===== CASE STUDIES ===== */
  .case-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:28px; }
  .case-card{ border:1px solid var(--line); background:var(--cream); padding:34px 30px; display:flex; flex-direction:column; transition: border-color .2s ease, transform .2s ease; }
  .case-card:hover{ border-color:var(--brass); transform:translateY(-3px); }
  .case-stat{ font-family:'Space Mono', monospace; font-size:40px; font-weight:700; color:var(--navy); line-height:1; margin-bottom:6px; }
  .case-stat span{ color:var(--brass); }
  .case-stat-label{ font-family:'Space Mono', monospace; font-size:11.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--slate); margin-bottom:26px; }
  .case-card h3{ font-size:19px; margin-bottom:6px; color:var(--navy); }
  .case-card .client-desc{ font-size:13.5px; color:var(--slate); margin-bottom:16px; font-style:italic; }
  .case-card .what{ font-size:14.5px; color:var(--navy); line-height:1.55; margin-bottom:24px; flex-grow:1; }
  .case-link{ font-family:'Space Mono', monospace; font-size:12.5px; letter-spacing:0.06em; color:var(--navy); display:flex; align-items:center; gap:8px; padding-top:16px; border-top:1px solid var(--line); }
  .case-link svg{ width:12px; height:12px; transition:transform .18s ease; }
  .case-card:hover .case-link svg{ transform:translateX(3px); }

  /* ===== FINAL CTA (left content / right action, not centered) ===== */
  .final-cta{ background:var(--navy); color:var(--cream); padding:96px 0; position:relative; overflow:hidden; }
  .final-cta .wrap{
    display:grid;
    grid-template-columns:1.3fr 0.7fr;
    gap:56px;
    align-items:center;
  }
  .final-cta h2{ font-size:clamp(28px,3.6vw,42px); color:var(--cream); margin-bottom:18px; }
  .final-cta p{ color:rgba(255,252,243,0.75); font-size:17px; max-width:480px; }
  .final-cta-action{ display:flex; flex-direction:column; align-items:flex-start; gap:16px; border-left:1px solid var(--line-light); padding-left:40px; }
  .final-cta-action .btn{ width:100%; justify-content:center; }

  /* ===== FOOTER ===== */
  footer{ background:var(--navy-ink); color:rgba(255,252,243,0.62); padding:64px 0 32px; }
  .footer-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:48px; padding-bottom:48px; border-bottom:1px solid var(--line-light); }
  .footer-brand .logo{
    background:var(--cream);
    display:inline-flex;
    padding:14px 18px;
    border-radius:4px;
    margin-bottom:18px;
  }
  .footer-brand .logo img{ height:76px; width:auto; }
  .footer-brand p{ font-size:14px; max-width:280px; line-height:1.6; }
  .footer-col h4{ font-family:'Space Mono', monospace; font-size:11.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--brass-light); margin-bottom:18px; font-weight:700; }
  .footer-col a, .footer-col p{ display:block; font-size:14.5px; margin-bottom:12px; color:rgba(255,252,243,0.72); }
  .footer-col a:hover{ color:var(--cream); }
  .footer-bottom{ display:flex; justify-content:space-between; align-items:center; padding-top:28px; font-size:12.5px; font-family:'Space Mono', monospace; color:rgba(255,252,243,0.4); flex-wrap:wrap; gap:12px; }

  /* ===== REVEAL ===== */
  [data-reveal]{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
  [data-reveal].is-visible{ opacity:1; transform:translateY(0); }

  /* ===== RESPONSIVE ===== */
  @media (max-width:1100px){
    .wrap{ padding:0 36px; }
  }
  @media (max-width:960px){
    .hero .wrap{ grid-template-columns:1fr; gap:44px; }
    .signature-wrap{ order:-1; }
    .signature{ max-width:320px; }
    .services-grid{ grid-template-columns:repeat(2,1fr); }
    .case-grid{ grid-template-columns:1fr; }
    .footer-top{ grid-template-columns:1fr; gap:36px; }
    .positioning .wrap{ grid-template-columns:1fr; gap:36px; }
    .focus-visual{ max-width:220px; margin:0 auto; }
    .stats-row{ grid-template-columns:1fr; }
    .stat-block{ border-left:none; border-top:1px solid var(--line); }
    .stat-block:first-child{ border-top:none; }
    .stepper{ grid-template-columns:1fr; gap:36px; }
    .stepper::before{ display:none; }
    .section-head.right{ text-align:left; margin-left:0; }
    .section-head.right .eyebrow{ justify-content:flex-start; }
    .final-cta .wrap{ grid-template-columns:1fr; gap:32px; }
    .final-cta-action{ border-left:none; padding-left:0; border-top:1px solid var(--line-light); padding-top:28px; }
  }
  @media (max-width:720px){
    .nav-links, .nav-cta .btn{ display:none; }
    .menu-toggle{ display:block; }
    .wrap{ padding:0 22px; }
    .hero{ padding:52px 0 52px; }
    .positioning, section.pad, .final-cta{ padding:60px 0; }
    .services-grid{ grid-template-columns:1fr; }
    .logo img{ height:48px; }
  }

  /* ===== PAGE HEADER (Services / Case Studies) ===== */
  .page-header{ padding:64px 0 48px; border-bottom:1px solid var(--line); }
  .page-header h1{ font-size:clamp(32px, 3.6vw, 44px); max-width:760px; margin-bottom:16px; }
  .page-header p.lead{ font-size:17.5px; color:var(--slate); max-width:600px; }
  .page-header .eyebrow{ margin-bottom:18px; }
  .wrap-case{ max-width:1180px; margin:0 auto; padding:0 56px; }
  .view-all-link{
    display:inline-flex; align-items:center; gap:8px;
    font-family:'Space Mono', monospace; font-size:13px; letter-spacing:0.05em;
    color:var(--navy); border-bottom:1.5px solid var(--navy); padding-bottom:2px; margin-top:8px;
  }
  .view-all-link svg{ width:13px; height:13px; }

  /* ===== SERVICE DETAIL BLOCKS ===== */
  .service-detail{
    padding:84px 0;
    border-bottom:1px solid var(--line);
  }
  .service-detail.tint{ background:var(--navy); border-bottom-color:var(--line-light); }
  .service-detail.tint .service-detail-num{ color:var(--brass-light); }
  .service-detail.tint h2{ color:var(--cream); }
  .service-detail.tint .one-liner{ color:rgba(255,252,243,0.72); }
  .service-detail.tint .service-bullets li{ color:var(--cream); }
  .service-detail.tint .service-bullets li::before{ background:var(--brass-light); }
  .service-detail .wrap{
    display:grid;
    grid-template-columns:1.15fr 0.85fr;
    gap:64px;
    align-items:stretch;
  }
  .service-detail.reverse .wrap{ direction:rtl; }
  .service-detail.reverse .wrap > *{ direction:ltr; }
  .service-detail-num{
    font-family:'Space Mono', monospace; font-size:13px; color:var(--brass);
    letter-spacing:0.14em; margin-bottom:16px; display:block; text-transform:uppercase;
  }
  .service-detail h2{ font-size:clamp(30px,3.6vw,44px); margin-bottom:16px; }
  .service-detail .one-liner{ font-size:17px; color:var(--slate); max-width:520px; margin-bottom:32px; line-height:1.55; }
  .service-bullets{ list-style:none; display:flex; flex-direction:column; gap:14px; max-width:540px; }
  .service-bullets li{
    display:flex; align-items:flex-start; gap:12px;
    font-size:15px; color:var(--navy); line-height:1.55;
  }
  .service-bullets li::before{
    content:""; width:6px; height:6px; margin-top:8px; flex-shrink:0;
    background:var(--brass); border-radius:1px; transform:rotate(45deg);
  }

  /* ===== METRIC PANEL: diagonal orb pair (no box, no divider) ===== */
  .metric-panel{
    display:flex; align-items:center; justify-content:center;
  }

  .metric-diagonal{
    position:relative;
    width:100%;
    max-width:400px;
    height:440px;
  }

  .metric-orb{ position:absolute; width:210px; text-align:center; }
  .metric-orb.orb-a{ top:0; left:0; }
  .metric-orb.orb-b{ bottom:0; right:0; }

  .orb-circle{
    width:170px; height:170px; border-radius:50%;
    background:var(--cream); border:1.5px solid var(--navy);
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    margin:0 auto 18px; position:relative;
  }
  .service-detail.tint .orb-circle{ background:transparent; border-color:var(--brass-light); }

  .orb-icon{ width:28px; height:28px; margin-bottom:10px; }
  .orb-icon svg{ width:100%; height:100%; stroke:var(--brass); fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
  .service-detail.tint .orb-icon svg{ stroke:var(--brass-light); }

  .orb-num{ font-family:'Space Mono', monospace; font-weight:700; font-size:32px; color:var(--navy); line-height:1; }
  .orb-num span{ color:var(--brass); }
  .service-detail.tint .orb-num{ color:var(--cream); }
  .service-detail.tint .orb-num span{ color:var(--brass-light); }

  .orb-tag{
    display:inline-block; font-family:'Space Mono', monospace; font-size:11px; letter-spacing:0.05em;
    text-transform:uppercase; color:var(--brass); border:1px solid var(--brass); padding:4px 11px;
    margin-bottom:10px;
  }
  .service-detail.tint .orb-tag{ color:var(--brass-light); border-color:var(--brass-light); }

  .orb-desc{ font-size:14px; color:var(--slate); line-height:1.4; }
  .service-detail.tint .orb-desc{ color:rgba(255,252,243,0.72); }

  @media (max-width:900px){
    .service-detail .wrap{ grid-template-columns:1fr; gap:36px; align-items:start; }
    .service-detail.reverse .wrap{ direction:ltr; }
  }
  @media (max-width:520px){
    .metric-diagonal{
      max-width:280px; height:auto;
      display:flex; flex-direction:column; gap:32px; align-items:center;
    }
    .metric-orb{ position:static; width:100%; max-width:220px; }
  }

  /* ===== WIDE CASE STUDY CARDS ===== */
  .wide-case{
    padding:56px 0;
    border-bottom:1px solid var(--line);
  }
  .wide-case .wrap{
    display:grid;
    grid-template-columns:1.3fr 0.7fr;
    gap:60px;
  }
  .wide-case-head{ display:flex; align-items:baseline; gap:16px; margin-bottom:6px; flex-wrap:wrap; }
  .wide-case-head h2{ font-size:clamp(24px,2.6vw,32px); }
  .wide-case-tag{
    font-family:'Space Mono', monospace; font-size:11px; letter-spacing:0.08em;
    text-transform:uppercase; color:var(--brass); border:1px solid var(--brass); padding:4px 10px;
  }
  .wide-case-desc{ font-size:14.5px; color:var(--slate); font-style:italic; margin-bottom:22px; }
  .wide-case-block-label{
    font-family:'Space Mono', monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase;
    color:var(--brass); margin-bottom:10px; margin-top:22px;
  }
  .wide-case-block-label:first-of-type{ margin-top:0; }
  .wide-case p.body{ font-size:15px; color:var(--navy); line-height:1.6; max-width:640px; }
  .wide-case-bullets{ list-style:none; display:flex; flex-direction:column; gap:10px; max-width:640px; }
  .wide-case-bullets li{ display:flex; align-items:flex-start; gap:10px; font-size:14.5px; color:var(--navy); line-height:1.55; }
  .wide-case-bullets li::before{
    content:""; width:6px; height:6px; margin-top:7px; flex-shrink:0;
    background:var(--brass); border-radius:1px; transform:rotate(45deg);
  }
  .wide-case-stats{
    display:flex; flex-direction:column; gap:0;
    border-left:1px solid var(--line); padding-left:44px;
  }
  .wide-case-stat{ padding:20px 0; border-bottom:1px dashed var(--line); }
  .wide-case-stat:last-child{ border-bottom:none; }
  .wide-case-stat .num{ font-family:'Space Mono', monospace; font-weight:700; font-size:36px; color:var(--navy); line-height:1; margin-bottom:6px; }
  .wide-case-stat .num span{ color:var(--brass); }
  .wide-case-stat .label{ font-family:'Space Mono', monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--slate); }

  @media (max-width:900px){
    .wide-case .wrap{ grid-template-columns:1fr; gap:32px; }
    .wide-case-stats{ border-left:none; padding-left:0; border-top:1px solid var(--line); padding-top:24px; flex-direction:row; flex-wrap:wrap; gap:28px; }
    .wide-case-stat{ padding:0; border-bottom:none; flex:1 1 40%; }
  }

  /* ===== CASE HERO MOSAIC ===== */
  .case-hero-mosaic{
    display:grid; grid-template-columns:repeat(5, 1fr); gap:3px;
    margin-top:48px; border:1px solid var(--line);
  }
  .case-hero-mosaic .tile{ aspect-ratio:1/1; overflow:hidden; background:var(--navy); }
  .case-hero-mosaic .tile img{ width:100%; height:100%; object-fit:cover; display:block; }
  .case-hero-mosaic .tile.illus{ display:flex; align-items:center; justify-content:center; }
  .case-hero-mosaic .tile.illus svg{ width:38%; height:38%; }
  @media (max-width:720px){
    .case-hero-mosaic{ grid-template-columns:repeat(3,1fr); }
    .case-hero-mosaic .tile:nth-child(4), .case-hero-mosaic .tile:nth-child(5){ display:none; }
  }

  /* ===== CASE CARD V2 ===== */
  .cc{ padding:88px 0; border-bottom:1px solid var(--line); }
  .cc:last-of-type{ border-bottom:none; }
  .cc-header{ display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-bottom:10px; }
  .cc-header h2{ font-size:clamp(28px,3vw,40px); }
  .cc-tag{
    font-family:'Space Mono', monospace; font-size:11px; letter-spacing:0.08em;
    text-transform:uppercase; color:var(--brass); border:1px solid var(--brass); padding:5px 12px;
    white-space:nowrap;
  }
  .cc-desc{ font-size:15.5px; color:var(--slate); font-style:italic; margin-bottom:40px; max-width:640px; }

  .cc-stats{ display:flex; border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin-bottom:52px; }
  .cc-stat{ flex:1; padding:26px 30px; border-left:1px solid var(--line); text-align:center; }
  .cc-stat:first-child{ border-left:none; }
  .cc-stat .num{ font-family:'Space Mono', monospace; font-size:clamp(28px,3vw,40px); font-weight:700; color:var(--navy); line-height:1; margin-bottom:8px; }
  .cc-stat .num span{ color:var(--brass); }
  .cc-stat .label{ font-family:'Space Mono', monospace; font-size:13px; letter-spacing:0.05em; text-transform:uppercase; color:var(--slate); max-width:220px; margin:0 auto; }

  .cc-body{ display:grid; grid-template-columns:0.85fr 1.15fr; gap:60px; align-items:center; }
  .cc-body.reverse{ direction:rtl; }
  .cc-body.reverse > *{ direction:ltr; }

  .cc-image-frame{
    border:1px solid var(--line); overflow:hidden; background:var(--fog);
    aspect-ratio:4/4.4; position:relative;
  }
  .cc-image-frame img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
  .cc-image-frame img.pos-top{ object-position:top; }
  .cc-image-frame.illustration{ background:var(--navy); display:flex; align-items:center; justify-content:center; }
  .cc-image-frame.illustration svg{ width:52%; height:52%; }
  .cc-image-caption{
    font-family:'Space Mono', monospace; font-size:10.5px; letter-spacing:0.06em;
    color:var(--slate); margin-top:10px; text-transform:uppercase;
  }

  .cc-label{
    font-family:'Space Mono', monospace; font-size:17px; letter-spacing:0.06em; text-transform:uppercase;
    color:var(--brass); margin-bottom:20px; margin-top:36px; display:flex; align-items:center; gap:14px;
    font-weight:700;
  }
  .cc-label:first-of-type{ margin-top:0; }
  .cc-label::after{ content:""; flex:1; height:1px; background:var(--line); }
  .cc-label-icon{ width:28px; height:28px; flex-shrink:0; }
  .cc-label-icon svg{ width:100%; height:100%; stroke:var(--brass); fill:none; stroke-width:1.4; }

  .cc-para{ font-size:16px; color:var(--navy); line-height:1.7; max-width:640px; margin-bottom:8px; }

  .cc-list{ list-style:none; display:flex; flex-direction:column; gap:16px; }
  .cc-list li{ position:relative; padding-left:26px; font-size:16px; color:var(--navy); line-height:1.6; }
  .cc-list.problem li::before{
    content:""; position:absolute; left:0; top:8px; width:8px; height:8px;
    border:1.5px solid var(--slate); border-radius:50%;
  }
  .cc-list.strategy li{ font-weight:500; }
  .cc-list.strategy li::before{
    content:"→"; position:absolute; left:0; top:0px; color:var(--brass);
    font-family:'Space Mono', monospace; font-weight:700; font-size:15px;
  }

  @media (max-width:900px){
    .cc-body{ grid-template-columns:1fr; gap:36px; }
    .cc-body.reverse{ direction:ltr; }
    .cc-stats{ flex-wrap:wrap; }
    .cc-stat{ flex:1 1 45%; border-left:none; border-top:1px solid var(--line); }
  }