/* ==========================================================================
   Michael Astraquillo — Portfolio
   Tokens
   ========================================================================== */
:root{
  --ink:#101d30;
  --ink-2:#182a44;
  --ink-3:#0c1626;
  --cream:#f7f3ea;
  --paper:#fbf9f4;
  --white:#ffffff;
  --gray-700:#4b5563;
  --gray-500:#7c8695;
  --gray-300:#d7dce2;
  --gold:#b5894f;
  --gold-light:#e8c082;
  --gold-soft:rgba(181,137,79,.14);
  --line-light:rgba(16,29,48,.13);
  --line-dark:rgba(247,243,234,.16);

  --font-display:'Fraunces', Georgia, serif;
  --font-body:'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono:'IBM Plex Mono', monospace;

  --max:1180px;
  --pad:clamp(1.25rem, 4vw, 3rem);
  --radius:10px;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--cream);
  -webkit-font-smoothing:antialiased;
  line-height:1.5;
}
img,svg{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
h1,h2,h3,h4{margin:0;font-family:var(--font-display);font-weight:500;}
p{margin:0;}

.skip-link{
  position:absolute; left:-999px; top:0; background:var(--ink); color:var(--cream);
  padding:.75rem 1.25rem; z-index:200;
}
.skip-link:focus{left:1rem; top:1rem;}

:focus-visible{outline:2px solid var(--gold); outline-offset:3px;}

.section-inner{max-width:var(--max); margin:0 auto; padding:0 var(--pad);}

.eyebrow{
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--gold);
  margin:0 0 .9rem;
}
.eyebrow .dot{color:var(--gray-500); margin:0 .35em;}
.eyebrow-light{color:var(--gold-light);}

.section-title{
  font-size:clamp(1.7rem, 3vw, 2.4rem);
  font-weight:500;
  letter-spacing:-.01em;
  margin-bottom:2.5rem;
  max-width:36ch;
}

.chip-row{display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.6rem;}
.chip-row li{
  font-family:var(--font-mono);
  font-size:.75rem;
  letter-spacing:.02em;
  border:1px solid var(--line-light);
  border-radius:999px;
  padding:.5rem 1rem;
  color:var(--gray-700);
  background:var(--white);
}
.chip-row-light li{
  border-color:var(--line-dark);
  color:var(--cream);
  background:rgba(247,243,234,.05);
}

/* Buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.4em;
  font-family:var(--font-body); font-weight:600; font-size:.92rem;
  padding:.85rem 1.6rem; border-radius:6px;
  border:1px solid transparent;
  transition:transform .18s ease, background-color .18s ease, border-color .18s ease, color .18s ease;
  cursor:pointer;
}
.btn-primary{background:var(--ink); color:var(--cream);}
.btn-primary:hover{transform:translateY(-2px); background:var(--ink-2);}
.btn-ghost{border-color:var(--line-light); color:var(--ink); background:transparent;}
.btn-ghost:hover{border-color:var(--ink); transform:translateY(-2px);}
.btn-text{padding:.85rem .2rem; font-weight:600; color:var(--ink); position:relative;}
.btn-text::after{content:""; position:absolute; left:0; right:100%; bottom:.6rem; height:1px; background:var(--gold); transition:right .25s ease;}
.btn-text:hover::after{right:0;}
.btn-small{padding:.55rem 1.1rem; font-size:.8rem;}

/* ==========================================================================
   Header / Nav
   ========================================================================== */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(247,243,234,.88);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line-light);
}
.header-inner{
  max-width:var(--max); margin:0 auto; padding:0 var(--pad);
  display:flex; align-items:center; justify-content:space-between;
  height:72px;
}
.brand{
  font-family:var(--font-mono); font-size:.85rem; letter-spacing:.1em;
  font-weight:500;
}
.primary-nav{display:flex; align-items:center; gap:2rem;}
.primary-nav a:not(.btn){
  font-size:.88rem; font-weight:500; color:var(--gray-700);
  position:relative; padding:.3rem 0;
}
.primary-nav a:not(.btn)::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:1px;
  background:var(--gold); transition:right .22s ease;
}
.primary-nav a:not(.btn):hover{color:var(--ink);}
.primary-nav a:not(.btn):hover::after{right:0;}

