

body  { background: var(--body-background, var(--paper)); color: var(--body-color, var(--ink)); background-image: var(--texture-noise); }

h1, h2, h3, h4  { font-family: var(--h1-group-font-family, var(--h1-group-font-heading, var(--font-heading))); font-weight: var(--h1-group-fw-heavy, var(--fw-heavy)); letter-spacing: var(--h1-group-ls-heading, var(--ls-heading)); }
h1, h2  { text-transform: var(--h1-group-case-loud, var(--case-loud)); }

.label  { display: var(--label-display, inline-block); color: var(--label-color, var(--accent)); font-weight: var(--label-fw-heavy, var(--fw-heavy)); letter-spacing: var(--label-ls-loud, var(--ls-loud)); border: var(--label-border, var(--label-border-w, var(--border-w)) var(--label-border-style-a, var(--border-style-a)) var(--accent)); padding: var(--label-label-padding, var(--label-padding)); transform: var(--label-transform, rotate(var(--label-tilt-label, var(--tilt-label)))); border-radius: var(--label-rad, var(--rad)); opacity: var(--label-op-90, var(--op-90)); }
.process .label  { color: var(--process-label-color, var(--tone-on-dark)); border-color: var(--process-label-border-color, var(--tone-on-dark)); }

[contenteditable]:hover  { box-shadow: var(--contenteditable-hover-box-shadow, inset 0 0 0 var(--ce-outline-w) var(--accent-tint)); }
[contenteditable]:focus  { box-shadow: var(--contenteditable-focus-box-shadow, inset 0 0 0 var(--ce-focus-outline-w) var(--accent)); background: var(--contenteditable-focus-background, var(--accent-tint)); }

#export-btn  { background: var(--export-btn-background, var(--ink)); border-radius: var(--export-btn-rad, var(--rad)); }

nav  { background: var(--nav-background, var(--nav-nav-bg, var(--nav-bg))); backdrop-filter: var(--nav-backdrop-filter, blur(var(--nav-nav-blur, var(--nav-blur)))); border-bottom: var(--nav-border-bottom, var(--nav-border-w, var(--border-w)) var(--nav-border-style-a, var(--border-style-a)) var(--ink)); }
.nav-back  { color: var(--nav-back-color, var(--ink2)); }
.nav-back:hover  { color: var(--nav-back-hover-color, var(--accent)); }
.nav-links a  { color: var(--nav-links-a-color, var(--ink)); font-weight: var(--nav-links-a-fw-strong, var(--fw-strong)); text-transform: var(--nav-links-a-case-loud, var(--case-loud)); font-size: var(--nav-links-a-nav-link-fs, var(--nav-link-fs)); letter-spacing: var(--nav-links-a-ls-tight, var(--ls-tight)); }
.nav-links a:hover  { color: var(--nav-links-a-hover-color, var(--accent)); text-decoration: var(--nav-links-a-hover-decoration-hover, var(--decoration-hover)); }
.nav-badge  { border-radius: var(--nav-badge-rad, var(--rad)); background: var(--nav-badge-background, var(--accent)); transform: var(--nav-badge-transform, rotate(var(--nav-badge-tilt-nav-badge, var(--tilt-nav-badge)))); }
.nav-cta  { background: var(--nav-cta-background, var(--ink)); color: var(--nav-cta-color, var(--paper)); border-radius: var(--nav-cta-rad, var(--rad)); font-weight: var(--nav-cta-fw-heavy, var(--fw-heavy)); text-transform: var(--nav-cta-case-loud, var(--case-loud)); transform: var(--nav-cta-transform, rotate(var(--nav-cta-tilt-nav-cta, var(--tilt-nav-cta)))); }
.nav-cta:hover  { opacity: var(--op-100); background: var(--nav-cta-hover-background, var(--accent)); }

