/* ── Aaron Chowdhury · portfolio ────────────────────────────────────────────
   Cut like the work: the page should read as an edit, not a template.
   What it takes from Pulse is the thinking, not just the type:
   · Real data as texture. Live timecode on the hero clip, Atlanta's next golden hour (real sun
     math), film runtimes from Vimeo, coordinates for each aerial. Nothing decorative that isn't true.
   · One accent, one meaning. Orange = play / act: play controls, the playhead, the quote button,
     the REC light, "golden hour now". Labels, categories, numbers and borders stay neutral.
   · Each face has one job. Space Grotesk is Aaron's voice (headlines and titles, sentence case,
     tight). Big Shoulders only for the name and the numbers. B612 Mono for data and labels.
     Inter for reading.
   · Frames are honest: no colour washes on the footage; headings sit outside the frames.
   · One lit block on the page: the contact card.
   Spacing scale 4 · 8 · 12 · 16 · 20 · 24 · 32 · 40 · 56 · 72 · 120
──────────────────────────────────────────────────────────────────────────── */

:root {
  --paper: #f3ece2;
  --ink-2: #c4bcb1;
  --ink-3: #8d857b;
  --kicker: #8a8178;
  --line: rgba(243, 236, 226, .085);
  --line-2: rgba(243, 236, 226, .15);
  --glass: rgba(15, 13, 12, .58);
  --ease: cubic-bezier(.16, .84, .3, 1);
  --pad: 40px;
  --nav-h: 64px;
}

.ac { position: relative; }
.ac *, .ac *::before, .ac *::after { box-sizing: border-box; }
:where(.ac) a { color: inherit; }
:where(.ac) button { font: inherit; color: inherit; }
.ac-wrap { max-width: 1240px; margin: 0 auto; padding: 0 var(--pad); }
.ac-mono, .ac-meta {
  font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3);
}

/* ── nav ── */
.ac-nav { position: sticky; top: 0; z-index: 60; height: var(--nav-h); border-bottom: 1px solid transparent;
  transition: background .4s var(--ease), border-color .4s var(--ease); }
.ac-nav.on { background: rgba(10, 9, 8, .72); border-color: var(--line);
  -webkit-backdrop-filter: blur(22px) saturate(1.25); backdrop-filter: blur(22px) saturate(1.25); }
.ac-nav .ac-wrap { height: 100%; display: flex; align-items: center; gap: 32px; }
.ac-logo { flex: none; white-space: nowrap; display: inline-flex; align-items: center; gap: 10px; text-decoration: none;
  font-family: var(--font-display); font-weight: 800; font-size: 21px; letter-spacing: .04em; color: var(--paper); }
/* the REC light */
.ac-rec { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 10px var(--accent); animation: ac-rec 2.4s ease-in-out infinite; }
@keyframes ac-rec { 50% { opacity: .35; } }
.ac-links { display: flex; align-items: center; gap: 26px; margin-left: auto; }
.ac-links a { white-space: nowrap; font-family: var(--font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; text-decoration: none;
  color: var(--ink-3); transition: color .2s; }
.ac-links a:hover { color: var(--paper); }
.ac-menu-btn { display: none; margin-left: auto; width: 44px; height: 44px; background: none; border: 0; cursor: pointer; position: relative; }
.ac-menu-btn i { position: absolute; left: 11px; right: 11px; height: 1.5px; background: var(--paper); transition: transform .3s var(--ease); }
.ac-menu-btn i:first-child { top: 18px; }
.ac-menu-btn i:last-child { top: 25px; }
.ac-menu-btn.open i:first-child { transform: translateY(3.5px) rotate(45deg); }
.ac-menu-btn.open i:last-child { transform: translateY(-3.5px) rotate(-45deg); }
.ac-menu { position: fixed; z-index: 59; inset: var(--nav-h) 0 auto 0; padding: 8px 20px 24px; background: rgba(10, 9, 8, .94);
  -webkit-backdrop-filter: blur(22px); backdrop-filter: blur(22px); border-bottom: 1px solid var(--line);
  animation: ac-drop .35s var(--ease) both; }
@keyframes ac-drop { from { opacity: 0; transform: translateY(-8px); } }
.ac-menu a:not(.ac-btn) { display: flex; justify-content: space-between; padding: 16px 0; border-bottom: 1px solid var(--line); text-decoration: none;
  font-family: var(--font-voice); font-weight: 500; font-size: 22px; letter-spacing: -.02em; color: var(--paper); }
.ac-menu a span { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .14em; color: var(--ink-3); align-self: center; }
.ac-menu .ac-btn { margin-top: 20px; width: 100%; }

/* ── buttons ── */
.ac-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 22px;
  border-radius: 999px; border: 1px solid var(--line-2); background: rgba(255, 255, 255, .035); color: var(--paper);
  font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; text-decoration: none;
  cursor: pointer; white-space: nowrap; -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  transition: background .2s, border-color .2s, transform .15s; }