.menu-toggle{
  display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:.5rem;
}
.menu-toggle span{width:22px; height:2px; background:var(--ink); display:block; transition:transform .2s ease, opacity .2s ease;}
.mobile-nav{
  display:none; flex-direction:column; background:var(--cream);
  border-bottom:1px solid var(--line-light);
  padding:1rem var(--pad) 1.5rem;
}
.mobile-nav a{padding:.75rem 0; font-size:1rem; border-bottom:1px solid var(--line-light);}
.mobile-nav a:last-child{border-bottom:0; margin-top:.5rem;}

body.nav-open .mobile-nav{display:flex;}
body.nav-open .menu-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg);}
body.nav-open .menu-toggle span:nth-child(2){opacity:0;}
body.nav-open .menu-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{
  background:var(--ink);
  color:var(--cream);
  position:relative;
  overflow:hidden;
  background-image:
    radial-gradient(circle at 85% 15%, rgba(181,137,79,.14), transparent 45%),
    linear-gradient(180deg, var(--ink), var(--ink-3));
}
.hero-inner{
  max-width:var(--max); margin:0 auto; padding:clamp(3.5rem,8vw,6.5rem) var(--pad) clamp(4rem,8vw,6rem);
  display:grid; grid-template-columns:1.3fr 1fr; gap:3rem; align-items:center;
}
.hero-headline{
  font-size:clamp(2.1rem, 4.6vw, 3.4rem);
  line-height:1.12; letter-spacing:-.015em;
  margin:0 0 1.5rem;
  max-width:16ch;
}
.hero-sub{
  color:rgba(247,243,234,.72);
  font-size:1.05rem; line-height:1.65;
  max-width:46ch; margin-bottom:2.2rem;
}
.hero-ctas{display:flex; flex-wrap:wrap; align-items:center; gap:1rem;}
.hero .btn-primary{background:var(--gold-light); color:var(--ink);}
.hero .btn-primary:hover{background:#f0d09b;}
.hero .btn-ghost{border-color:var(--line-dark); color:var(--cream);}
.hero .btn-ghost:hover{border-color:var(--gold-light);}
.hero .btn-text{color:var(--cream);}
.hero .btn-text::after{background:var(--gold-light);}

.hero-graphic{display:flex; justify-content:center;}
.hero-portrait-wrap{position:relative; width:100%; max-width:360px; aspect-ratio:1/1; margin:0 auto;}
.workflow-svg{position:absolute; inset:0; width:100%; height:100%;}
.wf-ring{fill:none; stroke:var(--line-dark); stroke-width:1;}
.wf-lines line{stroke:rgba(247,243,234,.28); stroke-width:1;}
.wf-nodes circle{fill:var(--cream); opacity:.85;}
.wf-node-gold{fill:var(--gold-light); opacity:1;}

.hero-portrait{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:54%; aspect-ratio:1/1;
  border-radius:50%; overflow:hidden;
  border:2px solid var(--gold-light);
  box-shadow:0 0 0 8px rgba(16,29,48,.4), 0 30px 60px -20px rgba(0,0,0,.55);
}
.hero-portrait img{width:100%; height:100%; object-fit:cover; display:block;}

@media (prefers-reduced-motion:no-preference){
  .wf-node-gold{animation:pulseGold 3.2s ease-in-out infinite;}
}
@keyframes pulseGold{
  0%,100%{opacity:1; r:7;}
  50%{opacity:.55; r:10;}
}

/* Snapshot strip */
.snapshot{
  background:var(--paper);
  color:var(--ink);
  margin:0 var(--pad);
  border-radius:var(--radius);
  border:1px solid var(--line-light);
  box-shadow:0 24px 60px -30px rgba(16,29,48,.35);
  transform:translateY(38px);
  position:relative;
  z-index:2;
}
.snapshot-inner{
  max-width:calc(var(--max) - var(--pad) * 2); margin:0 auto;
  display:grid; grid-template-columns:repeat(4,1fr);
}
.snap-item{
  padding:1.8rem 1.6rem;
  border-right:1px solid var(--line-light);
}
.snap-item:last-child{border-right:0;}
.snap-num{
  font-family:var(--font-display); font-size:2.1rem; margin:0 0 .3rem; color:var(--ink);
}
.snap-num-text{
  font-family:var(--font-display); font-size:1.5rem; margin:0 0 .3rem; color:var(--ink);
}
.snap-label{font-size:.85rem; color:var(--gray-700); font-weight:600; line-height:1.4;}
.snap-label span{display:block; font-weight:400; color:var(--gray-500); font-size:.78rem; margin-top:.2rem;}

/* ==========================================================================
   Sections generic
   ========================================================================== */
.section{padding:clamp(5.5rem,10vw,8rem) 0 clamp(3.5rem,7vw,5rem);}
.about{padding-top:clamp(7.5rem,12vw,10rem);}

/* About */
.about-grid{display:grid; grid-template-columns:.85fr 1.15fr; gap:3.5rem; align-items:start;}
.about-statement{
  font-family:var(--font-display); font-style:italic; font-size:clamp(1.4rem,2.4vw,1.9rem);
  line-height:1.35; color:var(--ink);
}
.about-body p{color:var(--gray-700); font-size:1.02rem; line-height:1.75; margin-bottom:1.1rem; max-width:56ch;}

/* Capabilities */
.cap-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-light); border:1px solid var(--line-light);}
.cap-card{background:var(--paper); padding:2.1rem 1.8rem; transition:background-color .2s ease;}
.cap-card:hover{background:var(--white);}
.cap-line{display:block; width:28px; height:2px; background:var(--gold); margin-bottom:1.1rem;}
.cap-card h3{font-size:1.08rem; margin-bottom:.6rem; letter-spacing:-.005em;}
.cap-card p{color:var(--gray-700); font-size:.92rem; line-height:1.6;}

