/*
Theme Name: Le Nido Creche
Theme URI: https://lenidocreche.ma
Author: Le Nido Team
Author URI: https://www.facebook.com/Lenidocreche/
Description: Theme WordPress sur-mesure pour LE NIDO, crèche maternelle à Hay Riad, Rabat. Design chaleureux pensé pour la petite enfance, avec sections dynamiques (programmes, témoignages, galerie) gérables depuis l'administration WordPress.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: lenido
*/

:root{
  --nido-cream:#FFF8EF;
  --nido-yellow:#F7C948;
  --nido-coral:#F2846B;
  --nido-mint:#8FCFB0;
  --nido-blue:#6FB7C9;
  --nido-navy:#2E3B4E;
  --nido-text:#3A3A3A;
  --nido-white:#FFFFFF;
  --radius-lg:28px;
  --radius-md:18px;
  --shadow-soft:0 12px 30px rgba(46,59,78,0.08);
  --font-heading:'Baloo 2', system-ui, sans-serif;
  --font-body:'Quicksand', system-ui, sans-serif;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
#hero, #about, #programmes, #galerie, #temoignages, #contact, #contact-form{
  scroll-margin-top:100px;
}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--nido-text);
  background:var(--nido-cream);
  line-height:1.65;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
h1,h2,h3,h4{font-family:var(--font-heading);color:var(--nido-navy);margin:0 0 .5em;line-height:1.2;}
.container{max-width:1180px;margin:0 auto;padding:0 24px;}
.section{padding:90px 0;position:relative;}
.section--tight{padding:60px 0;}
.eyebrow{
  display:inline-block;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:.78rem;
  color:var(--nido-coral);
  background:rgba(242,132,107,0.12);
  padding:6px 16px;
  border-radius:999px;
  margin-bottom:16px;
}
.section-head{text-align:center;max-width:640px;margin:0 auto 50px;}
.section-head h2{font-size:clamp(1.8rem,3.5vw,2.6rem);}
.section-head p{font-size:1.05rem;opacity:.85;}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 30px;border-radius:999px;
  font-family:var(--font-heading);font-weight:600;font-size:1rem;
  transition:transform .25s ease, box-shadow .25s ease;
  border:none;cursor:pointer;
}
.btn--primary{background:var(--nido-coral);color:#fff;box-shadow:0 10px 22px rgba(242,132,107,.35);}
.btn--primary:hover{transform:translateY(-3px);box-shadow:0 14px 26px rgba(242,132,107,.45);color:#fff;}
.btn--outline{background:transparent;border:2px solid var(--nido-navy);color:var(--nido-navy);}
.btn--outline:hover{background:var(--nido-navy);color:#fff;}
.btn--light{background:#fff;color:var(--nido-navy);}

/* Header */
.site-header{
  position:fixed;top:0;left:0;right:0;width:100%;z-index:100;
  background:var(--nido-header-bg, rgba(255,248,239,0.55));
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(46,59,78,0.06);
  transition:background .25s ease, transform .45s cubic-bezier(.22,1,.36,1), opacity .35s ease, box-shadow .25s ease, border-color .25s ease;
}
/* On the homepage the header starts invisible over the hero photo, then
   slides/fades in once you scroll past the hero - kept on the same
   translucent glass background (not a solid block) so it stays "transparent". */
.site-header.has-hero{
  transform:translateY(-100%);
  opacity:0;
  background:transparent;
  border-bottom-color:transparent;
  pointer-events:none;
}
.site-header.has-hero.is-visible{
  transform:translateY(0);
  opacity:1;
  background:var(--nido-header-bg, rgba(255,248,239,0.55));
  border-bottom-color:rgba(46,59,78,0.06);
  pointer-events:auto;
}
.site-header .container{display:flex;align-items:center;justify-content:space-between;padding-top:14px;padding-bottom:14px;}
.site-branding{display:flex;align-items:center;gap:12px;}
.site-branding img{height:52px;width:auto;border-radius:14px;}
.site-branding .name{font-family:var(--font-heading);font-weight:700;font-size:1.35rem;color:var(--nido-navy);}
.site-branding .baseline{font-size:.75rem;letter-spacing:.05em;text-transform:uppercase;color:var(--nido-coral);font-weight:600;}

.main-nav ul{display:flex;gap:34px;align-items:center;}
.main-nav a{font-weight:600;font-size:.98rem;position:relative;padding:6px 0;transition:color .2s ease;color:var(--nido-nav-text, var(--nido-navy));}
.main-nav a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background:var(--nido-nav-active, var(--nido-coral));transition:width .25s ease;}
.main-nav a:hover{color:var(--nido-nav-active, var(--nido-coral));}
.main-nav a:hover::after{width:100%;}
.main-nav a.is-active-section{color:var(--nido-nav-active, var(--nido-coral));}
.main-nav a.is-active-section::after{width:100%;}
#mobileNav a.is-active-section{color:var(--nido-nav-active, var(--nido-coral));}

.header-cta{display:flex;align-items:center;gap:18px;}
.social-icons{display:flex;gap:12px;}
.social-icons a{
  width:38px;height:38px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--nido-navy);color:#fff;
  transition:background .25s ease, transform .25s ease;
}
.social-icons a:hover{background:var(--nido-coral);transform:translateY(-2px);}
.social-icons svg{width:18px;height:18px;fill:currentColor;}

.menu-toggle{display:none;background:none;border:none;font-size:1.6rem;color:var(--nido-navy);cursor:pointer;}

/* Since the header is now fixed (floats over the page), every other page's
   content needs to start below it. The homepage hero handles its own
   spacing instead, so its background can extend behind the header. */
#main-content{padding-top:90px;}
body.home #main-content{padding-top:0;}

/* Hero */
.hero{
  position:relative;
  padding:150px 0 120px;
  overflow:hidden;
  min-height:620px;
  display:flex;
  align-items:center;
  isolation:isolate;
}
.hero-media{position:absolute;inset:0;z-index:0;background:var(--nido-navy);}
.hero-media-fill{width:100%;height:100%;object-fit:cover;display:block;}

/* Slider: real slide (translate) transition instead of crossfade */
.hero-slider{position:absolute;inset:0;overflow:hidden;}
.hero-slider-track{
  display:flex;width:100%;height:100%;
  transition:transform 1.1s cubic-bezier(.45,0,.15,1);
  will-change:transform;
  backface-visibility:hidden;
}
.hero-slide{
  flex:0 0 100%;width:100%;height:100%;
  background-size:cover;background-position:center;
  transform:translateZ(0);
  backface-visibility:hidden;
}
.hero-overlay{
  position:absolute;inset:0;
  background-image:linear-gradient(180deg, rgba(20,26,36,.15) 0%, rgba(20,26,36,.55) 100%);
}
.hero-slider-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  z-index:3;width:46px;height:46px;border-radius:50%;
  background:rgba(255,255,255,.16);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  border:1px solid rgba(255,255,255,.32);
  color:var(--nido-hero-arrow-color, #fff);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;font-size:.95rem;
  transition:background .2s ease, transform .2s ease;
}
.hero-slider-arrow:hover{background:rgba(255,255,255,.3);transform:translateY(-50%) scale(1.06);}
.hero-slider-arrow--prev{left:22px;}
.hero-slider-arrow--next{right:22px;}
@media (max-width:640px){
  .hero-slider-arrow{display:none;}
}

.hero .container{position:relative;z-index:2;}
.hero-content{
  max-width:660px;
  transition:opacity .4s ease, transform .4s ease;
}
/* Default (and "fade") per-slide animation: fade + slight rise. */
.hero-content.is-transitioning{opacity:0;transform:translateY(14px);}
.hero-content[data-animation="slide"].is-transitioning{opacity:0;transform:translateY(34px);}
.hero-content[data-animation="zoom"].is-transitioning{opacity:0;transform:scale(.94);}
.hero-content[data-animation="none"]{transition:none;}
.hero-content[data-animation="none"].is-transitioning{opacity:1;transform:none;}
.hero-content .eyebrow{
  color:var(--nido-hero-eyebrow-color, #fff);
  font-size:var(--nido-hero-eyebrow-size, 13px);
  background:rgba(255,255,255,.16);backdrop-filter:blur(3px);
}
.hero-content h1{
  color:var(--nido-hero-title-color, #fff);
  font-size:clamp(2.2rem, 4.5vw, var(--nido-hero-title-size, 54px));
}
.hero-content h1 .accent{color:var(--nido-yellow);}
.hero-content p{
  color:var(--nido-hero-subtitle-color, #fff);
  font-size:var(--nido-hero-subtitle-size, 18px);
  opacity:.92;max-width:560px;margin-bottom:28px;
}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:34px;}
.hero-actions .btn--outline{
  color:var(--nido-hero-btn2-color, #fff);
  border-color:var(--nido-hero-btn2-border, #fff);
  background:var(--nido-hero-btn2-bg, transparent);
}
.hero-actions .btn--outline:hover{
  background:var(--nido-hero-btn2-hover-bg, var(--nido-navy));
  color:var(--nido-hero-btn2-hover-color, #fff);
}
.hero-badges{display:flex;gap:14px;flex-wrap:wrap;}
.hero-badges .badge{
  display:flex;align-items:center;gap:10px;font-weight:600;font-size:.88rem;
  color:var(--nido-hero-badge-color, #fff);
  background:rgba(255,255,255,.14);backdrop-filter:blur(3px);padding:8px 16px 8px 8px;border-radius:999px;
}
.hero-badges .badge .dot{width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;color:var(--nido-hero-badge-color, #fff);font-size:.85rem;}

@media (max-width:640px){
  .hero{
    padding:130px 0 70px;
    /* A content-driven height (min-height:auto) makes the hero's height
       swing with however much text is on each slide, which forces the
       background photo into a wildly different crop/zoom every time -
       that's the "photos don't show correctly / layout is a mess"
       effect. Locking to a viewport-based range keeps every slide's
       photo cropped consistently instead. dvh is used with a vh
       fallback for older iOS versions. */
    min-height:520px;
    min-height:64vh;
    min-height:64dvh;
    max-height:760px;
  }
  /* iOS Safari can render a background-image blurry when the element
     is both inside a transformed (sliding) parent AND has its own
     GPU-layer-promotion hack (transform/backface-visibility) - the
     photo gets rasterized at a lower resolution tile and stretched.
     Only the moving track needs that hack for a smooth transition;
     the individual slide photos don't, so drop it here on phones. */
  .hero-slide{
    transform:none;
    -webkit-backface-visibility:visible;
    backface-visibility:visible;
  }
  .hero-slider-track{
    -webkit-transform:translateZ(0);
  }
  /* Keep the important part of the photo (faces, subjects) in frame -
     tune with Apparence > Personnaliser > Hero > "Cadrage sur téléphone". */
  .hero-slide{background-position:var(--nido-hero-mobile-focal, center);}
  .hero-content{max-width:100%;}
  .hero-content .eyebrow{font-size:11px;padding:5px 12px;margin-bottom:14px;}
  .hero-content h1{
    font-size:clamp(1.5rem, 7vw, 1.9rem);
    line-height:1.2;
    margin-bottom:12px;
  }
  .hero-content p{
    font-size:clamp(.85rem, 3.6vw, .95rem);
    line-height:1.45;
    margin-bottom:20px;
  }
  .hero-actions{margin-bottom:20px;gap:10px;}
  .hero-badges{gap:8px;}
  .hero-badges .badge{font-size:.76rem;padding:6px 12px 6px 6px;gap:7px;}
  .hero-badges .badge .dot{width:26px;height:26px;font-size:.72rem;}
  .hero-actions .btn{
    flex:1 1 auto;justify-content:center;text-align:center;
    padding:11px 14px;
    font-size:.82rem;
    gap:7px;
  }
  .hero-actions .btn i{font-size:.85em;}
}
@media (max-width:380px){
  .hero-actions{flex-direction:column;}
  .hero-actions .btn{width:100%;}
}

/* Marquee strip */
.marquee-strip{background:var(--nido-navy);color:#fff;padding:14px 0;overflow:hidden;white-space:nowrap;}
.marquee-track{display:inline-flex;gap:60px;animation:scroll 26s linear infinite;font-family:var(--font-heading);font-weight:600;letter-spacing:.03em;}
.marquee-track span{opacity:.9;}
@keyframes scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* About */
.about .container{display:grid;grid-template-columns:1fr 1.1fr;gap:60px;align-items:center;}
.about-media{position:relative;}
.about-media img{border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);}
.about-media .stat-card{
  position:absolute;bottom:-24px;left:-24px;background:var(--nido-yellow);
  border-radius:var(--radius-md);padding:20px 26px;box-shadow:var(--shadow-soft);
}
.stat-card .num{font-family:var(--font-heading);font-size:2rem;color:var(--nido-navy);font-weight:700;}
.stat-card .label{font-size:.8rem;font-weight:600;color:var(--nido-navy);}
.about-content .eyebrow{margin-bottom:14px;}
.about-features{margin-top:26px;display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.about-features li{display:flex;gap:12px;align-items:flex-start;font-weight:600;font-size:.95rem;}
.about-features .ico{
  flex:none;width:34px;height:34px;border-radius:10px;background:var(--nido-mint);
  display:flex;align-items:center;justify-content:center;color:#fff;
}

/* Programs / services */
.programs{background:#fff;}
.programs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:28px;}
.program-card{
  background:var(--nido-cream);border-radius:var(--radius-lg);padding:34px 28px;
  transition:transform .3s ease, box-shadow .3s ease;
  border:2px solid transparent;
}
.program-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-soft);border-color:var(--nido-yellow);}
.program-card .icon-wrap{
  width:60px;height:60px;border-radius:16px;display:flex;align-items:center;justify-content:center;
  background:var(--nido-coral);color:#fff;margin-bottom:20px;font-size:1.5rem;
}
.program-card h3{font-size:1.2rem;margin-bottom:8px;}
.program-card p{font-size:.95rem;opacity:.8;margin:0;}
.program-card .age{
  display:inline-block;margin-top:14px;font-size:.78rem;font-weight:700;
  background:var(--nido-navy);color:#fff;padding:4px 12px;border-radius:999px;
}
.program-card{display:block;}
.program-card-more{
  display:flex;align-items:center;gap:8px;margin-top:18px;
  font-family:var(--font-heading);font-weight:700;font-size:.9rem;color:var(--nido-coral);
  opacity:0;transform:translateX(-6px);transition:opacity .25s ease, transform .25s ease;
}
.program-card:hover .program-card-more{opacity:1;transform:translateX(0);}
.program-card-more i{font-size:.8rem;transition:transform .25s ease;}
.program-card:hover .program-card-more i{transform:translateX(3px);}

/* Programme detail page ("Fiche Programme" template) */
.back-link{
  display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:.9rem;
  color:var(--nido-navy);opacity:.75;transition:opacity .2s ease, gap .2s ease;
}
.back-link:hover{opacity:1;gap:14px;}
.programme-hero-section{padding-bottom:0;}
.programme-hero-head{margin-top:26px;max-width:760px;}
.programme-hero-head .age{
  display:inline-block;margin-bottom:16px;font-size:.8rem;font-weight:700;
  background:var(--nido-navy);color:#fff;padding:6px 16px;border-radius:999px;
}
.programme-hero-head h1{font-size:clamp(2rem,4vw,2.9rem);}
.programme-featured-media{
  border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-soft);
  margin:36px 0 0;max-height:460px;
}
.programme-featured-media img{width:100%;height:100%;object-fit:cover;display:block;}
.programme-content h2{margin-top:1.4em;}
.programme-hero-intro{margin-top:16px;font-size:1.08rem;color:var(--nido-navy);opacity:.8;max-width:620px;}

/* Scroll-reveal animation, used across programme pages */
.reveal-up{opacity:0;transform:translateY(26px);transition:opacity .6s ease, transform .6s ease;}
.reveal-up.is-visible{opacity:1;transform:translateY(0);}
@media (prefers-reduced-motion: reduce){
  .reveal-up{opacity:1;transform:none;transition:none;}
}

/* "Ce que vivra votre enfant" highlight cards */
.programme-highlights-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:22px;
}
.programme-highlight-card{
  background:#fff;border-radius:var(--radius-lg);padding:26px 24px;box-shadow:var(--shadow-soft);
  display:flex;flex-direction:column;gap:14px;transition:transform .3s ease, box-shadow .3s ease;
}
.programme-highlight-card:hover{transform:translateY(-6px);box-shadow:0 18px 34px rgba(46,59,78,.12);}
.programme-highlight-card .icon-wrap{
  width:52px;height:52px;border-radius:14px;background:var(--nido-cream);
  display:flex;align-items:center;justify-content:center;color:var(--nido-coral);font-size:1.25rem;
}
.programme-highlight-card p{margin:0;line-height:1.6;color:var(--nido-navy);opacity:.85;}

/* Photo gallery */
.programme-gallery-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px;
}
.programme-gallery-item{
  position:relative;border:0;padding:0;cursor:zoom-in;border-radius:var(--radius-lg);overflow:hidden;
  aspect-ratio:4/3;box-shadow:var(--shadow-soft);background:var(--nido-cream);
  transition:transform .35s ease, box-shadow .35s ease;
}
.programme-gallery-item:hover{transform:translateY(-5px) scale(1.015);box-shadow:0 18px 34px rgba(46,59,78,.16);}
.programme-gallery-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease;}
.programme-gallery-item:hover img{transform:scale(1.06);}
.programme-gallery-caption{
  position:absolute;left:0;right:0;bottom:0;padding:20px 14px 12px;text-align:left;
  background:linear-gradient(to top, rgba(46,59,78,.75), transparent);color:#fff;
  font-size:.82rem;font-weight:600;opacity:0;transform:translateY(6px);
  transition:opacity .3s ease, transform .3s ease;
}
.programme-gallery-item:hover .programme-gallery-caption{opacity:1;transform:translateY(0);}

/* Lightbox */
.programme-lightbox{
  position:fixed;inset:0;background:rgba(20,24,32,.92);z-index:1000;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;
  padding:40px;opacity:0;visibility:hidden;transition:opacity .3s ease;
}
.programme-lightbox.is-open{opacity:1;visibility:visible;}
.programme-lightbox img{
  max-width:min(900px,90vw);max-height:78vh;border-radius:var(--radius-lg);
  box-shadow:0 20px 60px rgba(0,0,0,.5);transform:scale(.96);transition:transform .3s ease;
}
.programme-lightbox.is-open img{transform:scale(1);}
.programme-lightbox-caption{color:#fff;font-size:.95rem;opacity:.85;max-width:700px;text-align:center;}
.programme-lightbox-close{
  position:absolute;top:26px;right:26px;width:44px;height:44px;border-radius:50%;
  border:0;background:rgba(255,255,255,.12);color:#fff;font-size:1.1rem;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:background .2s ease;
}
.programme-lightbox-close:hover{background:rgba(255,255,255,.25);}

/* Daily timeline */
.programme-timeline{display:flex;flex-direction:column;position:relative;padding-left:6px;}
.programme-timeline::before{
  content:'';position:absolute;left:65px;top:8px;bottom:8px;width:2px;
  background:repeating-linear-gradient(to bottom, var(--nido-mint) 0 6px, transparent 6px 12px);
}
.programme-timeline-item{
  display:grid;grid-template-columns:56px 20px 1fr;align-items:center;gap:14px;
  padding:14px 0;position:relative;
}
.programme-timeline-time{
  font-family:var(--font-heading);font-weight:700;color:var(--nido-navy);font-size:.9rem;text-align:right;
}
.programme-timeline-dot{
  width:14px;height:14px;border-radius:50%;background:var(--nido-coral);
  box-shadow:0 0 0 5px var(--nido-cream);justify-self:center;z-index:1;
}
.programme-timeline-text{color:var(--nido-navy);opacity:.85;line-height:1.5;}

/* Extra info blocks */
.programme-info-blocks{display:flex;flex-direction:column;gap:26px;}
.programme-info-block{
  background:var(--nido-cream);border-radius:var(--radius-lg);padding:26px 28px;
}
.programme-info-block h3{margin:0 0 10px;color:var(--nido-navy);}
.programme-info-block p{margin:0;line-height:1.7;color:var(--nido-navy);opacity:.85;white-space:pre-line;}

@media (max-width:640px){
  .programme-timeline::before{left:56px;}
  .programme-timeline-item{grid-template-columns:46px 16px 1fr;gap:10px;}
  .programme-lightbox{padding:20px;}
  .programme-lightbox-close{top:14px;right:14px;}
}

/* Gallery */
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:150px;gap:16px;}
.gallery-grid a{position:relative;border-radius:var(--radius-md);overflow:hidden;display:block;}
.gallery-grid a:nth-child(4n+1){grid-row:span 2;}
.gallery-grid img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease;}
.gallery-grid a:hover img{transform:scale(1.08);}
.gallery-grid a::after{
  content:"\f16d";font-family:'Font Awesome 6 Brands','Font Awesome 6 Free';
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:1.6rem;background:rgba(46,59,78,0);transition:background .3s ease;opacity:0;
}
.gallery-grid a:hover::after{background:rgba(46,59,78,.45);opacity:1;}

/* Testimonials */
.testimonials{background:var(--nido-navy);color:#fff;}
.testimonials .section-head h2{color:#fff;}
.testimonials .section-head p{color:rgba(255,255,255,.75);}
.testi-track{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:26px;}
.testi-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius-lg);padding:30px;}
.testi-card .quote-mark{font-family:var(--font-heading);font-size:2.4rem;color:var(--nido-yellow);line-height:1;}
.testi-card p{font-size:.98rem;opacity:.92;margin:12px 0 22px;}
.testi-author{display:flex;align-items:center;gap:12px;}
.testi-author img{width:44px;height:44px;border-radius:50%;object-fit:cover;}
.testi-author .name{font-weight:700;font-family:var(--font-heading);font-size:.95rem;}
.testi-author .role{font-size:.8rem;opacity:.7;}

/* CTA band */
.cta-band{
  background:linear-gradient(120deg,var(--nido-coral),var(--nido-yellow));
  border-radius:var(--radius-lg);
  margin:0 auto;max-width:1180px;
  padding:60px;display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;
  color:#fff;
}
.cta-band h2{color:#fff;font-size:1.9rem;max-width:520px;}
.cta-band p{opacity:.95;max-width:520px;}

/* Contact */
.contact .container{display:grid;grid-template-columns:1fr 1fr;gap:50px;}
.contact-info-card{
  background:#fff;border-radius:var(--radius-lg);padding:36px;box-shadow:var(--shadow-soft);
}
.contact-info-card ul{display:flex;flex-direction:column;gap:22px;}
.contact-info-card li{display:flex;gap:16px;align-items:flex-start;}
.contact-info-card .ico{
  flex:none;width:44px;height:44px;border-radius:12px;background:var(--nido-mint);color:#fff;
  display:flex;align-items:center;justify-content:center;
}
.contact-info-card .label{font-weight:700;font-family:var(--font-heading);}
.contact-info-card .value{opacity:.8;font-size:.95rem;}
.contact-map{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-soft);min-height:340px;}
.contact-map iframe{width:100%;height:100%;min-height:340px;border:0;display:block;}

.contact-form-card{background:#fff;border-radius:var(--radius-lg);padding:36px;box-shadow:var(--shadow-soft);}
.contact-form-card input,.contact-form-card textarea,.contact-form-card select{
  width:100%;padding:14px 16px;border-radius:14px;border:1.5px solid #e6ddcd;
  font-family:var(--font-body);margin-bottom:6px;font-size:.95rem;background:var(--nido-cream);
  appearance:auto;
}
.contact-form-card textarea{min-height:120px;resize:vertical;}
.contact-form-card button{width:100%;justify-content:center;margin-top:10px;}
.contact-form-card .form-field{margin-bottom:10px;}
.contact-form-card .form-field label{
  display:block;font-size:.8rem;font-weight:600;color:var(--nido-navy);margin-bottom:5px;
}
.contact-form-card .form-field label .required-star{color:var(--nido-coral);margin-left:2px;}

/* Date & time-slot fields: same size as the other fields, with a subtle icon + polish */
.field-icon-wrap{position:relative;}
.field-icon-wrap .field-icon{
  position:absolute;left:16px;top:50%;transform:translateY(-50%) scale(1);
  font-size:14px;color:var(--nido-mint-dark);
  pointer-events:none;
  transition:color .25s ease, transform .3s cubic-bezier(.34,1.56,.64,1);
  z-index:2;
}
.field-icon-wrap input[type="date"],
.field-icon-wrap select{
  padding:14px 16px 14px 44px !important;
  font-size:.95rem !important;
  font-weight:500;
  color:var(--nido-navy);
  cursor:pointer;
  transition:border-color .25s ease, box-shadow .3s ease, transform .2s ease;
}
.field-icon-wrap:hover input[type="date"],
.field-icon-wrap:hover select{
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(46,58,70,.10);
  border-color:var(--nido-mint);
}
.field-icon-wrap:hover .field-icon{
  transform:translateY(-50%) scale(1.15) rotate(-6deg);
}
.field-icon-wrap input[type="date"]:focus,
.field-icon-wrap select:focus{
  outline:none;
  border-color:var(--nido-coral);
  animation:lenido-field-glow 1.8s ease-in-out infinite;
}
.field-icon-wrap:focus-within .field-icon{
  color:var(--nido-coral);
  transform:translateY(-50%) scale(1.2);
}
@keyframes lenido-field-glow{
  0%, 100% { box-shadow:0 0 0 3px rgba(255,122,110,.14); }
  50%      { box-shadow:0 0 0 6px rgba(255,122,110,.22); }
}

/* Tint the native date-picker icon (Chrome/Edge/Safari) */
.field-icon-wrap--date input[type="date"]::-webkit-calendar-picker-indicator{
  filter:invert(53%) sepia(64%) saturate(414%) hue-rotate(115deg) brightness(92%);
  opacity:.85;
  cursor:pointer;
  transition:opacity .25s ease, transform .25s ease;
}
.field-icon-wrap--date input[type="date"]:hover::-webkit-calendar-picker-indicator{
  opacity:1;
  transform:scale(1.15);
}

/* Custom dropdown arrow for the time-slot select, same size as the field */
.field-icon-wrap--time select{
  appearance:none;
  -webkit-appearance:none;
  padding-right:38px !important;
  background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1L7 7L13 1' stroke='%23FF7A6E' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 16px center;
  transition:background-position .2s ease, border-color .25s ease, box-shadow .3s ease, transform .2s ease;
}
.field-icon-wrap--time:hover select{
  background-position:right 14px center;
}
.field-icon-wrap--time select:invalid,
.field-icon-wrap--time select option[value=""]{
  color:#9a9488;
}

/* Footer */
.site-footer{background:var(--nido-navy);color:rgba(255,255,255,.85);padding:70px 0 24px;}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1.15fr 1fr;gap:44px;margin-bottom:50px;align-items:start;}
.footer-brand .site-branding .name{color:#fff;}
.footer-brand p{opacity:.75;font-size:.92rem;max-width:300px;margin-top:14px;line-height:1.6;}
.footer-col{min-width:0;}
.footer-col h4{color:#fff;font-size:1rem;margin-bottom:18px;}
.footer-col ul{display:flex;flex-direction:column;gap:10px;}
.footer-col li{
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-size:.92rem;
  line-height:1.5;
  margin-bottom:0;
}
.footer-col li i{margin-top:3px;opacity:.7;flex-shrink:0;width:14px;text-align:center;}
.footer-col li a, .footer-col li span{word-break:break-word;}
.footer-col a:hover{color:var(--nido-yellow);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:22px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;font-size:.85rem;opacity:.7;}
.footer-social-icons{display:flex;gap:10px;flex-wrap:wrap;}
.footer-social-icons a{
  width:38px;height:38px;border-radius:50%;
  background:rgba(255,255,255,.08);
  display:flex;align-items:center;justify-content:center;
  color:#fff;transition:background .2s ease, color .2s ease;
}
.footer-social-icons a:hover{background:var(--nido-coral);color:#fff;}

/* Responsive */
@media (max-width:960px){
  .main-nav, .header-cta .social-icons{display:none;}
  .menu-toggle{display:block;}
  .about .container, .contact .container{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .gallery-grid{grid-template-columns:repeat(2,1fr);}
  .cta-band{flex-direction:column;text-align:center;padding:40px 28px;}
}
@media (max-width:640px){
  /* The header CTA button(s) now live inside the mobile drawer (see
     .mobile-nav-buttons) so the fixed top bar only needs to hold the
     logo and the hamburger icon - that's what was making it so tall
     and cramped on phones. */
  .header-cta > .btn{display:none;}
  .site-header .container{padding-top:10px;padding-bottom:10px;}
  .site-branding img,
  .site-branding span[style*="width:52px"]{height:40px!important;width:40px!important;}
  .site-branding .name{font-size:1.05rem;}
  .site-branding .baseline{display:none;}
  #main-content{padding-top:66px;}
  #hero, #about, #programmes, #galerie, #temoignages, #contact, #contact-form{scroll-margin-top:74px;}
  .mobile-nav-buttons{display:flex;flex-direction:column;gap:12px;margin-top:26px;}
  .mobile-nav-buttons .btn{justify-content:center;}
}

@media (max-width:600px){
  .about-features{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .section{padding:60px 0;}
}

.site-header.is-scrolled{box-shadow:0 4px 18px rgba(46,59,78,.08);}

/* Accessibility */
.screen-reader-text{
  border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);
  height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;
  width:1px;word-wrap:normal!important;
}
.skip-link.screen-reader-text:focus{
  background:#fff;color:var(--nido-navy);display:block;
  height:auto;left:16px;top:16px;padding:14px 22px;
  width:auto;z-index:100000;border-radius:12px;box-shadow:var(--shadow-soft);
  clip:auto;clip-path:none;
}

/* Basic page content (mentions légales, etc.) */
.page-content p{margin-bottom:1.2em;}
.page-content h2,.page-content h3{margin-top:1.4em;}
.page-content ul,.page-content ol{padding-left:1.4em;margin-bottom:1.2em;}
.page-content ul{list-style:disc;}
.page-content ol{list-style:decimal;}
.page-content a{color:var(--nido-coral);text-decoration:underline;}

/* Hours table (Contact section) */
/* Hours list (Contact section) — 2 days per line, horizontal separators */
.hours-list{
  width:100%;
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:22px;
}
.hours-list-row{
  display:flex !important;
  flex-direction:row !important;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  padding:6px 0;
  border-bottom:1px solid rgba(46,58,70,.07);
  font-size:13px;
  line-height:1.3;
  color:var(--nido-text);
}
.hours-day{
  display:inline-block;
  width:82px;
  flex-shrink:0;
  text-align:center;
  background:var(--nido-mint);
  color:#fff;
  font-weight:700;
  font-size:11.5px;
  letter-spacing:.02em;
  padding:4px 8px;
  border-radius:20px;
  white-space:nowrap;
}
.hours-time{font-weight:600;color:var(--nido-navy);white-space:nowrap;}
@media(max-width:480px){
  .hours-list{grid-template-columns:1fr;}
}

/* Confirmation ticket (shown after a successful contact form submission) */
.confirmation-ticket{
  background:#fff;
  border-radius:20px;
  box-shadow:0 14px 34px rgba(46,58,70,.14);
  overflow:hidden;
  border:1px solid rgba(46,58,70,.06);
  animation:lenido-ticket-in .5s cubic-bezier(.22,1,.36,1);
}
@keyframes lenido-ticket-in{
  from{ opacity:0; transform:translateY(14px) scale(.98); }
  to{ opacity:1; transform:translateY(0) scale(1); }
}
.ticket-top{
  padding:32px 30px 26px;
  text-align:center;
  background:linear-gradient(160deg, #fffdf8 0%, var(--nido-cream) 100%);
}
.ticket-logo{margin-bottom:14px;display:flex;justify-content:center;}
.ticket-logo img{max-height:52px;width:auto;border-radius:50%;}
.ticket-logo-text{font-family:var(--font-heading);font-size:24px;font-weight:700;color:var(--nido-coral);}
.ticket-welcome{font-size:15px;color:var(--nido-navy);font-weight:600;margin:0 0 6px;}
.ticket-greeting{font-size:14px;color:#6b6459;margin:0;}

.ticket-perforation{
  display:flex;
  justify-content:space-between;
  padding:0 6px;
  position:relative;
}
.ticket-perforation::before{
  content:'';
  position:absolute;
  left:0;right:0;top:50%;
  border-top:2px dashed rgba(46,58,70,.15);
}
.ticket-perforation span{
  width:16px;height:16px;
  border-radius:50%;
  background:var(--nido-cream);
  flex-shrink:0;
  position:relative;
  z-index:1;
}
.ticket-perforation span:first-child{margin-left:-14px;}
.ticket-perforation span:last-child{margin-right:-14px;}

.ticket-bottom{padding:22px 30px 28px;}
.ticket-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:10px 0;
  border-bottom:1px dashed rgba(46,58,70,.08);
}
.ticket-row:last-child{border-bottom:none;}
.ticket-row-label{font-size:12.5px;font-weight:600;color:#8a8378;text-transform:uppercase;letter-spacing:.03em;}
.ticket-row-value{font-size:14px;font-weight:700;color:var(--nido-navy);text-align:right;}
.ticket-number{
  font-family:var(--font-heading);
  font-size:17px;
  letter-spacing:.04em;
  color:var(--nido-coral);
  background:rgba(255,122,110,.1);
  padding:4px 12px;
  border-radius:8px;
}

/* Mobile nav drawer */
.mobile-nav{
  position:fixed;inset:0 0 0 auto;width:78%;max-width:320px;background:#fff;
  transform:translateX(100%);transition:transform .3s ease;z-index:200;
  box-shadow:-10px 0 30px rgba(0,0,0,.12);padding:30px 26px;
}
.mobile-nav.is-open{transform:translateX(0);}
.mobile-nav ul{display:flex;flex-direction:column;gap:22px;margin-top:40px;}
.mobile-nav a{font-family:var(--font-heading);font-weight:600;font-size:1.1rem;}
.mobile-nav-close{background:none;border:none;font-size:1.6rem;position:absolute;top:20px;right:20px;cursor:pointer;}
.nav-overlay{position:fixed;inset:0;background:rgba(46,59,78,.4);opacity:0;pointer-events:none;transition:opacity .3s ease;z-index:150;}
.nav-overlay.is-open{opacity:1;pointer-events:auto;}
