.atelier-page {
  background:
    linear-gradient(rgba(10,9,7,.9), rgba(10,9,7,.78)),
    url("./atelier-hero-opt-445887beef.webp?v=red-lips-shoes") center top / cover fixed;
}

.atelier-header {
  padding-block: 13px;
}

.atelier-nav a {
  padding: 8px 12px;
  border-top: 1px solid rgba(236,108,53,.7);
  border-inline: 1px solid rgba(255,255,255,.14);
  background: rgba(15,13,11,.72);
}

.atelier-hero {
  min-height: 47vh;
  padding-top: 90px;
  padding-bottom: 5vh;
  background-position: center 34%;
}

.atelier-intro h1 {
  font-size: clamp(3.4rem, 6.7vw, 7rem);
}

.atelier-request-bay,
.atelier-socials {
  width: min(1180px, calc(100% - 40px));
  margin: 34px auto;
  padding: 34px;
  color: #eee5d8;
  background: rgba(10,11,10,.91);
  border: 1px solid rgba(236,108,53,.5);
  backdrop-filter: blur(12px);
}

#requests.atelier-request-bay {
  color: #eee5d8;
  background: rgba(10,11,10,.91);
}

#requests.atelier-request-bay .atelier-section-head h2 {
  color: #f2ebe2;
}

.atelier-section-head {
  display: grid;
  grid-template-columns: 160px minmax(260px, .9fr) 1.2fr;
  align-items: end;
  gap: 28px;
  margin-bottom: 30px;
  padding-top: 14px;
  border-top-color: rgba(236,108,53,.65);
}

.atelier-section-head h2 {
  max-width: none;
  color: #f2ebe2;
  font: 700 clamp(2.4rem, 5vw, 5.2rem)/.82 "Arial Narrow", Arial, sans-serif;
  text-transform: uppercase;
}

.atelier-section-head p {
  margin: 0;
  color: #a9a096;
  font-size: .76rem;
  line-height: 1.6;
}

.atelier-bay-frame {
  padding: 28px;
  border: 1px solid rgba(36,125,122,.7);
  background: rgba(5,8,8,.58);
}

