:root{
  --wine:#93003C; --wine-bright:#b30f4d; --wine-deep:#5e0026;
  --rose-lt:#e2588a; --gold:#d99b3e;
  --plum:#2a0916; --ink:#1b0610; --plum-soft:#3d1526;
  --ecru:#f5ece7; --ecru-deep:#ecdcd6;
  --marigold:#93003C; --rose:#e2588a; --pine:#2e6e5b;
  --line:rgba(245,236,231,.14);
  --disp:"Fraunces",Georgia,serif;
  --body:"Space Grotesk",system-ui,sans-serif;
  --mono:"Space Mono",ui-monospace,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--body); background:#fff; color:var(--plum-soft);
  line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
::selection{background:var(--wine); color:#fff}
a{color:inherit; text-decoration:none}
img{max-width:100%}

.wpk-mono{font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase}
.wpk-eyebrow{font-family:var(--mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--rose-lt)}
.wpk-display{font-family:var(--disp); font-weight:600; line-height:1.02; letter-spacing:-.02em}
.wpk-display em{font-style:italic; color:var(--rose-lt)}

.wpk-section{padding:clamp(3.5rem,8vw,7rem) 0}
.wpk-dark{background:var(--plum); color:var(--ecru)}
.wpk-dark .wpk-display{color:var(--ecru)}
.wpk-light{background:#fff; color:var(--plum-soft)}
.wpk-kicker{display:inline-flex; align-items:center; gap:.55rem; margin-bottom:1.1rem}
.wpk-kicker::before{content:""; width:26px; height:2px; background:var(--wine); display:inline-block}
.wpk-dark .wpk-kicker::before,.wpk-ai .wpk-kicker::before{background:var(--rose-lt)}

/* ---------- Buttons ---------- */
.wpk-btn{
  font-family:var(--body); font-weight:600; font-size:.95rem;
  padding:.8rem 1.5rem; border-radius:2px; border:1.5px solid transparent;
  display:inline-flex; align-items:center; gap:.5rem; cursor:pointer;
  transition:transform .18s ease, background .18s ease, color .18s ease;
}
.wpk-btn:hover{transform:translateY(-2px)}
.wpk-btn-primary{background:var(--wine); color:#fff}
.wpk-btn-primary:hover{background:var(--wine-bright)}
.wpk-btn-ghost{background:transparent; color:var(--ecru); border-color:var(--line)}
.wpk-btn-ghost:hover{border-color:var(--rose-lt); color:var(--rose-lt)}
.wpk-btn-outline{background:transparent; color:var(--wine); border-color:var(--wine)}
.wpk-btn-outline:hover{background:var(--wine); color:#fff}
.wpk-btn-dark{background:#fff; color:var(--wine)}
.wpk-btn-dark:hover{background:#fff}
:focus-visible{outline:2.5px solid var(--rose-lt); outline-offset:3px}

/* ---------- Navbar ---------- */
.wpk-nav{background:rgba(26,6,16,.85); backdrop-filter:blur(10px); border-bottom:1px solid var(--line)}
.wpk-brand{display:flex; align-items:center; gap:.6rem; font-family:var(--disp); font-weight:600; font-size:1.25rem; color:var(--ecru)}
.wpk-mark{width:30px; height:30px; flex:0 0 auto}
.wpk-wordmark{height:1.5rem; width:auto; flex:0 0 auto; display:block}
.wpk-nav .nav-link{color:rgba(243,237,227,.72); font-size:.92rem; font-weight:500; padding:.4rem .9rem}
.wpk-nav .nav-link:hover,.wpk-nav .nav-link:focus{color:var(--rose-lt)}
.wpk-nav .nav-link.wpk-active{color:var(--rose-lt)}
.navbar-toggler{border-color:var(--line)}

/* ---------- Home hero ---------- */
.wpk-hero{position:relative; background:var(--plum); color:var(--ecru); overflow:hidden}
.wpk-hero h1{font-size:clamp(2.5rem,6.4vw,4.6rem); margin:.6rem 0 1.3rem}
.wpk-hero-lead{font-size:1.12rem; max-width:34rem; color:rgba(243,237,227,.82)}
.wpk-hero-note{font-family:var(--mono); font-size:.72rem; color:rgba(243,237,227,.5); margin-top:1.4rem; letter-spacing:.06em}
.wpk-knit-wrap{position:relative}
.wpk-knit{width:100%; height:auto; display:block; filter:drop-shadow(0 24px 60px rgba(0,0,0,.35))}
.wpk-code-line{opacity:0; transform:translateY(9px); transition:opacity .45s ease, transform .45s ease}
.wpk-knit.is-knit .wpk-code-line{opacity:1; transform:translateY(0)}
.wpk-cursor{animation:wpk-blink 1.05s steps(1) infinite}
@keyframes wpk-blink{50%{opacity:0}}
@media (prefers-reduced-motion: reduce){
  .wpk-code-line{transition:none; opacity:1; transform:none}
  .wpk-cursor{animation:none}
}

/* ---------- Interior page hero ---------- */
.wpk-phero{background:var(--plum); color:var(--ecru); position:relative; overflow:hidden;
  padding:clamp(3rem,7vw,5.5rem) 0 clamp(2.6rem,6vw,4rem)}
.wpk-phero h1{font-family:var(--disp); font-weight:600; letter-spacing:-.02em; line-height:1.03;
  font-size:clamp(2.2rem,5.5vw,3.7rem); margin:.5rem 0 1rem; color:var(--ecru)}
.wpk-phero h1 em{font-style:italic; color:var(--rose-lt)}
.wpk-phero p{color:rgba(243,237,227,.8); max-width:40rem; font-size:1.08rem; margin:0}

/* ---------- Zigzag divider ---------- */
.wpk-zig{height:16px; width:100%;
  background:
    linear-gradient(-45deg, var(--plum) 8px, transparent 0) 0 8px / 16px 16px repeat-x,
    linear-gradient(45deg, var(--plum) 8px, transparent 0) 0 8px / 16px 16px repeat-x;
}
.wpk-zig-ecru{background:
    linear-gradient(-45deg, #fff 8px, transparent 0) 0 8px / 16px 16px repeat-x,
    linear-gradient(45deg, #fff 8px, transparent 0) 0 8px / 16px 16px repeat-x;}

/* ---------- Service cards (home) ---------- */
.wpk-card{background:#fff; border:1px solid var(--ecru-deep); border-radius:6px; padding:1.7rem 1.5rem; height:100%;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease}
.wpk-card:hover{transform:translateY(-5px); box-shadow:0 18px 40px rgba(147,0,60,.14); border-color:var(--wine)}
.wpk-card h3{font-family:var(--disp); font-size:1.28rem; font-weight:600; color:var(--plum); margin:.9rem 0 .5rem}
.wpk-card p{font-size:.95rem; margin:0; color:#6a5560}
.wpk-vmark{width:34px; height:26px}
.wpk-card:hover .wpk-vmark path{stroke:var(--wine-bright)}

/* ---------- Service detail rows (services page) ---------- */
.wpk-srow{padding:clamp(2.4rem,6vw,4.2rem) 0; border-bottom:1px solid var(--ecru-deep)}
.wpk-srow:last-of-type{border-bottom:none}
.wpk-srow .wpk-num{font-family:var(--mono); color:var(--wine); font-size:.78rem; letter-spacing:.12em}
.wpk-srow h2{font-family:var(--disp); font-weight:600; color:var(--plum); margin:.4rem 0 .7rem;
  font-size:clamp(1.6rem,3.6vw,2.4rem)}
.wpk-srow>.container>.row>.col-lg-6>p{color:#5f4b55}
.wpk-slist{list-style:none; padding:0; margin:1.2rem 0 0}
.wpk-slist li{position:relative; padding-left:1.7rem; margin-bottom:.6rem; color:#6a5560; font-size:.97rem}
.wpk-slist li::before{content:""; position:absolute; left:2px; top:.35em; width:9px; height:9px;
  border-left:2.5px solid var(--wine); border-bottom:2.5px solid var(--wine); transform:rotate(-45deg)}
.wpk-outcome{display:inline-block; font-family:var(--mono); font-size:.72rem; text-transform:uppercase;
  letter-spacing:.06em; color:var(--wine); margin-top:1.2rem; border-top:2px solid var(--wine); padding-top:.5rem}
.wpk-sart{background:linear-gradient(135deg,var(--wine),var(--wine-deep)); border-radius:10px; aspect-ratio:4/3;
  display:flex; align-items:center; justify-content:center; overflow:hidden; box-shadow:0 20px 50px rgba(147,0,60,.22)}
.wpk-sart svg{width:46%; height:auto}
.wpk-simg{width:100%; height:100%; display:block; object-fit:cover; border-radius:10px}

/* ---------- Why (dark) ---------- */
.wpk-why-item{border-top:1px solid var(--line); padding:1.5rem 0}
.wpk-why-item h3{font-family:var(--disp); font-size:1.3rem; color:var(--ecru); margin:0 0 .35rem}
.wpk-why-item p{color:rgba(243,237,227,.72); margin:0; font-size:.97rem}

/* ---------- Process ---------- */
.wpk-step{position:relative; padding-top:1.4rem}
.wpk-step-num{font-family:var(--mono); font-weight:700; font-size:.8rem; color:var(--wine); letter-spacing:.1em}
.wpk-step h3{font-family:var(--disp); font-size:1.5rem; color:var(--plum); margin:.4rem 0 .5rem}
.wpk-step p{font-size:.95rem; color:#6a5560; margin:0}
.wpk-step::before{content:""; position:absolute; top:0; left:0; width:44px; height:3px; background:var(--wine)}

/* ---------- About story ---------- */
.wpk-lede{font-family:var(--disp); font-weight:500; color:var(--plum); line-height:1.32;
  font-size:clamp(1.35rem,3vw,2rem)}
.wpk-prose p{color:#5f4b55; margin-bottom:1.1rem; font-size:1.02rem}
.wpk-stat{border-left:2px solid var(--wine); padding-left:1rem}
.wpk-stat b{font-family:var(--disp); font-size:2rem; color:var(--wine); display:block; line-height:1}
.wpk-stat span{font-size:.88rem; color:#6a5560}

/* ---------- AI visibility band ---------- */
.wpk-ai{background:var(--ink); color:var(--ecru)}
.wpk-ai .wpk-chip{font-family:var(--mono); font-size:.72rem; border:1px solid var(--line); border-radius:999px;
  padding:.35rem .8rem; color:var(--rose-lt)}

/* ---------- Portfolio ---------- */
.wpk-work{border-radius:8px; overflow:hidden; border:1px solid var(--ecru-deep); background:#fff; height:100%;
  transition:transform .2s ease, box-shadow .2s ease}
.wpk-work:hover{transform:translateY(-5px); box-shadow:0 18px 40px rgba(147,0,60,.14)}
.wpk-work-thumb{aspect-ratio:16/10; position:relative; overflow:hidden}
.wpk-th1{background:repeating-linear-gradient(45deg,var(--wine) 0 14px,var(--wine-bright) 14px 28px)}
.wpk-th2{background:repeating-linear-gradient(-45deg,var(--wine-deep) 0 14px,var(--wine) 14px 28px)}
.wpk-th3{background:repeating-linear-gradient(45deg,var(--plum) 0 14px,var(--wine) 14px 28px)}
.wpk-th4{background:repeating-linear-gradient(90deg,var(--wine) 0 14px,var(--rose-lt) 14px 28px)}
.wpk-th5{background:repeating-linear-gradient(-45deg,var(--wine) 0 14px,var(--gold) 14px 28px)}
.wpk-th6{background:repeating-linear-gradient(45deg,var(--wine-deep) 0 14px,var(--rose-lt) 14px 28px)}
.wpk-work-body{padding:1.3rem 1.4rem}
.wpk-work-tag{font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--wine)}
.wpk-work h3{font-family:var(--disp); font-size:1.3rem; color:var(--plum); margin:.4rem 0}
.wpk-work p{font-size:.92rem; color:#6a5560; margin:0}

/* ---------- FAQ ---------- */
.wpk-faq .accordion-item{background:transparent; border:none; border-bottom:1px solid var(--ecru-deep)}
.wpk-faq .accordion-button{background:transparent; font-family:var(--disp); font-size:1.15rem; font-weight:600;
  color:var(--plum); padding:1.25rem .25rem; box-shadow:none}
.wpk-faq .accordion-button:not(.collapsed){color:var(--rose); background:transparent}
.wpk-faq .accordion-button:focus{box-shadow:none}
.wpk-faq .accordion-button:not(.collapsed)::after{filter:invert(12%) sepia(90%) saturate(5000%) hue-rotate(320deg)}
.wpk-faq .accordion-body{padding:.25rem .25rem 1.4rem; color:#6a5560; font-size:.98rem}

/* ---------- Contact form ---------- */
.wpk-form label{font-family:var(--mono); font-size:.68rem; letter-spacing:.08em; text-transform:uppercase;
  color:var(--plum-soft); margin-bottom:.35rem; display:block}
.wpk-form .form-control,.wpk-form .form-select{border:1px solid var(--ecru-deep); border-radius:4px;
  padding:.75rem .9rem; font-family:var(--body); background:#fff; color:var(--plum-soft)}
.wpk-form .form-control:focus,.wpk-form .form-select:focus{border-color:var(--wine); box-shadow:0 0 0 .18rem rgba(147,0,60,.15)}
.wpk-form .form-control::placeholder{color:#b3a3ab}
.wpk-note{font-size:.82rem; color:#8a7680; margin-top:.9rem}
.wpk-contact-card{background:var(--plum); color:var(--ecru); border-radius:10px; padding:2rem 1.8rem}
.wpk-contact-card h3{font-family:var(--disp); color:#fff; font-size:1.35rem; margin:0 0 1rem}
.wpk-contact-card a{color:var(--rose-lt)}
.wpk-crow{display:flex; gap:.85rem; align-items:flex-start; padding:.85rem 0; border-top:1px solid var(--line)}
.wpk-crow:first-of-type{border-top:none}
.wpk-crow .wpk-clabel{font-family:var(--mono); font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; color:rgba(243,237,227,.55)}
.wpk-crow .wpk-cval{font-size:.98rem; color:var(--ecru)}

/* ---------- CTA ---------- */
.wpk-cta{background:var(--wine); color:var(--ecru)}
.wpk-cta .wpk-display{color:#fff}
.wpk-cta p{color:rgba(245,236,231,.82)}

/* ---------- Footer ---------- */
.wpk-foot{background:var(--ink); color:rgba(243,237,227,.7); padding:3.5rem 0 2rem}
.wpk-foot a:hover{color:var(--rose-lt)}
.wpk-foot h4{font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--rose-lt); margin-bottom:1rem}
.wpk-foot-links a{display:block; padding:.28rem 0; font-size:.93rem; color:rgba(243,237,227,.7)}

/* ---------- Reveal ---------- */
.wpk-reveal{opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease}
.wpk-reveal.is-in{opacity:1; transform:none}

@media (max-width:991px){
  .wpk-knit-wrap{max-width:420px; margin:2.5rem auto 0}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .wpk-stitch{transition:none; stroke-dashoffset:0}
  .wpk-reveal{transition:none; opacity:1; transform:none}
  .wpk-btn:hover,.wpk-card:hover,.wpk-work:hover{transform:none}
}
