:root{
    --ink:#12181C;
    --ink-2:#1B2329;
    --ink-3:#232C33;
    --paper:#EDEAE2;
    --paper-2:#E3DFD4;
    --paper-3:#DAD5C6;
    --box-red:#C8102E;
    --box-red-dim:#8F0C21;
    --brass:#C9A24B;
    --teal:#3C8073;
    --cream-text:#F3F0E9;
    --ink-soft:#4A5058;
    --line:rgba(18,24,28,0.12);
    --line-dark:rgba(243,240,233,0.14);
    --display:'Big Shoulders Display', sans-serif;
    --body:'Source Serif 4', serif;
    --mono:'IBM Plex Mono', monospace;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{margin:0; background:var(--paper); color:var(--ink); font-family:var(--body); line-height:1.55; overflow-x:hidden;}
  h1,h2,h3{font-family:var(--display); font-weight:900; text-transform:uppercase; margin:0;}
  .eyebrow{font-family:var(--mono); font-size:12px; letter-spacing:0.12em; text-transform:uppercase; color:var(--brass); display:flex; align-items:center; gap:12px;}
  .eyebrow::before{content:""; width:26px; height:1px; background:var(--box-red); display:inline-block; flex-shrink:0;}
  a{color:inherit;}
  ::selection{background:var(--box-red); color:var(--cream-text);}

  /* reveal-on-scroll */
  .reveal{opacity:0; transform:translateY(18px); transition:opacity 0.7s ease, transform 0.7s ease;}
  .reveal.in{opacity:1; transform:translateY(0);}
  @media (prefers-reduced-motion:reduce){ .reveal{opacity:1; transform:none; transition:none;} }

  /* decorative grid texture, used on dark sections */
  .grid-texture{position:relative;}
  .grid-texture::before{
    content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
    background-image:
      linear-gradient(var(--line-dark) 1px, transparent 1px),
      linear-gradient(90deg, var(--line-dark) 1px, transparent 1px);
    background-size:56px 56px;
    -webkit-mask-image:radial-gradient(circle at 25% 15%, black, transparent 65%);
    mask-image:radial-gradient(circle at 25% 15%, black, transparent 65%);
    opacity:0.6;
  }

  /* nav */
  nav{display:flex; align-items:center; justify-content:space-between; padding:20px 6vw; background:rgba(18,24,28,0.92); backdrop-filter:blur(8px); color:var(--cream-text); border-bottom:1px solid var(--line-dark); position:sticky; top:0; z-index:100;}
  .logo{font-family:var(--display); font-weight:900; font-size:22px; text-transform:uppercase; display:flex; align-items:center; gap:10px; letter-spacing:0.01em;}
  .logo .dot{width:10px; height:10px; border-radius:50%; background:var(--box-red); box-shadow:0 0 0 4px rgba(200,16,46,0.22);}
  .nav-right{display:flex; align-items:center; gap:32px;}
  .nav-links{display:flex; gap:28px; font-family:var(--mono); font-size:13px;}
  .nav-links a{text-decoration:none; opacity:0.8; transition:opacity 0.2s, color 0.2s; position:relative; padding-bottom:4px;}
  .nav-links a::after{content:""; position:absolute; left:0; right:100%; bottom:0; height:1px; background:var(--brass); transition:right 0.2s ease;}
  .nav-links a:hover{opacity:1; color:var(--brass);}
  .nav-links a:hover::after{right:0;}
  .nav-cta{font-family:var(--mono); font-size:12.5px; padding:10px 18px; background:var(--box-red); color:var(--cream-text); text-decoration:none; border-radius:2px; white-space:nowrap; border:1px solid var(--box-red); transition:background 0.15s, color 0.15s;}
  .nav-cta:hover{background:transparent; color:var(--box-red);}
  .burger{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px;}
  .burger span{width:22px; height:2px; background:var(--cream-text);}
  .mobile-menu{display:none; position:fixed; inset:0; z-index:99; background:var(--ink); color:var(--cream-text); flex-direction:column; padding:100px 8vw 40px; gap:26px; font-family:var(--mono); font-size:20px;}
  .mobile-menu.open{display:flex;}
  .mobile-menu a{text-decoration:none; border-bottom:1px solid var(--line-dark); padding-bottom:18px;}

  /* hero */
  .hero{background:var(--ink); color:var(--cream-text); padding:12vh 6vw 10vh; position:relative; overflow:hidden;}
  .hero::before{content:""; position:absolute; top:-30%; right:-8%; width:640px; height:640px; background:radial-gradient(circle, rgba(200,16,46,0.28), transparent 68%); pointer-events:none;}
  .hero::after{content:""; position:absolute; bottom:-40%; left:-10%; width:500px; height:500px; background:radial-gradient(circle, rgba(60,128,115,0.18), transparent 70%); pointer-events:none;}
  .hero-grid{position:relative; z-index:1; display:grid; grid-template-columns:1.15fr 0.85fr; gap:6vw; align-items:center; max-width:1240px; margin:0 auto;}
  .hero .eyebrow{margin-bottom:22px;}
  .hero h1{font-size:clamp(38px,5.2vw,68px); line-height:0.98; margin-bottom:22px;}
  .hero h1 .red{color:var(--box-red);}
  .hero p{font-size:18px; color:#C9CFD4; max-width:52ch; margin-bottom:32px;}
  .btn{font-family:var(--mono); font-size:14px; padding:14px 26px; border-radius:2px; text-decoration:none; display:inline-block; margin-right:14px; margin-bottom:10px; transition:transform 0.15s, background 0.15s;}
  .btn:hover{transform:translateY(-1px);}
  .btn-primary{background:var(--box-red); color:var(--cream-text); border:1px solid var(--box-red);}
  .btn-primary:hover{background:#DE1836;}
  .btn-ghost{border:1px solid var(--line-dark); color:var(--cream-text);}
  .btn-ghost:hover{border-color:var(--brass); color:var(--brass);}
  .hero-meta{font-family:var(--mono); font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:#8A9298; margin-top:8px;}

  /* hero call card */
  .call-card{background:var(--ink-2); border:1px solid var(--line-dark); border-radius:6px; padding:22px; font-family:var(--mono); font-size:13px; box-shadow:0 30px 70px rgba(0,0,0,0.45); position:relative; z-index:1;}
  .call-card-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; padding-bottom:14px; border-bottom:1px solid var(--line-dark);}
  .call-card-head .who{display:flex; align-items:center; gap:8px; color:var(--cream-text);}
  .pulse{width:8px; height:8px; border-radius:50%; background:var(--teal); box-shadow:0 0 0 0 rgba(60,128,115,0.6); animation:pulse 1.8s infinite;}
  @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(60,128,115,0.55);}70%{box-shadow:0 0 0 8px rgba(60,128,115,0);}100%{box-shadow:0 0 0 0 rgba(60,128,115,0);}}
  .call-card-head .status{color:var(--brass); font-size:11px; letter-spacing:0.08em; text-transform:uppercase;}
  .bubble{margin-bottom:12px; max-width:88%; padding:10px 13px; border-radius:4px; color:#D9DEE2; line-height:1.5;}
  .bubble.agent{background:var(--ink-3); border-left:2px solid var(--brass);}
  .bubble.caller{background:var(--ink-3); border-left:2px solid var(--teal); margin-left:auto;}
  .booked{margin-top:16px; padding:12px; text-align:center; background:rgba(60,128,115,0.14); border:1px solid rgba(60,128,115,0.4); border-radius:4px; color:#8FD4C4; font-size:12.5px; letter-spacing:0.04em;}

  /* generic section */
  .section{padding:9vh 6vw;}
  .section-inner{max-width:1240px; margin:0 auto; position:relative; z-index:1;}
  .section-head{margin-bottom:6vh;}
  .section-head h2{font-size:clamp(28px,4vw,46px); margin:14px 0 10px; max-width:16ch;}
  .section-head p{max-width:52ch; color:var(--ink-soft); font-size:16px;}
  .section-head.on-dark p{color:#B7BDC2;}

  /* process (how it works) — icon-card row */
  .process{background:var(--paper);}
  .process-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
  .process-card{background:var(--paper); padding:32px 26px;}
  .process-card .icon{width:28px; height:28px; color:var(--box-red); margin-bottom:16px;}
  .process-card .tag{font-family:var(--mono); font-size:11px; letter-spacing:0.1em; color:var(--ink-soft);}
  .process-card h3{font-size:19px; margin:10px 0 8px;}
  .process-card p{color:var(--ink-soft); font-size:14px; margin:0;}

  /* problems we solve — pain point grid */
  .problems{background:var(--paper-2);}
  .problem-grid{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line);}
  .problem-card{background:var(--paper-2); padding:28px 30px; display:flex; gap:16px; align-items:flex-start;}
  .problem-card .dot{width:8px; height:8px; border-radius:50%; background:var(--brass); margin-top:8px; flex-shrink:0;}
  .problem-card .q{font-family:var(--body); font-weight:600; font-size:17.5px; color:var(--ink); margin-bottom:6px; line-height:1.4;}
  .problem-card .tag{font-family:var(--mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-soft);}

  /* services */
  .services-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
  .service{background:var(--paper); padding:32px 26px; transition:background 0.2s;}
  .service:hover{background:var(--paper-2);}
  .service .icon{width:34px; height:34px; margin-bottom:14px; color:var(--box-red);}
  .service .eyebrow{color:var(--box-red);}
  .service .eyebrow::before{background:var(--box-red);}
  .service .eyebrow.available{color:var(--teal);}
  .service .eyebrow.available::before{background:var(--teal);}
  .service h3{font-size:22px; margin:10px 0;}
  .service p{color:var(--ink-soft); font-size:14.5px; margin:0 0 20px;}
  .service-cta{font-family:var(--mono); font-size:12.5px; padding:10px 18px; text-decoration:none; display:inline-block; border-radius:2px; transition:background 0.15s, color 0.15s, border-color 0.15s;}
  .service-cta.primary{background:var(--box-red); color:var(--cream-text);}
  .service-cta.primary:hover{background:#DE1836;}
  .service-cta.ghost{border:1px solid var(--ink); color:var(--ink);}
  .service-cta.ghost:hover{background:var(--ink); color:var(--cream-text);}

  /* demo player */
  .demo{background:var(--paper-2);}
  .demo-player{max-width:640px; margin:0 auto;}
  .demo-player audio{width:100%; margin-bottom:20px; color-scheme:dark;}
  .demo-note{font-family:var(--mono); font-size:11.5px; color:var(--ink-soft); text-align:center; margin-top:16px; opacity:0.75;}

  /* follow-up demo (invoice chasing / quote follow-up) */
  .followups{background:var(--paper);}
  .followup-cols{display:grid; grid-template-columns:1fr 1fr; gap:40px;}
  .followup-col h3{font-size:19px; margin-bottom:4px;}
  .followup-col .sub{color:var(--ink-soft); font-size:13.5px; margin-bottom:22px;}
  .email-card{background:var(--ink-2); border:1px solid var(--line-dark); border-radius:6px; padding:18px 20px; margin-bottom:16px; font-family:var(--mono); position:relative;}
  .email-card .day-badge{display:inline-block; font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--brass); border:1px solid rgba(201,162,75,0.4); border-radius:20px; padding:3px 10px; margin-bottom:10px;}
  .email-card .day-badge.firm{color:#E3A867; border-color:rgba(227,168,103,0.4);}
  .email-card .day-badge.final{color:var(--box-red); border-color:rgba(200,16,46,0.4);}
  .email-card .subj{color:var(--cream-text); font-size:13.5px; font-weight:600; margin-bottom:8px;}
  .email-card .snippet{color:#B7BDC2; font-size:13px; line-height:1.6; font-family:var(--body);}

  /* capability stats — big-number band */
  .stats-band{background:var(--ink); color:var(--cream-text); position:relative; overflow:hidden;}
  .stats-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:50px; margin-top:2vh;}
  .stat-block .big-num{font-family:var(--display); font-weight:900; font-size:clamp(38px,5vw,60px); color:var(--cream-text); line-height:1;}
  .stat-block .underline{width:38px; height:3px; background:var(--brass); margin:16px 0;}
  .stat-block .tag{font-family:var(--mono); font-size:11.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--brass); margin-bottom:10px;}
  .stat-block p{color:#B7BDC2; font-size:14.5px; margin:0 0 14px; max-width:32ch;}
  .stat-block a{font-family:var(--mono); font-size:12.5px; color:var(--brass); text-decoration:none; white-space:nowrap;}
  .stat-block a:hover{color:var(--cream-text);}

  /* about narrative */
  .about{background:var(--ink); color:var(--cream-text); padding-top:0;}
  .about-grid{display:grid; grid-template-columns:1fr 0.7fr; gap:60px; align-items:start;}
  .about p.body-p{font-size:16.5px; color:#C9CFD4; margin-bottom:16px;}
  .badge-list{display:flex; flex-direction:column; gap:14px; margin-top:26px; padding:0;}
  .badge-list li{list-style:none; display:flex; gap:12px; align-items:flex-start; font-size:14.5px; color:#C9CFD4;}
  .badge-list li svg{flex-shrink:0; margin-top:3px; color:var(--teal);}
  .founder-card{background:var(--ink-2); border:1px solid var(--line-dark); border-radius:6px; padding:28px; font-family:var(--mono);}
  .founder-card .avatar{width:52px; height:52px; border-radius:50%; background:var(--ink-3); border:1px solid var(--line-dark); display:flex; align-items:center; justify-content:center; font-family:var(--display); font-weight:900; font-size:17px; color:var(--brass); margin-bottom:16px;}
  .founder-card .name{font-family:var(--body); font-weight:600; font-size:16px; color:var(--cream-text); margin-bottom:2px;}
  .founder-card .role{font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:#8A9298; margin-bottom:16px;}
  .founder-card p{font-family:var(--body); font-size:13.5px; color:#B7BDC2; line-height:1.6; margin:0;}

  /* faq */
  .faq{background:var(--paper-2);}
  .faq-list{max-width:820px;}
  .faq-item{border-bottom:1px solid var(--line); padding:22px 0;}
  .faq-item summary{cursor:pointer; list-style:none; display:flex; align-items:flex-start; gap:18px;}
  .faq-item summary::-webkit-details-marker{display:none;}
  .faq-item .fnum{font-family:var(--mono); font-size:12.5px; color:var(--ink-soft); padding-top:3px; flex-shrink:0; width:22px;}
  .faq-item .ftitle{font-family:var(--body); font-weight:600; font-size:17.5px; color:var(--ink); flex:1; line-height:1.4;}
  .faq-item .plus{font-family:var(--mono); font-size:19px; color:var(--box-red); transition:transform 0.2s; flex-shrink:0;}
  .faq-item[open] .plus{transform:rotate(45deg);}
  .faq-item p{color:var(--ink-soft); font-size:15px; margin:14px 0 0 40px; max-width:60ch;}

  /* cta */
  .cta{background:var(--box-red); color:var(--cream-text); padding:11vh 6vw; text-align:center; position:relative; overflow:hidden;}
  .cta::before{content:""; position:absolute; top:-50%; left:50%; transform:translateX(-50%); width:800px; height:800px; background:radial-gradient(circle, rgba(0,0,0,0.14), transparent 70%);}
  .cta-inner{position:relative; z-index:1;}
  .cta .eyebrow{justify-content:center; color:var(--cream-text); opacity:0.85; margin-bottom:18px;}
  .cta .eyebrow::before{background:var(--ink);}
  .cta h2{font-size:clamp(30px,5vw,52px); margin-bottom:18px;}
  .cta p.lead{font-size:16px; max-width:50ch; margin:0 auto 30px; opacity:0.92;}
  .cta .btn-primary{background:var(--ink); border-color:var(--ink);}
  .cta .btn-primary:hover{background:#000;}
  .cta .btn-ghost{border-color:rgba(255,255,255,0.4);}
  .cta .btn-ghost:hover{border-color:var(--cream-text); color:var(--cream-text);}
  .lead-form{display:flex; flex-wrap:wrap; gap:12px; justify-content:center; max-width:560px; margin:0 auto 14px;}
  .lead-form input, .lead-form select{font-family:var(--mono); font-size:14px; padding:13px 16px; border:none; border-radius:2px; background:var(--cream-text); color:var(--ink); flex:1 1 160px; min-width:140px;}
  .lead-form input::placeholder{color:var(--ink-soft);}
  .lead-form button{flex:0 0 auto; cursor:pointer; border:none; font-family:var(--mono); font-size:14px; padding:13px 26px; border-radius:2px; background:var(--ink); color:var(--cream-text); transition:background 0.15s;}
  .lead-form button:hover{background:#000;}
  .lead-form button:disabled{opacity:0.6; cursor:default;}
  .form-consent{font-family:var(--mono); font-size:11.5px; opacity:0.85; margin-bottom:24px;}
  .form-success{font-family:var(--mono); font-size:14px; background:var(--ink); color:#8FD4C4; padding:14px 22px; border-radius:4px; display:none; margin:0 auto 24px; max-width:400px;}
  .form-success.show{display:block;}

  /* footer */
  footer{background:var(--ink); color:#7C838A; font-family:var(--mono); font-size:12px; border-top:1px solid var(--line-dark);}
  footer a{text-decoration:none;}
  footer a:hover{color:var(--brass);}
  .footer-inner{max-width:1240px; margin:0 auto; padding:44px 6vw 26px;}
  .footer-top{display:flex; justify-content:space-between; align-items:center; padding-bottom:26px; margin-bottom:20px; border-bottom:1px solid var(--line-dark); flex-wrap:wrap; gap:16px;}
  .footer-top .logo{color:var(--cream-text); font-size:19px;}
  .footer-top .tag{color:#9AA0A6; font-size:12.5px; text-align:center; flex:1; min-width:220px;}
  .footer-social{width:34px; height:34px; border-radius:50%; border:1px solid var(--line-dark); display:flex; align-items:center; justify-content:center; transition:border-color 0.15s;}
  .footer-social:hover{border-color:var(--brass);}
  .footer-bottom{display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}
  .footer-links{display:flex; gap:20px;}

  @media (max-width:980px){
    .hero-grid{grid-template-columns:1fr; gap:50px;}
    .about-grid{grid-template-columns:1fr; gap:36px;}
    .process-grid{grid-template-columns:1fr 1fr;}
    .stats-grid{grid-template-columns:1fr; gap:36px;}
  }
  @media (max-width:880px){
    .nav-links{display:none;}
    .nav-cta{display:none;}
    .burger{display:flex;}
    .services-grid{grid-template-columns:1fr;}
    .process-grid{grid-template-columns:1fr;}
    .problem-grid{grid-template-columns:1fr;}
    .followup-cols{grid-template-columns:1fr; gap:36px;}
    .faq-item p{margin-left:0;}
    .features-grid{grid-template-columns:1fr;}
  }

  /* single-column service-page hero (no call-card) */
  .hero-single{max-width:760px; margin:0 auto; text-align:left; position:relative; z-index:1;}
  .hero-single h1{font-size:clamp(34px,4.6vw,56px); line-height:1.02; margin-bottom:20px;}
  .breadcrumb{font-family:var(--mono); font-size:12px; color:#8A9298; margin-bottom:18px;}
  .breadcrumb a{text-decoration:none; color:#8A9298; transition:color 0.15s;}
  .breadcrumb a:hover{color:var(--brass);}

  /* feature list — service page detail grid */
  .features-grid{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line);}
  .feature-card{background:var(--paper); padding:28px 30px; display:flex; gap:16px; align-items:flex-start;}
  .feature-card svg{flex-shrink:0; color:var(--teal); margin-top:3px;}
  .feature-card h3{font-size:17px; margin-bottom:6px; text-transform:none; font-family:var(--body); font-weight:600;}
  .feature-card p{color:var(--ink-soft); font-size:14px; margin:0;}

  /* related services — internal links footer strip */
  .related{background:var(--paper-2);}
  .related-list{display:flex; flex-wrap:wrap; gap:12px;}
  .related-list a{font-family:var(--mono); font-size:13px; padding:10px 18px; border:1px solid var(--line); border-radius:2px; text-decoration:none; color:var(--ink); transition:border-color 0.15s, color 0.15s;}
  .related-list a:hover{border-color:var(--box-red); color:var(--box-red);}
