:root {
      --royal: #123E63;
      --petrol: #0E3344;
      --burgundy: #6F1D33;
      --wine: #4B1024;
      --gold: #C9A55A;
      --gold-soft: #E8D19A;
      --cream: #F7EFE2;
      --cream-2: #FFF9EF;
      --black: #111111;
      --red: #B31825;
      --text: #2A211A;
      --muted: #725F51;
      --shadow: 0 24px 70px rgba(17,17,17,.18);
      --radius-lg: 34px;
      --radius-md: 22px;
      --ease: all .3s ease;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      font-family: 'Raleway', sans-serif;
      color: var(--text);
      background:
        radial-gradient(circle at 15% 10%, rgba(201,165,90,.23), transparent 32%),
        radial-gradient(circle at 90% 6%, rgba(111,29,51,.16), transparent 30%),
        linear-gradient(180deg, var(--cream-2), var(--cream));
      overflow-x: hidden;
    }

    body::before {
      content: "";
      position: fixed;
      inset: 0;
      pointer-events: none;
      opacity: .15;
      z-index: 0;
      background-image:
        linear-gradient(rgba(18,62,99,.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(18,62,99,.08) 1px, transparent 1px);
      background-size: 58px 58px;
      mask-image: radial-gradient(circle at center, black, transparent 75%);
    }

    .page { position: relative; z-index: 1; }
    .container { width: min(1160px, calc(100% - 40px)); margin: 0 auto; }

    /* ── HEADER ── */
    header {
      position: sticky;
      top: 0;
      z-index: 30;
      backdrop-filter: blur(18px);
      background: rgba(255,249,239,.82);
      border-bottom: 1px solid rgba(201,165,90,.25);
    }

    .nav {
      height: 96px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
    }

    .logo {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
    }

    .logo img {
      height: 104px;
      width: auto;
      display: block;
    }

    .nav-links { display: flex; gap: 24px; align-items: center; }
    .nav-links a {
      font-family: 'Raleway', sans-serif;
      font-size: .78rem;
      text-transform: uppercase;
      letter-spacing: .14em;
      color: var(--petrol);
      text-decoration: none;
      position: relative;
    }

    .nav-links a::after {
      content: "";
      position: absolute;
      width: 0;
      height: 1px;
      left: 0;
      bottom: -5px;
      background: var(--gold);
      transition: var(--ease);
    }
    .nav-links a:hover::after { width: 100%; }

    /* ── SECTIONS ── */
    section { padding: 104px 0; position: relative; }

    /* ── HERO ── */
    .hero {
      min-height: calc(100vh - 96px);
      display: grid;
      align-items: center;
      padding: 86px 0 110px;
      overflow: hidden;
    }

    .hero-grid {
      display: grid;
      grid-template-columns: 1fr .9fr;
      align-items: center;
      gap: 64px;
    }

    .eyebrow {
      font-family: 'Raleway', sans-serif;
      text-transform: uppercase;
      letter-spacing: .22em;
      font-size: .78rem;
      color: var(--burgundy);
      font-weight: 700;
      margin-bottom: 16px;
    }

    h1, h2, h3 {
      font-family: 'Cormorant Garamond', serif;
      margin: 0;
      color: var(--petrol);
      line-height: .96;
    }

    h1 {
      font-size: clamp(3.5rem, 7vw, 7.6rem);
      max-width: 800px;
      letter-spacing: -.02em;
      font-weight: 600;
    }

    h2 {
      font-size: clamp(2.5rem, 4.5vw, 4.9rem);
      letter-spacing: -.015em;
      margin-bottom: 28px;
      font-weight: 600;
    }

    h1::first-letter,
    h2::first-letter {
      font-family: 'Great Vibes', cursive;
      color: var(--burgundy);
      font-size: 1.18em;
      font-weight: 400;
      line-height: 0.82;
      letter-spacing: .01em;
      text-shadow: 0 0 24px rgba(201,165,90,.28);
    }

    .section-dark h2::first-letter,
    .final-cta h2::first-letter {
      color: var(--gold-soft);
    }

    /* clear float after headings so next sibling doesn't wrap */
    h1::after, h2::after { content: ''; display: table; clear: both; }

    h3 {
      font-family: 'Cormorant Garamond', serif;
      font-size: 2rem;
      line-height: 1.05;
      color: var(--wine);
      margin-bottom: 18px;
      font-weight: 600;
    }

    p { font-family: 'Raleway', sans-serif; font-size: 1.05rem; line-height: 1.85; margin: 0 0 22px; color: var(--text); }
    .lead { font-family: 'Raleway', sans-serif; font-size: clamp(1.1rem, 1.6vw, 1.38rem); color: #3C3028; max-width: 720px; }
    .muted { color: var(--muted); }

    .hero-bullets {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14px;
      margin: 34px 0 38px;
      max-width: 650px;
    }

    .bullet, .benefit, .for-item {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      font-size: 1rem;
      line-height: 1.55;
    }

    .bullet span, .for-item span {
      color: var(--gold);
      font-weight: 700;
      font-family: 'Raleway', sans-serif;
    }

    .button-row { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; }

    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      border: 0;
      border-radius: 999px;
      padding: 17px 28px;
      background: linear-gradient(135deg, var(--gold), #8D6A24);
      color: var(--black);
      font-family: 'Raleway', sans-serif;
      font-weight: 700;
      font-size: .88rem;
      letter-spacing: .08em;
      text-transform: uppercase;
      text-decoration: none;
      cursor: pointer;
      box-shadow: 0 16px 40px rgba(14,51,68,.26), inset 0 0 0 1px rgba(232,209,154,.25);
      transition: var(--ease);
      animation: breathe 3.6s ease-in-out infinite;
    }

    .btn:hover {
      transform: translateY(-2px);
      box-shadow: 0 22px 54px rgba(14,51,68,.32), 0 0 24px rgba(201,165,90,.36);
    }

    .btn.gold {
      background: linear-gradient(135deg, var(--gold), #8D6A24);
      color: var(--black);
    }

    .text-link {
      color: var(--burgundy);
      font-family: 'Raleway', sans-serif;
      font-size: .86rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .12em;
      text-decoration: none;
      border-bottom: 1px solid rgba(201,165,90,.55);
      padding-bottom: 5px;
    }

    /* ── HERO VISUAL CARD ── */
    .visual-card {
      min-height: 530px;
      border-radius: var(--radius-lg);
      background: transparent;
      box-shadow: none;
      position: relative;
      overflow: visible;
      border: none;
    }

    .visual-card::before {
      display: none;
    }

    .hero-photo {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
      opacity: .88;
      mix-blend-mode: luminosity;
    }

    .hero-photo-overlay {
      display: none;
    }

    /* mockup-audio removed */

    /* ── CAPTURE FORM ── */
    .capture-form {
      margin-top: 32px;
      display: grid;
      grid-template-columns: 1fr 1fr auto;
      gap: 12px;
      padding: 14px;
      border-radius: 999px;
      background: rgba(255,255,255,.65);
      border: 1px solid rgba(201,165,90,.3);
      box-shadow: 0 18px 45px rgba(17,17,17,.08);
      max-width: 820px;
    }

    input {
      width: 100%;
      border: 0;
      outline: 0;
      border-radius: 999px;
      padding: 17px 18px;
      background: rgba(247,239,226,.9);
      font-family: 'Raleway', sans-serif;
      color: var(--text);
    }
    input:focus { box-shadow: 0 0 0 2px rgba(201,165,90,.55); }

    .trust-note {
      margin-top: 12px;
      font-family: 'Raleway', sans-serif;
      font-size: .82rem;
      letter-spacing: .04em;
      color: var(--muted);
    }

    /* ── DARK SECTIONS ── */
    .section-dark {
      background:
        radial-gradient(circle at 20% 20%, rgba(201,165,90,.18), transparent 28%),
        linear-gradient(145deg, var(--petrol), #071820 72%);
      color: var(--cream-2);
    }
    .section-dark h2, .section-dark h3, .section-dark p { color: var(--cream-2); }
    .section-dark .muted { color: rgba(255,249,239,.75); }

    /* ── TWO COL ── */
    .two-col { display: grid; grid-template-columns: .9fr 1.1fr; gap: 70px; align-items: center; }
    .list { display: grid; gap: 16px; margin-top: 30px; }

    /* ── RITUAL BANNER ── */
    .ritual-banner {
      margin-top: 48px;
      border-radius: var(--radius-md);
      padding: 34px;
      background: linear-gradient(135deg, rgba(111,29,51,.88), rgba(18,62,99,.90));
      border: 1px solid rgba(232,209,154,.45);
      box-shadow: var(--shadow);
      color: var(--gold-soft);
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(1.8rem, 3vw, 3.2rem);
      line-height: 1.05;
      text-align: center;
    }

    /* ── HEADPHONES VISUAL ── */
    .headphones-visual {
      border-radius: var(--radius-lg);
      overflow: hidden;
      position: relative;
      min-height: 500px;
      box-shadow: var(--shadow);
      border: 1px solid rgba(201,165,90,.3);
    }

    .headphones-visual img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
      display: block;
    }

    .headphones-visual::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(
        to bottom,
        transparent 50%,
        rgba(7,24,32,.65) 100%
      );
    }

    /* ── CARDS ── */
    .cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 46px; }
    .card, .pillar, .faq-item {
      border-radius: var(--radius-md);
      padding: 32px;
      background: rgba(255,249,239,.76);
      border: 1px solid rgba(201,165,90,.28);
      box-shadow: 0 18px 45px rgba(17,17,17,.07);
      transition: var(--ease);
      position: relative;
      overflow: hidden;
    }

    .card::before, .pillar::before {
      content: "";
      position: absolute;
      width: 120px;
      height: 120px;
      right: -40px;
      top: -45px;
      background: radial-gradient(circle, rgba(201,165,90,.27), transparent 70%);
    }

    .card:hover, .pillar:hover { transform: translateY(-5px); box-shadow: 0 26px 60px rgba(17,17,17,.12); }

    .number {
      font-family: 'Raleway', sans-serif;
      color: var(--gold);
      letter-spacing: .18em;
      font-weight: 800;
      margin-bottom: 18px;
    }

    /* ── SENSORIAL PHOTO (dissolved edges, Tati-style) ── */
    .photo-sensorial {
      position: relative;
      margin: 54px auto 0;
      width: 100%;
      max-width: 900px;
    }

    .photo-sensorial img {
      width: 100%;
      height: 460px;
      object-fit: cover;
      object-position: center 20%;
      display: block;
      border-radius: 0;
      /* dissolve all four edges into the page background */
      -webkit-mask-image: radial-gradient(ellipse 80% 78% at 50% 50%, black 40%, transparent 100%);
      mask-image: radial-gradient(ellipse 80% 78% at 50% 50%, black 40%, transparent 100%);
      transition: transform 1.4s cubic-bezier(.25,.46,.45,.94), filter .8s ease;
      filter: saturate(0.82) brightness(0.96);
    }

    .photo-sensorial:hover img {
      transform: scale(1.03);
      filter: saturate(1.05) brightness(1.02);
    }

    .photo-sensorial-caption {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      pointer-events: none;
    }

    .photo-sensorial-text {
      color: var(--gold-soft);
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(1.6rem, 3vw, 3rem);
      font-weight: 600;
      font-style: italic;
      text-align: center;
      line-height: 1.15;
      letter-spacing: -.01em;
      text-shadow: 0 2px 24px rgba(0,0,0,.55), 0 0 40px rgba(0,0,0,.3);
      padding: 0 40px;
    }

    /* Wider dissolved strip for headphones */
    .photo-sensorial.wide img {
      height: 380px;
      -webkit-mask-image: radial-gradient(ellipse 88% 72% at 50% 50%, black 35%, transparent 100%);
      mask-image: radial-gradient(ellipse 88% 72% at 50% 50%, black 35%, transparent 100%);
    }

    /* ── BENEFITS ── */
    .benefits-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px 34px; margin: 34px 0; }
    .benefit span { color: var(--gold); font-size: 1.1rem; }

    /* ── CENTER ── */
    .center { text-align: center; max-width: 860px; margin: 0 auto; }

    /* ── FOR GRID ── */
    .for-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px 34px; margin-top: 34px; }

    /* ── PILLARS ── */
    .pillars { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 42px; }

    /* ── PHOTO ACCENT SECTION ── */
    .photo-accent-section {
      position: relative;
      overflow: hidden;
    }

    .photo-accent-bg {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      opacity: .22;
    }

    .photo-accent-section .container {
      position: relative;
      z-index: 1;
    }

    /* ── CREATOR ── */
    .creator {
      display: grid;
      grid-template-columns: .85fr 1.15fr;
      gap: 64px;
      align-items: start;
    }

    .portrait-wrap {
      position: relative;
    }

    .portrait {
      width: 100%;
      border-radius: var(--radius-lg);
      overflow: hidden;
      box-shadow: var(--shadow);
      border: 1px solid rgba(201,165,90,.5);
      position: relative;
    }

    .portrait img {
      width: 100%;
      display: block;
      object-fit: cover;
    }

    .portrait-caption {
      position: absolute;
      left: 22px;
      bottom: 22px;
      right: 22px;
      padding: 18px 22px;
      border-radius: 16px;
      background: rgba(10,20,30,.52);
      backdrop-filter: blur(12px);
      color: var(--cream-2);
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.8rem;
      border: 1px solid rgba(232,209,154,.3);
      letter-spacing: -.02em;
    }

    /* ── SECONDARY PORTRAIT STRIP ── */
    .creator-photos {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 16px;
      margin-top: 24px;
    }

    .creator-photo-sm {
      border-radius: 18px;
      overflow: hidden;
      height: 200px;
      position: relative;
      box-shadow: 0 12px 36px rgba(17,17,17,.14);
      border: 1px solid rgba(201,165,90,.3);
    }

    .creator-photo-sm img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
      display: block;
    }

    /* ── FAQ ── */
    .faq { display: grid; gap: 14px; margin-top: 40px; }
    .faq-question {
      width: 100%;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 18px;
      border: 0;
      background: transparent;
      color: var(--petrol);
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.55rem;
      font-weight: 700;
      text-align: left;
      cursor: pointer;
      padding: 0;
    }

    .faq-question span:last-child {
      color: var(--gold);
      font-family: 'Raleway', sans-serif;
      font-size: 1.6rem;
    }

    .faq-answer {
      max-height: 0;
      overflow: hidden;
      opacity: 0;
      transition: max-height .35s ease, opacity .3s ease, padding-top .3s ease;
    }

    .faq-item.active .faq-answer { max-height: 280px; opacity: 1; padding-top: 18px; }

    /* ── FINAL CTA ── */
    .final-cta {
      text-align: center;
      padding: 0;
      position: relative;
      overflow: hidden;
    }

    .final-cta-bg {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center 20%;
    }

    .final-cta-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(
        135deg,
        rgba(75,16,36,.88) 0%,
        rgba(14,51,68,.92) 100%
      );
    }

    .final-cta-content {
      position: relative;
      z-index: 1;
      padding: 120px 0;
    }

    .final-cta h2, .final-cta p { color: var(--cream-2); }

    /* ── FOOTER ── */
    footer {
      padding: 58px 0;
      background: #071820;
      color: rgba(255,249,239,.74);
      border-top: 1px solid rgba(201,165,90,.3);
    }

    .footer-grid {
      display: grid;
      grid-template-columns: 1.2fr 1fr;
      gap: 40px;
      align-items: end;
    }

    .footer-logo img {
      height: 56px;
      width: auto;
      display: block;
      margin-bottom: 18px;
      filter: brightness(0) invert(1) sepia(1) saturate(.6) hue-rotate(5deg);
      opacity: .85;
    }

    footer a { color: var(--gold-soft); text-decoration: none; border-bottom: 1px solid transparent; transition: var(--ease); }
    footer a:hover { border-color: var(--gold); }
    .footer-links { display: flex; flex-wrap: wrap; gap: 18px; justify-content: flex-end; font-family: 'Raleway', sans-serif; font-size: .8rem; }
    .legal { font-size: .86rem; line-height: 1.7; color: rgba(255,249,239,.62); }

    /* ── ANIMATIONS ── */
    .reveal { opacity: 0; transform: translateY(22px); transition: opacity .8s ease, transform .8s ease; }
    .reveal.visible { opacity: 1; transform: translateY(0); }

    @keyframes breathe {
      0%, 100% { transform: scale(1); }
      50% { transform: scale(1.018); }
    }

    /* ── MARQUEE STRIP ── */
    .marquee-strip {
      overflow: hidden;
      background: linear-gradient(135deg, var(--wine), var(--petrol));
      border-top: 1px solid rgba(201,165,90,.35);
      border-bottom: 1px solid rgba(201,165,90,.35);
      padding: 18px 0;
      position: relative;
    }

    .marquee-track {
      display: flex;
      gap: 0;
      width: max-content;
      animation: marquee-scroll 22s linear infinite;
    }

    .marquee-track:hover { animation-play-state: paused; }

    .marquee-item {
      white-space: nowrap;
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(1.5rem, 2.5vw, 2.2rem);
      font-weight: 600;
      font-style: italic;
      color: var(--gold-soft);
      letter-spacing: .04em;
      padding: 0 54px;
    }

    .marquee-sep {
      color: var(--gold);
      opacity: .6;
      padding: 0 6px;
    }

    @keyframes marquee-scroll {
      from { transform: translateX(0); }
      to   { transform: translateX(-50%); }
    }

    /* ── MARQUEE STRIP ── */
    .marquee-strip {
      overflow: hidden;
      background: linear-gradient(135deg, var(--wine), var(--petrol));
      border-top: 1px solid rgba(201,165,90,.35);
      border-bottom: 1px solid rgba(201,165,90,.35);
      padding: 20px 0;
      position: relative;
    }

    .marquee-track {
      display: flex;
      width: max-content;
      animation: marquee-scroll 26s linear infinite;
    }

    .marquee-item {
      white-space: nowrap;
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(1.4rem, 2.2vw, 2rem);
      font-weight: 500;
      font-style: italic;
      color: var(--gold-soft);
      letter-spacing: .06em;
      padding: 0 48px;
    }

    .marquee-sep {
      color: var(--gold);
      opacity: .7;
      padding: 0 8px;
      font-style: normal;
    }

    @keyframes marquee-scroll {
      from { transform: translateX(0); }
      to   { transform: translateX(-50%); }
    }

    /* ── PHOTO INTERACTIVE EFFECTS ── */
    .photo-sensorial img {
      transition: transform 1.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), filter 0.8s ease;
    }

    /* Hero photo sensorial */
    .hero-photo {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
      transition: transform 6s ease-out, filter .8s ease;
      -webkit-mask-image: radial-gradient(ellipse 82% 88% at 50% 42%, black 38%, transparent 100%);
      mask-image: radial-gradient(ellipse 82% 88% at 50% 42%, black 38%, transparent 100%);
      filter: saturate(0.9) brightness(0.97);
    }

    /* Portrait sensorial — dissolve edges */
    .portrait {
      border: none !important;
      box-shadow: none !important;
      background: transparent;
      overflow: visible;
    }

    .portrait img {
      border-radius: 0;
      -webkit-mask-image: radial-gradient(ellipse 80% 86% at 50% 42%, black 38%, transparent 100%);
      mask-image: radial-gradient(ellipse 80% 86% at 50% 42%, black 38%, transparent 100%);
      transition: transform 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94), filter 0.8s ease;
      filter: saturate(0.88) brightness(0.97);
    }

    .portrait:hover img {
      transform: scale(1.03);
      filter: saturate(1.06) brightness(1.02);
    }

    .portrait-caption {
      position: static;
      background: transparent;
      backdrop-filter: none;
      border: none;
      color: var(--petrol);
      font-family: 'Great Vibes', cursive;
      font-size: 2.6rem;
      text-align: center;
      margin-top: 8px;
      padding: 0;
      letter-spacing: .02em;
      text-shadow: none;
    }

    .creator-photo-sm {
      border-radius: 0;
      overflow: visible;
      border: none !important;
      box-shadow: none !important;
      background: transparent;
    }

    .creator-photo-sm img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
      display: block;
      border-radius: 0;
      -webkit-mask-image: radial-gradient(ellipse 78% 78% at 50% 50%, black 30%, transparent 100%);
      mask-image: radial-gradient(ellipse 78% 78% at 50% 50%, black 30%, transparent 100%);
      transition: transform 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94), filter 0.8s ease;
      filter: saturate(0.85);
    }

    .creator-photo-sm:hover img {
      transform: scale(1.05);
      filter: saturate(1.08);
    }

    /* Cards subtle lift already handled */

    /* ── GLITTER CURSOR ── */
    #glitter-canvas {
      position: fixed;
      inset: 0;
      width: 100%;
      height: 100%;
      pointer-events: none;
      z-index: 9999;
    }

    @media (hover: none), (pointer: coarse) {
      #glitter-canvas { display: none; }
    }

    /* Ensure reveal works without JS */
    .reveal {
      opacity: 0;
      transform: translateY(22px);
      transition: opacity .8s ease, transform .8s ease;
    }
    .reveal.visible {
      opacity: 1;
      transform: translateY(0);
    }
    /* Fallback: if JS intersection observer never fires, still show content */
    @media (prefers-reduced-motion: reduce) {
      .reveal { opacity: 1 !important; transform: none !important; }
    }

    @media (max-width: 980px) {
      .nav-links { display: none; }
      .hero-grid, .two-col, .creator, .footer-grid { grid-template-columns: 1fr; }
      .cards, .pillars { grid-template-columns: 1fr 1fr; }
      .capture-form { grid-template-columns: 1fr; border-radius: 28px; }
      .visual-card { min-height: 420px; }
      .photo-sensorial img { height: 340px; }
      .photo-sensorial.wide img { height: 280px; }
    }

    @media (max-width: 680px) {
      .container { width: min(100% - 28px, 1160px); }
      section { padding: 74px 0; }
      .hero { padding-top: 54px; }
      .hero-bullets, .benefits-grid, .for-grid, .cards, .pillars { grid-template-columns: 1fr; }
      .visual-card { min-height: 340px; }
      .creator-photos { grid-template-columns: 1fr; }
      .footer-links { justify-content: flex-start; }
      h1 { font-size: clamp(3rem, 14vw, 4.8rem); }
      h2 { font-size: clamp(2.2rem, 11vw, 3.6rem); }
      .photo-sensorial img { height: 260px; }
      .photo-sensorial.wide img { height: 220px; }
      .creator-photo-sm { height: 160px; }
      .nav { height: 76px; }
      .logo img { height: 68px; }
    }