/* 1401px and up — Full Desktop (also covers 1440 Laptop L, 1920, and 4K 2560): the base styles in this file are the Full Desktop CSS. Narrower sizes are overridden in the RESPONSIVE TIERS section at the bottom of this file. */

/* Site footer base (moved from new_base_aesthetics.css; kept first so this file's own rules still win ties) */
/* THEME ZONES, ring rule part 2 (Q149): footer, badge and body use the same ring as above. Footer: footer.css... */
:where(.site_footer) { position: relative; }

.site_footer {
    --zone-t: var(--layout-ring); /* Oct 18 2026 - #790 same ring size as the content zone */
    --zone-top-left-corner-img: var(--theme-zone-footer-top-left-corner-background-image, none);
    --zone-top-left-corner-clr: var(--theme-zone-footer-top-left-corner-background-color, transparent);
    --zone-top-left-corner-img-opacity: var(--theme-zone-footer-top-left-corner-background-image-opacity, 1);
    --zone-top-left-corner-clr-opacity: var(--theme-zone-footer-top-left-corner-background-color-opacity, 1);
    --zone-top-left-corner-inner-glow: var(--theme-zone-footer-top-left-corner-inner-glow, none);
    --zone-top-left-corner-outer-glow: var(--theme-zone-footer-top-left-corner-outer-glow, none);
    --zone-top-left-corner-shadow: var(--theme-zone-footer-top-left-corner-shadow, none);
    --zone-top-right-corner-img: var(--theme-zone-footer-top-right-corner-background-image, none);
    --zone-top-right-corner-clr: var(--theme-zone-footer-top-right-corner-background-color, transparent);
    --zone-top-right-corner-img-opacity: var(--theme-zone-footer-top-right-corner-background-image-opacity, 1);
    --zone-top-right-corner-clr-opacity: var(--theme-zone-footer-top-right-corner-background-color-opacity, 1);
    --zone-top-right-corner-inner-glow: var(--theme-zone-footer-top-right-corner-inner-glow, none);
    --zone-top-right-corner-outer-glow: var(--theme-zone-footer-top-right-corner-outer-glow, none);
    --zone-top-right-corner-shadow: var(--theme-zone-footer-top-right-corner-shadow, none);
    --zone-bottom-left-corner-img: var(--theme-zone-footer-bottom-left-corner-background-image, none);
    --zone-bottom-left-corner-clr: var(--theme-zone-footer-bottom-left-corner-background-color, transparent);
    --zone-bottom-left-corner-img-opacity: var(--theme-zone-footer-bottom-left-corner-background-image-opacity, 1);
    --zone-bottom-left-corner-clr-opacity: var(--theme-zone-footer-bottom-left-corner-background-color-opacity, 1);
    --zone-bottom-left-corner-inner-glow: var(--theme-zone-footer-bottom-left-corner-inner-glow, none);
    --zone-bottom-left-corner-outer-glow: var(--theme-zone-footer-bottom-left-corner-outer-glow, none);
    --zone-bottom-left-corner-shadow: var(--theme-zone-footer-bottom-left-corner-shadow, none);
    --zone-bottom-right-corner-img: var(--theme-zone-footer-bottom-right-corner-background-image, none);
    --zone-bottom-right-corner-clr: var(--theme-zone-footer-bottom-right-corner-background-color, transparent);
    --zone-bottom-right-corner-img-opacity: var(--theme-zone-footer-bottom-right-corner-background-image-opacity, 1);
    --zone-bottom-right-corner-clr-opacity: var(--theme-zone-footer-bottom-right-corner-background-color-opacity, 1);
    --zone-bottom-right-corner-inner-glow: var(--theme-zone-footer-bottom-right-corner-inner-glow, none);
    --zone-bottom-right-corner-outer-glow: var(--theme-zone-footer-bottom-right-corner-outer-glow, none);
    --zone-bottom-right-corner-shadow: var(--theme-zone-footer-bottom-right-corner-shadow, none);
    --zone-top-border-img: var(--theme-zone-footer-top-border-background-image, none);
    --zone-top-border-clr: var(--theme-zone-footer-top-border-background-color, transparent);
    --zone-top-border-img-opacity: var(--theme-zone-footer-top-border-background-image-opacity, 1);
    --zone-top-border-clr-opacity: var(--theme-zone-footer-top-border-background-color-opacity, 1);
    --zone-top-border-inner-glow: var(--theme-zone-footer-top-border-inner-glow, none);
    --zone-top-border-outer-glow: var(--theme-zone-footer-top-border-outer-glow, none);
    --zone-top-border-shadow: var(--theme-zone-footer-top-border-shadow, none);
    --zone-right-border-img: var(--theme-zone-footer-right-border-background-image, none);
    --zone-right-border-clr: var(--theme-zone-footer-right-border-background-color, transparent);
    --zone-right-border-img-opacity: var(--theme-zone-footer-right-border-background-image-opacity, 1);
    --zone-right-border-clr-opacity: var(--theme-zone-footer-right-border-background-color-opacity, 1);
    --zone-right-border-inner-glow: var(--theme-zone-footer-right-border-inner-glow, none);
    --zone-right-border-outer-glow: var(--theme-zone-footer-right-border-outer-glow, none);
    --zone-right-border-shadow: var(--theme-zone-footer-right-border-shadow, none);
    --zone-bottom-border-img: var(--theme-zone-footer-bottom-border-background-image, none);
    --zone-bottom-border-clr: var(--theme-zone-footer-bottom-border-background-color, transparent);
    --zone-bottom-border-img-opacity: var(--theme-zone-footer-bottom-border-background-image-opacity, 1);
    --zone-bottom-border-clr-opacity: var(--theme-zone-footer-bottom-border-background-color-opacity, 1);
    --zone-bottom-border-inner-glow: var(--theme-zone-footer-bottom-border-inner-glow, none);
    --zone-bottom-border-outer-glow: var(--theme-zone-footer-bottom-border-outer-glow, none);
    --zone-bottom-border-shadow: var(--theme-zone-footer-bottom-border-shadow, none);
    --zone-left-border-img: var(--theme-zone-footer-left-border-background-image, none);
    --zone-left-border-clr: var(--theme-zone-footer-left-border-background-color, transparent);
    --zone-left-border-img-opacity: var(--theme-zone-footer-left-border-background-image-opacity, 1);
    --zone-left-border-clr-opacity: var(--theme-zone-footer-left-border-background-color-opacity, 1);
    --zone-left-border-inner-glow: var(--theme-zone-footer-left-border-inner-glow, none);
    --zone-left-border-outer-glow: var(--theme-zone-footer-left-border-outer-glow, none);
    --zone-left-border-shadow: var(--theme-zone-footer-left-border-shadow, none);
}

