:root{
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --ink: #0A0A0B;
  --ink-soft: #17171A;
  --paper: #FFFFFF;
  --paper-dim: #FAFAF8;
  --paper-dim-2: #F3F2EF;
  --line: rgba(10,10,11,0.10);
  --line-strong: rgba(10,10,11,0.24);
  --muted: rgba(10,10,11,0.56);
  --muted-2: rgba(10,10,11,0.40);
  --on-ink-muted: rgba(255,255,255,0.56);
  --on-ink-line: rgba(255,255,255,0.14);
  --live: #34C759;
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --r-full: 999px;
  --shadow-card: 0 1px 2px rgba(10,10,11,0.04), 0 18px 40px -20px rgba(10,10,11,0.16);
  --shadow-card-hover: 0 1px 2px rgba(10,10,11,0.06), 0 26px 54px -18px rgba(10,10,11,0.26);
}
*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:'Inter', system-ui, -apple-system, sans-serif;
  background:var(--paper);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  font-size:16px;
  line-height:1.5;
}
a{ color:inherit; text-decoration:none; }
img,svg{ display:block; }
button{ font-family:inherit; }
::selection{ background:var(--ink); color:var(--paper); }
.mono{ font-family:'JetBrains Mono', ui-monospace, monospace; }

.wrap{ max-width:1240px; margin:0 auto; padding-left:24px; padding-right:24px; }
@media(min-width:900px){ .wrap{ padding-left:48px; padding-right:48px; } }

/* ---------------- Utility: reveal-on-scroll ---------------- */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.in{ opacity:1; transform:translateY(0); }
.reveal-d1.in{ transition-delay:.08s; }
.reveal-d2.in{ transition-delay:.16s; }
.reveal-d3.in{ transition-delay:.24s; }
.reveal-d4.in{ transition-delay:.32s; }

