/* ============================================================
   KILN — MOBILE DESIGN PASS
   Loads LAST (after kiln.css + kiln-full.css). A deliberate
   phone-width composition with the same care as desktop:
   comfortable gutters, honest type floors, a decluttered header,
   a composed hero, ≥44px touch targets, and tuned section rhythm.
   Breakpoints: ≤860 (tablet) · ≤640 (phone) · ≤380 (narrow).
   ============================================================ */

/* ---------- TABLET / SMALL LAPTOP ---------- */
@media (max-width:860px){
  .kiln .shell,.kiln .shell--wide,.kiln .shell--narrow{padding-inline:24px;}
  /* honour the device safe area at the top of the header */
  .kiln .head__in{margin-top:calc(14px + env(safe-area-inset-top,0px));}
}

/* ---------- PHONE ---------- */
@media (max-width:640px){
  .kiln{font-size:16px;}
  .kiln .shell,.kiln .shell--wide,.kiln .shell--narrow{padding-inline:18px;}

  /* ---- header: logo + menu only; booking lives on the sticky pill ---- */
  .kiln .head__in{margin-top:calc(10px + env(safe-area-inset-top,0px));padding:8px 8px 8px 16px;}
  .kiln .head__brand .brandmark{height:38px;}
  .kiln .head__cta .btn--ember{display:none;}
  .kiln .navtoggle{width:46px;height:46px;}

  /* ---- hero: tighter stack, photo-led ---- */
  .kiln .hero{padding-top:94px;padding-bottom:8px;}
  .kiln .hero h1{font-size:clamp(40px,12.4vw,56px);line-height:.96;}
  .kiln .hero__stage{margin-top:24px;}
  .kiln .hero__stage .figure--main{aspect-ratio:4/3;border-radius:22px;}
  .kiln .hero__pot{width:104px;left:auto;right:14px;bottom:-20px;border-radius:15px;}
  .kiln .hero__lower{margin-top:32px;gap:20px;}
  .kiln .hero__lead{font-size:18px;max-width:none;}
  .kiln .hero__actions{gap:10px;}
  .kiln .hero__actions .btn{flex:1 1 auto;justify-content:center;}

  /* ---- ticker ---- */
  .kiln .ticker{padding-block:11px;}
  .kiln .ticker .marquee__row > span{font-size:17px;}

  /* ---- belief ---- */
  .kiln .belief{padding-block:clamp(52px,15vw,78px);}
  .kiln .belief p{font-size:clamp(26px,7.6vw,33px);max-width:none;}

  /* ---- pillars: keep the scroll-stack, sized for the phone ---- */
  .kiln .pillars.sec--ink{padding-block:52px 58px;}
  .kiln .pillars.sec--ink .pcard,
  .kiln .pillars.sec--ink .pcard:nth-child(1),
  .kiln .pillars.sec--ink .pcard:nth-child(2),
  .kiln .pillars.sec--ink .pcard:nth-child(3){padding:24px;border-radius:20px;margin-bottom:16px;}
  .kiln .pillars.sec--ink .pcard:nth-child(1){top:82px;}
  .kiln .pillars.sec--ink .pcard:nth-child(2){top:96px;}
  .kiln .pillars.sec--ink .pcard:nth-child(3){top:110px;margin-bottom:0;}
  .kiln .pcard .pnum{font-size:36px;}
  .kiln .pcard h3{font-size:23px;margin:10px 0 10px;}
  .kiln .pcard p{font-size:.97rem;}

  /* ---- legacy statement ---- */
  .kiln .legacy{padding-block:clamp(50px,14vw,76px);}
  .kiln .legacy-h2{font-size:clamp(29px,8.4vw,40px);max-width:none;}

  /* ---- heritage editorial blue ---- */
  .kiln .heritage{padding-block:54px;}
  .kiln .heritage::before{font-size:190px;top:-2.5%;right:-5%;opacity:.06;}
  .kiln .heritage__top{gap:12px;margin-bottom:26px;}
  .kiln .heritage__kicker{font-size:.6rem;letter-spacing:.16em;}
  .kiln .heritage__pull{font-size:clamp(30px,8.2vw,40px);}
  .kiln .heritage__body p{max-width:none;}
  .kiln .heritage__lead::first-letter{font-size:3.2em;}
  .kiln .heritage__close{font-size:clamp(22px,6vw,29px);max-width:none;margin-top:32px;padding-top:22px;}

  /* ---- signature program ---- */
  .kiln .program{padding-block:clamp(54px,14vw,80px);}
  .kiln .program__grid{gap:24px;}
  .kiln .program__stage .figure{aspect-ratio:4/3;}
  .kiln .program__chip{right:14px;top:14px;transform:rotate(4deg);font-size:.74rem;}
  .kiln .program h2{font-size:clamp(40px,12vw,58px);}
  .kiln .program p{max-width:none;}
  .kiln .program__meta{gap:8px;margin:16px 0;}
  .kiln .program .hero__actions{flex-wrap:wrap;}
  .kiln .program .hero__actions .btn{flex:1 1 auto;justify-content:center;}

  /* ---- glance + perks ---- */
  .kiln .glance{padding-top:clamp(58px,16vw,88px);}
  .kiln .glance__banner h2{font-size:clamp(38px,11vw,56px);}
  .kiln .glance__intro{font-size:1rem;}
  .kiln .track__label{margin-bottom:14px;}
  .kiln .perk{flex-basis:78%;min-height:188px;padding:22px;}

  /* ---- ways: compact link table ---- */
  .kiln .ways{padding-block:clamp(54px,14vw,80px);}
  .kiln .ways__head h2{font-size:clamp(29px,8.2vw,40px);}
  .kiln .ways__grid .way{padding:18px 16px;min-height:104px;justify-content:center;}
  .kiln .ways__grid .way h4{font-size:18px;margin-bottom:6px;}
  .kiln .ways__grid .way .arr{margin-top:8px;font-size:.62rem;}

  /* ---- by the numbers ---- */
  .kiln .stats{padding-top:clamp(62px,16vw,90px);}
  .kiln .stats__lead{font-size:clamp(25px,7.2vw,34px);}
  .kiln .stats__sub{font-size:.95rem;}
  .kiln .stats__grid{gap:20px 16px;padding-block:26px;}
  .kiln .stats__grid .n{font-size:clamp(34px,11vw,46px);}
  .kiln .stats__grid .n.w{font-size:19px;}

  /* ---- membership ---- */
  .kiln .member{padding-block:clamp(62px,16vw,96px);}
  .kiln .member h2{font-size:clamp(35px,10.4vw,52px);max-width:none;}
  .kiln .member__grid{gap:30px;}
  .kiln .member__price .amt{font-size:clamp(46px,13vw,64px);}
  .kiln .benefits li{grid-template-columns:1fr;gap:5px;padding:14px 0;}
  .kiln .benefits .k{font-size:.66rem;}
  .kiln .member__honest{font-size:clamp(19px,5.4vw,25px);margin-top:30px;padding-top:26px;}

  /* ---- community ---- */
  .kiln .comm{padding-block:clamp(56px,15vw,88px);}
  .kiln .comm__head h2{font-size:clamp(29px,8.2vw,42px);}
  .kiln .ccard{min-height:0;padding:24px;}
  .kiln .comm__now{margin-top:36px;}
  .kiln .whatson__head h2{font-size:clamp(29px,8.2vw,40px);}

  /* ---- mattered ---- */
  .kiln .mattered{padding-block:clamp(76px,20vw,118px);}
  .kiln .mattered p{font-size:clamp(25px,7vw,36px);}

  /* ---- visit ---- */
  .kiln .visit{padding-block:clamp(54px,14vw,84px);}
  .kiln .visit__card{padding:26px;border-radius:24px;}
  .kiln .visit h2{font-size:clamp(33px,9.4vw,46px);margin-bottom:22px;}
  .kiln .visit dl{gap:20px 24px;}
  .kiln .signup{margin-top:6px;border-top:1px solid rgba(246,240,229,.16);padding-top:26px;}

  /* ---- footer ---- */
  .kiln .foot{padding-block:clamp(44px,12vw,72px);}
  .kiln .foot__top{flex-direction:column;gap:28px;}
  .kiln .foot__links{gap:28px 40px;}
  .kiln .foot__base{flex-direction:column;gap:6px;}

  /* ---- floating controls ---- */
  .kiln .track__btns button{width:44px;height:44px;}
  .kiln .sticky-cta{right:13px;bottom:calc(13px + env(safe-area-inset-bottom,0px));padding:13px 17px 13px 18px;}
  .kiln .sticky-cta span.t{display:inline;font-size:.84rem;}
  .kiln .palswitch{bottom:calc(12px + env(safe-area-inset-bottom,0px));}
}

