/* ============================================================
   tablet.css — Riva Rocci · Intermediate Breakpoint
   Targets: 901px – 1400px
   ============================================================ */

@media (min-width: 901px) and (max-width: 1400px) {

  /* ── NAV ── */
  nav {
    padding: 1rem 2rem;
  }
  .nav-links {
    gap: .5rem;
  }
  .nav-links a {
    padding: .38rem .75rem;
    font-size: .88rem;
  }

  /* ── INNER PAGE HEADER ── */
  .pg-hdr {
    padding: 9rem 2.5rem 4rem;
  }
  .pg-hdr-hero {
    padding-top: 11rem;
    padding-bottom: 4rem;
  }
  .pg-title {
    font-size: clamp(3rem, 7vw, 6rem);
  }
  .pg-sub {
    font-size: .92rem;
  }

  /* ── CTA SECTION ── */
  .cta-section {
    padding: 7rem 2.5rem;
  }
  .cta-hl {
    font-size: clamp(2.2rem, 5.5vw, 5rem);
  }

  /* ── FOOTER ── */
  footer {
    padding: 3.5rem 2.5rem 2rem;
  }
  .ft-grid {
    gap: 2rem;
  }

  /* ====================================================
     HOME PAGE
     ==================================================== */

  /* ── HERO ── */
  .hero-content {
    max-width: 680px;
    padding: 0 1.5rem;
  }
  .hero-hl {
    font-size: clamp(3.2rem, 7vw, 6rem);
  }
  .hero-scroll {
    right: 2rem;
  }

  /* ── IDENTITY STRIP ── */
  .id-cell {
    padding: 1.6rem 2rem;
  }

  /* ── MANIFESTO ── */
  .manifesto {
    padding: 7rem 2.5rem;
  }
  .manifesto-hl {
    font-size: clamp(2rem, 4.5vw, 3.8rem);
  }

  /* ── PILLARS ── */
  .pillars-header {
    padding: 2.2rem 2.5rem;
    gap: 2rem;
  }
  .pillars-h {
    font-size: clamp(1.8rem, 3.2vw, 2.4rem);
  }
  .pillar-row {
    grid-template-columns: 55% 1fr;
    min-height: 320px;
  }
  .pillar-row-flip {
    grid-template-columns: 1fr 55%;
  }
  .pillar-row-txt {
    padding: 2.5rem 2.5rem;
  }
  .pillar-row-name {
    font-size: clamp(1.8rem, 2.8vw, 2.6rem);
  }
  .pillar-row-desc {
    font-size: .84rem;
    max-width: 300px;
  }

  /* ── ABOUT SECTION ── */
  .about-txt {
    padding: 4.5rem 2.5rem;
  }
  .about-hl {
    font-size: clamp(1.7rem, 2.8vw, 2.4rem);
  }

  /* ── STATS ── */
  .stats-section {
    padding: 5.5rem 2.5rem;
  }
  .stats-num {
    font-size: clamp(4rem, 10vw, 8rem);
  }

  /* ── INSTAGRAM FEED ── */
  .ig-section-header {
    padding: 2.2rem 2.5rem;
    gap: 2rem;
  }
  .ig-section-hl {
    font-size: clamp(1.8rem, 3.2vw, 2.4rem);
  }
  .ig-feed {
    grid-template-columns: repeat(5, 1fr);
    padding: 2rem 2.5rem 2.5rem;
    gap: 12px;
  }
  /* Hide the last 2 posts so we get a clean 5-column grid */
  .ig-post:nth-child(6),
  .ig-post:nth-child(7) {
    display: none;
  }
  /* Tighten stagger for 5 cols */
  .ig-post:nth-child(1) { margin-top: 0; }
  .ig-post:nth-child(2) { margin-top: 36px; }
  .ig-post:nth-child(3) { margin-top: 10px; }
  .ig-post:nth-child(4) { margin-top: 48px; }
  .ig-post:nth-child(5) { margin-top: 16px; }

  /* ====================================================
     OVER ONS PAGE
     ==================================================== */

  /* ── Two-col intro — keep side by side, tighten pads ── */
  .oo-split-left {
    padding: 4rem 3rem 4rem;
  }
  .oo-split-right {
    padding: 4rem 2.5rem 4rem;
  }
  .oo-split-hl {
    font-size: clamp(2.2rem, 4vw, 3.2rem);
  }

  /* ── Stories ── */
  .story-wide {
    grid-template-columns: 52% 48%;
    min-height: 440px;
  }
  .story-wide-txt {
    padding: 4rem 2.5rem;
  }
  .story-wide-txt h2 {
    font-size: 2rem;
  }

  /* ── Quote ── */
  .oo-quote {
    padding: 4rem 2.5rem;
  }

  /* ── Geschiedenis — 2 cols instead of 4 ── */
  .gs-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  /* Reset base border-right, give all items both borders */
  .gs-item {
    border-right: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
  }
  /* Right column items: no right border */
  .gs-item:nth-child(even) {
    border-right: none;
  }
  /* Last item alone in its row: no right border */
  .gs-item:last-child:nth-child(odd) {
    border-right: 1px solid var(--border);
  }
  /* Last row: no bottom border — last-child and the item left of it if full row */
  .gs-item:last-child {
    border-bottom: none;
  }

  /* ── Barsol ── */
  .barsol-img {
    min-height: 380px;
  }
  .barsol-txt {
    padding: 4rem 2.5rem;
  }

  /* ── Intro oo-intro ── */
  .oo-intro {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }

  /* ====================================================
     PRAESIDIUM PAGE
     ==================================================== */
  .praes-years {
    padding: 1.4rem 2.5rem;
    gap: 1rem;
  }
  .praes-hero {
    width: 100%;
    height: 480px;
  }
  .praes-hero-overlay {
    padding: 2.5rem 2.5rem 2rem;
  }
  .praes-body {
    padding: 2rem 2.5rem 3rem;
  }
  .pr-yr-big {
    font-size: 4rem;
  }

  /* ====================================================
     LIEDEREN PAGE
     ==================================================== */
  .lied-layout {
    grid-template-columns: 220px 1fr;
  }
  .lied-aside {
    padding: 2.5rem 1.5rem;
  }
  .lied-main {
    padding: 3rem 2.5rem;
  }

  /* ====================================================
     SPONSORS PAGE
     ==================================================== */
  .spon-grid {
    padding: 4rem 2.5rem;
  }
  /* Keep 4-col for gold, shrink to 3 for smaller tiers */
  .sg-unified {
    grid-template-columns: repeat(2, 1fr);
    gap: .75rem;
  }
  /* Main (gold) sponsor still spans 2 */
  .scard-main {
    grid-column: span 2;
    min-height: 200px;
  }

  /* ── Tier sizes ── */
  .spon-t1 .sg-unified { grid-template-columns: repeat(2, 1fr); }
  .spon-t1 .scard-main { grid-column: span 2; }

  /* ====================================================
     CONTACT / SUPPORT PAGE
     ==================================================== */
  .sup-grid {
    /* Keep 2-col but tighten padding */
  }
  .sup-left {
    padding: 4rem 2.5rem;
  }
  .sup-right {
    padding: 4rem 2.5rem;
  }
  .faq-section {
    padding: 4rem 2.5rem;
  }
  /* FAQ stays 2-col */

  /* ── Social section ── */
  .soc-text {
    padding: 4rem 2.5rem;
  }

  /* ====================================================
     SHARED SECTION PADDING
     ==================================================== */
  footer,
  .manifesto,
  .pillars-header,
  .about-txt,
  .story-txt-col,
  .barsol-txt,
  .hist-section,
  .praes-years,
  .praes-info-col,
  .lied-main,
  .spon-t1, .spon-t2,
  .sup-left, .sup-right,
  .faq-section,
  .soc-section,
  .pg-hdr,
  .events-section,
  .stats-section,
  .community,
  .cta-section,
  .oo-intro {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }

} /* end @media 901–1400px */