/* Footer system: one layout for every Panigrahana footer (13 Oct 2026).
   scripts/publish-footer-system.cjs links this file last in <head> on every page
   with a house or studio footer. Six stylesheets used to lay the footer out in
   competing ways (house-system, studio, site-cohesion, audit-resolution, house-home,
   home-visual), so the destination directory and the footer columns sat on two
   different grids, the brand line drifted away from the logo, the arrows were
   oversized, and the copyright row landed in the middle of the studio footer.
   Rules here are scoped under ":root body footer" so they win wherever the older
   files sit in the cascade. They set layout, rhythm and colour, never typefaces for
   running text, so each page family keeps its own type. */

:root body footer:is(.house-footer, .studio-footer) {
  --fs-gap: 40px;
  --fs-ink: var(--house-ink, #362731);
  --fs-muted: var(--house-muted, #705968);
  --fs-rule: var(--house-rule, #dfd0da);
  --fs-accent: var(--house-mauve, #75435f);
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: var(--fs-gap);
  row-gap: 0;
  align-items: start;
  /* Full-bleed on every template (the film pages boxed it to 1180px). */
  width: auto;
  max-width: none;
  margin: 0;
  padding-top: 72px;
  /* The footer owns the space under its last row, so the WhatsApp button and any bottom bar
     (--pg-contact-bottom) never cover it and no strip of page background shows beneath it. */
  padding-bottom: calc(var(--pg-contact-bottom, 0px) + 96px + env(safe-area-inset-bottom, 0px));
}
/* Out-ranks home-proof.css's body.house-home:has(#mobile-cta) padding (1,2,1): the unused
   #fs-specificity id lifts :has() to ID weight, and the two :not()s lift it past it. */
:root body:not(.fs-a):not(.fs-b):has(footer:is(.house-footer, .studio-footer), #fs-specificity) { padding-bottom: 0 !important; }

/* Destination directory: the same four columns as the footer below it. */
:root body footer:is(.house-footer, .studio-footer) > .audit-city-nav {
  grid-column: 1 / -1;
  grid-row: 1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: var(--fs-gap);
  row-gap: 0;
  width: auto;
  max-width: none;
  margin: 0 0 48px;
  padding: 0 0 44px;
  border-bottom: 1px solid var(--fs-rule);
}
:root body footer:is(.house-footer, .studio-footer) > .audit-city-nav > div {
  display: grid;
  grid-row: span 4;
  grid-template-rows: subgrid;
  row-gap: 0;
  gap: 0;
  min-width: 0;
}

/* Column labels: directory cities, studio-footer <small> labels, house-footer nav names. */
:root body footer:is(.house-footer, .studio-footer) > .audit-city-nav strong,
:root body footer.studio-footer > .studio-footer-top > nav > small,
:root body footer.house-footer > nav:not(.audit-city-nav)::before,
:root body footer.studio-footer > .studio-registered > strong {
  display: block;
  margin: 0;
  padding: 0 0 12px;
  font-size: 12px;
  line-height: 1.4;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--fs-muted) !important;
}
:root body footer.house-footer > nav:not(.audit-city-nav)::before {
  content: attr(aria-label);
}

/* Links: one size, one rhythm (32px pitch on laptop), ink with a mauve hover. */
:root body footer:is(.house-footer, .studio-footer) a:not(.studio-button):not(.house-button):not(.fs-none) {
  color: var(--fs-ink) !important;
  text-decoration: none;
}
:root body footer:is(.house-footer, .studio-footer) a:not(.studio-button):not(.house-button):not(.fs-none):hover {
  color: var(--fs-accent) !important;
  text-decoration: underline;
  text-underline-offset: 4px;
}
:root body footer:is(.house-footer, .studio-footer) > .audit-city-nav a,
:root body footer.house-footer > nav:not(.audit-city-nav) > a,
:root body footer.studio-footer > .studio-footer-top > nav > a {
  display: block;
  min-height: 0;
  margin: 0;
  padding: 5px 0;
  font-size: 14px;
  line-height: 22px;
}
:root body footer.house-footer > nav:not(.audit-city-nav),
:root body footer.studio-footer > .studio-footer-top > nav {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  min-width: 0;
  margin: 0;
}

/* External-link arrows: text-sized, centred on the text, never stretching the row. */
:root body footer.house-footer > nav:not(.audit-city-nav) > a:has(> svg),
:root body footer.studio-footer > .studio-footer-top > nav > a:has(> svg),
:root body footer.studio-footer > .studio-registered > a:has(> svg) {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
:root body footer:is(.house-footer, .studio-footer) a > svg:is(.house-arrow, .house-icon) {
  flex: 0 0 11px;
  width: 11px;
  height: 11px;
  margin: 0;
  vertical-align: middle;
}
:root body footer:is(.house-footer, .studio-footer) a > svg:is(.house-arrow, .house-icon) path {
  stroke-width: 2;
}

/* House footer: logo with its line directly beneath, three labelled columns. */
:root body footer.house-footer:has(> .audit-city-nav) { grid-template-rows: auto auto 1fr auto auto; }
:root body footer.house-footer:has(> .audit-city-nav) > .house-brand { grid-column: 1; grid-row: 2; }
:root body footer.house-footer:has(> .audit-city-nav) > p { grid-column: 1; grid-row: 3; }
:root body footer.house-footer:has(> .audit-city-nav) > nav:not(.audit-city-nav) { grid-row: 2 / 4; }
:root body footer.house-footer > .house-brand {
  align-self: start;
  margin: 0 0 16px;
}
:root body footer.house-footer > p {
  align-self: start;
  max-width: 260px;
  margin: 0;
  font-size: 14px;
  line-height: 1.65;
  color: var(--fs-muted) !important;
}
:root body footer.house-footer > nav[aria-label="Contact"] {
  flex-flow: row wrap;
  column-gap: 18px;
}
:root body footer.house-footer > nav[aria-label="Contact"]::before,
:root body footer.house-footer > nav[aria-label="Contact"] > a:is([href^="tel:"], [href^="mailto:"]) {
  flex-basis: 100%;
}
:root body footer.house-footer > .house-footer-address {
  grid-column: 1 / -1;
  max-width: none;
  margin: 44px 0 0;
  padding: 0;
  font-size: 13px;
  line-height: 1.7;
  color: var(--fs-ink) !important;
}
:root body footer.house-footer > .house-footer-address br { display: none; }
:root body footer.house-footer > .house-footer-address strong {
  display: block;
  margin: 0 0 4px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--fs-muted) !important;
}

/* Studio footer: the same structure as the house footer, built from its own markup.
   The wordmark becomes the logo, the studio address sits above the copyright row. */
:root body footer.studio-footer { grid-template-rows: auto auto 1fr auto auto; }
:root body footer.studio-footer > .studio-footer-top { display: contents; }
:root body footer.studio-footer > .studio-wordmark {
  grid-column: 1;
  grid-row: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-self: start;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: 0;
  overflow: visible;
  /* mauve-system.css forces 48px and 5vw side padding with !important. */
  font: 400 29px/1.1 var(--house-wordmark, 'Bodoni Moda', Georgia, serif) !important;
  letter-spacing: -.04em;
  text-align: center !important;
  color: var(--fs-ink) !important;
  opacity: 1;
}
:root body footer.studio-footer > .studio-wordmark::after {
  content: "WEDDINGS";
  margin-top: 8px;
  font: 500 11px/1.2 var(--house-sans, Manrope, Arial, sans-serif);
  letter-spacing: .28em;
}
:root body footer.studio-footer > .studio-footer-top > div:first-child { grid-column: 1; grid-row: 3; min-width: 0; }
:root body footer.studio-footer > .studio-footer-top > div:first-child h3 {
  max-width: 280px;
  margin: 0 0 10px;
  font: 400 21px/1.35 var(--house-serif, 'Cormorant Garamond', Georgia, serif);
  letter-spacing: 0;
  color: var(--fs-ink) !important;
}
:root body footer.studio-footer > .studio-footer-top > div:first-child p {
  max-width: 280px;
  margin: 0;
  font-size: 14px;
  line-height: 1.65;
  color: var(--fs-muted) !important;
}
:root body footer.studio-footer > .studio-footer-top > nav { grid-row: 2 / 4; }
:root body footer.studio-footer > .studio-footer-top > nav:nth-of-type(1) { grid-column: 2; }
:root body footer.studio-footer > .studio-footer-top > nav:nth-of-type(2) { grid-column: 3; }
:root body footer.studio-footer > .studio-footer-top > nav:nth-of-type(3) { grid-column: 4; }
:root body footer.studio-footer > .studio-registered {
  grid-column: 1 / -1;
  grid-row: 4;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: var(--fs-gap);
  row-gap: 4px;
  align-items: start;
  width: auto;
  max-width: none;
  margin: 44px 0 0;
  padding: 0;
  border: 0;
  font-size: 13px;
  line-height: 1.7;
}
:root body footer.studio-footer > .studio-registered > strong { grid-column: 1 / 3; grid-row: 1; padding-bottom: 4px; }
:root body footer.studio-footer > .studio-registered > address { grid-column: 1 / 3; grid-row: 2; margin: 0; font-style: normal; color: var(--fs-ink) !important; }
:root body footer.studio-footer > .studio-registered > p:not(.studio-follow) { grid-column: 3 / 5; grid-row: 1 / 3; max-width: 56ch; margin: 0; font-size: 13px; line-height: 1.7; color: var(--fs-muted) !important; }
:root body footer.studio-footer > .studio-registered > a { grid-column: 1 / 3; grid-row: 3; justify-self: start; margin: 8px 0 0; font-size: 13px; }
:root body footer.studio-footer > .studio-registered > .studio-follow { grid-column: 3 / 5; grid-row: 3; margin: 8px 0 0; font-size: 13px; line-height: 1.7; color: var(--fs-muted) !important; }

/* Copyright row: last, one rule above it, links clear of the WhatsApp button. */
:root body footer.house-footer > .house-footer-bottom,
:root body footer.studio-footer > .studio-footer-bottom {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 24px;
  margin: 28px 0 0;
  padding: 20px 0 0;
  border-top: 1px solid var(--fs-rule) !important;
  border-bottom: 0 !important;
  font-size: 12px;
  line-height: 1.5;
  color: var(--fs-muted) !important;
}
:root body footer.studio-footer > .studio-footer-bottom { grid-row: 5; }
:root body footer.house-footer > .house-footer-bottom > span { margin-right: auto; }
:root body footer:is(.house-footer, .studio-footer) :is(.house-footer-bottom, .studio-footer-bottom) > span { text-wrap: balance; }
/* seo-convert.js moves the page's "Last updated" stamp into the footer with inline styles. */
:root body footer:is(.house-footer, .studio-footer) > .pg-last-updated {
  grid-column: 1 / -1 !important;
  grid-row: 6;
  order: 6;
  justify-self: start;
  margin: 14px 0 0 !important;
  text-align: left !important;
  font-size: 12px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--fs-muted) !important;
  opacity: 1 !important;
}
:root body footer.studio-footer > .studio-footer-bottom > div { display: flex; flex-wrap: wrap; gap: 8px 24px; }
:root body footer:is(.house-footer, .studio-footer) :is(.house-footer-bottom, .studio-footer-bottom) a { font-size: 12px; }

/* Tablet: two columns; the directory keeps its own two-up grid above. */
@media (max-width: 1050px) {
  :root body footer:is(.house-footer, .studio-footer) {
    --fs-gap: 32px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none !important;
  }
  :root body footer:is(.house-footer, .studio-footer) > .audit-city-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 40px;
    padding-bottom: 36px;
  }
  :root body footer:is(.house-footer, .studio-footer) > .audit-city-nav > div:nth-child(n + 3) > strong { padding-top: 28px; }
  :root body footer.house-footer > :is(.house-brand, p),
  :root body footer.studio-footer > .studio-wordmark,
  :root body footer.studio-footer > .studio-footer-top > div:first-child {
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
  }
  :root body footer.house-footer > p,
  :root body footer.studio-footer > .studio-footer-top > div:first-child { margin-bottom: 36px; max-width: 46ch; }
  :root body footer.house-footer > nav:not(.audit-city-nav),
  :root body footer.studio-footer > .studio-footer-top > nav {
    grid-row: auto !important;
    grid-column: auto !important;
    margin-bottom: 28px;
  }
  :root body footer.house-footer > nav:not(.audit-city-nav):last-of-type,
  :root body footer.studio-footer > .studio-footer-top > nav:last-of-type { grid-column: 1 / -1 !important; }
  :root body footer.studio-footer > .studio-wordmark { order: 1; }
  :root body footer.studio-footer > .studio-footer-top > div:first-child { order: 2; }
  :root body footer.studio-footer > .studio-footer-top > nav { order: 3; }
  :root body footer.studio-footer > .studio-registered { order: 4; grid-row: auto; margin-top: 16px; }
  :root body footer.studio-footer > .studio-footer-bottom { order: 5; grid-row: auto; }
  :root body footer.house-footer > .house-footer-address { margin-top: 16px; }
}

/* Phone: 44px tap targets, everything stacked in reading order. */
@media (max-width: 760px) {
  :root body footer:is(.house-footer, .studio-footer) {
    --fs-gap: 22px;
    padding-top: 48px;
  }
  :root body footer:is(.house-footer, .studio-footer) > .audit-city-nav a,
  :root body footer.house-footer > nav:not(.audit-city-nav) > a,
  :root body footer.studio-footer > .studio-footer-top > nav > a {
    display: flex;
    align-items: flex-start;
    min-height: 44px;
    padding: 11px 0 9px;
    line-height: 1.35;
  }
  :root body footer:is(.house-footer, .studio-footer) > .audit-city-nav strong { padding-bottom: 4px; }
  :root body footer:is(.house-footer, .studio-footer) > .audit-city-nav > div:nth-child(n + 3) > strong { padding-top: 24px; }
  :root body footer.studio-footer > .studio-registered { grid-template-columns: minmax(0, 1fr); }
  :root body footer.studio-footer > .studio-registered > * { grid-column: 1 / -1 !important; grid-row: auto !important; }
  :root body footer.studio-footer > .studio-registered > p:not(.studio-follow) { margin-top: 10px; }
  :root body footer.studio-footer > .studio-registered > a { min-height: 44px; }
  :root body footer:is(.house-footer, .studio-footer) :is(.house-footer-bottom, .studio-footer-bottom) { justify-content: flex-start; align-items: flex-start; }
  :root body footer.studio-footer > .studio-footer-bottom > div { margin: 0 !important; padding: 0 !important; justify-content: flex-start; }
  :root body footer.house-footer > .house-footer-bottom > span,
  :root body footer.studio-footer > .studio-footer-bottom > span { flex-basis: 100%; margin-right: 0; }
  :root body footer:is(.house-footer, .studio-footer) :is(.house-footer-bottom, .studio-footer-bottom) a { display: inline-flex; align-items: center; min-height: 44px; }
}
