:where([data-etch-element="container"]) {
  inline-size: 100%;
  display: flex;
  flex-direction: column;
  max-inline-size: var(--content-width, 1366px);
  align-self: center; margin-inline: auto;
}
:where([data-etch-element="flex-div"]) {
  inline-size: 100%;
  display: flex;
  flex-direction: column;
}
:where([data-etch-element="section"]) {
  inline-size: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
:where([data-etch-element="iframe"]) {
  inline-size: 100%;
  height: auto;
 aspect-ratio: 16/9;
}
.atg-skip {
  position: absolute; inset-block-start: var(--space-xs); inset-inline-start: var(--space-xs); z-index: 100; background: var(--primary); color: var(--base); padding: var(--space-xs) var(--space-s); transform: translateY(-200%); &:focus { transform: translateY(0); }
}
.atg-header {
  background: #000; border-block-end: 1px solid #9f4524; padding: 0;
}
.atg-header__inner {
  display: flex; flex-direction: column; gap: 0; align-items: stretch; max-inline-size: none; inline-size: 100%; padding: 0;
}
.atg-header__brand {
  display: block; inline-size: 100%; max-inline-size: none;
}
.atg-header__banner {
  inline-size: 100%; block-size: auto; display: block; @media(width >= 760px) { block-size: 130px; object-fit: cover; object-position: center top; }
}
.atg-nav {
  display: grid; grid-template-columns: .8fr .8fr 1.5fr 1fr; gap: 0; inline-size: 100%; padding: 0; background: #804729; font-family: 'Trebuchet MS', Futura, sans-serif; font-size: 12px; font-weight: 700; text-transform: uppercase; & a { display: flex; align-items: center; justify-content: center; color: var(--white); padding: 6px 8px; min-block-size: 32px; text-align: center; text-decoration: none; } & a:hover, & a[aria-current='page'] { background: #ab6136; color: var(--white); } & a:focus-visible { outline: 2px solid var(--primary); outline-offset: -3px; } @media(width < 600px) { grid-template-columns: repeat(2,minmax(0,1fr)); & a { min-block-size: 44px; } }
}
.atg-nav__quote {
  color: var(--white) !important;
}
.atg-footer {
  background: #404040; border-block-start: 0; padding: 6px 12px;
}
.atg-footer__inner {
  display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px 12px; font-family: 'Lucida Grande', 'Lucida Sans Unicode', sans-serif; font-size: 11px; line-height: 1.5; color: #ddd; & p { margin: 0; } & a { color: var(--primary); overflow-wrap: anywhere; }
}
.atg-footer__name {
  font-size: var(--text-m);
}
.atg-footer__copyright {
  color: var(--base-light); font-size: var(--text-xs);
}
.atg-cta {
  background: transparent; padding: 0; display: flex; justify-content: center; align-items: center;
}
.atg-cta__inner {
  display: flex; flex-direction: row; justify-content: space-between; align-items: center; gap: var(--space-l); & p { max-inline-size: 45ch; } @media(width < 680px) { flex-direction: column; align-items: flex-start; }
}
.atg-stack {
  display: flex; flex-direction: column; gap: var(--space-s);
}
.atg-button {
  display: inline-flex; align-items: center; justify-content: center; inline-size: fit-content; min-block-size: 2.75rem; background: var(--primary); color: var(--base-ultra-dark); padding: .7em 1.25em; font-family: Arial,sans-serif; font-size: var(--text-s); font-weight: 700; border: 1px solid var(--primary); text-decoration: none; transition: background-color 160ms ease-out, color 160ms ease-out; &:hover { background: var(--primary-light); color: var(--base-ultra-dark); } &:focus-visible { outline: 2px solid var(--primary); outline-offset: 5px; } &:disabled { opacity: .6; cursor: not-allowed; }
}
body {
  background: var(--base); color: var(--white); max-inline-size: var(--content-width); margin-inline: auto; border-inline: 1px solid #9f4524; min-block-size: 100svh;
}
.atg-text-link {
  color: var(--primary); text-underline-offset: .3em; text-decoration-thickness: 1px; &:hover { color: var(--primary-light); }
}
.atg-intro__inner {
  display: grid; grid-template-columns: 1fr 1.45fr; align-items: center; gap: var(--space-l); @media(width < 760px) { grid-template-columns: 1fr; }
}
.atg-intro__copy {
  display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-m); & h1 { max-inline-size: 14ch; } & p { color: var(--base-light); }
}
.atg-intro__image {
  inline-size: 100%; max-inline-size: 39.375rem; block-size: auto;
}
.atg-section-heading {
  display: flex; flex-direction: column; gap: 12px; & p { color: var(--white); max-inline-size: 60ch; }
}
.atg-section-inner {
  display: flex; flex-direction: column; gap: 24px;
}
.atg-project-grid {
  display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px 16px; @media(width < 760px) { grid-template-columns: repeat(2,minmax(0,1fr)); } @media(width < 480px) { grid-template-columns: 1fr; }
}
.atg-project-card {
  display: flex; flex-direction: column; gap: var(--space-xs); min-inline-size: 0; & a { color: var(--base-ultra-light); text-decoration: none; } & a:hover { color: var(--primary); } & a:focus-visible { outline: 2px solid var(--primary); outline-offset: 5px; } & h3 { font-size: var(--h4); }
}
.atg-project-card__image {
  inline-size: 100%; aspect-ratio: 4/3; object-fit: cover; background: var(--base-ultra-dark);
}
.atg-project-card__category {
  font-family: Arial,sans-serif; font-size: var(--text-xs); color: var(--base-light);
}
.atg-project-card__link {
  display: flex; flex-direction: column; gap: var(--space-s);
}
.atg-filters {
  display: flex; flex-wrap: wrap; gap: var(--space-xs); font-family: Arial,sans-serif; font-size: var(--text-s); & button { min-block-size: 2.75rem; padding: .45em .9em; border: 1px solid color-mix(in srgb,var(--primary) 40%,transparent); color: var(--base-ultra-light); } & button[aria-pressed='true'] { background: var(--primary); color: var(--base-ultra-dark); border-color: var(--primary); } & button:hover { border-color: var(--primary); } & button:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
}
.atg-filter-status {
  font-family: Arial,sans-serif; font-size: var(--text-s); color: var(--base-light);
}
.atg-breadcrumb {
  font-family: Arial,sans-serif; font-size: var(--text-s); color: var(--base-light); & a { color: var(--primary); text-underline-offset: .25em; }
}
.atg-project-heading {
  display: flex; flex-direction: column; gap: 8px; max-inline-size: 100%;
}
.atg-detail {
  display: flex; flex-direction: column; gap: 24px;
}
.atg-story {
  display: flex; flex-direction: column; gap: 14px; max-inline-size: 70ch; color: var(--white); & p { margin: 0; }
}
.atg-gallery {
  display: grid; grid-template-columns: minmax(0,1fr) 220px; gap: 20px; align-items: start; @media(width < 760px) { grid-template-columns: minmax(0,1fr); }
}
.atg-gallery__stage {
  display: flex; justify-content: center; align-items: start; background: transparent; padding: 0; min-block-size: 0;
}
.atg-gallery__lead {
  display: flex; align-items: start; justify-content: center; inline-size: 100%; cursor: zoom-in; & img { max-block-size: none; inline-size: auto; max-inline-size: 100%; object-fit: contain; border-radius: 0; }
}
.atg-gallery__summary {
  display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 13px; color: #ddd; & span:last-child { white-space: nowrap; }
}
.atg-gallery__thumbs {
  display: grid; grid-template-columns: repeat(2,80px); justify-content: center; gap: 8px 10px; & a { outline-offset: 2px; } @media(width < 760px) { grid-template-columns: repeat(4,minmax(0,1fr)); }
}
.atg-gallery__thumb {
  display: block; border: 1px solid transparent; padding: 2px; &[aria-current='true'] { border-color: var(--primary); } &:hover { border-color: var(--primary-light); } &:focus-visible { outline: 2px solid var(--primary); } & img { inline-size: 100%; aspect-ratio: 7/5; object-fit: cover; border-radius: 0; }
}
.atg-gallery__hint {
  font-family: 'Lucida Grande', 'Lucida Sans Unicode', sans-serif; font-size: 12px; color: #ccc; line-height: 1.5;
}
.atg-gallery__dialog {
  background: var(--base-ultra-dark); color: var(--base-ultra-light); border: 1px solid color-mix(in srgb,var(--primary) 40%,transparent); padding: var(--space-m); max-inline-size: min(94vw,55rem); max-block-size: 94svh; margin: auto; overflow: auto; &::backdrop { background: rgb(0 0 0 / .9); } & img { inline-size: auto; max-inline-size: 100%; max-block-size: 65svh; object-fit: contain; margin-inline: auto; }
}
.atg-gallery__dialog-inner {
  display: flex; flex-direction: column; gap: var(--space-s);
}
.atg-gallery__dialog-top {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-s); font-family: Arial,sans-serif; font-size: var(--text-s);
}
.atg-gallery__controls {
  display: flex; justify-content: space-between; align-items: center; gap: var(--space-s); font-family: Arial,sans-serif; font-size: var(--text-s); & button { min-block-size: 2.75rem; min-inline-size: 2.75rem; padding: .4em .8em; border: 1px solid var(--primary); color: var(--primary); } & button:hover { background: var(--primary); color: var(--base); } & button:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
}
.atg-form {
  display: flex; flex-direction: column; gap: var(--space-l); max-inline-size: 50rem; & fieldset { border: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-s); } & legend { font-size: var(--h4); color: var(--primary); padding-block-end: var(--space-s); } & input:not([type='checkbox']):not([type='hidden']), & select, & textarea { inline-size: 100%; min-block-size: 2.75rem; background: var(--base-ultra-dark); color: var(--base-ultra-light); border: 1px solid color-mix(in srgb,var(--primary) 45%,transparent); padding: .6em .8em; border-radius: 0; } & :is(input,select,textarea):focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; } & textarea { min-block-size: 9rem; } & label { display: flex; flex-direction: column; gap: .4em; } & input[type='checkbox'] { accent-color: var(--primary); inline-size: 1.2rem; block-size: 1.2rem; flex-shrink: 0; }
}
.atg-form__row {
  display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-m); @media(width < 600px) { grid-template-columns: 1fr; }
}
.atg-form__checks {
  display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-xs) var(--space-m); & label { display: flex; flex-direction: row; align-items: center; min-block-size: 2.75rem; gap: .65em; } @media(width < 500px) { grid-template-columns: 1fr; }
}
.atg-form__note {
  font-size: var(--text-s); color: var(--base-light);
}
.atg-form__status {
  padding: var(--space-s); border: 1px solid var(--primary); font-size: var(--text-s); &:empty { display: none; }
}
.atg-honeypot {
  position: absolute; clip-path: inset(50%); inline-size: 1px; block-size: 1px; overflow: hidden;
}
.atg-quote-graphic {
  display: block; inline-size: 200px; max-inline-size: 100%; & img { display: block; inline-size: 100%; block-size: auto; }
}
.atg-gallery__main {
  display: flex; flex-direction: column; gap: 10px; min-inline-size: 0;
}
.atg-gallery__side {
  display: flex; flex-direction: column; gap: 18px; padding: 12px 10px; background: #000; min-inline-size: 0; font-size: 14px; line-height: 1.5; @media(width < 760px) { font-size: 16px; padding: 16px; }
}
html {
  background: #000;
}
.atg-home {
  padding-block: 16px 24px;
}
.atg-home__layout {
  display: grid; grid-template-columns: minmax(0,1fr) 220px; gap: 20px; align-items: start; @media(width < 760px) { grid-template-columns: minmax(0,1fr); }
}
.atg-home__main {
  display: flex; flex-direction: column; gap: 10px; align-items: center; min-inline-size: 0;
}
.atg-home__heading {
  font-size: 20px; text-align: center; margin: 0 0 4px;
}
.atg-home__lead {
  display: block; max-inline-size: 100%; & img { inline-size: auto; block-size: auto; max-inline-size: 100%; border-radius: 0; }
}
.atg-home__caption {
  font-size: 14px; text-align: center; margin: 0;
}
.atg-home__hint {
  font-size: 12px; text-align: center; color: #ccc; margin: 0;
}
.atg-home__side {
  display: flex; flex-direction: column; gap: 16px; padding: 10px; background: #000; min-inline-size: 0; @media(width < 760px) { padding: 16px; }
}
.atg-home__thumbs {
  display: grid; grid-template-columns: repeat(2,80px); justify-content: center; gap: 8px 10px; @media(width < 760px) { grid-template-columns: repeat(4,minmax(0,1fr)); }
}
.atg-home__thumb {
  display: block; padding: 2px; border: 1px solid transparent; &[aria-current='true'], &:hover { border-color: var(--primary); } & img { display: block; inline-size: 100%; aspect-ratio: 7/5; object-fit: cover; border-radius: 0; }
}
.atg-home__intro {
  font-size: 14px; line-height: 1.5; margin: 0; &::first-letter { font-size: 30px; line-height: 1; color: var(--primary); } @media(width < 760px) { font-size: 16px; }
}
.atg-home__browse {
  font-size: 14px; text-align: center;
}