/* ============================================================
   PULSEGRID — RESPONSIVE LAYER
   Breakpoints: 1440 / 1200 / 1024 / 768 / 480 / 360
   Mobile is RECOMPOSED, not shrunk.
   ============================================================ */

/* ---------- 1440+ : give the grid more air ---------- */
@media (min-width:1441px){
  :root{--pg-max:1380px}
}

/* ---------- <= 1200 : tighten the bento + footer ---------- */
@media (max-width:1200px){
  :root{--pg-header-h:78px}
  .pg-footer__grid{grid-template-columns:minmax(0,1.6fr) repeat(2,minmax(0,1fr));row-gap:44px}
  .pg-footer__contact-col{grid-column:1/-1}
  .pg-bento{grid-template-columns:repeat(4,1fr)}
  .pg-b-4{grid-column:span 4}
  .pg-b-3{grid-column:span 2}
  .pg-b-2{grid-column:span 2}
  .pg-b-6{grid-column:span 4}
  .pg-nav a{padding:10px 11px;font-size:.88rem}
}

/* ---------- <= 1024 : tablet. Nav collapses, stories unstack ---------- */
@media (max-width:1024px){
  .pg-nav{display:none}
  .pg-burger{display:flex}
  .pg-header__cta{margin-left:0}

  .pg-sechead{grid-template-columns:1fr;align-items:start;gap:18px}
  .pg-sechead__aside{padding-bottom:0}

  /* Sticky story becomes: visual on top, stages below */
  .pg-story{grid-template-columns:1fr;gap:26px}
  .pg-story__sticky{
    position:sticky;top:calc(var(--pg-header-h) + 12px);
    aspect-ratio:16/10;max-height:44vh;
  }
  .pg-story__stages{padding:0}

  .pg-contact{grid-template-columns:1fr;gap:40px}
  .pg-doc{grid-template-columns:1fr}
  .pg-toc{
    position:static;border-left:0;padding-left:0;
    border:1px solid var(--pg-line);border-radius:var(--pg-r);padding:20px 22px;
    margin-bottom:34px;
  }
  .pg-toc ol{grid-template-columns:repeat(2,1fr);display:grid}

  .pg-srow{grid-template-columns:1fr;gap:28px;padding:clamp(44px,7vw,68px) 0}
  .pg-srow:nth-child(even) .pg-srow__viz{order:0}
  .pg-srow__viz{aspect-ratio:16/9}

  .pg-post--featured{flex-direction:column}
  .pg-post--featured .pg-post__media{flex:none;aspect-ratio:16/9}

  .pg-steps{grid-template-columns:repeat(2,1fr);row-gap:34px}
  .pg-steps::before{display:none}

  .pg-grid--4{grid-template-columns:repeat(2,1fr)}
}

/* ---------- <= 768 : mobile. Full recomposition ---------- */
@media (max-width:768px){
  :root{
    --pg-header-h:70px;
    --pg-sec-y:clamp(56px,13vw,80px);
    --pg-gutter:20px;
  }

  .pg-logo img{height:32px}
  .pg-cta-nav{--pg-btn-pad:10px 18px;font-size:.74rem}

  /* Hero: heading first, then visual — never side by side */
  .pg-hero{padding-top:calc(var(--pg-header-h) + 44px)}
  .pg-hero__split{display:flex!important;flex-direction:column;gap:34px}
  .pg-hero__meta{flex-wrap:wrap;margin-top:26px;font-size:.79rem}

  .pg-grid--2,.pg-grid--3,.pg-grid--4{grid-template-columns:1fr}

  /* Bento: single column, each card keeps its own visual */
  .pg-bento{grid-template-columns:1fr;gap:12px}
  .pg-b-4,.pg-b-3,.pg-b-2,.pg-b-6{grid-column:span 1}
  .pg-bento .pg-card{min-height:0}

  /* Story: kill the sticky pin on mobile, inline each visual instead */
  .pg-story__sticky{display:none}
  .pg-story--mobile-inline .pg-stage-item{opacity:1}

  .pg-reason{grid-template-columns:1fr;gap:10px}
  .pg-reason__num{-webkit-text-stroke-color:transparent;
    background:var(--pg-grad);-webkit-background-clip:text;background-clip:text;color:transparent;
    font-size:2rem}

  .pg-toc ol{grid-template-columns:1fr}

  .pg-role{grid-template-columns:1fr;gap:18px}
  .pg-role .pg-btn{width:100%}

  .pg-footer__grid{grid-template-columns:1fr;row-gap:36px}
  .pg-footer__bar{flex-direction:column;align-items:flex-start;gap:16px}
  .pg-footer__bar nav{gap:16px}

  .pg-values{grid-template-columns:1fr}

  .pg-steps{grid-template-columns:1fr;row-gap:26px}

  .pg-ticker__item{font-size:clamp(1.7rem,10vw,2.6rem)}

  .pg-btn{--pg-btn-pad:15px 26px;font-size:.9rem}
  .pg-btn-row .pg-btn{flex:1 1 100%}
  .pg-btn-row{gap:11px}

  .pg-article blockquote{font-size:1.1rem;padding-left:18px}

  /* Touch: no cursor glow, no tilt */
  .pg-card--glow::after{display:none}
}

/* ---------- <= 480 ---------- */
@media (max-width:480px){
  :root{--pg-gutter:18px}
  .pg-card{padding:20px}
  .pg-post__body{padding:18px}
  .pg-scanner__grid{grid-template-columns:1fr}
  .pg-member__photo{aspect-ratio:4/5}
}

/* ---------- <= 360 ---------- */
@media (max-width:360px){
  :root{--pg-gutter:15px}
  .pg-logo img{height:28px}
  .pg-cta-nav{--pg-btn-pad:9px 13px;font-size:.68rem;letter-spacing:.03em}
}

/* ---------- Touch devices: disable hover-only motion ---------- */
@media (hover:none){
  .pg-card:hover{transform:none}
  .pg-card__arrow{opacity:1;transform:none}
  .pg-post:hover{transform:none}
  .pg-btn:hover{transform:none}
}

/* ---------- Print (legal pages) ---------- */
@media print{
  .pg-header,.pg-mobilenav,.pg-ctaband,.pg-footer,.pg-toc,.pg-progress{display:none!important}
  body.pg-site{background:#fff;color:#000}
  body.pg-site::before,body.pg-site::after{display:none}
  .pg-doc{grid-template-columns:1fr}
  h1,h2,h3{color:#000}
  p,li{color:#222}
}
