/* Lauro Ferreira — camada visual editorial. Não altera fontes, curadoria ou publicação. */

:root {
  --lauro-night: #241405;
  --lauro-wood: #3b2412;
  --lauro-paper: #faf4e6;
  --lauro-sun: #c89b3c;
  --lauro-red: #cf3a26;
}

html { scroll-behavior: smooth; }

.l-skip-link {
  position: fixed;
  top: .75rem;
  left: .75rem;
  z-index: 100;
  transform: translateY(-160%);
  padding: .65rem .85rem;
  color: var(--lauro-paper);
  background: var(--lauro-night);
  font: 700 .8rem/1 'Oswald', sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.l-skip-link:focus-visible { transform: translateY(0); outline: 3px solid var(--lauro-sun); outline-offset: 3px; }

:where(a, button):focus-visible {
  outline: 3px solid var(--lauro-red);
  outline-offset: 3px;
  opacity: 1;
}

.l-masthead { box-shadow: inset 0 -1px rgba(250,244,230,.22); }
.l-masthead h1 { text-wrap: balance; }

.l-home { padding-top: clamp(1.25rem, 3vw, 2.25rem); }

.l-hero {
  position: relative;
  min-height: min(60vw, 29rem);
  border-radius: 1rem;
  box-shadow: 9px 10px 0 var(--lauro-wood);
}

.l-hero::after {
  position: absolute;
  right: 1.2rem;
  bottom: -.78rem;
  content: 'GOIÁS, DO JEITO QUE É';
  color: var(--lauro-paper);
  background: var(--lauro-red);
  padding: .25rem .7rem;
  font: 700 .65rem/1 'Oswald', sans-serif;
  letter-spacing: .12em;
  transform: rotate(-2deg);
}

.l-hero-media { min-height: 17rem; overflow: hidden; }
.l-hero-media img { transition: transform .45s ease; }
.l-hero-media:hover img { transform: scale(1.025); }
.l-hero-body { display: flex; flex-direction: column; justify-content: center; }
.l-eyebrow {
  margin: 0 0 .55rem;
  color: var(--lauro-red);
  font: 700 .72rem/1 'Oswald', sans-serif;
  letter-spacing: .15em;
}

.l-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.l-section-head span {
  color: rgba(59,36,18,.66);
  font: 500 .8rem/1.2 'Oswald', sans-serif;
  letter-spacing: .08em;
  text-align: right;
  text-transform: uppercase;
}

.l-category-head { border-bottom: 1px solid rgba(59,36,18,.2); padding-bottom: .55rem; }

.l-story-card {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  border-radius: .75rem;
  box-shadow: 0 2px 0 rgba(59,36,18,.12);
}

.l-story-card:hover { box-shadow: 7px 8px 0 var(--lauro-wood); }
.l-story-card > a { overflow: hidden; }
.l-story-card img { transition: transform .35s ease; }
.l-story-card:hover img { transform: scale(1.035); }
.l-story-body { display: flex; min-height: 12.6rem; flex: 1; flex-direction: column; }
.l-story-date { margin-top: auto; padding-top: .8rem; }
.l-story-fallback { position: relative; overflow: hidden; isolation: isolate; }
.l-story-fallback::before,
.l-story-fallback::after {
  position: absolute;
  z-index: -1;
  width: 12rem;
  height: 12rem;
  border: 2px solid rgba(250,244,230,.28);
  border-radius: 999px;
  content: '';
}
.l-story-fallback::before { top: -5rem; right: -2.5rem; }
.l-story-fallback::after { bottom: -8rem; left: -3rem; }
.l-story-fallback span { color: var(--lauro-paper); font: 700 1rem/1 'Anton', sans-serif; letter-spacing: .06em; text-transform: uppercase; }

.l-article-shell { max-width: 76rem; }
.l-crumbs { color: rgba(59,36,18,.66); font-family: 'Oswald', sans-serif; }
.l-crumbs a:hover { color: var(--lauro-red); }
.l-article { max-width: 49rem; }
.l-article-kicker { border-radius: 999px; font-family: 'Oswald', sans-serif; letter-spacing: .08em; }
.l-article-title {
  color: var(--lauro-night) !important;
  font-family: 'Anton', sans-serif;
  font-size: clamp(2.4rem, 5.7vw, 5rem) !important;
  font-weight: 400 !important;
  letter-spacing: .01em;
  line-height: .98 !important;
  text-wrap: balance;
}
.l-article-subtitle { color: rgba(42,28,14,.74) !important; font-family: 'Bitter', serif; font-style: italic; line-height: 1.45; }
.l-byline { border-color: rgba(59,36,18,.22) !important; color: rgba(59,36,18,.72); }
.l-byline a span { color: var(--lauro-night) !important; }
.l-article-figure { overflow: hidden; border: 2px solid var(--lauro-wood); border-radius: .8rem; box-shadow: 7px 8px 0 var(--lauro-sun); }
.l-article-figure img { display: block; border-radius: 0 !important; }
.l-article-content { color: #2a1c0e !important; font-family: 'Bitter', serif; font-size: clamp(1.08rem, 1.4vw, 1.22rem); line-height: 1.82 !important; }
.l-article-content > p:first-child::first-letter { float: left; margin: .04em .12em 0 0; color: var(--lauro-red); font-family: 'Anton', sans-serif; font-size: 4.9em; line-height: .72; }
.l-article-content h2,
.l-article-content h3 { color: var(--lauro-wood); font-family: 'Anton', sans-serif; font-weight: 400; letter-spacing: .02em; line-height: 1.05; scroll-margin-top: 6rem; }
.l-related-title { color: var(--lauro-wood) !important; font-family: 'Anton', sans-serif; font-weight: 400 !important; border-color: var(--lauro-red) !important; letter-spacing: .03em; }

.l-cookie { background: rgba(36,20,5,.97) !important; border-top: 2px solid var(--lauro-sun); }
.l-cookie-action { min-height: 2.75rem; touch-action: manipulation; }
.l-scroll-top { border: 2px solid var(--lauro-sun); touch-action: manipulation; }

@media (min-width: 768px) {
  .l-cookie { right: 1.25rem; bottom: 1.25rem; left: auto; width: min(31rem, calc(100vw - 2.5rem)); border: 2px solid var(--lauro-sun); border-radius: .75rem; }
  .l-cookie > div { padding: 0; }
}

@media (max-width: 767px) {
  .l-hero { box-shadow: 5px 6px 0 var(--lauro-wood); }
  .l-hero::after { right: .75rem; bottom: -.65rem; font-size: .56rem; }
  .l-section-head { align-items: flex-start; flex-direction: column; gap: .35rem; }
  .l-section-head span { text-align: left; }
  .l-story-body { min-height: 0; }
  .l-article-title { font-size: clamp(2.25rem, 12vw, 3.5rem) !important; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .l-hero-media img,
  .l-story-card,
  .l-story-card img { transition: none; }
}