.ac-btn:hover { border-color: rgba(243, 236, 226, .34); background: rgba(255, 255, 255, .06); }
.ac-btn:active { transform: scale(.97); }
.ac-btn.primary { background: var(--accent); border-color: var(--accent); color: var(--accent-fg); }
.ac-btn.primary:hover { background: var(--accent-light); border-color: var(--accent-light); }
.ac-btn.sm { min-height: 36px; padding: 0 16px; font-size: 10.5px; }
.ac-btn .ac-tri { color: var(--accent); }
.ac-btn svg { flex: none; }

/* ── hero (honest frame first, headline below — zero text overlapping footage) ── */
.ac-hero { position: relative; background: #070707; }
.ac-hero-frame { position: relative; width: 100%; aspect-ratio: 16 / 9; max-height: calc(100svh - var(--nav-h) - 52px);
  background: #070707; overflow: hidden; border-top: 1px solid var(--line); }
.ac-hero-frame video { width: 100%; height: 100%; object-fit: cover; display: block; }
.ac-hero-in { position: relative; width: 100%; padding-top: 56px; padding-bottom: 64px; border-bottom: 1px solid var(--line);
  display: grid; grid-template-columns: 7fr 5fr; gap: 56px; align-items: end; }
.ac-hero-copy { min-width: 0; }
.ac-phase { font-family: var(--font-mono); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--kicker); margin-bottom: 18px; }
.ac-h1 { margin: 0; max-width: 12ch; font-family: var(--font-voice); font-weight: 500; font-size: clamp(46px, 6.4vw, 96px);
  line-height: .96; letter-spacing: -.045em; color: var(--paper); text-wrap: balance; }
.ac-lede { margin: 0 0 28px; max-width: 44ch; font-size: 17px; line-height: 1.62; color: var(--ink-2); text-wrap: pretty; }
.ac-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.ac-btn.sound-on { border-color: var(--accent); color: var(--paper); }
.ac-hud-mute { background: none; border: 1px solid var(--line-2); border-radius: 999px; padding: 4px 10px;
  font-family: var(--font-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--paper);
  cursor: pointer; display: inline-flex; align-items: center; gap: 6px; transition: border-color .2s, color .2s; }
.ac-hud-mute:hover { border-color: rgba(243, 236, 226, .4); }
.ac-hud-mute.on { border-color: var(--accent); color: var(--accent); }

/* the hairline under the hero is the clip's timeline */
.ac-hud { position: relative; border-top: 1px solid var(--line-2); border-bottom: 1px solid var(--line); }
.ac-playhead { position: absolute; left: 0; right: 0; top: -1px; height: 1px; background: var(--accent);
  transform-origin: 0 50%; transform: scaleX(0); }
.ac-hud .ac-wrap { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding-top: 15px; padding-bottom: 20px; }
.ac-hud-l, .ac-hud-r { display: flex; align-items: center; gap: 18px; white-space: nowrap; }
.ac-hud b { font-weight: 400; color: var(--ink-2); }
.ac-tc { color: var(--paper) !important; font-variant-numeric: tabular-nums; letter-spacing: .06em; }
.ac-gh { display: inline-flex; align-items: center; gap: 8px; }
.ac-gh svg { color: var(--ink-2); }
.ac-gh.now, .ac-gh.now b { color: var(--accent-light); }
.ac-gh.now svg { color: var(--accent); animation: ac-rec 2.4s ease-in-out infinite; }

/* ── credentials ── */
.ac-creds { border-bottom: 1px solid var(--line); }
.ac-creds .ac-wrap { display: grid; grid-template-columns: repeat(4, 1fr); }
.ac-cred { padding: 36px 0 32px 28px; border-left: 1px solid var(--line); }
.ac-cred:first-child { padding-left: 0; border-left: 0; }
.ac-cred b { display: block; font-family: var(--font-display); font-weight: 900; font-size: clamp(44px, 5vw, 66px); line-height: .84;
  color: var(--paper); font-variant-numeric: tabular-nums; letter-spacing: .005em; }
.ac-cred span { display: block; margin-top: 12px; }

/* ── sections ── */
.ac-sec { padding-top: 128px; }
.ac-sec-h { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; margin-bottom: 40px; }
.ac-idx { display: block; margin-bottom: 16px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--kicker); }
.ac-idx em { font-style: normal; color: var(--ink-2); margin-right: 12px; }
.ac-h2 { margin: 0; font-family: var(--font-voice); font-weight: 500; font-size: clamp(36px, 4.4vw, 60px); line-height: 1;
  letter-spacing: -.04em; color: var(--paper); text-wrap: balance; }

