/* CWPD enhancement layer — loaded AFTER parks-theme.css.
   CNN-style font, bigger menu, motion, hover/mouse effects, extra glass, mobile polish. */

/* ---- 1. CNN-style font (self-hosted Libre Franklin) + larger, cleaner sizing ---- */
:root{
  --sans:'Libre Franklin',Inter,Arial,Helvetica,sans-serif;
}
body{font-size:17.5px;letter-spacing:-.005em;line-height:1.55;}
/* Regular reading size across body copy, CNN-like */
.hero-intro p,.program-copy p,.news-copy p,.event-meta strong,.foundation-copy p,.parks-intro p,.nature-quote blockquote,.section-heading p,.orbit-card p,.footer-nav a,.footer-contact address{font-size:16.5px;}
.program-copy p,.news-copy p,.foundation-copy p{line-height:1.5;}
.news-copy p{font-size:16px;}
.primary-nav{font-size:16.5px;font-weight:600;letter-spacing:-.01em;gap:clamp(20px,2.2vw,34px);}
.primary-nav a{padding:14px 0;}
.button,.header-find,.text-link{font-family:var(--sans);font-weight:700;letter-spacing:-.01em;}
.eyebrow,.date-badge small{letter-spacing:.14em;}
p,.program-copy,.news-copy p,.event-meta{font-family:var(--sans);}

/* ---- 2. Entrance motion (JS adds .is-in) ---- */
@media (prefers-reduced-motion:no-preference){
  .reveal-up{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease);}
  .reveal-up.is-in{opacity:1;transform:none;}
  .section-heading,.program-card,.park-card,.event-item,.news-card,.orbit-card,.foundation-copy,.foundation-values>div,.closing-copy{will-change:opacity,transform;}
}

/* ---- 3. Hover / pointer effects ---- */
.program-card,.news-card,.event-item,.park-card,.orbit-card{transition:transform .3s var(--ease),box-shadow .3s var(--ease);}
.program-card:hover,.news-card:hover{transform:translateY(-6px);box-shadow:0 26px 46px -26px rgb(20 51 35 / .32);}
.event-item:hover{transform:translateY(-3px);}
.park-card:hover{transform:translateY(-5px) scale(1.02);}
.orbit-card{transition:transform .3s var(--ease),box-shadow .3s var(--ease);}
.orbit-card:hover{transform:translateY(-4px) scale(1.05);box-shadow:0 22px 40px -22px rgb(20 51 35 / .4);}
.orbit-card:hover .orbit-arrow{transform:translateX(3px);}
.orbit-arrow{transition:transform .25s var(--ease);}
.button{transition:transform .22s var(--ease),box-shadow .22s var(--ease),background .22s;}
.button:hover{transform:translateY(-2px);box-shadow:0 14px 26px -12px rgb(20 51 35 / .45);}
.button:active{transform:translateY(0);}
.button .icon{transition:transform .22s var(--ease);}
.button:hover .icon{transform:translateX(4px);}
.round-arrow,.read-more,.text-link .icon{transition:transform .22s var(--ease);}
.text-link:hover .icon{transform:translateX(4px);}
.program-image img,.news-image img,.park-card img{transition:transform .6s var(--ease);}
.program-card:hover .program-image img,.news-card:hover .news-image img{transform:scale(1.05);}

/* Pointer-reactive hero: JS sets --mx/--my (-1..1) on .hero */
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .hero .woodland{transition:transform .5s var(--ease);transform:translate(calc(var(--mx,0)*10px),calc(var(--my,0)*6px));}
  .hero .hero-leaves{transition:transform .5s var(--ease);transform:translate(calc(var(--mx,0)*-16px),calc(var(--my,0)*-10px));}
  .hero .orbits{transition:transform .6s var(--ease);transform:translate(calc(var(--mx,0)*8px),calc(var(--my,0)*8px));}
  .hero-photo{transition:transform .5s var(--ease);transform:translate(calc(var(--mx,0)*-6px),calc(var(--my,0)*-6px));}
}

/* ---- 4. Extra glassmorphism on selected sections ---- */
.program-card,.news-card{
  background:linear-gradient(158deg,#ffffffa8,#eef4e87a);
  -webkit-backdrop-filter:blur(16px) saturate(1.15);backdrop-filter:blur(16px) saturate(1.15);
  border:1px solid #ffffff9c;border-radius:22px;
  box-shadow:0 20px 44px -26px rgb(20 51 35 / .28),inset 0 1px 0 #ffffffcc;
}
.orbit-card{
  -webkit-backdrop-filter:blur(14px) saturate(1.1);backdrop-filter:blur(14px) saturate(1.1);
  box-shadow:0 16px 34px -20px rgb(20 51 35 / .3),inset 0 1px 0 #ffffffb0;
}
.events-row .event-item{
  background:linear-gradient(158deg,#ffffff8c,#eef4e85c);
  -webkit-backdrop-filter:blur(12px) saturate(1.1);backdrop-filter:blur(12px) saturate(1.1);
  border:1px solid #ffffff85;border-radius:16px;padding:14px 16px;
  box-shadow:inset 0 1px 0 #ffffffbb;
}
.nature-quote,.sunset-note{
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
}
.site-header{
  -webkit-backdrop-filter:blur(16px) saturate(1.2);backdrop-filter:blur(16px) saturate(1.2);
  background:linear-gradient(180deg,#fcfaf4f0,#fcfaf4d8);
}

/* ---- 5. Logo: keep it crisp and readable in the header ---- */
.site-header .brand img{height:44px;width:auto;object-fit:contain;}
.footer-brand img{height:40px;width:auto;}

/* ---- 6. Mobile polish ---- */
@media (max-width:640px){
  body{font-size:15.5px;}
  .primary-nav{font-size:18px;}
  .program-card,.news-card{border-radius:18px;}
  .events-row .event-item{width:100%;}
}

/* ---- 7. Font-size bumps (Prince) ---- */
.parks-intro p{font-size:clamp(17px,1.35vw,21px);line-height:1.5;}
.park-card h3{font-size:clamp(16px,1.15vw,19px);font-weight:600;letter-spacing:-.01em;}
.programs-section .section-heading p,.events-section .section-heading p,.news-section .section-heading p{font-size:16px;}

/* ---- 8. Narrower container to match Alexander's Construction (not too wide) ---- */
:root{--container:1280px;}