/*
 * James Agalga Leadership Theme v3.1.0
 * Responsive canvas and page-width refinement.
 *
 * Full Screen and Boxed are deliberately different presentation modes:
 * - Full Screen: edge-to-edge website canvas with a broad responsive content shell.
 * - Boxed: the complete website is contained in a centred framed canvas.
 *
 * This layer loads last so legacy page modules cannot accidentally squeeze the
 * public experience back to older, narrower dimensions.
 */
:root{
    --agalga-full-content-width:1640px;
    --agalga-full-gutter:clamp(28px,3.1vw,60px);
    --agalga-boxed-gutter:clamp(24px,2.25vw,42px);
    --agalga-reading-width:860px;
}

/* ---------- Whole-site canvas modes ---------- */
body.agalga-layout-full{
    width:100%;
    background:var(--brand-surface,#fff);
}
body.agalga-layout-full .agalga-site-frame{
    width:100%;
    max-width:none;
    min-height:100vh;
    margin:0;
    border-radius:0;
    box-shadow:none;
    overflow:clip;
}
body.agalga-layout-full .site-shell{
    width:min(var(--agalga-full-content-width,1640px),calc(100% - var(--agalga-full-gutter) - var(--agalga-full-gutter)));
    max-width:none;
    margin-inline:auto;
}

body.agalga-layout-boxed{
    background:#e9eeeb;
    padding:20px 0;
}
body.agalga-layout-boxed .agalga-site-frame{
    width:min(var(--agalga-boxed-width,1480px),calc(100% - 40px));
    max-width:var(--agalga-boxed-width,1480px);
    min-height:calc(100vh - 40px);
    margin:0 auto;
    border-radius:8px;
    background:var(--brand-surface,#fff);
    box-shadow:0 20px 64px rgba(10,35,23,.14);
    overflow:clip;
}
body.agalga-layout-boxed .site-shell{
    width:calc(100% - var(--agalga-boxed-gutter) - var(--agalga-boxed-gutter));
    max-width:calc(var(--agalga-boxed-width,1480px) - var(--agalga-boxed-gutter) - var(--agalga-boxed-gutter));
    margin-inline:auto;
}
body.admin-bar.agalga-layout-boxed .agalga-site-frame{
    min-height:calc(100vh - 72px);
}

/* Homepage remains faithful to its approved composition while actually obeying mode. */
body.agalga-layout-full.agalga-home-v220 .site-shell{
    width:min(var(--agalga-full-content-width,1640px),calc(100% - var(--agalga-full-gutter) - var(--agalga-full-gutter)));
}
body.agalga-layout-boxed.agalga-home-v220 .site-shell{
    width:calc(100% - var(--agalga-boxed-gutter) - var(--agalga-boxed-gutter));
    max-width:none;
}

/* ---------- Inner-page breathing room ---------- */
body.agalga-inner-v280.agalga-layout-full .site-main > section,
body.agalga-inner-v280.agalga-layout-full .site-main > div,
body.agalga-inner-v280.agalga-layout-full .site-main > article{
    min-width:0;
}
body.agalga-inner-v280 .content-shell,
body.agalga-inner-v280 .profile-content,
body.agalga-inner-v280 .parliament-content,
body.agalga-inner-v280 .builsa-content,
body.agalga-inner-v280 .issues-content,
body.agalga-inner-v280 .v250-content-shell,
body.agalga-inner-v280 .v260-content-shell{
    box-sizing:border-box;
}


/* Generic WordPress pages were previously capped at 900/960px, which made
   otherwise wide pages look visibly squeezed. The panel now uses the full
   site shell; text retains an editorial measure inside that canvas. */
body.agalga-inner-v280 .page-content:not(.page-content--studio-takeover),
body.agalga-inner-v280 .page-content.landing-panel{
    width:100%;
    max-width:none;
    margin-left:0;
    margin-right:0;
}
body.agalga-inner-v280 .page-content.landing-panel{
    padding:clamp(26px,2.5vw,42px);
}
body.agalga-inner-v280 .page-content .entry-content > p,
body.agalga-inner-v280 .page-content .entry-content > ul,
body.agalga-inner-v280 .page-content .entry-content > ol,
body.agalga-inner-v280 .page-content .entry-content > blockquote,
body.agalga-inner-v280 .page-content .entry-content > h2,
body.agalga-inner-v280 .page-content .entry-content > h3,
body.agalga-inner-v280 .page-content .entry-content > h4{
    max-width:980px;
}
body.agalga-inner-v280 .page-content .entry-content > .alignwide{
    width:100%;
    max-width:1320px;
}
body.agalga-inner-v280 .page-content .entry-content > .alignfull{
    width:100%;
    max-width:none;
}
body.agalga-inner-v280 .search-results-list{max-width:none}

/* Wider primary/secondary proportions on large screens prevent dense pages from
   looking like narrow columns floating in the middle of a desktop monitor. */
@media (min-width:1440px){
    body.agalga-layout-full.agalga-inner-v280 .profile-hero-grid{grid-template-columns:minmax(0,1fr) 430px;gap:clamp(56px,5vw,92px)}
    body.agalga-layout-full.agalga-inner-v280 .parliament-feature-grid{grid-template-columns:minmax(0,1fr) minmax(410px,480px);gap:clamp(52px,4.5vw,84px)}
    body.agalga-layout-full.agalga-inner-v280 .builsa-feature-grid{grid-template-columns:minmax(0,1fr) minmax(390px,470px);gap:clamp(52px,4.5vw,84px)}
    body.agalga-layout-full.agalga-inner-v280 .issues-feature-grid{grid-template-columns:minmax(0,1fr) 360px;gap:clamp(52px,4.5vw,84px)}
    body.agalga-layout-full.agalga-inner-v280 .v250-feature-layout{grid-template-columns:minmax(0,1.45fr) minmax(360px,.55fr)}
    body.agalga-layout-full.agalga-inner-v280 .v260-majority-hero-grid{grid-template-columns:minmax(0,1.5fr) minmax(360px,.5fr);gap:64px}
    body.agalga-layout-full.agalga-inner-v280 .v260-contact-layout{grid-template-columns:minmax(0,1.55fr) minmax(340px,.45fr);gap:34px}
}

/* Editorial text should be comfortably readable, but not constrain the page canvas. */
body.agalga-inner-v280 .entry-content > p,
body.agalga-inner-v280 .single-content > p,
body.agalga-inner-v280 .v260-copy > p{
    max-width:var(--agalga-reading-width);
}
body.agalga-inner-v280 .landing-description,
body.agalga-inner-v280 .section-support-copy{
    max-width:900px;
}

/* Cards use the extra canvas instead of growing their internal whitespace. */
body.agalga-layout-full.agalga-inner-v280 .v260-service-cards,
body.agalga-layout-full.agalga-inner-v280 .v260-visual-grid,
body.agalga-layout-full.agalga-inner-v280 .builsa-project-grid,
body.agalga-layout-full.agalga-inner-v280 .issues-featured-grid{
    gap:clamp(14px,1.25vw,22px);
}
body.agalga-layout-full.agalga-inner-v280 .v250-metric-strip > div,
body.agalga-layout-full.agalga-inner-v280 .parliament-total-grid > div,
body.agalga-layout-full.agalga-inner-v280 .builsa-metrics > div{
    padding-left:clamp(18px,1.6vw,28px);
    padding-right:clamp(18px,1.6vw,28px);
}

/* The Design Studio's normal canvas follows the same global width contract.
   Explicit Studio Narrow and Full component modes still override this. */
body.agalga-layout-full .agalga-designed-page:not(.agalga-designed-page--narrow):not(.agalga-designed-page--full) .studio-component > .site-shell{
    width:min(var(--agalga-full-content-width,1640px),calc(100% - var(--agalga-full-gutter) - var(--agalga-full-gutter)));
}
body.agalga-layout-boxed .agalga-designed-page:not(.agalga-designed-page--narrow) .studio-component > .site-shell{
    width:calc(100% - var(--agalga-boxed-gutter) - var(--agalga-boxed-gutter));
    max-width:none;
}
body.agalga-layout-boxed .agalga-designed-page--full .studio-component > .site-shell{
    width:100%;
    max-width:none;
    padding-left:var(--agalga-boxed-gutter);
    padding-right:var(--agalga-boxed-gutter);
}

/* ---------- Responsive reflow: reduce columns before they become squeezed ---------- */
@media (max-width:1380px){
    body.agalga-inner-v280 .parliament-type-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
    body.agalga-inner-v280 .v260-service-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
    body.agalga-inner-v280 .v260-visual-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:1180px){
    :root{--agalga-full-gutter:24px;--agalga-boxed-gutter:22px}
    body.agalga-layout-boxed{padding:12px 0}
    body.agalga-layout-boxed .agalga-site-frame{width:calc(100% - 24px);min-height:calc(100vh - 24px);border-radius:6px}
    body.agalga-inner-v280 .v260-service-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:960px){
    body.agalga-layout-boxed{padding:0}
    body.agalga-layout-boxed .agalga-site-frame{width:100%;max-width:none;margin:0;border-radius:0;box-shadow:none;min-height:100vh}
    body.agalga-layout-full .site-shell,
    body.agalga-layout-boxed .site-shell,
    body.agalga-layout-full.agalga-home-v220 .site-shell,
    body.agalga-layout-boxed.agalga-home-v220 .site-shell{width:calc(100% - 36px);max-width:none}
    body.agalga-inner-v280 .v260-visual-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
    body.agalga-layout-full .site-shell,
    body.agalga-layout-boxed .site-shell,
    body.agalga-layout-full.agalga-home-v220 .site-shell,
    body.agalga-layout-boxed.agalga-home-v220 .site-shell{width:calc(100% - 28px)}
    body.agalga-inner-v280 .parliament-type-grid,
    body.agalga-inner-v280 .v260-service-cards,
    body.agalga-inner-v280 .v260-visual-grid{grid-template-columns:1fr}
}

/* ========================================================================== 
   v3.2.0 canonical public layout engine
   One frame model replaces the accumulated version-specific width overrides.
   ========================================================================== */
:root {
  --agalga-content-width: var(--agalga-full-content-width, 1640px);
  --agalga-readable-width: 860px;
  --agalga-section-gutter: clamp(20px, 4vw, 64px);
  --agalga-card-gap: clamp(16px, 2vw, 28px);
}

body.agalga-public-site {
  overflow-x: hidden;
}

body.agalga-public-site .site-shell,
body.agalga-public-site .agalga-site-shell,
body.agalga-public-site #page {
  width: 100%;
  min-width: 0;
}

body.agalga-layout-full .site-shell,
body.agalga-layout-full .agalga-site-shell,
body.agalga-layout-full #page {
  max-width: none;
  margin-inline: 0;
  border-radius: 0;
  box-shadow: none;
}

