:root{
  --bg: oklch(0.20 0.035 250);
  --bg-darker: oklch(0.14 0.03 250);
  --bg-card: oklch(0.26 0.032 250);
  --border: oklch(0.36 0.03 250);
  --text: oklch(0.97 0.006 250);
  --text-muted: oklch(0.72 0.018 250);
  --paper: oklch(0.985 0.004 90);
  --paper-card: oklch(0.998 0.002 90);
  --ink: oklch(0.20 0.035 250);
  --ink-muted: oklch(0.48 0.02 250);
  --ink-border: oklch(0.90 0.008 90);
  --accent: #f04e1b;
  --accent-strong: #c93f16;
  --accent-on-light: #c93f16;
  --accent-ink: #ffffff;
  --font-display: 'Poppins', 'Segoe UI', sans-serif;
  --font-body: 'IBM Plex Sans', 'Segoe UI', Arial, sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--text);font-family:var(--font-body);line-height:1.6;-webkit-font-smoothing:antialiased;}
svg{display:block;flex-shrink:0;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;}
button{font:inherit;cursor:pointer;}
input,textarea{font:inherit;}
h1,h2,h3{font-family:var(--font-display);font-weight:700;letter-spacing:-0.01em;line-height:1.15;text-wrap:pretty;}
.container{max-width:1180px;margin:0 auto;padding:0 40px;}
.eyebrow{display:inline-block;text-transform:uppercase;letter-spacing:0.12em;font-size:12.5px;font-weight:700;color:var(--accent);margin-bottom:14px;}
.eyebrow.on-light{color:var(--accent-on-light);}
.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 30px;border-radius:999px;font-weight:700;font-size:14.5px;white-space:nowrap;transition:background .15s ease,border-color .15s ease,color .15s ease,transform .15s ease;}
.btn-primary{background:var(--accent);color:var(--accent-ink);}
.btn-primary:hover{background:var(--accent-strong);}
.btn-outline{border:1.5px solid oklch(1 0 0 / 0.3);color:var(--text);}
.btn-outline:hover{border-color:var(--accent);color:var(--accent);}
.btn-outline-dark{border:1.5px solid oklch(0 0 0 / 0.35);color:var(--ink);}
.btn-outline-dark:hover{border-color:var(--accent-strong);color:var(--accent-strong);}
.icon{width:20px;height:20px;stroke:currentColor;stroke-width:1.75;fill:none;stroke-linecap:round;stroke-linejoin:round;}

.logo{display:flex;align-items:center;flex-shrink:0;}
.logo-img{height:38px;width:auto;display:block;}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:oklch(0.14 0.03 250 / 0.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:16px 40px;position:relative;}
.site-nav ul{display:flex;gap:32px;}
.site-nav a{font-size:14.5px;font-weight:600;color:var(--text-muted);transition:color .15s ease;}
.site-nav a:hover{color:var(--text);}
.header-actions{display:flex;align-items:center;gap:22px;}
.header-phone{display:flex;align-items:center;gap:9px;font-weight:700;font-size:14.5px;}
.header-phone .icon{width:17px;height:17px;color:var(--accent);}
.nav-toggle-input{position:absolute;opacity:0;pointer-events:none;}
.hamburger{display:none;flex-direction:column;gap:5px;width:26px;cursor:pointer;flex-shrink:0;}
.hamburger span{display:block;height:2px;width:100%;background:var(--text);transition:transform .2s ease,opacity .2s ease;}
.mobile-panel{max-height:0;overflow:hidden;transition:max-height .25s ease;background:var(--bg-darker);border-top:1px solid var(--border);}
.mobile-panel-inner{display:flex;flex-direction:column;gap:22px;padding:26px 40px;}
.mobile-panel ul{display:flex;flex-direction:column;gap:18px;}
.mobile-panel a{font-size:16px;font-weight:600;}
#nav-toggle:checked ~ .mobile-panel{max-height:420px;}
#nav-toggle:checked ~ .header-inner .hamburger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
#nav-toggle:checked ~ .header-inner .hamburger span:nth-child(2){opacity:0;}
#nav-toggle:checked ~ .header-inner .hamburger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* hero */
.hero{position:relative;overflow:hidden;background:var(--bg);color:var(--text);padding:88px 0 64px;}
.hero-pattern{position:absolute;inset:0;opacity:0.5;pointer-events:none;}
.hero-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:48px;align-items:center;}
.hero h1{font-size:clamp(2.1rem,3.6vw + 1.2rem,3.4rem);margin-bottom:22px;}
.hero h1 .accent-line{display:block;color:var(--accent);}
.hero h1 .white-line{display:block;color:var(--text);}
.hero p{font-size:17px;color:var(--text-muted);max-width:50ch;margin-bottom:16px;}
.hero p:last-of-type{margin-bottom:32px;}
.hero-ctas{display:flex;flex-wrap:wrap;gap:16px;}
.hero-art{display:flex;flex-direction:column;align-items:center;}

