/* ======================
   FOOTER - RESPONSIVE IMPLEMENTATION
   Mobile-first responsive design
   ====================== */

.footer{position: relative;width: 100%;background: #333f5b;color: white;font-family: 'Avenir Next', sans-serif;}

/* Decorative flap */
.flap{position: absolute;top: -1px;left: 0;right: 0;height: 32px;background: #fcf9f8;border-radius: 0 0 clamp(24px, 4vw, 40px) clamp(24px, 4vw, 40px);z-index: 1;}

/* Main footer content */
.footerContent{width: 100%;max-width: min(1680px, 100vw);margin: 0 auto;display: flex;flex-direction: column;gap: clamp(40px, 8vw, 80px);padding: 0 clamp(20px, 4vw, 120px) clamp(40px, 6vw, 60px) clamp(20px, 4vw, 120px);box-sizing: border-box;}

/* Links grid - Mobile first */
.linksGrid{display: flex;flex-direction: column;gap: 0;border-bottom: 1px solid #374462;}

/* Hero section */
.footer-hero-section{display: flex;flex-direction: column;align-items: flex-start;gap: clamp(32px, 4vw, 24px);padding: clamp(60px, 6vw, 40px) 0 clamp(32px, 6vw, 40px);border-bottom: 1px solid #374462;}
.heroHeading{font-family: 'P22 Mackinac Pro', serif;font-size: 35px;font-weight: 500;line-height: 1.1;letter-spacing: -0.02em;margin: 0;max-width: 100%;}
.downloadButton{display: inline-flex;align-items: center;gap: 12px;background: #3495ff;color: white;border: none;border-radius: 15px;padding: 12px 24px;font-size: 14px;font-weight: 500;cursor: pointer;transition: all 0.3s ease;text-decoration: none;white-space: nowrap;}
.downloadButton:hover{background: #2980e9;transform: translateY(-1px);}
.arrowIcon{width: 16px;height: 16px;filter: brightness(0) saturate(100%) invert(100%);}

/* Mobile: Resources and Social links in same row */
.linkRow{display: grid;grid-template-columns: 1fr 1fr;gap: 0;border-bottom: 1px solid #374462;}
.linkColumn{display: flex;flex-direction: column;gap: clamp(12px, 3vw, 16px);padding: clamp(32px, 6vw, 40px) 15px;}
.linkRow .linkColumn:first-child{border-right: 1px solid #374462;padding-left: 0;}
.linkRow .linkColumn.socialLinksColumn{padding-right: 0;}

/* Removed text-align: right; from here */

/* Contact section - full width */
.contactColumn{display: flex;flex-direction: column;gap: clamp(12px, 3vw, 16px);padding: clamp(32px, 6vw, 40px) 0;}
.columnTitle{font-family: 'P22 Mackinac Pro';font-size: clamp(20px, 3vw, 18px);font-weight: 600;margin: 0 0 8px 0;color: rgba(255, 255, 255, 0.9);letter-spacing: initial;}
.linkList{list-style: none;padding: 0;margin: 0;display: flex;flex-direction: column;gap: 8px;}
.link{color: rgba(255, 255, 255, 0.8);text-decoration: none;font-size: 14px;font-family: 'PP Neue Montreal';font-weight: 500;transition: color 0.3s ease;}
.link:hover{color: #3495ff;}
.contactInfo{display: flex;flex-direction: column;gap: 20px;font-family: 'PP Neue Montreal';font-weight: 500;}
.contactLink{background: none;border: none;padding: 0;margin: 0;font-family: inherit;font-size: inherit;color: inherit;cursor: pointer;display: inline;text-decoration: none;text-align: left;line-height: inherit;transition: color 0.2s ease;font-weight: 400;}
.contactLink:hover {color: #3495ff;}
.contactLink:focus {outline: 1px dotted;outline-offset: 2px;}

/* Brand section */
.brandSection{text-align: center;padding: clamp(40px, 8vw, 0) 0 clamp(20px, 4vw, 0);}
.brandName{font-family: 'P22 Mackinac Pro', serif;font-size: clamp(9vw, 9vw, 170px);font-weight: 500;padding: 0;letter-spacing: -0.02em;margin: 0;background: linear-gradient(180deg, #bec6da, #333f5b);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;opacity: 1;}
.heroButtonGroup{display: flex;gap: 16px;flex-wrap: wrap;}
.heroButtonGroup .primary.button.btnDisabled{display: flex;align-items: center;justify-content: center;box-sizing: border-box;background-color: transparent;color: #fff;font-family: 'PP Neue Montreal', sans-serif;font-weight: 500;letter-spacing: -0.01em;line-height: 150%;gap: 10px;z-index: 3;height: clamp(56px, 1.5vw + 52px, 64px);padding: 0;margin-right: 20px;font-family: var(--font-p22-mackinac-pro);border-radius: clamp(20px, 1vw + 12px, 24px);font-size: clamp(16px, 0.4vw + 14px, 23px);}
.heroButtonGroup .primary.button.btnDisabled:hover{background-color: transparent;}
.bigooglePlayIcon{width: 64px;height: 64px;flex-shrink: 0;}
.bigooglePlayIcon:hover{cursor: pointer;}

@media (max-width: 640px) {
  .heroButtonGroup{gap: 10px;}
  .bigooglePlayIcon{width: 55px;height: 55px;}
}

/* Bottom section */
.bottomSection{display: flex;flex-direction: column;gap: 32px;font-size: 15px;padding: 32px 0;border-top: 1px solid #374462;}
.copyright{font-size: 15px;color: rgba(255, 255, 255, 0.7);}
.legalLinks{display: flex;flex-direction: row;gap: 0;align-items: center;justify-content: space-between;list-style: none;}
.legalLink{color: rgba(255, 255, 255, 0.7);text-decoration: none;font-size: 15px;transition: color 0.3s ease;}
.legalLink:hover{color: #3495ff;}

/* Desktop styles */
@media (min-width: 1024px) {
  .linksGrid{display: grid;grid-template-columns: 2fr 1fr 1fr 1fr;gap: 0;align-items: flex-start;margin-top: 1%;border-bottom: 1px solid #374462;position: relative;}
  .footer-hero-section{padding: 90px 40px 80px 0;border: none;gap: clamp(80px, 4vw, 24px);background: #333f5b;position: relative;}
  .footer-hero-section::after{content: '';position: absolute;top: 0;right: 0;width: 1px;background: #333f5b;}
  .heroHeading{font-size: clamp(32px, 4vw, 48px);max-width: 400px;}
  .linkRow{display: contents;}
  .linkColumn{padding: 92px 40px !important;text-align: left;background: #333f5b;position: relative;}
  .linkRow .linkColumn:first-child{border-right: 1px solid #374462;border-left: 1px solid #374462;height: 100%;}
  .linkColumn:first-child::after{content: '';position: absolute;top: 0;right: 0;width: 0.5px;background: #333f5b;}
  .linkColumn:nth-child(2)::after{content: '';position: absolute;top: 0;right: 0;width: 1px;background: #333f5b;}
  .contactColumn{padding: 92px 40px;border: none;background: #333f5b;border-left: 1px solid #374462;height: 100%;box-sizing: border-box;}
  .columnTitle{font-size: 18px;}
  .link, .contactLink{font-size: 15px;}
  .bottomSection{flex-direction: row;justify-content: space-between;align-items: center;padding: 32px 0;}
  .legalLinks{justify-content: flex-end;gap: 48px;}
}


/* Ultra-large desktop styles (1921px+) */
@media (min-width: 1921px) {
  .footerContent{max-width: 1680px;}
  .heroHeading{font-size: 40px;}
  .brandName{padding: 0;}
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
  .downloadButton, .link, .contactLink, .legalLink{transition: none;}
  .downloadButton:hover{transform: none;}
}

/* Disabled Button CSS */
.btnDisabled {cursor: not-allowed;pointer-events: none;}