/* ==========================================================================
   Automation product demo
   ========================================================================== */
.automation{background:var(--paper); border-top:1px solid var(--line-light);}
.automation-intro{display:grid; grid-template-columns:1.1fr .9fr; gap:4rem; align-items:start; margin-bottom:3rem;}
.automation-headline{font-size:clamp(2rem,4.2vw,3.6rem); line-height:1.08; letter-spacing:-.025em; max-width:17ch;}
.automation-intro p{color:var(--gray-700); font-size:1.02rem; line-height:1.75; margin-bottom:1rem;}
.efficiency-grid{display:grid; grid-template-columns:1fr auto 1fr; gap:1.25rem; align-items:center;}
.efficiency-card{border:1px solid var(--line-light); border-radius:var(--radius); padding:2rem; background:var(--white);}
.efficiency-after{background:var(--ink); color:var(--cream); border-color:var(--ink);}
.efficiency-label{font-family:var(--font-mono); font-size:.72rem; letter-spacing:.11em; text-transform:uppercase; color:var(--gold); margin-bottom:1.2rem;}
.efficiency-after .efficiency-label{color:var(--gold-light);}
.efficiency-card ol{list-style:none; margin:0; padding:0; counter-reset:steps; display:grid; gap:.75rem;}
.efficiency-card li{counter-increment:steps; display:flex; gap:.8rem; font-size:.94rem; color:var(--gray-700);}
.efficiency-card li::before{content:counter(steps, decimal-leading-zero); font-family:var(--font-mono); font-size:.7rem; color:var(--gold); padding-top:.15rem;}
.efficiency-after li{color:rgba(247,243,234,.82);}
.efficiency-arrow{font-size:2rem; color:var(--gold);}
.outcome-strip{display:grid; grid-template-columns:repeat(4,1fr); margin:1.25rem 0 5rem; border:1px solid var(--line-light); border-radius:var(--radius); overflow:hidden; background:var(--cream);}
.outcome-strip div{padding:1.4rem; border-right:1px solid var(--line-light);}
.outcome-strip div:last-child{border-right:0;}
.outcome-strip strong{display:block; font-family:var(--font-display); font-size:1.3rem; font-weight:500;}
.outcome-strip span{display:block; color:var(--gray-500); font-size:.78rem; margin-top:.2rem;}
.demo-grid{display:grid; grid-template-columns:.78fr 1.22fr; gap:3.5rem; align-items:start;}
.demo-copy{position:sticky; top:110px;}
.demo-copy h3{font-size:clamp(1.7rem,3vw,2.35rem); margin-bottom:1rem;}
.demo-copy>p{color:var(--gray-700); line-height:1.75;}
.demo-boundary{margin-top:1.75rem; padding:1.25rem; border-left:3px solid var(--gold); background:var(--gold-soft);}
.demo-boundary strong{font-size:.9rem;}
.demo-boundary p{color:var(--gray-700); font-size:.88rem; line-height:1.6; margin-top:.3rem;}
.intake-form{background:var(--white); border:1px solid var(--line-light); border-radius:12px; padding:clamp(1.4rem,4vw,2.4rem); box-shadow:0 20px 50px -40px rgba(16,29,48,.55);}
.form-heading{margin-bottom:1.5rem;}
.form-heading h3{font-size:1.4rem; margin-bottom:.25rem;}
.form-heading p{font-size:.82rem; color:var(--gray-500);}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:1rem;}
.intake-form label{display:block; font-size:.82rem; font-weight:600; color:var(--ink); margin-bottom:1rem;}
.intake-form input,.intake-form select,.intake-form textarea{width:100%; display:block; margin-top:.4rem; padding:.8rem .85rem; border:1px solid var(--gray-300); border-radius:6px; background:var(--paper); color:var(--ink); font:inherit; font-size:.92rem;}
.intake-form textarea{resize:vertical; min-height:130px;}
.intake-form input:focus,.intake-form select:focus,.intake-form textarea:focus{border-color:var(--gold); outline:2px solid var(--gold-soft);}
.intake-form .consent{display:flex; gap:.65rem; align-items:flex-start; font-weight:500; line-height:1.5;}
.intake-form .consent input{width:auto; flex:0 0 auto; margin:.2rem 0 0;}
.honeypot{position:absolute !important; left:-9999px !important; width:1px !important; height:1px !important; overflow:hidden !important;}
.form-warning{font-size:.78rem; color:var(--gray-700); line-height:1.55; border-top:1px solid var(--line-light); padding-top:1rem; margin-bottom:1.2rem;}
.form-status{min-height:1.4rem; margin-top:1rem; font-size:.88rem; font-weight:600;}
.form-status.is-success{color:#247447;}
.form-status.is-error{color:#a23b32;}
.intake-form button[disabled]{opacity:.6; cursor:wait;}
.product-roadmap{margin-top:4rem; padding-top:1.5rem; border-top:1px solid var(--line-light); color:var(--gray-700); line-height:1.7;}
.product-roadmap strong{color:var(--ink);}

/* ==========================================================================
   Case Study
   ========================================================================== */
.case-study{
  background:var(--ink); color:var(--cream);
  background-image:radial-gradient(circle at 10% 0%, rgba(181,137,79,.10), transparent 45%);
}
.case-title{color:var(--cream); max-width:none;}
.case-title span{display:block; font-family:var(--font-body); font-weight:400; font-size:1.02rem; color:rgba(247,243,234,.6); margin-top:.6rem; letter-spacing:0;}

.case-meta{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--line-dark); border:1px solid var(--line-dark);
  margin:2.5rem 0 3.5rem;
}
.case-meta div{background:var(--ink-2); padding:1.3rem 1.5rem;}
.case-meta span{display:block; font-family:var(--font-mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-light); margin-bottom:.4rem;}

.case-block{max-width:70ch; margin-bottom:3.2rem;}
.case-heading{font-size:1.3rem; margin-bottom:1rem;}
.case-block p{color:rgba(247,243,234,.82); line-height:1.75; margin-bottom:.9rem;}
.case-lead{color:rgba(247,243,234,.9) !important; font-weight:500;}
.case-note{font-size:.9rem; color:rgba(247,243,234,.58) !important; font-style:italic; border-left:2px solid var(--gold); padding-left:1rem;}
.case-note.center{text-align:center; border-left:0; padding-left:0; margin-top:1.5rem;}
.case-label{
  font-family:var(--font-mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--gold-light) !important; margin:1.6rem 0 .6rem;
}

/* Before / after */
.ba-block{max-width:none; margin-bottom:4rem;}
.ba-row{display:grid; grid-template-columns:1fr auto 1fr; gap:1.5rem; align-items:start; margin:2rem 0 1rem;}
.browser-mock{
  display:block; border-radius:8px; overflow:hidden; border:1px solid var(--line-dark);
  background:var(--ink-2); box-shadow:0 20px 45px -24px rgba(0,0,0,.55);
}
.browser-body{aspect-ratio:2/1; overflow:hidden; background:var(--ink-3);}
.browser-body img{width:100%; height:100%; object-fit:cover; object-position:top; display:block;}
.ba-label{font-family:var(--font-mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.1em; color:var(--gold-light); padding:.9rem 1rem 0;}
.ba-arrow{color:var(--gold); display:flex; justify-content:center; padding-top:2.4rem;}
.ba-cta{display:flex; justify-content:center; margin-top:1.8rem;}
.case-study .btn-primary{background:var(--gold-light); color:var(--ink);}
.case-study .btn-primary:hover{background:#f0d09b;}

/* Process row */
.process-row{display:grid; grid-template-columns:repeat(5,1fr); gap:1.4rem; max-width:none; margin-top:1.5rem;}
.process-step{border-top:2px solid var(--gold); padding-top:1rem;}
.process-num{font-family:var(--font-mono); font-size:.75rem; color:var(--gold-light);}
.process-step h4{font-size:1.05rem; margin:.5rem 0 .5rem; font-family:var(--font-display); font-weight:500;}
.process-step p{font-size:.85rem; color:rgba(247,243,234,.65);}

/* Flow list */
.flow-list{display:flex; flex-direction:column; gap:0; margin-top:1rem; border-top:1px solid var(--line-dark);}
.flow-list li{
  display:flex; align-items:baseline; gap:1rem; padding:.9rem 0; border-bottom:1px solid var(--line-dark);
  color:rgba(247,243,234,.85); font-size:.98rem;
}
.flow-list span{font-family:var(--font-mono); font-size:.78rem; color:var(--gold-light); width:1.6rem; flex-shrink:0;}

/* Pull quotes */
.pull-quote{
  font-family:var(--font-display); font-style:italic; font-size:clamp(1.15rem,2vw,1.5rem);
  color:var(--gold-light); border-left:2px solid var(--gold);
  padding:.2rem 0 .2rem 1.4rem; margin:1.3rem 0; line-height:1.4;
}

/* Callout */
.callout{
  background:rgba(181,137,79,.09); border:1px solid rgba(181,137,79,.3);
  border-radius:8px; padding:1.3rem 1.5rem; margin-top:1rem;
}
.callout p{color:rgba(247,243,234,.88); margin:0; font-size:.95rem;}

/* ==========================================================================
   Experience timeline
   ========================================================================== */
.timeline{border-top:1px solid var(--line-light); margin-top:1rem;}
.tl-item{display:grid; grid-template-columns:16px 1fr; gap:1.5rem; padding:2rem 0; border-bottom:1px solid var(--line-light); position:relative;}
.tl-marker{width:10px; height:10px; border-radius:50%; background:var(--gold); margin-top:.4rem;}
.tl-dates{font-family:var(--font-mono); font-size:.75rem; letter-spacing:.08em; color:var(--gray-500); margin-bottom:.4rem;}
.tl-content h3{font-size:1.2rem; margin-bottom:.3rem;}
.tl-org{color:var(--gray-700); font-size:.92rem; margin-bottom:1rem;}
.tl-desc{color:var(--gray-700); font-size:.93rem; line-height:1.65; max-width:60ch; margin-top:.4rem;}
.tl-featured{background:var(--paper); margin:0 -1.5rem; padding:2rem 1.5rem; border-radius:8px; border-bottom:1px solid var(--line-light);}
.tl-list{display:grid; grid-template-columns:repeat(2,1fr); gap:.5rem 1.5rem;}
.tl-list li{font-size:.9rem; color:var(--gray-700); position:relative; padding-left:1rem;}
.tl-list li::before{content:"—"; position:absolute; left:0; color:var(--gold);}
.tl-earlier-list{display:grid; gap:.5rem;}
.tl-earlier-list li{font-size:.92rem; color:var(--gray-700);}
.tl-earlier-list strong{color:var(--ink); font-weight:600;}

.collections-panel{margin-top:3rem; padding-top:2.5rem; border-top:1px solid var(--line-light); max-width:70ch;}
.collections-panel h3{font-size:1.15rem; margin-bottom:.9rem;}
.collections-panel p{color:var(--gray-700); line-height:1.75;}

/* ==========================================================================
   Skills & Tools
   ========================================================================== */
.tool-groups{display:grid; grid-template-columns:repeat(4,1fr); gap:1.6rem; margin-top:1rem;}
.tool-group{border:1px solid var(--line-light); border-radius:8px; padding:1.6rem 1.5rem; background:var(--paper);}
.tool-group h3{font-size:.95rem; margin-bottom:1rem; letter-spacing:-.005em;}
.tool-group ul{display:flex; flex-direction:column; gap:.5rem;}
.tool-group li{font-size:.92rem; color:var(--gray-700); padding-bottom:.5rem; border-bottom:1px solid var(--line-light);}
.tool-group li:last-child{border-bottom:0; padding-bottom:0;}

/* ==========================================================================
   Contact
   ========================================================================== */
.contact{background:var(--ink); color:var(--cream);}
.contact-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:3rem; align-items:end;}
.contact-headline{font-size:clamp(2rem,4vw,3rem); line-height:1.12; margin:0 0 .5rem;}
.contact-card{background:var(--ink-2); border:1px solid var(--line-dark); border-radius:10px; padding:2.2rem;}
.contact-name{font-family:var(--font-display); font-size:1.3rem; margin-bottom:.3rem;}
.contact-loc{color:rgba(247,243,234,.55); font-size:.9rem; margin-bottom:1.3rem;}
.contact-link{display:block; font-size:1rem; padding:.6rem 0; border-top:1px solid var(--line-dark);}
.contact-link:hover{color:var(--gold-light);}
.contact-ctas{display:flex; gap:1rem; margin-top:1.6rem; flex-wrap:wrap;}
.contact .btn-primary{background:var(--gold-light); color:var(--ink);}
.contact .btn-ghost{border-color:var(--line-dark); color:var(--cream);}

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer{background:var(--ink-3); color:rgba(247,243,234,.55);}
.footer-inner{display:flex; justify-content:space-between; align-items:center; padding:2.2rem var(--pad); flex-wrap:wrap; gap:1rem;}
.footer-inner p{font-size:.85rem; line-height:1.5;}
.footer-inner span{color:rgba(247,243,234,.4);}
.footer-note{font-style:italic; color:rgba(247,243,234,.4);}

/* ==========================================================================
   Reveal-on-scroll
   ========================================================================== */
.reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in-view{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1; transform:none; transition:none;}
  html{scroll-behavior:auto;}
  .wf-node-gold{animation:none;}
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:1024px){
  .cap-grid{grid-template-columns:repeat(2,1fr);}
  .process-row{grid-template-columns:repeat(3,1fr);}
  .tool-groups{grid-template-columns:repeat(2,1fr);}
  .snapshot-inner{grid-template-columns:repeat(2,1fr);}
  .snap-item:nth-child(2n){border-right:0;}
  .outcome-strip{grid-template-columns:repeat(2,1fr);}
  .outcome-strip div:nth-child(2){border-right:0;}
  .outcome-strip div:nth-child(-n+2){border-bottom:1px solid var(--line-light);}
}

@media (max-width:860px){
  .primary-nav{display:none;}
  .menu-toggle{display:flex;}
  .hero-inner{grid-template-columns:1fr; text-align:left;}
  .hero-graphic{order:-1; max-width:220px; margin:0 auto 1rem;}
  .about-grid{grid-template-columns:1fr; gap:2rem;}
  .automation-intro,.demo-grid{grid-template-columns:1fr; gap:2rem;}
  .demo-copy{position:static;}
  .case-meta{grid-template-columns:1fr;}
  .ba-row{grid-template-columns:1fr; gap:1rem;}
  .ba-arrow{transform:rotate(90deg); margin:0 auto; padding-top:0;}
  .process-row{grid-template-columns:1fr 1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .tl-list{grid-template-columns:1fr;}
}

@media (max-width:640px){
  .cap-grid{grid-template-columns:1fr;}
  .tool-groups{grid-template-columns:1fr;}
  .process-row{grid-template-columns:1fr;}
  .snapshot-inner{grid-template-columns:1fr;}
  .snap-item{border-right:0 !important; border-bottom:1px solid var(--line-light);}
  .snap-item:last-child{border-bottom:0;}
  .snapshot{margin:0 1rem; transform:translateY(24px);}
  .hero-inner{padding-bottom:3rem;}
  .tl-featured{margin:0; padding:1.5rem 0;}
  .efficiency-grid{grid-template-columns:1fr;}
  .efficiency-arrow{transform:rotate(90deg); text-align:center;}
  .outcome-strip{grid-template-columns:1fr;}
  .outcome-strip div{border-right:0 !important; border-bottom:1px solid var(--line-light);}
  .outcome-strip div:last-child{border-bottom:0;}
  .form-row{grid-template-columns:1fr; gap:0;}
}