/* Hallmark · pre-emit critique: P5 H5 E5 S5 R5 V5 */
/* Hallmark · genre: modern-minimal · macrostructure: filterable catalogue + Workbench detail · theme: custom cool-blue · enrichment: product imagery when supplied · nav: N1b · footer: Ft3 index columns · contrast: pass (40–41) · slop: pass (42–45) · honest: pass (46) · chrome: pass (47) · tokens: pass (48) · responsive: pass (34, 49–57) */
@import url("/features/styles/tokens.css");
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=IBM+Plex+Sans:wght@400;500;600&family=Manrope:wght@600;700;800&display=swap");

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;overflow-x:clip}
html{scroll-behavior:smooth}
body{background:var(--color-paper);color:var(--color-ink-soft);font:400 var(--text-base)/1.62 var(--font-body);text-rendering:optimizeLegibility}
body.menu-open{overflow:clip}
a{color:inherit;text-decoration:none}
button{font:inherit}
img{display:block;max-width:100%}
h1,h2,h3,p{margin:0}
h1,h2,h3{color:var(--color-ink);font-family:var(--font-display);font-style:normal;overflow-wrap:anywhere;min-width:0}
h1{font-size:var(--text-display);font-weight:800;letter-spacing:-.055em;line-height:.96}
h2{font-size:clamp(2.25rem,5vw,4rem);font-weight:700;letter-spacing:-.045em;line-height:1}
h3{font-size:var(--text-lg);font-weight:700;letter-spacing:-.025em;line-height:1.1}
:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}
.skip-link{position:fixed;inset-block-start:var(--space-sm);inset-inline-start:var(--space-sm);z-index:var(--z-modal);padding:var(--space-sm) var(--space-md);background:var(--color-dark);color:var(--color-dark-ink);transform:translateY(-160%);transition:transform var(--dur-short) var(--ease-out)}
.skip-link:focus{transform:none}
.shell{width:min(100%,var(--page-max));margin-inline:auto;padding-inline:var(--page-gutter)}
.eyebrow{display:flex;align-items:center;gap:var(--space-sm);color:var(--color-accent-dark);font:500 var(--text-xs)/1.2 var(--font-mono);letter-spacing:.08em;text-transform:uppercase}
.eyebrow::before{content:"";inline-size:.55rem;block-size:.55rem;background:var(--color-accent);border-radius:50%}
.lede{max-width:58ch;font-size:var(--text-md);line-height:1.55;color:var(--color-ink-soft)}
.nav{position:sticky;inset-block-start:0;z-index:var(--z-sticky-nav);border-block-end:var(--rule-hair) solid var(--color-rule);background:color-mix(in oklch,var(--color-paper) 91%,transparent);backdrop-filter:blur(14px)}
.nav__inner{min-block-size:4.5rem;display:grid;grid-template-columns:1fr auto;align-items:center;gap:var(--space-md)}
.brand{display:inline-flex;align-items:center;inline-size:max-content;white-space:nowrap}
.brand img{inline-size:7rem;block-size:auto}
.nav__links,.nav__actions{display:none}
.nav__link,.footer__link{white-space:nowrap}
.nav__link{min-block-size:2.75rem;display:inline-flex;align-items:center;padding-inline:var(--space-sm);font-size:var(--text-sm);font-weight:500}
.nav__link:hover{color:var(--color-accent-dark)}
.nav__link[aria-current="page"]{color:var(--color-accent-dark)}
.nav__mobile{justify-self:end;inline-size:2.75rem;block-size:2.75rem;border:var(--rule-hair) solid var(--color-rule-strong);border-radius:var(--radius-sm);background:var(--color-paper-raised);color:var(--color-ink);cursor:pointer}
.mobile-panel{position:fixed;inset:4.5rem 0 auto;z-index:var(--z-sticky);display:grid;gap:var(--space-xs);padding:var(--space-lg) var(--page-gutter);border-block-end:var(--rule-hair) solid var(--color-rule);background:var(--color-paper-raised);transform:translateY(-125%);opacity:0;transition:transform var(--dur-short) var(--ease-in),opacity var(--dur-short) var(--ease-in)}
.mobile-panel.is-open{transform:none;opacity:1;transition-timing-function:var(--ease-out)}
.mobile-panel a{min-block-size:2.75rem;display:flex;align-items:center;font-weight:600;white-space:nowrap}
.btn{display:inline-flex;justify-content:center;align-items:center;gap:var(--space-xs);min-block-size:2.85rem;padding:.7rem 1.05rem;border:var(--rule-hair) solid transparent;border-radius:var(--radius-sm);font-weight:600;line-height:1;white-space:nowrap;cursor:pointer;transition:transform var(--dur-micro) var(--ease-out),background-color var(--dur-short) var(--ease-out),border-color var(--dur-short) var(--ease-out)}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(1px)}
.btn--primary{background:var(--color-accent);color:var(--color-accent-ink)}
.btn--primary:hover{background:var(--color-accent-dark)}
.btn--secondary{border-color:var(--color-rule-strong);background:var(--color-paper-raised);color:var(--color-ink)}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed;pointer-events:none}
.hero{padding-block:var(--space-2xl) var(--space-3xl)}
.hero__grid{display:grid;gap:var(--space-2xl);align-items:center}
.hero__copy{display:grid;gap:var(--space-lg)}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--space-sm)}
.proof-line{display:flex;flex-wrap:wrap;gap:var(--space-lg);color:var(--color-muted);font-size:var(--text-sm)}
.proof-line strong{color:var(--color-ink);font-weight:600}
.clone-bench{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 2.75rem minmax(0,1fr);align-items:center;min-block-size:28rem;padding:var(--space-lg);border:var(--rule-hair) solid var(--color-rule-strong);border-radius:var(--radius-lg);background:var(--color-paper-blue)}
.bench-card{align-self:stretch;display:flex;flex-direction:column;min-width:0;border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-md);background:var(--color-paper-raised);overflow:hidden}
.bench-card__head{display:flex;justify-content:space-between;align-items:center;gap:var(--space-xs);padding:var(--space-sm);border-block-end:var(--rule-hair) solid var(--color-rule);font:500 .65rem/1.2 var(--font-mono);letter-spacing:.05em;text-transform:uppercase}
.bench-card__body{flex:1;display:grid;place-items:center;padding:var(--space-md)}
.source-layout{inline-size:100%;display:grid;gap:var(--space-sm)}
.source-layout span{display:block;border-radius:var(--radius-sm);background:var(--color-rule)}
.source-layout .image{block-size:7.5rem;background:var(--color-paper-blue)}
.source-layout .title{inline-size:75%;block-size:1rem;background:var(--color-ink-soft)}
.source-layout .line{block-size:.55rem}.source-layout .line.short{inline-size:60%}
.source-layout .action{inline-size:45%;block-size:1.8rem;background:var(--color-accent)}
.bench-arrow{display:grid;place-items:center;inline-size:2.75rem;block-size:2.75rem;border-radius:50%;background:var(--color-dark);color:var(--color-dark-ink);font-family:var(--font-mono)}
.email-layout{inline-size:100%;display:grid;gap:var(--space-xs);padding:var(--space-sm);border:var(--rule-hair) solid var(--color-rule);background:var(--color-paper)}
.email-layout__hero{block-size:5rem;background:var(--color-dark)}
.email-layout__copy{display:grid;gap:var(--space-2xs);padding:var(--space-sm)}
.email-layout__copy i{display:block;block-size:.45rem;background:var(--color-rule)}
.email-layout__copy i:first-child{inline-size:70%;block-size:.75rem;background:var(--color-ink)}
.email-layout__button{inline-size:38%;block-size:1.5rem;margin-block-start:var(--space-xs);background:var(--color-accent)}
.status{display:inline-flex;align-items:center;gap:var(--space-2xs);color:var(--color-success)}
.status::before{content:"";inline-size:.45rem;block-size:.45rem;border-radius:50%;background:currentColor}
.feature-index{padding-block:var(--space-3xl)}
.index-head{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-lg);margin-block-end:var(--space-2xl)}
.feature-explorer{display:grid;gap:var(--space-xl)}
.feature-tools{position:sticky;inset-block-start:5.25rem;z-index:2;display:grid;gap:var(--space-md);padding:var(--space-md);border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-md);background:color-mix(in oklch,var(--color-paper) 94%,transparent);backdrop-filter:blur(14px)}
.feature-search{display:grid;gap:var(--space-xs)}
.feature-search__label{font:600 var(--text-xs)/1.2 var(--font-mono);letter-spacing:.07em;text-transform:uppercase;color:var(--color-muted)}
.feature-search__control{min-block-size:3rem;display:flex;align-items:center;gap:var(--space-sm);padding-inline:var(--space-md);border:var(--rule-hair) solid var(--color-rule-strong);border-radius:var(--radius-sm);background:var(--color-paper-raised);color:var(--color-muted)}
.feature-search__control:focus-within{border-color:var(--color-accent-dark);box-shadow:0 0 0 3px color-mix(in oklch,var(--color-focus) 22%,transparent)}
.feature-search input{min-width:0;inline-size:100%;border:0;outline:0;background:transparent;color:var(--color-ink);font:500 var(--text-base)/1.2 var(--font-body)}
.feature-search input::placeholder{color:var(--color-muted)}
.feature-filters{display:flex;flex-wrap:wrap;gap:var(--space-xs)}
.feature-filter{min-block-size:2.5rem;padding:var(--space-sm) var(--space-md);border:var(--rule-hair) solid var(--color-rule);border-radius:999px;background:var(--color-paper-raised);color:var(--color-ink-soft);font-size:var(--text-sm);font-weight:600;line-height:1;white-space:nowrap;cursor:pointer}
.feature-filter:hover,.feature-filter.is-active{border-color:var(--color-dark);background:var(--color-dark);color:var(--color-dark-ink)}
.feature-filter:active{opacity:.78}
.feature-filter:disabled{opacity:.5;cursor:not-allowed}
.feature-results{font:500 var(--text-sm)/1.3 var(--font-mono);color:var(--color-muted)}
.feature-results strong{color:var(--color-ink)}
.feature-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-md)}
.feature-card{min-width:0;display:flex;flex-direction:column;border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-md);background:var(--color-paper-raised);overflow:hidden;transition:border-color var(--dur-short) var(--ease-out)}
a.feature-card:hover{border-color:var(--color-accent-dark)}
.feature-card[hidden]{display:none}
.feature-card__media{aspect-ratio:16/9;margin:0;border-block-end:var(--rule-hair) solid var(--color-rule);background:var(--color-paper-blue);overflow:hidden}
.feature-card__media img{inline-size:100%;block-size:100%;object-fit:cover}
.feature-card__body{flex:1;display:flex;flex-direction:column;gap:var(--space-md);padding:var(--space-lg)}
.feature-card__meta{display:flex;justify-content:space-between;align-items:center;gap:var(--space-sm);font:600 var(--text-xs)/1.3 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--color-muted)}
.feature-card__featured{color:var(--color-accent-dark)}
.feature-card__title{font-size:var(--text-xl);letter-spacing:-.035em}
.feature-card__body>p{color:var(--color-ink-soft)}
.feature-card__tags{display:flex;flex-wrap:wrap;gap:var(--space-xs);margin:0;padding:0;list-style:none}
.feature-card__tags li{padding:.3rem .55rem;border-radius:999px;background:var(--color-paper-blue);color:var(--color-muted);font-size:var(--text-xs);font-weight:600}
.feature-card__link{display:inline-flex;align-items:center;gap:var(--space-xs);margin-block-start:auto;padding-block-start:var(--space-sm);color:var(--color-accent-dark);font-weight:600;white-space:nowrap}
.feature-empty{display:grid;justify-items:start;gap:var(--space-md);padding:var(--space-2xl);border:var(--rule-hair) dashed var(--color-rule-strong);border-radius:var(--radius-md)}
.feature-empty[hidden]{display:none}
.problem{padding-block:var(--space-3xl);border-block:var(--rule-hair) solid var(--color-rule)}
.problem__grid{display:grid;gap:var(--space-2xl)}
.problem__aside{font-family:var(--font-body);font-size:var(--text-sm);font-weight:600;color:var(--color-muted)}
.problem__body{display:grid;gap:var(--space-lg)}
.problem__body p{max-width:62ch;font-size:var(--text-md)}
.problem__body .alternative-line{font-size:var(--text-base)}
.problem__body a,.tutorial-step__copy a{color:var(--color-accent-dark);font-weight:600;text-decoration-line:underline;text-decoration-thickness:var(--rule-hair);text-underline-offset:.2em}
.problem__body a:hover,.tutorial-step__copy a:hover{color:var(--color-ink)}
.workflow{padding-block:var(--space-3xl)}
.section-head{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-lg);margin-block-end:var(--space-2xl)}
.steps{list-style:none;margin:0;padding:0;border-block-start:var(--rule-hair) solid var(--color-rule-strong)}
.step{display:grid;grid-template-columns:3.5rem minmax(0,1fr);gap:var(--space-lg);padding-block:var(--space-xl);border-block-end:var(--rule-hair) solid var(--color-rule)}
.step__no{font:600 var(--text-sm)/1.4 var(--font-body);color:var(--color-accent-dark)}
.step__copy{display:grid;gap:var(--space-sm)}
.step__copy p{max-width:58ch}
.shot-section{padding-block:var(--space-3xl);background:var(--color-dark);color:var(--color-dark-ink)}
.shot-section h2,.shot-section h3{color:var(--color-dark-ink)}
.shot-section .eyebrow{color:var(--color-dark-ink)}
.shot-section .lede{color:var(--color-dark-ink)}
.product-shot{position:relative;min-block-size:28rem;display:grid;place-items:center;margin-block-start:var(--space-2xl);border:var(--rule-hair) solid var(--color-dark-soft);border-radius:var(--radius-lg);background:var(--color-dark-soft);overflow:hidden}
.product-shot img{inline-size:100%;block-size:100%;object-fit:cover}
.product-shot__fallback{max-width:34rem;display:grid;gap:var(--space-lg);padding:var(--space-xl);text-align:center}
.product-shot__fallback strong{font-family:var(--font-display);font-size:var(--text-xl);color:var(--color-dark-ink)}
.product-shot.has-image .product-shot__fallback{display:none}
.callout{position:absolute;inset-inline-end:var(--space-lg);inset-block-end:var(--space-lg);max-width:18rem;padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);background:var(--color-paper-raised);color:var(--color-ink);font-size:var(--text-sm);font-weight:600}
.benefits{padding-block:var(--space-3xl)}
.benefit-grid{display:grid;gap:var(--space-xl)}
.benefit{display:grid;gap:var(--space-sm);padding-block-start:var(--space-lg);border-block-start:var(--rule-hair) solid var(--color-rule-strong)}
.benefit p{max-width:42ch}
.faq{padding-block:var(--space-3xl);border-block-start:var(--rule-hair) solid var(--color-rule)}
.faq-list{margin-block-start:var(--space-2xl);border-block-start:var(--rule-hair) solid var(--color-rule-strong)}
.faq details{border-block-end:var(--rule-hair) solid var(--color-rule)}
.faq summary{min-block-size:4.5rem;display:flex;justify-content:space-between;align-items:center;gap:var(--space-md);cursor:pointer;color:var(--color-ink);font-family:var(--font-display);font-size:var(--text-md);font-weight:700;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--font-mono);color:var(--color-accent-dark)}
.faq details[open] summary::after{content:"−"}
.faq details p{max-width:65ch;padding-block-end:var(--space-lg)}
.closing{padding-block:var(--space-3xl);background:var(--color-paper-blue)}
.closing__grid{display:grid;gap:var(--space-xl)}
.closing__line{max-width:19ch;font-family:var(--font-display);font-size:clamp(2.2rem,6vw,4.5rem);font-weight:700;letter-spacing:-.05em;line-height:1;color:var(--color-ink)}
.footer{padding-block:var(--space-3xl) var(--space-xl);border-block-start:var(--rule-hair) solid var(--color-rule);background:var(--color-paper-raised)}
.footer h2{font:700 var(--text-base)/1.2 var(--font-display);letter-spacing:-.02em}
.footer__directory{display:grid;gap:var(--space-2xl)}
.footer__resources,.footer__column{display:grid;align-content:start;gap:var(--space-md)}
.footer__resource-links{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-sm) var(--space-xl)}
.footer__resource-links a,.footer__column a,.footer__legal a{color:var(--color-ink-soft);font-size:var(--text-sm);text-decoration-thickness:var(--rule-hair);text-underline-offset:.2em}
.footer__resource-links a:hover,.footer__column a:hover,.footer__legal a:hover{color:var(--color-accent-dark);text-decoration-line:underline}
.footer__base{display:grid;gap:var(--space-lg);margin-block-start:var(--space-2xl);padding-block-start:var(--space-xl);border-block-start:var(--rule-hair) solid var(--color-rule)}
.footer__brand{display:grid;gap:var(--space-sm)}
.footer__legal{display:flex;flex-wrap:wrap;gap:var(--space-sm) var(--space-lg)}
.footer__small{color:var(--color-muted);font-size:var(--text-sm)}
.support-fab{position:fixed;inset-inline-end:var(--space-md);inset-block-end:var(--space-md);z-index:var(--z-modal);inline-size:3.125rem;block-size:3.125rem;display:grid;place-items:center;border-radius:50%;background:var(--color-support);color:var(--color-accent-ink);box-shadow:var(--shadow-fab);transition:background-color var(--dur-short) var(--ease-out)}
.support-fab:hover{background:var(--color-support-hover)}
.support-fab:active{opacity:.82}
.reveal{opacity:1;transform:none}
.hero .reveal{animation:hero-enter var(--dur-long) var(--ease-out) both}
.hero .clone-bench{animation-delay:80ms}
@keyframes hero-enter{from{opacity:0;transform:translateY(.6rem)}to{opacity:1;transform:none}}
@media (min-width:40rem){
  .feature-tools{grid-template-columns:minmax(15rem,.7fr) minmax(0,1.3fr) auto;align-items:end}
  .feature-results{align-self:center;white-space:nowrap}
  .feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .benefit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .closing__grid{grid-template-columns:minmax(0,1fr) auto;align-items:end}
  .footer__resource-links{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer__base{grid-template-columns:minmax(0,1fr) auto;align-items:end}
  .footer__legal{justify-content:flex-end}
}
@media (min-width:60rem){
  .nav__inner{grid-template-columns:1fr auto 1fr}
  .nav__links{display:flex;justify-content:center;gap:var(--space-xs)}
  .nav__actions{display:flex;justify-content:flex-end;align-items:center;gap:var(--space-sm)}
  .nav__mobile{display:none}
  .hero{padding-block:var(--space-3xl) var(--space-4xl)}
  .hero__grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:var(--space-3xl)}
  .index-head .lede,.section-head .lede{max-width:58ch}
  .feature-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .footer__directory{grid-template-columns:minmax(0,1.5fr) minmax(0,.7fr) minmax(0,.8fr)}
  .problem__grid{grid-template-columns:12rem minmax(0,1fr)}
  .benefit-grid{grid-template-columns:1.2fr .8fr 1fr}
}