/**
 * Yusaso Teal — public footer presentation
 *
 * The Platform footer template owns markup. This file is the sole Teal owner
 * of public footer geometry and colors.
 */

.site_footer {
    display:flex;
    box-sizing:border-box;
    width:100%;
    height:var(--layout-footer-height);
    min-height:var(--layout-footer-height);
    padding:var(--layout-ring); /* Oct 18 2026 - #790 the footer ring band sits inside the footer */
    align-items:center;
    justify-content:center;
    overflow:clip;
    color: var(--footer-site-footer-text-color);
    background-color:color-mix(in srgb, var(--footer-site-footer-background-color) calc(var(--footer-site-footer-background-color-opacity, 1) * 100%), transparent);
    background-image:var(--footer-site-footer-background-image), var(--footer-site-footer-background-gradient);
    background-repeat: var(--footer-site-footer-background-repeat), var(--footer-site-footer-background-repeat);
    box-shadow:var(--footer-site-footer-shadow);
    border-top:var(--site-footer-border-width, 1px) solid var(--footer-site-footer-border-color);
    text-align:center;
    position:relative;
    z-index:1;
    grid-column:1/-1;
    align-self:end;
    visibility:visible;}

.site_footer > div {
    margin:0;
    padding:0;
    color:inherit;
    text-align:center;}

/* ==========================================================================
   RESPONSIVE TIERS (Oct 11 2026)
   Mobile-first hardening for every device size in the canon (see the DevTools
   preset list). Everything above this line is the normal CSS; these blocks
   only refine it for narrower or wider screens. Add new size fixes here.
   ========================================================================== */

/* 320–428px — Mobile Small + Mobile Large (iPhone SE, iPhone 16, Pixel 9 / 9 Pro / 10, Galaxy A55, Galaxy Z Fold 6 cover, Pixel 9 Pro Fold cover) */
@media (max-width: 428px) {
    .site_footer { padding-bottom: max(var(--layout-ring), env(safe-area-inset-bottom)); }
    .site_footer > div { flex-wrap: wrap; overflow-wrap: anywhere; }
}