.hero  { background: var(--hero-background, var(--paper)); background-image: var(--hero-bg-glow-hero, var(--bg-glow-hero)), var(--texture-noise); color: var(--hero-color, var(--ink)); padding: var(--hero-hero-padding, var(--hero-padding)); position: relative; overflow: hidden; border-bottom: var(--hero-border-bottom, var(--hero-border-w, var(--border-w)) var(--hero-border-style-a, var(--border-style-a)) var(--ink)); }
#hero-canvas  { display: none; }
.hero-inner  { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr auto; gap: var(--hero-inner-hero-inner-gap, var(--hero-inner-gap)); align-items: center; }
.hero-badge  { display: inline-block; font-size: var(--hero-badge-hero-badge-fs, var(--hero-badge-fs)); font-weight: var(--hero-badge-fw-heavy, var(--fw-heavy)); letter-spacing: var(--hero-badge-ls-loud, var(--ls-loud)); text-transform: var(--hero-badge-case-loud, var(--case-loud)); background: var(--hero-badge-background, transparent); color: var(--hero-badge-color, var(--accent)); border: var(--hero-badge-border, var(--hero-badge-border-w, var(--border-w)) var(--hero-badge-border-style-a, var(--border-style-a)) var(--accent)); border-radius: var(--hero-badge-rad, var(--rad)); padding: var(--hero-badge-hero-badge-padding, var(--hero-badge-padding)); margin-bottom: var(--hero-badge-hero-badge-margin-b, var(--hero-badge-margin-b)); transform: var(--hero-badge-transform, rotate(var(--hero-badge-tilt-hero-tag, var(--tilt-hero-tag)))); opacity: var(--hero-badge-op-90, var(--op-90)); }
h1.hero-h1  { color: var(--h1hero-h1-color, var(--ink)); margin-bottom: var(--h1hero-h1-hero-h1-margin-b-b2b, var(--hero-h1-margin-b-b2b)); transform: var(--h1hero-h1-transform, rotate(var(--h1hero-h1-tilt-hero-h1, var(--tilt-hero-h1)))); text-shadow: var(--h1hero-h1-text-shadow, var(--h1hero-h1-hero-h1-shadow-b2b, var(--hero-h1-shadow-b2b))); }
.hero-body  { color: var(--hero-body-color, var(--ink2)); max-width: var(--hero-body-hero-body-max-w-b2b, var(--hero-body-max-w-b2b)); font-size: var(--hero-body-hero-body-fs-b2b, var(--hero-body-fs-b2b)); margin-bottom: var(--hero-body-hero-body-margin-b-b2b, var(--hero-body-margin-b-b2b)); }
.hero-actions  { display: flex; gap: var(--hero-actions-hero-actions-gap, var(--hero-actions-gap)); flex-wrap: wrap; align-items: center; }
.hero-aside-link  { color: var(--hero-aside-link-color, var(--ink)); text-decoration: none; font-size: var(--hero-aside-link-hero-aside-fs-b2b, var(--hero-aside-fs-b2b)); font-weight: var(--hero-aside-link-fw-strong, var(--fw-strong)); border-bottom: var(--hero-aside-link-border-bottom, var(--hero-aside-link-border-w, var(--border-w)) var(--hero-aside-link-border-style-b, var(--border-style-b)) var(--accent)); }
.hero-aside-link:hover  { color: var(--hero-aside-link-hover-color, var(--accent)); }
.hero-mark  { width: var(--hero-mark-hero-mark-w-b2b, var(--hero-mark-w-b2b)); flex-shrink: 0; transform: var(--hero-mark-transform, rotate(var(--hero-mark-img-tilt-hero, var(--img-tilt-hero)))); }
.hero-mark canvas  { width: 100%; aspect-ratio: 1; border-radius: var(--hero-mark-canvas-img-shape, var(--img-shape)); border: var(--hero-mark-canvas-border, var(--hero-mark-canvas-border-w, var(--border-w)) var(--hero-mark-canvas-border-style-a, var(--border-style-a)) var(--ink)); filter: var(--hero-mark-canvas-img-filter-hero, var(--img-filter-hero)); box-shadow: var(--hero-mark-canvas-box-shadow, var(--hero-mark-canvas-img-shadow-hero, var(--img-shadow-hero))); }
.btn-accent  { background: var(--btn-accent-background, var(--accent)); color: var(--btn-accent-color, var(--paper)); border: var(--btn-accent-border, var(--btn-accent-border-w, var(--border-w)) var(--btn-accent-border-style-a, var(--border-style-a)) var(--ink)); border-radius: var(--btn-accent-rad, var(--rad)); font-weight: var(--btn-accent-fw-heavy, var(--fw-heavy)); text-transform: var(--btn-accent-case-loud, var(--case-loud)); transform: var(--btn-accent-transform, rotate(var(--btn-accent-tilt-btn-rose, var(--tilt-btn-rose)))); transition: var(--btn-accent-transition, transform var(--btn-accent-transition-fast, var(--transition-fast))); }
.btn-accent:hover  { opacity: var(--op-100); transform: var(--btn-accent-hover-transform, rotate(var(--btn-accent-hover-tilt-flat, var(--tilt-flat))) translateY(var(--btn-accent-hover-lift-btn, var(--lift-btn)))); }

