/* =================================================================
   Panacle Construction — responsive.css — intentional layouts per breakpoint
   ================================================================= */

/* ---------- LARGE DESKTOP 1440+ ---------- */
@media (min-width:1441px){
    :root{--gutter:120px}
  }
  
  /* ---------- DESKTOP <=1280 ---------- */
  @media (max-width:1280px){
    .hero__title{font-size:clamp(56px,11vw,160px)}
    .featured__title{font-size:clamp(48px,8vw,120px)}
  }
  
  /* ---------- TABLET <=1024 ---------- */
  @media (max-width:1024px){
    .header{grid-template-columns:1fr auto}
    .header__nav{display:none}
    .header__left{display:none}
    .header__cta{display:none}
    .menu-btn{display:flex}
    .hero{min-height:90svh}
    .hero__grid{grid-template-columns:1fr;gap:20px}
    .hero__title .right{text-align:left}
    .hero__meta{position:static;margin-bottom:30px}
    .hero__scroll{display:none}
    .statement__grid{grid-template-columns:1fr;gap:24px}
    .statement__num{position:static}
    .project--01,.project--02,.project--04{grid-template-columns:1fr}
    .project--03{max-width:100%;margin-inline-start:0}
    .project--02 .project__info{padding-top:0}
    .featured__grid{grid-template-columns:1fr;gap:40px}
    .numbers__grid{grid-template-columns:1fr;gap:50px}
    .caps__list .cap{grid-template-columns:50px 1fr}
    .caps__list .cap__desc{display:none}
    .journal__grid{grid-template-columns:1fr 1fr;gap:30px}
    .jcard--3{grid-column:1/-1;margin-top:0}
    .footer__grid{grid-template-columns:1fr 1fr;gap:36px}
    .pdetail__info{grid-template-columns:repeat(2,1fr);gap:24px}
    .pdetail__body{grid-template-columns:1fr;gap:30px}
    .studio__cols{grid-template-columns:1fr;gap:30px}
    .studio__stats{grid-template-columns:1fr;gap:30px}
    .caplist__row{grid-template-columns:60px 1fr 1fr;gap:24px}
    .caplist__icon{grid-column:2;justify-self:end}
    .jlist__item{grid-template-columns:160px 1fr 1.3fr;gap:24px}
    .jlist__d{display:none}
    .contact__grid{grid-template-columns:1fr;gap:50px}
    .menu__body{grid-template-columns:1fr;align-items:stretch;gap:clamp(36px,6vh,56px);padding-block:clamp(48px,10vh,80px) clamp(20px,3vh,32px);overflow-y:auto;-webkit-overflow-scrolling:touch;min-height:0;flex:1;display:flex;flex-direction:column;justify-content:flex-start}
    .menu__side{justify-self:start;align-self:start;gap:clamp(18px,3vh,26px);padding-bottom:0;margin-top:auto}
    .menu__links{gap:clamp(14px,2.4vh,22px)}
    .menu__links a{font-size:clamp(30px,7vmin,52px);padding-block:clamp(2px,0.6vh,8px)}
    .menu__side a.mail{font-size:clamp(16px,4vw,22px);word-break:break-word}
    .hscroll{height:auto!important}
    .hscroll__pin{position:static;height:auto;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
    .hscroll__track{transform:none!important;padding-block:40px 24px}
    .hscroll__track .hcard{scroll-snap-align:start;width:min(78vw,420px)}
    .hscroll__bar,.hscroll__hint,.hscroll__label{display:none}
  }
  
  /* ---------- MOBILE <=768 ---------- */
  @media (max-width:768px){
    :root{--gutter:22px}
    .section{padding-block:clamp(70px,16vw,110px)}
    .hero{min-height:92svh;padding-bottom:50px}
    .hero__title{font-size:clamp(54px,17vw,120px)}
    .statement__text{font-size:clamp(26px,7vw,42px)}
    .work__head,.pindex__head,.compare__head,.journal__head,.cta__grid{flex-direction:column;align-items:flex-start;gap:18px}
    .cta__grid{grid-template-columns:1fr}
    .prow{grid-template-columns:36px 1fr auto;gap:14px}
    .prow__l{display:none}
    .prow__t{font-size:clamp(22px,6vw,34px)}
    .featured__title{font-size:clamp(44px,13vw,80px)}
    .num{font-size:clamp(64px,22vw,120px)}
    .caps__list .cap{grid-template-columns:40px 1fr;gap:14px}
    .caps__list .cap__desc{display:none}
    .cap__t{font-size:clamp(20px,5vw,28px)}
    .journal__grid{grid-template-columns:1fr}
    .jcard--2,.jcard--3{margin-top:0}
    .footer__grid{grid-template-columns:1fr 1fr;gap:30px}
    .footer__mark{font-size:clamp(40px,12vw,80px)}
    .footer__bottom{flex-direction:column;gap:12px}
    .pdetail__info{grid-template-columns:1fr 1fr;gap:20px}
    .pdetail__pair{grid-template-columns:1fr}
    .pdetail__next{flex-direction:column;align-items:flex-start;gap:16px}
    .studio__stats{grid-template-columns:1fr}
    .caplist__row{grid-template-columns:50px 1fr;gap:16px}
    .caplist__d{grid-column:1/-1}
    .caplist__icon{display:none}
    .jlist__item{grid-template-columns:1fr;gap:10px}
    .jlist__date{font-size:12px}
    .jlist__t{font-size:clamp(22px,6vw,30px)}
    .article__body figure{margin:2em 0}
    .contact__title{font-size:clamp(40px,11vw,72px)}
    .menu{padding-block:clamp(18px,3vh,26px);min-height:100dvh;min-height:100svh}
    .menu .logo{font-size:clamp(15px,4vw,18px)}
    .menu__body{gap:clamp(32px,5.5vh,48px);padding-block:clamp(40px,9vh,72px) clamp(16px,2.5vh,28px);justify-content:flex-start}
    .menu__links{gap:clamp(12px,2.2vh,20px)}
    .menu__links a{font-size:clamp(24px,7.5vmin,40px);letter-spacing:-0.02em;line-height:1.05;padding-block:clamp(4px,0.8vh,10px)}
    .menu__links a .n{font-size:0.2em;margin-top:0.35em}
    .menu__side{gap:clamp(16px,2.8vh,24px)}
    .menu__side a.mail{font-size:clamp(15px,3.8vw,19px)}
    .menu__foot{flex-direction:column;gap:12px;padding-top:clamp(18px,3vh,24px);margin-top:auto}
    .pagehead h1{font-size:clamp(40px,12vw,80px)}
    .article__head h1{font-size:clamp(34px,9vw,60px)}
    .ba__label{font-size:10px;padding:.4em .7em}
    .ba__handle::after{width:38px;height:38px}
    .cursor-view{display:none}
    .wa-float{width:54px;height:54px;right:18px;bottom:max(18px, env(safe-area-inset-bottom, 0px) + 16px)}
    .wa-float__icon{width:26px;height:26px}
  }
  
  /* ---------- SMALL MOBILE <=390 ---------- */
  @media (max-width:390px){
    :root{--gutter:18px}
    .hero__title{font-size:clamp(46px,15vw,80px)}
    .num{font-size:clamp(56px,24vw,100px)}
    .footer__grid{grid-template-columns:1fr}
    .menu__links a{font-size:clamp(22px,6.8vmin,34px)}
    .menu__links{gap:clamp(10px,2vh,18px)}
    .menu__body{padding-top:clamp(36px,8vh,64px)}
    .menu__links a{padding-block:clamp(3px,0.7vh,8px)}
    .menu__side a.mail{font-size:14px}
  }

  /* ---------- SHORT VIEWPORTS (landscape phones) ---------- */
  @media (max-height:500px) and (max-width:1024px){
    .menu{padding-block:12px}
    .menu__body{gap:20px;padding-block:20px 16px;justify-content:flex-start}
    .menu__links a{font-size:clamp(20px,5.5vh,30px);line-height:1;padding-block:2px}
    .menu__links{gap:clamp(6px,1.4vh,12px)}
    .menu__side{gap:12px}
    .menu__side a.mail{font-size:14px}
    .menu__foot{padding-top:12px}
  }
  
  /* ---------- TOUCH / no-hover ---------- */
  @media (hover:none){
    .cursor-view{display:none}
    .project:hover .project__media img,.featured:hover .featured__media img,.jcard:hover .jcard__media img{transform:none}
    .pindex__preview{display:none}
    .menu__links a:hover{transform:none}
  }