body.agalga-layout-boxed {
  background: #eef1ee;
}

body.agalga-layout-boxed .site-shell,
body.agalga-layout-boxed .agalga-site-shell,
body.agalga-layout-boxed #page {
  width: min(calc(100% - 32px), var(--agalga-boxed-width, 1480px));
  margin-inline: auto;
  background: #fff;
  box-shadow: 0 14px 46px rgba(17, 24, 39, .08);
}

/* Standard content canvas used across all public templates. */
body.agalga-public-site :is(
  .agalga-container,
  .site-container,
  .section-inner,
  .section-wrap,
  .inner-page-container,
  .agalga-inner-container,
  .agalga-page-container,
  .agalga-content-container,
  .homepage-section-inner,
  .mock-container,
  .inner-shell,
  .page-shell
) {
  width: min(calc(100% - (2 * var(--agalga-section-gutter))), var(--agalga-content-width));
  max-width: var(--agalga-content-width);
  margin-inline: auto;
}

/* Remove historic narrow-page caps from structural wrappers. */
body.agalga-public-site :is(
  main.site-main,
  .site-main,
  .page-content,
  .entry-content,
  .agalga-main-content,
  .agalga-page-body,
  .inner-main,
  .public-page-main
) {
  max-width: none;
  min-width: 0;
}

