/*
Theme Name: Lomas Altas Community Center
Theme URI: https://lomasaltascc.org/
Description: A Twenty Twenty-Five child block theme for Lomas Altas Community Center.
Author: Lomas Altas Community Center
Template: twentytwentyfive
Version: 0.3.0
Text Domain: lomas-altas-community-center
*/

:root {
  --lac-ink: #111815;
  --lac-deep-green: #123a2e;
  --lac-green: #95b943;
  --lac-gold: #f0ca28;
  --lac-cream: #f7f5ee;
  --lac-white: #ffffff;
  --lac-muted: #5f6a65;
  --lac-border: rgba(17,24,21,.13);
  --lac-radius: 10px;
  --lac-shadow: 0 10px 30px rgba(18,58,46,.08);
}

html { scroll-behavior: smooth; }
body { color: var(--lac-ink); font-size: 16px; }


.lac-site-header {
  background: #fff;
  border-bottom: 1px solid rgba(17,24,21,.06);
  position: relative;
  z-index: 20;
  padding-block: 0 !important;
}
.lac-header-inner {
  min-height: 72px;
  gap: 22px;
  width: min(100%, 1280px) !important;
  max-width: 1280px !important;
  padding: 0 34px;
  box-sizing: border-box;
}
.lac-logo-link {
  display:block;
  width: 132px;
  height: 72px;
  flex: 0 0 132px;
  background-image: url('assets/images/lomas-altas-logo.png');
  background-repeat:no-repeat;
  background-position:left center;
  background-size:contain;
}
.lac-site-header .wp-block-group:has(.wp-block-navigation) {
  gap: 22px;
}
.lac-site-header .wp-block-navigation {
  font-size: 16px;
}
.lac-site-header .wp-block-navigation__container {
  gap: 24px;
}
.lac-site-header .wp-block-navigation-item__content {
  text-decoration:none;
  font-weight: 650;
}
.lac-site-header .wp-block-navigation-item__content:hover { color: var(--lac-green); }
.lac-nav-support .wp-block-button__link,
.lac-primary-button .wp-block-button__link {
  background: var(--lac-gold);
  color: var(--lac-ink);
  font-weight: 800;
  border-radius: 7px;
  padding: .72rem 1.05rem;
  font-size: .94rem;
}
.lac-secondary-button .wp-block-button__link {
  background: transparent;
  color: inherit;
  border: 2px solid currentColor;
  font-weight: 800;
  border-radius: 7px;
  padding: .62rem 1rem;
  font-size: .94rem;
}

