/* =============================================================
   THE AUTHORITY SIGNAL — Editorial Sales Page
   Design tokens, base, and per-section styles.
   ============================================================= */

:root{
  /* ---- color ---- */
  --as-ink:        #111820;
  --as-parchment:  #F3EEE5;
  --as-porcelain:  #FAF8F4;
  --as-copper:     #B87952;
  --as-sage:       #8D9991;
  --as-stone:      #D8D0C4;
  --as-white:      #FFFFFF;
  --as-ink-70: rgba(17,24,32,.7);
  --as-ink-50: rgba(17,24,32,.5);
  --as-ink-15: rgba(17,24,32,.15);
  --as-ink-08: rgba(17,24,32,.08);
  --as-white-70: rgba(255,255,255,.7);
  --as-white-50: rgba(255,255,255,.5);
  --as-white-15: rgba(255,255,255,.15);

  /* ---- type ---- */
  --as-serif: var(--as-theme-heading, Georgia, serif);
  --as-sans:  var(--as-theme-body, system-ui, sans-serif);

  --as-h1: clamp(2.4rem, 1.6rem + 3.2vw, 4.5rem);
  --as-h2: clamp(1.9rem, 1.5rem + 1.7vw, 3.25rem);
  --as-h3: clamp(1.3rem, 1.1rem + 0.7vw, 2rem);
  --as-body: 1.09rem;

  /* ---- layout ---- */
  --as-maxw: 1280px;
  --as-gutter: clamp(1.5rem, 4vw, 4.5rem);
  --as-section-pad: clamp(4.5rem, 8vw, 8.5rem);
  --as-radius: 2px;

  /* ---- motion ---- */
  --as-ease: cubic-bezier(.22,.61,.36,1);
  --as-fast: 220ms;
  --as-med: 520ms;
}

/* ============ RESET & BASE ============ */
*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0;
  font-family: var(--as-sans);
  font-size: var(--as-body);
  line-height: 1.65;
  color: var(--as-ink);
  background: var(--as-porcelain);
  -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; display:block; }