/* Email cloner: a screenshot-led, three-step field guide */
.cloner-hero__video{border-color:var(--color-rule-strong);box-shadow:0 1.5rem 4rem color-mix(in oklch,var(--color-dark) 12%,transparent)}
.cloner-nav{display:grid;border-block:var(--rule-hair) solid var(--color-rule-strong)}
.cloner-nav a{display:flex;align-items:center;gap:var(--space-sm);min-block-size:3.75rem;border-block-end:var(--rule-hair) solid var(--color-rule);font-weight:600;color:var(--color-ink)}
.cloner-nav a:last-child{border-block-end:0}
.cloner-nav span{font:500 var(--text-xs)/1 var(--font-mono);color:var(--color-accent-dark)}
.cloner-nav a:hover{color:var(--color-accent-dark)}
.cloner-tutorial{padding-block:var(--space-3xl)}
.cloner-tutorial .section-head h2,.faq .section-head h2{margin-block-start:var(--space-lg)}
.tutorial-expectation{max-width:72ch;margin-block:calc(var(--space-xl) * -1) var(--space-2xl);padding:var(--space-md) var(--space-lg);border:var(--rule-hair) solid var(--color-rule-strong);border-radius:var(--radius-sm);background:var(--color-paper-blue);font-size:var(--text-sm)}
.tutorial-expectation strong{color:var(--color-ink)}
.tutorial-steps{display:grid;gap:var(--space-3xl);margin:0;padding:0;list-style:none;counter-reset:steps}
.tutorial-step{display:grid;gap:var(--space-xl);align-items:center}
.tutorial-step__copy{display:grid;align-content:start;gap:var(--space-md)}
.tutorial-step__no{inline-size:max-content;padding:.4rem .65rem;border-radius:999px;background:var(--color-paper-blue);font:600 var(--text-xs)/1 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--color-accent-dark)}
.tutorial-step__copy p{max-width:58ch}
.tutorial-tip{padding:var(--space-md);border-inline-start:.2rem solid var(--color-accent);background:var(--color-paper-blue);font-size:var(--text-sm)}
.tutorial-tip strong{color:var(--color-ink)}
.tutorial-shot{min-width:0;block-size:max-content;align-self:center;margin:0;border:var(--rule-hair) solid var(--color-rule-strong);border-radius:var(--radius-md);background:var(--color-paper-raised);overflow:hidden}
.tutorial-shot img{inline-size:100%;block-size:auto;background:var(--color-paper-blue)}
.tutorial-shot figcaption{padding:var(--space-sm) var(--space-md);border-block-start:var(--rule-hair) solid var(--color-rule);font-size:var(--text-sm);color:var(--color-muted)}
.video-frame{position:relative;aspect-ratio:16/9;border:var(--rule-hair) solid var(--color-dark-soft);border-radius:var(--radius-lg);background:#000;overflow:hidden}
.video-frame iframe{position:absolute;inset:0;inline-size:100%;block-size:100%;border:0}
@media (min-width:40rem){.cloner-nav{grid-template-columns:repeat(3,minmax(0,1fr))}.cloner-nav a{padding-inline:var(--space-md);border-block-end:0;border-inline-end:var(--rule-hair) solid var(--color-rule)}.cloner-nav a:last-child{border-inline-end:0}}
@media (min-width:60rem){.tutorial-step{grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:var(--space-3xl)}.tutorial-step--reverse .tutorial-step__copy{order:2}}
@media (pointer:coarse){.btn,.nav__link,.footer a{min-block-size:3rem;display:inline-flex;align-items:center}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .hero .reveal{animation:none}
}

/* Features landing page: journey-led narrative */
.features-hero{padding-block:var(--space-3xl);border-block-end:var(--rule-hair) solid var(--color-rule)}
.features-hero__grid{display:grid;gap:var(--space-2xl);align-items:center}
.features-hero__copy{display:grid;gap:var(--space-lg)}
.features-hero__copy h1{max-width:13ch}
.features-hero__media{min-width:0}
.feature-media-wrap{min-width:0;align-self:center}
.feature-media{min-width:0;margin:0;border:var(--rule-hair) solid var(--color-rule-strong);border-radius:var(--radius-lg);background:var(--color-paper-blue);overflow:hidden}
.feature-media img{inline-size:100%;block-size:auto}
.feature-media__placeholder{aspect-ratio:16/10;display:grid;align-content:center;justify-items:start;gap:var(--space-sm);padding:var(--space-xl);background:linear-gradient(135deg,var(--color-paper-blue),var(--color-paper-raised));color:var(--color-muted)}
.feature-media__placeholder span,.feature-kicker{font:600 var(--text-xs)/1.2 var(--font-mono);letter-spacing:.07em;text-transform:uppercase;color:var(--color-accent-dark)}
.feature-media__placeholder strong{font-family:var(--font-display);font-size:var(--text-xl);color:var(--color-ink);overflow-wrap:anywhere}
.feature-media__placeholder small{max-width:42ch;font-family:var(--font-mono)}
.journey-nav{display:grid;border-block-end:var(--rule-hair) solid var(--color-rule-strong)}
.journey-nav a{display:grid;gap:var(--space-2xs);padding:var(--space-lg) 0;border-block-start:var(--rule-hair) solid var(--color-rule)}
.journey-nav span{font-family:var(--font-display);font-size:var(--text-lg);font-weight:700;color:var(--color-ink)}
.journey-nav small{color:var(--color-muted);white-space:nowrap}
.feature-story{padding-block:var(--space-3xl)}
.feature-story--tint{background:var(--color-paper-blue)}
.feature-story__intro{display:grid;gap:var(--space-lg);margin-block-end:var(--space-2xl)}
.feature-story__intro h2{max-width:19ch}
.feature-showcase{display:grid;gap:var(--space-xl)}
.feature-showcase article{min-width:0}
.feature-showcase__lead,.feature-showcase__support{display:grid;gap:var(--space-lg)}
.feature-showcase__lead>div,.feature-showcase__support>div{display:grid;align-content:start;gap:var(--space-md)}
.feature-link{display:inline-flex;align-items:center;gap:var(--space-xs);inline-size:max-content;max-width:100%;color:var(--color-accent-dark);font-weight:600;white-space:nowrap}
.feature-split{display:grid;gap:var(--space-2xl);align-items:center}
.feature-split__copy{display:grid;gap:var(--space-lg)}
.feature-split__copy h2{max-width:18ch;font-size:clamp(2.25rem,4vw,3.5rem);letter-spacing:-.04em;line-height:1.04}
.outcome-list{display:grid;gap:0;margin:var(--space-md) 0 0;padding:0;border-block-start:var(--rule-hair) solid var(--color-rule-strong);list-style:none}
.outcome-list li{display:grid;gap:var(--space-xs);padding-block:var(--space-lg);border-block-end:var(--rule-hair) solid var(--color-rule)}
.outcome-list strong{color:var(--color-ink)}
.outcome-list span{max-width:54ch}
.automation-stage{display:grid;gap:var(--space-xl)}
.automation-stage__notes{display:grid;border-block-start:var(--rule-hair) solid var(--color-rule-strong)}
.automation-stage__notes article{display:grid;gap:var(--space-sm);padding-block:var(--space-lg);border-block-end:var(--rule-hair) solid var(--color-rule)}
.automation-stage__notes span{font:600 var(--text-xs)/1.2 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--color-accent-dark)}
.feature-story__actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-lg)}
.why-noptin{padding-block:var(--space-3xl);background:var(--color-dark);color:var(--color-dark-ink)}
.why-noptin h2,.why-noptin h3{color:var(--color-dark-ink)}
.why-noptin .eyebrow{color:var(--color-dark-ink)}
.why-noptin__grid{display:grid;gap:var(--space-2xl)}
.why-noptin__points{display:grid;border-block-start:var(--rule-hair) solid var(--color-dark-soft)}
.why-noptin__points article{display:grid;gap:var(--space-sm);padding-block:var(--space-lg);border-block-end:var(--rule-hair) solid var(--color-dark-soft)}
.why-noptin__points p{color:var(--color-dark-ink)}