.pulse-strip  { background: var(--pulse-strip-background, var(--ink)); color: var(--pulse-strip-color, var(--paper)); border-bottom: var(--pulse-strip-border-bottom, var(--pulse-strip-border-w, var(--border-w)) var(--pulse-strip-border-style-a, var(--border-style-a)) var(--ink)); }
.pulse-item  { border-right: var(--pulse-item-border-right, var(--pulse-item-border-w, var(--border-w)) var(--pulse-item-border-style-b, var(--border-style-b)) rgb(from var(--paper) r g b / var(--op-30))); }
.pulse-num  { font-family: var(--pulse-num-font-family, var(--pulse-num-font-alt, var(--font-alt))); font-weight: var(--pulse-num-fw-heavy, var(--fw-heavy)); color: var(--pulse-num-color, var(--paper)); text-shadow: var(--pulse-num-text-shadow, var(--pulse-num-shadow-text-accent, var(--shadow-text-accent))); }
.pulse-label  { color: var(--pulse-label-color, rgb(from var(--paper) r g b / var(--op-65))); }

.benefits  { background: var(--benefits-background, var(--paper)); background-image: var(--texture-noise); }
.ben-card  { background: var(--ben-card-background, var(--carte)); border: var(--ben-card-border, var(--ben-card-border-w, var(--border-w)) var(--ben-card-border-style-a, var(--border-style-a)) var(--ink)); border-radius: var(--ben-card-rad, var(--rad)); position: relative; }
.ben-grid > .ben-card:nth-child(odd)  { transform: var(--ben-grid-ben-card-odd-transform, rotate(var(--ben-grid-ben-card-odd-tilt-sm-neg, var(--tilt-sm-neg)))); }
.ben-grid > .ben-card:nth-child(even)  { transform: var(--ben-grid-ben-card-even-transform, rotate(var(--ben-grid-ben-card-even-tilt-sm-pos, var(--tilt-sm-pos)))); }
.ben-card::before  { content: ''; position: absolute; top: var(--ben-card-before-stamp-offset-top, var(--stamp-offset-top)); left: 50%; transform: var(--ben-card-before-transform, translateX(-50%) rotate(var(--ben-card-before-tilt-stamp-ben, var(--tilt-stamp-ben)))); width: var(--ben-card-before-stamp-w-pq, var(--stamp-w-pq)); height: var(--ben-card-before-stamp-h-pq, var(--stamp-h-pq)); background: var(--ben-card-before-background, var(--ben-card-before-stamp-bg, var(--stamp-bg))); border-left: var(--ben-card-before-border-left, var(--ben-card-before-stamp-side-border-w, var(--stamp-side-border-w)) var(--ben-card-before-border-style-b, var(--border-style-b)) var(--ben-card-before-stamp-side-border-color, var(--stamp-side-border-color))); border-right: var(--ben-card-before-border-right, var(--ben-card-before-stamp-side-border-w, var(--stamp-side-border-w)) var(--ben-card-before-border-style-b, var(--border-style-b)) var(--ben-card-before-stamp-side-border-color, var(--stamp-side-border-color))); box-shadow: var(--ben-card-before-box-shadow, var(--ben-card-before-stamp-shadow, var(--stamp-shadow))); }
.ben-icon  { background: var(--ben-icon-background, transparent); border: var(--ben-icon-border, var(--ben-icon-border-w, var(--border-w)) var(--ben-icon-border-style-a, var(--border-style-a)) var(--ink)); border-radius: var(--ben-icon-img-shape, var(--img-shape)); }
.ben-icon svg  { stroke: var(--ben-icon-svg-stroke, var(--accent)); }
.ben-card p  { color: var(--ben-card-p-color, var(--mid)); }

