/* Animated showcase of the demo pages. */
.hero-reel{min-width:0;position:relative;isolation:isolate;--tilt-x:0deg;--tilt-y:0deg;--reel-hue:0;animation:reel-intro .9s cubic-bezier(.2,.7,.2,1) both}
.reel-heading{display:flex;align-items:center;gap:9px;color:#a9bda5;font-size:.52rem;letter-spacing:.08em;margin-bottom:27px;line-height:1.7}.reel-heading>b{margin-left:auto;white-space:nowrap;font-size:.49rem;font-weight:500;color:#88a180}.reel-live-dot{width:6px;height:6px;background:#dcf09b;border-radius:50%;box-shadow:0 0 0 5px #d9ed9920;flex-shrink:0;animation:reel-dot 3s ease-in-out infinite}
.reel-stage { position:relative; }
.reel-browser {
  overflow:hidden;
  border:1px solid #bcd3ab52;
  border-radius:18px;
  background:#20392f;
  color:#eef4e6;
  box-shadow:0 24px 50px #0b211a55;
}
.reel-browser-bar,.reel-device-row { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px clamp(10px,2.3vw,25px); }
.reel-browser-bar { min-height:43px; border-bottom:1px solid #dcebd51e; font-size:.76rem; }
.reel-browser-bar strong { font-weight:650; }
.reel-label { color:#b8cdb2; font-size:.56rem; letter-spacing:.08em; }
.reel-screen {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  aspect-ratio:1.75;
  touch-action:pan-y;
  background:radial-gradient(ellipse at 76% 0,#57745b,transparent 67%),#344f42;
}
.reel-slide {
  position:absolute;
  inset:0;
  display:grid;
  grid-template-columns:minmax(0,3fr) minmax(0,1fr);
  gap:clamp(8px,2vw,24px);
  align-items:center;
  padding:clamp(8px,2vw,24px);
  opacity:0;
  transform:translateX(18px);
  pointer-events:none;
  transition:opacity .38s ease,transform .52s cubic-bezier(.22,.7,.2,1);
}
.reel-slide.is-leaving { transform:translateX(-18px); }
.reel-slide.is-active { opacity:1; transform:none; pointer-events:auto; z-index:1; }
.reel-slide:focus-visible { outline:3px solid #dff0a9; outline-offset:-4px; }
.reel-desktop,.reel-phone { min-width:0; display:block; overflow:hidden; box-shadow:0 12px 26px #071b1480; }
.reel-desktop { border-radius:clamp(5px,1vw,12px); background:#f6f4ec; }
.reel-window-dots { display:flex; gap:3px; padding:clamp(3px,.6vw,7px) clamp(5px,.8vw,10px); border-bottom:1px solid #dadfd3; }
.reel-window-dots i { width:clamp(3px,.38vw,5px); aspect-ratio:1; border-radius:50%; background:#8da187; }
.reel-slide img { display:block; width:100%; height:auto; }
.reel-phone {
  position:relative;
  padding:clamp(3px,.5vw,7px);
  border-radius:clamp(8px,1.45vw,18px);
  background:#182720;
  border:1px solid #8b9f84;
}
.reel-phone img { border-radius:clamp(4px,1vw,12px); }
.reel-device-row { min-height:56px; border-top:1px solid #dcebd51e; }
.reel-device-labels { display:flex; flex-wrap:wrap; align-items:center; gap:3px 10px; color:#c3d5be; font-size:.61rem; }
.reel-device-labels span + span::before { content:"·"; padding-right:10px; }
.reel-open-cue { display:inline-flex; min-height:36px; align-items:center; gap:10px; padding:6px 12px; white-space:nowrap; border-radius:7px; background:#dff0a9; color:#273e2f; font-size:.69rem; font-weight:700; }
.reel-open-cue:hover { background:#effacb; }
.reel-open-cue:focus-visible { outline:2px solid #f4f9ea; outline-offset:3px; }
.reel-progress-track{height:3px;background:#d8e0c8;overflow:hidden}.reel-progress-track>span{height:100%;width:100%;display:block;background:#98b85f;transform:scaleX(0);transform-origin:left}
.reel-caption{display:flex;align-items:center;gap:15px;margin-top:26px;min-height:65px}.reel-index{display:flex;align-items:baseline;gap:6px;white-space:nowrap}.reel-index>span{font-size:2.1rem;font-weight:350;letter-spacing:-.07em;color:#e0efa9;font-variant-numeric:tabular-nums}.reel-index>small{font-size:.62rem;color:#7f9a7f;letter-spacing:.04em}.reel-project-copy{min-width:0;flex:1;border-left:1px solid #6c87633d;padding-left:15px}.reel-project-copy>small{font-size:.53rem;letter-spacing:.06em;color:#8eaa89}.reel-project-copy h2{font-size:1.03rem!important;font-weight:500;line-height:1.4;letter-spacing:-.02em;margin:5px 0 0;color:#e6efdb}
.reel-controls{display:flex;align-items:center;gap:5px}.reel-controls button{width:34px;height:34px;border:1px solid #8ca47855;border-radius:50%;background:transparent;color:#c7d9b4;cursor:pointer;display:grid;place-items:center;padding:0;font:inherit;font-size:.9rem;transition:background .2s,color .2s,border-color .2s}.reel-controls button:hover{background:#d5e9a7;color:#29412d;border-color:#d5e9a7}.reel-controls [data-reel-toggle]{font-size:.68rem}.reel-controls [data-reel-toggle][aria-pressed=true]{background:#3a5540}
.reel-picker{display:grid;grid-template-columns:repeat(var(--reel-count),1fr);gap:5px;margin-top:14px}.reel-picker button{min-width:0;height:24px;background:none;border:0;padding:8px 0;cursor:pointer}.reel-picker button>span{display:block;height:3px;background:#6b846550;border-radius:3px;transition:background .3s,transform .3s}.reel-picker button:hover>span{background:#b0c48d}.reel-picker button[aria-pressed=true]>span{background:#d9eda6;transform:scaleY(1.6)}
.reel-hint{display:flex;justify-content:space-between;align-items:center;gap:15px;border-top:1px solid #9ab98a22;padding-top:15px;margin:10px 0 0;font-size:.54rem;color:#718e75;line-height:1.7}.reel-hint a{font-size:.62rem;color:#b2c794;white-space:nowrap}.reel-status.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* Small, purposeful motion across the main page. */
.guided-hero-copy>*{animation:reel-copy-in .7s cubic-bezier(.2,.65,.2,1) both}.guided-hero-copy>h1{animation-delay:.08s}.guided-hero-copy>.guided-lead{animation-delay:.16s}.guided-hero-copy>.guided-hero-actions{animation-delay:.24s}.guided-hero-copy>.guided-hero-facts{animation-delay:.32s}
.guided-audience{transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s,border-color .3s}.guided-audience:after{content:'';position:absolute;width:110px;height:110px;right:-45px;bottom:-65px;background:currentColor;border-radius:50%;opacity:.035;transition:transform .45s ease}.guided-audience:hover:after{transform:scale(2.5)}
.guided-goal .guided-goal-icon{transition:transform .3s,background .3s}.guided-goal:hover .guided-goal-icon{transform:translateY(-2px) rotate(-5deg);background:#dde9c9}.guided-goal[aria-pressed=true] .guided-goal-icon{background:#d8e6bc;transform:scale(1.05)}.guided-goal-arrow{transition:transform .25s}.guided-goal:hover .guided-goal-arrow{transform:translateX(4px)}
.guided-hero-actions .button>span{display:inline-block;transition:transform .25s}.guided-hero-actions .button:hover>span{transform:translateY(3px)}.guided-progress>i{transition:background .5s}.guided-progress:has([data-progress-step="3"][aria-current])>i{background:#97ae79}.guided-quality-grid article{transition:border-color .3s,transform .6s,opacity .6s}.guided-quality-grid article:hover{border-color:#90a575}.guided-quality-grid article>span{display:inline-block;transition:transform .3s,color .3s}.guided-quality-grid article:hover>span{transform:translateX(4px);color:#6c8653}
.guided-motion-item{will-change:auto}.guided-project-grid .project-card{animation:none}
@keyframes reel-intro{from{opacity:0;transform:translateY(22px) rotate(2deg)}to{opacity:1;transform:translateY(0) rotate(0)}}@keyframes reel-copy-in{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:translateY(0)}}@keyframes reel-dot{50%{box-shadow:0 0 0 8px #d9ed9909}}
@media(min-width:1100px){.guided-hero-grid{grid-template-columns:1fr 1.02fr;gap:65px;padding-block:85px}.guided-hero h1{font-size:clamp(3.1rem,4.5vw,5.2rem)}}
@media(max-width:1050px){.reel-heading{font-size:.45rem;gap:7px}.reel-heading>b{display:none}.reel-caption{gap:10px}.reel-project-copy{padding-left:10px}.reel-project-copy h2{font-size:.85rem!important}.reel-controls button{width:30px;height:30px}.reel-controls{gap:3px}.reel-index>span{font-size:1.8rem}.reel-hint>span{display:none}.reel-hint{justify-content:flex-end}}
@media(max-width:760px){.hero-reel{width:100%;max-width:560px;justify-self:center;margin-top:0}.reel-heading{font-size:.52rem;margin-bottom:22px}.reel-heading>b{display:block;font-size:.46rem}.reel-project-copy h2{font-size:1rem!important}.reel-controls button{width:40px;height:40px}.reel-caption{margin-top:18px;gap:13px}.reel-hint{justify-content:space-between}.reel-hint>span{display:block}.reel-picker{gap:6px}.reel-picker button{height:30px}.guided-hero-grid{gap:45px}}
@media(max-width:480px){.guided-hero-grid{gap:40px;padding-bottom:40px}.hero-reel{padding:0 3px;margin-top:0}.reel-heading{font-size:.44rem;letter-spacing:.03em;margin-bottom:18px}.reel-heading>b{display:none}.reel-project-copy h2{font-size:.82rem!important}.reel-project-copy>small{font-size:.46rem}.reel-index>span{font-size:1.7rem}.reel-controls button{width:34px;height:34px}.reel-caption{gap:9px;min-height:55px;margin-top:15px}.reel-hint{margin-top:4px;padding-top:10px}.reel-hint>span{display:none}.reel-hint a{font-size:.58rem}.reel-hint{justify-content:flex-end}.reel-picker{margin-top:7px}}
@media(prefers-reduced-motion:reduce){.hero-reel,.guided-hero-copy>*,.reel-live-dot{animation:none}.reel-slide,.reel-slide img,.reel-caption *,.reel-browser,.guided-audience,.guided-audience:after,.guided-goal .guided-goal-icon,.guided-goal-arrow,.reel-open-cue,.reel-picker button>span,.guided-quality-grid article,.guided-quality-grid article>span{transition:none}.reel-slide{transform:none!important}.reel-slide.is-active img,.reel-slide:hover img{transform:none}.guided-audience:hover:after{transform:none}.reel-browser{transform:none}}

/* Final restraint: the showcase is the only continuously changing focal point. */
.reel-live-dot{animation:none;box-shadow:0 0 0 4px #d9ed9917}
.reel-browser{transform:none;transition:none}
.header{transition:box-shadow .22s ease,border-color .22s ease}
.header.has-scrolled{box-shadow:0 5px 22px #1f35290a;border-bottom-color:#cfd8c5}
.desktop-nav a{position:relative;padding-block:8px}
.desktop-nav a:after{content:'';height:1px;position:absolute;left:0;right:0;bottom:1px;background:#688451;transform:scaleX(0);transform-origin:left;transition:transform .2s ease}
.desktop-nav a:hover:after,.desktop-nav a.section-current:after{transform:scaleX(1)}
.desktop-nav a.section-current{color:#52713c}
.mobile-nav a.section-current{background:#eaf0df;color:#3e612d}
.faq-list details{overflow-anchor:none}
.faq-list summary{transition:color .18s ease}
.faq-list details[open] summary{color:#5a7845}
@media(prefers-reduced-motion:reduce){.header,.desktop-nav a:after,.faq-list summary{transition:none}}

@media (max-width:480px) {
  .guided-hero-grid { gap:32px; }
  .reel-heading { gap:6px; letter-spacing:0; }
  .reel-browser { border-radius:12px; }
  .reel-browser-bar { min-height:35px; font-size:.65rem; }
  .reel-device-row { min-height:49px; padding-block:6px; }
  .reel-device-labels,.reel-open-cue { font-size:.58rem; }
}