/*
 * One responsive editorial scale for the public site.
 *
 * The Media Studio already has a legible mobile layout. Bring the public
 * pages into that same fluid pattern: one column when needed, text that
 * follows the viewport, readable paragraph leading, and full-width content.
 *
 * Desktop remains untouched. Saved Site Designer records are not modified:
 * per-element custom font sizes are scaled by design-runtime.js instead.
 */
@media (max-width:900px) {
  body.cx-public-page main :is(
    .shell,.work-columns,.home-featured-stack,.home-section-grid,
    .home-about-grid,.home-commission-grid,.about-page-grid,
    .commission-page-grid,.detail-grid,.writing-grid,.art-archive-grid,
    .connect-content,.whispers-layout,.whispers-gallery
  ) {
    min-width:0;
    max-width:100%;
  }
  body.cx-public-page main :is(
    .work-columns,.home-section-grid,.home-about-grid,.home-commission-grid,
    .detail-grid,.about-page-grid,.commission-page-grid,.connect-grid,
    .whispers-layout
  ) {
    grid-template-columns:minmax(0,1fr)!important;
  }
  body.cx-public-page main :is(
    .work-columns,.home-featured-stack,.home-section-grid,
    .writing-list,.writing-grid,.gallery-grid,.art-archive-grid
  ) > * {
    min-width:0;
    max-width:100%;
  }
  body.cx-public-page main :is(
    .hero-copy,.home-about-copy,.home-commission-copy,.detail-copy,
    .about-page-copy,.commission-page-content,.writing-info,
    .art-archive-info,.whispers-panel,.contact-content
  ) {
    min-width:0;
    max-width:100%;
  }
  body.cx-public-page main :is(
    .detail-image,.about-photo-large,.commission-page-image,
    .home-about-media,.home-commission-media
  ) {
    max-width:100%;
  }
  body.cx-public-page main :is(
    .rich-text,.rich-text p,.card-summary,.hero-desc,
    .detail-copy,.home-about-paragraphs,.home-commission-description,
    .whisper-entry,.whisper-message
  ) {
    overflow-wrap:anywhere;
  }
  body.cx-public-page main :is(
    .hero-actions,.social-row,.commission-platforms,.studio-actions,
    .whispers-page-actions
  ) {
    flex-wrap:wrap;
    max-width:100%;
  }
  body.cx-public-page main .page-banner-inner {
    width:min(100%,780px);
    max-width:100%;
    margin-inline:auto;
  }
}
/* Phones: one fluid scale for public-facing pages only.
   Separate moderator and Media Studio controls keep their existing layout. */