.lac-hero {
  min-height: 410px;
  display:flex;
  align-items:center;
  background-color: #10362b;
  background-image:
    linear-gradient(90deg,
      rgba(10,48,37,.70) 0%,
      rgba(10,48,37,.58) 18%,
      rgba(10,48,37,.34) 29%,
      rgba(10,48,37,.10) 37%,
      rgba(10,48,37,0) 46%),
    url('assets/images/hero-girl.jpg');
  background-repeat:no-repeat;
  background-position:center, 68% 38%;
  background-size:cover, auto 158%;
  color:#fff;
}
.lac-hero-inner {
  width: min(100%, 1280px) !important;
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 40px 46px;
  box-sizing: border-box;
}
.lac-hero-copy {
  max-width: 470px;
  margin-left: 0 !important;
  margin-right: auto !important;
}
.lac-hero h1 {
  font-size: clamp(2.5rem, 4.1vw, 3.7rem);
  line-height: 1.01;
  letter-spacing: -.038em;
  max-width: 480px;
  margin-bottom: 18px;
}
.lac-hero p {
  font-size: clamp(.98rem, 1.35vw, 1.1rem);
  line-height:1.5;
  max-width: 470px;
  margin-bottom: 20px;
}
.lac-hero .wp-block-buttons { gap: 14px; }
.lac-hero .lac-secondary-button .wp-block-button__link { color:#fff; border-color:rgba(255,255,255,.9); }

.lac-section { padding-top: 58px; padding-bottom: 58px; }
.lac-section-tight { padding-top: 46px; padding-bottom: 46px; }
.lac-section-heading {
  font-size: clamp(1.8rem, 3vw, 2.55rem);
  line-height:1.08;
  letter-spacing:-.025em;
  margin-bottom: .55rem;
}
.lac-section-intro { max-width: 720px; color: var(--lac-muted); font-size:1rem; }
.lac-centered { text-align:center; margin-left:auto; margin-right:auto; }

.lac-program-grid { margin-top: 30px; gap: 22px; }
.lac-program-card { height: 100%; }
.lac-program-image,
.lac-naara-photo,
.lac-casa-photo {
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
  border-radius: var(--lac-radius);
}
.lac-program-image { min-height: 170px; margin-bottom: 14px; }
.lac-education { background-image:url('assets/images/education.jpg'); }
.lac-practical { background-image:url('assets/images/practical-skills.jpg'); }
.lac-children { background-image:url('assets/images/children-families.jpg'); }
.lac-community { background-image:url('assets/images/community.jpg'); }
.lac-program-card h3 { font-size:1.16rem; margin-bottom:.35rem; }
.lac-program-card p { color: var(--lac-muted); line-height:1.5; font-size:.95rem; }

.lac-story-band { background: linear-gradient(120deg,#eff6f0,#f9f8f3); }
.lac-story-columns, .lac-partnership-columns { gap:0; }
.lac-naara-photo { min-height: 390px; border-radius:0; background-image:url('assets/images/naara-manuel.jpg'); }
.lac-story-copy { padding: clamp(34px, 5vw, 58px); }
.lac-story-copy p { line-height:1.62; }
.lac-quote {
  border-left: 3px solid var(--lac-green);
  padding-left: 20px;
  font-style:italic;
  color:#39423d;
}

.lac-partnership { background:#fff; }
.lac-partnership-copy { padding: clamp(34px, 5vw, 56px); }
.lac-casa-photo { min-height: 330px; border-radius:0; background-image:url('assets/images/casa-de-los-angeles.jpg'); }

.lac-stories { background: var(--lac-cream); }
.lac-stories-head { margin-bottom:26px; }
.lac-story-card {
  background:#fff;
  border:1px solid var(--lac-border);
  border-radius:var(--lac-radius);
  overflow:hidden;
  box-shadow:var(--lac-shadow);
  height:100%;
}
.lac-story-card .wp-block-post-featured-image { margin:0; aspect-ratio: 16/9; overflow:hidden; }
.lac-story-card .wp-block-post-featured-image img { width:100%; height:100%; object-fit:cover; }
.lac-story-card-body { padding: 18px; }
.lac-story-card .wp-block-post-title { font-size:1.08rem; line-height:1.25; }
.lac-story-card .wp-block-post-title a { text-decoration:none; }
.lac-story-card .wp-block-post-date { font-size:.82rem; color:var(--lac-muted); }
.lac-story-card .wp-block-post-excerpt { color:var(--lac-muted); font-size:.94rem; }

.lac-support-cta {
  background: linear-gradient(120deg,#d8eef7,#eff7e8);
  text-align:center;
  padding-top:52px;
  padding-bottom:52px;
}
.lac-support-cta p { max-width: 760px; margin-left:auto; margin-right:auto; }

.lac-site-footer {
  background: var(--lac-deep-green);
  color:#fff;
  padding-top:44px;
  padding-bottom:32px;
}
.lac-site-footer a { color:#fff; }
.lac-footer-logo {
  width: 160px;
  height: 92px;
  background-image:url('assets/images/lomas-altas-logo.png');
  background-repeat:no-repeat;
  background-position:left center;
  background-size:contain;
  filter: brightness(0) invert(1);
  opacity:.98;
}
.lac-site-footer p { color:rgba(255,255,255,.82); font-size:.94rem; }
.lac-footer-note { border-left:1px solid rgba(255,255,255,.35); padding-left:22px; }

@media (max-width: 980px) {
  .lac-header-inner { padding: 0 24px; }
  .lac-logo-link { width: 118px; height: 68px; flex-basis:118px; }
  .lac-site-header .wp-block-navigation__container { gap: 16px; }
  .lac-hero {
    min-height: 420px;
    background-size:cover, auto 148%;
    background-position:center, 73% 36%;
  }
  .lac-hero-inner { padding: 38px 28px; }
  .lac-hero-copy { max-width: 45%; }
  .lac-hero h1 { font-size: clamp(2.2rem, 5vw, 3.2rem); }
  .lac-program-grid { flex-wrap:wrap !important; }
  .lac-program-grid > .wp-block-column { flex-basis:calc(50% - 11px) !important; }
}

@media (max-width: 760px) {
  .lac-header-inner { min-height:68px; padding:0 18px; }
  .lac-logo-link { width: 112px; height:64px; flex-basis:112px; }
  .lac-nav-support { display:none; }
  .lac-hero {
    min-height: 585px;
    align-items:flex-end;
    background-image:
      linear-gradient(0deg, rgba(10,48,37,.80) 0%, rgba(10,48,37,.60) 28%, rgba(10,48,37,.10) 56%, rgba(10,48,37,0) 70%),
      url('assets/images/hero-girl.jpg');
    background-size:cover, auto 95%;
    background-position:center, 62% top;
  }
  .lac-hero-inner { padding: 30px 18px 34px; }
  .lac-hero-copy { max-width:100%; }
  .lac-hero h1 { font-size: 2.35rem; max-width: 420px; }
  .lac-hero p { font-size:1.03rem; }
  .lac-program-grid > .wp-block-column { flex-basis:100% !important; }
  .lac-story-columns, .lac-partnership-columns { display:block !important; }
  .lac-naara-photo, .lac-casa-photo { min-height:300px; }
  .lac-section { padding-top:46px; padding-bottom:46px; }
  .lac-footer-note { border-left:0; padding-left:0; }
}