/* ---------- NARROW PHONE ---------- */
@media (max-width:380px){
  .kiln .shell,.kiln .shell--wide,.kiln .shell--narrow{padding-inline:16px;}
  .kiln .hero h1{font-size:clamp(36px,11.5vw,44px);}
  .kiln .heritage__pull{font-size:clamp(28px,8vw,36px);}
  .kiln .ways__grid .way h4{font-size:17px;}
  /* keep the booking pill from crowding the palette dots */
  .kiln .sticky-cta span.t{display:none;}
}

/* ============================================================
   INNER PAGES — phone tuning (About · Classes · Raku · etc.)
   ============================================================ */
@media (max-width:640px){
  .kiln .phero{padding-top:96px;}
  .kiln .phero--impact{padding-top:96px;padding-bottom:0;}
  .kiln .phero--impact h1{font-size:clamp(40px,13vw,60px);max-width:none;}
  .kiln .phero--impact .phero__lead{font-size:18px;}
  .kiln .phero__fig{margin-top:26px;border-radius:20px;}
  /* full-bleed hero image on phone */
  .kiln .phero--impact .phero__fig{width:100vw;margin-left:calc(50% - 50vw);
    margin-top:30px;border-radius:0;}
  .kiln .phero--impact .phero__fig image-slot{border-radius:0;}

  /* generic inner section header + rhythm */
  .kiln .sec-head{margin-bottom:26px;}
  .kiln .sec-head h2{font-size:clamp(30px,8.6vw,44px);max-width:none;}
  .kiln .sec-head .intro{font-size:1rem;}

  /* duality quote */
  .kiln .quote--bold .quote__q{font-size:clamp(30px,9.5vw,44px);}

  /* the space carousel */
  .kiln .gallery__scroller{padding-inline:18px;}
  .kiln .gfig{flex-basis:82vw;}
  .kiln .gallery__nav{padding-inline:18px;justify-content:center;}

  /* team carousel */
  .kiln .people{padding-inline:18px;gap:16px;}
  .kiln .person{flex-basis:82vw;}
  .kiln .people-nav{padding-inline:18px;}

  /* instructor cards — two up, compact */
  .kiln .instr-cards{grid-template-columns:1fr 1fr;gap:12px;}
  .kiln .instr__body{padding:13px 13px 15px;}
  .kiln .instr__body h3{font-size:1rem;}
  .kiln .instr__bio{font-size:.84rem;}

  /* instructor faces carousel */
  .kiln .faces{padding-inline:18px;gap:14px;}
  .kiln .face{flex-basis:42vw;}
  .kiln .faces-nav{padding-inline:18px;}

  /* what makes us different — centered serif cards */
  .kiln .pillars--about .pcard{padding:30px 22px;}
  .kiln .pillars--about .pcard h3{font-size:clamp(30px,9vw,42px);}
  .kiln .pillars--about .pcard p{font-size:1rem;}

  /* duality quote cite may wrap on the smallest phones */
  .kiln .quote--bold cite{white-space:normal;text-wrap:balance;}

  /* stats grid (About "The Space") two-up */
  .kiln .stats__grid{grid-template-columns:1fr 1fr;gap:18px 14px;}

  /* visit / footer already handled by homepage rules */
}
@media (max-width:380px){
  .kiln .instr-cards{grid-template-columns:1fr;}
}