/* ==========================================================================
   sarojininaidu.com — responsive recomposition
   Layouts are re-composed at each breakpoint, not merely scaled down.
   ========================================================================== */

/* the floating voice bar reserves room inside the footer, not under it */
@media (min-width: 901px) { .site-foot__base { padding-bottom: calc(1.8rem + 74px); } }

/* ---------------------------------------------------- very large screens */
@media (min-width: 1800px) {
  :root { --maxw: 1720px; --gutter: 6rem; }
  .hero__side { display: block; }
}
@media (min-width: 2400px) {
  :root { --maxw: 1920px; }
  body { font-size: 1.19rem; }
}

/* --------------------------------------------------------- < 1200px : nav */
@media (max-width: 1200px) {
  .nav-desk { display: none; }
  .nav-toggle { display: flex; }
}

/* ------------------------------------------------- < 1080px : composition */
@media (max-width: 1080px) {
  :root { --head-h: 66px; }
  .c1-5, .c1-6, .c1-7, .c1-8, .c2-7, .c2-8, .c3-9 { grid-column: 1 / 13; }
  .c6-13, .c7-13, .c8-13, .c5-13, .c3-10, .c10-13, .c4-10 { grid-column: 1 / 13; }
  .rail { display: none; }
  .books { grid-template-columns: 1fr; gap: 2rem; }
  .compare { grid-template-columns: 1fr; }
  .contact-split { grid-template-columns: 1fr; min-height: 0; }
  .contact-split__l { padding-top: calc(var(--head-h) + 3.2rem); }
  .contact-split__r { padding-top: 3.2rem; }
  .colonnade::before { background: repeating-linear-gradient(90deg, transparent 0 calc(100% / 6 - 1px), rgba(160,118,44,.16) calc(100% / 6 - 1px) calc(100% / 6)); }
}

/* ---------------------------------------------- < 1024px : hero re-stacks */
@media (max-width: 1024px) {
  .hero { min-height: auto; padding-top: calc(var(--head-h) + 3rem); padding-bottom: 3.5rem; }
  .hero__grid { grid-template-columns: 1fr; gap: 2.6rem; }
  .hero__type { grid-column: 1 / -1; grid-row: 1; }
  .hero__img  { grid-column: 1 / -1; grid-row: 2; max-width: 460px; }
  .hero__stroke { top: auto; bottom: 12%; height: 220px; opacity: .55; }
  .hero__cue { display: none; }

  .leaf__in { grid-template-columns: 1fr; gap: 1.2rem; }
  .leaf__no { grid-column: 1 / -1; font-size: clamp(3.4rem, 16vw, 6rem); }
  .leaf__body { grid-column: 1 / -1; }
  .leaf__act { grid-column: 1 / -1; justify-self: start; text-align: left; margin-top: .6rem; }

  .site-foot__cols { grid-template-columns: 1fr 1fr; }
  .site-foot__cols > *:first-child { grid-column: 1 / -1; }
}

/* --------------------------------------- < 900px : voice selector docks */
@media (max-width: 900px) {
  .voices {
    top: auto; bottom: 0; right: 0; left: 0; transform: none;
    max-width: none; gap: 0; padding: 0; border-radius: 0; box-shadow: none;
    border-left: 0; border-right: 0; border-bottom: 0;
    overflow-x: hidden; align-items: stretch;
  }
  .voices__hd { display: none; }
  .voices button {
    flex: 1 1 0; min-width: 0; flex-direction: column; gap: .34rem;
    justify-content: center; text-align: center;
    padding: .6rem .25rem .7rem; font-size: .52rem; letter-spacing: .05em;
  }
  .voices button .dot { width: 7px; height: 7px; }
  .voices .v-name { display: none; }
  .voices .v-abbr { display: block; }
  .site-foot__base { padding-bottom: calc(1.8rem + 56px); }
  .contact-split__r { padding-bottom: calc(clamp(3rem,6vw,6rem) + 10px); }
  .lb__foot { padding-bottom: 2.4rem; }
}