.atelier-bay-prompt {
  display: inline-block;
  margin-bottom: 28px;
  padding: 11px 16px;
  color: #f3d7c3;
  border: 1px solid rgba(236,108,53,.65);
  font: 700 .68rem/1 monospace;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.atelier-routes {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.atelier-route[data-atelier-bay],
.atelier-route[data-atelier-bay="men"],
.atelier-route[data-atelier-bay="women"],
.atelier-route[data-atelier-bay="specialty"],
.atelier-route[data-atelier-bay="drops"] {
  grid-column: span 1;
  min-height: 390px;
}

.atelier-route strong {
  font-size: clamp(1.45rem, 2.25vw, 2.5rem);
}

.atelier-catalog-network {
  margin-top: 30px;
  padding-top: 22px;
  border-top: 1px solid rgba(132,129,46,.75);
}

.atelier-catalog-network > strong {
  position: relative;
  width: 100%;
  display: block;
  margin-inline: auto;
  overflow: hidden;
  border: 1px solid rgba(232,223,207,.28);
  background: transparent;
  filter: drop-shadow(0 9px 12px rgba(0,0,0,.48));
}

.atelier-catalog-network > strong em {
  position: absolute;
  inset: 50% auto auto 50%;
  padding: 7px 18px 6px;
  border: 1px solid rgba(255,239,200,.72);
  color: #fff0c8;
  background: rgba(12,4,2,.68);
  box-shadow: 0 0 16px rgba(255,91,33,.42), inset 0 0 12px rgba(255,181,73,.12);
  font: 800 clamp(.72rem,1.35vw,1.05rem)/1 "Courier New",monospace;
  font-style: normal;
  letter-spacing: .16em;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
  transform: translate(-50%,-50%);
}

.atelier-catalog-network > strong img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

.atelier-catalog-network > div {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  align-items: start;
  gap: 14px;
  margin-top: 22px;
  padding: 8px 6px 16px;
}

.atelier-catalog-network > div > span {
  position: relative;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 6px;
  padding: 7px 7px 10px;
  color: #17120f;
  border: 1px solid #b8aa93;
  background: #e8dfcf;
  box-shadow: 0 8px 15px rgba(0,0,0,.38), inset 0 0 18px rgba(101,77,45,.1);
  font: 700 .58rem/1.2 "Courier New", monospace;
  text-align: center;
  text-transform: uppercase;
  transform: rotate(-1.2deg);
}

.atelier-catalog-network > div > span::before {
  content: "";
  width: 100%;
  aspect-ratio: 1 / .7;
  display: block;
  border: 1px solid rgba(30,24,18,.5);
  background-position: center;
  background-size: cover;
  filter: sepia(.2) contrast(1.08);
}

.atelier-catalog-network > div > span:nth-child(even) { transform: rotate(1deg); }
.atelier-catalog-network > div > span:nth-child(3n) { transform: rotate(-.45deg); }
.atelier-catalog-network > div > span[data-atelier-catalog="men"]::before { background-image: url("./atelier-men-video-model-opt-e67e2916ef.webp"); background-position: center 24%; }
.atelier-catalog-network > div > span[data-atelier-catalog="women"]::before { background-image: url("./atelier-womens-afro-puffs-opt-a59630d644.webp"); background-position: center 22%; }
.atelier-catalog-network > div > span[data-atelier-catalog="vehicles"]::before { background-image: url("./atelier-automotive-oil-poster-opt-8f0cdaec47.webp"); background-position: center 40%; }
.atelier-catalog-network > div > span[data-atelier-catalog="auto-parts"]::before { background-image: url("./brands-we-source-v2-opt-7986b2c8b8.webp"); }
.atelier-catalog-network > div > span[data-atelier-catalog="objects"]::before { background-image: url("./atelier-objects-poster-v2-opt-45b1e3a712.webp"); background-position: center 32%; }
.atelier-catalog-network > div > span[data-atelier-catalog="specialty"]::before { background-image: url("./peluchito-detective-v1.webp"), linear-gradient(rgba(8,10,9,.3), rgba(8,10,9,.5)), url("./whisper-magazine-office-stand-opt-275cb6e176.webp"); background-size: contain, cover, cover; background-repeat: no-repeat; background-position: center, center, center; }
.atelier-catalog-network > div > span[data-atelier-catalog="drops"]::before { background-image: url("./peluchito-newspaper.webp"); background-position: center 20%; }
.atelier-catalog-network > div > span b {
  position: absolute;
  right: 9px;
  bottom: 6px;
  padding-left: 6px;
  color: #6c5945;
  background: #e8dfcf;
  font-size: .48rem;
}

.atelier-socials {
  border-color: rgba(36,125,122,.55);
}

.atelier-social-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.atelier-social-grid a {
  position: relative;
  min-height: 330px;
  display: grid;
  grid-template-rows: 1fr auto auto auto;
  align-content: stretch;
  gap: 7px;
  overflow: hidden;
  padding: 12px 16px 16px;
  color: #eee5d8;
  border: 1px solid rgba(255,255,255,.2);
  background: linear-gradient(145deg, rgba(159,47,28,.18), rgba(36,125,122,.1));
  text-decoration: none;
}

.atelier-social-grid img {
  width: 100%;
  height: 235px;
  object-fit: contain;
  align-self: end;
  filter: drop-shadow(0 13px 18px rgba(0,0,0,.4));
  transition: transform .35s ease, filter .35s ease;
}

.atelier-social-grid a:hover img,
.atelier-social-grid a:focus-visible img {
  transform: translateY(-5px) scale(1.035);
  filter: drop-shadow(0 18px 24px rgba(0,0,0,.6));
}

.atelier-social-grid a:hover,
.atelier-social-grid a:focus-visible {
  border-color: var(--atelier-orange);
  outline: none;
}

.atelier-social-grid small { color: var(--atelier-orange); font: 700 .58rem/1 monospace; }
.atelier-social-grid strong { font: 400 1.35rem/1 Georgia, serif; }
.atelier-social-grid span { color: #9f968d; font-size: .62rem; }

.atelier-social-grid .atelier-social-owner strong {
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: .08em;
  line-height: 1.1;
  text-transform: uppercase;
}

.atelier-owner-badge {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 2;
  padding: 6px 8px;
  color: #fff;
  border: 1px solid rgba(255,255,255,.7);
  background: rgba(4,8,10,.82);
  font: 800 .55rem/1 Arial, sans-serif;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.atelier-page .signal-launcher {
  border-color: rgba(238,229,216,.82);
  background: rgba(15,12,11,.96);
  box-shadow: 0 0 20px rgba(239,118,70,.28), inset 0 0 16px rgba(255,255,255,.08);
}

.atelier-page .signal-launcher img,
.atelier-page .signal-head img {
  filter: drop-shadow(0 0 7px rgba(239,118,70,.42));
}

.atelier-driver-row {
  display: flex;
  justify-content: flex-end;
  margin-top: 24px;
}

.atelier-driver {
  width: min(100%, 390px);
  display: grid;
  grid-template-columns: 74px 1fr auto;
  gap: 4px 18px;
  align-items: center;
  padding: 12px 18px 12px 12px;
  color: #eee5d8;
  border: 1px solid var(--atelier-orange);
  text-decoration: none;
}

.atelier-driver img { grid-column: 1; grid-row: 1 / 3; width: 74px; height: 74px; object-fit: contain; filter: drop-shadow(0 0 8px rgba(239,118,70,.36)); }
.atelier-driver span { grid-column: 2; color: #c2b4a6; font-size: .58rem; letter-spacing: .1em; text-transform: uppercase; }
.atelier-driver strong { grid-column: 2; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; }
.atelier-driver i { grid-column: 3; grid-row: 1 / 3; align-self: center; font-style: normal; }

.atelier-service {
  width: min(1180px, calc(100% - 40px));
  margin: 34px auto;
  padding: 48px;
}

@media (max-width: 680px) {
  .atelier-section-head { grid-template-columns: 1fr 2fr; }
  .atelier-section-head p { grid-column: 2; }
  .atelier-routes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .atelier-social-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .atelier-catalog-network > div { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 580px) {
  .atelier-hero { min-height: 55vh; }
  .atelier-request-bay,
  .atelier-socials,
  .atelier-service {
    width: calc(100% - 20px);
    margin-block: 18px;
    padding: 18px;
  }
  .atelier-section-head { grid-template-columns: 1fr; gap: 12px; }
  .atelier-section-head p { grid-column: 1; }
  .atelier-bay-frame { padding: 12px; }
  .atelier-routes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .atelier-route[data-atelier-bay],
  .atelier-route[data-atelier-bay="men"],
  .atelier-route[data-atelier-bay="women"],
  .atelier-route[data-atelier-bay="specialty"],
  .atelier-route[data-atelier-bay="drops"] { min-height: 320px; padding: 14px; }
  .atelier-route strong { font-size: 1.25rem; }
  .atelier-route p { display: none; }
  .atelier-catalog-network > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .atelier-catalog-network > strong { width: 100%; }
  .atelier-catalog-network > strong img { height: auto; }
  .atelier-catalog-network > strong em { padding: 6px 10px 5px; font-size: .62rem; letter-spacing: .1em; }
  .atelier-social-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .atelier-social-grid a { min-height: 250px; padding: 8px 10px 12px; }
  .atelier-social-grid img { height: 170px; }
}
.atelier-wordmark { display: flex; align-items: center; gap: 10px; font-size: .7rem; text-transform: uppercase; }
.atelier-wordmark img { display: block; width: 76px; height: 48px; object-fit: contain; }
.atelier-wordmark span { color: #fff; }