/* trust badge strip (light) */
.badge-strip{background:var(--paper);color:var(--ink);border-bottom:1px solid var(--ink-border);padding:26px 0;}
.badge-row{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;}
.badge-pill{display:flex;align-items:center;gap:8px;border:1px solid var(--ink-border);border-radius:999px;padding:10px 20px;font-size:13px;font-weight:600;color:var(--ink-muted);}
.badge-pill .icon{width:16px;height:16px;color:var(--accent-on-light);}

/* intro narrative (light) */
.intro{background:var(--paper);color:var(--ink);padding:80px 0;}
.intro-grid{display:grid;grid-template-columns:0.85fr 1.15fr;gap:56px;align-items:start;}
.intro h2{font-size:clamp(1.7rem,2.4vw + 1rem,2.3rem);margin-bottom:14px;color:var(--ink);}
.intro-kicker{font-size:15px;color:var(--accent-on-light);font-weight:600;margin-bottom:20px;}
.intro p{color:var(--ink-muted);font-size:16px;margin-bottom:16px;}
.intro p.closing{color:var(--ink);font-weight:600;}

section.pad{padding:96px 0;}
.section-head{max-width:620px;margin:0 auto 52px;text-align:center;}
.section-head h2{font-size:clamp(1.7rem,2.4vw + 1rem,2.3rem);}
.section-head p{color:var(--ink-muted);margin-top:12px;font-size:16px;}

/* who we seal grid */
.who-we-seal{background:var(--paper);color:var(--ink);}
.seal-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:2px;}
.seal-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;padding:26px 14px;border-radius:16px;transition:background .15s ease;}
.seal-card:hover{background:var(--paper-card);box-shadow:0 1px 2px oklch(0 0 0 / 0.05);}
.seal-icon-wrap{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:oklch(0.96 0.02 26);color:var(--accent-on-light);}
.seal-icon-wrap .icon{width:24px;height:24px;}
.seal-card span{font-weight:600;font-size:14px;line-height:1.3;}

/* value prop */
.value-prop{background:var(--bg-darker);}
.value-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:56px;align-items:start;}
.value-grid h2{font-size:clamp(1.7rem,2.4vw + 1rem,2.3rem);margin-bottom:18px;}
.value-grid > div:first-child p{color:var(--text-muted);font-size:16px;margin-bottom:16px;max-width:56ch;}
.credential-card{background:var(--bg-card);border:1px solid var(--border);border-radius:20px;padding:34px;}
.credential-card h3{font-family:var(--font-display);font-size:13px;text-transform:uppercase;letter-spacing:0.1em;color:var(--text-muted);margin-bottom:22px;font-weight:700;}
.credential-note{margin-top:24px;padding-top:22px;border-top:1px solid var(--border);font-size:13px;color:var(--text-muted);}
.badge3-row{display:flex;gap:14px;justify-content:space-between;}
.badge3{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;flex:1;}
.badge3-title{font-family:var(--font-display);font-weight:700;font-size:12.5px;letter-spacing:0.01em;}
.badge3-sub{font-size:10.5px;color:var(--text-muted);line-height:1.3;}
@media (max-width:520px){.badge3-row{flex-wrap:wrap;}.badge3{flex:1 1 40%;}}

/* projects — horizontal scroll carousel, 3 visible at a time */
.projects{background:var(--paper);color:var(--ink);}
.project-scroll{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 4px 12px;scrollbar-width:none;}
.project-scroll::-webkit-scrollbar{display:none;}
.project-card{flex:0 0 calc((100% - 48px)/3);scroll-snap-align:start;background:var(--paper-card);border:1px solid var(--ink-border);border-radius:20px;overflow:hidden;}
.project-art{height:170px;display:flex;align-items:center;justify-content:center;background:var(--ink);}
.project-body{padding:22px 24px;}
.project-body h3{font-family:var(--font-display);font-weight:700;font-size:17px;margin-bottom:8px;}
.project-body p{color:var(--ink-muted);font-size:13.5px;}
.project-hint{text-align:center;font-size:12.5px;color:var(--ink-muted);margin-top:14px;}

