/* ==========================================================================
   ROBERTA ARMANI — responsive.css
   Deliberate compositions per breakpoint. Mobile is re-arranged, not shrunk.
   Breakpoints target: 1680 / 1440 / 1366 / 1280 / 1024 / 834 / 768 / 430-360
   ========================================================================== */

/* ---------- 1440px and below: tighten the outer margin ---------- */
@media (max-width:1440px){
  :root{--maxw:1360px}
}

/* ---------- 1280px and below ---------- */
@media (max-width:1280px){
  :root{--nav-h:70px}
  .nav__list{gap:1.05rem}
  .nav__link{letter-spacing:.15em}
  .thesis{grid-template-columns:minmax(0,2fr) minmax(0,7fr) minmax(0,3fr)}
}

/* ---------- 1140px: nav collapses to the panel ---------- */
@media (max-width:1140px){
  .nav__list,.nav__exit{display:none}
  .burger{display:block}

  .hero__grid{grid-template-columns:minmax(0,1fr)}
  .hero__aside{position:static;max-width:560px}
  .footer__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .footer__statement{grid-column:1 / -1;max-width:26ch}

  .thesis{grid-template-columns:auto minmax(0,1fr)}
  .thesis__side{grid-column:2;position:static;
    border-top:1px solid var(--line);padding-top:1.5rem;margin-top:.5rem}
}

/* ---------- 1024px: tablet landscape ---------- */
@media (max-width:1024px){
  .masthead__row{grid-template-columns:minmax(0,1fr)}
  .masthead__meta{padding-bottom:0}

  .about-open,
  .interlude,
  .feature,
  .contact-open,
  .chapter__grid,
  .entry__body,
  .entry--reverse .entry__body{grid-template-columns:minmax(0,1fr)}

  .chapter--flip .chapter__grid{direction:ltr}
  .entry--reverse .entry__body > .entry__media{order:0}

  .about-sec{grid-template-columns:minmax(0,1fr)}
  .about-sec__side{position:static;flex-direction:row;align-items:baseline;gap:1.1rem;flex-wrap:wrap}

  .mod--w4,.mod--w5,.mod--w6,.mod--w7,.mod--w8{grid-column:span 6}
  .mod--w12{grid-column:span 12}

  .strip{grid-template-columns:auto minmax(0,1fr)}
  .strip__body{grid-column:2}

  .ctaband{grid-template-columns:minmax(0,1fr)}
  .access__grid{grid-template-columns:minmax(0,1fr)}
  .access__panel{max-width:560px}

  /* Cap plate widths so low-resolution source images never over-scale */
  .plate{max-width:640px}
  .plate--center{margin-inline:auto}
}

