:root{
    --navy:#182644;
    --navy-deep:#101a30;
    --paper:#F7F4EC;
    --paper-dim:#EDE8DA;
    --charcoal:#232630;
    --slate:#5A6478;
    --brass:#E0A73C;
    --brass-dim:#C68F2E;
    --line:#D8D2C0;
    --ok:#3E7A54;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--paper);
    color:var(--charcoal);
    font-family:'IBM Plex Sans', sans-serif;
    line-height:1.55;
  }
  h1,h2,h3{
    font-family:'Zilla Slab', serif;
    font-weight:700;
    margin:0;
    letter-spacing:-0.01em;
  }
  .mono{font-family:'IBM Plex Mono', monospace;}
  a{color:inherit;}
  .wrap{max-width:1120px; margin:0 auto; padding:0 28px;}

  /* Ticker top bar */
  .topbar{
    background:var(--navy-deep);
    color:var(--paper);
    font-family:'IBM Plex Mono', monospace;
    font-size:13px;
    letter-spacing:.04em;
  }
  .topbar .wrap{
    display:flex; justify-content:space-between; align-items:center;
    padding:9px 28px; flex-wrap:wrap; gap:6px;
  }
  .topbar a{text-decoration:none; color:var(--brass);}
  .topbar a:hover{text-decoration:underline;}

  /* Header */
  header{
    background:var(--navy);
    color:var(--paper);
    padding:22px 0 0;
  }
  .nav{
    display:flex; align-items:center; justify-content:space-between;
    padding-bottom:22px;
  }
  .brand{
    display:flex; align-items:center; gap:12px;
  }
  .brand-mark{
    width:40px; height:40px; border:2px solid var(--brass);
    border-radius:4px; display:flex; align-items:center; justify-content:center;
    font-family:'Zilla Slab',serif; font-weight:700; color:var(--brass); font-size:18px;
    flex-shrink:0;
  }
  .brand-name{font-family:'Zilla Slab',serif; font-weight:700; font-size:19px; line-height:1.15;}
  .brand-name span{display:block; font-family:'IBM Plex Mono',monospace; font-weight:500; font-size:11px; letter-spacing:.08em; color:#9FB0CC; text-transform:uppercase; margin-top:3px;}
  .call-btn{
    background:var(--brass); color:var(--navy-deep); text-decoration:none;
    font-family:'IBM Plex Mono',monospace; font-weight:600; font-size:14px;
    padding:11px 20px; border-radius:3px; white-space:nowrap;
    transition:background .15s ease;
  }
  .call-btn:hover{background:#EDB456;}

  /* Hero */
  .hero{
    background:var(--navy);
    color:var(--paper);
    position:relative;
    overflow:hidden;
    border-bottom:6px solid var(--brass);
  }
  .hero .wrap{
    padding:70px 28px 90px;
    display:grid; grid-template-columns:1.2fr 1fr; gap:50px; align-items:center;
  }
  .eyebrow{
    font-family:'IBM Plex Mono',monospace; font-size:13px; letter-spacing:.12em;
    text-transform:uppercase; color:var(--brass); margin-bottom:16px;
    display:flex; align-items:center; gap:10px;
  }
  .eyebrow::before{content:""; width:26px; height:2px; background:var(--brass); display:inline-block;}
  .hero h1{font-size:44px; line-height:1.08; margin-bottom:20px;}
  .hero p.lede{font-size:17px; color:#C7D0E0; max-width:46ch; margin-bottom:32px;}
  .hero-ctas{display:flex; gap:14px; flex-wrap:wrap;}
  .btn-primary{
    background:var(--brass); color:var(--navy-deep); text-decoration:none;
    font-weight:600; padding:14px 26px; border-radius:3px; font-size:15px;
    display:inline-flex; align-items:center; gap:8px;
  }
  .btn-ghost{
    border:1.5px solid #4A5A78; color:var(--paper); text-decoration:none;
    font-weight:600; padding:13px 26px; border-radius:3px; font-size:15px;
  }
  /* Work-order card, the signature element */
  .ticket{
    background:var(--paper);
    color:var(--charcoal);
    border-radius:4px;
    padding:26px 26px 20px;
    box-shadow:0 20px 50px rgba(0,0,0,.35);
    transform:rotate(1.3deg);
    position:relative;
  }
  .ticket::before{
    content:"";
    position:absolute; left:0; right:0; top:56px;
    border-top:2px dashed var(--line);
  }
  .ticket-head{
    display:flex; justify-content:space-between; align-items:baseline;
    font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:.06em;
    text-transform:uppercase; color:var(--slate); padding-bottom:16px;
  }
  .ticket-head b{color:var(--charcoal); font-size:12px;}
  .ticket-body{padding-top:18px;}
  .ticket-row{
    display:flex; justify-content:space-between; align-items:center;
    padding:8px 0; border-bottom:1px solid var(--paper-dim);
    font-size:14px;
  }
  .ticket-row:last-child{border-bottom:none;}
  .ticket-row .status{
    font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:600;
    color:var(--ok); text-transform:uppercase; letter-spacing:.04em;
  }

  /* Section titles */
  .section{padding:80px 0;}
  .section-head{max-width:600px; margin-bottom:46px;}
  .section-num{
    font-family:'IBM Plex Mono',monospace; color:var(--brass-dim); font-size:13px;
    letter-spacing:.1em; margin-bottom:10px; display:block;
  }
  .section h2{font-size:32px; margin-bottom:14px;}
  .section-head p{color:var(--slate); font-size:16px;}

  /* Services grid */
  .services{background:var(--paper);}
  .grid-services{
    display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
    background:var(--line); border:1px solid var(--line); border-radius:6px; overflow:hidden;
  }
  .svc{
    background:var(--paper); padding:26px 24px;
  }
  .svc-index{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--brass-dim); margin-bottom:10px;}
  .svc h3{font-size:18px; margin-bottom:8px; font-family:'IBM Plex Sans',sans-serif; font-weight:700;}
  .svc p{font-size:14px; color:var(--slate); margin:0;}

  /* Trust band */
  .trust{background:var(--navy-deep); color:var(--paper);}
  .trust .wrap{
    display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start;
  }
  .trust h2{color:var(--paper); font-size:30px; margin-bottom:18px;}
  .trust p{color:#B9C4D9; font-size:15.5px;}
  .badges{display:grid; gap:14px; margin-top:26px;}
  .badge{display:flex; gap:14px; align-items:flex-start;}
  .badge-icon{
    width:34px; height:34px; border-radius:4px; background:rgba(224,167,60,.15);
    border:1px solid var(--brass); flex-shrink:0; display:flex; align-items:center;
    justify-content:center; color:var(--brass); font-family:'IBM Plex Mono',monospace; font-weight:600; font-size:13px;
  }
  .badge b{display:block; font-size:15px; margin-bottom:2px;}
  .badge span{color:#9FB0CC; font-size:13.5px;}
  .quote-card{
    background:#1E2E50; border-left:3px solid var(--brass);
    padding:22px 24px; border-radius:4px; margin-top:0;
  }
  .quote-card p{font-style:italic; color:#DCE3F0; font-size:15px; margin-bottom:12px;}
  .quote-card .who{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--brass); font-style:normal;}
  .quotes{display:grid; gap:16px;}

  /* Service area */
  .area{background:var(--paper);}
  .area-box{
    display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center;
    border:1px solid var(--line); border-radius:6px; padding:40px; background:#FFFFFF;
  }
  .radius-diagram{
    aspect-ratio:1; position:relative; max-width:320px; margin:0 auto; width:100%;
  }
  .area-list{display:flex; flex-wrap:wrap; gap:8px; margin-top:18px;}
  .area-pill{
    font-family:'IBM Plex Mono',monospace; font-size:12.5px; background:var(--paper-dim);
    border:1px solid var(--line); padding:6px 12px; border-radius:20px; color:var(--slate);
  }

  /* Contact / CTA */
  .contact{background:var(--navy); color:var(--paper); border-top:6px solid var(--brass);}
  .contact .wrap{
    display:grid; grid-template-columns:1.1fr 1fr; gap:50px; align-items:center;
  }
  .contact h2{color:var(--paper); font-size:34px; margin-bottom:16px;}
  .contact p{color:#C7D0E0; font-size:16px; max-width:44ch;}
  .contact-card{
    background:#1E2E50; border-radius:6px; padding:32px; border:1px solid #34456A;
  }
  .cf-row{margin-bottom:18px;}
  .cf-label{font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:#8FA0C2; margin-bottom:6px;}
  .cf-value{font-size:19px; font-weight:600;}
  .cf-value a{text-decoration:none; color:var(--brass);}
  .cf-value a:hover{text-decoration:underline;}
  .divider-dash{border-top:2px dashed #34456A; margin:22px 0;}

  footer{
    background:var(--navy-deep); color:#8FA0C2; padding:28px 0; font-size:13px;
    font-family:'IBM Plex Mono',monospace;
  }
  footer .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}

  @media (max-width:860px){
    .hero .wrap{grid-template-columns:1fr; padding-top:50px;}
    .hero h1{font-size:34px;}
    .ticket{transform:rotate(0); max-width:380px; margin:0 auto;}
    .grid-services{grid-template-columns:1fr;}
    .trust .wrap{grid-template-columns:1fr;}
    .area-box{grid-template-columns:1fr;}
    .contact .wrap{grid-template-columns:1fr;}
    .topbar .wrap{justify-content:center; text-align:center;}
  }
  :focus-visible{outline:2px solid var(--brass); outline-offset:2px;}

  /* Scroll-reveal animation */
  .reveal{
    opacity:0; transform:translateY(22px);
    transition:opacity .6s ease, transform .6s ease;
  }
  .reveal.is-visible{opacity:1; transform:translateY(0);}
  .reveal-stagger.is-visible > *{opacity:1; transform:translateY(0);}
  .reveal-stagger > *{
    opacity:0; transform:translateY(18px);
    transition:opacity .5s ease, transform .5s ease;
  }
  .reveal-stagger.is-visible > *:nth-child(1){transition-delay:.05s;}
  .reveal-stagger.is-visible > *:nth-child(2){transition-delay:.12s;}
  .reveal-stagger.is-visible > *:nth-child(3){transition-delay:.19s;}
  .reveal-stagger.is-visible > *:nth-child(4){transition-delay:.26s;}
  .reveal-stagger.is-visible > *:nth-child(5){transition-delay:.33s;}
  .reveal-stagger.is-visible > *:nth-child(6){transition-delay:.40s;}
  .reveal-stagger.is-visible > *:nth-child(7){transition-delay:.47s;}
  .reveal-stagger.is-visible > *:nth-child(8){transition-delay:.54s;}
  .reveal-stagger.is-visible > *:nth-child(9){transition-delay:.61s;}
  .reveal-stagger.is-visible > *:nth-child(10){transition-delay:.68s;}

  /* Hover lift for cards */
  .svc, .quote-card, .badge{transition:transform .2s ease, box-shadow .2s ease;}
  .svc:hover{transform:translateY(-4px); box-shadow:0 10px 24px rgba(24,38,68,.08); position:relative; z-index:1;}
  .quote-card:hover{transform:translateY(-3px); box-shadow:0 12px 28px rgba(0,0,0,.25);}

  /* Buttons: lift + shadow on hover */
  .btn-primary, .btn-ghost{transition:transform .15s ease, box-shadow .15s ease, background .15s ease;}
  .btn-primary:hover{transform:translateY(-2px); box-shadow:0 8px 20px rgba(224,167,60,.35);}
  .btn-ghost:hover{transform:translateY(-2px); background:rgba(255,255,255,.06);}

  /* Ticket gentle float-in handled by reveal; add subtle continuous float */
  @keyframes floaty{
    0%,100%{transform:rotate(1.3deg) translateY(0);}
    50%{transform:rotate(1.3deg) translateY(-6px);}
  }
  .ticket{animation:floaty 5s ease-in-out infinite;}
  @media (max-width:860px){ .ticket{animation:none;} }

  @media (prefers-reduced-motion: reduce){
    .reveal, .reveal-stagger > *{opacity:1 !important; transform:none !important; transition:none !important;}
    .ticket{animation:none !important;}
  }

  /* Estimate form */
  .estimate-form{display:grid; gap:16px;}
  .form-row{display:grid; gap:6px;}
  .form-row.two-col{grid-template-columns:1fr 1fr; display:grid; gap:16px;}
  .form-row label{
    font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase;
    letter-spacing:.08em; color:#8FA0C2;
  }
  .form-row input, .form-row select, .form-row textarea{
    background:#16233F; border:1px solid #34456A; border-radius:4px;
    padding:12px 14px; color:var(--paper); font-family:'IBM Plex Sans',sans-serif; font-size:15px;
    transition:border-color .15s ease, box-shadow .15s ease;
  }
  .form-row input:focus, .form-row select:focus, .form-row textarea:focus{
    outline:none; border-color:var(--brass); box-shadow:0 0 0 3px rgba(224,167,60,.18);
  }
  .form-row textarea{resize:vertical; min-height:90px; font-family:inherit;}
  .form-submit{
    background:var(--brass); color:var(--navy-deep); border:none; border-radius:3px;
    padding:14px 26px; font-weight:600; font-size:15px; cursor:pointer;
    font-family:'IBM Plex Sans',sans-serif; transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
  }
  .form-submit:hover{transform:translateY(-2px); box-shadow:0 8px 20px rgba(224,167,60,.35); background:#EDB456;}
  .form-note{font-size:12.5px; color:#8FA0C2;}
  @media (max-width:600px){ .form-row.two-col{grid-template-columns:1fr;} }

  /* Prices + FAQ */
  .prices{background:var(--paper-dim);}
  .price-table{width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--line); border-radius:6px; overflow:hidden;}
  .price-table th,.price-table td{padding:16px 20px; text-align:left; border-bottom:1px solid var(--paper-dim); font-size:15px; vertical-align:top;}
  .price-table th{font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--slate); background:var(--paper);}
  .price-table td.amt{font-family:'IBM Plex Mono',monospace; font-weight:600; white-space:nowrap; color:var(--navy);}
  .price-table td small{display:block; color:var(--slate); font-size:13px; margin-top:2px;}
  .price-table tr:last-child td{border-bottom:none;}
  .price-note{color:var(--slate); font-size:13.5px; margin-top:14px;}
  .faq{background:var(--paper);}
  .faq-list{max-width:820px;}
  .faq-item{border-bottom:1px solid var(--line); padding:6px 0;}
  .faq-item summary{cursor:pointer; font-weight:600; font-size:16.5px; padding:14px 0; list-style:none;}
  .faq-item summary::-webkit-details-marker{display:none;}
  .faq-item summary::after{content:"+"; float:right; color:var(--brass-dim); font-family:'IBM Plex Mono',monospace;}
  .faq-item[open] summary::after{content:"\2212";}
  .faq-item p{margin:0 0 14px; color:var(--slate); font-size:15px;}
  @media (max-width:600px){ .price-table th,.price-table td{padding:12px 12px; font-size:14px;} }

  /* Clickable service cards */
  .grid-services{gap:16px; background:none; border:none; border-radius:0; overflow:visible;}
  a.svc{display:block; text-decoration:none; color:inherit; border:1px solid var(--line); border-radius:6px; background:#fff;}
  a.svc:hover{border-color:var(--brass-dim);}
  .svc-more{display:inline-block; margin-top:14px; font-family:'IBM Plex Mono',monospace; font-size:12.5px; font-weight:600; color:var(--brass-dim);}
  .reveal-stagger.is-visible > *:nth-child(11){transition-delay:.75s;}
  /* Service pages */
  .page-hero{background:var(--navy); color:var(--paper); border-bottom:6px solid var(--brass); padding:56px 0 64px;}
  .page-hero h1{font-size:40px; line-height:1.1; margin-bottom:16px; max-width:20ch;}
  .page-hero .lede{font-size:17px; color:#C7D0E0; max-width:60ch; margin:0 0 28px;}
  .crumbs{font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:#9FB0CC; margin:0 0 22px;}
  .crumbs a{color:var(--brass); text-decoration:none;}
  .two{display:grid; grid-template-columns:1fr 1fr; gap:50px;}
  .check{list-style:none; padding:0; margin:14px 0 0;}
  .check li{padding:9px 0 9px 28px; position:relative; border-bottom:1px solid var(--paper-dim);}
  .check li::before{content:"\2713"; position:absolute; left:0; color:var(--ok); font-weight:700;}
  .muted{color:var(--slate);}
  .gallery{display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:14px; margin-top:18px;}
  .gallery figure{margin:0; border-radius:6px; overflow:hidden; border:1px solid var(--line); background:#fff;}
  .gallery img{display:block; width:100%; height:220px; object-fit:cover;}
  .pills{display:flex; flex-wrap:wrap; gap:10px; margin-top:16px;}
  .pill-link{font-size:14px; text-decoration:none; background:var(--paper-dim); border:1px solid var(--line); padding:8px 14px; border-radius:20px; color:var(--charcoal);}
  .pill-link:hover{border-color:var(--brass-dim);}
  .page-hero .btn-primary,.page-hero .btn-ghost,.contact .btn-primary,.contact .btn-ghost{text-decoration:none;}
  @media (max-width:860px){ .two{grid-template-columns:1fr; gap:30px;} .page-hero h1{font-size:32px;} }

  /* Price calculator */
  .calc{margin-top:40px; background:#fff; border:1px solid var(--line); border-radius:6px; padding:28px;}
  .calc h3{font-size:24px; margin-bottom:6px;}
  .calc-sub{color:var(--slate); font-size:14.5px; margin:0 0 18px;}
  .calc-grid{display:grid; grid-template-columns:1fr 1fr; gap:36px; align-items:start;}
  .calc-inputs label{display:block; font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--slate); margin:14px 0 6px;}
  .calc-inputs select,.calc-inputs input{width:100%; padding:12px 14px; font-size:15px; font-family:'IBM Plex Sans',sans-serif; border:1px solid var(--line); border-radius:4px; background:var(--paper); color:var(--charcoal);}
  .calc-inputs [hidden]{display:none;}
  .calc-out{background:var(--navy); color:var(--paper); border-radius:6px; padding:24px;}
  .calc-label{font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:#9FB0CC;}
  .calc-result{font-family:'Zilla Slab',serif; font-weight:700; font-size:40px; line-height:1.1; margin:8px 0 8px; color:var(--brass);}
  .calc-note{color:#C7D0E0; font-size:14px; margin:0 0 18px;}
  .calc-actions{display:flex; flex-wrap:wrap; gap:10px;}
  .calc-actions .btn-primary,.calc-actions .btn-ghost{font-size:14px; padding:11px 18px; cursor:pointer; font-family:'IBM Plex Sans',sans-serif; background-clip:padding-box;}
  .calc-actions button.btn-ghost{background:transparent;}
  @media (max-width:760px){ .calc-grid{grid-template-columns:1fr; gap:22px;} .calc{padding:20px;} .calc-result{font-size:34px;} }
  .calc-items{display:grid; gap:8px;}
  .calc-item{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:8px 12px; background:var(--paper); border:1px solid var(--line); border-radius:4px; font-size:14.5px;}
  .calc-item small{display:block; color:var(--slate); font-family:'IBM Plex Mono',monospace; font-size:11.5px;}
  .calc-item input{width:72px; padding:8px 10px;}
  .calc-go{margin-top:20px; width:100%;}
  .steps{list-style:none; counter-reset:st; padding:0; margin:18px 0 0; display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
  .steps li{counter-increment:st; background:#fff; border:1px solid var(--line); border-radius:6px; padding:20px;}
  .steps li::before{content:counter(st); display:block; font-family:'IBM Plex Mono',monospace; color:var(--brass-dim); font-weight:600; margin-bottom:8px;}
  .steps b{display:block; margin-bottom:6px;}
  .steps span{color:var(--slate); font-size:14.5px;}
  .office-box{display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap; background:var(--paper-dim); border:1px solid var(--line); border-left:4px solid var(--brass); border-radius:6px; padding:26px 28px;}
  .office-box .btn-primary{text-decoration:none;}
  @media (max-width:860px){ .steps{grid-template-columns:1fr 1fr;} }
  @media (max-width:520px){ .steps{grid-template-columns:1fr;} }
  .review-links{margin:6px 0 0; font-size:14px; color:#9FB0CC;}
  .review-links a{color:var(--brass);}
  .brand-logo{width:58px; height:58px; border-radius:50%; flex-shrink:0; display:block;}
  a.area-pill{text-decoration:none;}
  a.area-pill:hover{border-color:var(--brass-dim); color:var(--charcoal);}