/* ------------------------------------------------ < 860px : gallery sheet */
@media (max-width: 860px) {
  .sheet { grid-template-columns: repeat(6, 1fr); }
  .shot, .shot--wide, .shot--tall, .shot--full { grid-column: span 6; }
  .shot--small { grid-column: span 3; }
  .wall { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
  .motif-cell { grid-column: span 6; }
  .pager { grid-template-columns: 1fr; }
  .pager a:last-child { text-align: left; }
}

/* -------------------------------------------------- < 720px : type + flow */
@media (max-width: 720px) {
  :root { --gutter: 1.35rem; }
  body { line-height: 1.72; }
  .section { padding-block: 3.6rem; }
  .form__row { grid-template-columns: 1fr; }
  .ledger div { grid-template-columns: 1fr; gap: .3rem; padding: 1rem 0; }
  .chrono li { grid-template-columns: 1fr; gap: .4rem; }
  .verse { padding-left: 1rem; }
  .site-foot__cols { grid-template-columns: 1fr; }
  .foot-nav { grid-template-columns: 1fr 1fr; }
  .site-foot__base { flex-direction: column; align-items: flex-start; gap: .7rem; }
  .band { min-height: 62svh; }
  .band__scrim { background: linear-gradient(180deg, rgba(38,8,32,.5) 0%, rgba(38,8,32,.72) 40%, rgba(38,8,32,.95) 100%); }

  /* the ribbon becomes a vertical timeline on small screens */
  .ribbon__track { display: block; overflow: visible; padding-bottom: 0; }
  .ribbon__hint { display: none; }
  .stop {
    flex: none; width: 100%; padding: 0 0 2.1rem 1.9rem;
    border-left: 1px solid rgba(246,239,228,.24); position: relative;
  }
  .stop:last-child { border-left-color: transparent; padding-bottom: 0; }
  .stop__dot { display: none; }
  .stop::before {
    content: ""; position: absolute; left: -5px; top: .6rem; width: 9px; height: 9px;
    border-radius: 50%; background: var(--accent);
  }
  .stop__yr { margin-bottom: .5rem; font-size: 1.6rem; }
  .stop p { padding-right: 0; }

  .lb__stage { padding: 0 1rem; }
  .lb__stage img { max-height: calc(100svh - 250px); }
  .lb__nav { top: auto; bottom: 1.1rem; transform: none; }
  .lb__prev { left: calc(50% - 62px); } .lb__next { right: calc(50% - 62px); }
  .lb__foot { padding: 1rem var(--gutter) 5.4rem; }
}

/* ------------------------------------------------ < 480px : small phones */
@media (max-width: 480px) {
  .display-xl { font-size: clamp(2.9rem, 15vw, 4.4rem); }
  .hero__night { gap: .6rem; }
  .hero__night small { max-width: none; }
  .wall { grid-template-columns: 1fr; }
  .motif-cell { grid-column: span 12; max-width: 300px; }
  .sheet__filters button { padding: .6rem .8rem; font-size: .6rem; letter-spacing: .14em; }
  .shot--small { grid-column: span 6; }
  .socials li a, .socials li span { width: 38px; height: 38px; }
  .lb__prev { left: calc(50% - 56px); } .lb__next { right: calc(50% - 56px); }
  .menu__list a { font-size: 1.45rem; }
}

/* ----------------------------------------------- < 360px : the narrowest */
@media (max-width: 360px) {
  :root { --gutter: 1.1rem; }
  .btn { padding: .9rem 1.3rem; font-size: .7rem; letter-spacing: .18em; }
}

/* --------------------------------------------------------- landscape phone */
@media (max-height: 520px) and (orientation: landscape) {
  .hero { min-height: auto; padding-top: calc(var(--head-h) + 2rem); padding-bottom: 2.5rem; }
  .menu__in { justify-content: flex-start; padding-top: calc(var(--head-h) + 1rem); }
  .menu__list a { font-size: 1.25rem; padding: .1rem 0; }
}

/* --------------------------------------------------------------- hover-less */
@media (hover: none) {
  .shot__btn:hover .shot__inner { transform: none; box-shadow: none; }
}