.featured-section {
  background: #eeece4;
  border-top: 1px solid rgba(23, 33, 26, 0.1);
}

.advert-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 2vw, 28px);
  margin-top: clamp(34px, 5vw, 64px);
}

.advert-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(23, 33, 26, 0.11);
  border-radius: 5px;
  background: #fbfaf6;
  box-shadow: 0 14px 34px rgba(23, 33, 26, 0.045);
  transition: transform 240ms ease, box-shadow 240ms ease;
}

.advert-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 42px rgba(23, 33, 26, 0.09);
}

.advert-image-frame {
  display: grid;
  aspect-ratio: 893 / 768;
  overflow: hidden;
  place-items: center;
  background: #e6e3da;
}

.advert-image-frame > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #e6e3da;
}

.advert-placeholder {
  display: grid;
  width: 100%;
  height: 100%;
  min-height: 190px;
  padding: 9%;
  place-items: center;
  background: radial-gradient(circle at 76% 24%, rgba(215, 176, 101, 0.3), transparent 31%), #28332b;
}

.advert-placeholder--warm {
  background: radial-gradient(circle at 23% 22%, rgba(205, 154, 105, 0.4), transparent 32%), #645044;
}

.advert-placeholder--green {
  background: radial-gradient(circle at 78% 72%, rgba(185, 199, 155, 0.35), transparent 30%), #3d5142;
}

.advert-placeholder-window {
  width: 100%;
  height: 100%;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.75);
  border-radius: 9px;
  background: #f8f7f2;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.2);
}

.advert-browser-bar {
  display: flex;
  height: 19%;
  min-height: 26px;
  align-items: center;
  gap: 5px;
  padding: 0 3.5%;
  border-bottom: 1px solid #e8e5dc;
  background: #fff;
}

.advert-browser-bar span {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #d5c7ae;
}

.advert-browser-bar span:first-child { background: #c98268; }
.advert-browser-bar span:nth-child(2) { background: #d2ad63; }
.advert-browser-bar span:nth-child(3) { background: #91a182; }

.advert-browser-bar i {
  height: 7px;
  flex: 1;
  margin-left: 9px;
  border-radius: 10px;
  background: #f0eee8;
}

.advert-placeholder-layout {
  display: grid;
  height: 81%;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto 1fr;
  align-content: center;
  align-items: start;
  column-gap: 5%;
  padding: 8% 9%;
}

.advert-placeholder-layout b {
  grid-row: span 2;
  color: #b68a42;
  font-family: "DM Mono", monospace;
  font-size: clamp(28px, 4vw, 54px);
  font-weight: 400;
  line-height: 0.95;
}

.advert-placeholder-layout span {
  color: #62685e;
  font-family: "DM Mono", monospace;
  font-size: 8px;
  letter-spacing: 0.13em;
}

.advert-placeholder-layout strong {
  align-self: end;
  color: #202920;
  font-family: "Manrope", sans-serif;
  font-size: clamp(15px, 1.7vw, 22px);
  font-weight: 600;
  line-height: 1.22;
  white-space: pre-line;
}

.advert-card-copy {
  padding: clamp(18px, 2vw, 25px);
}

.advert-card-meta {
  color: #8a754f;
  font-family: "DM Mono", monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
}

.advert-card-copy h3 {
  margin: 12px 0 7px;
  color: #17211a;
  font-family: "Manrope", sans-serif;
  font-size: clamp(16px, 1.65vw, 20px);
  font-weight: 650;
  line-height: 1.32;
}

.advert-card-copy p {
  min-height: 2.8em;
  margin: 0;
  color: #636a60;
  font-size: 14px;
  line-height: 1.65;
}

.advert-visit-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 19px;
  color: #17211a;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}

.advert-visit-link span { color: #a77b31; }
.advert-visit-link:hover { text-decoration: underline; text-underline-offset: 4px; }
.advert-visit-link:focus-visible { outline: 2px solid #a77b31; outline-offset: 4px; }

@media (max-width: 900px) {
  .advert-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .advert-placeholder-layout strong { font-size: clamp(17px, 3vw, 24px); }
}

@media (max-width: 620px) {
  .advert-grid { grid-template-columns: 1fr; gap: 18px; }
  .advert-image-frame { aspect-ratio: 893 / 768; }
  .advert-placeholder { min-height: 180px; }
  .advert-card-copy { padding: 19px 20px 21px; }
}

@media (prefers-reduced-motion: reduce) {
  .advert-card { transition: none; }
  .advert-card:hover { transform: none; }
}
