/* =========================
   FOUNDATIONS
========================= */

@import url("./foundations/layout.css");
@import url("./foundations/spacing.css");
@import url("./foundations/typography.css");
@import url("./foundations/radius.css");
@import url("./foundations/border.css");

/* =========================
   LAYOUT
========================= */

@import url("./layout/columns.css");
@import url("./layout/concrete-layout.css");
@import url("./layout/tablet-stack.css");

/* =========================
   UTILITIES
========================= */

@import url("./utilities/alignment.css");
@import url("./utilities/padding.css");
@import url("./utilities/image-ratio.css");
@import url("./utilities/overlap.css");
@import url("./utilities/concrete.css");

/* =========================
   SEMANTIC
========================= */

@import url("./semantic/section-padding.css");
@import url("./semantic/content-width.css");
@import url("./semantic/stack-spacing.css");
@import url("./semantic/surfaces.css");
@import url("./semantic/z-index.css");
@import url("./semantic/logo.css");
@import url("./semantic/icon.css");

/* =========================
   PRIMITIVES
========================= */
@import url("./primitives/stats.css");
@import url("./primitives/dots.css?v=20260830-2");
@import url("./primitives/social-links.css");
@import url("./primitives/footer.css");
@import url("./primitives/logo-slider.css");
@import url("./primitives/hero.css");
@import url("./primitives/button.css?v=20260830-2");
@import url("./primitives/video-height.css");
@import url("./primitives/hero-title.css");
@import url("./primitives/titlebar.css");
@import url("./primitives/testimonial-card.css");
@import url("./primitives/testimonials-slider.css");
@import url("./primitives/feature-card.css");
@import url("./primitives/modals.css");
@import url("./primitives/navigation.css");

/* =========================
   PRESETS
========================= */

@import url("./presets.css");

/* =========================
   CLIENT LAYER
========================= */

@import url("./client.css");

/* =========================
   GLOBAL
========================= */

@import url("./global.css");

/* Shared compact phone footer — homepage and article use identical rules. */
@media(max-width:767px) {
 /* Fluid phone grid prevents the fixed 440px design canvas overflowing smaller devices. */
 .container { width:calc(100% - 32px); max-width:var(--container-mobile,440px); }
 .site-main > .give-bar { padding-top:12px !important; padding-bottom:12px !important; }
 .site-main > .give-bar > .container { width:calc(100% - 32px) !important; max-width:var(--container-mobile,440px) !important; margin-inline:auto !important; }
 .site-main > .give-bar .row:has(.give-bar-content) { row-gap:10px !important; --give-bar-button-row-height:44px; --give-bar-dots-bottom:0px; }
 .site-main > .give-bar .give-bar-content > .page-title { width:100% !important; min-width:0 !important; max-width:100% !important; font-size:clamp(10px,3.25vw,14px) !important; line-height:1.25 !important; letter-spacing:-.3px !important; white-space:nowrap !important; text-align:center !important; }
 .site-main > .give-bar .give-bar-content > .dots-fill { height:44px !important; bottom:0 !important; justify-content:space-between !important; gap:0 !important; }
 .site-main > .give-bar .give-bar-content > .dots-fill > .dot { flex:0 0 6px !important; width:6px !important; min-width:6px !important; max-width:6px !important; height:6px !important; min-height:6px !important; max-height:6px !important; }
 .site-main > .give-bar .row:has(.give-bar-content) > .col-sm-4 { min-height:44px !important; }
 .site-main > .give-bar .row:has(.give-bar-content) > .col-sm-4 .btn { width:auto !important; min-width:0 !important; max-width:calc(100% - 96px) !important; height:44px !important; min-height:44px !important; padding:0 16px !important; font-size:11px !important; line-height:1 !important; gap:8px !important; }
 .site-main > .give-bar .row:has(.give-bar-content) > .col-sm-4 .btn i { font-size:14px !important; }
}

/* Site-wide iPhone viewport edge: same treatment verified by Owner on Journey. */
@media(max-width:767px){body::after{content:"";position:fixed;top:100%;left:0;right:0;height:100lvh;background:#fff;z-index:101;pointer-events:none}}

/* Responsive homepage hero: centered composition and phone-safe type. */
@media(max-width:767px){
 .coop-home-page .hero > .container{width:100%!important;min-width:0!important;max-width:430px!important;margin-inline:auto!important;padding-inline:24px!important}
 .coop-home-page .hero .hero-heading{text-align:center!important;min-width:0!important;max-width:100%!important}
 .coop-home-page .hero .hero-heading > .page-title{font-size:clamp(28px,8.8vw,38px)!important;line-height:1.05!important;white-space:normal!important;overflow-wrap:normal;text-align:center!important}
 .coop-home-page .hero .content-intro,.coop-home-page .hero .content-intro p{font-size:clamp(15px,4vw,17px)!important;line-height:1.5!important;text-align:center!important;text-wrap:balance;max-width:100%!important;white-space:normal!important}
 .coop-home-page .hero .hero-cutout{width:1290px!important;left:50%!important;right:auto!important;transform:translateX(calc(-50% + 122px))!important}
}