@media (min-width:40rem){
  .journey-nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--space-xl)}
  .feature-showcase__support{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center}
  .automation-stage__notes{grid-template-columns:repeat(3,minmax(0,1fr));border-block-end:var(--rule-hair) solid var(--color-rule)}
  .automation-stage__notes article{padding:var(--space-lg);border-block-end:0;border-inline-end:var(--rule-hair) solid var(--color-rule)}
  .automation-stage__notes article:last-child{border-inline-end:0}
}
@media (min-width:60rem){
  .features-hero{padding-block:var(--space-4xl)}
  .features-hero__grid{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:var(--space-3xl)}
  .journey-nav{grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
  .journey-nav a{padding-inline:var(--space-lg);border-inline-start:var(--rule-hair) solid var(--color-rule)}
  .journey-nav a:last-child{border-inline-end:var(--rule-hair) solid var(--color-rule)}
  .feature-story__intro{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:end}
  .feature-story__intro .eyebrow{grid-column:1/-1}
  .feature-showcase{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr)}
  .feature-showcase__lead{grid-template-rows:auto 1fr}
  .feature-showcase__support{grid-template-columns:minmax(0,1fr);grid-template-rows:1fr auto}
  .feature-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-3xl)}
  .feature-split--reverse .feature-split__copy{order:2}
  .why-noptin__grid{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:var(--space-3xl)}
}