  :root{
    --bg:#111115;
    --bg-soft:#191920;
    --surface:#1c1c24;
    --white:#ece8df;        /* muted warm white */
    --white-dim:#9b988f;
    --rule:rgba(236,232,223,.12);
    --accent:#ff5c38;
    --accent-dim:#ff8c72;
    --display:"Geom",sans-serif;
    --text:"Geom",-apple-system,sans-serif;
    --max: 70vw;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    background:var(--bg);
    color:var(--white);
    font-family:var(--text);
    font-size:18px;
    font-weight:400;
    line-height:1.62;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
    overflow-x:hidden;
  }
  /* faint grid + accent glow */
  body::before{
    content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
    background-image:linear-gradient(var(--rule) 1px,transparent 1px),
                     linear-gradient(90deg,var(--rule) 1px,transparent 1px);
    background-size:64px 64px;opacity:.4;
    mask-image:radial-gradient(circle at 50% 0,#000,transparent 75%);
  }
  body::after{
    content:"";position:fixed;top:-220px;left:50%;transform:translateX(-50%);
    width:760px;height:520px;pointer-events:none;z-index:0;
    background:radial-gradient(circle,rgba(255,92,56,.16),transparent 68%);
    filter:blur(20px);
  }
  .wrap{position:relative;z-index:1;max-width:var(--max);margin:0 auto;padding:0 30px}

  /* ---- top bar ---- */
  header{padding:34px 0 0}
  .topline{display:flex;justify-content:space-between;align-items:center;
    font-size:14px;letter-spacing:.04em;color:var(--white-dim)}
  .topline .mark{font-family:var(--display);font-weight:800;font-size:19px; text-transform: uppercase;
    color:var(--white);letter-spacing:-.01em}
  .topline a{color:var(--white-dim);text-decoration:none;
    border:1px solid var(--rule);border-radius:100px;padding:8px 18px;transition:.2s}
  .topline a:hover{color:var(--bg);background:var(--white);border-color:var(--white)}

  /* ---- hero ---- */
  .hero{padding:96px 0 78px}
  .kicker{font-size:13px;letter-spacing:.28em;text-transform:uppercase;
    color:var(--accent);font-weight:600;margin-bottom:30px}
  h1{font-family:var(--display);font-weight:800;
    font-size:clamp(44px,8.5vw,86px);line-height:.98;letter-spacing:-.035em;
    margin-bottom:34px;max-width:13ch}
  h1 em{font-style:normal;color:var(--accent)}
  .lede{font-size:clamp(19px,2.3vw,23px);color:var(--white-dim);
    max-width:48ch;font-weight:300}

  /* ---- generic section ---- */
  section{padding:62px 0;border-top:1px solid var(--rule)}
  .sec-label{font-size:12px;letter-spacing:.24em;text-transform:uppercase;
    color:var(--white-dim);font-weight:600;margin-bottom:32px}
  h2{font-family:var(--display);font-weight:700;
    font-size:clamp(28px,4.2vw,42px);line-height:1.05;letter-spacing:-.02em;
    margin-bottom:24px}
  .body p{max-width:62ch;font-weight:400}
  .body p strong{color:var(--white);font-weight:500}
  .body p.big{font-family:var(--display);font-weight:600;
    font-size:clamp(22px,3vw,30px);line-height:1.25;letter-spacing:-.015em;
    color:var(--white);margin-bottom:26px}
  h2 .reg{display:none}
  .deliv{margin-top:12px;font-size:15px;color:var(--white-dim)}
  .deliv b{color:var(--accent);font-weight:600;font-family:var(--text)}

  /* ---- about cards ---- */
  .howgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:34px}
  .hcard{background:var(--bg-soft);border:1px solid var(--rule);
    border-radius:16px;padding:28px 26px;transition:transform .25s,border-color .25s}
  .hcard:hover{transform:translateY(-4px);border-color:rgba(236,232,223,.28)}
  .hcard .ix{font-family:var(--display);font-weight:800;font-size:14px;
    letter-spacing:.12em;color:var(--white-dim);opacity:.55}
  .hcard h3{font-family:var(--display);font-weight:700;font-size:21px;
    letter-spacing:-.01em;margin:12px 0 9px;line-height:1.1}
  .hcard p{font-size:16px;color:var(--white-dim);line-height:1.5}
  .hcard.feature{background:linear-gradient(155deg,rgba(255,92,56,.13),var(--bg-soft) 62%);
    border-color:rgba(255,92,56,.4)}
  .hcard.feature .ix{color:var(--accent);opacity:1}
  .hcard.feature h3{color:var(--white)}
  @media(max-width:560px){.howgrid{grid-template-columns:1fr}}
  .funnel{margin-top:34px;padding:26px 28px;border-left:3px solid var(--accent);
    background:linear-gradient(90deg,rgba(255,92,56,.08),transparent 80%);
    border-radius:0 12px 12px 0;font-size:18px;max-width:60ch}
  .funnel strong{color:var(--accent);font-weight:500}
  p + p{margin-top:20px}
  a.inline{color:var(--accent);text-decoration:none;
    border-bottom:1px solid var(--accent-dim);transition:.2s}
  a.inline:hover{color:var(--accent-dim);border-color:transparent}

  /* ---- services ---- */
  .work{list-style:none}
  .work li{display:grid;grid-template-columns:auto 1fr;gap:0 30px;
    padding:30px 0;border-bottom:1px solid var(--rule);align-items:baseline;
    transition:.25s}
  .work li:hover{padding-left:10px}
  .work li:last-child{border-bottom:none}
  .work .num{font-family:var(--display);font-weight:800;font-size:34px;
    color:transparent;-webkit-text-stroke:1.4px var(--accent);line-height:1}
  .work h3{font-family:var(--display);font-weight:700;font-size:25px;
    letter-spacing:-.01em;margin-bottom:8px;display:flex;align-items:center;
    gap:12px;flex-wrap:wrap}
  .tag{font-family:var(--text);font-weight:600;font-size:11px;letter-spacing:.14em;
    text-transform:uppercase;color:var(--accent);border:1px solid var(--accent);
    border-radius:100px;padding:4px 11px}
  .work li.signature{background:
      linear-gradient(90deg,rgba(255,92,56,.07),transparent 70%);
    margin-left:-14px;padding-left:14px;border-radius:12px 12px 0 0}
  .work p{color:var(--white-dim);font-size:17px;max-width:56ch;font-weight:400}

  /* ---- experience facts ---- */
  .facts{display:flex;flex-wrap:wrap;gap:18px}
  .fact{flex:1 1 200px;background:var(--bg-soft);border:1px solid var(--rule);
    border-radius:14px;padding:28px 26px}
  .fact .n{font-family:var(--display);font-weight:800;font-size:48px;
    line-height:1;letter-spacing:-.03em;color:var(--white)}
  .fact .n span{color:var(--accent)}
  .fact .l{font-size:15px;color:var(--white-dim);margin-top:14px;max-width:24ch}

  /* ---- contact ---- */
  #contact{padding-bottom:46px}
  form{margin-top:34px;max-width:540px}
  .field{margin-bottom:20px}
  label{display:block;font-size:13px;letter-spacing:.06em;text-transform:uppercase;
    font-weight:600;color:var(--white-dim);margin-bottom:10px}
  input,textarea{width:100%;font-family:var(--text);font-size:17px;color:var(--white);
    background:var(--surface);border:1px solid var(--rule);border-radius:10px;
    padding:14px 16px;outline:none;transition:border-color .2s,background .2s}
  input::placeholder,textarea::placeholder{color:#5c5a55}
  input:focus,textarea:focus{border-color:var(--accent);background:#20202a}
  textarea{resize:vertical;min-height:130px}
  button{font-family:var(--display);font-size:17px;font-weight:700;cursor:pointer;
    letter-spacing:-.01em;background:var(--accent);color:#1a0d08;border:none;
    border-radius:100px;padding:15px 34px;transition:.2s}
  button:hover{background:var(--white);color:var(--bg)}
  button:disabled{opacity:.5;cursor:default}
  .formnote{font-size:15px;color:var(--white-dim);margin-top:18px}
  #status{margin-top:20px;font-size:17px;display:none}
  #status.show{display:block}
  #status.ok{color:var(--accent)}

  footer{border-top:1px solid var(--rule);padding:34px 0 70px;
    font-size:14px;color:var(--white-dim);display:flex;
    justify-content:space-between;flex-wrap:wrap;gap:12px}
  footer a{color:var(--white-dim);text-decoration:none;
    border-bottom:1px solid transparent;transition:.2s}
  footer a:hover{color:var(--accent);border-color:var(--accent)}

  /* reveal on load */
  .reveal{opacity:0;transform:translateY(16px);
    animation:rise .75s cubic-bezier(.2,.7,.2,1) forwards}
  @keyframes rise{to{opacity:1;transform:none}}
  .d1{animation-delay:.05s}.d2{animation-delay:.18s}.d3{animation-delay:.33s}

  @media(max-width:560px){
    body{font-size:17px}
    .hero{padding:64px 0 54px}
    .work li:hover{padding-left:0}
    .fact .n{font-size:40px}
  }