:root{
  --orange:#FF6200;
  --orange-text:#FF6200;
  --orange-soft:#FFE0CC;
  --ink:#161D26;
  --navy:#161D26;
  --paper:#0a0b0d;
  --paper-2:#15181e;
  --rule:#262b33;
  --muted:#98a0aa;
  --white:#FFFFFF;
  --pad:clamp(20px,5vw,80px);
  --radius:18px;
  --shadow:0 18px 60px rgba(22,29,38,.09);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:#0a0b0d}
body{
  margin:0;
  overflow-x:hidden;
  background:#0a0b0d;
  color:#ffffff;
  font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
body.is-dragging{cursor:grabbing;user-select:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
img{max-width:100%}
::selection{background:var(--orange);color:var(--ink)}



.skip-link{
  position:fixed;left:12px;top:12px;z-index:1000;
  transform:translateY(-160%);padding:10px 14px;border-radius:999px;
  background:var(--ink);color:var(--white);
}
.skip-link:focus-visible{transform:none}

:focus-visible{outline:3px solid var(--orange);outline-offset:4px}

.mono,.eyebrow,.pill,.project-meta,.metric-label,.project-placeholder,.case-label{
  font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;
  font-variant-numeric:tabular-nums;
}

/* page transitions: soft fade+rise in, quick fade out on internal navigation */
body{animation:page-in .55s ease backwards}
@keyframes page-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
body.is-leaving{animation:page-out .28s ease both}
@keyframes page-out{to{opacity:0;transform:translateY(-10px)}}

.site-header{
  position:fixed;left:0;right:0;top:0;z-index:80;
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  min-height:70px;padding:14px var(--pad);pointer-events:none;
  mix-blend-mode:normal;
}
.site-header>*{pointer-events:auto}
.header-nav{display:flex;gap:8px;justify-self:start}
.header-nav.right{justify-self:end}
.brand-link{
  padding:8px 12px;border:1px solid rgba(255,255,255,.22);border-radius:999px;
  background:rgba(20,24,30,.72);font-size:18px;font-weight:700;letter-spacing:-.04em;
  backdrop-filter:blur(12px);box-shadow:0 5px 22px rgba(0,0,0,.4);
}
.pill{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:36px;padding:8px 16px;border:1px solid rgba(255,255,255,.32);
  border-radius:999px;background:rgba(20,24,30,.72);
  font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  backdrop-filter:blur(12px);transition:background .2s,color .2s,border-color .2s,transform .2s;
}
.pill:hover,.pill[aria-current="page"]{background:var(--orange);border-color:var(--orange);color:var(--ink);transform:translateY(-1px)}
.pill.icon{width:38px;padding:0;font-size:18px}

.hero{
  --mx:0px;--my:0px;
  position:relative;min-height:100svh;overflow:hidden;
  border-bottom:1px solid var(--rule);isolation:isolate;
  background:transparent;color:#fff;
}
.hero::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:60px 60px;mask-image:linear-gradient(to bottom,transparent 4%,black 38%,transparent 88%);
}
.hero-kicker{position:absolute;top:92px;left:var(--pad);margin:0;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.hero-marquee{position:absolute;left:0;right:0;top:31%;overflow:hidden;white-space:nowrap;transform:translateY(-50%);padding:.12em 0}
.hero-marquee-track{display:flex;width:max-content;animation:marquee 18s linear infinite;will-change:transform}
.hero-marquee span{
  display:block;padding-right:.24em;
  font-size:clamp(92px,14vw,220px);font-weight:700;line-height:1.3;
  letter-spacing:-.03em;color:rgba(255,255,255,.22);
}
.hero-marquee span em{color:rgba(255,98,0,.5);font-style:normal}
@keyframes marquee{to{transform:translateX(-50%)}}

.hero-sculpt{position:absolute;inset:0 0 24% 0;z-index:1;display:grid;place-items:center;pointer-events:none}
.sculpt{grid-area:1/1;max-height:84%;width:auto;transition:opacity .45s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.sculpt.bust{mix-blend-mode:screen}
canvas.bust3d{max-height:none;cursor:grab}
.hero{touch-action:pan-y}
.sculpt.me{max-height:58%;opacity:0;transform:scale(.9);z-index:2;pointer-events:none}
body:has(.header-nav a[href="#about"]:hover) .sculpt.me{opacity:1;transform:none}
body:has(.header-nav a[href="#about"]:hover) .sculpt.bust{opacity:0;transform:scale(1.04)}

.hero-evidence{position:absolute;inset:0;z-index:2;pointer-events:none}
.evidence-float{
  position:absolute;min-width:170px;padding:17px 19px;border:0;color:var(--ink);
  border-radius:14px;
  background:linear-gradient(160deg,#f5f6f8 0%,#e3e5e9 12%,#c9cdd4 26%,#a9afb8 38%,#e8eaee 50%,#9ba1ab 62%,#dcdfe3 76%,#c2c7ce 88%,#d5d8dd 100%);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.95),
    inset 0 -2px 3px rgba(10,14,20,.45),
    0 14px 30px rgba(22,29,38,.28),
    0 30px 60px rgba(22,29,38,.16);
  transform:translate(calc(var(--mx) * var(--depth, .3)),calc(var(--my) * var(--depth, .3)));
  animation:float 7s ease-in-out infinite alternate;will-change:transform;
}
.evidence-float::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.32) 36%,rgba(255,255,255,.04) 39%,transparent 44%,rgba(20,24,30,.1) 54%,transparent 59%,rgba(255,255,255,.18) 68%,transparent 72%);
}
.evidence-float strong{display:block;font-size:clamp(26px,2.9vw,41px);line-height:1;letter-spacing:-.05em}
.evidence-float span{display:block;margin-top:8px;font-size:12px;line-height:1.35;letter-spacing:.08em;text-transform:uppercase;color:rgba(22,29,38,.72)}
.evidence-float.orange{
  background:#FF6200;
  color:var(--ink);border:0;
  box-shadow:
    inset 0 1px 1px rgba(255,235,215,.95),
    inset 0 -2px 3px rgba(80,25,0,.55),
    0 14px 30px rgba(255,98,0,.34),
    0 30px 60px rgba(22,29,38,.16);
}
.evidence-float.orange::after{background:linear-gradient(105deg,transparent 30%,rgba(255,244,232,.35) 36%,rgba(255,255,255,.05) 39%,transparent 44%,rgba(70,20,0,.12) 54%,transparent 59%,rgba(255,235,215,.18) 68%,transparent 72%)}
.evidence-float.orange span{color:rgba(60,20,0,.72)}
.evidence-float.navy{
  background:linear-gradient(160deg,#6e7887 0%,#39424f 14%,#181f28 30%,#48525f 44%,#0c1118 58%,#3a4450 72%,#161d26 86%,#4a5462 100%);
  color:#fff;border:0;
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.4),
    inset 0 -2px 3px rgba(0,0,0,.7),
    0 14px 30px rgba(22,29,38,.45),
    0 30px 60px rgba(22,29,38,.22);
}
.evidence-float.navy::after{background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.25) 36%,rgba(255,255,255,.04) 39%,transparent 44%,rgba(0,0,0,.18) 54%,transparent 59%,rgba(255,255,255,.12) 68%,transparent 72%)}
.evidence-float.navy span{color:rgba(255,255,255,.66)}
.float-a{left:6%;top:22%;--depth:.35;animation-delay:-2s;transform:rotate(-4deg)}
.float-b{right:6%;top:19%;--depth:.6;animation-delay:-4s;transform:rotate(3deg)}
.float-c{right:14%;top:44%;--depth:.25;animation-delay:-1s;transform:rotate(-2deg)}
.float-d{left:13%;top:47%;--depth:.5;animation-delay:-5s;transform:rotate(2deg)}
@keyframes float{from{margin-top:-6px}to{margin-top:8px}}