/* Long prose remains deliberately readable, while grids use the full canvas. */
body.agalga-public-site :is(
  .entry-content > p,
  .entry-content > ul,
  .entry-content > ol,
  .entry-content > blockquote,
  .agalga-prose,
  .longform-copy,
  .article-body
) {
  max-width: var(--agalga-readable-width);
}

body.agalga-public-site :is(
  .agalga-grid,
  .card-grid,
  .news-grid,
  .project-grid,
  .media-grid,
  .document-grid,
  .issues-grid,
  .parliament-grid,
  .stats-grid,
  .agalga-studio-grid
) {
  min-width: 0;
  gap: var(--agalga-card-gap);
}

body.agalga-public-site :is(img, video, iframe, table) {
  max-width: 100%;
}

@media (max-width: 1024px) {
  :root { --agalga-section-gutter: clamp(18px, 3vw, 32px); }
  body.agalga-layout-boxed .site-shell,
  body.agalga-layout-boxed .agalga-site-shell,
  body.agalga-layout-boxed #page {
    width: 100%;
    max-width: none;
    box-shadow: none;
  }
}

@media (max-width: 720px) {
  :root { --agalga-section-gutter: 18px; --agalga-card-gap: 16px; }
  body.agalga-public-site :is(.agalga-grid,.card-grid,.news-grid,.project-grid,.media-grid,.document-grid,.issues-grid,.parliament-grid,.stats-grid,.agalga-studio-grid) {
    grid-template-columns: 1fr;
  }
}

/* v3.3.0 Studio component visibility */
.studio-visibility--desktop,.studio-visibility--tablet,.studio-visibility--mobile{display:none}
@media (min-width:1101px){.studio-visibility--desktop{display:block}}
@media (min-width:701px) and (max-width:1100px){.studio-visibility--tablet{display:block}}
@media (max-width:700px){.studio-visibility--mobile{display:block}.agalga-designed-page .studio-section-width--full>.site-shell{padding-left:20px;padding-right:20px}}