/* ---------- 1024px: multi-cell grids step down ---------- */
@media (max-width:1024px){
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ---------- 900px ---------- */
@media (max-width:900px){
  .arc,.steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mod--split{grid-template-columns:minmax(0,1fr)}
  .hero__under{grid-template-columns:minmax(0,1fr)}
  .values__row{grid-template-columns:minmax(0,1fr)}
  .values__row dt{margin-bottom:.15rem}
}

/* ---------- 834px / 768px: tablet portrait ---------- */
@media (max-width:834px){
  :root{--nav-h:64px}

  .footer__grid{grid-template-columns:minmax(0,1fr)}
  .footer__statement{max-width:none}

  .mod--w4,.mod--w5,.mod--w6,.mod--w7,.mod--w8{grid-column:span 12}

  .jprev__row{grid-template-columns:auto minmax(0,1fr)}
  .jprev__row .jprev__go{grid-column:2}

  .pager{grid-template-columns:minmax(0,1fr)}
  .pager__cell + .pager__cell{
    border-left:0;border-top:1px solid var(--line);padding-left:0;
  }
  .pager__cell:hover,.pager__cell + .pager__cell:hover{padding-left:.5rem}

  .access__inner{padding-top:7rem;padding-bottom:6rem;justify-content:flex-start}
  .access__panel{max-width:none}
}

@media (max-width:768px){
  .form__grid{grid-template-columns:minmax(0,1fr)}
  .entry__head{grid-template-columns:minmax(0,1fr);gap:.85rem}
  .entry__n{font-size:2rem}
  .idxrow{grid-template-columns:minmax(0,1fr);gap:.85rem}
  .thesis{grid-template-columns:minmax(0,1fr);gap:1.25rem}
  .thesis__num{position:static}
  .thesis__side{grid-column:1}
  .plate{max-width:none}
}

/* ---------- 600px and below: phones ---------- */
@media (max-width:600px){
  .arc,.steps,.facts,.facts--pair{grid-template-columns:minmax(0,1fr)}
  :root{
    --sec:clamp(3.25rem,2.4rem + 3.2vw,4.5rem);
    --gut:1.15rem;
  }
  body{line-height:1.68}

  .brand__mark{display:none}

  .strip{grid-template-columns:minmax(0,1fr);gap:.6rem}
  .strip__body{grid-column:1}
  .strip:hover{background:transparent}

  .arc__cell{padding:1.35rem 1.1rem}
  .facts__item{padding:1.35rem 1.1rem}
  .steps__s{padding:1.25rem 1.1rem}
  .values__row{padding:1.15rem 1.1rem}
  .mod{padding:1.4rem 1.15rem}
  .persp__card{padding:1.4rem 1.15rem}
  .framed{padding:1.4rem 1.15rem}
  .contact-card{padding:1.4rem 1.15rem}
  .access__panel{padding:1.5rem 1.25rem}

  .chapter__ghost{font-size:4.75rem}
  .chapter__meta{gap:.9rem 1.25rem}

  .footer__bottom{flex-direction:column;align-items:flex-start;gap:.75rem}
  .footer__top{padding-block:2.75rem}

  .navpanel__link{font-size:1.55rem;gap:.85rem}
  .navpanel__foot{gap:.85rem 1.25rem;flex-direction:column;align-items:flex-start}

  .form__actions{flex-direction:column;align-items:stretch;gap:1.25rem}
  .form__actions .btn{justify-content:center;width:100%}
  .form__status{order:2}

  .breathe{padding-block:3.25rem}
  .entry__foot{flex-direction:column;align-items:flex-start;gap:1rem}
  .ctaband__actions .btn{width:100%;justify-content:space-between}

  .access__head,.access__foot{position:static;padding:0}
  .access__head{margin-bottom:2.25rem;flex-direction:column;gap:.35rem}
  .access__foot{margin-top:2.5rem;flex-direction:column;gap:.35rem}
  .access__inner{padding-block:2.5rem;justify-content:center}

}

/* ---------- 430px and below ---------- */
@media (max-width:430px){
  :root{--pad:1.1rem}
  .metarow{gap:.75rem}
  .metarow dd{font-size:.75rem}
  .btn{padding:.95rem 1.35rem;letter-spacing:.14em}
  .social a{width:42px;height:42px}
  .chips{gap:.4rem}
  .chip{padding:.36rem .62rem}
}

/* ---------- 380px and below ---------- */
@media (max-width:380px){
  :root{--pad:1rem}
  .access__name{font-size:2.5rem}
  .navpanel__link{font-size:1.4rem}
  .entry__meta{gap:.4rem .9rem}
  .plate__cap{flex-direction:column;gap:.35rem}
}

/* ---------- Landscape phones: shrink vertical rhythm ---------- */
@media (max-height:520px) and (orientation:landscape){
  .navpanel{padding-top:calc(var(--nav-h) + 1rem)}
  .navpanel__link{padding:.6rem 0;font-size:1.15rem}
  .access__inner{padding-block:5.5rem 3rem;justify-content:flex-start}
}

/* ---------- Very wide screens: keep line lengths civilised ---------- */
@media (min-width:1800px){
  :root{--maxw:1660px}
}

/* ---------- Print ---------- */
@media print{
  .site-header,.navpanel,.burger,.pager,.nav__progress{display:none!important}
  body{background:#fff;color:#000}
  .site-footer{background:#fff;color:#000;border-top:1px solid #ccc}
  .plate__frame{background:#fff;border:1px solid #ccc}
  a{text-decoration:underline}
  .reveal{opacity:1!important;transform:none!important}
}