.audience  { background: var(--audience-background, var(--paper2)); background-image: var(--texture-noise); border-top: var(--audience-border-top, var(--audience-border-w, var(--border-w)) var(--audience-border-style-a, var(--border-style-a)) var(--ink)); }
.aud-grid  { display: grid; grid-template-columns: repeat(var(--layout-aud-columns), 1fr); gap: var(--aud-grid-grid-gap-cards, var(--grid-gap-cards)); margin-top: var(--aud-grid-content-lead-gap, var(--content-lead-gap)); }
.aud-card  { background: var(--aud-card-background, var(--carte)); border: var(--aud-card-border, var(--aud-card-border-w, var(--border-w)) var(--aud-card-border-style-a, var(--border-style-a)) var(--ink)); border-radius: var(--aud-card-rad, var(--rad)); padding: var(--aud-card-segment-card-padding, var(--segment-card-padding)); position: relative; }
.aud-grid > .aud-card:nth-child(odd)  { transform: var(--aud-grid-aud-card-odd-transform, rotate(var(--aud-grid-aud-card-odd-tilt-pq-card-odd, var(--tilt-pq-card-odd)))); }
.aud-grid > .aud-card:nth-child(even)  { transform: var(--aud-grid-aud-card-even-transform, rotate(var(--aud-grid-aud-card-even-tilt-pq-card-even, var(--tilt-pq-card-even)))); }
.aud-card::before  { content: ''; position: absolute; top: var(--aud-card-before-stamp-offset-top, var(--stamp-offset-top)); left: 50%; transform: var(--aud-card-before-transform, translateX(-50%) rotate(var(--aud-card-before-tilt-stamp-aud, var(--tilt-stamp-aud)))); width: var(--aud-card-before-stamp-w-testi, var(--stamp-w-testi)); height: var(--aud-card-before-stamp-h-testi, var(--stamp-h-testi)); background: var(--aud-card-before-background, var(--aud-card-before-stamp-bg, var(--stamp-bg))); box-shadow: var(--aud-card-before-box-shadow, var(--aud-card-before-stamp-shadow, var(--stamp-shadow))); }
.aud-tag  { display: var(--aud-tag-display, inline-block); font-size: var(--aud-tag-fs-segment-tag, var(--fs-segment-tag)); font-weight: var(--aud-tag-fw-heavy, var(--fw-heavy)); letter-spacing: var(--aud-tag-ls-badge, var(--ls-badge)); text-transform: var(--aud-tag-case-loud, var(--case-loud)); color: var(--aud-tag-color, var(--accent)); border: var(--aud-tag-border, var(--aud-tag-border-w, var(--border-w)) var(--aud-tag-border-style-a, var(--border-style-a)) var(--accent)); border-radius: var(--aud-tag-rad, var(--rad)); padding: var(--aud-tag-segment-tag-padding, var(--segment-tag-padding)); margin-bottom: var(--aud-tag-segment-tag-margin-b, var(--segment-tag-margin-b)); transform: var(--aud-tag-transform, rotate(var(--aud-tag-tilt-sm-neg-b, var(--tilt-sm-neg-b)))); opacity: var(--aud-tag-op-90, var(--op-90)); }
.aud-card h3  { font-size: var(--aud-card-h3-fs-segment-card-h3, var(--fs-segment-card-h3)); margin-bottom: var(--aud-card-h3-mb-segment-card-h3, var(--mb-segment-card-h3)); }
.aud-card p  { font-size: var(--aud-card-p-fs-segment-card-body, var(--fs-segment-card-body)); color: var(--aud-card-p-color, var(--mid)); max-width: unset; }

.steps  { border: var(--steps-border, var(--steps-border-w, var(--border-w)) var(--steps-border-style-b, var(--border-style-b)) var(--steps-cta-border, var(--cta-border))); border-radius: var(--steps-rad, var(--rad)); }
.step  { border-right: var(--step-border-right, var(--step-border-w, var(--border-w)) var(--step-border-style-b, var(--border-style-b)) rgb(from var(--paper) r g b / var(--op-25))); }
.step-n  { background: var(--step-n-background, var(--paper)); color: var(--step-n-color, var(--ink)); border-radius: var(--step-n-radius-blob, var(--radius-blob)); font-weight: var(--step-n-fw-heavy, var(--fw-heavy)); }
.step p  { color: var(--step-p-color, rgb(from var(--paper) r g b / var(--step-p-op-60, var(--op-60)))); }