/* callback form (light) */
.callback{background:var(--paper);color:var(--ink);}
.callback-card{background:var(--paper-card);border:1px solid var(--ink-border);border-radius:24px;padding:52px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;box-shadow:0 1px 3px oklch(0 0 0 / 0.06);}
.callback-copy h2{font-size:clamp(1.6rem,2.2vw + 1rem,2.1rem);margin-bottom:16px;color:var(--ink);}
.callback-copy p{color:var(--ink-muted);font-size:15px;margin-bottom:12px;}
.callback-form{display:flex;flex-direction:column;gap:16px;}
.field{display:flex;flex-direction:column;gap:7px;}
.field label{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--ink-muted);}
.field input,.field textarea{background:var(--paper);border:1px solid var(--ink-border);border-radius:12px;color:var(--ink);padding:13px 16px;}
.field input:focus,.field textarea:focus{outline:2px solid var(--accent);outline-offset:1px;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}

/* footer */
.site-footer{background:var(--bg-darker);border-top:1px solid var(--border);padding:32px 0;}
.footer-inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;}
.footer-brand{display:flex;align-items:center;gap:16px;}
.footer-logo{height:26px;width:auto;display:block;opacity:0.9;}
.footer-inner p{font-size:13px;color:var(--text-muted);}
.footer-links{display:flex;gap:22px;}
.footer-links a{font-size:13px;color:var(--text-muted);font-weight:600;}
.footer-links a:hover{color:var(--text);}

.gun-group{transform-box:view-box;transform-origin:0 0;animation:gunApply 6s linear infinite;}
.bead-path{animation:beadApply 6s linear infinite;}
@keyframes gunApply{
  0%{transform:translate(81px,106px) rotate(0deg);opacity:0;}
  8%{transform:translate(81px,106px) rotate(0deg);opacity:1;}
  25.1%{transform:translate(239px,106px) rotate(0deg);opacity:1;}
  25.11%{transform:translate(239px,106px) rotate(90deg);opacity:1;}
  46.5%{transform:translate(239px,304px) rotate(90deg);opacity:1;}
  46.51%{transform:translate(239px,304px) rotate(180deg);opacity:1;}
  63.6%{transform:translate(81px,304px) rotate(180deg);opacity:1;}
  63.61%{transform:translate(81px,304px) rotate(270deg);opacity:1;}
  85%{transform:translate(81px,106px) rotate(270deg);opacity:1;}
  93%{transform:translate(81px,106px) rotate(270deg);opacity:0;}
  100%{transform:translate(81px,106px) rotate(0deg);opacity:0;}
}
@keyframes beadApply{
  0%{stroke-dashoffset:712;opacity:0;}
  8%{stroke-dashoffset:712;opacity:1;}
  85%{stroke-dashoffset:0;opacity:1;}
  93%{opacity:0;stroke-dashoffset:0;}
  100%{stroke-dashoffset:712;opacity:0;}
}
@media (prefers-reduced-motion: reduce){
  .gun-group{animation:none;transform:translate(81px,106px) rotate(270deg);opacity:1;}
  .bead-path{animation:none;stroke-dashoffset:0;opacity:1;}
}

@media (max-width:980px){
  .container{padding:0 24px;}
  .header-inner{padding:14px 24px;}
  .site-nav,.header-actions .btn-primary,.header-phone{display:none;}
  .hamburger{display:flex;}
  .hero-grid,.intro-grid,.value-grid{grid-template-columns:1fr;}
  .hero-art{order:-1;max-width:260px;margin:0 auto 28px;}
  .seal-grid{grid-template-columns:repeat(3,1fr);}
  .project-card{flex:0 0 calc((100% - 24px)/2);}
  .callback-card{grid-template-columns:1fr;padding:36px 28px;}
  section.pad{padding:72px 0;}
  .intro{padding:56px 0 72px;}
}
@media (max-width:560px){
  .seal-grid{grid-template-columns:repeat(2,1fr);}
  .field-row{grid-template-columns:1fr;}
  .badge-row{justify-content:flex-start;overflow-x:auto;}
  .project-card{flex:0 0 88%;}
}