a{ color: inherit; }
ul, ol{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p,blockquote,figure{ margin:0; }
button{ font: inherit; color: inherit; background:none; border:none; cursor:pointer; padding:0; }
svg{ overflow: visible; }

@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

:focus-visible{
  outline: 2px solid var(--as-copper);
  outline-offset: 3px;
  border-radius: 1px;
}

::selection{ background: var(--as-copper); color: var(--as-white); }

/* refined scrollbar (webkit) */
::-webkit-scrollbar{ width: 10px; }
::-webkit-scrollbar-track{ background: var(--as-porcelain); }
::-webkit-scrollbar-thumb{ background: var(--as-stone); border-radius: 6px; border: 2px solid var(--as-porcelain); }
::-webkit-scrollbar-thumb:hover{ background: var(--as-copper); }

/* ---- film grain, whole-page atmosphere ---- */
.as-grain{
  position: fixed; inset:0; z-index: 60; pointer-events:none;
  opacity: .035; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---- signature element: the Authority Spine ---- */
.as-spine{
  position: fixed; left: 0; top: 0; bottom: 0; width: 34px; z-index: 45;
  display:flex; align-items:center; justify-content:center;
  pointer-events:none;
}
.as-spine__track{ position:absolute; top: 6vh; bottom: 6vh; left:50%; width:1px; background: var(--as-ink-15); transform: translateX(-50%); }
.as-spine__fill{
  position:absolute; top: 6vh; left:50%; width:2px; background: var(--as-copper);
  transform: translateX(-50%); height: 0%;
  transition: height .12s linear;
}
.as-spine__tick{
  position:absolute; left:50%; top: calc(6vh + (var(--p) * 0.88vh));
  width:7px; height:7px; border-radius:50%;
  background: var(--as-porcelain); border: 1px solid var(--as-ink-15);
  transform: translate(-50%,-50%);
}
@media (max-width: 1180px){ .as-spine{ display:none; } }
@media (min-width: 1181px){ body{ padding-left: 34px; } }

/* ---- staggered load-in (hero) ---- */
.as-load-in{
  opacity:0; transform: translateY(16px);
  animation: as-load-up .8s var(--as-ease) forwards;
  animation-delay: calc(var(--d, 0) * 110ms + 120ms);
}
@keyframes as-load-up{ to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce){ .as-load-in{ opacity:1; transform:none; animation:none; } }

section{ padding: var(--as-section-pad) var(--as-gutter); }
main > section{ position: relative; }

.as-eyebrow{
  font-family: var(--as-sans);
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--as-copper);
  margin: 0 0 1.1rem;
}
.as-eyebrow--light{ color: var(--as-stone); }

.as-h2{
  font-family: var(--as-serif);
  font-weight: 500;
  font-size: var(--as-h2);
  line-height: 1.14;
  letter-spacing: -.01em;
  max-width: 18ch;
}
.as-h2--light{ color: var(--as-white); }
.as-h2 em{ font-style: italic; color: var(--as-copper); }

/* editorial duotone → color image treatment */
.as-duotone{
  filter: grayscale(85%) sepia(12%) contrast(1.05);
  transition: filter .6s var(--as-ease);
}
.as-duotone:hover, .as-duotone:focus-visible{ filter: grayscale(0%) sepia(0%) contrast(1); }
@media (hover: none){ .as-duotone{ filter: grayscale(0%) sepia(0%); } }

/* reveal-on-scroll */
[data-reveal]{
  opacity: 0;
  transform: translateY(22px);
  transition: opacity .8s var(--as-ease), transform .8s var(--as-ease);
}
[data-reveal].is-visible{ opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce){
  [data-reveal]{ opacity:1; transform:none; }
}

/* buttons */
.as-btn{
  position: relative;
  display:inline-flex;
  align-items:center;
  gap:.7rem;
  padding: .95rem 1.9rem;
  font-size: .92rem;
  font-weight: 600;
  letter-spacing:.01em;
  text-decoration:none;
  border-radius: var(--as-radius);
  overflow: hidden;
  transition: background var(--as-fast) var(--as-ease), color var(--as-fast) var(--as-ease), border-color var(--as-fast) var(--as-ease), transform var(--as-fast) var(--as-ease);
}
.as-btn span{ position:relative; z-index:1; }
.as-btn__arrow{
  position: relative; z-index:1;
  width: 15px; height: 10px; flex-shrink:0;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 10'%3E%3Cpath fill='%23000' d='M10.3.3 15 5l-4.7 4.7-1.4-1.4L11.2 6H0V4h11.2L8.9 1.7z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 10'%3E%3Cpath fill='%23000' d='M10.3.3 15 5l-4.7 4.7-1.4-1.4L11.2 6H0V4h11.2L8.9 1.7z'/%3E%3C/svg%3E") center/contain no-repeat;
  transition: transform var(--as-fast) var(--as-ease);
}
.as-btn:hover .as-btn__arrow{ transform: translateX(4px); }
.as-btn--primary{
  background: var(--as-ink);
  color: var(--as-porcelain);
  border: 1px solid var(--as-ink);
}
.as-btn--primary:hover{ background: var(--as-copper); border-color: var(--as-copper); transform: translateY(-1px); }
.as-btn--ghost{
  background: transparent;
  color: var(--as-ink);
  border: 1px solid var(--as-ink-15);
}
.as-btn--ghost:hover{ border-color: var(--as-ink); background: var(--as-ink-08); }
@media (prefers-reduced-motion: reduce){ .as-btn:hover{ transform:none; } }

/* ============ HEADER ============ */
.as-header{
  position: sticky; top:0; z-index: 40;
  background: rgba(250,248,244,.86);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--as-ink-08);
}
.as-header__inner{
  max-width: var(--as-maxw);
  margin: 0 auto;
  padding: 1.1rem var(--as-gutter);
  display:flex; align-items:center; justify-content:space-between;
}
.as-header__mark{ display:flex; align-items:baseline; gap:.6rem; text-decoration:none; }
.as-header__mark-index{ font-family: var(--as-serif); font-size:1rem; color: var(--as-copper); }
.as-header__mark-text{ font-family: var(--as-serif); font-weight:500; font-size:1.05rem; color: var(--as-ink); }
.as-header__mark-tm{ font-size:.6em; }
.as-header__cta{
  font-size:.85rem; font-weight:600; text-decoration:none;
  padding:.55rem 1.2rem; border:1px solid var(--as-ink); border-radius: var(--as-radius);
  transition: background var(--as-fast), color var(--as-fast);
}
.as-header__cta:hover{ background: var(--as-ink); color: var(--as-porcelain); }

/* ============ 01 HERO ============ */
.as-hero{
  padding-top: clamp(3rem, 6vw, 5.5rem);
  padding-bottom: clamp(3rem, 6vw, 5.5rem);
  background: var(--as-porcelain);
}
.as-hero__grid{
  max-width: var(--as-maxw); margin:0 auto;
  display:grid; grid-template-columns: 1.05fr 1fr;
  gap: clamp(2.5rem, 5vw, 5rem);
  align-items:center;
}
.as-hero__headline{
  font-family: var(--as-serif); font-weight:500;
  font-size: var(--as-h1); line-height:1.06; letter-spacing:-.015em;
  margin: 0 0 1.5rem;
  max-width: 13ch;
}
.as-hero__headline em{ font-style: italic; color: var(--as-copper); }
.as-hero__lede{ max-width: 42ch; color: var(--as-ink-70); font-size: 1.05rem; margin-bottom: 2.2rem; }
.as-hero__actions{ display:flex; flex-wrap:wrap; gap:1rem; margin-bottom: 1.6rem; }
.as-hero__trust{ font-size:.85rem; color: var(--as-ink-50); }

.as-hero__visual{ position:relative; min-height: 520px; }
.as-hero__frame{
  position:absolute; overflow:hidden; border-radius: var(--as-radius);
  box-shadow: 0 30px 60px -25px var(--as-ink-15);
}
.as-hero__frame img{ width:100%; height:100%; object-fit:cover; }
.as-hero__frame--main{ top:0; right:0; width:78%; height:420px; }
.as-hero__frame--secondary{ left:0; bottom:0; width:52%; height:230px; border: 6px solid var(--as-porcelain); z-index:2; }