/* ---------------- Eyebrow / index labels ---------------- */
.eyebrow{
  display:flex; align-items:center; gap:10px;
  font-family:'JetBrains Mono', monospace;
  font-size:11px; font-weight:500; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--muted-2);
}
.eyebrow .idx-dot{ width:6px; height:6px; border-radius:50%; background:var(--ink); flex:none; }
.on-ink .eyebrow{ color:var(--on-ink-muted); }
.on-ink .eyebrow .idx-dot{ background:#fff; }

.h-display{ font-weight:300; letter-spacing:-0.03em; line-height:0.98; }
.h-display b{ font-weight:600; }

/* ---------------- Buttons ---------------- */
.btn{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13px; font-weight:500; letter-spacing:-0.005em;
  padding:13px 24px; border-radius:var(--r-full);
  border:1px solid transparent; cursor:pointer;
  transition:transform .25s var(--ease), background .25s var(--ease), border-color .25s var(--ease), color .25s var(--ease), box-shadow .25s var(--ease);
  white-space:nowrap;
}
.btn:active{ transform:scale(0.97); }
.btn-primary{ background:var(--ink); color:#fff; }
.btn-primary:hover{ background:#000; box-shadow:0 10px 24px -8px rgba(10,10,11,0.45); }
.btn-outline{ background:transparent; color:var(--ink); border-color:var(--line-strong); }
.btn-outline:hover{ border-color:var(--ink); }
.btn-on-ink{ background:#fff; color:var(--ink); }
.btn-on-ink:hover{ background:#eee; }
.btn-outline-on-ink{ background:transparent; color:#fff; border-color:var(--on-ink-line); }
.btn-outline-on-ink:hover{ border-color:rgba(255,255,255,0.6); }
.btn svg{ width:13px; height:13px; }
.btn-sm{ padding:9px 16px; font-size:12px; }

/* ================= NAVBAR ================= */
.navbar{
  position:fixed; top:0; left:0; right:0; z-index:60;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 20px;
  pointer-events:none;
  opacity:0; transform:translateY(-16px);
  animation:navIn .8s var(--ease) .05s forwards;
}
.navbar > *{ pointer-events:auto; }
@keyframes navIn{ to{ opacity:1; transform:translateY(0); } }

.logo{
  display:flex; align-items:center; gap:10px;
  background:rgba(255,255,255,0.7);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border:1px solid var(--line);
  border-radius:var(--r-full);
  padding:9px 16px 9px 9px;
  box-shadow:0 4px 20px -8px rgba(10,10,11,0.12);
}
.logo-mark{ width:26px; height:26px; }
.logo-mark rect{ fill:#000; }
.brand-text{ font-weight:600; font-size:13.5px; letter-spacing:-0.01em; display:none; }

.nav-center{
  display:none;
  align-items:center; gap:2px;
  background:rgba(255,255,255,0.7);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border:1px solid var(--line);
  border-radius:var(--r-full);
  padding:5px; box-shadow:0 4px 20px -8px rgba(10,10,11,0.12);
}
.nav-center a{
  font-size:12.5px; font-weight:500; color:var(--muted);
  padding:8px 15px; border-radius:var(--r-full);
  transition:background .2s var(--ease), color .2s var(--ease);
}
.nav-center a:hover{ background:var(--paper-dim-2); color:var(--ink); }

.menu-pill{
  display:flex; align-items:center; gap:8px;
  background:#000; color:#fff;
  border-radius:var(--r-full);
  padding:5px 16px 5px 5px;
  cursor:pointer; border:none;
  transition:transform .2s var(--ease);
}
.menu-pill:hover{ transform:translateY(-1px); }
.menu-pill .dot{
  width:26px; height:26px; border-radius:50%;
  background:#fff; color:#000;
  display:flex; align-items:center; justify-content:center;
}
.menu-pill span{ font-size:11.5px; font-weight:500; color:#fff; }

/* ================= NAV DRAWER ================= */
.drawer-scrim{
  position:fixed; inset:0; background:rgba(10,10,11,0.4);
  backdrop-filter:blur(2px);
  z-index:90; opacity:0; pointer-events:none; transition:opacity .4s var(--ease);
}
.drawer-scrim.open{ opacity:1; pointer-events:auto; }
.drawer{
  position:fixed; top:0; right:0; bottom:0; z-index:91;
  width:min(420px, 88vw);
  background:var(--ink); color:#fff;
  transform:translateX(100%);
  transition:transform .55s var(--ease);
  display:flex; flex-direction:column;
  padding:26px;
}
.drawer.open{ transform:translateX(0); }
.drawer-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:56px; }
.drawer-close{
  width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,0.08);
  border:1px solid var(--on-ink-line); color:#fff; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.drawer-close svg{ width:15px; height:15px; }
.drawer-links{ display:flex; flex-direction:column; }
.drawer-links a{
  display:flex; align-items:baseline; gap:16px;
  padding:16px 2px; border-top:1px solid var(--on-ink-line);
  font-size:clamp(1.4rem,4vw,2rem); font-weight:300; letter-spacing:-0.02em;
  transition:padding-left .3s var(--ease), color .3s var(--ease);
  color:#fff;
}
.drawer-links a:last-child{ border-bottom:1px solid var(--on-ink-line); }
.drawer-links a:hover{ padding-left:12px; color:rgba(255,255,255,0.7); }
.drawer-links a .num{ font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--on-ink-muted); }
.drawer-foot{ margin-top:auto; padding-top:28px; display:flex; flex-direction:column; gap:8px; }
.drawer-foot .label{ font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:0.12em; text-transform:uppercase; color:var(--on-ink-muted); }
.drawer-foot .val{ font-size:13.5px; }

/* ================= HERO ================= */
.hero{
  position:relative; min-height:100vh; width:100%;
  overflow:hidden; background:#0A0A0B;
}
.video-stage{ position:absolute; inset:0; z-index:0; }
.video-stage video{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0; transform:scale(1.06); animation:videoIn 1.8s var(--ease) .1s forwards;
}
@keyframes videoIn{ to{ opacity:1; transform:scale(1); } }
.hero-scrim{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(180deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.05) 22%, rgba(0,0,0,0.05) 55%, rgba(0,0,0,0.75) 100%);
}

/* Content overlay — sits on top of the video, inside the hero, never outside it */
.hero-content{
  position:relative; z-index:2;
  min-height:100vh;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:96px 20px 40px;
  gap:28px;
}
.status-chip{
  display:inline-flex; align-self:flex-start; align-items:center; gap:9px;
  background:rgba(255,255,255,0.10); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,0.18);
  border-radius:var(--r-full); padding:8px 16px 8px 12px;
  opacity:0; transform:translateY(10px); animation:chipIn .8s var(--ease) .35s forwards;
}
@keyframes chipIn{ to{ opacity:1; transform:translateY(0); } }
.status-chip .pulse{ width:7px; height:7px; border-radius:50%; background:var(--live); position:relative; flex:none; }
.status-chip .pulse::after{
  content:''; position:absolute; inset:-5px; border-radius:50%; border:1px solid var(--live);
  animation:ping 2.2s ease-out infinite;
}
@keyframes ping{ 0%{ transform:scale(0.6); opacity:0.9; } 100%{ transform:scale(2.2); opacity:0; } }
.status-chip span{ font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:0.06em; color:#fff; white-space:nowrap; text-shadow:0 1px 6px rgba(0,0,0,0.4); }
.status-chip .sep{ color:rgba(255,255,255,0.35); }

.hero-lower{ display:flex; flex-direction:column; gap:22px; }
.hero-text-block{ display:flex; flex-direction:column; gap:18px; max-width:760px; }
.subtitle{ display:flex; align-items:center; gap:8px; opacity:0; transform:translateY(16px); animation:subIn .8s var(--ease) .5s forwards; }
@keyframes subIn{ to{ opacity:1; transform:translateY(0); } }
.subtitle .dt{ width:8px; height:8px; border-radius:50%; background:#fff; flex:none; }
.subtitle span{ font-size:13px; color:rgba(255,255,255,0.72); text-shadow:0 1px 6px rgba(0,0,0,0.4); }
.headline{
  font-weight:300; font-size:clamp(2.1rem, 8vw, 4.6rem); color:#fff;
  letter-spacing:-0.03em; line-height:1.02;
  opacity:0; transform:translateY(22px); animation:headIn .85s var(--ease) .65s forwards;
}
@keyframes headIn{ to{ opacity:1; transform:translateY(0); } }
.headline b{ font-weight:600; }
.hero-sub-copy{
  max-width:520px; font-size:15px; color:rgba(255,255,255,0.72); line-height:1.65;
  opacity:0; transform:translateY(16px); animation:subCopyIn .85s var(--ease) .8s forwards;
}
@keyframes subCopyIn{ to{ opacity:1; transform:translateY(0); } }
.hero-buttons{ display:flex; gap:12px; flex-wrap:wrap; opacity:0; transform:translateY(16px); animation:btnIn .85s var(--ease) .95s forwards; }
@keyframes btnIn{ to{ opacity:1; transform:translateY(0); } }
.hero-tags-row{
  display:flex; gap:8px; flex-wrap:wrap;
  opacity:0; transform:translateY(16px); animation:tagsIn .85s var(--ease) 1.1s forwards;
}
@keyframes tagsIn{ to{ opacity:1; transform:translateY(0); } }
.tag-pill{
  background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.18); border-radius:var(--r-full);
  font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:0.02em;
  padding:8px 14px; color:rgba(255,255,255,0.85);
}
.scroll-cue{
  position:absolute; left:50%; bottom:16px; z-index:2; transform:translateX(-50%);
  display:none; flex-direction:column; align-items:center; gap:6px;
  opacity:0; animation:cueIn .8s var(--ease) 1.4s forwards;
}
@keyframes cueIn{ to{ opacity:.75; } }
.scroll-cue span{ font-family:'JetBrains Mono',monospace; font-size:9.5px; letter-spacing:0.14em; text-transform:uppercase; color:rgba(255,255,255,0.7); }
.scroll-cue svg{ width:13px; height:13px; stroke:rgba(255,255,255,0.7); animation:cueBounce 1.8s ease-in-out infinite; }
@keyframes cueBounce{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(5px); } }

@media(min-width:768px){
  .navbar{ padding:24px 40px; }
  .brand-text{ display:block; }
  .nav-center{ display:flex; }
  .menu-pill{ padding:6px 18px 6px 6px; }
  .menu-pill .dot{ width:32px; height:32px; }

  .hero-content{ padding:120px 44px 64px; }
  .hero-lower{ flex-direction:row; align-items:flex-end; justify-content:space-between; gap:40px; }
  .headline{ font-size:clamp(2.6rem, 5.2vw, 4.6rem); }
  .hero-tags-row{ flex-direction:column; align-items:flex-end; flex:none; }
  .scroll-cue{ display:flex; }
}

/* ================= SECTION SHELL ================= */
section{ position:relative; }
.section-pad{ padding:104px 0 108px; }
.section-pad-sm{ padding:72px 0; }
.section-title{ font-size:clamp(2rem,4.4vw,3.4rem); margin-top:20px; }
.section-head{ max-width:640px; }
.section-copy{ font-size:15px; color:var(--muted); line-height:1.7; margin-top:18px; max-width:520px; }
.divider{ border:none; border-top:1px solid var(--line); }
.on-ink .divider{ border-top:1px solid var(--on-ink-line); }

/* ================= INTRO / STATS STRIP ================= */
.stats-strip{ border-top:1px solid var(--line); }
.stats-row{
  display:grid; grid-template-columns:1fr; gap:0;
  border-top:1px solid var(--line);
  margin-top:52px;
}
@media(min-width:760px){ .stats-row{ grid-template-columns:repeat(4,1fr); } }
.stat-cell{
  padding:28px 6px; border-bottom:1px solid var(--line);
  display:flex; flex-direction:column; gap:6px;
}
@media(min-width:760px){
  .stat-cell{ border-bottom:none; border-right:1px solid var(--line); padding:32px 24px; }
  .stat-cell:last-child{ border-right:none; }
}
.stat-cell b{ font-size:clamp(1.8rem,3.2vw,2.6rem); font-weight:600; letter-spacing:-0.02em; }
.stat-cell span{ font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted-2); }
.intro-lede{ font-size:clamp(1.3rem,2.6vw,1.9rem); font-weight:300; letter-spacing:-0.015em; line-height:1.4; max-width:800px; }
.intro-lede b{ font-weight:600; }

/* ================= OWNER SECTION ================= */
.owner-grid{ display:grid; grid-template-columns:1fr; gap:52px; margin-top:56px; }
@media(min-width:940px){ .owner-grid{ grid-template-columns:0.86fr 1.14fr; align-items:start; } }

.owner-card{
  background:var(--ink); color:#fff; border-radius:var(--r-lg);
  padding:38px 34px; display:flex; flex-direction:column; gap:24px;
  box-shadow:var(--shadow-card);
}
.owner-avatar{
  width:64px; height:64px; border-radius:50%; background:#fff; color:var(--ink);
  display:flex; align-items:center; justify-content:center;
  font-size:22px; font-weight:600; letter-spacing:-0.02em;
}
.owner-name{ font-size:25px; font-weight:500; letter-spacing:-0.015em; }
.owner-role{ font-family:'JetBrains Mono',monospace; font-size:11.5px; letter-spacing:0.02em; color:var(--on-ink-muted); margin-top:6px; line-height:1.6; }
.owner-quote{
  font-size:15.5px; font-weight:300; line-height:1.6; letter-spacing:-0.01em;
  border-left:2px solid rgba(255,255,255,0.3); padding-left:16px; color:rgba(255,255,255,0.85);
}
.owner-loc{ display:flex; align-items:center; gap:8px; font-size:12px; color:var(--on-ink-muted); margin-top:auto; }
.owner-loc svg{ width:13px; height:13px; }

.owner-bio p{ font-size:15.5px; line-height:1.75; color:var(--muted); margin-bottom:17px; }
.owner-bio p:last-of-type{ margin-bottom:0; }
.owner-bio strong{ color:var(--ink); font-weight:600; }
.expertise-list{ display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }

.timeline{ margin-top:36px; display:flex; flex-direction:column; }
.timeline-row{
  display:grid; grid-template-columns:64px 1fr; gap:18px;
  padding:18px 0; border-top:1px solid var(--line);
}
.timeline-row:last-child{ border-bottom:1px solid var(--line); }
.timeline-row .yr{ font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--muted-2); padding-top:2px; }
.timeline-row .ti{ font-size:14px; font-weight:600; margin-bottom:4px; }
.timeline-row .td{ font-size:13.5px; color:var(--muted); line-height:1.6; }

/* ================= EXPERTISE (dark band) ================= */
.expertise-band{ background:var(--ink); color:#fff; }
.pillars{ display:grid; grid-template-columns:1fr; gap:0; margin-top:56px; border-top:1px solid var(--on-ink-line); }
@media(min-width:860px){ .pillars{ grid-template-columns:repeat(3,1fr); } }
.pillar{
  padding:38px 8px; border-bottom:1px solid var(--on-ink-line);
  display:flex; flex-direction:column; gap:16px;
}
@media(min-width:860px){
  .pillar{ padding:44px 32px; border-bottom:none; border-right:1px solid var(--on-ink-line); }
  .pillar:last-child{ border-right:none; }
}
.pillar .pnum{ font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--on-ink-muted); }
.pillar h3{ font-size:20px; font-weight:500; letter-spacing:-0.01em; }
.pillar p{ font-size:14px; line-height:1.7; color:var(--on-ink-muted); }
.pillar ul{ list-style:none; display:flex; flex-direction:column; gap:9px; margin-top:6px; }
.pillar li{ font-size:12.5px; color:rgba(255,255,255,0.75); display:flex; gap:9px; align-items:flex-start; }
.pillar li::before{ content:'—'; color:rgba(255,255,255,0.35); flex:none; }

/* ================= TOOLS SECTION ================= */
.tools-head-row{ display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:24px; }
.tools-list{ margin-top:60px; display:flex; flex-direction:column; }
.tool-row{
  border-top:1px solid var(--line);
  display:grid; grid-template-columns:1fr; gap:20px;
  padding:34px 4px; cursor:pointer; position:relative;
  transition:background .3s var(--ease);
}
.tools-list .tool-row:last-child{ border-bottom:1px solid var(--line); }
@media(min-width:860px){
  .tool-row{ grid-template-columns:70px 1.3fr 1.6fr 140px; align-items:center; gap:28px; padding:38px 20px; }
}
.tool-row:hover{ background:var(--paper-dim); }
.tool-num{ font-family:'JetBrains Mono',monospace; font-size:13px; color:var(--muted-2); }
.tool-main{ display:flex; align-items:flex-start; gap:16px; }
.tool-icon{
  width:44px; height:44px; border-radius:12px; background:var(--ink); color:#fff; flex:none;
  display:flex; align-items:center; justify-content:center;
  transition:transform .3s var(--ease);
}
.tool-row:hover .tool-icon{ transform:rotate(-6deg) scale(1.05); }
.tool-icon svg{ width:19px; height:19px; }
.tool-name{ font-size:19px; font-weight:600; letter-spacing:-0.015em; margin-bottom:5px; }
.tool-tags{ display:flex; gap:6px; flex-wrap:wrap; }
.tool-tags span{
  font-family:'JetBrains Mono',monospace; font-size:9.5px; letter-spacing:0.04em; text-transform:uppercase;
  color:var(--muted-2); border:1px solid var(--line); border-radius:var(--r-full); padding:4px 9px;
}
.tool-desc{ font-size:13.5px; color:var(--muted); line-height:1.65; }
.tool-cta{ display:flex; align-items:center; justify-content:flex-end; gap:10px; }
.tool-cta span{ font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:0.06em; text-transform:uppercase; color:var(--muted-2); }
.tool-arrow{
  width:34px; height:34px; border-radius:50%; border:1px solid var(--line-strong);
  display:flex; align-items:center; justify-content:center; flex:none;
  transition:background .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);
}
.tool-row:hover .tool-arrow{ background:var(--ink); border-color:var(--ink); transform:rotate(45deg); }
.tool-arrow svg{ width:14px; height:14px; transition:stroke .25s var(--ease); }
.tool-row:hover .tool-arrow svg{ stroke:#fff; }

.tools-note{
  margin-top:44px; display:flex; align-items:center; gap:10px;
  font-size:12.5px; color:var(--muted-2);
}
.tools-note svg{ width:15px; height:15px; flex:none; }

/* ================= PROCESS ================= */
.process-grid{ display:grid; grid-template-columns:1fr; gap:0; margin-top:56px; }
@media(min-width:860px){ .process-grid{ grid-template-columns:repeat(4,1fr); } }
.process-step{ padding:26px 4px; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:12px; }
@media(min-width:860px){ .process-step{ padding:0 24px 0 0; border-top:none; } .process-step:not(:last-child){ border-right:1px solid var(--line); padding-right:24px; } }
.process-step .pnum{ font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--muted-2); }
.process-step h4{ font-size:16.5px; font-weight:600; letter-spacing:-0.01em; }
.process-step p{ font-size:13px; color:var(--muted); line-height:1.65; }

/* ================= CTA BAND ================= */
.cta-band{ background:var(--ink); color:#fff; }
.cta-inner{
  display:flex; flex-direction:column; gap:30px; align-items:flex-start;
}
@media(min-width:860px){ .cta-inner{ flex-direction:row; align-items:flex-end; justify-content:space-between; } }
.cta-title{ font-size:clamp(2rem,5vw,3.4rem); font-weight:300; letter-spacing:-0.03em; line-height:1.05; max-width:640px; }
.cta-title b{ font-weight:600; }
.cta-actions{ display:flex; flex-direction:column; gap:16px; align-items:flex-start; }
.cta-email{ font-family:'JetBrains Mono',monospace; font-size:13px; color:var(--on-ink-muted); }

/* ================= FOOTER ================= */
footer{ padding:44px 0 40px; }
.footer-grid{ display:flex; flex-direction:column; gap:28px; }
@media(min-width:760px){ .footer-grid{ flex-direction:row; align-items:flex-start; justify-content:space-between; } }
.footer-links{ display:flex; gap:22px; flex-wrap:wrap; }
.footer-links a{ font-size:12.5px; color:var(--muted); }
.footer-links a:hover{ color:var(--ink); }
.footer-grid .logo{ background:none; border:none; box-shadow:none; padding:0; }
.footer-bottom{ display:flex; align-items:center; justify-content:space-between; margin-top:32px; padding-top:22px; border-top:1px solid var(--line); flex-wrap:wrap; gap:14px; }
.footer-bottom .copy{ font-size:11.5px; color:var(--muted-2); }
.to-top{
  display:flex; align-items:center; gap:7px; font-family:'JetBrains Mono',monospace;
  font-size:10.5px; letter-spacing:0.06em; text-transform:uppercase; color:var(--muted); cursor:pointer;
}
.to-top svg{ width:12px; height:12px; }

/* ================= TOOL OVERLAY ================= */
.tool-overlay{ position:fixed; inset:0; z-index:1000; background:var(--ink); opacity:0; pointer-events:none; transition:opacity .4s var(--ease); }
.tool-overlay.open{ opacity:1; pointer-events:auto; }
.tool-overlay iframe{ width:100%; height:100%; border:none; display:block; background:#fff; }
.overlay-loading{
  position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px;
  color:#fff;
}
.overlay-loading .spinner{ width:16px; height:16px; border-radius:50%; border:2px solid rgba(255,255,255,0.2); border-top-color:#fff; animation:spin .8s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg); } }
.overlay-loading span{ font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.6); }
.overlay-close{
  position:absolute; top:18px; right:18px; z-index:3; width:38px; height:38px; border-radius:50%;
  background:#fff; border:none; cursor:pointer; display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 18px rgba(0,0,0,0.25);
}
.overlay-close svg{ width:16px; height:16px; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; }
}

/* ================= WordPress additions (inner pages, admin bar) ================= */
body.admin-bar .navbar{ top:32px; }
@media(max-width:782px){ body.admin-bar .navbar{ top:46px; } }
.wp-page{ padding:140px 0 96px; min-height:60vh; }
.wp-page .entry-title{ font-weight:300; letter-spacing:-0.03em; line-height:1.05; font-size:clamp(2rem,4.4vw,3.4rem); margin:18px 0 32px; }
.wp-page .entry-title b{ font-weight:600; }
.wp-page .entry-content{ max-width:760px; font-size:16px; line-height:1.75; color:var(--muted); }
.wp-page .entry-content h2,.wp-page .entry-content h3{ color:var(--ink); letter-spacing:-0.02em; margin:36px 0 12px; font-weight:600; }
.wp-page .entry-content p{ margin-bottom:18px; }
.wp-page .entry-content a{ color:var(--ink); text-decoration:underline; }
.wp-page .entry-content ul,.wp-page .entry-content ol{ margin:0 0 18px 22px; }
.wp-page .entry-content img{ max-width:100%; height:auto; border-radius:var(--r-md); }
.wp-page .post-list article{ border-top:1px solid var(--line); padding:28px 0; }
.wp-page .post-list article h2{ font-size:1.4rem; font-weight:600; letter-spacing:-0.015em; }
.wp-page .post-list article p{ color:var(--muted); margin-top:8px; }
.screen-reader-text{ position:absolute; clip:rect(1px,1px,1px,1px); width:1px; height:1px; overflow:hidden; }
/* Full-bleed tool pages served by the tools plugin can opt out of the theme chrome */
body.astra-tool-page .navbar{ display:none; }

/* ================= Hero: status pill + subtitle in black (editable in Theme Manager) ================= */
:root{
  --chip-color:#000000; --chip-bg:rgba(255,255,255,0.92);
  --sub-color:#000000;  --sub-bg:rgba(255,255,255,0.92);
}
.status-chip{ background:var(--chip-bg); border:1px solid rgba(255,255,255,0.7); -webkit-backdrop-filter:none; backdrop-filter:none; box-shadow:0 6px 24px -10px rgba(0,0,0,0.35); }
.status-chip span{ color:var(--chip-color); text-shadow:none; font-weight:500; }
.status-chip .pulse{ background:var(--live); }
.status-chip .sep{ color:var(--chip-color); opacity:.35; }
.subtitle{ align-self:flex-start; background:var(--sub-bg); padding:8px 16px 8px 12px; border-radius:var(--r-full); box-shadow:0 6px 24px -10px rgba(0,0,0,0.35); }
.subtitle .dt{ background:var(--sub-color); }
.subtitle span{ color:var(--sub-color); text-shadow:none; font-weight:500; }
a.logo{ color:var(--ink); }
.btn{ text-decoration:none; }

/* ================= Blog ================= */
.blog-page{ padding-top:140px; }
.blog-head{ max-width:820px; }
.blog-title{ font-size:clamp(2.2rem,5vw,4rem); margin-top:20px; }
.blog-title b{ font-weight:600; }
.blog-head .section-copy{ max-width:620px; }
.blog-tools{ display:flex; flex-wrap:wrap; gap:16px; align-items:center; justify-content:space-between; margin:36px 0 44px; max-width:none; }
.blog-filters{ display:flex; flex-wrap:wrap; gap:8px; }
.blog-filters .tag-pill{ background:var(--paper-dim-2); border-color:var(--line); color:var(--ink); transition:background .2s var(--ease), color .2s var(--ease); }
.blog-filters .tag-pill:hover{ border-color:var(--ink); }
.blog-filters .tag-pill.active{ background:var(--ink); color:#fff; border-color:var(--ink); }
.blog-search{ position:relative; width:min(100%,280px); }
.blog-search input{ width:100%; padding:11px 42px 11px 18px; border-radius:var(--r-full); border:1px solid var(--line-strong); font:inherit; font-size:13px; background:#fff; color:var(--ink); }
.blog-search input:focus{ outline:none; border-color:var(--ink); }
.blog-search button{ position:absolute; right:6px; top:50%; transform:translateY(-50%); width:32px; height:32px; border-radius:50%; border:none; background:var(--ink); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.blog-search button svg{ width:14px; height:14px; }

.post-grid{ display:grid; grid-template-columns:1fr; gap:28px; }
@media(min-width:700px){ .post-grid{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1040px){ .post-grid{ grid-template-columns:repeat(3,1fr); } }
.post-grid.has-featured .post-card.is-featured{ grid-column:1 / -1; }
@media(min-width:860px){
  .post-card.is-featured{ flex-direction:row; }
  .post-card.is-featured .post-card-thumb{ flex:1.15; aspect-ratio:auto; min-height:360px; }
  .post-card.is-featured .post-card-body{ flex:1; padding:40px; justify-content:center; }
  .post-card.is-featured .post-card-title{ font-size:2rem; line-height:1.15; }
}
.post-card{ display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-card); transition:transform .4s var(--ease), box-shadow .4s var(--ease); }
.post-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-card-hover); }
.post-card-thumb{ display:block; aspect-ratio:16/10; background:var(--ink); overflow:hidden; position:relative; }
.post-card-thumb img{ width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease); }
.post-card:hover .post-card-thumb img{ transform:scale(1.04); }
.thumb-ph{ position:absolute; inset:0; display:flex; align-items:flex-end; padding:22px; background:
  linear-gradient(135deg,rgba(255,255,255,0.06) 0%,rgba(255,255,255,0) 60%),
  repeating-linear-gradient(0deg,rgba(255,255,255,0.05) 0 1px,transparent 1px 28px),
  repeating-linear-gradient(90deg,rgba(255,255,255,0.05) 0 1px,transparent 1px 28px), var(--ink); }
.thumb-ph-cat{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.7); position:relative; z-index:1; }
.thumb-ph-mark{ position:absolute; right:22px; top:22px; width:34px; height:34px; border-radius:50%; border:1px solid rgba(255,255,255,.35); }
.thumb-ph-mark::after{ content:''; position:absolute; inset:9px; border-radius:50%; background:#fff; }
.post-card-body{ padding:26px 26px 28px; display:flex; flex-direction:column; gap:12px; flex:1; }
.post-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted-2); }
.post-meta .dot{ opacity:.6; }
.post-card-title{ font-size:1.25rem; font-weight:600; letter-spacing:-0.02em; line-height:1.25; }
.post-card-title a:hover{ text-decoration:underline; text-underline-offset:4px; }
.post-card-excerpt{ font-size:14px; color:var(--muted); line-height:1.65; }
.post-card-more{ margin-top:auto; display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:600; }
.post-card-more svg{ width:13px; height:13px; transition:transform .3s var(--ease); }
.post-card:hover .post-card-more svg{ transform:translateX(4px); }