/* frames: honest footage, soft corners, hairline */
.ac-frame { position: relative; overflow: hidden; isolation: isolate; border-radius: 22px; background: #0d0c0b; border: 1px solid var(--line); }
.ac-frame img, .ac-frame video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  transition: transform 1s var(--ease); }
.ac-play { position: absolute; z-index: 1; left: 50%; top: 50%; width: 76px; height: 76px; margin: -38px 0 0 -38px; border-radius: 50%;
  display: grid; place-items: center; color: var(--accent); background: rgba(10, 9, 8, .5); border: 1px solid rgba(243, 236, 226, .26);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); transition: background .3s, color .3s, transform .4s var(--ease); }
.ac-play svg { margin-left: 3px; }

/* films: one feature, then the reel index */
.ac-feature { display: block; width: 100%; padding: 0; border: 0; background: none; text-align: left; cursor: pointer; }
.ac-feature .ac-frame { aspect-ratio: 16 / 9; }
.ac-feature:hover .ac-frame img { transform: scale(1.025); }
.ac-feature:hover .ac-play { background: var(--accent); color: var(--accent-fg); transform: scale(1.06); }
.ac-cap { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; margin-top: 20px; }
.ac-cap-t { margin-top: 8px; font-family: var(--font-voice); font-weight: 500; font-size: clamp(22px, 2.4vw, 30px); line-height: 1.12;
  letter-spacing: -.03em; color: var(--paper); }
.ac-rt { font-family: var(--font-mono); font-size: 12px; letter-spacing: .06em; color: var(--ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; padding-top: 2px; }
.ac-rt span { color: var(--ink-3); margin-right: 10px; letter-spacing: .14em; font-size: 10.5px; text-transform: uppercase; }
.ac-award { display: inline-flex; align-items: center; gap: 6px; margin-left: 12px; padding: 3px 9px; border-radius: 999px; border: 1px solid var(--line-2);
  color: var(--ink-2); vertical-align: 1px; letter-spacing: .12em; }

.ac-index { margin-top: 56px; border-top: 1px solid var(--line); }
.ac-row { display: grid; grid-template-columns: 44px 176px 1fr auto 44px; align-items: center; gap: 28px; width: 100%;
  padding: 18px 12px 18px 0; border: 0; border-bottom: 1px solid var(--line); background: none; text-align: left; cursor: pointer;
  transition: background .3s var(--ease); }
.ac-row:hover { background: linear-gradient(90deg, transparent, rgba(243, 236, 226, .03) 30%); }
.ac-row .ac-frame { aspect-ratio: 16 / 9; border-radius: 10px; }
.ac-row:hover .ac-frame img { transform: scale(1.05); }
.ac-row-t { margin-top: 6px; font-family: var(--font-voice); font-weight: 500; font-size: 22px; line-height: 1.2; letter-spacing: -.025em; color: var(--paper); }
.ac-go { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--line-2); color: var(--accent);
  transition: background .25s, color .25s, border-color .25s; }
