/* Generated by src/site/scope-themes.js from src/site/themes/about.css. Edit the source, not this file. */
.t-about {
    --red: #9b0041;
    --coral: #e8394a;
    --pink: #f0a4c0;
    --blush: #fcecf2;
    --ink: #0d0d12;
    --ink-2: rgba(13, 13, 18, 0.76);
    --muted: rgba(13, 13, 18, 0.56);
    --line: rgba(13, 13, 18, 0.12);
    --head: 'Right Grotesk Compact', 'Arial Narrow', Arial, sans-serif;
    --body: 'ABC Monument Grotesk', Inter, -apple-system, 'Segoe UI', sans-serif;
    --max: none;
    --gutter: clamp(48px, 5vw, 104px);
    --header-h: 76px;
    --ease: cubic-bezier(0.22, 1, 0.36, 1);
  }
  *:is(.t-about,.t-about *) { box-sizing: border-box; }
  .t-about { margin: 0; background: #fff; color: var(--ink); font-family: var(--body); font-size: 16px; line-height: 1.5; -webkit-font-smoothing: antialiased; overflow-x: clip; }
  img:is(.t-about,.t-about *) { display: block; max-width: 100%; }
  a:is(.t-about,.t-about *) { color: inherit; text-decoration: none; }
  h1:is(.t-about,.t-about *), h2:is(.t-about,.t-about *), h3:is(.t-about,.t-about *), p:is(.t-about,.t-about *) { margin: 0; }
  :focus-visible:is(.t-about,.t-about *) { outline: 2px solid var(--coral); outline-offset: 3px; }
  .container:is(.t-about,.t-about *) { max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); }
  .arr:is(.t-about,.t-about *) { display: inline-block; transition: transform 0.4s var(--ease); }

  /* Scroll reveal */
  .rv:is(.t-about,.t-about *) { opacity: 0; transform: translateY(32px); transition: opacity 0.9s ease, transform 0.9s var(--ease); }
  .rv.in:is(.t-about,.t-about *) { opacity: 1; transform: none; }
  .rv-d1:is(.t-about,.t-about *) { transition-delay: 0.12s; } .rv-d2:is(.t-about,.t-about *) { transition-delay: 0.24s; } .rv-d3:is(.t-about,.t-about *) { transition-delay: 0.36s; }

  /* ---------- Hero ---------- */
  .hero:is(.t-about,.t-about *) { padding: clamp(40px, 6vw, 88px) 0 clamp(64px, 8vw, 120px); }
  .kicker:is(.t-about,.t-about *) { display: inline-flex; align-items: center; gap: 12px; font-size: 14px; color: var(--red); margin-bottom: clamp(24px, 3vw, 40px); }
  .kicker:is(.t-about,.t-about *)::before { content: ''; width: 32px; height: 2px; background: var(--coral); }
  .hero__grid:is(.t-about,.t-about *) { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: clamp(40px, 6vw, 104px); align-items: end; }
  .kicker:is(.t-about,.t-about *) { display: inline-flex; align-items: center; gap: 12px; font-size: 14px; color: var(--red); }
  .kicker:is(.t-about,.t-about *)::before { content: ''; width: 32px; height: 2px; background: var(--coral); }
  .hero__title:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; color: var(--red); font-size: clamp(64px, 11vw, 176px); line-height: 0.86; }
  .hero__lead:is(.t-about,.t-about *) { font-size: clamp(22px, 2.3vw, 34px); line-height: 1.22; letter-spacing: -0.01em; margin-top: clamp(28px, 3.5vw, 48px); max-width: 26ch; }
  .hero__lead em:is(.t-about,.t-about *) { font-style: normal; color: var(--red); }
  .roles:is(.t-about,.t-about *) { list-style: none; padding: 0; margin: clamp(28px, 3.5vw, 44px) 0 0; border-top: 1px solid var(--line); }
  .roles li:is(.t-about,.t-about *) { display: flex; gap: 16px; align-items: baseline; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: clamp(15px, 1.2vw, 17px); }
  .roles li span:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; color: var(--coral); font-size: 14px; min-width: 22px; }
  .hero__media:is(.t-about,.t-about *) { position: relative; }
  .hero__photo:is(.t-about,.t-about *) { aspect-ratio: 4 / 5; overflow: hidden; background: #e9e7e6; }
  .hero__photo img:is(.t-about,.t-about *) { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; transform: scale(1.08); animation: t-about-settle 1.8s var(--ease) 0.1s forwards; }
  @keyframes t-about-settle { to { transform: scale(1); } }
  .hero__tag:is(.t-about,.t-about *) { position: absolute; left: clamp(-40px, -3vw, -16px); bottom: clamp(24px, 4vw, 56px); background: var(--red); color: #fff; padding: 18px 22px; max-width: 250px; }
  .hero__tag b:is(.t-about,.t-about *) { display: block; font-family: var(--head); font-weight: 700; font-size: 26px; line-height: 1; }
  .hero__tag span:is(.t-about,.t-about *) { display: block; font-size: 13px; color: var(--pink); margin-top: 6px; }
  @media (max-width: 900px) {
    .hero__grid:is(.t-about,.t-about *) { grid-template-columns: 1fr; }
    .hero__media:is(.t-about,.t-about *) { order: -1; max-width: 520px; }
    .hero__tag:is(.t-about,.t-about *) { left: 16px; }
  }

  /* ---------- Photo ribbon ---------- */
  .ribbon:is(.t-about,.t-about *) { overflow: hidden; padding: 8px 0 clamp(72px, 9vw, 128px); }
  .ribbon__track:is(.t-about,.t-about *) { display: flex; gap: 16px; width: max-content; will-change: transform; }
  .ribbon__track figure:is(.t-about,.t-about *) { margin: 0; flex: none; height: clamp(220px, 26vw, 380px); overflow: hidden; }
  .ribbon__track figure:nth-child(odd):is(.t-about,.t-about *) { margin-top: 40px; }
  .ribbon__track img:is(.t-about,.t-about *) { height: 100%; width: auto; object-fit: cover; transition: transform 1.2s var(--ease); }
  .ribbon__track figure:hover img:is(.t-about,.t-about *) { transform: scale(1.05); }

  /* ---------- Story ---------- */
  .story:is(.t-about,.t-about *) { padding-bottom: clamp(80px, 10vw, 144px); }
  .story__grid:is(.t-about,.t-about *) { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 clamp(20px, 2.4vw, 32px); align-items: start; }
  .story__label:is(.t-about,.t-about *) { grid-column: 1 / span 12; display: flex; align-items: baseline; gap: 18px; margin-bottom: clamp(32px, 4vw, 56px); }
  .story__label h2:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; color: var(--red); font-size: clamp(40px, 5.2vw, 66px); line-height: 1.02; }
  .story__label span:is(.t-about,.t-about *) { flex: 1; height: 1px; background: var(--line); transform: translateY(-10px); }
  /* Staggered pair: side by side, the portrait dropped lower so the two read as a collage without touching */
  .story__images:is(.t-about,.t-about *) { grid-column: 1 / span 6; }
  .story__img:is(.t-about,.t-about *) { overflow: hidden; }
  .story__img img:is(.t-about,.t-about *) { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
  .story__img:hover img:is(.t-about,.t-about *) { transform: scale(1.04); }
  .story__img--a:is(.t-about,.t-about *) { aspect-ratio: 4 / 5; }
  .story__text:is(.t-about,.t-about *) { grid-column: 8 / span 5; padding-top: clamp(8px, 2vw, 32px); }
  .story__text p:is(.t-about,.t-about *) { font-size: clamp(17px, 1.35vw, 20px); line-height: 1.6; color: var(--ink-2); }
  .story__text p + p:is(.t-about,.t-about *) { margin-top: 1.2em; }
  /* Drop cap spans exactly three lines (body line-height 1.6): cap top on line 1's cap height, base on line 3's baseline. */
  .dropcap:is(.t-about,.t-about *)::first-letter { float: left; font-family: var(--head); font-weight: 700; color: var(--red); font-size: 5.7em; line-height: 1; margin: -0.168em 0.28em 0 -0.01em; }
  @media (max-width: 900px) {
    .story__images:is(.t-about,.t-about *), .story__text:is(.t-about,.t-about *) { grid-column: 1 / -1; }
    .story__images:is(.t-about,.t-about *) { margin-bottom: 40px; }
  }

  /* ---------- Milestones ---------- */
  .milestones:is(.t-about,.t-about *) { background: var(--red); color: #fff; padding: clamp(64px, 8vw, 112px) 0; position: relative; overflow: hidden; }
  .milestones__head:is(.t-about,.t-about *) { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; margin-bottom: clamp(40px, 5vw, 64px); }
  .milestones__head h2:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; font-size: clamp(40px, 5.2vw, 66px); line-height: 1.02; }
  .milestones__head p:is(.t-about,.t-about *) { font-size: 15px; color: var(--pink); max-width: 36ch; }
  .milestones__grid:is(.t-about,.t-about *) { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(255,255,255,0.3); }
  .ms:is(.t-about,.t-about *) { padding: clamp(24px, 3vw, 36px) clamp(16px, 2vw, 28px) 0 0; }
  .ms + .ms:is(.t-about,.t-about *) { padding-left: clamp(16px, 2vw, 28px); border-left: 1px solid rgba(255,255,255,0.3); }
  .ms b:is(.t-about,.t-about *) { display: block; font-family: var(--head); font-weight: 700; font-size: clamp(56px, 6.4vw, 104px); line-height: 0.86; font-variant-numeric: tabular-nums; }
  .ms span:is(.t-about,.t-about *) { display: block; font-size: 15px; line-height: 1.45; color: rgba(255,255,255,0.86); margin-top: 16px; max-width: 24ch; }
  @media (max-width: 900px) {
    .milestones__grid:is(.t-about,.t-about *) { grid-template-columns: 1fr 1fr; }
    .ms:nth-child(3):is(.t-about,.t-about *) { padding-left: 0; border-left: 0; }
    .ms:nth-child(n+3):is(.t-about,.t-about *) { border-top: 1px solid rgba(255,255,255,0.3); margin-top: 24px; }
  }
  @media (max-width: 520px) {
    .milestones__grid:is(.t-about,.t-about *) { grid-template-columns: 1fr; }
    .ms:is(.t-about,.t-about *), .ms + .ms:is(.t-about,.t-about *) { padding-left: 0; border-left: 0; border-top: 1px solid rgba(255,255,255,0.3); margin-top: 0; padding-bottom: 20px; }
  }

  /* ---------- Service ---------- */
  /* ---------- My first speech: embedded Vimeo, 16:9 ---------- */
  .speech:is(.t-about,.t-about *) { padding: clamp(80px, 10vw, 144px) 0 0; }
  .speech__label:is(.t-about,.t-about *) { display: flex; align-items: baseline; gap: 18px; margin-bottom: clamp(24px, 3vw, 40px); }
  .speech__label h2:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; color: var(--red); font-size: clamp(40px, 5.2vw, 66px); line-height: 1.02; }
  .speech__label span:is(.t-about,.t-about *) { flex: 1; height: 1px; background: var(--line); transform: translateY(-10px); }
  .speech__lead:is(.t-about,.t-about *) { font-size: clamp(17px, 1.35vw, 20px); line-height: 1.6; color: var(--ink-2); max-width: 46ch; margin-bottom: clamp(28px, 3.5vw, 48px); }
  .speech__video:is(.t-about,.t-about *) { position: relative; aspect-ratio: 16 / 9; background: var(--ink); overflow: hidden; }
  .speech__video iframe:is(.t-about,.t-about *) { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
  .speech__credit:is(.t-about,.t-about *) { font-size: 13px; color: var(--muted); margin-top: 12px; }
  .service:is(.t-about,.t-about *) { padding: clamp(80px, 10vw, 144px) 0; }
  .service__grid:is(.t-about,.t-about *) { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 clamp(20px, 2.4vw, 32px); align-items: center; }
  .service__text:is(.t-about,.t-about *) { grid-column: 1 / span 5; }
  .service__text h2:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; color: var(--red); font-size: clamp(40px, 5.2vw, 66px); line-height: 1.02; margin-bottom: clamp(24px, 3vw, 36px); }
  .service__text p:is(.t-about,.t-about *) { font-size: clamp(17px, 1.35vw, 20px); line-height: 1.6; color: var(--ink-2); }
  .service__images:is(.t-about,.t-about *) { grid-column: 7 / span 6; display: grid; grid-template-columns: 1.1fr 0.9fr; grid-template-rows: 1fr 1fr; gap: 16px; }
  .service__images figure:is(.t-about,.t-about *) { margin: 0; overflow: hidden; }
  .service__images img:is(.t-about,.t-about *) { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
  .service__images figure:hover img:is(.t-about,.t-about *) { transform: scale(1.05); }
  .service__images .tall:is(.t-about,.t-about *) { grid-row: span 2; aspect-ratio: 2 / 3.1; }
  .service__images .wide:is(.t-about,.t-about *) { min-height: 0; }   /* fills its half of the tall image's height */
  .service__images .wide:is(.t-about,.t-about *) { transform: translateY(clamp(20px, 2.4vw, 36px)); }  /* the two squares sit a touch lower than the tall image */
  .service__images .wide.rv:is(.t-about,.t-about *) { transition-property: opacity; }
  .signoff:is(.t-about,.t-about *) { margin-top: clamp(36px, 4.5vw, 56px); padding-top: 28px; border-top: 1px solid var(--line); }
  .signature:is(.t-about,.t-about *) { width: min(460px, 86%); height: auto; display: block; color: var(--red); }
  .signoff__name:is(.t-about,.t-about *) { font-size: 14px; color: var(--muted); margin-top: 10px; }
  @media (max-width: 900px) {
    .service__text:is(.t-about,.t-about *), .service__images:is(.t-about,.t-about *) { grid-column: 1 / -1; }
    .service__images:is(.t-about,.t-about *) { margin-top: 48px; }
  }


  /* ---------- Quote band ---------- */
  .quote:is(.t-about,.t-about *) { background: var(--red); color: #fff; padding: clamp(72px, 9vw, 136px) 0; position: relative; overflow: hidden; }
  .quote__mark:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; font-size: clamp(120px, 16vw, 260px); line-height: 0.6; color: var(--pink); height: 0.5em; display: block; }
  .quote blockquote:is(.t-about,.t-about *) { margin: 0; font-family: var(--head); font-weight: 700; font-size: clamp(38px, 5.4vw, 88px); line-height: 0.98; max-width: 20ch; text-wrap: balance; }
  .quote blockquote em:is(.t-about,.t-about *) { font-style: normal; color: var(--pink); }
  .quote cite:is(.t-about,.t-about *) { display: block; font-style: normal; font-size: 15px; color: rgba(255,255,255,0.78); margin-top: clamp(24px, 3vw, 40px); opacity: 0; transition: opacity 0.8s ease; }
  .quote.done cite:is(.t-about,.t-about *) { opacity: 1; }
  /* Scroll fill, as on the homepage: each word starts faint and lights up as the band scrolls through; the closing words land in pink */
  .quote .w:is(.t-about,.t-about *) { display: inline-block; color: rgba(255,255,255,0.16); transform: translateY(0.08em); transition: color 0.3s ease, transform 0.5s var(--ease); }
  .quote .w.is-lit:is(.t-about,.t-about *) { color: #fff; transform: none; }
  .quote em .w.is-lit:is(.t-about,.t-about *) { color: var(--pink); }

  /* ---------- Achievements ---------- */
  .wins:is(.t-about,.t-about *) { padding: clamp(80px, 10vw, 144px) 0; }
  .wins__head:is(.t-about,.t-about *) { display: grid; grid-template-columns: 1fr 1fr; gap: 24px clamp(32px, 5vw, 96px); align-items: end; margin-bottom: clamp(40px, 5vw, 72px); }
  .wins__head h2:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; color: var(--red); font-size: clamp(40px, 5.2vw, 66px); line-height: 1.02; }
  .wins__head p:is(.t-about,.t-about *) { font-size: clamp(17px, 1.35vw, 20px); line-height: 1.55; color: var(--ink-2); }
  .wins__grid:is(.t-about,.t-about *) { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; counter-reset: win; }
  .win:is(.t-about,.t-about *) { position: relative; min-height: clamp(300px, 26vw, 380px); display: flex; flex-direction: column; justify-content: flex-start; padding: clamp(24px, 2.6vw, 36px) clamp(24px, 2.6vw, 36px) clamp(64px, 6vw, 80px); background: var(--red); color: #fff; transition: opacity 0.9s ease, transform 0.6s var(--ease); }
  /* Brand colours, second row offset (magenta pink blush / pink blush magenta) so no tile sits next to or under its own colour on desktop */
  .win:nth-child(6n+2):is(.t-about,.t-about *), .win:nth-child(6n+4):is(.t-about,.t-about *) { background: var(--pink); color: var(--red); }
  .win:nth-child(6n+3):is(.t-about,.t-about *), .win:nth-child(6n+5):is(.t-about,.t-about *) { background: var(--blush); color: var(--red); }
  .win:is(.t-about,.t-about *)::before { counter-increment: win; content: counter(win, decimal-leading-zero); position: absolute; bottom: clamp(24px, 2.6vw, 36px); left: clamp(24px, 2.6vw, 36px); font-family: var(--head); font-weight: 700; font-size: 15px; color: var(--pink); }
  .win:nth-child(6n+2):is(.t-about,.t-about *)::before, .win:nth-child(6n+3):is(.t-about,.t-about *)::before, .win:nth-child(6n+4):is(.t-about,.t-about *)::before, .win:nth-child(6n+5):is(.t-about,.t-about *)::before { color: var(--red); }
  .win__title:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; font-size: clamp(34px, 3.2vw, 48px); line-height: 1; }
  .win p:is(.t-about,.t-about *) { font-size: 15.5px; line-height: 1.55; margin-top: 14px; color: rgba(255,255,255,0.88); }
  .win:nth-child(6n+2) p:is(.t-about,.t-about *), .win:nth-child(6n+3) p:is(.t-about,.t-about *), .win:nth-child(6n+4) p:is(.t-about,.t-about *), .win:nth-child(6n+5) p:is(.t-about,.t-about *) { color: var(--ink-2); }
  .win ul:is(.t-about,.t-about *) { list-style: none; margin-top: 14px; padding: 0; }
  .win li:is(.t-about,.t-about *) { position: relative; padding-left: 16px; font-size: 15.5px; line-height: 1.55; color: rgba(255,255,255,0.88); }
  .win li + li:is(.t-about,.t-about *) { margin-top: 6px; }
  .win li:is(.t-about,.t-about *)::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: 0.7; }
  .win:nth-child(6n+2) li:is(.t-about,.t-about *), .win:nth-child(6n+3) li:is(.t-about,.t-about *), .win:nth-child(6n+4) li:is(.t-about,.t-about *), .win:nth-child(6n+5) li:is(.t-about,.t-about *) { color: var(--ink-2); }
  .win:hover:is(.t-about,.t-about *) { transform: translateY(-6px); }
  @media (max-width: 1000px) { .wins__grid:is(.t-about,.t-about *) { grid-template-columns: 1fr 1fr; } .wins__head:is(.t-about,.t-about *) { grid-template-columns: 1fr; } }
  @media (max-width: 620px) { .wins__grid:is(.t-about,.t-about *) { grid-template-columns: 1fr; } .win:is(.t-about,.t-about *) { min-height: 260px; } }

  /* ---------- Priorities ---------- */
  .next:is(.t-about,.t-about *) { background: var(--blush); padding: clamp(72px, 9vw, 128px) 0; }
  .next__head:is(.t-about,.t-about *) { display: grid; grid-template-columns: 1fr 1fr; gap: 24px clamp(32px, 5vw, 96px); align-items: end; }
  .next h2:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; color: var(--red); font-size: clamp(40px, 5.2vw, 66px); line-height: 1.02; }
  .next p:is(.t-about,.t-about *) { font-size: clamp(17px, 1.35vw, 20px); line-height: 1.6; color: var(--ink-2); }
  .tiles:is(.t-about,.t-about *) { list-style: none; padding: 0; margin: clamp(40px, 5vw, 64px) 0 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
  .tile:is(.t-about,.t-about *) { position: relative; aspect-ratio: 3 / 4; padding: 22px; background: #fff; color: var(--red); border: 1px solid rgba(155, 0, 65, 0.15); display: flex; flex-direction: column; justify-content: flex-end; transition: opacity 0.9s ease, background 0.4s ease, color 0.4s ease, border-color 0.4s ease, transform 0.6s var(--ease); }
  .tile__num:is(.t-about,.t-about *) { position: absolute; top: 20px; left: 22px; font-family: var(--head); font-weight: 700; font-size: 15px; color: var(--coral); transition: color 0.4s ease; }
  .tile__name:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; font-size: clamp(24px, 2.4vw, 38px); line-height: 0.98; }
  .tile:hover:is(.t-about,.t-about *) { background: var(--red); color: #fff; border-color: var(--red); transform: translateY(-8px); }
  .tile:hover .tile__num:is(.t-about,.t-about *) { color: var(--pink); }
  @media (max-width: 1000px) { .tiles:is(.t-about,.t-about *) { grid-template-columns: repeat(3, 1fr); } }
  @media (max-width: 860px) { .next__head:is(.t-about,.t-about *) { grid-template-columns: 1fr; align-items: start; } }
  @media (max-width: 560px) { .tiles:is(.t-about,.t-about *) { grid-template-columns: 1fr 1fr; } .tile:is(.t-about,.t-about *) { aspect-ratio: 1; } }

  /* ---------- Closing + signature ---------- */
  .closing:is(.t-about,.t-about *) { padding: clamp(96px, 12vw, 176px) 0; text-align: center; }
  .closing p:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; font-size: clamp(30px, 3.4vw, 52px); line-height: 1.04; color: var(--ink); max-width: 28ch; margin: 0 auto; text-wrap: balance; }
  .closing .signoff__name:is(.t-about,.t-about *) { font-family: var(--body); font-weight: 400; font-size: 14px; color: var(--muted); max-width: none; }
  .closing p em:is(.t-about,.t-about *) { font-style: normal; color: var(--red); }
  .closing .signoff:is(.t-about,.t-about *) { border: 0; margin-top: clamp(40px, 5vw, 64px); padding-top: 0; display: flex; flex-direction: column; align-items: center; }

  /* ---------- Portfolios ---------- */
  .portfolios:is(.t-about,.t-about *) { padding-bottom: clamp(80px, 10vw, 144px); }
  .portfolios h2:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; color: var(--red); font-size: clamp(40px, 5.2vw, 66px); line-height: 1.02; text-align: center; margin-bottom: clamp(40px, 5vw, 72px); }
  .panels:is(.t-about,.t-about *) { display: flex; gap: 12px; height: clamp(420px, 42vw, 580px); }
  .panel:is(.t-about,.t-about *) { position: relative; flex: 1; min-width: 0; overflow: hidden; margin: 0; color: #fff; transition: flex 0.8s var(--ease); }
  .panel img:is(.t-about,.t-about *) { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
  .panel:is(.t-about,.t-about *)::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(13,13,18,0.78) 0%, rgba(13,13,18,0.1) 55%, rgba(13,13,18,0) 100%); pointer-events: none; }
  .panel figcaption:is(.t-about,.t-about *) { position: absolute; z-index: 1; left: clamp(20px, 2.2vw, 32px); right: clamp(20px, 2.2vw, 32px); bottom: clamp(20px, 2.2vw, 32px); }
  .panel__num:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; font-size: 15px; color: var(--pink); }
  .panel__title:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; font-size: clamp(24px, 2.6vw, 38px); line-height: 1.02; margin-top: 6px; max-width: 14ch; }
  @media (hover: hover) {
    .panels:hover .panel:is(.t-about,.t-about *) { flex: 0.75; }
    .panels .panel:hover:is(.t-about,.t-about *) { flex: 2; }
    .panel:hover img:is(.t-about,.t-about *) { transform: scale(1.05); }
  }
  @media (max-width: 767px) { .panels:is(.t-about,.t-about *) { flex-direction: column; height: auto; } .panel:is(.t-about,.t-about *) { flex: none; height: 300px; } }

  /* ---------- Gallery ---------- */
  .gallery:is(.t-about,.t-about *) { padding-bottom: clamp(80px, 10vw, 144px); }
  .gallery__head:is(.t-about,.t-about *) { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; margin-bottom: clamp(32px, 4vw, 56px); }
  .gallery__head h2:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; color: var(--red); font-size: clamp(40px, 5.2vw, 66px); line-height: 1.02; }
  .gallery__grid:is(.t-about,.t-about *) { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: clamp(160px, 16vw, 230px); gap: 14px; }
  .gallery__grid figure:is(.t-about,.t-about *) { margin: 0; overflow: hidden; position: relative; }
  .gallery__grid img:is(.t-about,.t-about *) { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease), filter 0.6s ease; }
  .gallery__grid figure:hover img:is(.t-about,.t-about *) { transform: scale(1.06); }
  .g-tall:is(.t-about,.t-about *) { grid-row: span 2; } .g-wide:is(.t-about,.t-about *) { grid-column: span 2; } .g-big:is(.t-about,.t-about *) { grid-column: span 2; grid-row: span 2; }
  @media (max-width: 860px) { .gallery__grid:is(.t-about,.t-about *) { grid-template-columns: 1fr 1fr; grid-auto-rows: 44vw; } .g-big:is(.t-about,.t-about *) { grid-column: span 2; } }

  /* ---------- CTA ---------- */
  .cta:is(.t-about,.t-about *) { background: var(--blush); }
  .cta__inner:is(.t-about,.t-about *) { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 32px clamp(32px, 5vw, 80px); align-items: center; padding-top: clamp(56px, 7vw, 96px); padding-bottom: clamp(56px, 7vw, 96px); }
  .cta h2:is(.t-about,.t-about *) { font-family: var(--head); font-weight: 700; color: var(--red); font-size: clamp(40px, 5.2vw, 72px); line-height: 0.96; }
  .cta p:is(.t-about,.t-about *) { font-size: clamp(16px, 1.3vw, 19px); line-height: 1.5; color: var(--ink-2); margin-top: 16px; max-width: 44ch; }
  .cta__actions:is(.t-about,.t-about *) { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; }
  .btn:is(.t-about,.t-about *) { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; padding: 14px 26px; border: 1px solid var(--coral); background: var(--coral); color: #fff; transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease; }
  .btn:hover:is(.t-about,.t-about *) { background: transparent; color: var(--coral); }
  .btn--ghost:is(.t-about,.t-about *) { background: transparent; color: var(--red); border-color: var(--red); }
  .btn--ghost:hover:is(.t-about,.t-about *) { background: var(--red); color: #fff; }
  .btn:hover .arr:is(.t-about,.t-about *) { transform: translateX(4px); }
  @media (max-width: 860px) { .cta__inner:is(.t-about,.t-about *) { grid-template-columns: 1fr; } .cta__actions:is(.t-about,.t-about *) { justify-content: flex-start; } }

  @media (prefers-reduced-motion: reduce) {
    *:is(.t-about,.t-about *), *:is(.t-about,.t-about *)::before, *:is(.t-about,.t-about *)::after { animation: none !important; transition-duration: 0.01ms !important; }
    .rv:is(.t-about,.t-about *) { opacity: 1; transform: none; }
    .hero__photo img:is(.t-about,.t-about *) { transform: none; }
  }
  /* Page margins match the homepage */
  @media (max-width: 1023px) { .t-about { --gutter: 32px; } }