.navigation.pagination{ margin-top:52px; }
.navigation.pagination .nav-links{ display:flex; gap:8px; flex-wrap:wrap; justify-content:center; }
.navigation.pagination .page-numbers{ padding:10px 18px; border-radius:var(--r-full); border:1px solid var(--line-strong); font-size:13px; font-weight:500; }
.navigation.pagination .page-numbers.current,.navigation.pagination a.page-numbers:hover{ background:var(--ink); color:#fff; border-color:var(--ink); }
.blog-empty{ padding:60px 0; color:var(--muted); }
.blog-empty a{ color:var(--ink); text-decoration:underline; }
.blog-home .tools-head-row .btn{ margin-bottom:6px; }

/* Single post */
.wrap.narrow{ max-width:820px; }
.back-link{ display:inline-block; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted-2); margin-bottom:28px; }
.back-link:hover{ color:var(--ink); }
.single-post .post-head .post-meta{ gap:8px; margin-bottom:6px; }
.single-post .post-head .tag-pill{ background:var(--paper-dim-2); color:var(--ink); border-color:var(--line); }
.single-post .entry-title{ margin:14px 0 24px; font-weight:600; font-size:clamp(2rem,4.4vw,3.2rem); }
.post-byline{ display:flex; align-items:center; gap:14px; padding-bottom:28px; border-bottom:1px solid var(--line); margin-bottom:36px; }
.by-avatar{ width:42px; height:42px; border-radius:50%; background:var(--ink); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:600; font-size:15px; flex:none; }
.by-text{ display:flex; flex-direction:column; gap:2px; font-size:14px; }
.by-text .mono{ font-size:11px; letter-spacing:.06em; color:var(--muted-2); text-transform:uppercase; }
.post-hero{ margin:0 0 36px; }
.post-hero img{ width:100%; height:auto; border-radius:var(--r-lg); }
.single-post .entry-content{ max-width:none; font-size:17px; color:rgba(10,10,11,.82); }
.single-post .entry-content h2{ font-size:1.6rem; margin:44px 0 14px; scroll-margin-top:100px; }
.single-post .entry-content ul,.single-post .entry-content ol{ margin:0 0 20px 24px; }
.single-post .entry-content li{ margin-bottom:8px; }
.single-post .entry-content blockquote{ border-left:3px solid var(--ink); padding:4px 0 4px 20px; margin:28px 0; font-size:1.15rem; font-weight:300; color:var(--ink); }
.single-post .entry-content pre,.single-post .entry-content code{ font-family:'JetBrains Mono',monospace; font-size:.88em; background:var(--paper-dim-2); border-radius:6px; }
.single-post .entry-content code{ padding:2px 6px; }
.single-post .entry-content pre{ padding:16px; overflow-x:auto; }
.single-post .entry-content table{ width:100%; border-collapse:collapse; margin:0 0 24px; font-size:14px; }
.single-post .entry-content th,.single-post .entry-content td{ border:1px solid var(--line); padding:10px 12px; text-align:left; }
.post-toc{ background:var(--paper-dim); border:1px solid var(--line); border-radius:var(--r-md); padding:20px 24px; margin:0 0 36px; }
.post-toc-title{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted-2); margin-bottom:10px; }
.post-toc ol{ margin:0 0 0 20px; display:flex; flex-direction:column; gap:6px; font-size:14px; }
.post-toc a{ color:var(--ink); }
.post-toc a:hover{ text-decoration:underline; }
.post-tags{ display:flex; flex-wrap:wrap; gap:8px; margin-top:36px; }
.post-tags .tag-pill{ background:var(--paper-dim-2); color:var(--muted); border-color:var(--line); }
.author-box{ display:flex; gap:20px; align-items:flex-start; background:var(--ink); color:#fff; border-radius:var(--r-lg); padding:30px; margin:48px 0 28px; }
.author-box .owner-avatar{ flex:none; }
.author-box p{ font-size:14px; line-height:1.65; color:rgba(255,255,255,.72); margin:6px 0 16px; }
.author-box .btn-primary{ background:#fff; color:var(--ink); }
@media(max-width:560px){ .author-box{ flex-direction:column; } }
.post-nav{ display:grid; grid-template-columns:1fr; gap:14px; margin-bottom:28px; }
@media(min-width:700px){ .post-nav{ grid-template-columns:1fr 1fr; } }
.post-nav a{ display:flex; flex-direction:column; gap:6px; border:1px solid var(--line); border-radius:var(--r-md); padding:18px 20px; transition:border-color .2s var(--ease); }
.post-nav a:hover{ border-color:var(--ink); }
.post-nav a.next{ text-align:right; grid-column:2; }
.post-nav .mono{ font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted-2); }
.post-nav strong{ font-size:14px; font-weight:600; line-height:1.4; }
.related{ margin-top:72px; }
.related-title{ font-size:clamp(1.6rem,3vw,2.2rem); margin-bottom:28px; }
.related-title b{ font-weight:600; }

/* Comments */
.comments-area{ margin-top:52px; padding-top:32px; border-top:1px solid var(--line); }
.comments-title,.comment-reply-title{ font-size:1.3rem; font-weight:600; letter-spacing:-0.015em; margin-bottom:18px; }
.comment-list{ list-style:none; margin:0 0 32px; padding:0; display:flex; flex-direction:column; gap:18px; }
.comment-list .children{ list-style:none; margin:16px 0 0 24px; padding:0; display:flex; flex-direction:column; gap:16px; }
.comment-body{ border:1px solid var(--line); border-radius:var(--r-md); padding:16px 18px; font-size:14px; color:var(--muted); }
.comment-author .fn{ color:var(--ink); font-weight:600; font-style:normal; }
.comment-author img{ border-radius:50%; float:left; margin-right:12px; }
.comment-metadata{ font-size:11px; font-family:'JetBrains Mono',monospace; margin:4px 0 10px; }
.comment-form label{ display:block; font-size:12px; font-weight:600; margin-bottom:6px; }
.comment-form input[type=text],.comment-form input[type=email],.comment-form input[type=url],.comment-form textarea{ width:100%; padding:12px 14px; border:1px solid var(--line-strong); border-radius:var(--r-sm); font:inherit; margin-bottom:14px; }
.comment-form input:focus,.comment-form textarea:focus{ outline:none; border-color:var(--ink); }
.comment-form .submit{ cursor:pointer; }

/* Homepage blog block: search row + list-style pagination */
.blog-home-tools{ margin:40px 0 28px; justify-content:flex-start; }
.blog-search-clear{ font-size:13px; color:var(--muted); text-decoration:underline; }
.blog-search-clear:hover{ color:var(--ink); }
.navigation.pagination ul.page-numbers{ display:flex; gap:8px; flex-wrap:wrap; justify-content:center; list-style:none; margin:0; padding:0; border:0; }
.navigation.pagination ul.page-numbers li{ margin:0; }
.navigation.pagination ul.page-numbers li .page-numbers{ display:inline-block; }
.navigation.pagination .page-numbers.dots{ border:0; padding:10px 6px; }

/* ================= v1.3: hero chip + subtitle without background (plain text like the headline) ================= */
.status-chip,
.subtitle{
  background:none; border:none; box-shadow:none; padding:0;
  -webkit-backdrop-filter:none; backdrop-filter:none;
}
.status-chip span{ color:#fff; text-shadow:0 1px 6px rgba(0,0,0,0.4); font-weight:500; }
.status-chip .sep{ color:#fff; opacity:.4; }
.subtitle .dt{ background:#fff; }
.subtitle span{ color:rgba(255,255,255,0.85); text-shadow:0 1px 6px rgba(0,0,0,0.4); font-weight:500; }

/* ================= v1.3: blog author = site logo + brand text ================= */
.post-byline .by-logo{ background:none; border:none; box-shadow:none; padding:0; -webkit-backdrop-filter:none; backdrop-filter:none; flex:none; }
.post-byline .by-logo .logo-mark{ width:34px; height:34px; }
.post-byline .by-logo .brand-text{ display:block; font-size:15px; }
.post-byline .by-text{ border-left:1px solid var(--line); padding-left:14px; justify-content:center; }
.author-box .owner-avatar.author-logo{ background:#fff; }
.author-box .owner-avatar.author-logo .logo-mark{ width:34px; height:34px; }

/* ================= v1.3: justified body copy ================= */
.hero-sub-copy,
.intro-lede,
.section-copy,
.owner-bio p,
.timeline-row .td,
.tool-desc,
.process-step p,
.owner-quote,
.pillar p,
.post-card-excerpt,
.author-box p,
.single-post .entry-content p,
.single-post .entry-content li,
.wp-page .entry-content p,
.wp-page .post-list article p,
.blog-empty p{
  text-align:justify; text-justify:inter-word;
  -webkit-hyphens:auto; hyphens:auto;
}


/* ================= v1.5: hero status line + subtitle = plain black text only ================= */
/* No pill, border, background, shadow, pulse dot/ring or bullet: just text. Colour comes from
   Theme Manager > Hero > "Status text color" / "Subtitle text color" (default black). */
.status-chip,
.subtitle{
  background:none !important; border:0 !important; box-shadow:none !important; outline:0 !important;
  padding:0 !important; border-radius:0 !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
}
.status-chip .pulse,
.status-chip .pulse::after,
.subtitle .dt{ display:none !important; }
.status-chip span,
.subtitle span{
  background:none !important; border:0 !important; box-shadow:none !important; padding:0 !important;
  text-shadow:none !important; font-weight:500;
}
.status-chip span{ color:var(--chip-color,#000) !important; }
.status-chip .sep{ opacity:.5; }
.subtitle span{ color:var(--sub-color,#000) !important; }

/* ================= v1.5: justified text across the whole site ================= */
/* Paragraph-style copy everywhere (home, blog index, posts, pages, comments, search, 404).
   Headings, buttons, nav, pills and single-line labels keep their own alignment. */
body p,
body li,
body blockquote,
body dd,
body figcaption,
.hero-sub-copy,
.intro-lede,
.section-copy,
.owner-bio p,
.owner-quote,
.timeline-row .td,
.tool-desc,
.tools-note,
.process-step p,
.pillar p,
.post-card-excerpt,
.author-box p,
.comment-content p,
.entry-content p,
.entry-content li{
  text-align:justify; text-justify:inter-word;
  -webkit-hyphens:auto; hyphens:auto; overflow-wrap:break-word;
}
/* keep UI elements left-aligned even if they sit inside a <li>/<p> */
.tag-pill, .btn, .page-numbers, .drawer-link, .post-toc a, .blog-filters a{ text-align:left; hyphens:manual; }