.ac-go svg { margin-left: 2px; }
.ac-row:hover .ac-go { background: var(--accent); border-color: var(--accent); color: var(--accent-fg); }

/* aerial: the flight log */
.ac-shots { display: grid; grid-template-columns: repeat(3, 1fr); gap: 44px 20px; }
.ac-shot .ac-frame { aspect-ratio: 4 / 3; border-radius: 18px; }
.ac-shot:hover .ac-frame img, .ac-shot:hover .ac-frame video { transform: scale(1.035); }
.ac-chip { position: absolute; z-index: 1; top: 12px; left: 12px; display: inline-flex; align-items: center; gap: 7px; padding: 6px 10px;
  border-radius: 999px; background: rgba(10, 9, 8, .55); border: 1px solid var(--line-2); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em; color: var(--paper); font-variant-numeric: tabular-nums; }
.ac-chip svg { color: var(--accent); }
.ac-shot-t { margin-top: 16px; font-family: var(--font-voice); font-weight: 500; font-size: 20px; line-height: 1.2; letter-spacing: -.025em; color: var(--paper); }
.ac-shot-m { display: flex; justify-content: space-between; gap: 12px; margin-top: 7px; }
.ac-shot-m span + span { color: var(--ink-2); letter-spacing: .06em; }

/* gallery */
.ac-gallery { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 210px; gap: 12px; }
.ac-tile { position: relative; margin: 0; overflow: hidden; border-radius: 14px; border: 1px solid var(--line); background: #0d0c0b; }
.ac-tile.wide { grid-column: span 2; }
.ac-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.ac-tile:hover img { transform: scale(1.04); }
.ac-tile figcaption { position: absolute; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; gap: 4px;
  padding: 36px 14px 12px; background: linear-gradient(0deg, rgba(7, 7, 7, .75), transparent); color: var(--paper); }
.ac-tile figcaption span + span { font-size: 9.5px; color: var(--ink-2); letter-spacing: .06em; }

/* about */
.ac-about { display: grid; grid-template-columns: 5fr 7fr; gap: 80px; align-items: center; }
.ac-portrait { margin: 0; }
.ac-portrait .ac-frame { aspect-ratio: 4 / 5; border-radius: 24px; }
.ac-portrait figcaption { display: flex; justify-content: space-between; margin-top: 14px; }
.ac-about .ac-h2 { margin-bottom: 28px; }
.ac-about p { margin: 0 0 18px; max-width: 56ch; font-size: 17px; line-height: 1.7; color: var(--ink-2); }
.ac-facts { display: grid; grid-template-columns: 1fr 1fr; column-gap: 28px; margin: 34px 0 36px; border-top: 1px solid var(--line); }
.ac-facts div { padding: 15px 0 16px; border-bottom: 1px solid var(--line); }
.ac-facts div:first-child { grid-column: 1 / -1; }
.ac-facts dt { margin: 0; }
.ac-facts dd { margin: 7px 0 0; font-family: var(--font-voice); font-weight: 500; font-size: 16px; letter-spacing: -.015em; color: var(--paper); }
.ac-facts dd a { color: var(--accent-light); text-decoration: none; transition: opacity .2s; }
.ac-facts dd a:hover { opacity: .85; text-decoration: underline; }
.ac-about-actions { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.ac-faisal { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; font-family: var(--font-mono); font-size: 11px;
  letter-spacing: .14em; text-transform: uppercase; color: var(--violet-light); transition: gap .3s var(--ease); }
.ac-faisal:hover { gap: 14px; }
.ac-faisal i { width: 7px; height: 7px; border-radius: 50%; background: var(--violet); box-shadow: 0 0 10px var(--violet); }

/* contact: the one lit block */
.ac-lead { position: relative; max-width: 920px; margin: 0 auto; padding: 72px 56px 60px; border-radius: 30px; text-align: center; overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--accent) 26%, transparent);
  background: radial-gradient(110% 70% at 50% -18%, color-mix(in srgb, var(--accent) 17%, transparent), transparent 70%), var(--glass);
  box-shadow: 0 30px 80px rgba(0, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .04); }
