html.lenis, html.lenis body { height: auto; }
    .lenis.lenis-smooth { scroll-behavior: auto !important; }
    .lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }

    .hero-bg video,
    .hero-bg img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      max-width: none;
    }

    /* —— Letter float / micro-motion —— */
    .char {
      display: inline-block;
      will-change: transform;
    }
    .char.is-space { width: 0.28em; }
    .live-float .char {
      animation: char-float 3.2s ease-in-out infinite;
      animation-delay: calc(var(--i, 0) * 0.07s);
    }
    @keyframes char-float {
      0%, 100% { transform: translateY(0) rotate(0deg); }
      35% { transform: translateY(-2.5px) rotate(-1.2deg); }
      70% { transform: translateY(1.5px) rotate(0.9deg); }
    }
    .topbar-link .pulse,
    .foot-bottom .pulse,
    .wire-pulse,
    .status-dot::after {
      animation: pulse-blink 1.15s steps(2, end) infinite, pulse-glow 2.4s ease-in-out infinite;
    }
    @keyframes pulse-blink {
      0%, 100% { opacity: 1; }
      50% { opacity: 0.15; }
    }
    @keyframes pulse-glow {
      0%, 100% { box-shadow: 0 0 0 0 rgba(237, 111, 92, 0.45); }
      50% { box-shadow: 0 0 0 5px rgba(237, 111, 92, 0); }
    }
    .brand-mark,
    .card .icon,
    .method-ico,
    .nav-cta::after {
      animation: icon-bob 3.6s ease-in-out infinite;
    }
    @keyframes icon-bob {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-3px); }
    }
    .label.live-float .char { animation-duration: 3.8s; }

    /* —— Hero bigger (texte stable : pas de float / scramble / tilt) —— */
    .hero {
      min-height: 0 !important;
      padding-bottom: 28px;
    }
    .hero-grid {
      grid-template-columns: minmax(0, 1.25fr) minmax(240px, 0.75fr) !important;
      gap: 20px !important;
      align-items: start !important;
    }
    .hero-copy {
      padding: 12px 0 8px !important;
      gap: 0;
    }
    .hero-copy .label { margin-bottom: 14px !important; }
    .hero h1,
    .hero .hero-title {
      font-size: clamp(44px, 6.2vw, 88px) !important;
      line-height: 0.98 !important;
      margin-bottom: 16px !important;
      cursor: default;
      transform: none !important;
      letter-spacing: -0.03em;
    }
    .hero h1 em {
      font-family: var(--serif);
      font-style: italic;
      font-weight: 500;
    }
    /* Titre : reveal GSAP une fois — jamais float/scramble en boucle */
    .hero-title {
      perspective: 900px;
    }
    .hero-title.is-preparing {
      opacity: 0 !important;
    }
    .hero-title .h-word {
      display: inline-block;
      overflow: hidden;
      vertical-align: top;
      padding-bottom: 0.08em;
      margin-bottom: -0.08em;
    }
    .hero-title .h-word-inner {
      display: inline-block;
      will-change: transform;
    }
    .hero-title .char {
      display: inline-block !important;
      animation: none !important;
      will-change: transform, opacity;
    }
    .hero .lead .char {
      display: inline !important;
      animation: none !important;
      transform: none !important;
      will-change: auto !important;
    }
    .hero .live-float .char {
      animation: none !important;
    }

    /* —— Micro-labels : typewriter / scramble / ticker (continus) —— */
    .live-type,
    .live-scramble,
    .live-ticker {
      display: inline-block;
      position: relative;
      font-variant-numeric: tabular-nums;
    }
    .topbar .live-type,
    .topbar .live-scramble,
    .annot.live-type,
    .annot.live-scramble,
    .rail-text.live-type,
    .rail-text.live-scramble,
    .sec-rule .live-type,
    .sec-rule .live-scramble,
    .sec-rule .live-ticker {
      white-space: nowrap;
    }
    .live-type::after {
      content: '';
      display: inline-block;
      width: 0.55ch;
      height: 1em;
      margin-left: 0.12em;
      background: var(--coral);
      vertical-align: -0.12em;
      animation: caret-blink 0.9s steps(1, end) infinite;
    }
    @keyframes caret-blink {
      0%, 49% { opacity: 1; }
      50%, 100% { opacity: 0; }
    }
    .live-scramble {
      min-width: 1ch;
    }
    .hero-art .index span {
      transition: color 0.35s ease, opacity 0.35s ease;
      opacity: 0.55;
    }
    .hero-art .index span.on {
      opacity: 1;
    }
    .stat .ring.is-tick {
      font-variant-numeric: tabular-nums;
    }
    .sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }
    .hero-copy .lead {
      max-width: 44ch !important;
      font-size: 16.5px !important;
      margin-bottom: 20px !important;
      color: var(--ink-soft) !important;
    }
    .hero-copy [data-revealed="true"] {
      opacity: 1 !important;
      translate: none !important;
      visibility: visible !important;
    }
    .hero-actions { margin-bottom: 14px !important; }
    .hero-stats { margin-bottom: 10px !important; gap: 16px !important; }
    .hero-foot {
      margin-top: 4px !important;
      padding-top: 12px !important;
    }
    .hero-title, .hero h1 {
      filter: none !important;
      text-rendering: geometricPrecision;
      -webkit-font-smoothing: antialiased;
    }
    .hero-title:not(.is-preparing) {
      opacity: 1;
    }
    .hero-copy {
      position: relative;
      z-index: 2;
      background: linear-gradient(90deg, rgba(var(--paper-rgb), 0.92) 0%, rgba(var(--paper-rgb), 0.78) 70%, transparent 100%);
      border-radius: 2px;
      padding-right: 12px !important;
    }
    .hero-art {
      max-height: none !important;
      height: auto !important;
      min-height: 320px;
      margin-right: 0 !important;
      align-self: stretch;
      background:
        linear-gradient(160deg, rgba(237,111,92,0.12), transparent 55%),
        rgba(247, 241, 222, 0.35);
      border: 1px solid var(--line-soft);
      border-radius: 4px;
      overflow: hidden;
    }
    .hero-art .index {
      position: absolute;
      right: 18px;
      top: 50%;
      transform: translateY(-50%);
      background: rgba(247, 241, 222, 0.92);
      border: 1px solid var(--line);
      padding: 14px 16px;
      border-radius: 10px;
      backdrop-filter: blur(6px);
    }

    /* —— Buttons shine + animated border —— */
    .btn {
      position: relative;
      isolation: isolate;
      overflow: hidden;
      border-radius: 999px;
      z-index: 0;
      transition: transform 0.22s ease, background 0.22s ease, color 0.22s ease, box-shadow 0.22s ease;
    }
    .btn::before {
      content: '';
      position: absolute;
      inset: -2px;
      border-radius: inherit;
      padding: 2px;
      background: conic-gradient(from var(--btn-angle, 0deg), var(--coral), var(--mustard), #7eb8a8, var(--coral));
      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
      animation: btn-spin 4.5s linear infinite, btn-radius 6s ease-in-out infinite;
      z-index: -1;
      opacity: 0.95;
    }
    .btn::after {
      content: '';
      position: absolute;
      inset: 0;
      border-radius: inherit;
      background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,0.45) 48%, transparent 62%);
      background-size: 220% 100%;
      animation: btn-shine 3.8s ease-in-out infinite;
      pointer-events: none;
      z-index: 1;
      mix-blend-mode: soft-light;
    }
    .btn > * { position: relative; z-index: 2; }
    .btn-primary {
      background: linear-gradient(120deg, #ed6f5c 0%, #e25e4a 45%, #f0a35a 120%);
      background-size: 180% 180%;
      animation: btn-grad 5s ease infinite;
      border-color: transparent;
    }
    .btn-ghost {
      background: rgba(247, 241, 222, 0.55);
      backdrop-filter: blur(4px);
    }
    .btn-ghost::after { mix-blend-mode: overlay; opacity: 0.55; }
    @keyframes btn-spin { to { --btn-angle: 360deg; } }
    @property --btn-angle {
      syntax: '<angle>';
      initial-value: 0deg;
      inherits: false;
    }
    @keyframes btn-radius {
      0%, 100% { border-radius: 999px; }
      40% { border-radius: 22px 999px 999px 28px; }
      70% { border-radius: 999px 26px 32px 999px; }
    }
    @keyframes btn-shine {
      0% { background-position: 140% 0; }
      55%, 100% { background-position: -60% 0; }
    }
    @keyframes btn-grad {
      0%, 100% { background-position: 0% 50%; }
      50% { background-position: 100% 50%; }
    }
    .btn:hover { transform: translateY(-2px) scale(1.02); }

    /* —— Doors infinite slider —— */
    .doors-band {
      margin-top: 28px !important;
      overflow: hidden;
      mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
    }
    .doors-track {
      display: flex;
      gap: 18px;
      width: max-content;
      animation: doors-loop 42s linear infinite;
    }
    .doors-band:hover .doors-track { animation-play-state: paused; }
    @keyframes doors-loop {
      from { transform: translateX(0); }
      to { transform: translateX(-50%); }
    }
    .doors-track .card {
      flex: 0 0 300px;
      min-height: 220px;
      text-decoration: none;
      color: inherit;
      position: relative;
    }

    /* —— Cas types : slide du panneau noir entier —— */
    .cases-section {
      padding: 28px 0 40px !important;
    }
    .cases-shell {
      position: relative;
      margin: 0 24px;
    }
    .cases-viewport {
      position: relative;
      overflow: hidden;
      border-radius: 24px;
      touch-action: pan-y;
      cursor: grab;
      background: #15140f;
    }
    .cases-viewport.is-dragging { cursor: grabbing; }
    .cases-track {
      display: flex;
      width: 100%;
      will-change: transform;
      transition: none;
    }
    .cases-panel.work {
      flex: 0 0 100%;
      width: 100%;
      min-width: 100%;
      max-width: 100%;
      margin: 0 !important;
      border-radius: 0 !important;
      padding: 48px 40px 56px !important;
      box-sizing: border-box;
      background:
        radial-gradient(ellipse 80% 60% at 10% 20%, rgba(237,111,92,0.12), transparent 55%),
        radial-gradient(ellipse 60% 50% at 90% 80%, rgba(240,163,90,0.08), transparent 50%),
        #15140f !important;
    }
    .cases-panel.work::after {
      content: '';
      position: absolute;
      inset: 0;
      pointer-events: none;
      background-image:
        linear-gradient(rgba(247,241,222,0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(247,241,222,0.04) 1px, transparent 1px);
      background-size: 48px 48px;
      opacity: 0.55;
      z-index: 0;
    }
    .cases-panel.work > * { position: relative; z-index: 1; }
    .cases-panel .work-grid {
      grid-template-columns: minmax(200px, 0.9fr) minmax(0, 1.35fr) !important;
      gap: 28px !important;
      align-items: stretch;
    }
    .cases-panel .work-copy h2 {
      font-size: clamp(32px, 4vw, 50px) !important;
      margin: 14px 0 14px !important;
    }
    .cases-panel .work-lead {
      font-family: var(--body);
      font-size: 15px;
      line-height: 1.55;
      color: rgba(247, 241, 222, 0.72);
      max-width: 34ch;
      margin: 0 0 22px;
    }
    .work-vignettes {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 16px;
      align-items: stretch;
      min-width: 0;
    }
    .work-vignettes .work-card {
      transform: none !important;
      margin: 0;
      height: 100%;
      display: flex;
      flex-direction: column;
    }
    .work-vignettes .work-card.alt {
      transform: none !important;
    }
    .work-vignettes .work-card:hover {
      transform: translateY(-3px) !important;
    }
    .work-vignettes .work-card .img {
      aspect-ratio: 16 / 10;
      margin-bottom: 14px;
    }
    .work-vignettes .work-card h3 {
      font-size: clamp(18px, 1.8vw, 24px) !important;
    }
    .work-vignettes .work-card p {
      flex: 1;
      margin-bottom: 14px;
      font-size: 13px;
      max-width: none;
    }
    .cases-nav {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 14px;
      margin-top: 18px;
    }
    .cases-nav .nav-btn {
      width: 46px;
      height: 46px;
      border-radius: 50%;
      border: 1px solid var(--line);
      background: var(--bone);
      color: var(--ink);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
    }
    .cases-nav .nav-btn:hover {
      background: var(--coral);
      border-color: var(--coral);
      color: var(--on-coral);
      transform: translateY(-1px);
    }
    .cases-dots {
      display: inline-flex;
      gap: 8px;
      align-items: center;
      padding: 0 8px;
    }
    .cases-dots button {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      border: 0;
      padding: 0;
      background: rgba(var(--ink-rgb), 0.22);
      cursor: pointer;
      transition: background 0.2s ease, transform 0.2s ease;
    }
    .cases-dots button[aria-current="true"] {
      background: var(--coral);
      transform: scale(1.25);
    }
    .work-rule { margin-bottom: 20px !important; }

    /* —— Extra wire strips —— */
    .wire.strip-compact { padding: 16px 0 !important; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); }
    .wire.strip-compact .wire-left { min-width: 120px; }
    .wire { padding-top: 22px !important; padding-bottom: 22px !important; overflow: hidden; }
    .wire-inner {
      grid-template-columns: minmax(160px, 200px) minmax(0, 1fr) !important;
      gap: 20px !important;
      align-items: center;
    }
    .wire-left {
      min-width: 0 !important;
      padding-right: 16px !important;
      overflow: hidden;
    }
    .wire-rows { min-width: 0; overflow: hidden; }
    .wire-row {
      overflow: hidden;
      -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 88%, transparent 100%) !important;
      mask-image: linear-gradient(90deg, #000 0%, #000 88%, transparent 100%) !important;
    }
    .marquee-track {
      padding-inline: 8px;
      gap: 28px !important;
    }
    .wire-item .wire-name { letter-spacing: 0.1em !important; }
    .wire-item .wire-role { letter-spacing: 0.08em !important; }
    .section-header { margin-bottom: 36px !important; }
    .section-header .label { margin-bottom: 16px !important; }
    .about-grid { gap: 40px !important; }
    .about h2 { margin: 18px 0 20px !important; }
    .about .label { margin-bottom: 14px !important; }
    .about .lead { margin-bottom: 22px !important; }
    .about .footer-row { margin-top: 28px !important; }
    .capabilities, .labs, .method, .about { padding-top: 56px !important; padding-bottom: 56px !important; }
    .capabilities-grid {
      gap: 28px !important;
      margin-bottom: 8px;
      align-items: start !important;
    }
    .capabilities-art {
      max-width: 420px !important;
      aspect-ratio: 4 / 3 !important;
    }
    .capabilities-copy h2 { margin: 12px 0 14px !important; }
    .capabilities-copy .label { margin-bottom: 10px !important; }
    .capabilities-copy .lead { margin-bottom: 0 !important; }
    .doors-band {
      margin-top: 24px !important;
      padding-bottom: 8px;
      overflow: hidden;
      -webkit-mask-image: linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent);
      mask-image: linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent);
    }
    .doors-track .card {
      flex: 0 0 270px !important;
      min-height: 210px !important;
      padding: 22px 20px 26px !important;
    }
    .doors-track .card h3 {
      font-size: 18px !important;
      line-height: 1.15 !important;
      margin-bottom: 10px !important;
      white-space: normal !important;
    }
    .doors-track .card p {
      font-size: 13.5px !important;
      line-height: 1.45 !important;
      display: -webkit-box;
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    section.tight { padding: 56px 0 !important; }

    /* —— Journal / Actus —— */
    .journal { padding: 72px 0 !important; }
    .journal-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 22px;
      margin-top: 28px !important;
      align-items: stretch;
    }
    .journal-card {
      display: flex;
      flex-direction: column;
      height: 100%;
      min-height: 420px;
      background: var(--bone);
      border: 1px solid var(--line-soft);
      border-radius: 18px;
      overflow: hidden;
      text-decoration: none;
      color: inherit;
      transition: transform 0.25s ease, box-shadow 0.25s ease;
    }
    .journal-card:hover {
      transform: translateY(-3px);
      box-shadow: var(--shadow);
    }
    .journal-card .thumb {
      flex: 0 0 180px;
      height: 180px;
      min-height: 180px;
      max-height: 180px;
      overflow: hidden;
      background: var(--paper-dark);
    }
    .journal-card .thumb img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      display: block;
    }
    .journal-card .body {
      padding: 22px 22px 26px;
      display: flex;
      flex-direction: column;
      gap: 10px;
      flex: 1 1 auto;
      min-height: 0;
    }
    .journal-card .cat {
      font-family: var(--mono);
      font-size: 11px;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--coral);
      font-weight: 500;
    }
    .journal-card h3 {
      font-family: var(--sans);
      font-size: 20px;
      font-weight: 700;
      letter-spacing: -0.02em;
      line-height: 1.25;
      margin: 0;
      display: -webkit-box;
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical;
      overflow: hidden;
      min-height: 3.75em;
    }
    .journal-card p {
      margin: 0;
      color: var(--ink-mute);
      font-size: 14.5px;
      line-height: 1.5;
      flex: 1;
      display: -webkit-box;
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .journal-card .meta {
      font-size: 12px;
      color: var(--ink-faint);
      font-family: var(--mono);
      margin-top: auto;
      padding-top: 8px;
    }
    @media (max-width: 880px) {
      .journal-grid { grid-template-columns: 1fr; }
      .journal-card { min-height: 0; }
      .hero-grid { grid-template-columns: 1fr !important; }
      .cases-panel .work-grid { grid-template-columns: 1fr !important; }
      .work-vignettes { grid-template-columns: 1fr; }
      .cases-shell { margin: 0 12px; }
      .cases-panel.work { padding: 36px 22px 44px !important; }
    }

    /* —— FAQ —— */
    .faq { padding: 72px 0 !important; }
    .faq-layout {
      display: grid;
      grid-template-columns: 0.9fr 1.4fr;
      gap: 64px;
      align-items: start;
      margin-top: 40px;
    }
    .faq-list { display: flex; flex-direction: column; gap: 10px; }
    .faq-item {
      border: 1px solid var(--line);
      border-radius: 14px;
      background: rgba(var(--paper-rgb), 0.55);
      overflow: hidden;
    }
    .faq-item summary {
      list-style: none;
      cursor: pointer;
      padding: 18px 22px;
      font-family: var(--sans);
      font-weight: 650;
      font-size: 16.5px;
      letter-spacing: -0.01em;
      display: flex;
      justify-content: space-between;
      gap: 16px;
      align-items: center;
    }
    .faq-item summary::-webkit-details-marker { display: none; }
    .faq-item summary::after {
      content: "+";
      font-family: var(--mono);
      font-size: 18px;
      color: var(--coral);
      flex-shrink: 0;
    }
    .faq-item[open] summary::after { content: "–"; }
    .faq-item .answer {
      padding: 0 22px 20px;
      color: var(--ink-mute);
      font-size: 15px;
      line-height: 1.55;
      max-width: 62ch;
    }
    @media (max-width: 880px) {
      .faq-layout { grid-template-columns: 1fr; gap: 32px; }
    }

    /* —— Catalogue simple : liste 2 colonnes, sans images —— */
    .labs#offres { padding-top: 56px !important; padding-bottom: 48px !important; }
    .labs#offres .labs-head {
      grid-template-columns: 1fr !important;
      margin-bottom: 28px !important;
      max-width: 52rem;
    }
    .labs#offres .labs-head h2 {
      font-size: clamp(32px, 4vw, 52px) !important;
      margin-top: 18px !important;
    }
    .labs#offres .pills { display: none; }
    .labs#offres .labs-meta {
      justify-content: flex-start !important;
      margin-bottom: 22px !important;
    }
    .labs#offres .labs-grid {
      display: grid !important;
      grid-template-columns: 1fr !important;
      gap: 0 !important;
      max-width: 760px;
      border-top: 1px solid var(--line);
    }
    .labs#offres .lab {
      display: grid !important;
      grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
      column-gap: 32px;
      align-items: center;
      padding: 22px 44px 22px 0;
      border-bottom: 1px solid var(--line);
      position: relative;
    }
    .labs#offres .lab .lab-img { display: none !important; }
    .labs#offres .lab .lab-main {
      display: flex;
      flex-direction: column;
      gap: 8px;
      min-width: 0;
    }
    .labs#offres .lab .num-row {
      display: flex;
      flex-direction: row;
      align-items: baseline;
      gap: 12px;
      margin: 0;
      justify-content: flex-start;
    }
    .labs#offres .lab .num-row span:first-child {
      font-family: var(--serif);
      font-style: italic;
      font-size: 26px;
      color: var(--coral);
      letter-spacing: 0;
      text-transform: none;
      font-weight: 500;
      line-height: 1;
    }
    .labs#offres .lab .num-row span:last-child {
      font-size: 10px;
      letter-spacing: 0.14em;
    }
    .labs#offres .lab h4 {
      margin: 0;
      font-size: 22px;
    }
    .labs#offres .lab p {
      margin: 0;
      max-width: none;
      font-size: 14px;
      color: var(--ink-mute);
    }
    .labs#offres .lab .price {
      display: inline-block;
      margin: 2px 0 0;
      font-family: var(--mono);
      font-size: 11px;
      font-weight: 500;
      color: var(--ink);
      background: var(--mustard);
      padding: 4px 10px;
      border-radius: 999px;
      white-space: nowrap;
      width: fit-content;
    }
    .labs#offres .lab .arrow-mark {
      position: absolute;
      right: 0;
      top: 50%;
      transform: translateY(-50%);
      margin: 0;
    }
    .labs#offres .labs-foot {
      margin-top: 28px !important;
      max-width: 760px;
    }
    @media (max-width: 720px) {
      .labs#offres .lab {
        grid-template-columns: 1fr;
        padding-right: 40px;
        align-items: start;
        gap: 10px;
      }
    }

    /* —— Méthode : icônes stylées (plus de photos) —— */
    .method-foot { margin-top: 24px !important; padding-top: 16px !important; }
    .method { padding-bottom: 40px !important; }
    .method-step .img {
      aspect-ratio: 1 / 1 !important;
      display: grid !important;
      place-items: center;
      background:
        radial-gradient(circle at 30% 25%, rgba(237,111,92,0.18), transparent 55%),
        radial-gradient(circle at 78% 72%, rgba(233,185,74,0.14), transparent 50%),
        var(--bone) !important;
      border: 1px solid var(--line-soft);
      box-shadow: none !important;
      position: relative;
      overflow: hidden;
    }
    .method-step .img img { display: none !important; }
    .method-step .method-ico {
      position: static !important;
      width: 72px !important;
      height: 72px !important;
      border-radius: 20px !important;
      background: rgba(247, 241, 222, 0.95) !important;
      border: 1px solid var(--line) !important;
      color: var(--coral) !important;
      box-shadow: 0 10px 24px -16px rgba(21, 20, 15, 0.35);
    }
    .method-step .method-ico svg {
      width: 32px !important;
      height: 32px !important;
      stroke: currentColor;
      fill: none;
      stroke-width: 1.55;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .method-step .img::before {
      content: '';
      position: absolute;
      inset: 14px;
      border: 1px dashed rgba(21, 20, 15, 0.1);
      border-radius: 16px;
      pointer-events: none;
    }
    footer {
      margin-top: 36px !important;
      padding: 48px 0 24px !important;
    }
    .foot-mega {
      margin-top: 0 !important;
      margin-bottom: 28px !important;
      border-top: none !important;
      border-bottom: 1px solid var(--line);
      padding-bottom: 20px;
    }
    .foot-mega .word {
      font-size: clamp(32px, 5.5vw, 72px) !important;
      margin-top: 0 !important;
      line-height: 1.05 !important;
    }
    .cta { padding: 48px 0 32px !important; }
    .cta-grid {
      gap: 24px !important;
      align-items: start !important;
      min-height: 0 !important;
    }
    .cta h2 {
      font-size: clamp(40px, 5.2vw, 72px) !important;
      margin: 14px 0 16px !important;
      line-height: 0.98 !important;
    }
    .cta .lead { margin-bottom: 20px !important; }
    .cta-actions { margin-bottom: 16px !important; }
    .cta-foot { margin-top: 16px !important; padding-top: 14px !important; }
    .cta-art {
      max-height: 380px !important;
      aspect-ratio: 4 / 3 !important;
      overflow: hidden;
      transform: none !important;
    }
    .cta-art img { object-fit: cover !important; height: 100%; width: 100%; }

    /* foot-mega belt-and-suspenders */
    .foot-mega .word,
    .foot-mega .word[data-reveal] {
      opacity: 1 !important;
      translate: none !important;
      scale: 1 !important;
      visibility: visible !important;
      color: var(--ink);
    }

    /* —— Scroll invert (per focused section after hero) —— */
    .hero {
      /* Hero always keeps the normal DGTL light palette */
      --paper: #efe7d2;
      --paper-warm: #ece4cf;
      --paper-dark: #ddd2b6;
      --ink: #15140f;
      --ink-soft: #2a2620;
      --ink-mute: #5a5448;
      --ink-faint: #8b8676;
      --bone: #f7f1de;
      --coral: #ed6f5c;
      --on-coral: #15140f;
      --line: rgba(21, 20, 15, 0.16);
      --line-soft: rgba(21, 20, 15, 0.08);
      --paper-rgb: 239, 231, 210;
      --ink-rgb: 21, 20, 15;
    }
    .shell > section,
    .shell > footer,
    [data-scroll-invert] {
      transition:
        background-color var(--invert-dur, 0.55s) ease,
        color var(--invert-dur, 0.55s) ease,
        border-color var(--invert-dur, 0.55s) ease;
    }
    .about, .capabilities, .labs, .method, .journal, .faq, .cta, .wire, .shell > footer {
      background: var(--paper);
      color: var(--ink);
    }
    /* Component tweaks when the section itself is inverted (auto) or page is dark */
    [data-scroll-invert].is-inverted .btn-ghost,
    html[data-theme="dark"] .btn-ghost {
      background: rgba(var(--ink-rgb), 0.06);
    }
    [data-scroll-invert].is-inverted .btn-primary,
    html[data-theme="dark"] .btn-primary {
      background: var(--coral);
      color: var(--on-coral);
    }
    [data-scroll-invert].is-inverted .faq-item,
    html[data-theme="dark"] .faq-item {
      background: rgba(var(--ink-rgb), 0.06);
    }
    [data-scroll-invert].is-inverted .journal-card,
    html[data-theme="dark"] .journal-card {
      background: var(--bone);
    }
    html[data-theme="dark"] .cases-nav .nav-btn {
      background: var(--bone);
      color: var(--ink);
      border-color: var(--line);
    }
    html[data-theme="dark"] .cases-dots button {
      background: rgba(var(--ink-rgb), 0.28);
    }
    /* Native-dark cases: viewport stays ink; never follow section invert */
    .cases-viewport {
      --paper: #efe7d2;
      --ink: #15140f;
      --coral: #ed6f5c;
      --paper-rgb: 239, 231, 210;
      --ink-rgb: 21, 20, 15;
    }
    section.is-focus {
      position: relative;
    }

    @media (prefers-reduced-motion: reduce) {
      .live-float .char,
      .doors-track,
      .btn::before, .btn::after,
      .brand-mark, .card .icon, .method-ico,
      .live-type::after { animation: none !important; }
      .live-type::after { opacity: 0; }
      .cases-track { transition: none !important; }
      .cases-nav .nav-btn:hover { transform: none; }
      .journal-card:hover { transform: none; }
      :root, body { --invert-dur: 0.12s; }
    }