:root {
      --ink: #261812;
      --ink-soft: #5d4d44;
      --espresso: #2a1811;
      --espresso-2: #3b2318;
      --cream: #f6f0e7;
      --ivory: #fffdf9;
      --sand: #e9ddcf;
      --copper: #ca8a45;
      --copper-light: #f0bf79;
      --orange: #e39833;
      --green: #2f7a5a;
      --line: rgba(70, 42, 30, .14);
      --shadow-sm: 0 12px 32px rgba(55, 31, 19, .09);
      --shadow-lg: 0 24px 75px rgba(55, 31, 19, .16), 0 6px 18px rgba(55, 31, 19, .08);
      --radius: 26px;
      --serif: Georgia, 'Times New Roman', serif;
      --sans: 'Axiforma', 'Century Gothic', 'Avenir Next', Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      color: var(--ink);
      background:
        radial-gradient(circle at 10% 4%, rgba(228, 161, 72, .13), transparent 24rem),
        linear-gradient(180deg, #fffdf9 0%, #f8f2e9 48%, #fffdf9 100%);
      font-family: var(--sans);
      font-size: 17px;
      line-height: 1.7;
      overflow-x: hidden;
    }

    body::before {
      content: '';
      position: fixed;
      inset: 0;
      pointer-events: none;
      opacity: .24;
      z-index: 100;
      background-image: url("img/noise.svg");
    }

    img { display: block; max-width: 100%; }
    a { color: inherit; }
    button { font: inherit; }
    .container { width: min(1160px, calc(100% - 40px)); margin-inline: auto; }
    .narrow { width: min(820px, 100%); margin-inline: auto; }
    .section { padding: clamp(64px, 5.4vw, 78px) 0; position: relative; }
    .section-tight { padding: clamp(46px, 4vw, 58px) 0; }
    .eyebrow {
      margin: 0 0 16px;
      color: var(--copper);
      font-size: .76rem;
      font-weight: 800;
      letter-spacing: .18em;
      text-transform: uppercase;
    }
    h1, h2, h3, p { margin-top: 0; }
    h1, h2, .display {
      font-family: var(--serif);
      font-weight: 500;
      letter-spacing: -.045em;
      line-height: 1.02;
    }
    h1 { font-size: clamp(3rem, 5vw, 4.5rem); margin-bottom: 26px; }
    h2 { font-size: clamp(2.35rem, 3.7vw, 4.25rem); margin-bottom: 24px; }
    h3 { line-height: 1.25; }
    .lead { font-size: clamp(1.06rem, 1.5vw, 1.35rem); color: var(--ink-soft); line-height: 1.65; }
    .accent { color: var(--copper); font-style: italic; }
    .center { text-align: center; }
    .surface {
      background: rgba(255, 253, 249, .78);
      border: 1px solid rgba(255, 255, 255, .82);
      box-shadow: var(--shadow-lg), inset 0 0 0 1px rgba(105, 69, 48, .08);
      backdrop-filter: blur(24px);
      -webkit-backdrop-filter: blur(24px);
    }
    .announcement {
      position: relative;
      z-index: 30;
      padding: 9px 18px;
      background: var(--espresso);
      color: #fff5e9;
      text-align: center;
      font-size: .78rem;
      letter-spacing: .02em;
    }
    .site-header {
      position: sticky;
      top: 0;
      z-index: 25;
      border-bottom: 1px solid rgba(70, 42, 30, .09);
      background: rgba(255, 253, 249, .72);
      backdrop-filter: blur(22px) saturate(140%);
      -webkit-backdrop-filter: blur(22px) saturate(140%);
    }
    .header-inner { height: 74px; display: flex; align-items: center; justify-content: space-between; gap: 22px; }
    .logo { width: 235px; height: 54px; object-fit: contain; object-position: center; mix-blend-mode: multiply; }
    .nav { display: flex; align-items: center; gap: 24px; }
    .nav a:not(.button) { text-decoration: none; font-size: .86rem; font-weight: 700; color: var(--ink-soft); }
    .button {
      position: relative;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      min-height: 54px;
      padding: 14px 24px;
      border: 1px solid rgba(255,255,255,.24);
      border-radius: 999px;
      background: linear-gradient(135deg, #efad57, #bd7133);
      box-shadow: 0 14px 32px rgba(182, 105, 45, .26), inset 0 1px 0 rgba(255,255,255,.48);
      color: #1f120d;
      font-size: .86rem;
      font-weight: 900;
      line-height: 1.2;
      letter-spacing: .025em;
      text-align: center;
      text-decoration: none;
      transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
      overflow: hidden;
    }
    .button::after {
      content: '';
      position: absolute;
      inset: -1px;
      background: linear-gradient(110deg, transparent 15%, rgba(255,255,255,.38) 44%, transparent 63%);
      transform: translateX(-120%);
      transition: transform .65s ease;
    }
    .button:hover { transform: translateY(-3px) scale(1.015); box-shadow: 0 18px 44px rgba(182,105,45,.34); }
    .button:hover::after { transform: translateX(120%); }
    .button:active { transform: scale(.975); }
    .button-dark { color: #fff9f1; background: linear-gradient(135deg, #3a2117, #1f120d); }
    .button-large { min-height: 64px; padding: 18px 32px; font-size: .94rem; }

    .hero { padding: 42px 0 68px; }
    .hero-card {
      position: relative;
      overflow: hidden;
      padding: clamp(38px, 5vw, 64px);
      border-radius: 38px;
      text-align: center;
    }
    .hero-card::before {
      content: '';
      position: absolute;
      width: 540px;
      height: 540px;
      top: -360px;
      right: -160px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(222,151,69,.32), transparent 68%);
    }
    .hero-card > * { position: relative; z-index: 1; }
    .hero h1 { max-width: 1000px; margin-inline: auto; }
    .hero-title-primary {
      display: block;
      margin-bottom: 14px;
      font-family: var(--sans);
      font-size: .62em;
      font-weight: 850;
      letter-spacing: -.045em;
      line-height: 1.08;
    }
    .hero-title-editorial {
      display: block;
      font-size: clamp(2.2rem, 3.4vw, 3.25rem);
      font-style: italic;
      line-height: 1.02;
    }
    .hero .lead { max-width: 830px; margin: 0 auto 42px; }
    .video {
      width: min(900px, 100%);
      aspect-ratio: 16/9;
      margin: 0 auto 24px;
      border-radius: 26px;
      overflow: hidden;
      position: relative;
      box-shadow: 0 28px 70px rgba(50, 27, 17, .22);
      border: 1px solid rgba(255,255,255,.7);
      background: var(--espresso);
    }
    .video img { width: 100%; height: 100%; object-fit: cover; }
    .video::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, rgba(24,12,8,.32)); }
    .play {
      position: absolute;
      z-index: 2;
      top: 50%; left: 50%;
      width: 86px; height: 86px;
      transform: translate(-50%, -50%);
      border: 1px solid rgba(255,255,255,.6);
      border-radius: 50%;
      background: rgba(255,255,255,.88);
      box-shadow: 0 16px 45px rgba(0,0,0,.24);
      color: var(--espresso);
      cursor: pointer;
      backdrop-filter: blur(14px);
      transition: transform .25s ease, background .25s ease;
    }
    .play:hover { transform: translate(-50%, -50%) scale(1.08); background: #fff; }
    .play svg { width: 26px; margin: 4px 0 0 5px; }
    .video-caption { max-width: 780px; margin: 0 auto 32px; color: var(--ink-soft); }
    .hero-support { max-width: 710px; margin: 18px auto 0; font-size: .9rem; color: var(--ink-soft); }
    .letter-grid, .expert-grid, .result-grid, .guarantee-grid {
      display: grid;
      grid-template-columns: .84fr 1.16fr;
      gap: clamp(38px, 7vw, 96px);
      align-items: start;
    }
    .portrait-stack { position: sticky; top: 110px; }
    .portrait-main {
      border-radius: 30px;
      overflow: hidden;
      box-shadow: var(--shadow-lg);
      aspect-ratio: 4/5;
      background: var(--sand);
    }
    .portrait-main img { width: 100%; height: 100%; object-fit: cover; }
    .quote-card {
      width: calc(100% - 34px);
      margin: -54px 0 0 34px;
      padding: 25px;
      border-radius: 22px;
      position: relative;
      z-index: 2;
      background: var(--espresso);
      color: #fff6eb;
      box-shadow: var(--shadow-lg);
    }
    .quote-card p { margin-bottom: 10px; font-family: var(--sans); font-size: 1.15rem; line-height: 1.55; }
    .quote-card span { color: var(--copper-light); font-size: .86rem; font-weight: 800; }
    .letter-copy { font-family: var(--sans); font-size: 1.04rem; color: #403028; }
    .letter-copy p { margin-bottom: 22px; }
    .letter-meta { font-family: var(--sans); font-size: .9rem; color: var(--ink-soft); line-height: 1.7; margin-bottom: 38px; }
    .highlight {
      margin: 34px 0;
      padding: 30px;
      border: 1px solid rgba(198,132,65,.32);
      border-radius: 24px;
      background: linear-gradient(135deg, rgba(238,191,121,.18), rgba(255,255,255,.62));
      font-family: var(--sans);
      font-size: clamp(1.35rem, 2.4vw, 2.05rem);
      line-height: 1.32;
    }
    #metodo .highlight { font-size: clamp(1rem, 1.15vw, 1.1125rem); }
    .expert-copy .highlight { font-size: clamp(1.08rem, 1.35vw, 1.3rem); }

    .dark {
      color: #fff7ef;
      background:
        radial-gradient(circle at 85% 15%, rgba(222,148,63,.15), transparent 28rem),
        linear-gradient(145deg, #321d14, #1e110c 72%);
    }
    .dark .lead, .dark .muted { color: rgba(255,247,239,.72); }
    .dark .eyebrow { color: var(--copper-light); }
    .dark .highlight { background: rgba(255,255,255,.055); border-color: rgba(240,191,121,.25); }

    .benefits-wrap { overflow: hidden; }
    .benefits {
      display: grid;
      grid-auto-flow: column;
      grid-auto-columns: minmax(290px, 1fr);
      gap: 18px;
      overflow-x: auto;
      scroll-snap-type: x mandatory;
      padding: 6px max(20px, calc((100vw - 1160px)/2)) 34px;
      scrollbar-width: thin;
      scrollbar-color: var(--copper) transparent;
    }
    .benefit {
      position: relative;
      min-height: 350px;
      padding: 30px;
      border-radius: 28px;
      scroll-snap-align: center;
      overflow: hidden;
      background: var(--ivory);
      border: 1px solid var(--line);
      box-shadow: var(--shadow-sm);
    }
    .benefit:nth-child(2), .benefit:nth-child(4) { transform: translateY(18px); }
    .benefit-icon {
      width: 58px; height: 58px;
      display: grid; place-items: center;
      margin-bottom: 58px;
      border-radius: 18px;
      color: var(--espresso);
      background: linear-gradient(145deg, #f6cd92, #c98643);
      box-shadow: 0 12px 28px rgba(190,114,45,.22);
    }
    .benefit-icon svg { width: 26px; }
    .benefit p { font-size: 1.01rem; font-weight: 400; line-height: 1.65; }

    .expert-grid { grid-template-columns: .9fr 1.1fr; gap: clamp(44px, 5vw, 72px); align-items: center; }
    .expert-media { position: relative; min-height: 760px; }
    .expert-media .photo-one, .expert-media .photo-two {
      position: absolute;
      overflow: hidden;
      border-radius: 28px;
      border: 1px solid rgba(255,255,255,.14);
      box-shadow: 0 28px 80px rgba(0,0,0,.3);
    }
    .expert-media .photo-one { inset: 0 13% 9% 0; }
    .expert-media .photo-two { width: 60%; height: 48%; right: 0; bottom: 0; }
    .expert-media img { width: 100%; height: 100%; object-fit: cover; }
    .expert-media .photo-one img { object-position: center 24%; }
    .expert-copy p { color: rgba(255,247,239,.76); }
    .question-list { margin: 26px 0; padding: 0; list-style: none; }
    .question-list li { margin: 0 0 12px; padding-left: 4px; color: #fff8f1; }

    .comparison { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 34px; }
    .compare-card { padding: clamp(28px, 4vw, 48px); border-radius: 30px; }
    .compare-card h3 { font-family: var(--serif); font-size: clamp(1.55rem, 2.2vw, 2rem); }
    .compare-before { background: #ede4da; border: 1px solid #dfd0c0; }
    .compare-after { color: #fff7ef; background: var(--espresso); box-shadow: var(--shadow-lg); }
    .compare-card p { position: relative; margin-bottom: 18px; padding-left: 30px; }
    .compare-card p::before {
      position: absolute;
      left: 0;
      top: .16em;
      width: 19px;
      height: 19px;
      display: grid;
      place-items: center;
      border-radius: 50%;
      font-family: var(--sans);
      font-size: .76rem;
      font-weight: 700;
      line-height: 1;
    }
    .compare-before p::before {
      content: '×';
      color: #8f4d42;
      border: 1px solid rgba(143,77,66,.34);
      background: rgba(143,77,66,.07);
    }
    .compare-after p::before {
      content: '✓';
      color: #efc688;
      border: 1px solid rgba(239,198,136,.34);
      background: rgba(239,198,136,.08);
    }

    .mirror-section {
      overflow: hidden;
      color: var(--ink);
      background:
        linear-gradient(rgba(246,240,231,.94), rgba(246,240,231,.94)),
        radial-gradient(circle at 82% 20%, rgba(202,138,69,.18), transparent 32rem);
    }
    .mirror-section.dark { color: var(--ink); }
    .mirror-section.dark p { color: var(--ink-soft); }
    .mirror-section::before {
      content: '';
      position: absolute;
      width: 660px; height: 660px;
      right: -300px; top: -10%;
      border: 1px solid rgba(202,138,69,.22);
      border-radius: 50%;
      box-shadow: 0 0 0 44px rgba(202,138,69,.04), 0 0 0 88px rgba(202,138,69,.025);
    }
    .result-grid { grid-template-columns: .82fr 1.18fr; gap: clamp(24px, 4vw, 54px); align-items: center; }
    .result-image {
      position: relative;
      display: grid;
      place-items: center;
      min-height: 610px;
      overflow: visible;
    }
    .result-image > img {
      width: min(118%, 760px);
      max-width: none;
      height: auto;
      object-fit: contain;
      transform: translateY(-2%);
      filter: drop-shadow(0 24px 42px rgba(55,31,19,.14));
    }
    .mirror-callout { font-family: var(--serif); font-size: clamp(1.7rem, 2.65vw, 2.65rem); line-height: 1.15; }
    .mirror-word { display: block; margin: 12px 0 26px; color: var(--copper); font-size: clamp(2rem, 2.4vw, 2.316rem); font-style: italic; }
    .mirror-section .highlight { font-size: clamp(1.05rem, 1.28vw, 1.2375rem); }
    .outcomes-title { font-size: clamp(2.15rem, 3vw, 2.88rem); }

    .bento {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      grid-auto-rows: minmax(120px, auto);
      gap: 18px;
      margin-top: 52px;
    }
    .bento-card {
      position: relative;
      grid-column: span 6;
      min-height: 300px;
      padding: 34px;
      overflow: hidden;
      border-radius: 28px;
      background: rgba(255,253,249,.8);
      border: 1px solid var(--line);
      box-shadow: var(--shadow-sm);
      transform-style: preserve-3d;
      transition: transform .2s ease, box-shadow .3s ease;
    }
    .bento-card::before {
      content: '';
      position: absolute;
      width: 210px; height: 210px;
      left: var(--mx, 50%); top: var(--my, 50%);
      transform: translate(-50%, -50%);
      background: radial-gradient(circle, rgba(225,154,72,.18), transparent 68%);
      pointer-events: none;
    }
    .bento-card:nth-child(1), .bento-card:nth-child(4) { grid-column: span 7; }
    .bento-card:nth-child(2), .bento-card:nth-child(3) { grid-column: span 5; }
    .bento-card h3 {
      position: relative;
      font-family: var(--sans);
      font-size: clamp(1rem, 1.06vw, 1.025rem);
      font-weight: 750;
      line-height: 1.4;
      letter-spacing: .005em;
    }
    .bento-card p { position: relative; color: var(--ink-soft); }
    .bento-number { display: inline-grid; place-items: center; width: 46px; height: 46px; margin-bottom: 42px; border-radius: 50%; background: var(--espresso); color: #fff7ef; font-family: var(--serif); }

    .offer-section {
      overflow: hidden;
      color: var(--ink);
      background:
        radial-gradient(circle at 10% 36%, rgba(202,138,69,.1), transparent 28rem),
        linear-gradient(180deg, #f8f3e9, #fffdf8 72%);
    }
    .offer-carousel { position: relative; width: 100%; margin: 0 0 64px; }
    .course-carousel-track {
      display: grid;
      grid-auto-flow: column;
      grid-auto-columns: clamp(220px, 22vw, 292px);
      gap: 18px;
      overflow-x: auto;
      padding: 10px clamp(64px, 5vw, 100px) 26px;
      scroll-behavior: smooth;
      scroll-snap-type: x mandatory;
      scrollbar-width: none;
    }
    .course-carousel-track::-webkit-scrollbar { display: none; }
    .course-slide {
      scroll-snap-align: center;
      aspect-ratio: 5 / 9;
      overflow: hidden;
      border: 1px solid rgba(202,138,69,.3);
      border-radius: 28px;
      background: var(--espresso);
      box-shadow: 0 22px 50px rgba(55,31,19,.17);
    }
    .course-slide img { width: 100%; height: 100%; object-fit: cover; }
    .carousel-control {
      position: absolute;
      z-index: 4;
      top: 50%;
      width: 48px;
      height: 48px;
      display: grid;
      place-items: center;
      border: 1px solid rgba(255,255,255,.5);
      border-radius: 50%;
      background: rgba(42,24,17,.9);
      color: #fff8ef;
      box-shadow: 0 10px 28px rgba(0,0,0,.2);
      cursor: pointer;
      transform: translateY(-50%);
    }
    .carousel-control.prev { left: 22px; }
    .carousel-control.next { right: 22px; }
    .offer-heading { width: min(760px, 100%); margin: 0 auto 42px; text-align: center; }
    .offer-heading h2 { font-size: clamp(2rem, 2.8vw, 2.75rem); }
    .offer-heading .lead { margin-bottom: 0; color: var(--ink-soft); }
    .offer-shell { display: grid; place-items: center; }
    .offer-list { display: grid; gap: 0; margin: 8px 0 26px; }
    .offer-item {
      display: grid;
      grid-template-columns: 34px 1fr;
      gap: 14px;
      padding: 15px 0;
      border-bottom: 1px solid rgba(70,42,30,.14);
      color: var(--ink-soft);
      background: transparent;
    }
    .offer-item span:first-child { font-size: 1.25rem; }
    .offer-item p { margin: 0; }
    .price-card {
      position: relative;
      top: auto;
      width: min(700px, 100%);
      padding: clamp(28px, 5vw, 54px);
      overflow: hidden;
      border-radius: 2px;
      color: var(--ink);
      background: rgba(255,253,249,.92);
      box-shadow: 0 0 0 12px rgba(235,226,211,.76), 0 28px 80px rgba(55,31,19,.12);
      border: 1px solid rgba(70,42,30,.14);
    }
    .price-card::before {
      content: '';
      position: absolute;
      inset: 0 0 auto;
      height: 5px;
      background: linear-gradient(90deg, #8b4e27, #efbd75, #b76831, #efbd75);
    }
    .offer-brand { width: min(280px, 62%); margin: 0 auto 20px; mix-blend-mode: multiply; }
    .price-card .offer-product { width: min(600px, 100%); margin: -4px auto 20px; border-radius: 0; background: transparent; box-shadow: none; }
    .price-card .total {
      margin: 20px 0 8px;
      padding-top: 26px;
      border-top: 1px solid rgba(70,42,30,.16);
      color: var(--ink-soft);
      font-size: clamp(1rem, 1.15vw, 1.12rem);
      text-align: center;
    }
    .price-old {
      position: relative;
      display: inline-block;
      color: var(--ink);
      font-weight: 750;
    }
    .price-old::after {
      content: '';
      position: absolute;
      left: -3px;
      right: -3px;
      top: 51%;
      height: 2px;
      border-radius: 99px;
      background: var(--copper);
      transform: rotate(-4deg);
      box-shadow: 0 1px 0 rgba(255,255,255,.7);
    }
    .price-card .today {
      margin: 0 0 24px;
      color: var(--ink);
      font-family: var(--sans);
      line-height: 1.15;
      text-align: center;
    }
    .price-intro {
      display: block;
      font-size: clamp(1rem, 1.18vw, 1.15rem);
      font-weight: 650;
    }
    .price-current {
      display: block;
      margin-top: 8px;
      color: var(--orange);
      font-family: Helvetica, Arial, sans-serif;
      font-size: clamp(4.25rem, 8vw, 6.5rem);
      font-weight: 600;
      line-height: .9;
      letter-spacing: -.07em;
      text-shadow: 0 10px 28px rgba(190,114,45,.16);
    }
    .price-card .button { width: 100%; margin-top: 12px; }
    .imagina { margin-top: 72px; display: grid; grid-template-columns: .6fr 1fr; gap: 44px; align-items: start; padding: clamp(34px, 6vw, 72px); border-radius: 34px; color: #fff7ef; background: linear-gradient(145deg, #321d14, #1e110c); box-shadow: var(--shadow-lg); }
    .imagina h3 { position: sticky; top: 110px; font-family: var(--serif); font-size: clamp(2.35rem, 3.2vw, 3.045rem); font-weight: 500; line-height: 1; }
    .imagina-copy p { padding: 20px 0 20px 28px; margin: 0; border-left: 1px solid rgba(240,191,121,.28); color: rgba(255,247,239,.8); }
    .imagina-copy .button { margin-top: 30px; }

    #garantia { overflow: hidden; background: #f5efe4; }
    .guarantee-grid { grid-template-columns: .9fr 1.1fr; gap: clamp(46px, 7vw, 94px); align-items: center; }
    .shield {
      position: relative;
      min-height: 480px;
      display: grid;
      place-items: center;
      background: transparent;
    }
    .guarantee-seal-image {
      width: min(500px, 100%);
      height: auto;
      object-fit: contain;
      filter: drop-shadow(0 26px 44px rgba(55,31,19,.16));
    }
    .guarantee-copy h2 { font-size: clamp(2rem, 2.4vw, 2.5rem); }
    .guarantee-copy p { line-height: 1.65; }
    .guarantee-copy .button { margin-top: 14px; }

    .finale { text-align: center; }
    .finale h2 { font-size: clamp(2.15rem, 2.6vw, 2.505625rem); }
    .finale .narrow > p { font-size: 1.07rem; color: rgba(255,247,239,.78); }
    .finale-points { display: grid; gap: 12px; margin: 34px 0; text-align: left; }
    .finale-points p { margin: 0; padding: 16px 18px; border: 1px solid rgba(255,255,255,.1); border-radius: 16px; background: rgba(255,255,255,.045); }

    .faq { max-width: 900px; margin: 34px auto 0; }
    #faq .narrow h2 { font-size: clamp(1.95rem, 2.15vw, 2.07rem); }
    .faq-item { border-bottom: 1px solid var(--line); }
    .faq-question {
      width: 100%;
      display: grid;
      grid-template-columns: 1fr 34px;
      gap: 20px;
      padding: 24px 0;
      border: 0;
      background: transparent;
      color: var(--ink);
      text-align: left;
      font-weight: 500;
      cursor: pointer;
    }
    .faq-plus { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--line); transition: transform .3s ease; }
    .faq-item.open .faq-plus { transform: rotate(45deg); }
    .faq-answer { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .38s ease; }
    .faq-answer > div { overflow: hidden; }
    .faq-answer p { padding: 0 54px 26px 0; margin: 0; color: var(--ink-soft); }
    .faq-item.open .faq-answer { grid-template-rows: 1fr; }
    .faq-cta { margin-top: 36px; }

    .footer { padding: 42px 0 108px; border-top: 1px solid var(--line); }
    .footer .logo { margin: 0 auto; width: 260px; }
    .mobile-cta { display: none; }

    .reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1); }
    .reveal.is-visible { opacity: 1; transform: none; }
    .stagger > .reveal:nth-child(2) { transition-delay: .08s; }
    .stagger > .reveal:nth-child(3) { transition-delay: .16s; }
    .stagger > .reveal:nth-child(4) { transition-delay: .24s; }
    .stagger > .reveal:nth-child(5) { transition-delay: .32s; }
    .stagger > .reveal:nth-child(6) { transition-delay: .40s; }

    @media (max-width: 940px) {
      .section { padding: 60px 0; }
      .section-tight { padding: 44px 0; }
      .nav a:not(.button) { display: none; }
      .header-inner .button { padding-inline: 18px; }
      .letter-grid, .expert-grid, .result-grid, .guarantee-grid, .offer-shell, .imagina { grid-template-columns: 1fr; }
      .portrait-stack, .price-card, .imagina h3 { position: relative; top: auto; }
      .portrait-stack { max-width: 620px; margin-inline: auto; }
      .expert-copy { order: 2; }
      .expert-media { min-height: 640px; order: 1; }
      .result-image { width: 100%; max-width: 760px; margin: 0 auto; order: 1; }
      .result-copy { order: 2; }
      .offer-carousel { margin-bottom: 52px; }
      .bento-card, .bento-card:nth-child(n) { grid-column: span 6; }
      .imagina { gap: 10px; }
    }

    @media (max-width: 680px) {
      body { font-size: 16px; }
      .container { width: min(100% - 20px, 1160px); }
      .announcement { font-size: .7rem; line-height: 1.4; }
      .header-inner { height: 64px; }
      .logo { width: 180px; height: 44px; }
      .header-inner .button { display: none; }
      .section { padding: 46px 0; }
      .section-tight { padding: 34px 0; }
      .hero { padding: 20px 0 42px; }
      .hero-card { padding: 34px 18px 38px; border-radius: 28px; }
      h1 { font-size: clamp(2.3rem, 10.6vw, 3.35rem); }
      h2 { font-size: clamp(2.05rem, 9.5vw, 3rem); }
      .hero-title-primary { font-size: clamp(23px, 4.91vw, 25.38px); margin-bottom: 10px; font-weight: 700; }
      .video { border-radius: 18px; }
      .play { width: 66px; height: 66px; }
      .button-large { width: 100%; padding-inline: 16px; font-size: .84rem; }
      .letter-grid { gap: 42px; }
      .quote-card { width: calc(100% - 18px); margin-left: 18px; }
      .benefits {
        grid-auto-flow: row;
        grid-auto-columns: auto;
        grid-template-columns: 1fr;
        overflow: visible;
        scroll-snap-type: none;
        padding: 6px 10px 34px;
      }
      .benefits-wrap { overflow: visible; }
      .benefit:nth-child(n) { transform: none; }
      .expert-media { min-height: 490px; }
      .hero-title-editorial { font-size: 27.33px; }
      .outcomes-title { font-size: 23.4px; }
      .offer-heading h2 { font-size: 27px; }
      .price-card .total { text-align: center; }
      .price-card .today { font-size: 27.28px; line-height: 1.25; text-align: center; }
      #faq .narrow h2 { font-size: 21.2px; }
      .comparison { grid-template-columns: 1fr; }
      .result-image {
        min-height: 0;
        height: clamp(500px, 160vw, 750px);
        padding: 0;
        overflow: hidden;
      }
      .result-image > img { width: min(112%, 560px); max-width: none; transform: translateY(-1%); }
      .mirror-callout { font-size: clamp(21.5px, 4.49vw, 23.2px); }
      .mirror-word { margin: 8px 0 20px; font-size: clamp(25px, 6vw, 30px); }
      .bento { grid-template-columns: 1fr; }
      .bento-card, .bento-card:nth-child(n) { grid-column: 1; min-height: auto; }
      .offer-item { grid-template-columns: 34px 1fr; }
      .price-card, .compare-card, .bento-card { padding: 26px; }
      .offer-carousel { width: 100%; margin-bottom: 40px; }
      .course-carousel-track { grid-auto-columns: 72vw; padding-inline: 10px; }
      .carousel-control { width: 42px; height: 42px; }
      .carousel-control.prev { left: 10px; }
      .carousel-control.next { right: 10px; }
      .shield { min-height: 360px; }
      .guarantee-seal-image { width: min(360px, 94vw); }
      .imagina { margin-top: 48px; padding: 28px 22px; }
      .comparison { margin-top: 26px; }
      .bento { margin-top: 34px; }
      .faq { margin-top: 26px; }
      .faq-cta { margin-top: 30px; }
      .faq-question { font-size: .95rem; }
      .faq-answer p { padding-right: 0; }
      .mobile-cta {
        position: fixed;
        z-index: 40;
        left: 10px; right: 10px; bottom: 10px;
        display: block;
        opacity: 0;
        pointer-events: none;
        transform: translateY(calc(100% + 24px));
        transition: opacity .25s ease, transform .32s cubic-bezier(.2,.8,.2,1);
      }
      .mobile-cta.is-visible { opacity: 1; pointer-events: auto; transform: none; }
      .mobile-cta .button { width: 100%; box-shadow: 0 14px 38px rgba(40,20,12,.35); }
      .footer { padding-bottom: 112px; }
    }

    @media (max-width: 420px) {
      .container { width: min(100% - 20px, 1160px); }
      .hero-card { padding: 28px 14px 32px; border-radius: 24px; }
      .hero .lead { margin-bottom: 28px; }
      .video-caption { margin-bottom: 24px; }
      .button-large { min-height: 58px; font-size: .78rem; }
      .price-card, .compare-card, .bento-card { padding: 22px 18px; }
      .course-carousel-track { grid-auto-columns: 78vw; padding-inline: 10px; }
      .expert-media { min-height: 430px; }
      .shield { min-height: 310px; }
    }

    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      *, *::before, *::after { animation: none !important; transition: none !important; }
      .reveal { opacity: 1; transform: none; }
    }