.ac-lead .ac-idx { margin-bottom: 18px; }
.ac-lead .ac-h2 { font-size: clamp(40px, 5.6vw, 76px); }
.ac-lead p { margin: 22px auto 0; max-width: 46ch; font-size: 17px; line-height: 1.6; color: var(--ink-2); }
.ac-brief { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; margin: 30px 0 36px; }
.ac-brief > span:first-child { margin-right: 6px; }
.ac-brief i { font-style: normal; padding: 8px 13px; border-radius: 999px; border: 1px solid var(--line-2); color: var(--ink-2);
  font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; }
.ac-mail { display: inline-block; margin-top: 20px; font-family: var(--font-mono); font-size: 12px; letter-spacing: .04em; color: var(--ink-3);
  text-decoration: none; transition: color .2s; }
.ac-mail:hover { color: var(--paper); }

/* footer */
.ac-foot { margin-top: 128px; border-top: 1px solid var(--line); }
.ac-foot .ac-wrap { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; padding-top: 28px; padding-bottom: 32px; }
.ac-foot .ac-logo { font-size: 18px; }
.ac-foot nav { display: flex; gap: 24px; }
.ac-foot nav a { text-decoration: none; transition: color .2s; }
.ac-foot nav a:hover { color: var(--paper); }

/* language: a quiet switch in the nav (and the phone menu), never floating over the work */
.ac-lang { display: flex; align-items: center; gap: 2px; padding-left: 18px; border-left: 1px solid var(--line-2); }
.ac-lang button { padding: 6px 5px; border: 0; background: none; cursor: pointer; font-family: var(--font-mono); font-size: 10.5px;
  letter-spacing: .1em; color: var(--ink-3); border-bottom: 1px solid transparent; transition: color .2s, border-color .2s; }
.ac-lang button:hover { color: var(--paper); }
.ac-lang button.on { color: var(--paper); border-bottom-color: var(--paper); }
.ac-menu .ac-lang { border-left: 0; padding: 18px 0 0; gap: 10px; }

/* ── software & systems (x.ai architectural hairline index — neutral + orange only) ── */
.ac-soft-sub { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }
.ac-soft-list { border-top: 1px solid var(--line); }
.ac-soft-row { display: grid; grid-template-columns: 44px 240px 1fr auto 44px; align-items: center; gap: 28px; width: 100%;
  padding: 26px 12px 26px 0; border: 0; border-bottom: 1px solid var(--line); background: none; text-align: left; cursor: pointer;
  color: inherit; font: inherit; -webkit-tap-highlight-color: transparent; transition: background .3s var(--ease); }
@media (hover: hover) {
  .ac-soft-row:hover { background: linear-gradient(90deg, transparent, rgba(243, 236, 226, .028) 30%); }
  .ac-soft-row:hover .ac-go { background: var(--accent); border-color: var(--accent); color: var(--accent-fg); }
}
.ac-soft-row:active .ac-go { background: var(--accent); border-color: var(--accent); color: var(--accent-fg); transform: scale(0.95); }
.ac-soft-head { min-width: 0; }
.ac-soft-title { font-family: var(--font-voice); font-weight: 500; font-size: 22px; line-height: 1.15; letter-spacing: -.025em; color: var(--paper); }
.ac-soft-meta { margin-top: 6px; font-family: var(--font-mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }
.ac-soft-desc { margin: 0; font-size: 15px; line-height: 1.55; color: var(--ink-2); max-width: 58ch; }
.ac-soft-spec { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); white-space: nowrap; }

@media (prefers-reduced-motion: reduce) {
  .ac-rec, .ac-gh.now svg { animation: none; }
  .ac-frame img, .ac-frame video, .ac-tile img { transition: none; }
}

/* ── phones / small tablets ── */
@media (max-width: 820px) {
  :root { --pad: 20px; --nav-h: 60px; }
  .ac-links { display: none; }
  .ac-menu-btn { display: block; }
  .ac-hero-in { grid-template-columns: 1fr; gap: 24px; padding-top: 36px; padding-bottom: 40px; }
  .ac-phase { font-size: 10px; letter-spacing: .16em; }
  .ac-h1 { font-size: clamp(42px, 12.5vw, 68px); }
  .ac-lede { font-size: 16px; margin: 0 0 24px; }
  .ac-actions .ac-btn { flex: 1; }
  .ac-hud .ac-wrap { padding-top: 13px; padding-bottom: 16px; }
  .ac-hud-r .ac-where, .ac-hud-l .ac-clock { display: none; }
  .ac-hud-l, .ac-hud-r { gap: 12px; }
  .ac-creds .ac-wrap { grid-template-columns: 1fr 1fr; }
  .ac-cred { padding: 26px 0 24px 20px; }
  .ac-cred:nth-child(odd) { padding-left: 0; border-left: 0; }
  .ac-cred:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .ac-sec { padding-top: 88px; }
  .ac-sec-h { margin-bottom: 28px; }
  .ac-cap { flex-direction: column; gap: 10px; margin-top: 16px; }
  .ac-play { width: 60px; height: 60px; margin: -30px 0 0 -30px; }
  .ac-index { margin-top: 36px; }
  .ac-row { grid-template-columns: 112px 1fr 40px; gap: 16px; padding-right: 0; }
  .ac-row-n, .ac-row > .ac-rt { display: none; }
  .ac-row-t { font-size: 17px; }
  .ac-go { width: 38px; height: 38px; }
  .ac-shots { grid-template-columns: 1fr; gap: 36px; }
  .ac-soft-row { grid-template-columns: 1fr 40px; column-gap: 16px; row-gap: 8px; padding: 22px 0; align-items: center; }
  .ac-soft-row > .ac-row-n, .ac-soft-row > .ac-soft-spec { display: none; }
  .ac-soft-head { grid-column: 1; grid-row: 1; }
  .ac-soft-desc { grid-column: 1; grid-row: 2; font-size: 14px; }
  .ac-soft-row > .ac-go { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
  .ac-gallery { grid-template-columns: 1fr 1fr; grid-auto-rows: 150px; gap: 8px; }
  .ac-tile.wide { grid-column: span 2; }
  .ac-tile figcaption span + span { display: none; }
  .ac-about { grid-template-columns: 1fr; gap: 40px; }
  .ac-facts { grid-template-columns: 1fr; }
  .ac-lead { padding: 52px 22px 44px; border-radius: 26px; }
  .ac-brief > span:first-child { width: 100%; margin: 0 0 4px; }
  .ac-lead .ac-btn { width: 100%; }
  .ac-foot { margin-top: 88px; }
  .ac-foot .ac-wrap { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 1100px) {
  .ac-links { display: none; }
  .ac-menu-btn { display: block; }
}
@media (min-width: 821px) and (max-width: 1080px) {
  .ac-row { grid-template-columns: 36px 140px 1fr auto 42px; gap: 20px; }
  .ac-soft-row { grid-template-columns: 36px 180px 1fr 42px; gap: 20px; }
  .ac-soft-row > .ac-soft-spec { display: none; }
  .ac-shots { grid-template-columns: 1fr 1fr; }
  .ac-about { gap: 48px; }
}