/* Atelier — architectural interior lighting theme */
:root {
  --at-paper: #fbfaf7;
  --at-paper-2: #f3f1ec;
  --at-ink: #141412;
  --at-ink-2: #55534d;
  --at-ink-3: #8c897f;
  --at-rule: #dedad1;
  --at-accent: #8a6a3e;
  --at-warm: #f2c98a;
  --at-dark: #1a1917;
  --at-sans: "Inter Tight", "Helvetica Neue", Arial, sans-serif;
  --at-serif: "Instrument Serif", "Times New Roman", serif;
  --at-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --at-max: 1320px;
  --at-gut: clamp(16px, 4vw, 48px);
  --at-gap: clamp(16px, 2.4vw, 32px);
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 88px; }
body.at-body { margin: 0; background: var(--at-paper); color: var(--at-ink); font: 400 16px/1.6 var(--at-sans); letter-spacing: -0.003em; overflow-x: hidden; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; }
h1, h2, h3, h4 { margin: 0; font-weight: 500; }
p { margin: 0 0 1em; }
.at-sr, .at-hp { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.at-skip { position: absolute; left: -999px; top: 8px; background: var(--at-ink); color: #fff; padding: 8px 12px; z-index: 100; }
.at-skip:focus { left: 8px; }
:focus-visible { outline: 2px solid var(--at-accent); outline-offset: 3px; }

.at-wrap { max-width: var(--at-max); margin: 0 auto; padding-left: var(--at-gut); padding-right: var(--at-gut); }

/* type */
.at-display { font-family: var(--at-serif); font-weight: 400; font-size: clamp(40px, 6vw, 84px); line-height: 1.02; letter-spacing: -0.015em; }
.at-display--md { font-size: clamp(34px, 4.4vw, 60px); line-height: 1.05; }
.at-display--sm { font-size: clamp(30px, 3.6vw, 52px); }
.at-h2 { font-size: clamp(22px, 2.2vw, 30px); line-height: 1.2; letter-spacing: -0.015em; }
.at-h3 { font-size: 18px; line-height: 1.3; }
.at-lede { font-size: clamp(17px, 1.5vw, 21px); line-height: 1.5; color: var(--at-ink-2); max-width: 46ch; font-weight: 300; }
.at-prose-lg { font-size: clamp(19px, 1.8vw, 26px); line-height: 1.45; font-weight: 300; margin: 0; max-width: 34ch; }
.at-eyebrow { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--at-ink-3); margin: 0 0 20px; }
.at-eyebrow a:hover { color: var(--at-ink); }
.at-mono { font-family: var(--at-mono); font-size: 12px; letter-spacing: .02em; color: var(--at-ink-3); }
.at-muted { color: var(--at-ink-3); }
.at-small { font-size: 14px; }

/* buttons & links */
.at-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 0 24px; background: var(--at-ink); color: #fff; border: 1px solid var(--at-ink); border-radius: 0; font-size: 15px; font-weight: 500; cursor: pointer; transition: background .2s, color .2s; }
.at-btn:hover { background: transparent; color: var(--at-ink); }
.at-btn--light { background: var(--at-paper); color: var(--at-ink); border-color: var(--at-paper); }
.at-btn--light:hover { background: transparent; color: var(--at-paper); }
.at-btn[disabled] { opacity: .5; cursor: progress; }
.at-link { display: inline-flex; gap: 6px; align-items: center; font-size: 15px; font-weight: 500; border-bottom: 1px solid var(--at-ink); padding-bottom: 2px; }
.at-link span { transition: transform .2s; }
.at-link:hover span { transform: translateX(4px); }
.at-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 28px; margin-top: 32px; }

