/* ---------- Ambag — Artisan trade college 85 (website) ----------
   The one structural move: BOTH photograph walls are welded — gap:0, no
   captions, no container — and dropped onto a steel-grey plate, so this page
   ALTERNATES ground where every other bone-paper site holds one paper. Eight
   tiles four across, then six tiles three across, bracketing a middle that is
   only type and figures. The safety yellow appears in four places and nowhere
   else: the four figures, the hero button, the submit, the faq's top rule. */
body.t-ambag.ws-body { --bg: #f2f1ec; --fg: #3e444c; --heading: #14171c; --text: #3e444c; --muted: #7d848d; }
/* the bar is a rule, not a feature — contained, static, sitting above the stage */
body.t-ambag .ws-nav { position: static; background: #f2f1ec; backdrop-filter: none; border-bottom: 1px solid #cfcdc6; }
body.t-ambag .ws-brand, body.t-ambag .ws-nav-links a { text-transform: uppercase; letter-spacing: 0.16em; font-size: 11px; font-weight: 700; }
/* one paper the whole way down — the two walls opt out and paint themselves */
body.t-ambag .ws-section:nth-child(even):not(.ws-cta):not(.ws-shoplink):not(.ws-gallery):not(.ws-photogrid) { background: transparent; }
body.t-ambag .ws-hero { min-height: calc(100vh - 62px); --hero-a: rgba(10, 13, 16, 0.30); --hero-b: rgba(10, 13, 16, 0.66); }
body.t-ambag .ws-hero h1, body.t-ambag .ws-h2, body.t-ambag .ws-col-h, body.t-ambag .ws-feature h3, body.t-ambag .ws-member strong { font-family: "Oswald", "Arial Narrow", var(--sans); font-weight: 600; text-transform: uppercase; letter-spacing: 0.03em; }
body.t-ambag .ws-hero h1 { font-size: clamp(36px, 7.2vw, 84px); line-height: 1; max-width: 17ch; }
body.t-ambag .btn.brand, body.t-ambag .ws-hero-cta.btn.brand { background: #e8b400; border-color: #e8b400; color: #14171c; border-radius: 0; box-shadow: none; text-transform: uppercase; letter-spacing: 0.14em; font-size: 12.5px; font-weight: 700; }
body.t-ambag .btn.brand:hover, body.t-ambag .ws-hero-cta.btn.brand:hover { background: #d3a300; border-color: #d3a300; opacity: 1; }
/* job cards, not cards: a hard rule over the top, ranged left, no box anywhere */
body.t-ambag .ws-features-grid, body.t-ambag .ws-team-grid, body.t-ambag .ws-testimonials-grid { grid-template-columns: repeat(4, 1fr); gap: 30px; }
body.t-ambag .ws-feature, body.t-ambag .ws-col, body.t-ambag .ws-quote, body.t-ambag .ws-member { text-align: left; background: transparent; border: 0; border-top: 2px solid #14171c; border-radius: 0; box-shadow: none; padding: 16px 0 0; }
body.t-ambag .ws-quote blockquote { font-size: 15px; line-height: 1.65; }
body.t-ambag .ws-quote blockquote::before { content: none; }
body.t-ambag .ws-video-frame, body.t-ambag .ws-gallery-item img, body.t-ambag .ws-photogrid-grid img, body.t-ambag .ws-member-photo img { border-radius: 0; box-shadow: none; }
body.t-ambag .ws-member-photo img { width: 100%; height: auto; aspect-ratio: 3 / 4; margin: 0 0 14px; }
/* the bare middle — a narrower measure than the blocks either side of it */
body.t-ambag .ws-richtext .ws-container { max-width: 600px; }
body.t-ambag .ws-col-h { font-size: clamp(44px, 5.8vw, 74px); line-height: 0.9; letter-spacing: -0.02em; color: #e8b400; margin: 0 0 8px; }
/* THE MOVE — both walls welded gapless, edge to edge, onto a steel plate */
body.t-ambag .ws-section.ws-gallery:not(.ws-cta), body.t-ambag .ws-section.ws-photogrid:not(.ws-cta) { background: #2a2f35; padding: 26px 0; }
body.t-ambag .ws-gallery .ws-container { max-width: none; padding: 0; }
body.t-ambag .ws-gallery-grid { grid-template-columns: repeat(4, 1fr); gap: 0; }
body.t-ambag .ws-photogrid-grid { grid-template-columns: repeat(3, 1fr); gap: 0; }
body.t-ambag .ws-gallery-item img, body.t-ambag .ws-photogrid-grid img { aspect-ratio: 4 / 3; }
body.t-ambag .ws-faq-list { border-top: 2px solid #e8b400; }
body.t-ambag .ws-form { max-width: 520px; }
body.t-ambag .ws-form .btn.brand { width: 100%; }
/* the address line: a form heading dropped BELOW the submit by flex order */
body.t-ambag .ws-form-heading { order: 2; margin: 20px 0 0; text-align: center; }
body.t-ambag .ws-form-heading h3, body.t-ambag .ws-form-heading p { font-family: var(--sans); font-size: 13px; font-weight: 500; letter-spacing: 0; line-height: 1.7; color: #7d848d; text-transform: none; opacity: 1; }
@media (max-width: 900px) {
  body.t-ambag .ws-features-grid, body.t-ambag .ws-team-grid, body.t-ambag .ws-testimonials-grid, body.t-ambag .ws-gallery-grid, body.t-ambag .ws-photogrid-grid, body.t-ambag .ws-columns .ws-cols-4 { grid-template-columns: repeat(2, 1fr); }
  body.t-ambag .ws-nav-inner { height: auto; padding: 14px 0; flex-wrap: wrap; gap: 12px; }
  body.t-ambag .ws-hero { min-height: 82vh; }
}

/* ambag by night — the paper goes to graphite, the two plates go BLACKER than
   the page so the walls still read as slabs, and the yellow does not move */
html[data-theme="dark"] body.t-ambag.ws-body { --bg: #14171c; --fg: #aeb4bc; --heading: #eeece5; --text: #aeb4bc; --muted: #767c85; }
html[data-theme="dark"] body.t-ambag { background: #14171c; }
html[data-theme="dark"] body.t-ambag .ws-nav { background: #14171c; border-bottom-color: #2a2f35; }
html[data-theme="dark"] body.t-ambag .ws-section.ws-gallery:not(.ws-cta), html[data-theme="dark"] body.t-ambag .ws-section.ws-photogrid:not(.ws-cta) { background: #0b0d10; }
html[data-theme="dark"] body.t-ambag .ws-feature, html[data-theme="dark"] body.t-ambag .ws-col, html[data-theme="dark"] body.t-ambag .ws-quote, html[data-theme="dark"] body.t-ambag .ws-member { border-top-color: #39404a; }
html[data-theme="dark"] body.t-ambag .ws-feature p, html[data-theme="dark"] body.t-ambag .ws-richtext p, html[data-theme="dark"] body.t-ambag .ws-col p, html[data-theme="dark"] body.t-ambag .ws-member p, html[data-theme="dark"] body.t-ambag .ws-faq-item p, html[data-theme="dark"] body.t-ambag .ws-quote blockquote, html[data-theme="dark"] body.t-ambag .ws-sub, html[data-theme="dark"] body.t-ambag .ws-video-caption { color: #aeb4bc; }
html[data-theme="dark"] body.t-ambag .ws-faq-item { border-bottom-color: #2a2f35; }
html[data-theme="dark"] body.t-ambag .ws-field input, html[data-theme="dark"] body.t-ambag .ws-field textarea, html[data-theme="dark"] body.t-ambag .ws-field select { background: #1b1f25; border-color: #2a2f35; color: #eeece5; }
html[data-theme="dark"] body.t-ambag .ws-form-heading h3, html[data-theme="dark"] body.t-ambag .ws-form-heading p { color: #767c85; }