.as-hero__index{
  position:absolute; left:-6px; top:38%;
  background: var(--as-white); padding: 1.4rem 1.6rem;
  box-shadow: 0 20px 45px -22px var(--as-ink-15);
  border-radius: var(--as-radius);
  width: 190px;
  z-index:3;
}
.as-hero__index-title{ font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color: var(--as-sage); margin-bottom:.85rem; }
.as-hero__index-list li{ display:flex; align-items:baseline; gap:.6rem; font-size:.92rem; padding:.35rem 0; border-top:1px solid var(--as-ink-08); }
.as-hero__index-list li:first-child{ border-top:none; }
.as-hero__index-list span{ font-family: var(--as-serif); font-style:italic; color: var(--as-copper); font-size:.85rem; }

.as-hero__vertical-label{
  position:absolute; right:-2.4rem; top:0; bottom:0;
  writing-mode: vertical-rl;
  font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color: var(--as-ink-50);
  display:flex; align-items:center;
}
.as-hero__lines{ position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.as-hero__lines line, .as-hero__lines circle{ stroke: var(--as-ink-15); stroke-width:1; }
.as-hero__lines circle{ fill: var(--as-copper); stroke:none; }

@media (max-width: 980px){
  .as-hero__grid{ grid-template-columns: 1fr; }
  .as-hero__visual{ min-height: 420px; margin-top: 1rem; }
  .as-hero__vertical-label{ display:none; }
}
@media (max-width: 560px){
  .as-hero__index{ position:static; width:auto; margin-top:1rem; }
  .as-hero__visual{ min-height: 300px; }
}

/* ============ 02 LEDGER / MARQUEE ============ */
.as-ledger{
  background: var(--as-ink); color: var(--as-white);
  padding-top: clamp(3.5rem, 6vw, 5rem);
  padding-bottom: clamp(3.5rem, 6vw, 5rem);
}
.as-ledger__statement{
  max-width: 780px; margin: 0 auto 3.2rem;
  text-align:center;
  font-family: var(--as-serif); font-style:italic; font-weight:400;
  font-size: clamp(1.3rem, 1rem + 1.3vw, 2rem);
  line-height:1.4; color: var(--as-parchment);
}
.as-marquee{ overflow:hidden; position:relative; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.as-marquee__track{
  display:inline-flex; white-space:nowrap;
  animation: as-marquee-scroll 34s linear infinite;
}
.as-marquee[data-paused] .as-marquee__track{ animation-play-state: paused; }
.as-marquee__item{
  font-family: var(--as-serif); font-size: clamp(1.4rem, 1rem + 2vw, 2.6rem);
  padding: 0 2.2rem; color: var(--as-white-70);
  position:relative;
}
.as-marquee__item::after{ content:"◆"; font-size:.7rem; color: var(--as-copper); margin-left: 2.2rem; }
@keyframes as-marquee-scroll{ from{ transform: translateX(0);} to{ transform: translateX(-100%);} }
@media (prefers-reduced-motion: reduce){ .as-marquee__track{ animation: none; } .as-marquee{ overflow-x:auto; } }

/* ============ 03 RECOGNITION GAP ============ */
.as-gap{ background: var(--as-porcelain); }
.as-gap__grid{
  max-width: var(--as-maxw); margin:0 auto;
  display:grid; grid-template-columns: .85fr 1.15fr; gap: clamp(2.5rem,5vw,5rem);
  align-items:start;
}
.as-gap__image{ position:sticky; top:6.5rem; aspect-ratio: 4/5; overflow:hidden; border-radius: var(--as-radius); }
.as-gap__image img{ width:100%; height:100%; object-fit:cover; }
.as-gap__list{ margin-top: 2.6rem; }
.as-gap__list li{
  display:flex; gap: 1.6rem;
  padding: 1.6rem 0; border-top: 1px solid var(--as-ink-15);
}
.as-gap__list li:last-child{ border-bottom: 1px solid var(--as-ink-15); }
.as-gap__list li:nth-child(even){ margin-left: 2.2rem; }
.as-gap__num{ font-family: var(--as-serif); font-style:italic; color: var(--as-copper); font-size:1.1rem; flex-shrink:0; }
.as-gap__list p{ font-size:1.08rem; color: var(--as-ink-70); max-width: 46ch; }

@media (max-width: 900px){
  .as-gap__grid{ grid-template-columns:1fr; }
  .as-gap__image{ position:static; aspect-ratio: 16/10; }
  .as-gap__list li:nth-child(even){ margin-left:0; }
}

/* ============ 04 BEFORE / AFTER ============ */
.as-shift{ background: var(--as-parchment); }
.as-shift__intro{ max-width: var(--as-maxw); margin: 0 auto 3.5rem; text-align:center; }
.as-shift__intro .as-h2{ margin:0 auto; }
.as-shift__stage{
  max-width: var(--as-maxw); margin:0 auto;
  display:grid; grid-template-columns: 1fr .95fr; gap: clamp(2.5rem,5vw,5rem);
  align-items:center;
}
.as-shift__visual{ position:relative; aspect-ratio: 4/5; border-radius: var(--as-radius); overflow:hidden; box-shadow: 0 30px 60px -28px var(--as-ink-15); }
.as-shift__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition: opacity var(--as-med) var(--as-ease); }
.as-shift__img--after{ opacity:0; }
.as-shift[data-state="after"] .as-shift__img--before,
.as-shift__stage[data-state="after"] .as-shift__img--before{ opacity:0; }

.as-shift__toggle{ position:relative; display:inline-flex; background: var(--as-white); border-radius: 999px; padding: 4px; margin-bottom: 2.2rem; }
.as-shift__toggle-btn{ position:relative; z-index:2; padding:.65rem 1.5rem; font-size:.88rem; font-weight:600; border-radius:999px; color: var(--as-ink-50); transition: color var(--as-fast); }
.as-shift__toggle-btn.is-active{ color: var(--as-white); }
.as-shift__toggle-thumb{
  position:absolute; top:4px; left:4px; bottom:4px; width: calc(50% - 4px);
  background: var(--as-ink); border-radius:999px;
  transition: transform var(--as-med) var(--as-ease);
}
.as-shift__toggle[data-pos="after"] .as-shift__toggle-thumb{ transform: translateX(100%); }

.as-shift__list{ display:flex; flex-direction:column; gap: 1rem; }
.as-shift__list li{
  font-size: 1.1rem; padding: .9rem 1.3rem;
  background: var(--as-white); border-left: 3px solid var(--as-stone);
  border-radius: var(--as-radius);
}
.as-shift__list--after li{ border-left-color: var(--as-copper); }

@media (max-width: 900px){ .as-shift__stage{ grid-template-columns:1fr; } }

/* ============ 05 FRAMEWORK ============ */
.as-framework{ background: var(--as-porcelain); }
.as-framework__intro{ max-width: var(--as-maxw); margin: 0 auto 3.5rem; }
.as-framework__stage{
  max-width: var(--as-maxw); margin:0 auto;
  display:grid; grid-template-columns: .62fr 1.38fr; gap: clamp(2rem,4vw,4rem);
}
.as-framework__rail{ position:relative; }
.as-framework__rail ol{ position:relative; z-index:2; display:flex; flex-direction:column; gap: .3rem; }
.as-framework__rail-btn{
  display:flex; align-items:center; gap:1rem; width:100%; text-align:left;
  padding: 1.05rem .5rem; border-radius: var(--as-radius);
  transition: background var(--as-fast);
}
.as-framework__rail-btn:hover{ background: var(--as-ink-08); }
.as-framework__rail-num{ font-family: var(--as-serif); font-style:italic; font-size:1.05rem; color: var(--as-ink-50); width: 2ch; transition: color var(--as-fast); }
.as-framework__rail-label{ font-weight:600; color: var(--as-ink-50); transition: color var(--as-fast); }
.as-framework__rail-btn.is-active .as-framework__rail-num,
.as-framework__rail-btn.is-active .as-framework__rail-label{ color: var(--as-ink); }
.as-framework__rail-btn.is-active .as-framework__rail-label{ color: var(--as-copper); }
.as-framework__rail-line{ position:absolute; left: 1.55rem; top: 1.4rem; bottom: 1.4rem; width:1px; background: var(--as-ink-15); }
.as-framework__rail-line span{ display:block; width:100%; background: var(--as-copper); height: 20%; transition: transform var(--as-med) var(--as-ease); transform: translateY(0); }

.as-framework__panels{ position:relative; }
.as-framework__panel{ display:none; }
.as-framework__panel.is-active{ display:block; animation: as-fade-up .5s var(--as-ease); }
.as-framework__panel-num{ font-size:.8rem; letter-spacing:.1em; color: var(--as-sage); margin-bottom:.9rem; }
.as-framework__panel h3{ font-family: var(--as-serif); font-weight:500; font-size: var(--as-h3); margin-bottom: .9rem; }
.as-framework__panel > p:not(.as-framework__panel-num):not(.as-framework__panel-outcome){ font-size:1.1rem; color: var(--as-ink-70); max-width: 48ch; margin-bottom:1.1rem; }
.as-framework__panel-outcome{ font-size:.95rem; color: var(--as-copper); font-weight:600; margin-bottom: 1.8rem; }
.as-framework__panel img{ width:100%; aspect-ratio: 16/8; object-fit:cover; border-radius: var(--as-radius); }

@keyframes as-fade-up{ from{ opacity:0; transform: translateY(10px);} to{ opacity:1; transform:none; } }

@media (max-width: 900px){
  .as-framework__stage{ grid-template-columns:1fr; }
  .as-framework__rail-line{ display:none; }
  .as-framework__rail ol{ flex-direction:row; flex-wrap:wrap; gap:.5rem; }
  .as-framework__rail-btn{ width:auto; padding:.6rem .9rem; border:1px solid var(--as-ink-15); }
}

/* ============ 06 ARCHITECTURE ============ */
.as-architecture{ background: var(--as-parchment); }
.as-architecture__intro{ max-width: var(--as-maxw); margin:0 auto 3.5rem; text-align:center; }
.as-architecture__intro .as-h2{ margin:0 auto; }
.as-architecture__stage{ max-width: var(--as-maxw); margin:0 auto; position:relative; }
.as-architecture__image{ aspect-ratio: 16/9; border-radius: var(--as-radius); overflow:hidden; }
.as-architecture__image img{ width:100%; height:100%; object-fit:cover; }
.as-architecture__labels{ display:none; }

@media (min-width: 901px){
  .as-architecture__labels{ display:block; }
  .as-architecture__label{
    position:absolute; display:flex; align-items:center; gap:.6rem;
    background: var(--as-white); padding: .75rem 1.1rem; border-radius: var(--as-radius);
    font-size:.88rem; font-weight:600; box-shadow: 0 16px 34px -18px var(--as-ink-15);
    max-width: 210px;
  }
  .as-architecture__label span{ font-family: var(--as-serif); font-style:italic; color: var(--as-copper); }
  .as-architecture__label--1{ top: -1.6rem; left: 4%; }
  .as-architecture__label--2{ top: 8%; right: 2%; }
  .as-architecture__label--3{ top: 42%; left: -2rem; }
  .as-architecture__label--4{ top: 46%; right: -1.6rem; }
  .as-architecture__label--5{ bottom: 6%; left: 6%; }
  .as-architecture__label--6{ bottom: -1.6rem; right: 6%; }
}
@media (max-width: 900px){
  .as-architecture__labels{ display:flex; flex-direction:column; gap:.7rem; margin-top:2rem; }
  .as-architecture__label{ display:flex; gap:.8rem; padding: .9rem 0; border-top:1px solid var(--as-ink-15); font-weight:600; }
  .as-architecture__label span{ font-family: var(--as-serif); font-style:italic; color: var(--as-copper); }
}

/* ============ 07 ROADMAP ============ */
.as-roadmap{ background: var(--as-porcelain); }
.as-roadmap__intro{ max-width: var(--as-maxw); margin:0 auto 3rem; text-align:center; }
.as-roadmap__intro .as-h2{ margin:0 auto; }
.as-roadmap__list{ max-width: 920px; margin:0 auto; border-top:1px solid var(--as-ink-15); }
.as-roadmap__item{ border-bottom:1px solid var(--as-ink-15); }
.as-roadmap__head{ width:100%; display:flex; align-items:center; gap: 1.6rem; padding: 1.9rem .5rem; text-align:left; }
.as-roadmap__phase-num{ font-family: var(--as-serif); font-style:italic; font-size:1.6rem; color: var(--as-copper); width:3ch; }
.as-roadmap__phase-copy{ flex:1; display:flex; flex-wrap:wrap; align-items:baseline; gap: .3rem 1rem; }
.as-roadmap__phase-title{ font-family: var(--as-serif); font-weight:500; font-size: 1.35rem; }
.as-roadmap__phase-weeks{ font-size:.85rem; color: var(--as-ink-50); }
.as-roadmap__chevron{ width: 12px; height:12px; position:relative; flex-shrink:0; }
.as-roadmap__chevron::before, .as-roadmap__chevron::after{ content:""; position:absolute; background: var(--as-ink); }
.as-roadmap__chevron::before{ width:12px; height:1.5px; top:5px; }
.as-roadmap__chevron::after{ width:1.5px; height:12px; left:5px; transition: transform var(--as-fast) var(--as-ease); }
.as-roadmap__item.is-open .as-roadmap__chevron::after{ transform: rotate(90deg); opacity:0; }

.as-roadmap__body{ display:grid; grid-template-rows: 0fr; transition: grid-template-rows var(--as-med) var(--as-ease); }
.as-roadmap__item.is-open .as-roadmap__body{ grid-template-rows: 1fr; }
.as-roadmap__body-inner{ overflow:hidden; padding: 0 .5rem 0 4.6rem; }
.as-roadmap__item.is-open .as-roadmap__body-inner{ padding-bottom: 2.4rem; }
.as-roadmap__body-inner p{ color: var(--as-ink-70); max-width: 56ch; margin-bottom: .8rem; }
.as-roadmap__output{ color: var(--as-copper) !important; font-weight:600; font-size:.92rem; }
.as-roadmap__body-inner img{ margin-top: 1.2rem; width: 100%; max-width: 420px; aspect-ratio: 4/3; object-fit:cover; border-radius: var(--as-radius); }

@media (max-width: 600px){
  .as-roadmap__body-inner{ padding-left: .5rem; }
}

/* ============ 08 STUDIO ============ */
.as-studio{ background: var(--as-ink); color: var(--as-white); overflow:hidden; }
.as-studio__grid{ max-width: var(--as-maxw); margin:0 auto; display:grid; grid-template-columns: .9fr 1.1fr; gap: clamp(2.5rem,5vw,5rem); align-items:center; }
.as-studio__images{ position:relative; }
.as-studio__img--main{ width:100%; aspect-ratio: 4/5; object-fit:cover; border-radius: var(--as-radius); }
.as-studio__img--sub{
  position:absolute; width:46%; aspect-ratio: 5/4; object-fit:cover;
  bottom: -1.8rem; left: -1.8rem; border: 6px solid var(--as-ink); border-radius: var(--as-radius);
  box-shadow: 0 30px 50px -20px rgba(0,0,0,.55);
}
.as-studio__content .as-h2{ max-width: 16ch; margin-bottom: 2.2rem; }
.as-studio__focus{ display:flex; flex-direction:column; gap:.4rem; margin-bottom: 2.4rem; }
.as-studio__focus-btn{ text-align:left; padding: 1.1rem 0; border-top: 1px solid var(--as-white-15); }
.as-studio__focus-btn span{ display:block; font-weight:600; font-size:1.05rem; color: var(--as-white-70); transition: color var(--as-fast); }
.as-studio__focus-btn p{ font-size:.92rem; color: var(--as-white-50); max-height:0; overflow:hidden; opacity:0; transition: max-height var(--as-med) var(--as-ease), opacity var(--as-fast); margin-top:0; }
.as-studio__focus-btn.is-active span{ color: var(--as-copper); }
.as-studio__focus-btn.is-active p{ max-height: 4rem; opacity:1; margin-top:.5rem; }
.as-studio__quote{ font-family: var(--as-serif); font-style:italic; font-size:1.2rem; color: var(--as-parchment); max-width: 46ch; line-height:1.5; }

@media (max-width: 900px){
  .as-studio__grid{ grid-template-columns:1fr; }
  .as-studio__img--sub{ position:static; width:60%; margin-top:1rem; }
}

/* ============ 09 FIT ============ */
.as-fit{ background: var(--as-parchment); }
.as-fit__grid{ max-width: var(--as-maxw); margin:0 auto; display:grid; grid-template-columns: 1.15fr .85fr; gap: clamp(2.5rem,5vw,5rem); align-items:center; }
.as-fit__list--stagger{ margin: 2.2rem 0; display:flex; flex-direction:column; gap:.2rem; }
.as-fit__list--stagger li{
  font-size:1.15rem; font-family: var(--as-serif); padding: .7rem 0; border-top: 1px solid var(--as-ink-15);
}
.as-fit__list--stagger li:nth-child(2n){ margin-left: 1.6rem; }
.as-fit__list--stagger li:last-child{ border-bottom:1px solid var(--as-ink-15); }
.as-fit__note{ font-size:.98rem; color: var(--as-ink-50); font-style:italic; max-width:44ch; }
.as-fit__image{ aspect-ratio: 4/5; border-radius: var(--as-radius); overflow:hidden; }
.as-fit__image img{ width:100%; height:100%; object-fit:cover; }

@media (max-width: 900px){ .as-fit__grid{ grid-template-columns:1fr; } .as-fit__image{ order:-1; } }

/* ============ 10 PROOF / TESTIMONIALS ============ */
.as-proof{ background: var(--as-porcelain); }
.as-proof__intro{ max-width: var(--as-maxw); margin:0 auto 3.5rem; text-align:center; }
.as-proof__intro .as-h2{ margin:0 auto; }
.as-proof__slider{ max-width: 980px; margin:0 auto; }
.as-proof__track{ position:relative; min-height: 380px; }
.as-proof__slide{
  display:none; grid-template-columns: .55fr 1.45fr; gap: 2.6rem; align-items:center;
  animation: as-fade-up .55s var(--as-ease);
}
.as-proof__slide.is-active{ display:grid; }
.as-proof__portrait{ width:100%; aspect-ratio: 4/5; object-fit:cover; border-radius: var(--as-radius); }
.as-proof__profession{ font-size:.85rem; letter-spacing:.06em; text-transform:uppercase; color: var(--as-sage); margin-bottom: 1rem; }
.as-proof__body p{ margin-bottom:.7rem; color: var(--as-ink-70); }
.as-proof__body blockquote{ font-family: var(--as-serif); font-style:italic; font-size:1.25rem; color: var(--as-ink); margin: 1.4rem 0 .8rem; line-height:1.5; }
.as-proof__name{ font-weight:600; color: var(--as-ink) !important; }
.as-proof__nav{ display:flex; gap:.6rem; justify-content:center; margin-top: 2.4rem; }
.as-proof__dot{ width: 2.4rem; height: 2.4rem; border-radius:50%; border:1px solid var(--as-ink-15); font-size:.78rem; transition: background var(--as-fast), color var(--as-fast); }
.as-proof__dot.is-active{ background: var(--as-ink); color: var(--as-porcelain); border-color: var(--as-ink); }
.as-proof__disclaimer{ text-align:center; font-size:.78rem; color: var(--as-ink-50); margin-top:1rem; }

@media (max-width: 760px){ .as-proof__slide{ grid-template-columns:1fr; } .as-proof__portrait{ max-width: 160px; } }

/* ============ 11 DOSSIER ============ */
.as-dossier{ background: var(--as-white); }
.as-dossier__grid{ max-width: var(--as-maxw); margin:0 auto; display:grid; grid-template-columns: .8fr 1.2fr; gap: clamp(2.5rem,5vw,5rem); align-items:center; }
.as-dossier__images{ position:relative; }
.as-dossier__img--main{ width:100%; aspect-ratio: 4/5; object-fit:cover; border-radius: var(--as-radius); }
.as-dossier__img--detail{ position:absolute; width:44%; aspect-ratio:1/1; object-fit:cover; top:-1.6rem; right:-1.8rem; border:6px solid var(--as-white); box-shadow: 0 24px 44px -20px var(--as-ink-15); border-radius: var(--as-radius); }
.as-dossier__credentials{ margin: 1.6rem 0; display:flex; flex-direction:column; gap:.55rem; }
.as-dossier__credentials li{ padding-left: 1.3rem; position:relative; color: var(--as-ink-70); }
.as-dossier__credentials li::before{ content:"—"; position:absolute; left:0; color: var(--as-copper); }
.as-dossier__quote{ font-family: var(--as-serif); font-style:italic; font-size:1.2rem; color: var(--as-ink); max-width: 46ch; margin: 1.4rem 0; }
.as-dossier__bio{ color: var(--as-ink-70); max-width: 54ch; margin-bottom: 2rem; }
.as-dossier__markers{ display:flex; gap: 2.4rem; margin-bottom: 1.6rem; }
.as-dossier__markers strong{ display:block; font-family: var(--as-serif); font-size:1.9rem; color: var(--as-copper); }
.as-dossier__markers span{ font-size:.8rem; color: var(--as-ink-50); }
.as-dossier__sign{ font-family: var(--as-serif); font-style:italic; font-size:1.3rem; color: var(--as-ink-50); }

@media (max-width: 900px){ .as-dossier__grid{ grid-template-columns:1fr; } .as-dossier__img--detail{ position:static; width:50%; margin-top:1rem; } }

/* ============ 12 OFFER ============ */
.as-offer{ background: var(--as-parchment); }
.as-offer__grid{ max-width: var(--as-maxw); margin:0 auto; display:grid; grid-template-columns: 1.2fr .8fr; gap: clamp(2.5rem,5vw,4.5rem); align-items:start; }
.as-offer__rows{ margin-top: 2.2rem; }
.as-offer__rows li{ display:flex; align-items:center; gap:1.4rem; padding: 1.15rem 0; border-top: 1px solid var(--as-ink-15); }
.as-offer__rows li:last-child{ border-bottom: 1px solid var(--as-ink-15); }
.as-offer__row-num{ font-family: var(--as-serif); font-style:italic; color: var(--as-copper); width:3ch; }
.as-offer__row-title{ font-weight:600; }

.as-offer__panel{
  position: sticky; top: 6.5rem;
  background: var(--as-ink); color: var(--as-white);
  padding: 2.6rem; border-radius: var(--as-radius);
  box-shadow: 0 30px 60px -25px var(--as-ink-15);
}
.as-offer__panel-label{ font-family: var(--as-serif); font-size:1.2rem; margin-bottom:.2rem; }
.as-offer__panel-sub{ font-size:.85rem; color: var(--as-white-50); margin-bottom: 1.8rem; }
.as-offer__price{ font-family: var(--as-serif); font-size: 3rem; margin-bottom:.2rem; }
.as-offer__terms{ font-size:.85rem; color: var(--as-white-50); margin-bottom: 1.8rem; }
.as-offer__cta{ width:100%; justify-content:center; background: var(--as-copper); border-color: var(--as-copper); }
.as-offer__cta:hover{ background: var(--as-white); color: var(--as-ink); border-color: var(--as-white); }
.as-offer__note{ font-size:.82rem; color: var(--as-stone); margin: 1.1rem 0 .8rem; text-align:center; }
.as-offer__reassurance{ font-size:.82rem; color: var(--as-white-50); line-height:1.6; }

@media (max-width: 900px){ .as-offer__grid{ grid-template-columns:1fr; } .as-offer__panel{ position:static; } }

/* ============ 13 DECISION ============ */
.as-decision{ background: var(--as-porcelain); }
.as-decision__grid{ max-width: var(--as-maxw); margin:0 auto; display:grid; grid-template-columns: .8fr 1.2fr; gap: clamp(2.5rem,5vw,5rem); align-items:center; }
.as-decision__image{ aspect-ratio: 4/5; border-radius: var(--as-radius); overflow:hidden; }
.as-decision__image img{ width:100%; height:100%; object-fit:cover; }
.as-decision__content .as-h2{ max-width: 16ch; margin-bottom: 2rem; }
.as-decision__list li{ font-size: 1.1rem; padding: 1rem 0; border-top:1px solid var(--as-ink-15); color: var(--as-ink-70); }
.as-decision__list li:last-child{ border-bottom:1px solid var(--as-ink-15); }

@media (max-width: 900px){ .as-decision__grid{ grid-template-columns:1fr; } .as-decision__image{ order:-1; } }

/* ============ 14 FAQ ============ */
.as-faq{ background: var(--as-white); }
.as-faq__grid{ max-width: var(--as-maxw); margin:0 auto; display:grid; grid-template-columns: .75fr 1.25fr; gap: clamp(2.5rem,5vw,5rem); align-items:start; }
.as-faq__image{ position:sticky; top:6.5rem; aspect-ratio: 4/5; border-radius: var(--as-radius); overflow:hidden; }
.as-faq__image img{ width:100%; height:100%; object-fit:cover; }
.as-faq__list .as-h2{ margin-bottom: 2rem; }
.as-faq__item{ border-top: 1px solid var(--as-ink-15); }
.as-faq__item:last-child{ border-bottom: 1px solid var(--as-ink-15); }
.as-faq__q{ width:100%; display:flex; justify-content:space-between; align-items:center; gap:1rem; padding: 1.4rem 0; text-align:left; font-weight:600; font-size:1.02rem; }
.as-faq__icon{ position:relative; width:14px; height:14px; flex-shrink:0; }
.as-faq__icon::before, .as-faq__icon::after{ content:""; position:absolute; background: var(--as-ink); }
.as-faq__icon::before{ width:14px; height:1.5px; top:6px; }
.as-faq__icon::after{ width:1.5px; height:14px; left:6px; transition: transform var(--as-fast); }
.as-faq__item.is-open .as-faq__icon::after{ transform: rotate(90deg); opacity:0; }
.as-faq__a{ display:grid; grid-template-rows:0fr; transition: grid-template-rows var(--as-med) var(--as-ease); }
.as-faq__item.is-open .as-faq__a{ grid-template-rows:1fr; }
.as-faq__a p{ overflow:hidden; color: var(--as-ink-70); padding-right: 2rem; }
.as-faq__item.is-open .as-faq__a p{ padding-bottom: 1.4rem; }

@media (max-width: 900px){ .as-faq__grid{ grid-template-columns:1fr; } .as-faq__image{ display:none; } }

/* ============ 15 FINAL ============ */
.as-final{ position:relative; padding: clamp(6rem,12vw,10rem) var(--as-gutter); overflow:hidden; text-align:center; }
.as-final__bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.as-final__overlay{ position:absolute; inset:0; background: linear-gradient(180deg, rgba(17,24,32,.82), rgba(17,24,32,.92)); z-index:1; }
.as-final__lines{ position:absolute; inset:0; width:100%; height:100%; z-index:1; }
.as-final__lines line{ stroke: var(--as-white-15); stroke-width:1; }
.as-final__content{ position:relative; z-index:2; max-width: 720px; margin:0 auto; color: var(--as-white); }
.as-final__headline{ font-family: var(--as-serif); font-weight:500; font-size: var(--as-h2); line-height:1.15; margin: .8rem 0 1.4rem; }
.as-final__lede{ color: var(--as-white-70); max-width: 46ch; margin: 0 auto 2.2rem; }
.as-final__reassurance{ display:flex; justify-content:center; gap: 1.8rem; flex-wrap:wrap; margin-top: 2.2rem; font-size:.85rem; color: var(--as-stone); }
.as-final__reassurance li{ position:relative; padding-left: 1.1rem; }
.as-final__reassurance li::before{ content:""; position:absolute; left:0; top:.5em; width:5px; height:5px; border-radius:50%; background: var(--as-copper); }

/* ============ FOOTER ============ */
.as-footer{
  background: var(--as-ink); color: var(--as-stone);
  padding: 2.4rem var(--as-gutter);
  display:flex; flex-wrap:wrap; gap:1rem 2rem; align-items:center; justify-content:space-between;
  font-size:.85rem;
}
.as-footer__name{ font-family: var(--as-serif); color: var(--as-white); }
.as-footer__links{ display:flex; gap:1.4rem; }
.as-footer__links a, .as-footer__social a{ text-decoration:none; color: var(--as-stone); transition: color var(--as-fast); }
.as-footer__links a:hover, .as-footer__social a:hover{ color: var(--as-white); }
.as-footer__social{ display:flex; gap:1.2rem; }


.header, .footer{display:none!important}

/* Cinematic replacement for section 02 */
.as-ledger--cinematic{padding:0!important;background:#111820;color:#fff;overflow:hidden}
.as-ledger--cinematic .as-ledger__visual{position:relative;min-height:clamp(360px,55vw,720px);display:flex;align-items:flex-end;overflow:hidden}
.as-ledger--cinematic .as-ledger__visual>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.65) contrast(1.06)}
.as-ledger--cinematic .as-ledger__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,24,32,.08),rgba(17,24,32,.88))}
.as-ledger--cinematic .as-ledger__statement{position:relative;z-index:2;width:min(1100px,calc(100% - 48px));margin:0 auto;padding:0 0 clamp(46px,7vw,92px);font:400 clamp(1.7rem,3.7vw,4rem)/1.08 var(--as-serif);text-align:center;color:#fff}
.as-ledger--cinematic .as-marquee{border-top:1px solid rgba(255,255,255,.17);border-bottom:1px solid rgba(255,255,255,.17);padding:24px 0;background:#111820}
.as-ledger--cinematic .as-marquee__item{color:rgba(255,255,255,.72)}
@media(max-width:767px){.as-ledger--cinematic .as-ledger__visual{min-height:460px}.as-ledger--cinematic .as-ledger__statement{text-align:left}}

@media(max-width:767px){section[class^="as-"],section[class*=" as-"]{padding-top:var(--as-pad-mobile,var(--as-section-pad))!important;padding-bottom:var(--as-pad-mobile,var(--as-section-pad))!important}}