.hero-copy{position:absolute;left:var(--pad);right:var(--pad);bottom:46px;z-index:3;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:30px;align-items:end}
.hero h1{max-width:1000px;margin:0;font-size:clamp(42px,6.4vw,96px);font-weight:500;line-height:.92;letter-spacing:-.067em;text-wrap:balance;color:#fff}
.hero h1 em{color:var(--orange);font-style:normal}
.scroll-cue{display:flex;align-items:center;gap:10px;padding:12px 0;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#fff}
.scroll-cue::after{content:"↓";display:grid;place-items:center;width:34px;height:34px;border:1px solid rgba(255,255,255,.7);border-radius:50%;transition:transform .2s,background .2s,color .2s}
.scroll-cue:hover::after{transform:translateY(4px);background:var(--orange);border-color:var(--orange);color:var(--ink)}

.positioning{padding:clamp(90px,14vw,190px) var(--pad);border-bottom:1px solid var(--rule)}
.positioning p{max-width:1100px;margin:0 auto;text-align:center;font-size:clamp(30px,4.4vw,64px);line-height:1.08;letter-spacing:-.05em;text-wrap:balance}
.positioning em{font-style:normal;color:var(--orange-text)}

.section-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;padding:0 var(--pad) 26px}
.section-heading h2{margin:0;font-size:13px;font-weight:400;letter-spacing:.14em;text-transform:uppercase}
.section-heading p{max-width:52ch;margin:0;color:var(--muted);font-size:14px;text-wrap:pretty}

.featured-projects{padding:90px 0 110px;border-bottom:1px solid var(--rule)}
.project-controls{display:flex;gap:8px}
.project-track{
  display:flex;gap:18px;overflow-x:auto;padding:0 var(--pad) 24px;
  scroll-padding-inline:var(--pad);scroll-snap-type:x mandatory;
  scrollbar-width:none;cursor:grab;overscroll-behavior-inline:contain;
}
.project-track::-webkit-scrollbar{display:none}
/* pinned mode (desktop): section fills the viewport, track is translated by scroll instead of scrolled */
.featured-projects.is-pinned{display:flex;flex-direction:column;justify-content:center;height:100svh;padding:0;box-sizing:border-box;overflow:hidden}
.featured-projects.is-pinned .project-track{overflow:visible;scroll-snap-type:none;padding-bottom:0;will-change:transform}
.featured-projects.is-pinned .project-track::after{content:"";flex:0 0 calc(var(--pad) - 18px)}
.featured-projects.is-pinned .project-placeholder{min-height:clamp(240px,calc(100svh - 360px),560px)}
/* touch / narrow: swipe the track sideways, side gutters keep vertical scrolling available */
@media (max-width:860px),(pointer:coarse){
  .project-track{touch-action:pan-x;padding-left:32px;padding-right:32px;scroll-padding-inline:32px;margin:0 var(--pad);width:auto}
}
.project-card{
  --cover:var(--paper-2);
  flex:0 0 clamp(280px,32vw,470px);scroll-snap-align:start;
  display:flex;flex-direction:column;min-width:0;
}
.project-placeholder{
  position:relative;display:grid;place-items:center;min-height:clamp(300px,43vw,560px);
  overflow:hidden;border:1px solid var(--rule);border-radius:var(--radius);
  background:var(--cover);color:rgba(255,255,255,.45);
  font-size:11px;letter-spacing:.12em;text-align:center;
  transition:transform .5s cubic-bezier(.2,.8,.2,1),border-radius .5s;
}
.project-shot{position:absolute;inset:0;z-index:1}
.project-shot img{width:100%;height:100%;object-fit:cover;display:block}
.project-placeholder:has(.project-shot){color:transparent;font-size:0}
.project-placeholder:has(.project-shot)::before,.project-placeholder:has(.project-shot)::after{display:none}
.project-placeholder::before,.project-placeholder::after{content:"";position:absolute;pointer-events:none}
.project-placeholder::before{inset:18px;border:1px dashed currentColor;border-radius:10px;opacity:.42}
.project-placeholder::after{width:76px;height:1px;background:currentColor;box-shadow:0 -12px 0 currentColor,0 12px 0 currentColor;opacity:.35}
.project-placeholder.navy{--cover:var(--navy);color:rgba(255,255,255,.6)}
.project-placeholder.orange{--cover:var(--orange);color:rgba(22,29,38,.56)}
.project-placeholder.ink{--cover:var(--ink);color:rgba(255,255,255,.58)}
.project-placeholder.soft{--cover:#1c2027}
.view-case{
  position:absolute;z-index:2;display:grid;place-items:center;width:110px;height:110px;
  border-radius:50%;background:var(--orange);color:var(--ink);
  font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase;
  opacity:0;transform:scale(.7);transition:opacity .25s,transform .35s cubic-bezier(.2,.8,.2,1);
}
.project-card:hover .project-placeholder,.project-card:focus-visible .project-placeholder{transform:translateY(-6px);border-radius:40px}
.project-card:hover .view-case,.project-card:focus-visible .view-case{opacity:1;transform:scale(1)}
.project-info{display:grid;grid-template-columns:1fr auto;gap:16px;padding:17px 2px 0}
.project-title{margin:0;min-height:2em;font-size:clamp(23px,2.6vw,38px);line-height:1;letter-spacing:-.045em;text-wrap:balance}
.project-verdict{grid-column:1/-1;margin:2px 0 0;color:var(--muted);font-size:14px;text-wrap:balance}
.project-meta{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:right}
.project-tags{display:flex;flex-wrap:wrap;gap:6px;grid-column:1/-1;margin-top:4px}
.project-tags span{padding:4px 9px;border:1px solid var(--rule);border-radius:999px;font-size:10px;text-transform:uppercase;letter-spacing:.06em}

.profile{padding:110px var(--pad)}
.profile-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(50px,9vw,140px);padding-bottom:100px;border-bottom:1px solid var(--rule)}
.profile h2{max-width:12ch;margin:0;font-size:clamp(45px,6.6vw,94px);font-weight:500;line-height:.93;letter-spacing:-.06em;text-wrap:balance}
.profile-copy{max-width:650px}
.profile-copy p{margin:0 0 22px;font-size:clamp(18px,2vw,27px);line-height:1.35;letter-spacing:-.02em;text-wrap:pretty}
.expertise{display:flex;flex-wrap:wrap;gap:8px;margin-top:34px}
.expertise span{padding:8px 12px;border:1px solid rgba(255,255,255,.4);border-radius:999px;font-size:12px}

.experience{padding-top:75px}
.experience-row{display:grid;grid-template-columns:max-content 1fr 130px;gap:24px;padding:19px 0;border-bottom:1px solid var(--rule);align-items:baseline}
.experience-row strong{font-size:18px;white-space:nowrap}
.experience-row span{color:var(--muted)}
.experience-row time{font-family:"SFMono-Regular",Consolas,monospace;font-size:11px;text-align:right;color:var(--muted)}

.site-footer{padding:90px var(--pad) 38px;background:rgba(10,13,18,.72);color:var(--white);border-top:1px solid var(--rule)}
.footer-callout{max-width:1200px;margin:0 0 90px;font-size:clamp(46px,7.6vw,112px);font-weight:500;line-height:.92;letter-spacing:-.065em;text-wrap:balance}
.footer-callout em{color:var(--orange);font-style:normal}
.footer-bottom{display:grid;grid-template-columns:1fr auto;gap:30px;padding-top:24px;border-top:1px solid rgba(255,255,255,.25)}
.footer-links{display:flex;flex-wrap:wrap;gap:14px 26px}
.footer-links a{border-bottom:1px solid rgba(255,255,255,.35)}
.copyright{font-family:"SFMono-Regular",Consolas,monospace;font-size:11px;color:rgba(255,255,255,.58)}

.js .reveal{opacity:0;transform:translateY(34px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.js .reveal.is-visible{opacity:1;transform:none}

/* Case study shell */
.case-page{padding-top:96px}
.case-shell{padding:0 var(--pad)}
.back-link{display:inline-flex;gap:8px;align-items:center;margin-bottom:70px;font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.back-link::before{content:"←";font-size:16px}
.case-hero{padding:24px 0 42px;border-bottom:1px solid var(--rule)}
.case-hero h1{max-width:1250px;margin:10px 0 18px;font-size:clamp(70px,11vw,168px);font-weight:500;line-height:.82;letter-spacing:-.08em;text-wrap:balance}
.case-verdict{max-width:800px;margin:0;font-size:clamp(24px,3vw,46px);line-height:1.08;letter-spacing:-.035em;color:var(--orange);text-wrap:balance}
.case-cover-placeholder{display:grid;place-items:center;min-height:clamp(460px,66vw,900px);margin-top:40px;border:1px solid var(--rule);border-radius:var(--radius);background:var(--paper-2);color:var(--muted);font-size:11px;letter-spacing:.12em;text-transform:uppercase;position:relative;overflow:hidden}
.case-cover-placeholder::after{content:"";position:absolute;inset:28px;border:1px dashed rgba(255,255,255,.2);border-radius:10px}
.case-overview{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);gap:clamp(50px,9vw,140px);padding:100px 0}
.case-lead{margin:0;font-size:clamp(27px,3.2vw,48px);line-height:1.18;letter-spacing:-.038em;text-wrap:balance}
.case-meta{margin:0;border-top:1px solid rgba(255,255,255,.65)}
.case-meta div{display:grid;grid-template-columns:110px 1fr;gap:20px;padding:13px 0;border-bottom:1px solid var(--rule)}
.case-meta dt{font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.case-meta dd{margin:0;font-size:14px}
.metric-strip{display:grid;grid-template-columns:repeat(3,1fr);border-top:2px solid rgba(255,255,255,.65);border-bottom:1px solid var(--rule)}
.metric-item{padding:24px 22px 26px 0;border-right:1px solid var(--rule)}
.metric-item:not(:first-child){padding-left:22px}
.metric-item:last-child{border-right:0}
.metric-value{display:block;font-size:clamp(30px,4vw,60px);line-height:1;letter-spacing:-.055em;color:var(--orange)}
.metric-label{display:block;margin-top:8px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-wrap:balance}
.case-section{display:grid;grid-template-columns:220px minmax(0,750px);gap:clamp(30px,7vw,100px);justify-content:center;padding:110px 0;border-bottom:1px solid var(--rule)}
.case-section h2{margin:0;font-family:"SFMono-Regular",Consolas,monospace;font-size:15px;font-weight:400;letter-spacing:.12em;text-transform:uppercase;color:var(--orange)}
.case-body p{margin:0 0 20px;font-size:clamp(18px,1.65vw,24px);line-height:1.55;letter-spacing:-.015em;text-wrap:pretty}
.case-body strong{font-weight:700;color:#fff}
.evidence-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:34px 0 0}
.evidence-card{margin:0;border:1px solid rgba(255,255,255,.14);border-radius:12px;overflow:hidden;background:var(--white)}
.evidence-card img{display:block;width:100%;height:auto;background:#fff}
.evidence-card image-slot{display:block;width:100%;height:320px;background:#fff}
.evidence-card.wide image-slot{height:420px}
.evidence-card figcaption{padding:12px 14px;border-top:1px solid #e2e2e2;color:#6b7078;font-family:"SFMono-Regular",Consolas,monospace;font-size:10px}
.evidence-card.wide{grid-column:1/-1}
.case-visual-placeholder{display:grid;place-items:center;min-height:50vw;max-height:760px;margin:0 0 100px;border:1px solid var(--rule);border-radius:var(--radius);background:var(--paper-2);font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.11em;color:var(--muted)}
.case-next{display:grid;grid-template-columns:1fr 1fr;margin:100px 0 0;border-top:1px solid rgba(255,255,255,.65);border-bottom:1px solid rgba(255,255,255,.65)}
.case-next a{padding:36px 0;font-size:clamp(26px,4vw,56px);line-height:1;letter-spacing:-.04em;transition:color .2s,background .2s}
.case-next a:last-child{text-align:right;border-left:1px solid var(--rule)}
.case-next a:hover{color:var(--orange)}
.case-next small{display:block;margin-bottom:10px;font-family:"SFMono-Regular",Consolas,monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}

/* Hyper impact */
.product-marker.feature h2{font-size:clamp(38px,5vw,76px)}
.impact-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.impact-program{display:flex;flex-direction:column;gap:8px;margin:0 0 26px;padding:22px 24px;border:1px solid var(--rule);border-radius:14px;background:var(--paper-2)}
.ip-k{font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.impact-program>div{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap}
.impact-program strong{font-size:clamp(30px,4vw,60px);line-height:1;letter-spacing:-.05em;color:#fff}
.impact-program>div span{font-size:16px;color:#fff;max-width:520px}
.impact-program small{font-size:13px;line-height:1.5;color:var(--muted)}
@media (max-width:860px){.impact-grid.three{grid-template-columns:1fr}}

/* Hyper QC */
.qc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin:6px 0 16px;background:var(--rule);border:1px solid var(--rule);border-radius:14px;overflow:hidden}
.qc-cell{display:flex;flex-direction:column;gap:8px;padding:20px;background:var(--paper-2)}
.qc-n{font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.14em;color:var(--orange)}
.qc-cell strong{font-size:clamp(17px,1.5vw,21px);letter-spacing:-.025em;color:#fff}
.qc-cell span:last-child{font-size:16px;line-height:1.5;color:var(--muted)}
.qc-boundary{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 26px}
.qc-boundary>div{display:flex;flex-direction:column;gap:6px;padding:20px;border-radius:14px;border:1px solid var(--rule);background:var(--paper-2)}
.qc-boundary>div:first-child{border-color:var(--orange);background:rgba(255,98,0,.08)}
.qc-boundary>div:last-child{border-style:dashed}
.qc-k{font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.qc-boundary>div:first-child .qc-k{color:var(--orange)}
.qc-boundary strong{font-size:clamp(17px,1.5vw,21px);letter-spacing:-.03em;color:#fff}
.qc-boundary span:last-child{font-size:16px;line-height:1.5;color:var(--muted)}
@media (max-width:860px){.qc-grid,.qc-boundary{grid-template-columns:1fr}}

/* Hyper-personalization story */
.hyper-lead{font-size:clamp(28px,3.2vw,48px)!important;line-height:1.1!important;letter-spacing:-.04em!important;color:#fff;margin-bottom:26px!important}
.hyper-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin:6px 0 40px;background:var(--rule);border:1px solid var(--rule);border-radius:14px;overflow:hidden}
.hyper-facts>div{padding:20px 20px 22px;background:var(--paper-2)}
.hyper-facts strong{display:block;font-size:clamp(22px,2.2vw,32px);line-height:1;letter-spacing:-.045em;color:var(--orange)}
.hyper-facts span{display:block;margin-top:10px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-wrap:balance}
.beat{position:relative;padding:26px 0 8px;border-top:1px solid var(--rule)}
.beat-num{display:block;margin-bottom:10px;font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.14em;color:var(--orange)}
.beat h3{margin:0 0 14px;font-size:clamp(20px,2vw,28px);font-weight:500;line-height:1.15;letter-spacing:-.03em;color:#fff}
.beat p{font-size:clamp(16px,1.35vw,19px)!important;line-height:1.6!important;color:var(--muted)}
.beat .evidence-card{margin:8px 0 22px}
.hyper-proof{margin:18px 0 36px}
.hyper-proof image-slot{height:clamp(300px,36vw,520px)}
.hyper .evidence-card figcaption{text-transform:none;letter-spacing:0;font-size:13px;line-height:1.5}
.hyper-close{margin-top:30px!important;padding-top:22px;border-top:1px solid var(--rule);font-size:clamp(17px,1.4vw,20px)!important;color:#fff}
@media (max-width:860px){.hyper-facts{grid-template-columns:1fr}}

/* Why MCP comparison */
.why-mcp{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin:6px 0 26px;background:var(--rule);border:1px solid var(--rule);border-radius:14px;overflow:hidden}
.wm-col{display:flex;flex-direction:column;gap:10px;padding:22px 20px 24px;background:var(--paper-2)}
.wm-col.is-mcp{background:rgba(255,98,0,.08);box-shadow:inset 0 0 0 1px var(--orange)}
.wm-k{font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.wm-col.is-mcp .wm-k{color:var(--orange)}
.wm-col strong{font-size:clamp(17px,1.5vw,21px);line-height:1.25;letter-spacing:-.02em;color:#fff}
.wm-col p{margin:0!important;font-size:16px!important;line-height:1.55!important;color:var(--muted)}
.wm-col p em{font-style:italic;color:#fff}
.why-mcp.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.why-mcp.four{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1080px){.why-mcp.four{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){.why-mcp,.why-mcp.two,.why-mcp.four{grid-template-columns:1fr}}
.evidence-grid.case-cover-slots{margin:40px 0 0}
.evidence-card image-slot{display:block;width:100%;height:auto;aspect-ratio:16/10;color:#6b7078}
.evidence-card.wide image-slot{height:auto;aspect-ratio:2.2/1}

/* Product markers */
.product-marker{display:grid;grid-template-columns:220px minmax(0,750px);gap:clamp(30px,7vw,100px);justify-content:center;align-items:end;padding:120px 0 0}
.pm-num{grid-column:1;font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.product-marker h2{grid-column:2;margin:0;font-size:clamp(48px,7vw,110px);font-weight:500;line-height:.9;letter-spacing:-.06em;color:#fff}
.product-marker p{grid-column:2;max-width:640px;margin:18px 0 0;font-size:clamp(18px,1.65vw,24px);line-height:1.5;color:var(--muted);text-wrap:pretty}
.product-marker p strong{color:#fff;font-weight:500}
.product-marker + .case-section{padding-top:60px}
.impact-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin:10px 0 24px;background:var(--rule);border:1px solid var(--rule);border-radius:14px;overflow:hidden}
.impact-cell{padding:22px 20px 24px;background:var(--paper-2)}
.impact-cell strong{display:block;font-size:clamp(17px,1.5vw,21px);line-height:1;letter-spacing:-.04em;color:var(--orange)}
.impact-cell span{display:block;margin-top:10px;font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-wrap:balance}
.impact-note{color:var(--muted)}
.roadmap{margin:0;display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:14px;overflow:hidden}
.roadmap>div{display:grid;grid-template-columns:120px 1fr;gap:20px;padding:18px 20px;background:var(--paper-2)}
.roadmap dt{font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding-top:4px}
.roadmap dt.now{color:#7fc35e}.roadmap dt.next{color:var(--orange)}.roadmap dt.later{color:#6ea8ff}
.roadmap dd{margin:0;font-size:16px;line-height:1.5;color:#fff}
.flow-ops{border-style:dashed;color:rgba(255,255,255,.75)}
.flow-ops strong{font-size:clamp(15px,1.5vw,20px)}
@media (max-width:860px){.product-marker{grid-template-columns:1fr;padding-top:80px}.pm-num,.product-marker h2,.product-marker p{grid-column:1}.impact-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.roadmap>div{grid-template-columns:1fr;gap:6px}}
.impact-cell strong{white-space:nowrap}
@media (max-width:1000px){.impact-cell strong{white-space:normal;text-wrap:balance}}
@media (max-width:600px){.impact-grid{grid-template-columns:1fr}}

/* MUSE + ECHO system wireframe */
.agent-system{padding:110px 0;border-bottom:1px solid var(--rule)}
.agent-system-head{display:grid;grid-template-columns:220px minmax(0,760px);gap:clamp(30px,7vw,100px);justify-content:center;margin-bottom:42px}
.agent-system-head h2{margin:0;font-family:"SFMono-Regular",Consolas,monospace;font-size:15px;font-weight:400;letter-spacing:.12em;text-transform:uppercase;color:var(--orange)}
.agent-system-head p{margin:0;font-size:clamp(24px,2.7vw,40px);line-height:1.2;letter-spacing:-.035em;text-wrap:balance}
.system-flow{position:relative;padding:28px;border-radius:var(--radius);background:var(--ink);color:var(--white);overflow:hidden}
.system-flow::before{content:"MUSE · CONTENT IN → ON-BRAND HTML OUT";display:block;margin-bottom:24px;font-family:"SFMono-Regular",Consolas,monospace;font-size:9px;letter-spacing:.12em;color:rgba(255,255,255,.5)}
.flow-track{display:grid;grid-template-columns:.7fr 56px 1.4fr 68px .8fr 56px .95fr 56px .8fr;gap:8px;align-items:stretch}
.flow-node,.agent-card,.human-gate{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-width:0;padding:18px;border:1px solid rgba(255,255,255,.28);border-radius:12px;background:rgba(255,255,255,.04)}
.flow-node{justify-content:center;text-align:center}
.flow-node strong,.agent-card h3{margin:0;font-size:clamp(15px,1.5vw,22px);line-height:1.05;letter-spacing:-.03em}
.flow-node small,.agent-card small{display:block;margin-top:8px;font-family:"SFMono-Regular",Consolas,monospace;font-size:8px;line-height:1.45;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.56)}
.agent-card{min-height:250px}
.agent-card::before{content:attr(data-step);position:absolute;right:12px;top:10px;font-family:"SFMono-Regular",Consolas,monospace;font-size:9px;color:rgba(22,29,38,.5)}
.agent-card h3{font-size:clamp(26px,2.8vw,42px)}
.agent-card ul{list-style:none;margin:28px 0 0;padding:0;border-top:1px solid currentColor}
.agent-card li{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid currentColor;font-size:10px;line-height:1.25}
.agent-card li span{font-family:"SFMono-Regular",Consolas,monospace;font-size:8px;opacity:.66}
.agent-card[data-agent="muse"]{background:var(--orange);border-color:var(--orange);color:var(--ink)}
.agent-card[data-agent="muse"] small{color:rgba(22,29,38,.62)}
.agent-card[data-agent="echo"]{background:var(--navy);border-color:rgba(255,255,255,.35);color:var(--white)}
.agent-card[data-agent="echo"]::before{color:rgba(255,255,255,.48)}
.flow-connector{position:relative;display:flex;align-items:center;justify-content:center;min-height:40px;color:rgba(255,255,255,.56)}
.flow-connector::before{content:"";width:100%;height:1px;background:currentColor}
.flow-connector::after{content:"";position:absolute;right:0;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
.flow-connector span{position:absolute;top:calc(50% + 16px);left:0;right:0;width:auto;transform:none;font-family:"SFMono-Regular",Consolas,monospace;font-size:6.5px;line-height:1.55;text-align:center;text-transform:uppercase;letter-spacing:.02em;overflow-wrap:anywhere}
.human-gate{justify-content:center;align-items:center;border-style:dashed;text-align:center;text-transform:uppercase;font-family:"SFMono-Regular",Consolas,monospace;font-size:9px;letter-spacing:.06em}
.human-gate::before{content:"HUMAN";display:block;margin-bottom:7px;color:var(--orange);font-size:8px}
.flow-send{border-color:var(--orange);color:var(--white)}
.flow-send strong{display:block;margin-top:12px;color:var(--orange);font-size:18px}
.feedback-loop{position:relative;margin:24px 13% 0;padding:14px 18px;border:1px dashed rgba(255,98,0,.7);border-top:0;border-radius:0 0 10px 10px;font-family:"SFMono-Regular",Consolas,monospace;font-size:8px;line-height:1.4;letter-spacing:.08em;text-align:center;text-transform:uppercase;color:var(--orange)}
.feedback-loop::before{content:"";position:absolute;left:-8px;top:-9px;width:16px;height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M13 13 L3.5 3.5 M3.5 3.5 h6 M3.5 3.5 v6' stroke='%23FF6200' stroke-width='1.6' fill='none'/%3E%3C/svg%3E") no-repeat center/contain}
.feedback-loop::after{content:"";position:absolute;right:-8px;top:-9px;width:16px;height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M13 3 L3.5 12.5 M3.5 12.5 h6 M3.5 12.5 v-6' stroke='%23FF6200' stroke-width='1.6' fill='none'/%3E%3C/svg%3E") no-repeat center/contain}
.rules-block{margin-top:16px;display:grid;grid-template-columns:5fr 4fr;gap:12px;align-items:start}
.rules-col{min-width:0}
.rules-head{margin:22px 0 10px;font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--white)}
.rules-head em{font-style:normal;color:var(--muted)}
.rules-col .rules-head{margin-top:0}
.impact-grid.rules{grid-template-columns:1fr;margin:0}
.impact-grid.rules .impact-cell{display:flex;align-items:baseline;gap:14px;padding:14px 18px}
.impact-grid.rules .impact-cell strong{font-size:clamp(22px,2.2vw,32px);min-width:2.2ch;white-space:nowrap}
.impact-grid.rules .impact-cell span{margin-top:0}
@media (max-width:860px){.rules-block{grid-template-columns:1fr}}
.proof-groups{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}
.proof-groups.two{grid-template-columns:1fr 1fr}
.proof-group{padding:22px;border:1px solid var(--rule);border-radius:12px;background:var(--paper-2)}
.proof-group.muse{background:var(--orange);border-color:var(--orange);color:var(--ink)}
.proof-group.echo{background:var(--navy);border-color:var(--navy);color:var(--white)}
.proof-group h3{margin:0 0 20px;font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase}
.proof-stat{padding:10px 0;border-top:1px solid currentColor}
.proof-stat strong{display:block;font-size:clamp(20px,2.2vw,32px);line-height:1;letter-spacing:-.04em}
.proof-stat span{display:block;margin-top:6px;font-size:10px;line-height:1.4;opacity:.65;text-wrap:pretty}

@media (max-width:1180px){
  .evidence-float{min-width:140px;padding:13px 15px}
  .evidence-float strong{font-size:26px}
  .evidence-float span{font-size:10px;max-width:15ch}
  .float-a{left:4%;top:20%}.float-b{right:4%;top:18%}.float-c{right:8%;top:42%}.float-d{left:7%;top:44%}
}

@media (max-width:860px){
  .site-header{grid-template-columns:1fr auto}.brand-link{justify-self:start}.header-nav{display:none}.header-nav.right{display:flex;justify-self:end}
  .hero-marquee{top:28%}.hero-marquee span{font-size:clamp(86px,23vw,150px)}
  .evidence-float{min-width:120px;padding:11px 13px}.evidence-float strong{font-size:22px}.evidence-float span{font-size:8px}
  .float-a{left:5%;top:12%}.float-b{right:4%;top:16%}.float-c{right:5%;top:48%}.float-d{left:7%;top:51%}
  .hero-copy{grid-template-columns:1fr}.hero h1{font-size:clamp(48px,11vw,82px)}.scroll-cue{justify-self:start}
  .positioning p{font-size:clamp(38px,8vw,68px)}
  .profile-grid{grid-template-columns:1fr}.profile h2{max-width:13ch}
  .experience-row{grid-template-columns:max-content 1fr}.experience-row time{grid-column:2;text-align:left}
  .case-overview{grid-template-columns:1fr}.case-section{grid-template-columns:1fr;gap:18px}.case-section h2{position:static}
  .agent-system-head{grid-template-columns:1fr;gap:18px}.flow-track{grid-template-columns:1fr}.flow-connector{min-height:52px}.flow-connector::before{width:1px;height:100%}.flow-connector::after{right:auto;bottom:0;transform:rotate(135deg)}.flow-connector span{top:50%;left:calc(50% + 58px);right:auto;width:96px;transform:translateY(-50%);font-size:8px}.feedback-loop{margin:18px 0 0}.proof-groups{grid-template-columns:1fr}
}

@media (max-width:600px){
  :root{--pad:20px;--radius:13px}
  .site-header{min-height:60px;padding-top:10px}.brand-link{font-size:16px}.pill{min-height:34px;padding:7px 12px;font-size:9px}
  .hero-kicker{top:78px}.hero-marquee{top:24%}
  .hero-evidence{top:0}.evidence-float{min-width:104px}.evidence-float strong{font-size:18px}.evidence-float span{max-width:16ch}
  .float-a{left:4%;top:31%}.float-b{right:4%;top:34%}.float-c{right:5%;top:48%}.float-d{left:6%;top:50%}
  .hero-copy{bottom:25px;gap:10px}.hero h1{font-size:clamp(44px,13.5vw,66px)}
  .scroll-cue{font-size:9px}.scroll-cue::after{width:30px;height:30px}
  .positioning{padding-top:95px;padding-bottom:95px}.positioning p{font-size:30px}
  .section-heading{align-items:start}.section-heading p{display:none}
  .featured-projects{padding:72px 0 85px}.project-card,.project-card.wide{flex-basis:82vw}.project-placeholder{min-height:105vw}.view-case{width:88px;height:88px;opacity:1;transform:scale(.8)}
  .project-info{grid-template-columns:1fr}.project-meta{text-align:left}.project-verdict,.project-tags{grid-column:1}
  .profile{padding-top:85px;padding-bottom:85px}.profile-grid{padding-bottom:75px}.profile h2{font-size:48px}.profile-copy p{font-size:19px}
  .experience-row{grid-template-columns:1fr;gap:3px}.experience-row time{grid-column:1}
  .site-footer{padding-top:70px}.footer-callout{font-size:50px;margin-bottom:70px}.footer-bottom{grid-template-columns:1fr}
  .case-page{padding-top:78px}.back-link{margin-bottom:48px}.case-hero h1{font-size:clamp(62px,20vw,96px)}.case-verdict{font-size:25px}
  .case-cover-placeholder{min-height:78vw;margin-top:24px}.case-overview{padding:75px 0;gap:50px}.case-lead{font-size:29px}
  .metric-strip{grid-template-columns:1fr}.metric-item,.metric-item:not(:first-child){padding:20px 0;border-right:0;border-bottom:1px solid var(--rule)}.metric-item:last-child{border-bottom:0}
  .case-section{padding:78px 0}.case-body p{font-size:18px}.evidence-grid{grid-template-columns:1fr}.evidence-card.wide{grid-column:auto}
  .case-visual-placeholder{min-height:88vw;margin-bottom:65px}.case-next{grid-template-columns:1fr}.case-next a{padding:28px 0;font-size:30px}.case-next a:last-child{text-align:left;border-left:0;border-top:1px solid var(--rule)}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  body{animation:none!important}
  .hero-marquee-track{transform:translateX(-12%)}
  .evidence-float{animation:none!important}
  .js .reveal{opacity:1!important;transform:none!important}
}


/* Design MCP architecture (native) */
.arch-system{padding:110px 0 0;}
.arch-flow{display:grid;gap:0}
.arch-flow>*+*:not(.arch-connector){margin-top:0}
.arch-paths,.arch-layer,.arch-entry,.arch-shared,.arch-future{margin:0}
.arch-flow::before{content:attr(data-flow-label)}
.arch-entry{padding:20px;border:1px solid var(--orange);border-radius:12px;background:rgba(255,98,0,.08);text-align:center}
.arch-entry strong{font-size:clamp(20px,2vw,30px);letter-spacing:-.03em}
.arch-entry small,.arch-shared small,.arch-future{font-family:"SFMono-Regular",Consolas,monospace;font-size:9px;letter-spacing:.07em;text-transform:uppercase;color:rgba(255,255,255,.56)}
.arch-entry small{display:block;margin-top:8px}
.arch-paths{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.arch-path{position:relative;padding:18px;border:1px solid rgba(255,255,255,.28);border-radius:12px;background:rgba(255,255,255,.04)}
.arch-path h3{margin:10px 0 0;font-size:clamp(16px,1.5vw,22px);letter-spacing:-.03em}
.arch-path small{display:block;margin-top:6px;font-family:"SFMono-Regular",Consolas,monospace;font-size:8px;line-height:1.45;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.56)}
.arch-path ul{list-style:none;margin:16px 0 0;padding:0;border-top:1px solid rgba(255,255,255,.25)}
.arch-path li{padding:7px 0;border-bottom:1px solid rgba(255,255,255,.18);font-size:11px;line-height:1.3}
.arch-phase{display:inline-block;padding:3px 9px;border:1px solid var(--orange);border-radius:999px;font-family:"SFMono-Regular",Consolas,monospace;font-size:8px;letter-spacing:.08em;text-transform:uppercase;color:var(--orange)}
.arch-phase.alt{border-color:rgba(255,255,255,.4);color:rgba(255,255,255,.6)}
.arch-shared{padding:16px 20px;border:1px solid var(--orange);border-radius:12px;background:var(--orange);color:var(--ink);text-align:center}
.arch-shared strong{display:block;font-size:15px;letter-spacing:-.02em}
.arch-shared small{display:block;margin-top:6px;color:rgba(22,29,38,.72)}
.arch-layer{padding:16px 18px;border:1px solid rgba(255,255,255,.28);border-radius:12px;background:rgba(255,255,255,.04)}
.arch-layer h4{margin:0 0 12px;font-family:"SFMono-Regular",Consolas,monospace;font-size:9px;font-weight:400;letter-spacing:.1em;text-transform:uppercase;color:var(--orange)}
.arch-cells{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.arch-cells span{padding:10px 8px;border:1px solid rgba(255,255,255,.2);border-radius:8px;font-size:11px;text-align:center;line-height:1.3}
.arch-future{padding:14px 18px;border:1px dashed rgba(255,255,255,.35);border-radius:12px;text-align:center}
.arch-future strong{color:var(--orange);margin-right:8px}

/* PPT 13-step execution flow */
.ppt-flow{margin:70px 0 110px}
.ppt-flow-legend{display:flex;gap:14px;margin-bottom:14px;font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.ppt-flow-legend .lg::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}
.ppt-flow-legend .user::before{background:#6ea8ff}
.ppt-flow-legend .sys::before{background:var(--orange)}
.ppt-flow-legend .qa::before{background:#7fc35e}
.ppt-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;counter-reset:none}
.ppt-steps li{position:relative;padding:16px 16px 14px;border:1px solid var(--rule);border-radius:12px;background:var(--paper-2)}
.ppt-steps li i{position:absolute;right:12px;top:12px;font-style:normal;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;color:var(--ink)}
.ppt-steps li.user i{background:#6ea8ff}
.ppt-steps li.sys i{background:var(--orange)}
.ppt-steps li.qa i{background:#7fc35e}
.ppt-steps li strong{display:block;padding-right:30px;font-size:14px;letter-spacing:-.01em}
.ppt-steps li small{display:block;margin-top:7px;font-family:"SFMono-Regular",Consolas,monospace;font-size:9px;line-height:1.45;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}

/* MUSE / ECHO screenshot slots */
.agent-shots{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.agent-shot-placeholder{display:grid;place-items:center;min-height:280px;border:1px dashed rgba(255,255,255,.3);border-radius:12px;background:rgba(255,255,255,.03);font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.11em;color:var(--muted)}

@media (max-width:860px){.arch-paths{grid-template-columns:1fr 1fr}.arch-cells{grid-template-columns:repeat(3,1fr)}.agent-shots{grid-template-columns:1fr}}
@media (max-width:600px){.arch-paths{grid-template-columns:1fr}.arch-cells{grid-template-columns:1fr 1fr}.ppt-flow{margin-top:-20px}}

/* architecture connectors */
.arch-connector{display:grid;grid-template-columns:1fr;height:30px}
.arch-connector.cols-4{grid-template-columns:repeat(4,1fr);gap:10px}
.arch-connector.cols-6{grid-template-columns:repeat(6,1fr);gap:8px}
.arch-connector span{position:relative;display:block}
.arch-connector span::before{content:"";position:absolute;left:50%;top:4px;bottom:9px;width:1px;background:rgba(255,255,255,.45)}
.arch-connector.dashed span::before{background:none;border-left:1px dashed rgba(255,255,255,.45)}
.arch-connector span::after{content:"";position:absolute;left:50%;bottom:5px;width:6px;height:6px;border-right:1px solid rgba(255,255,255,.55);border-bottom:1px solid rgba(255,255,255,.55);transform:translateX(-50%) rotate(45deg)}
/* ppt step arrows */
.ppt-steps li:not(:last-child)::after{content:"→";position:absolute;right:-12px;top:50%;transform:translateY(-50%);z-index:1;color:var(--muted);font-size:13px}

/* PPT user journey (6 steps) */
.journey{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:22px}
.j-step{position:relative;padding:18px 16px;border:1px solid var(--rule);border-radius:14px;background:var(--paper-2);display:flex;flex-direction:column;gap:8px}
.j-step:not(:last-child)::after{content:"\2192";position:absolute;right:-22px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:15px}
.j-eyebrow{margin:0;font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#7fc35e}
.j-step.design .j-eyebrow{color:var(--orange)}
.j-step h3{margin:0;font-size:17px;letter-spacing:-.02em;padding-bottom:8px;border-bottom:1px solid var(--rule)}
.j-tools{margin:0;font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.j-card{padding:10px 11px;border:1px solid var(--rule);border-radius:9px;background:rgba(255,255,255,.03)}
.j-card.blue{border-color:#2c4a7a;background:rgba(59,111,212,.12)}
.j-card.qc{border-color:var(--orange);background:rgba(255,98,0,.1)}
.j-card.qa{border-color:#3c6b28;background:rgba(111,176,74,.1)}
.j-card strong{display:block;font-size:12px;line-height:1.3;letter-spacing:-.01em}
.j-card small{display:block;margin-top:5px;font-size:10px;line-height:1.45;color:var(--muted)}
.journey-key{display:flex;flex-wrap:wrap;gap:10px 18px;margin:0 0 18px}
.journey-key .k{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.journey-key .k::before{content:"";width:11px;height:11px;border-radius:3px;border:1.5px solid var(--rule);background:rgba(255,255,255,.03)}
.journey-key .k.blue::before{border-color:#2c4a7a;background:rgba(59,111,212,.12)}
.journey-key .k.qc::before{border-color:var(--orange);background:rgba(255,98,0,.1)}
.journey-key .k.qa::before{border-color:#3c6b28;background:rgba(111,176,74,.1)}
.click-journey{margin-top:0}
.journey-note{margin:22px 0 0;font-size:15px;font-weight:700;letter-spacing:-.01em}
@media (max-width:1180px){
  .journey{grid-template-columns:1fr;gap:30px}
  .j-step:not(:last-child)::after{content:"";right:auto;left:50%;top:auto;bottom:-24px;transform:translateX(-50%);width:14px;height:14px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M7 1 v11 M7 12 l-4.5 -4.5 M7 12 l4.5 -4.5' stroke='%2398a0aa' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") no-repeat center/contain}
}


/* PPT Studio mockup strip */
.mock-strip-wrap{margin:70px 0 0}
.mock-strip-label{margin:0 0 14px;font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:var(--muted)}
.mock-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mock-card{display:block}
.mock-frame{position:relative;display:block;aspect-ratio:1440/900;overflow:hidden;border:1px solid var(--rule);border-radius:12px;background:#fff;transition:transform .3s cubic-bezier(.2,.8,.2,1),border-color .3s}
.mock-card:hover .mock-frame{transform:translateY(-4px);border-color:var(--orange)}
.mock-frame iframe{position:absolute;left:0;top:0;width:1440px;height:900px;border:0;transform-origin:0 0;pointer-events:none}
.mock-caption{display:block;padding:10px 2px 0;font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
@media (max-width:860px){.mock-strip{grid-template-columns:1fr}}

/* PPT Studio click-through journey */
.click-journey{margin:70px 0 0}
.cj-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 30px;align-items:end;margin-bottom:22px}
.cj-head .mock-strip-label{margin:0 0 10px;grid-column:1}
.cj-head h3{margin:0;font-size:clamp(24px,2.7vw,40px);font-weight:500;line-height:1.1;letter-spacing:-.035em;text-wrap:balance}
.cj-head h3 em{font-style:normal;color:var(--orange)}
.cj-legend{display:flex;gap:8px;flex-wrap:wrap}
.cj-tag{display:inline-flex;align-items:center;padding:4px 9px;border-radius:999px;border:1px solid var(--rule);font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.cj-tag.you{background:#fff;border-color:#fff;color:var(--ink)}
.cj-tag.ai{background:rgba(255,98,0,.12);border-color:rgba(255,98,0,.45);color:var(--orange)}
.cj-tag.gate{background:rgba(232,90,79,.1);border-color:rgba(232,90,79,.45);color:#f08a7f}
.cj-map{display:flex;align-items:center;gap:0;padding:14px 20px;margin-bottom:26px;border:1px solid var(--rule);border-radius:14px;background:var(--paper-2);overflow-x:auto;scrollbar-width:none}
.cj-map::-webkit-scrollbar{display:none}
.cj-map .m{display:flex;align-items:center;gap:8px;white-space:nowrap;font-size:13px;font-weight:600;letter-spacing:-.01em}
.cj-map .m i{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--orange);color:var(--ink);font-style:normal;font-family:"SFMono-Regular",Consolas,monospace;font-size:10px}
.cj-map .m.gated{color:#f08a7f}.cj-map .m.gated i{background:#e85a4f;color:#fff}
.cj-map .arr{flex:1;min-width:14px;height:0;margin:0 10px;border-top:1px solid var(--rule);position:relative}
.cj-map .arr::after{content:"";position:absolute;right:-1px;top:-4px;border:3.5px solid transparent;border-left:5px solid var(--muted)}
.cj-map .out{padding:5px 12px;border:1px dashed var(--orange);border-radius:999px;background:rgba(255,98,0,.06);font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--orange);white-space:nowrap}
.cj-step{display:grid;grid-template-columns:minmax(260px,360px) minmax(0,1fr);gap:clamp(24px,4vw,44px);align-items:start;padding:clamp(20px,3vw,32px);border:1px solid var(--rule);border-radius:16px;background:var(--paper-2)}
.cj-num{display:grid;place-items:center;width:36px;height:36px;margin-bottom:14px;border-radius:50%;background:var(--orange);color:var(--ink);font-family:"SFMono-Regular",Consolas,monospace;font-size:14px}
.cj-tags{display:flex;gap:6px;margin-bottom:12px}
.cj-cap h4{margin:0 0 12px;font-size:clamp(17px,1.5vw,21px);font-weight:500;line-height:1.3;letter-spacing:-.025em;text-wrap:balance}
.cj-cap p{margin:0;font-size:16px;line-height:1.6;color:var(--muted);text-wrap:pretty}
.cj-cap p+p{margin-top:10px}
.cj-cap b{color:#fff;font-weight:600}
.cj-cap .react{padding-left:12px;border-left:2px solid var(--orange)}
.cj-cap .react.gate{border-left-color:#e85a4f}
.cj-shot{position:relative;display:block;justify-self:end;width:100%;overflow:hidden;border:1px solid var(--rule);border-radius:12px;background:#fff;font-size:0;box-shadow:0 12px 32px rgba(0,0,0,.35)}
.cj-shot.zoom{max-width:680px}.cj-shot.wide{max-width:980px}
.cj-shot img{display:block;width:100%}
.cj-zoomtag{position:absolute;top:10px;left:10px;z-index:3;padding:4px 9px;border-radius:6px;background:var(--ink);color:#fff;font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;opacity:.9}
.cj-mk{position:absolute;z-index:2;width:40px;height:40px;border:3px solid var(--orange);border-radius:50%;background:rgba(255,98,0,.15);box-shadow:0 0 0 5px rgba(255,98,0,.2),inset 0 0 0 1px rgba(255,255,255,.8);transform:translate(-50%,-50%)}
.cj-mk.gatemk{border-color:#e85a4f;background:rgba(232,90,79,.12);box-shadow:0 0 0 5px rgba(232,90,79,.18)}
.cj-mk span{position:absolute;top:100%;left:50%;transform:translate(-50%,9px);padding:3px 8px;border-radius:5px;background:var(--orange);color:var(--ink);font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.cj-mk.gatemk span{background:#e85a4f;color:#fff}
.cj-mk span.up{top:auto;bottom:100%;transform:translate(-50%,-9px)}
.cj-mk span.lt{top:50%;left:auto;right:100%;transform:translate(-10px,-50%)}
.cj-gap{display:flex;flex-direction:column;align-items:center;gap:10px;padding:14px 0}
.cj-gap::before{content:"";width:0;height:28px;border-left:2px solid var(--orange)}
.cj-gap span{padding:5px 13px;border:1px solid var(--rule);border-radius:999px;background:var(--paper-2);font-size:13px;letter-spacing:.02em;color:var(--muted)}
.cj-gap span b{color:var(--orange);font-weight:600}
.cj-outcome{display:grid;grid-template-columns:minmax(260px,360px) minmax(0,1fr);gap:clamp(24px,4vw,44px);align-items:center;padding:clamp(20px,3vw,30px) clamp(20px,3vw,36px);border:1.5px dashed var(--orange);border-radius:16px;background:rgba(255,98,0,.05)}
.cj-outcome .k{display:block;margin-bottom:8px;font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--orange)}
.cj-outcome h4{margin:0;font-size:clamp(17px,1.5vw,21px);font-weight:500;letter-spacing:-.03em}
.cj-outcome p{margin:0;font-size:16px;line-height:1.6;color:var(--muted)}
@media (max-width:860px){
  .cj-head{grid-template-columns:1fr}
  .cj-step,.cj-outcome{grid-template-columns:1fr}
  .cj-shot{justify-self:start}
  .cj-mk{width:30px;height:30px;border-width:2px}
}


/* Liquid text reveal (SplitText lines + SVG goo filter) */
.js [data-reveal-text]{visibility:hidden}
.js [data-reveal-text].goo-ready{visibility:visible}
.goo-line{display:block;position:relative;will-change:filter}
@media (prefers-reduced-motion:reduce){.js [data-reveal-text]{visibility:visible!important}.goo-line{filter:none!important}}

/* Simple fade-in for everything without a dedicated animation */
.js .fade{opacity:0;transform:translateY(10px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.8,.2,1)}
.js .fade.is-visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .fade{opacity:1!important;transform:none!important;transition:none!important}}

/* Original project evidence — preserve the authored dark/orange visual system. */
.portfolio-cover{position:relative;margin:40px 0 0;border:1px solid var(--rule);border-radius:var(--radius);overflow:hidden;isolation:isolate}
.cover-kicker{display:flex;justify-content:space-between;gap:18px;padding:32px 36px 0;font-family:"SFMono-Regular",Consolas,monospace;font-size:11px;letter-spacing:.12em;position:relative;z-index:2}
.cover-kicker span{opacity:.65;text-align:right}
.portfolio-cover>figcaption{position:relative;z-index:2;padding:24px 36px 30px;font-size:14px;letter-spacing:-.01em}
.mcp-cover{background:radial-gradient(ellipse at 10% 0%,#ffc58d 0%,#ff6200 40%,#76220a 76%,#171318 100%);color:#fff}
.mcp-cover-screens{height:clamp(310px,41vw,590px);position:relative;margin:18px 0 0}
.mcp-cover-screens img{position:absolute;width:70%;border-radius:10px;border:1px solid rgba(255,255,255,.7);box-shadow:0 32px 60px #33150a70}
.mcp-cover-screens img:first-child{top:0;right:6%;transform:rotate(6deg)}
.mcp-cover-screens img:last-child{top:21%;left:5%;transform:rotate(-5deg)}
.mini-cover{background:radial-gradient(ellipse at 90% 15%,#ffe9d3,#ffc3a5 62%,#f59867);color:#38261c}
.mini-cover-screens{height:clamp(340px,47vw,640px);display:flex;justify-content:center;gap:4%;padding:30px 6% 0;overflow:hidden}
.mini-cover-screens>div{width:25%;flex-shrink:0;aspect-ratio:750/1540;align-self:flex-start;overflow:hidden;border-radius:clamp(14px,2.2vw,30px);border:4px solid #fff;box-shadow:0 18px 35px #9b451b35;transform:translateY(55px) rotate(-9deg);background:#fff}
.mini-cover-screens>div:nth-child(2){transform:rotate(-4deg);width:28%}
.mini-cover-screens>div:last-child{transform:translateY(38px) rotate(8deg)}
.mini-cover-screens img{display:block;width:100%;height:auto}
.mini-cover>figcaption{background:linear-gradient(transparent,#ffd6b9 35%)}
.localization-art{background:radial-gradient(ellipse at 10% 0%,#ffd3a3,#ff6200 52%,#622006);overflow:hidden}
.localization-art img{position:absolute;height:auto;width:133%;max-width:none;object-fit:contain;border:1px solid #ffffff80;border-radius:8px;box-shadow:0 15px 35px #36170850}
.localization-art img.loc-main{top:18%;left:-9%;transform:rotate(-12deg)}
.localization-art img.loc-detail{width:101%;top:54%;left:16%;transform:rotate(9deg)}
.mini-screen-story{margin:25px 0 80px}
.phone-evidence-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,3vw,38px);padding:clamp(24px,5vw,60px);background:linear-gradient(125deg,#252a32,#181c23);border:1px solid var(--rule);border-radius:var(--radius)}
.phone-evidence{margin:0;min-width:0}
.phone-evidence>a{display:block;aspect-ratio:750/1630;overflow:auto;scrollbar-width:thin;border-radius:20px;background:#fff;border:5px solid #333943;box-shadow:0 14px 30px #0005}
.phone-evidence img{display:block;width:100%;height:auto}
.phone-evidence figcaption{font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;line-height:1.7;letter-spacing:.05em;margin-top:18px;color:var(--muted);text-transform:uppercase}
.phone-evidence-grid.two{grid-template-columns:repeat(2,minmax(0,290px));justify-content:center}
.mini-journey{margin-top:24px}
.mini-foundations img{object-fit:contain}
.case-cover-slots{align-items:start}
.evidence-card image-slot{min-width:0}
@media(max-width:860px){
 .cover-kicker{padding:24px 22px 0;font-size:9px;gap:14px}.cover-kicker span{max-width:16ch}
 .portfolio-cover>figcaption{padding:20px 22px;font-size:12px}
 .mcp-cover-screens{height:46vw;min-height:220px}.mcp-cover-screens img{width:82%}.mcp-cover-screens img:first-child{right:2%}.mcp-cover-screens img:last-child{left:3%}
 .mini-cover-screens{height:59vw;min-height:260px;padding:24px 0 0;gap:5%}.mini-cover-screens>div{width:29%;border-width:2px}.mini-cover-screens>div:nth-child(2){width:32%}
 .phone-evidence-grid{padding:22px;gap:24px;grid-template-columns:repeat(2,minmax(0,1fr))}.phone-evidence-grid>.phone-evidence:last-child:nth-child(odd){grid-column:1/-1;width:50%;justify-self:center}
}
@media(max-width:520px){
 .phone-evidence-grid,.phone-evidence-grid.two{grid-template-columns:minmax(0,290px);justify-content:center;padding:28px}
 .phone-evidence-grid>.phone-evidence:last-child:nth-child(odd){grid-column:auto;width:100%}
 .portfolio-cover{margin-top:24px}.mini-screen-story{margin-bottom:50px}
}

.hyper-test-pair{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#e2e2e2;align-items:start}.hyper-test-pair img{width:100%;height:auto}.hyper .evidence-grid{align-items:start}@media(max-width:600px){.hyper-test-pair{grid-template-columns:1fr}}
/* Keep screenshot proportions intact and captions readable above the cover art. */
.mcp-cover-screens{height:clamp(310px,48vw,690px)}
.mcp-cover-screens img{width:64%;height:auto}
.mcp-cover-screens img:first-child{top:6%;right:6%}
.mcp-cover-screens img:last-child{top:22%;left:5%}
.mcp-cover>figcaption{background:linear-gradient(transparent,rgba(46,16,9,.75) 50%)}
@media(max-width:860px){.mcp-cover-screens{height:58vw;min-height:230px}.mcp-cover-screens img{width:80%}.mcp-cover-screens img:first-child{right:3%}.mcp-cover-screens img:last-child{left:3%;top:26%}}

/* Compact evidence presentation: preserve original UI, translate explanatory diagrams. */
.phone-evidence-grid{grid-template-columns:repeat(3,minmax(0,240px));justify-content:center;padding:32px;gap:28px}
.phone-evidence-grid.two{grid-template-columns:repeat(2,minmax(0,240px))}
.phone-evidence .phone-viewport{height:430px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;border-radius:20px;background:#fff;border:5px solid #333943;box-shadow:0 14px 30px #0005}
.phone-viewport:focus-visible{outline:2px solid var(--orange,#FF6200);outline-offset:5px}
.phone-evidence .full-screen-link{display:block;margin-top:8px;color:#FF6200;font-size:10px}
.mini-journey>a,.mini-foundations a{display:block}
.mini-foundations{align-items:start}
.mini-foundations img,.mini-journey img{display:block;width:100%;height:auto}
.source-links{font-size:12px!important;line-height:1.8!important;color:var(--muted);margin:20px 0 0!important}
.source-links a{color:#FF6200;text-underline-offset:3px}
.source-links.wide{grid-column:1/-1}
.campaign-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding:32px;background:#f5f5f5;color:#161D26}
.campaign-example{min-width:0}
.campaign-heading{margin-bottom:18px}
.campaign-heading h3{font-size:22px;margin:0 0 5px;line-height:1.2;min-height:2.4em}
.campaign-heading span{font:10px/1.4 monospace;color:#727780;letter-spacing:.08em}
.campaign-preview{display:flex;height:430px;align-items:flex-start;justify-content:center;background:#ebe9e5;border:1px solid #e2dfd9;border-radius:8px;padding:12px;transition:background .2s}
.campaign-preview:hover{background:#e0ddd6}
.campaign-preview img{display:block;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;object-position:top center;background:transparent;filter:drop-shadow(0 3px 5px #0002)}
.campaign-link{display:inline-block;font:11px/1.5 monospace;color:#161D26;margin-top:16px;text-underline-offset:4px}
.hyper-test-pair>a{display:flex;height:520px;padding:20px;justify-content:center;background:#f5f3ef}
.hyper-test-pair img{width:100%;height:100%;object-fit:contain;object-position:top}
@media(max-width:900px){.phone-evidence-grid,.phone-evidence-grid.two{padding:24px;gap:18px}.phone-evidence-grid>.phone-evidence:last-child:nth-child(odd){grid-column:auto;width:auto;justify-self:stretch}.phone-evidence .phone-viewport{height:360px}.campaign-gallery{gap:16px;padding:24px}.campaign-heading h3{font-size:18px}.campaign-preview{height:350px;padding:8px}}
@media(max-width:600px){.phone-evidence-grid,.phone-evidence-grid.two{display:flex;justify-content:flex-start;overflow-x:auto;scroll-snap-type:x mandatory;padding:24px;gap:20px;scrollbar-width:thin}.phone-evidence-grid>.phone-evidence,.phone-evidence-grid>.phone-evidence:last-child:nth-child(odd){flex:0 0 220px;width:220px;scroll-snap-align:center}.phone-evidence .phone-viewport{height:390px}.campaign-gallery{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding:24px;gap:20px;scrollbar-width:thin}.campaign-example{flex:0 0 240px;scroll-snap-align:center}.campaign-preview{height:360px}.campaign-heading h3{font-size:22px}.hyper-test-pair>a{height:390px}}

/* Hyper evidence: HTML annotations over unchanged source screenshots. */
.hyper-quality{row-gap:32px}
.hyper-quality>.hyper-tool-proof{grid-column:1/-1}
.hyper-quality>.qc-explanation{grid-column:2}
.hyper-tool-proof{background:#f5f3ef}
.hyper-proof-heading{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:32px;padding:30px 32px;background:#161d26;color:#fff}
.proof-eyebrow{display:block;font:10px/1.5 monospace;letter-spacing:.1em;color:#FF6200}
.batch-total{display:block;font-size:clamp(56px,6vw,84px);line-height:1.1;letter-spacing:-.055em;margin:8px 0;color:#FF6200}
.batch-unit{font-size:16px;color:#dfe3e8}
.qc-intro h3{font-size:clamp(21px,2.3vw,30px);line-height:1.15;letter-spacing:-.025em;margin:10px 0}
.qc-intro p{font-size:13px;line-height:1.5;color:#bdc3ca;margin:0;max-width:34ch}
.hyper-proof-layout{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);gap:24px;padding:26px;align-items:start;color:#161d26}
.hyper-tool-stage,.source-sheet-stage{position:relative;border:1px solid #d5d8dc;border-radius:7px;overflow:hidden;background:#fff}
.tool-highlight,.source-column-outline{position:absolute;border:2px solid #ff6200;border-radius:4px;box-shadow:0 0 0 1px #fff8;pointer-events:none}
.tool-highlight b{position:absolute;right:-2px;top:-21px;background:#ff6200;color:#fff;font:11px/20px monospace;padding:0 5px;border-radius:3px 3px 0 0}
.batch-highlight{left:63.1%;top:14.4%;width:6.5%;height:2.9%}
.qc-highlight{left:32.2%;top:65.8%;width:19.1%;height:26.7%}
.batch-counter-detail{display:flex;flex-wrap:wrap;gap:10px 20px;align-items:center;padding:18px 0 0}
.proof-detail-label{display:block;font:11px/1.6 monospace;color:#FF6200}
.batch-counter-detail>.proof-detail-label{flex-basis:100%}
.batch-counter-detail>span:last-child{font-size:12px;color:#666d76}
.evidence-zoom{position:relative;overflow:hidden;background:#fff}
.evidence-zoom>img{position:absolute;width:var(--image-width);max-width:none;height:auto;left:var(--image-left);top:var(--image-top)}
.batch-counter-zoom{width:175px;border:1px solid #ff6200;border-radius:6px;flex:none}
.qc-focus{padding:16px;background:#fff;border:1px solid #ddd9d2;border-radius:10px}
.qc-panel-zoom{width:100%;max-width:300px;margin:12px auto 16px}
.qc-english-key{display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:11px;line-height:1.5;border-top:1px solid #e6e3df;padding-top:12px}
.qc-english-key b{color:#197c52}
.qc-focus>p{font-size:11px;line-height:1.6;margin:12px 0 0;color:#686f77}
.hyper-source-evidence{margin:26px 0 14px;background:#f5f3ef}
.hyper-source-heading{padding:22px 24px 0;color:#161d26}
.hyper-source-heading .proof-eyebrow{color:#FF6200}
.hyper-source-heading h3{font-size:22px;line-height:1.25;margin:8px 0 0;letter-spacing:-.02em}
.hyper-source-heading code{color:#FF6200;font-size:.9em}
.hyper-source-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:20px;padding:22px 24px;align-items:center}
.source-column-outline{left:70.8%;top:16.8%;width:29.2%;height:78.7%}
.case-body .source-sheet-note{margin:10px 0 0;font:10px/1.5 monospace;color:#777d84}
.content-column-label{display:flex;justify-content:space-between;gap:8px;align-items:center;padding:9px 12px;background:#ff6200;color:#fff;font-size:11px;border-radius:6px 6px 0 0}
.content-column-label code{font-size:14px}
.content-column-zoom{border:2px solid #ff6200;border-top:0;border-radius:0 0 6px 6px}
.hyper-reference{margin:16px 0;font:12px/1.6 monospace;color:var(--muted)}
.hyper-reference summary{cursor:pointer;color:#FF6200;text-underline-offset:4px}
.hyper-reference .evidence-card{max-width:390px;margin:20px auto 0}
@media(max-width:860px){.hyper-quality>.qc-explanation{grid-column:1}.hyper-proof-heading{padding:24px;gap:24px}.hyper-proof-layout{gap:16px;padding:20px;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr)}}
@media(max-width:600px){.hyper-proof-heading{grid-template-columns:1fr;gap:22px}.batch-total{font-size:68px}.qc-intro h3{font-size:23px}.hyper-proof-layout{grid-template-columns:1fr;padding:18px;gap:20px}.qc-focus{max-width:340px;width:100%;margin:auto}.qc-panel-zoom{max-width:255px}.hyper-source-heading{padding:20px 18px 0}.hyper-source-heading h3{font-size:20px}.hyper-source-layout{grid-template-columns:1fr;padding:18px;gap:18px}.source-sheet-stage{max-width:200px;margin:0 auto}.source-sheet-note{text-align:center}.content-column-zoom{width:100%}.qc-english-key{font-size:12px}}

/* Production Hyper interface followed by a concise source-based QC flow. */
.hyper-product{row-gap:32px}
.hyper-product>.hyper-tool-proof{grid-column:1/-1}
.hyper-product>.hyper-source-wrap{grid-column:2}
.qc-highlight,.qc-status-highlight{border-color:#009d68;box-shadow:0 0 0 1px #fff8,0 0 0 3px #009d6824}
.qc-highlight b,.qc-status-highlight b{background:#008b5d}
.qc-status-highlight{left:32%;top:93.4%;width:3.2%;height:2.6%}
.qc-status-detail{display:flex;align-items:center;gap:12px;padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid #dcece4}
.qc-status-zoom{width:90px;flex:none;border-radius:8px}
.qc-status-detail b{display:block;font:11px/1.5 monospace;color:#008255}
.qc-status-detail small{display:block;font-size:10px;line-height:1.5;margin-top:4px;color:#637168}
.qc-logic{grid-column:1/-1;background:#f5f3ef;color:#161d26}
.qc-logic-heading{padding:26px 28px 0}
.qc-logic-heading .proof-eyebrow{color:#FF6200}
.qc-logic-heading h3{font-size:30px;line-height:1.2;letter-spacing:-.025em;margin:8px 0 0}
.qc-logic-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding:28px}
.qc-logic-step{position:relative;padding:20px;background:#fff;border:1px solid #dedbd5;border-radius:10px}
.qc-logic-step:not(:last-child)::after{content:'→';position:absolute;right:-26px;top:50%;transform:translateY(-50%);font-size:23px;color:#FF6200}
.logic-step-no{font:11px/1.5 monospace;color:#FF6200}
.qc-logic h4{font-size:19px;line-height:1.3;letter-spacing:-.02em;margin:10px 0 8px}
.qc-logic p{font-size:14px;line-height:1.6;margin:0;color:#606a73}
.qc-logic-check{border-color:#ff6200;background:#fff8f2}
.qc-logic-branches{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.55fr);gap:20px;padding:0 28px 28px}
.qc-logic-branches>div{padding:20px;border-radius:10px}
.qc-pass-route{background:#e5f4eb;border:1px solid #aad8be}
.qc-pass-route .logic-route-label,.qc-pass-route h4{color:#087649}
.qc-fail-route{background:#fff2e4;border:1px solid #edccaa}
.qc-fail-route .logic-route-label{color:#FF6200}
.logic-route-label{font:11px/1.5 monospace;letter-spacing:.06em}
.qc-logic strong{color:#161d26}
@media(max-width:860px){.hyper-product>.hyper-source-wrap{grid-column:1}.qc-status-detail{gap:8px}.qc-status-zoom{width:74px}.qc-logic-steps{gap:24px;padding:22px}.qc-logic-step{padding:16px}.qc-logic-step:not(:last-child)::after{right:-21px;font-size:19px}}
@media(max-width:600px){.qc-logic-heading{padding:22px 20px 0}.qc-logic-heading h3{font-size:25px}.qc-logic-steps{grid-template-columns:1fr;padding:22px 20px;gap:28px}.qc-logic-step:not(:last-child)::after{content:'↓';top:auto;bottom:-25px;right:auto;left:50%;transform:translateX(-50%)}.qc-logic-branches{grid-template-columns:1fr;padding:0 20px 22px;gap:12px}.qc-logic h4{font-size:18px}.qc-logic p{font-size:13px}.qc-status-zoom{width:90px}}

/* Reuse the MCP product journey cards across Mini App, MUSE and Hyper QC. */
.shared-journey{grid-column:1/-1;min-width:0;margin:28px 0;background:transparent;color:var(--white)}
.shared-journey .journey{grid-template-columns:repeat(var(--journey-columns),minmax(0,1fr))}
.shared-journey .j-step{min-width:0;overflow-wrap:anywhere}
.shared-journey .j-card{min-width:0}
.shared-journey .j-card strong{color:var(--white)}
.shared-journey .j-eyebrow{font-size:10px;line-height:1.5;letter-spacing:.1em;margin:0}
.shared-journey .journey-note{font-size:12px;line-height:1.65;font-weight:400;color:var(--muted);margin:18px 0 0}
.shared-journey .mock-strip-label{font-size:10px;line-height:1.6;margin:0 0 14px;letter-spacing:.11em}
.shared-journey.qc-logic{border:0;border-radius:0;padding:0}
.shared-journey.mini-journey{margin:28px 0 0}
@media(max-width:1180px){.shared-journey .journey{grid-template-columns:1fr;gap:30px}}

.shared-journey .j-eyebrow{color:#7fc35e}.shared-journey .j-step.design .j-eyebrow{color:var(--orange)}
.mini-foundations .evidence-card:not(.wide)>a{display:flex;height:260px;align-items:center;background:#f5f3ef}.mini-foundations .evidence-card:not(.wide)>a>img{width:100%;height:100%;object-fit:contain;background:transparent}

/* Match the original Claude card palette. Source screenshots retain their native colours. */
.evidence-card{background:var(--paper-2);border-color:var(--rule);border-radius:var(--radius)}
.evidence-card figcaption{background:var(--paper-2);border-color:var(--rule);color:var(--muted)}
.evidence-card img,.evidence-card image-slot{background:transparent}
.hyper-tool-proof,.hyper-source-evidence,.campaign-gallery{background:var(--paper-2);color:var(--white)}
.hyper-proof-heading{background:var(--paper-2);border-bottom:1px solid var(--rule)}
.hyper-proof-layout,.hyper-source-heading{color:var(--white)}
.qc-focus{background:var(--paper);border-color:var(--rule);color:var(--white)}
.qc-english-key,.qc-status-detail{border-color:var(--rule)}
.qc-english-key b,.qc-status-detail b{color:#7fc35e}
.qc-focus>p,.qc-status-detail small,.qc-intro p,.batch-unit,.batch-counter-detail>span:last-child,.case-body .source-sheet-note{color:var(--muted)}
.proof-eyebrow,.proof-detail-label,.hyper-source-heading .proof-eyebrow,.hyper-source-heading code,.batch-total{color:var(--orange)}
.hyper-tool-stage,.source-sheet-stage{border-color:var(--rule)}
.campaign-heading span{color:var(--muted)}
.campaign-preview{background:var(--paper);border-color:var(--rule)}
.campaign-preview:hover{background:#1b2028;border-color:var(--orange)}
.campaign-link{color:var(--muted)}
.campaign-link:hover{color:var(--orange)}
.mini-foundations .evidence-card:not(.wide)>a{background:var(--paper-2)}
.phone-evidence-grid{background:var(--paper-2);border-color:var(--rule)}
.mcp-cover,.mini-cover,.localization-art{background:radial-gradient(ellipse at 85% 0%,rgba(255,98,0,.12),transparent 65%),var(--paper-2);color:var(--white)}
.mini-cover>figcaption,.mcp-cover>figcaption{background:linear-gradient(transparent,var(--paper-2) 40%);color:var(--white)}
.mini-cover-screens>div{border-color:var(--rule);box-shadow:0 18px 35px #0005}

/* Four original product views, staged as a layered cover. */
.hyper-product>.hyper-source-wrap{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:24px;align-items:stretch}
.hyper-source-wrap>.evidence-card{margin:0;min-width:0;display:flex;flex-direction:column}
.hyper-source-wrap .hyper-source-layout{flex:1}
.hyper-source-wrap .proof-eyebrow{color:#FF6200}
.hyper-contract-evidence>a{display:block;flex:1}
.hyper-contract-evidence img{display:block;width:100%;height:auto}
.hyper-source-wrap>.evidence-card>figcaption{margin-top:auto;min-height:76px;box-sizing:border-box}
@media(max-width:860px){.hyper-product>.hyper-source-wrap{grid-column:1/-1;grid-template-columns:1fr}.hyper-source-wrap>.evidence-card>figcaption{min-height:0}}
.mcp-cover{background:radial-gradient(ellipse at 18% 80%,rgba(255,98,0,.28),transparent 58%),#101217}
.mcp-cover-stack{position:relative;height:clamp(460px,51vw,740px);margin-top:12px;isolation:isolate}
.mcp-cover-intro{position:absolute;top:3%;left:4.5%;z-index:5;max-width:49%}
.mcp-cover-intro h2{font-size:clamp(26px,3vw,44px);line-height:1.12;letter-spacing:-.035em;margin:0 0 16px;color:var(--white)}
.mcp-cover-intro h2 span{color:var(--orange,#ff6200)}
.mcp-cover-intro p{font-size:clamp(12px,1.2vw,17px);line-height:1.5;color:var(--muted);margin:0}
.mcp-window{position:absolute;width:51%;overflow:hidden;border:1px solid #454a53;border-radius:12px;background:#20242c;box-shadow:-18px 26px 55px #0009;transform:perspective(1600px) rotateY(-9deg) rotateZ(-6deg);transform-origin:top left}
.mcp-window img{display:block;width:100%;height:auto}
.mcp-window-bar{height:26px;display:flex;align-items:center;gap:5px;padding:0 10px;color:#d6dae0;background:linear-gradient(110deg,#292e38,#15181e);font:10px/1.2 monospace}
.mcp-window-bar i{width:5px;height:5px;flex:none;border-radius:50%;background:#69717d}
.mcp-window-bar span{margin-left:8px}
.mcp-window-home{left:4%;top:65%;z-index:1}
.mcp-window-qa{left:20%;top:50%;z-index:2}
.mcp-window-generate{left:38%;top:34%;z-index:3}
.mcp-window-templates{left:56%;top:16%;z-index:4}
.mcp-cover>figcaption{z-index:6;background:linear-gradient(transparent,#15181e 40%);padding-top:34px}
@media(max-width:600px){
 .mcp-cover-stack{height:430px;margin-top:0}
 .mcp-cover-intro{left:6%;top:2%;max-width:90%}
 .mcp-cover-intro h2{font-size:27px}.mcp-cover-intro p{font-size:12px}
 .mcp-window{width:77%;border-radius:7px}
 .mcp-window-bar{height:19px;font-size:8px;gap:3px;padding:0 6px}
 .mcp-window-bar i{width:4px;height:4px}
 .mcp-window-home{left:3%;top:79%}.mcp-window-qa{left:12%;top:65%}
 .mcp-window-generate{left:23%;top:51%}.mcp-window-templates{left:34%;top:37%}
}