/* header */
.at-head { position: sticky; top: 0; z-index: 50; background: rgba(251, 250, 247, .94); backdrop-filter: blur(8px); border-bottom: 1px solid var(--at-rule); }
.at-head__row { display: flex; align-items: center; justify-content: space-between; height: 68px; gap: 24px; }
.at-logo { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; font-size: 17px; letter-spacing: -0.01em; white-space: nowrap; }
.at-logo__mark { width: 18px; height: 18px; border: 1.5px solid currentColor; border-radius: 50%; position: relative; }
.at-logo__mark::after { content: ""; position: absolute; left: 50%; top: 50%; width: 6px; height: 6px; margin: -3px 0 0 -3px; border-radius: 50%; background: var(--at-accent); }
.at-nav { display: flex; align-items: center; gap: 32px; }
.at-nav ul { list-style: none; display: flex; gap: 28px; margin: 0; padding: 0; }
.at-nav ul a { font-size: 15px; color: var(--at-ink-2); padding: 6px 0; border-bottom: 1px solid transparent; }
.at-nav ul a:hover, .at-nav ul a[aria-current] { color: var(--at-ink); border-color: var(--at-ink); }
.at-nav__cta { font-size: 14px; font-weight: 500; border: 1px solid var(--at-ink); padding: 8px 16px; }
.at-nav__cta:hover { background: var(--at-ink); color: #fff; }
.at-burger { display: none; width: 44px; height: 44px; background: none; border: 0; cursor: pointer; position: relative; }
.at-burger span:not(.at-sr) { position: absolute; left: 11px; right: 11px; height: 1.5px; background: var(--at-ink); transition: transform .25s; }
.at-burger span:nth-child(1) { top: 18px; } .at-burger span:nth-child(2) { top: 25px; }
.at-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(3.5px) rotate(45deg); }
.at-burger[aria-expanded="true"] span:nth-child(2) { transform: translateY(-3.5px) rotate(-45deg); }

/* breadcrumbs */
.at-crumbs { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 20px 0 0; margin: 0; font-size: 13px; color: var(--at-ink-3); }
.at-crumbs li + li::before { content: "/"; margin-right: 6px; color: var(--at-rule); }
.at-crumbs a:hover { color: var(--at-ink); }
.at-crumbs [aria-current] { color: var(--at-ink-2); }

/* art */
.at-art { width: 100%; height: auto; color: var(--at-ink); display: block; }
.at-scene { aspect-ratio: 400 / 260; background: var(--at-paper-2); }
.at-lum { aspect-ratio: 4 / 3; }
.at-img { width: 100%; height: 100%; object-fit: cover; }
.at-figcap { font-size: 12px; color: var(--at-ink-3); margin-top: 10px; font-family: var(--at-mono); }
.at-demo { position: absolute; left: 12px; top: 12px; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--at-ink-2); background: rgba(251,250,247,.9); padding: 4px 8px; border: 1px solid var(--at-rule); }
.at-demo--inline { position: static; padding: 2px 6px; }

/* hero */
.at-hero { border-bottom: 1px solid var(--at-rule); }
.at-hero__grid { display: grid; grid-template-columns: 5fr 7fr; gap: var(--at-gap); align-items: end; padding-top: clamp(40px, 8vw, 110px); padding-bottom: clamp(32px, 5vw, 64px); }
.at-hero__txt .at-lede { margin-top: 28px; }
.at-hero__fig .at-scene { aspect-ratio: 16 / 10; }

/* stats */
.at-stats { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; border-bottom: 1px solid var(--at-rule); }
.at-stats > div { padding: 28px 24px 28px 0; display: flex; flex-direction: column-reverse; gap: 6px; }
.at-stats > div + div { padding-left: 24px; border-left: 1px solid var(--at-rule); }
.at-stats dd { margin: 0; font-family: var(--at-serif); font-size: clamp(26px, 2.6vw, 38px); line-height: 1.1; }
.at-stats dt { font-size: 13px; color: var(--at-ink-3); line-height: 1.4; }

/* sections */
.at-sec { padding-top: clamp(56px, 8vw, 112px); }
.at-sec--tight { padding-top: clamp(32px, 4vw, 56px); }
.at-sec__head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding-bottom: 20px; border-bottom: 1px solid var(--at-ink); margin-bottom: 32px; }
.at-split { display: grid; grid-template-columns: 4fr 8fr; gap: var(--at-gap); }
.at-split > :first-child { position: relative; }
main > :last-child { padding-bottom: clamp(64px, 9vw, 128px); }