.testimonials  { background: var(--testimonials-background, var(--paper)); background-image: var(--texture-noise); border-top: var(--testimonials-border-top, var(--testimonials-border-w, var(--border-w)) var(--testimonials-border-style-a, var(--border-style-a)) var(--ink)); }
.testi-grid  { align-items: var(--testi-grid-testi-align, var(--testi-align)); }
.testi-card  { background: var(--testi-card-background, var(--carte)); border: var(--testi-card-border, var(--testi-card-border-w, var(--border-w)) var(--testi-card-border-style-a, var(--border-style-a)) var(--ink)); border-radius: var(--testi-card-rad, var(--rad)); position: relative; }
.testi-grid > .testi-card:nth-child(odd)  { transform: var(--testi-grid-testi-card-odd-transform, rotate(var(--testi-grid-testi-card-odd-tilt-sm-neg, var(--tilt-sm-neg)))); }
.testi-grid > .testi-card:nth-child(even)  { transform: var(--testi-grid-testi-card-even-transform, rotate(var(--testi-grid-testi-card-even-tilt-sm-pos, var(--tilt-sm-pos)))); }
.testi-card::before  { content: ''; position: absolute; top: var(--testi-card-before-stamp-offset-top, var(--stamp-offset-top)); left: 50%; transform: var(--testi-card-before-transform, translateX(-50%) rotate(var(--testi-card-before-tilt-stamp, var(--tilt-stamp)))); width: var(--testi-card-before-stamp-w-testi, var(--stamp-w-testi)); height: var(--testi-card-before-stamp-h-testi, var(--stamp-h-testi)); background: var(--testi-card-before-background, var(--testi-card-before-stamp-bg, var(--stamp-bg))); box-shadow: var(--testi-card-before-box-shadow, var(--testi-card-before-stamp-shadow, var(--stamp-shadow))); }
.testi-quote  { color: var(--testi-quote-color, var(--ink2)); }
.testi-author  { border-top: var(--testi-author-border-top, var(--testi-author-border-w, var(--border-w)) var(--testi-author-border-style-b, var(--border-style-b)) var(--ink)); }
.testi-avatar  { background: var(--testi-avatar-background, var(--paper)); border: var(--testi-avatar-border, var(--testi-avatar-border-w, var(--border-w)) var(--testi-avatar-border-style-a, var(--border-style-a)) var(--ink)); color: var(--testi-avatar-color, var(--ink)); border-radius: var(--testi-avatar-radius-blob, var(--radius-blob)); }
.testi-name  { color: var(--testi-name-color, var(--ink)); }
.testi-role  { color: var(--testi-role-color, var(--mid)); }

.cta-inner  { border: var(--cta-inner-border, var(--cta-inner-border-w, var(--border-w)) var(--cta-inner-border-style-b, var(--border-style-b)) rgb(from var(--paper) r g b / var(--op-50))); background: var(--cta-inner-background, transparent); border-radius: var(--cta-inner-rad, var(--rad)); }
.btn-outline-w  { border: var(--btn-outline-w-border, var(--btn-outline-w-border-w, var(--border-w)) var(--btn-outline-w-border-style-b, var(--border-style-b)) rgb(from var(--paper) r g b / var(--btn-outline-w-op-60, var(--op-60)))); border-radius: var(--btn-outline-w-rad, var(--rad)); text-transform: var(--btn-outline-w-case-loud, var(--case-loud)); font-weight: var(--btn-outline-w-fw-strong, var(--fw-strong)); }

footer  { background: var(--footer-background, var(--surface-dark)); border-top: var(--footer-border-top, var(--footer-border-w, var(--border-w)) var(--footer-border-style-a, var(--border-style-a)) var(--ink)); }
.foot-copy  { color: var(--foot-copy-color, rgb(from var(--paper) r g b / var(--op-45))); }
.foot-links a  { color: var(--foot-links-a-color, rgb(from var(--paper) r g b / var(--op-55))); }
.foot-links a:hover  { color: var(--foot-links-a-hover-color, var(--paper)); text-decoration: var(--foot-links-a-hover-decoration-hover, var(--decoration-hover)); }

@media (max-width: 820px) {
  .aud-grid { grid-template-columns: 1fr; }
  .steps { grid-template-columns: 1fr 1fr; }
}
