* { margin:0; padding:0; box-sizing:border-box; }
  .visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
  body {
    color:#f4ead9; font-family:'Archivo',sans-serif; overflow-x:hidden;
    background:
      radial-gradient(46vw 46vw at 12% 18%, #7a3fc4 0%, transparent 68%),
      radial-gradient(50vw 50vw at 88% 82%, #0a0412 0%, transparent 70%),
      radial-gradient(60vw 60vw at 70% 12%, #5322a0 0%, transparent 72%),
      #26113a;
    background-size: 160% 160%, 160% 160%, 160% 160%, 100% 100%;
    background-position: 0% 0%, 100% 100%, 80% 0%, 0 0;
    background-attachment: fixed;
    animation: driftBg 26s ease-in-out infinite alternate;
  }
  @keyframes driftBg {
    0%   { background-position: 0% 0%,   100% 100%, 80% 0%,  0 0; }
    50%  { background-position: 20% 12%, 82% 88%,   60% 18%, 0 0; }
    100% { background-position: 6% 20%,  94% 76%,   72% 10%, 0 0; }
  }
  @media (prefers-reduced-motion: reduce) {
    body { animation: none; }
  }
  .hero { position:relative; min-height:100vh; padding:8vh 6vw 12vh; overflow:hidden; }
  .site-header { position:sticky; top:0; z-index:50; width:100%; }
  .top-bar {
    display:flex; align-items:center; justify-content:center;
    width:100%;
    padding:11px 6vw;
    background:#ec2f8a;
    border-bottom:1px solid rgba(244,234,217,.28);
    position:relative; z-index:7;
  }
  .top-bar a {
    color:#1e0f2e; text-decoration:none;
    font-weight:800; font-size:12px; letter-spacing:.22em; text-transform:uppercase;
  }
  .top-bar a:hover { text-decoration:underline; }
  .nav {
    display:flex; align-items:stretch;
    width:100%;
    border-bottom:1px solid rgba(244,234,217,.28);
    position:relative; z-index:6;
    background-color:rgba(26,14,38,0);
    transition: background-color .35s ease, backdrop-filter .35s ease;
  }
  .site-header.is-scrolled .nav {
    background-color:rgba(26,14,38,.92);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
  }
  .nav-mark {
    display:flex; align-items:center; justify-content:center;
    padding:20px 34px 20px 6vw; border-left:1px solid rgba(244,234,217,.28);
    border-right:1px solid rgba(244,234,217,.28);
    font-weight:900; letter-spacing:.08em; font-size:22px; color:inherit; text-decoration:none;
  }
  .nav-links { display:flex; align-items:stretch; margin-left:auto; }
  .nav-links a:last-of-type { padding-right:6vw; }
  .nav-links a.nav-social:last-of-type { padding:20px 6vw 20px 18px !important; }
  .nav-links a {
    display:flex; align-items:center;
    padding:20px 24px;
    border-left:1px solid rgba(244,234,217,.28);
    color:inherit; text-decoration:none;
    font-size:11px; letter-spacing:.18em; text-transform:uppercase; opacity:.75;
    transition: opacity .3s ease, background-color .3s ease;
    white-space:nowrap;
  }
  .nav-links a:last-of-type { border-right:1px solid rgba(244,234,217,.28); }
  .nav-links a:hover { opacity:1; background-color:rgba(244,234,217,.07); }
  .nav-social { padding:20px 18px !important; }
  .nav-social svg { width:16px; height:16px; }
  .nav-toggle { display:none; }
  .nav-dropdown { display:none; }

  @media (max-width:900px) {
    .nav-links { display:none; }
    .nav-toggle {
      display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
      width:64px; margin-left:auto; margin-right:0;
      border-left:1px solid rgba(244,234,217,.28);
      background:none; border-top:none; border-bottom:none; border-right:none;
      cursor:pointer;
    }
    .nav-toggle span { width:22px; height:2px; background:#f4ead9; transition:transform .3s ease, opacity .3s ease; }
    .nav.is-open .nav-toggle span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
    .nav.is-open .nav-toggle span:nth-child(2) { opacity:0; }
    .nav.is-open .nav-toggle span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

    .nav-dropdown {
      display:block;
      position:absolute; top:100%; left:0; width:100%;
      background:#1a0e26;
      border-bottom:1px solid rgba(244,234,217,.28);
      max-height:0; overflow:hidden;
      transition:max-height .5s cubic-bezier(.16,1,.3,1);
    }
    .nav.is-open .nav-dropdown { max-height:600px; }
    .nav-dropdown a {
      display:flex; align-items:center;
      padding:26px 6vw;
      border-top:1px solid rgba(244,234,217,.2);
      color:inherit; text-decoration:none;
      font-size:clamp(22px,6vw,32px); font-weight:900; letter-spacing:-.01em; text-transform:none;
      transition: background-color .3s ease, padding-left .3s ease;
    }
    .nav-dropdown a:hover { background-color:rgba(244,234,217,.06); padding-left:calc(6vw + 10px); }
    .nav-dropdown .nav-dropdown-socials { display:flex; gap:18px; padding:22px 6vw 30px; border-top:1px solid rgba(244,234,217,.2); }
    .nav-dropdown .nav-dropdown-socials a { padding:0; border:none; font-size:0; }
    .nav-dropdown .nav-dropdown-socials svg { width:22px; height:22px; }
  }
  .stage { position:relative; height:82vh; }
  .ph {
    position:absolute; border-radius:10px; overflow:hidden;
    box-shadow:0 18px 40px rgba(10,5,18,.45);
    transform: rotate(var(--r)); transition: transform .6s cubic-bezier(.16,1,.3,1), box-shadow .6s cubic-bezier(.16,1,.3,1);
  }
  .ph:hover {
    transform: rotate(calc(var(--r) * -.25)) scale(1.16) translateY(-22px);
    box-shadow:0 40px 70px rgba(10,5,18,.7);
    z-index:3 !important;
  }
  .ph picture, .ph img { width:100%; height:100%; display:block; }
  .ph img { object-fit:cover; }
  .p1 { --r:-8deg; width:28vw; max-width:340px; aspect-ratio:4/5; top:0%; left:0%; z-index:2; }
  .p2 { --r:7deg; width:23vw; max-width:280px; aspect-ratio:1/1; top:2%; right:2%; z-index:2; }
  .p3 { --r:5deg; width:22vw; max-width:270px; aspect-ratio:4/5; bottom:0%; left:14%; z-index:2; }
  .p4 { --r:-6deg; width:20vw; max-width:245px; aspect-ratio:1/1; bottom:4%; right:12%; z-index:2; }
  .p5 { --r:9deg; width:17vw; max-width:205px; aspect-ratio:4/5; top:42%; left:0%; z-index:1; }
  .p6 { --r:-9deg; width:18vw; max-width:215px; aspect-ratio:4/5; top:38%; right:-1%; z-index:1; }
  .tag-mark {
    position:absolute; z-index:4; top:40%; left:50%; transform:translate(-50%,-50%) rotate(0deg);
    width:min(46vw,620px); aspect-ratio:955/555;
    background-color:#f4ead9;
    -webkit-mask:url(../images/tag-white.webp) center/contain no-repeat;
    mask:url(../images/tag-white.webp) center/contain no-repeat;
    filter: drop-shadow(0 6px 22px rgba(0,0,0,.4));
    transition: transform .6s cubic-bezier(.16,1,.3,1);
  }
  .tag-mark:hover { transform:translate(-50%,-50%) rotate(-5deg) scale(1.1); }
  .headline-wrap { position:absolute; z-index:5; top:76%; left:50%; transform:translate(-50%,-50%); text-align:center; width:100%; }
  @media (max-width:900px) {
    .headline-wrap { top:60%; }
  }
  @media (max-width:560px) {
    .headline-wrap { top:58%; }
  }
  .script { display:inline-block; font-family:'Archivo',sans-serif; font-weight:900; font-size:clamp(26px,3.8vw,46px); letter-spacing:.08em; color:#ec2f8a; transition: transform .5s cubic-bezier(.16,1,.3,1); }
  .script:hover { transform: rotate(-4deg) scale(1.16); }
  .tagline { display:block; margin-top:1.4vh; font-size:13px; letter-spacing:.34em; text-transform:uppercase; color:#f4ead9; opacity:.9; }
  .badge { position:absolute; bottom:5vh; right:5vw; width:70px; opacity:.85; z-index:6; filter: drop-shadow(0 3px 8px rgba(0,0,0,.4)); }

  /* ---------- about ---------- */
  .about {
    position:relative;
    padding:14vh 0 14vh 6vw;
    display:grid;
    grid-template-columns:1.15fr 1fr;
    gap:4vw;
    align-items:center;
    overflow:hidden;
    background:
      radial-gradient(50vw 50vw at 85% 20%, #5322a0 0%, transparent 70%),
      radial-gradient(55vw 55vw at 10% 90%, #0a0412 0%, transparent 72%),
      #170a20;
    background-size: 160% 160%, 160% 160%, 100% 100%;
    background-position: 100% 0%, 0% 100%, 0 0;
    animation: driftBg2 30s ease-in-out infinite alternate;
  }
  @keyframes driftBg2 {
    0%   { background-position: 100% 0%, 0% 100%, 0 0; }
    50%  { background-position: 80% 14%, 16% 82%, 0 0; }
    100% { background-position: 92% 8%,  8% 90%,  0 0; }
  }
  @media (prefers-reduced-motion: reduce) { .about { animation:none; } }
  .about-photo { position:relative; overflow:hidden; aspect-ratio:4/3; border-radius:10px; }
  .about-photo picture, .about-photo img { width:100%; height:100%; display:block; }
  .about-photo img { object-fit:cover; object-position:38% 50%; filter:grayscale(1) contrast(1.08); }
  .about-photo::after {
    content:""; position:absolute; inset:0;
    background:linear-gradient(200deg, rgba(236,47,138,.3), rgba(83,34,160,.36) 55%, rgba(23,10,32,.1));
    mix-blend-mode:multiply;
  }
  .about-copy { padding-right:6vw; }
  .about-title { font-size:13px; letter-spacing:.16em; text-transform:uppercase; color:#f2b431; font-weight:700; line-height:1.9; margin-bottom:24px; }
  .about p { font-size:16px; line-height:1.85; color:#f4ead9; opacity:.85; max-width:540px; margin-bottom:16px; }
  .about-clients { margin-top:26px; display:flex; flex-wrap:wrap; gap:12px 28px; }
  .about-clients span { font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:#f4ead9; opacity:.55; }
  @media (max-width:820px) {
    .about { grid-template-columns:1fr; padding:10vh 6vw; }
    .about-copy { padding-right:0; }
  }

  /* ---------- disciplines ---------- */
  .disciplines { background:#1e0f2e; padding:6vh 0; }
  .feature {
    position:relative;
    display:grid; grid-template-columns:1fr 1fr;
    gap:5vw;
    align-items:center;
    padding:9vh 6vw;
    overflow:hidden;
  }
  .feature-ghost {
    position:absolute; top:50%; left:6vw; transform:translateY(-50%);
    font-size:clamp(70px,13vw,220px); font-weight:900; line-height:1;
    color:transparent; -webkit-text-stroke:1px rgba(244,234,217,.14);
    text-stroke:1px rgba(244,234,217,.14);
    letter-spacing:-.02em; white-space:nowrap; z-index:0; pointer-events:none;
  }
  .feature--reverse { grid-template-columns:1fr 1fr; }
  .feature--reverse .feature-cluster { order:2; }
  .feature--reverse .feature-copy { order:1; }
  .feature--reverse .feature-ghost { left:auto; right:6vw; }
  .feature-cluster { position:relative; height:46vh; min-height:340px; z-index:1; }
  .feature-cluster .ph { position:absolute; border-radius:10px; overflow:hidden; box-shadow:0 18px 40px rgba(10,5,18,.45); transform:rotate(var(--r)); transition:transform .55s cubic-bezier(.16,1,.3,1), box-shadow .55s cubic-bezier(.16,1,.3,1); }
  .feature-cluster .ph:hover { transform:rotate(calc(var(--r) * -.3)) scale(1.12) translateY(-16px); box-shadow:0 34px 60px rgba(10,5,18,.65); z-index:5 !important; }
  .feature-cluster .ph picture, .ph img { width:100%; height:100%; display:block; }
  .ph img { object-fit:cover; }
  .fc-a { --r:-6deg; width:56%; aspect-ratio:4/5; top:2%; left:2%; z-index:2; }
  .fc-b { --r:8deg; width:42%; aspect-ratio:1/1; bottom:4%; right:4%; z-index:3; }
  .fc-c { --r:-4deg; width:34%; aspect-ratio:4/5; top:30%; right:14%; z-index:1; }
  .feature-copy { position:relative; z-index:1; max-width:480px; }
  .feature-eyebrow { font-size:12px; letter-spacing:.3em; text-transform:uppercase; color:#f2b431; margin-bottom:18px; }
  .feature-copy h3 { font-size:clamp(30px,3.6vw,46px); font-weight:900; letter-spacing:-.01em; margin-bottom:20px; color:#f4ead9; }
  .feature-copy p { font-size:16px; line-height:1.85; color:#f4ead9; opacity:.82; }
  .feature:nth-child(1) .feature-eyebrow { color:#ec2f8a; }
  .feature:nth-child(2) .feature-eyebrow { color:#2fd6c1; }
  .feature:nth-child(3) .feature-eyebrow { color:#f2b431; }
  @media (max-width:900px) {
    .feature, .feature--reverse { grid-template-columns:1fr; padding:8vh 6vw 12vh; }
    .feature--reverse .feature-cluster,
    .feature--reverse .feature-copy { order:initial; }
    .feature-ghost { display:none; }
    .feature-cluster { height:340px; margin-bottom:4vh; }
  }

  /* ---------- process ---------- */
  .process { position:relative; background:#170a20; padding:14vh 6vw 10vh; overflow:hidden; }
  .process::before {
    content:""; position:absolute; inset:0; pointer-events:none;
    background:
      radial-gradient(42vw 42vw at 92% 8%, #5322a0 0%, transparent 70%),
      radial-gradient(46vw 46vw at 4% 96%, #0a0412 0%, transparent 72%);
    opacity:.9;
  }
  .process-head { position:relative; z-index:1; max-width:620px; margin-bottom:9vh; }
  .process-eyebrow { font-size:12px; letter-spacing:.3em; text-transform:uppercase; color:#2fd6c1; margin-bottom:18px; }
  .process-head h2 { font-size:clamp(32px,4.4vw,58px); font-weight:900; letter-spacing:-.01em; margin-bottom:20px; }
  .process-head p { font-size:16px; line-height:1.85; opacity:.82; max-width:520px; }
  .process-list { position:relative; z-index:1; border-top:1px solid rgba(244,234,217,.22); }
  .process-step {
    display:grid; grid-template-columns:96px 280px 1fr;
    gap:5vw; align-items:baseline;
    padding:30px 12px; margin:0 -12px;
    border-bottom:1px solid rgba(244,234,217,.22);
    transition: padding-left .35s cubic-bezier(.16,1,.3,1), background-color .35s ease;
  }
  .process-step:hover { padding-left:26px; background-color:rgba(244,234,217,.045); }
  .process-num { font-size:14px; font-weight:900; letter-spacing:.05em; }
  .process-title { font-size:clamp(17px,1.6vw,21px); font-weight:900; text-transform:uppercase; letter-spacing:.03em; }
  .process-desc { font-size:15px; line-height:1.75; opacity:.78; max-width:520px; }
  .process-step:nth-child(4n+1) .process-num { color:#ec2f8a; }
  .process-step:nth-child(4n+2) .process-num { color:#2fd6c1; }
  .process-step:nth-child(4n+3) .process-num { color:#f2b431; }
  .process-step:nth-child(4n+4) .process-num { color:#f4ead9; }
  @media (max-width:820px) {
    .process-step { grid-template-columns:1fr; gap:10px; padding:24px 12px; }
    .process-step:hover { padding-left:12px; }
  }

  /* ---------- final cta ---------- */
  .cta-final {
    position:relative; overflow:hidden;
    padding:20vh 6vw 12vh;
    text-align:center;
    display:flex; flex-direction:column; align-items:center;
  }
  .cta-glow {
    position:absolute; top:50%; left:50%; width:70vmin; height:70vmin;
    transform:translate(-50%,-50%);
    background:radial-gradient(circle, rgba(236,47,138,.28) 0%, transparent 70%);
    pointer-events:none; z-index:0;
  }
  .cta-eyebrow { position:relative; z-index:1; font-size:12px; letter-spacing:.3em; text-transform:uppercase; color:#2fd6c1; margin-bottom:22px; }
  .cta-final h2 {
    position:relative; z-index:1;
    font-size:clamp(40px,7vw,96px); font-weight:900; letter-spacing:-.01em; line-height:1;
    margin-bottom:26px;
  }
  .cta-final p {
    position:relative; z-index:1;
    max-width:560px; font-size:17px; line-height:1.85; opacity:.82; margin-bottom:44px;
  }
  .cta-btn {
    position:relative; z-index:1;
    display:inline-flex; align-items:center; gap:12px;
    background:#ec2f8a; color:#1e0f2e; text-decoration:none;
    font-weight:900; letter-spacing:.06em; text-transform:uppercase; font-size:14px;
    padding:20px 42px; border-radius:999px;
    transition: transform .4s cubic-bezier(.16,1,.3,1), background-color .3s ease;
  }
  .cta-btn:hover { transform:scale(1.06) rotate(-1deg); background-color:#f2b431; }
  .cta-footer {
    position:relative; z-index:1;
    margin-top:10vh;
    display:flex; flex-direction:column; align-items:center; gap:18px;
    padding-top:5vh; width:100%; max-width:900px;
    border-top:1px solid rgba(244,234,217,.22);
  }
  .cta-footer-socials { display:flex; gap:22px; }
  .cta-footer-socials a { color:#f4ead9; opacity:.7; transition:opacity .3s ease; }
  .cta-footer-socials a:hover { opacity:1; }
  .cta-footer-socials svg { width:20px; height:20px; }
  .cta-footer-copy { font-size:11px; letter-spacing:.2em; text-transform:uppercase; opacity:.5; }