@media (max-width:600px) {
  body.cx-public-page main :is(
    .work-section,.home-commissions-section,.home-about-section,
    .whispers-invite-section,.connect-section,
    .collection-section,.text-section,.detail-top,
    .page-banner,.whispers-page
  ) > .shell {
    width:calc(100% - 30px)!important;
    max-width:100%!important;
  }
  body.cx-public-page main :is(
    .work-section,.home-commissions-section,.home-about-section,
    .whispers-invite-section,.connect-section,
    .collection-section,.text-section,.detail-top,
    .page-banner,.whispers-page
  ) {
    min-width:0;
    max-width:100%;
  }
  body.cx-public-page main :is(
    .hero .hero-title,.hero h1
  ) {
    max-width:100%!important;
    font-size:clamp(34px,9.5vw,45px)!important;
    line-height:1.08!important;
    overflow-wrap:break-word;
    white-space:normal!important;
  }
  body.cx-public-page main :is(
    .page-banner h1,.detail-copy h1
  ) {
    font-size:clamp(35px,9.6vw,46px)!important;
    line-height:1.12!important;
    overflow-wrap:break-word;
  }
  body.cx-public-page main :is(
    .section-intro h2,.home-about-heading h2,.home-commission-copy h2,
    .home-commissions-section h2,.home-about-section h2,
    .connect-section h2,.text-section h2,
    .whispers-intro h2,.whispers-card-centered h3
  ) {
    font-size:clamp(30px,8.5vw,40px)!important;
    line-height:1.16!important;
    letter-spacing:clamp(.02em,.13vw,.09em)!important;
    overflow-wrap:break-word;
  }
  body.cx-public-page main :is(
    .section-heading h2,.section-heading h3,.collection-heading h2,
    .writing-info h3,.art-archive-info h3,.art-caption h3,
    .commission-platform-card h4,.commission-inline-card h3,
    .whispers-panel h3,.text-section h3
  ) {
    font-size:clamp(23px,6.4vw,30px)!important;
    line-height:1.2!important;
    overflow-wrap:break-word;
  }
  body.cx-public-page main :is(
    .hero-desc,.hero-desc p,.page-banner p:last-child,
    .home-about-paragraphs p,.home-commission-description p,
    .commission-text,.commission-text p,.connect-section p:not(.eyebrow),
    .text-section .rich-text p,.text-section .rich-text li,
    .detail-copy .rich-text p,.detail-copy .rich-text li,
    .text-section .commission-rich p,.contact-content p,
    .whispers-guidelines,.whispers-intro p,.whispers-privacy,
    .whispers-card-centered p
  ) {
    font-size:clamp(16px,calc(var(--cx-about-body,20px) * .88),20px)!important;
    line-height:clamp(1.42,var(--cx-paragraph-leading,1.5),1.65)!important;
    letter-spacing:normal;
  }
  body.cx-public-page main :is(
    .detail-copy .lead p,.text-section .lead p
  ) {
    font-size:clamp(18px,calc(var(--cx-project-lead,26px) * .76),23px)!important;
    line-height:1.5!important;
  }
  body.cx-public-page main :is(
    .writing-info .card-summary,.writing-info .card-summary p,
    .art-archive-info .card-summary,.art-archive-info .card-summary p,
    .writing-list .card-summary,.writing-grid .card-summary
  ) {
    font-size:clamp(14px,3.85vw,17px)!important;
    line-height:1.45!important;
  }
  body.cx-public-page main :is(
    .eyebrow,.home-section-eyebrow,.section-intro p,
    .writing-info .eyebrow,.art-archive-info .eyebrow
  ) {
    font-size:clamp(10px,2.7vw,13px)!important;
    line-height:1.5!important;
    letter-spacing:clamp(.04em,.13vw,.13em)!important;
  }
  body.cx-public-page main :is(
    .btn,.btn-small,.text-link,.section-heading a,
    .whispers-page-actions a
  ) {
    max-width:100%;
    min-height:44px;
    font-size:clamp(10px,2.8vw,13px)!important;
    line-height:1.3!important;
    white-space:normal!important;
    overflow-wrap:break-word;
    text-align:center;
  }
  body.cx-public-page main :is(
    .collection-heading,.whispers-list-header,.section-heading
  ) {
    flex-wrap:wrap;
    gap:10px;
  }
  body.cx-public-page main :is(
    .writing-card,.art-archive-row,.gallery-grid .art-card,
    .commission-platform-card,.commission-inline-card,.whispers-panel
  ) {
    box-sizing:border-box;
    min-width:0;
    max-width:100%;
  }
  /* Honour the requested square thumbnail beside its summary, rather than
     turning every writing card into a giant image-first poster. */
  body.cx-public-page main :is(
    .writing-list .writing-card,.writing-grid .writing-card,
    .home-featured-writing .writing-card,.art-archive-row
  ) {
    grid-template-columns:clamp(86px,27vw,125px) minmax(0,1fr)!important;
    gap:clamp(10px,3vw,16px)!important;
    align-items:start!important;
  }
  body.cx-public-page main :is(
    .writing-thumb,.art-archive-cover
  ) {
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:1;
  }
  body.cx-public-page main :is(
    .writing-thumb img,.art-archive-cover img
  ) {
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }
  body.cx-public-page main .gallery-grid {
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
  }
  body.cx-public-page main .gallery-grid .art-open {
    height:auto!important;
    aspect-ratio:4 / 3;
  }
  body.cx-public-page main :is(
    .about-photo-large img,.commission-page-image img,.detail-image img
  ) {
    width:100%;
    height:auto!important;
    object-fit:contain!important;
  }
  body.cx-public-page main :is(
    .whispers-layout,.whispers-gallery,.commission-platform-grid,
    .commission-inline-grid
  ) {
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    min-width:0;
    width:100%;
  }
  body.cx-public-page main :is(
    .whispers-fields input,.whispers-fields textarea,
    .whispers-fields select,.contact-content textarea
  ) {
    max-width:100%;
    min-width:0;
    font-size:16px;
  }
  body.cx-public-page main :is(
    .rich-text p,.rich-text li
  ) {
    max-width:100%;
  }
}
