/* LittleOtters custom palette and helpers */
:root{
  --lo-primary:#dc6755;
  --lo-secondary:#edaa52;
  --lo-tertiary:#eeb3a9;
  --lo-accent:#8aa6b2;
  --lo-primary-strong:#c95442;
  --lo-secondary-soft:#f7e4c5;
  --lo-surface:#fffaf5;
  --lo-text:#2d2a26;
  --lo-gradient:linear-gradient(90deg,var(--lo-primary),var(--lo-secondary),var(--lo-tertiary),var(--lo-accent));
}
.brand-logo{
  background:var(--lo-gradient);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
}

/* small helper for date badges or accents */
.lo-badge{background:var(--lo-primary);color:#fff;padding:.25rem .5rem;border-radius:9999px;font-weight:600}

body{
  background:linear-gradient(180deg,var(--lo-surface) 0%,#fff 30%);
  color:var(--lo-text);
}

a{
  transition:color .2s ease, background-color .2s ease, border-color .2s ease;
}

/* Map existing utility classes to Little Otters palette */
.bg-blue-600,
.bg-green-600,
.bg-purple-600,
.bg-indigo-600{
  background-color:var(--lo-primary) !important;
}

.hover\:bg-blue-700:hover,
.hover\:bg-green-700:hover,
.hover\:bg-purple-700:hover,
.hover\:bg-indigo-700:hover,
.hover\:bg-gray-900:hover{
  background-color:var(--lo-primary-strong) !important;
}

.text-blue-600,
.text-green-600,
.text-purple-600,
.text-indigo-600{
  color:var(--lo-primary) !important;
}

.hover\:text-blue-600:hover,
.hover\:text-green-600:hover,
.hover\:text-purple-600:hover,
.hover\:text-white:hover{
  color:var(--lo-primary) !important;
}

.border-blue-600,
.border-green-600,
.border-purple-600,
.focus\:ring-blue-600:focus,
.focus\:ring-inset:focus{
  border-color:var(--lo-primary) !important;
}

.bg-blue-50,
.bg-green-50,
.bg-purple-50,
.hover\:bg-blue-50:hover,
.hover\:bg-green-50:hover,
.hover\:bg-purple-50:hover{
  background-color:var(--lo-secondary-soft) !important;
}

.from-blue-600,
.from-green-600,
.from-purple-600{
  --tw-gradient-from:var(--lo-primary) !important;
  --tw-gradient-to:rgb(220 103 85 / 0) !important;
  --tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to) !important;
}

.to-purple-600,
.to-teal-600,
.to-blue-600{
  --tw-gradient-to:var(--lo-accent) !important;
}

nav.bg-white{
  background:linear-gradient(180deg,#ffffff 0%,#fff7f1 100%);
}

/* Primary conversion action for playschool websites */
.ml-10 a[href="./contact.html"]{
  background:var(--lo-primary);
  color:#fff !important;
  border-radius:999px;
  padding:.52rem 1rem !important;
  border:1px solid rgba(0,0,0,.02);
  box-shadow:0 8px 16px rgba(75, 41, 22, .14);
}

.ml-10 a[href="./contact.html"]:hover{
  background:var(--lo-primary-strong);
  color:#fff !important;
}

footer.bg-gray-900{
  background:linear-gradient(135deg,#3d3a36 0%,#2d2a26 100%);
}

.rounded-xl,
.rounded-lg{
  border-radius:14px;
}

.shadow-lg,
.shadow-sm{
  box-shadow:0 10px 26px rgba(74, 46, 30, .10) !important;
}

/* Make the Little Otters logo look crisp and polished across pages */
nav img[src*="LittleOtterLogo.jpeg"]{
  height:2.65rem !important;
  width:auto !important;
  object-fit:contain;
  padding:.2rem;
  border-radius:12px;
  background:#fff;
  border:1px solid rgba(220, 103, 85, .18);
  box-shadow:0 8px 18px rgba(42, 31, 22, .14);
}

@media (min-width: 768px){
  nav img[src*="LittleOtterLogo.jpeg"]{
    height:3rem !important;
  }
}

.lo-events-wrap{
  background:linear-gradient(120deg, #fff3e8 0%, #fff9f3 50%, #f2f8fb 100%);
  border-top:1px solid rgba(220, 103, 85, .15);
  border-bottom:1px solid rgba(138, 166, 178, .28);
  padding:1rem 0 1.15rem;
}

.lo-events-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:1rem;
  margin-bottom:.8rem;
}

.lo-events-kicker{
  margin:0 0 .2rem;
  font-size:.72rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--lo-primary);
  font-weight:700;
}

.lo-events-title{
  margin:0;
  font-size:1.1rem;
  line-height:1.25;
  color:#2f2a25;
  font-weight:800;
}

.lo-events-cta{
  background:var(--lo-primary);
  color:#fff;
  padding:.56rem .9rem;
  border-radius:999px;
  font-size:.82rem;
  font-weight:700;
  text-decoration:none;
  white-space:nowrap;
}

.lo-events-actions{
  display:flex;
  gap:.55rem;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.lo-events-toggle{
  border:1px solid rgba(143, 61, 49, .35);
  background:#fff;
  color:#7a3329;
  border-radius:999px;
  padding:.56rem .9rem;
  font-size:.82rem;
  font-weight:700;
  cursor:pointer;
}

.lo-events-toggle:hover{
  background:#ffe9d8;
}

.lo-events-cta-ghost{
  background:#fffdf9;
  color:#8f3d31;
  border:1px solid rgba(220, 103, 85, .35);
}

.lo-events-cta:hover{
  background:var(--lo-primary-strong);
  color:#fff !important;
}

.lo-events-cta-ghost:hover{
  background:#ffe7d3;
  color:#7a3329 !important;
}

.lo-events-row{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.8rem;
}

.lo-events-row.is-hidden{
  display:none !important;
}

.lo-event-card{
  background:#fff;
  border:1px solid rgba(220, 103, 85, .12);
  border-radius:14px;
  padding:.8rem .85rem;
  box-shadow:0 7px 16px rgba(65, 44, 28, .08);
}

.lo-event-date{
  display:inline-block;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--lo-primary);
  background:var(--lo-secondary-soft);
  border-radius:999px;
  padding:.2rem .5rem;
  margin-bottom:.42rem;
}

.lo-event-card h3{
  margin:0 0 .35rem;
  font-size:.95rem;
  line-height:1.25;
  color:#2f2a25;
  font-weight:800;
}

.lo-event-card p{
  margin:0;
  color:#4b443e;
  font-size:.83rem;
  line-height:1.36;
}

.lo-event-meta{
  display:block;
  margin-top:.48rem;
  font-size:.74rem;
  color:#7a6f64;
  font-weight:600;
}

@media (max-width: 1024px){
  .lo-events-row{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 640px){
  .lo-events-head{
    align-items:flex-start;
    flex-direction:column;
  }

  .lo-events-actions{
    justify-content:flex-start;
  }

  .lo-events-row{
    display:flex;
    overflow-x:auto;
    gap:.7rem;
    padding-bottom:.2rem;
    scroll-snap-type:x mandatory;
  }

  .lo-event-card{
    min-width:86%;
    scroll-snap-align:start;
  }
}

.lo-parent-card{
  border:1px solid rgba(138, 166, 178, .25);
}

.lo-parent-image{
  width:100%;
  display:block;
  border-radius:12px;
  border:1px solid rgba(220, 103, 85, .18);
  box-shadow:0 10px 24px rgba(67, 46, 30, .10);
}

.lo-parent-caption{
  margin:.8rem 0 .1rem;
  color:#544b43;
  font-size:.92rem;
  line-height:1.45;
}

/* Modern playschool redesign inspired by top-performing childcare websites */
@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@600;700;800&family=Nunito:wght@400;600;700;800&display=swap');

body{
  font-family:'Nunito', 'Segoe UI', sans-serif;
  color:#2f2a25;
  background:
    radial-gradient(circle at 10% 10%, rgba(238, 179, 169, .22), transparent 35%),
    radial-gradient(circle at 90% 0%, rgba(138, 166, 178, .20), transparent 30%),
    linear-gradient(180deg, #fffaf5 0%, #fff 38%);
}

h1,
h2,
h3,
h4,
.text-4xl,
.text-5xl,
.text-6xl{
  font-family:'Baloo 2', 'Trebuchet MS', cursive;
  letter-spacing:.01em;
}

main section{
  position:relative;
}

/* Navigation refinement */
nav.bg-white{
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(220, 103, 85, .10);
}

.ml-10 a{
  border-radius:999px;
  padding:.5rem .95rem !important;
}

.ml-10 a:hover{
  background:rgba(237, 170, 82, .16);
}

/* Hero and CTA buttons */
a.inline-block.bg-blue-600,
.lo-events-cta{
  background:linear-gradient(135deg, var(--lo-primary) 0%, #e77c6c 100%) !important;
  border:1px solid rgba(220, 103, 85, .35);
  box-shadow:0 10px 24px rgba(83, 39, 17, .22);
}

a.inline-block.bg-blue-600:hover,
.lo-events-cta:hover{
  transform:translateY(-1px);
  box-shadow:0 14px 28px rgba(83, 39, 17, .26);
}

a.inline-block.border-2,
.lo-events-cta-ghost{
  border-color:rgba(220, 103, 85, .45) !important;
  color:#8f3d31 !important;
  background:#fffdf9;
}

a.inline-block.border-2:hover,
.lo-events-cta-ghost:hover{
  background:#fff0e5 !important;
}

/* Feature and stat card system */
.grid .bg-white.rounded-xl,
.grid .bg-white.rounded-xl.border,
.lo-event-card,
.lo-parent-card{
  border:1px solid rgba(220, 103, 85, .12);
  background:linear-gradient(180deg, #fff 0%, #fffaf7 100%);
}

.grid .bg-white.rounded-xl:hover,
.lo-event-card:hover,
.lo-parent-card:hover{
  transform:translateY(-4px);
  transition:transform .22s ease, box-shadow .22s ease;
  box-shadow:0 16px 30px rgba(74, 46, 30, .15) !important;
}

/* Events strip tuned for quick scanning */
.lo-events-wrap{
  padding:1.2rem 0 1.3rem;
  background:
    linear-gradient(120deg, #fff2e6 0%, #fff9f2 48%, #eef7fb 100%),
    repeating-linear-gradient(90deg, transparent 0 22px, rgba(220, 103, 85, .04) 22px 23px);
}

.lo-events-title{
  font-size:1.2rem;
}

.lo-event-date{
  letter-spacing:.11em;
}

/* Location and contact highlight blocks */
.bg-blue-50.rounded-xl,
.bg-gray-50.rounded-xl,
.bg-gray-50.py-16{
  background:linear-gradient(180deg, #fff7ef 0%, #fffdf8 100%) !important;
}

/* Footer polish */
footer.bg-gray-900{
  background:
    radial-gradient(circle at 0% 0%, rgba(237, 170, 82, .14), transparent 35%),
    linear-gradient(135deg, #3d3a36 0%, #2d2a26 100%);
}

footer a:hover{
  color:#ffd8ad !important;
}

/* Sticky mobile CTA animation */
.lo-sticky-cta{
  animation:loPulse 2.2s ease-in-out infinite;
}

@keyframes loPulse{
  0%, 100%{ box-shadow:0 14px 28px rgba(58, 33, 18, .30); }
  50%{ box-shadow:0 18px 34px rgba(58, 33, 18, .42); }
}

/* Mobile readability and spacing */
@media (max-width: 768px){
  .text-4xl,
  .text-5xl,
  .text-6xl{
    line-height:1.12;
  }

  .max-w-7xl,
  .max-w-6xl,
  .max-w-4xl{
    padding-left:1rem;
    padding-right:1rem;
  }

  .lo-events-title{
    font-size:1.05rem;
  }
}

.lo-sticky-cta{
  position:fixed;
  left:50%;
  bottom:14px;
  transform:translateX(-50%);
  z-index:60;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.45rem;
  background:var(--lo-primary);
  color:#fff !important;
  border-radius:999px;
  padding:.78rem 1.1rem;
  font-size:.93rem;
  font-weight:800;
  text-decoration:none;
  box-shadow:0 14px 28px rgba(58, 33, 18, .30);
}

.lo-sticky-cta:hover{
  background:var(--lo-primary-strong);
}

@media (min-width: 768px){
  .lo-sticky-cta{
    display:none;
  }
}

/* About page visibility improvements */
.lo-about-page{
  background:
    radial-gradient(circle at 8% 12%, rgba(220, 103, 85, .16), transparent 34%),
    radial-gradient(circle at 92% 5%, rgba(138, 166, 178, .18), transparent 30%),
    linear-gradient(180deg, #fff6ee 0%, #fff 40%);
}

.lo-about-hero > div:nth-child(2){
  background:linear-gradient(90deg, rgba(255, 250, 244, .96) 0%, rgba(255, 246, 236, .90) 48%, rgba(255, 242, 229, .78) 100%) !important;
}

.lo-about-hero h1,
.lo-about-hero p,
.lo-about-hero .text-gray-900,
.lo-about-hero .text-gray-800,
.lo-about-hero .text-gray-700{
  color:#2f2923 !important;
}

.lo-about-intro{
  background:linear-gradient(180deg, #fffefb 0%, #fff8f1 100%) !important;
}

.lo-about-page #our-mission .bg-blue-50{
  background:linear-gradient(180deg, #fff2e8 0%, #fff7ef 100%) !important;
  border:1px solid rgba(220, 103, 85, .22);
}

.lo-about-page #our-mission .text-gray-700,
.lo-about-page .text-gray-700{
  color:#4a433b !important;
}

.lo-about-page #our-mission .text-blue-600{
  color:var(--lo-primary) !important;
}

.lo-about-stats > div:nth-child(2){
  background:linear-gradient(90deg, rgba(255, 249, 242, .90) 0%, rgba(252, 245, 236, .78) 100%) !important;
}

.lo-about-stats .text-4xl,
.lo-about-stats .text-5xl,
.lo-about-stats .text-blue-600{
  color:#b94f3f !important;
}

.lo-about-vision{
  background:linear-gradient(180deg, #fff5eb 0%, #fffdf8 100%) !important;
  border-top:1px solid rgba(220, 103, 85, .14);
  border-bottom:1px solid rgba(220, 103, 85, .10);
}

.lo-about-page .shadow-lg{
  box-shadow:0 14px 28px rgba(73, 42, 24, .14) !important;
}