/* families */
.at-families { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--at-rule); border-left: 1px solid var(--at-rule); }
.at-family { border-right: 1px solid var(--at-rule); border-bottom: 1px solid var(--at-rule); padding: 24px; display: flex; flex-direction: column; gap: 16px; transition: background .25s; }
.at-family:hover { background: #fff; }
.at-family__fig .at-art { max-width: 280px; margin: 0 auto; }
.at-family__txt { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.at-family h3 { font-size: 18px; }

/* principles band */
.at-band { background: var(--at-paper-2); margin-top: clamp(56px, 8vw, 112px); padding-bottom: clamp(56px, 8vw, 112px); }
.at-principles { list-style: none; margin: 32px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--at-gap); }
.at-principles li { border-top: 1px solid var(--at-ink); padding-top: 18px; }
.at-principles h3 { font-size: 18px; margin: 14px 0 10px; }
.at-principles p { color: var(--at-ink-2); font-size: 15px; margin: 0; }

/* applications (home) */
.at-apps { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--at-gap); }
.at-app__fig { margin-bottom: 16px; overflow: hidden; }
.at-app__fig .at-art { transition: transform .5s ease; }
.at-app:hover .at-app__fig .at-art { transform: scale(1.03); }
.at-app h3 { font-size: 18px; margin-bottom: 8px; }
.at-app p { font-size: 15px; color: var(--at-ink-2); }

/* projects */
.at-projgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--at-gap); }
.at-projgrid--2 { grid-template-columns: repeat(2, 1fr); }
.at-proj__fig { position: relative; overflow: hidden; margin-bottom: 16px; }
.at-proj__fig .at-art { transition: transform .5s ease; }
.at-proj a:hover .at-art { transform: scale(1.03); }
.at-proj__meta { font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--at-ink-3); margin-bottom: 6px; }
.at-proj h3 { font-size: 20px; line-height: 1.25; margin-bottom: 8px; }
.at-proj p { color: var(--at-ink-2); font-size: 15px; }

/* rows */
.at-rows { border-top: 1px solid var(--at-rule); }
.at-row { display: grid; grid-template-columns: 48px 4fr 6fr 24px; gap: 16px; align-items: baseline; padding: 22px 0; border-bottom: 1px solid var(--at-rule); transition: padding .25s; }
.at-row:hover { padding-left: 8px; }
.at-row__n { font-family: var(--at-mono); font-size: 12px; color: var(--at-ink-3); }
.at-row__title { font-size: 19px; font-weight: 500; line-height: 1.3; }
.at-row__sum { color: var(--at-ink-2); font-size: 15px; }
.at-row__arrow { color: var(--at-ink-3); }
.at-rows .at-row:not(:has(.at-row__n)) { grid-template-columns: 4fr 6fr 24px; }

