/* Leemans Equestrian – layout tweaks (November 2026)
   Smaller title blocks between the menu and the content, references three across. */

/* title blocks */
main > .page-intro { padding: 38px 6% 32px }
main > .page-intro h1, main > .sport-intro h1 { font-size: clamp(2rem, 3.3vw, 2.9rem); line-height: 1.12 }
main > .page-intro .eyebrow, main > .sport-intro .eyebrow { margin-bottom: 10px }
main > .page-intro p { margin-top: 12px }
main > .sport-intro { padding-top: 44px; padding-bottom: 28px; gap: 30px }
@media (max-width: 760px) {
  main > .page-intro { padding: 26px 6% 22px }
  main > .page-intro h1, main > .sport-intro h1 { font-size: 1.75rem }
  main > .sport-intro { padding-top: 28px; padding-bottom: 18px; gap: 12px }
}

/* references: narrower, three next to each other */
.reference-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 46px 32px; max-width: 1180px; margin-inline: auto }
.reference-grid h2 { font-size: 1.6rem; margin-top: 18px }
.reference-grid article p { font-size: .95rem; line-height: 1.65 }
@media (max-width: 1000px) { .reference-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) } }
@media (max-width: 640px) { .reference-grid { grid-template-columns: 1fr; gap: 36px } }

/* ---------- ideas from the LGCT site, in Leemans colours ---------- */

/* hero: short gold rule above the eyebrow, solid + outlined button side by side */
.hero-content .eyebrow::before { content: ''; display: block; width: 150px; height: 1px; margin-bottom: 16px; background: rgba(227, 211, 182, .8) }
.le-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px }
.hero .le-btn-solid { background: #fff; color: #24262a; border-color: #fff }
.hero .le-btn-solid:hover { background: #f3ece0; color: #24262a }
.hero .le-btn-ghost { background: rgba(0, 0, 0, .18); color: #fff; border-color: rgba(214, 197, 163, .9) }
.hero .le-btn-ghost::after { content: '↓'; margin-left: 10px; display: inline-block; transition: transform .3s ease }
.hero .le-btn-ghost:hover::after { transform: translateY(3px) }

/* arrow links */
.text-link::after { content: '→'; display: inline-block; margin-left: 8px; transition: transform .3s ease }
.text-link:hover::after { transform: translateX(4px) }

/* home: results on grey, news on white (blocks alternate) */
main > .recent-results { background: var(--surface-grey); scroll-margin-top: 20px }
main > .le-news { background: #fff }

/* results: place as a square badge, gold for the podium */
.le-rank { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 42px; padding: 0 8px;
  border: 1px solid #b39a6e; color: #806333; font: 600 .95rem/1 Inter, Arial, sans-serif; letter-spacing: .02em }
.le-rank sup { font-size: .6em; margin-left: 1px; vertical-align: super; line-height: 0 }
.le-rank.is-podium { background: #b39a6e; color: #fff }
/* placed without an exact place: a small rosette instead of "Gepl." */
.le-rank.is-placed { padding: 0; border-color: #e0d2b8; background: #faf6ef; color: #a8865a }
.le-rank.is-placed svg { width: 26px; height: 26px; display: block }
.result-place .le-rank-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%) }

/* results: countdown to the next show */
.le-next { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; margin: 0 0 26px; padding: 18px 24px; background: #3a2c24; color: #f3ece0 }
.le-next-days { font: 400 clamp(2.2rem, 4vw, 3rem)/1 Georgia, 'Times New Roman', serif; color: #e3d3b6 }
.le-next-text span { display: block; font-size: .7rem; letter-spacing: .16em; text-transform: uppercase; color: #c9b48b; margin-bottom: 4px }
.le-next-text strong { font: 400 1.25rem/1.3 Georgia, 'Times New Roman', serif }

/* home news: one featured article with a list next to it (magazine layout) */
.le-news-mag { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 44px; max-width: 1160px; margin: 0 auto }
.le-news-photo { display: block; overflow: hidden; aspect-ratio: 16 / 10 }
.le-news-photo img { width: 100%; height: 100%; object-fit: cover; transition: scale .9s cubic-bezier(.2, .7, .2, 1) }
.le-news-feature:hover .le-news-photo img { scale: 1.03 }
.le-news-feature .meta { margin-top: 18px; font-size: .78rem; color: #767676 }
.le-news-feature h3 { font-size: clamp(1.6rem, 2.4vw, 2.2rem); margin: 8px 0 16px }
.le-news-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid #cbc8c0 }
.le-news-list li { border-bottom: 1px solid #cbc8c0 }
.le-news-list a { display: grid; grid-template-columns: 128px minmax(0, 1fr); gap: 18px; align-items: center; padding: 18px 0 }
.le-news-list img { width: 128px; aspect-ratio: 4 / 3; object-fit: cover }
.le-news-list .meta { display: block; font-size: .74rem; color: #767676; margin-bottom: 6px }
.le-news-list strong { display: block; font: 400 1.12rem/1.3 Georgia, 'Times New Roman', serif; color: #24262a; transition: color .3s ease }
.le-news-list a:hover strong { color: #806333 }
@media (max-width: 860px) {
  .le-news-mag { grid-template-columns: 1fr; gap: 26px }
  .le-news-list a { grid-template-columns: 96px minmax(0, 1fr); gap: 14px; padding: 14px 0 }
  .le-news-list img { width: 96px }
}

/* light, warm footer with the brown logo (Fleur found the dark brown footer too heavy) */
footer { background: #f7f3ed; color: #4b4d51; border-top: 1px solid #e4dccf }
footer .footer-top h2, footer .footer-top p, footer .footer-top a { color: #3d3f43 }
footer .eyebrow { color: #a8865a }
footer a:hover, footer .social-link:hover { color: #a8865a }
.le-footer-logo { width: 220px; max-width: 70%; height: auto; margin-bottom: 8px }
footer .footer-bottom { border-top-color: #e4dccf; color: #85776a }
footer .footer-bottom a, footer .footer-bottom .cookie-settings { color: #5d5f63 }
footer .footer-bottom .cookie-settings:hover { color: #a8865a }

/* centred headings keep their gold line centred */
.partners h2.le-line::after { margin-inline: auto; transform-origin: 50% 50% }
/* outside the prizes: no number, a small horseshoe in the same place */
.le-rank.is-round { padding: 0; border-color: #ece3d4; background: #fff; color: #c2a87e }
.le-rank.is-round svg { width: 22px; height: 22px; display: block }