/* cta */
.at-cta { background: var(--at-dark); color: var(--at-paper); margin-top: clamp(64px, 9vw, 128px); }
main > .at-cta:last-child { padding-bottom: 0; }
.at-cta__grid { display: grid; grid-template-columns: 7fr 5fr; gap: var(--at-gap); padding-top: clamp(56px, 7vw, 96px); padding-bottom: clamp(56px, 7vw, 96px); align-items: end; }
.at-cta p { color: #c8c4ba; font-size: 17px; }

/* page heads */
.at-pagehead { padding-top: clamp(32px, 5vw, 72px); padding-bottom: 32px; }
.at-pagehead .at-lede { margin-top: 20px; }
.at-entryhead { padding-top: clamp(32px, 5vw, 72px); padding-bottom: clamp(28px, 4vw, 48px); }
.at-entryhead .at-lede { margin-top: 20px; }
.at-entryhead--narrow { max-width: calc(780px + 2 * var(--at-gut)); }
.at-wide .at-art, .at-wide .at-img { aspect-ratio: 21 / 8; }
.at-jump { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 32px; }
.at-jump a { border: 1px solid var(--at-rule); padding: 8px 14px; font-size: 14px; display: inline-flex; gap: 8px; align-items: baseline; }
.at-jump a:hover { border-color: var(--at-ink); }

/* products overview */
.at-catblock { padding-top: clamp(48px, 6vw, 88px); }
.at-catblock__head { display: grid; grid-template-columns: 3fr 9fr; gap: var(--at-gap); align-items: center; border-top: 1px solid var(--at-ink); padding-top: 24px; margin-bottom: 28px; }
.at-catblock__head p { color: var(--at-ink-2); max-width: 60ch; margin: 10px 0 14px; }
.at-catblock__fig .at-art { max-width: 220px; }
.at-more { margin-top: 20px; }

/* product cards */
.at-pgrid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--at-rule); border-left: 1px solid var(--at-rule); }
.at-pcard { border-right: 1px solid var(--at-rule); border-bottom: 1px solid var(--at-rule); background: var(--at-paper); transition: background .2s; }
.at-pcard[hidden] { display: none; }
.at-pcard:hover { background: #fff; }
.at-pcard__link { display: flex; flex-direction: column; height: 100%; padding: 20px; }
.at-pcard__fig { padding: 8px 4px 16px; }
.at-pcard__fig .at-img { aspect-ratio: 4/3; object-fit: contain; }
.at-pcard__txt h3 { font-size: 17px; line-height: 1.3; margin: 6px 0 8px; }
.at-pcard__txt p { font-size: 14px; color: var(--at-ink-2); margin: 0; }

/* category */
.at-cathead { display: grid; grid-template-columns: 7fr 5fr; gap: var(--at-gap); align-items: center; padding-top: clamp(32px, 5vw, 72px); padding-bottom: 24px; border-bottom: 1px solid var(--at-rule); }
.at-cathead .at-lede { margin-top: 20px; }
.at-toolbar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 20px; }
.at-filter { display: flex; flex-wrap: wrap; gap: 0; border: 1px solid var(--at-ink); }
.at-pagehead .at-filter { margin-top: 28px; display: inline-flex; }
.at-filter button { background: none; border: 0; padding: 8px 14px; font-size: 13px; cursor: pointer; }
.at-filter button + button { border-left: 1px solid var(--at-ink); }
.at-filter button[aria-pressed="true"] { background: var(--at-ink); color: #fff; }
.at-note { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px; border: 1px solid var(--at-rule); padding: 28px; background: #fff; }
.at-note p { margin: 0; font-size: 18px; max-width: 52ch; }

/* product detail */
.at-prod { display: grid; grid-template-columns: 6fr 6fr; gap: clamp(24px, 5vw, 80px); padding-top: clamp(24px, 4vw, 56px); align-items: start; }
.at-prod__fig { background: #fff; border: 1px solid var(--at-rule); padding: clamp(16px, 4vw, 56px); position: sticky; top: 92px; }
.at-prod__model { margin: 14px 0 20px; font-size: 13px; }
.at-ticks { list-style: none; padding: 0; margin: 24px 0 0; border-top: 1px solid var(--at-rule); }
.at-ticks li { padding: 10px 0 10px 22px; border-bottom: 1px solid var(--at-rule); position: relative; font-size: 15px; }
.at-ticks li::before { content: ""; position: absolute; left: 0; top: 19px; width: 10px; height: 1px; background: var(--at-accent); }
.at-gallery__thumbs { display: flex; gap: 8px; margin-top: 12px; }
.at-gallery__thumbs button { width: 64px; height: 64px; border: 1px solid var(--at-rule); background: none; padding: 2px; cursor: pointer; }
.at-localnav { position: sticky; top: 68px; z-index: 40; background: rgba(251,250,247,.96); border-bottom: 1px solid var(--at-rule); border-top: 1px solid var(--at-rule); margin-top: clamp(40px, 6vw, 80px); }
.at-localnav .at-wrap { display: flex; gap: 28px; overflow-x: auto; scrollbar-width: none; }
.at-localnav a { padding: 14px 0; font-size: 14px; color: var(--at-ink-2); white-space: nowrap; border-bottom: 1px solid transparent; }
.at-localnav a:hover, .at-localnav a.is-on { color: var(--at-ink); border-color: var(--at-ink); }
.at-spec { width: 100%; border-collapse: collapse; font-size: 15px; }
.at-spec th, .at-spec td { text-align: left; vertical-align: top; padding: 12px 0; border-bottom: 1px solid var(--at-rule); }
.at-spec tr:first-child th, .at-spec tr:first-child td { border-top: 1px solid var(--at-ink); }
.at-spec th { width: 34%; font-weight: 400; color: var(--at-ink-3); padding-right: 16px; }
.at-tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border-top: 1px solid var(--at-ink); }
.at-var { width: 100%; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
.at-var th { text-align: left; font-weight: 400; color: var(--at-ink-3); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; padding: 12px 16px 12px 0; border-bottom: 1px solid var(--at-rule); white-space: nowrap; }
.at-var td { padding: 12px 16px 12px 0; border-bottom: 1px solid var(--at-rule); white-space: pre-line; vertical-align: top; }
.at-var tbody tr:hover { background: #fff; }
.at-var__act { text-align: right; padding-right: 0 !important; }
.at-chip { background: none; border: 1px solid var(--at-rule); padding: 4px 10px; font-size: 12px; cursor: pointer; white-space: nowrap; }
.at-chip:hover { border-color: var(--at-ink); }
.at-tags { list-style: none; padding: 0; margin: 8px 0 0; display: flex; flex-wrap: wrap; gap: 6px; }
.at-tagslabel { margin: 2em 0 0; }
.at-tags li { border: 1px solid var(--at-rule); padding: 3px 10px; font-size: 13px; color: var(--at-ink-2); }
.at-pager { display: grid; grid-template-columns: 1fr 1fr; gap: var(--at-gap); padding-top: 48px; }
.at-pager a { display: flex; flex-direction: column; gap: 6px; border-top: 1px solid var(--at-ink); padding-top: 16px; font-size: 17px; }
.at-pager__next { text-align: right; align-items: flex-end; }

/* prose */
.at-prose { max-width: 70ch; font-size: 17px; line-height: 1.7; }
.at-prose h2 { font-size: 24px; margin: 1.6em 0 .6em; }
.at-prose h3 { font-size: 19px; margin: 1.8em 0 .5em; }
.at-prose > :first-child { margin-top: 0; }
.at-prose ul, .at-prose ol { padding-left: 1.2em; }
.at-prose li { margin-bottom: .4em; }
.at-prose a { border-bottom: 1px solid var(--at-accent); }
.at-prose code { font-family: var(--at-mono); font-size: .88em; background: var(--at-paper-2); padding: 1px 5px; }
.at-prose table { width: 100%; border-collapse: collapse; margin: 1.4em 0; font-size: 15px; font-variant-numeric: tabular-nums; display: block; overflow-x: auto; }
.at-prose th { text-align: left; font-weight: 500; border-bottom: 1px solid var(--at-ink); padding: 8px 20px 8px 0; }
.at-prose td { border-bottom: 1px solid var(--at-rule); padding: 8px 20px 8px 0; }
.at-prose strong { font-weight: 600; }
.at-read { margin: 0 auto 0 0; max-width: 720px; }
.at-aside .at-mono { display: block; margin-bottom: 10px; }

/* facts / meta */
.at-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); margin: 20px 0; border-top: 1px solid var(--at-rule); }
.at-facts > div { padding: 14px 16px 14px 0; border-bottom: 1px solid var(--at-rule); }
.at-facts dt { font-size: 12px; color: var(--at-ink-3); }
.at-facts dd { margin: 4px 0 0; font-size: 17px; }
.at-wrap > .at-facts { margin-top: 0; }
.at-meta { margin: 0; border-top: 1px solid var(--at-ink); align-self: start; }
.at-meta > div { display: grid; grid-template-columns: 40% 60%; padding: 10px 0; border-bottom: 1px solid var(--at-rule); font-size: 14px; }
.at-meta dt { color: var(--at-ink-3); }
.at-meta dd { margin: 0; }
.at-meta dd a { border-bottom: 1px solid var(--at-accent); }
.at-meta--stack { margin-top: 32px; }

/* applications list */
.at-applist { display: flex; flex-direction: column; gap: clamp(40px, 6vw, 80px); padding-top: 24px; }
.at-appitem { display: grid; grid-template-columns: 7fr 5fr; gap: var(--at-gap); align-items: center; }
.at-appitem:nth-child(even) .at-appitem__fig { order: 2; }
.at-appitem__txt .at-h2 { margin: 10px 0 14px; }
.at-appitem__txt p { color: var(--at-ink-2); }

/* articles */
.at-lead { display: grid; grid-template-columns: 7fr 5fr; gap: var(--at-gap); align-items: center; padding-bottom: 24px; }
.at-lead .at-h2 { margin: 10px 0 14px; font-size: clamp(24px, 2.6vw, 36px); }
.at-lead p { color: var(--at-ink-2); }
.at-index { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--at-ink); }
.at-index a { display: grid; grid-template-columns: 120px 5fr 6fr; gap: 16px; padding: 22px 0; border-bottom: 1px solid var(--at-rule); align-items: baseline; }
.at-index a:hover .at-index__t { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.at-index__t { font-size: 19px; font-weight: 500; line-height: 1.3; }
.at-index__s { color: var(--at-ink-2); font-size: 15px; }

/* form */
.at-form { background: #fff; border: 1px solid var(--at-rule); padding: clamp(20px, 3vw, 36px); }
.at-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 20px; }
.at-field { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--at-ink-2); }
.at-field--full { grid-column: 1 / -1; }
.at-field input, .at-field textarea { font: inherit; font-size: 16px; color: var(--at-ink); background: var(--at-paper); border: 0; border-bottom: 1px solid var(--at-ink-3); padding: 10px 2px; border-radius: 0; width: 100%; }
.at-field input:focus, .at-field textarea:focus { outline: none; border-bottom-color: var(--at-ink); background: #fff; }
.at-field textarea { resize: vertical; min-height: 96px; }
.at-field.is-bad input, .at-field.is-bad textarea { border-bottom-color: #a33a2a; }
.at-form__foot { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; margin-top: 24px; }
.at-form__status { margin: 0; font-size: 14px; color: var(--at-ink-2); }
.at-form.is-sent .at-form__grid, .at-form.is-sent .at-btn { display: none; }
.at-form.is-sent .at-form__status { font-size: 18px; color: var(--at-ink); }

/* 404 */
.at-404 { display: grid; grid-template-columns: 5fr 7fr; gap: var(--at-gap); align-items: center; padding-top: clamp(48px, 8vw, 120px); }

/* footer */
.at-foot { border-top: 1px solid var(--at-ink); padding: 56px 0 28px; font-size: 14px; }
.at-foot__grid { display: grid; grid-template-columns: 4fr 3fr 3fr 2fr; gap: var(--at-gap); }
.at-foot__brand p { color: var(--at-ink-2); margin: 14px 0; max-width: 32ch; }
.at-foot h2 { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--at-ink-3); font-weight: 500; margin-bottom: 14px; }
.at-foot ul { list-style: none; margin: 0; padding: 0; }
.at-foot li { margin-bottom: 8px; }
.at-foot a:hover { text-decoration: underline; text-underline-offset: 3px; }
.at-foot__contact { color: var(--at-ink-2); }
.at-foot__base { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 24px; margin-top: 48px; padding-top: 20px; border-top: 1px solid var(--at-rule); color: var(--at-ink-3); font-size: 12px; }

/* responsive */
@media (max-width: 1100px) {
  .at-pgrid { grid-template-columns: repeat(3, 1fr); }
  .at-apps { grid-template-columns: repeat(2, 1fr); }
  .at-principles { grid-template-columns: repeat(2, 1fr); }
  .at-nav ul { gap: 20px; }
}
@media (max-width: 900px) {
  .at-burger { display: block; }
  .at-nav { position: fixed; inset: 68px 0 auto 0; flex-direction: column; align-items: stretch; gap: 0; background: var(--at-paper); border-bottom: 1px solid var(--at-ink); padding: 8px var(--at-gut) 24px; transform: translateY(-8px); opacity: 0; visibility: hidden; transition: opacity .2s, transform .2s, visibility .2s; max-height: calc(100vh - 68px); overflow-y: auto; }
  .at-nav.is-open { opacity: 1; visibility: visible; transform: none; }
  .at-nav ul { flex-direction: column; gap: 0; }
  .at-nav ul a { display: block; padding: 14px 0; font-size: 20px; color: var(--at-ink); border-bottom: 1px solid var(--at-rule); }
  .at-nav__cta { margin-top: 20px; text-align: center; padding: 12px; }
  .at-hero__grid, .at-split, .at-cathead, .at-prod, .at-appitem, .at-lead, .at-cta__grid, .at-404 { grid-template-columns: 1fr; }
  .at-appitem:nth-child(even) .at-appitem__fig { order: 0; }
  .at-prod__fig { position: static; }
  .at-stats { grid-template-columns: repeat(2, 1fr); }
  .at-stats > div:nth-child(3) { padding-left: 0; border-left: 0; }
  .at-stats > div:nth-child(n+3) { border-top: 1px solid var(--at-rule); }
  .at-families { grid-template-columns: repeat(2, 1fr); }
  .at-projgrid, .at-projgrid--2 { grid-template-columns: 1fr 1fr; }
  .at-pgrid { grid-template-columns: repeat(2, 1fr); }
  .at-catblock__head { grid-template-columns: 1fr; }
  .at-catblock__fig .at-art { max-width: 180px; }
  .at-foot__grid { grid-template-columns: 1fr 1fr; }
  .at-foot__brand { grid-column: 1 / -1; }
  .at-row { grid-template-columns: 36px 1fr 20px; }
  .at-row__sum { grid-column: 2; }
  .at-rows .at-row:not(:has(.at-row__n)) { grid-template-columns: 1fr 20px; }
  .at-rows .at-row:not(:has(.at-row__n)) .at-row__sum { grid-column: 1; }
  .at-index a { grid-template-columns: 1fr; gap: 6px; }
  .at-wide .at-art, .at-wide .at-img { aspect-ratio: 16 / 9; }
}
@media (max-width: 560px) {
  body.at-body { font-size: 15px; }
  .at-stats > div { padding: 20px 12px 20px 0; }
  .at-stats > div + div { padding-left: 12px; }
  .at-stats > div:nth-child(3) { padding-left: 0; }
  .at-apps, .at-projgrid, .at-projgrid--2, .at-principles { grid-template-columns: 1fr; }
  .at-families { grid-template-columns: 1fr 1fr; }
  .at-family { padding: 14px; }
  .at-family__txt { flex-direction: column; gap: 4px; }
  .at-family h3 { font-size: 15px; }
  .at-pgrid { grid-template-columns: 1fr 1fr; }
  .at-pcard__link { padding: 14px; }
  .at-pcard__txt h3 { font-size: 15px; }
  .at-pcard__txt p { display: none; }
  .at-form__grid { grid-template-columns: 1fr; }
  .at-sec__head { flex-direction: column; align-items: flex-start; gap: 10px; }
  .at-note { padding: 20px; }
  .at-pager { grid-template-columns: 1fr; }
  .at-pager__next { text-align: left; align-items: flex-start; }
  .at-meta > div { grid-template-columns: 1fr; gap: 2px; }
  .at-filter { width: 100%; }
  .at-filter button { flex: 1 1 auto; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }