/* ====== DESIGN TOKENS ====== */
    :root {
      --teal:       #7DCDC4;
      --teal-light: #a8ddd9;
      --teal-dark:  #5ab5ab;
      --sand:       #C9A97A;
      --sand-light: #e0c9a3;
      --mauve:      #C47BB5;
      --mauve-light:#d9a0cc;
      --cream:      #FDF8F2;
      --dark:       #2C2A27;
      --mid:        #7a7068;
      --white:      #ffffff;
      --font-display:'Playfair Display', Georgia, serif;
      --font-body:   'Nunito', sans-serif;
      --radius-sm: 12px;
      --radius-md: 24px;
      --radius-lg: 48px;
      --shadow-soft: 0 8px 40px rgba(44,42,39,0.08);
      --shadow-card: 0 4px 24px rgba(44,42,39,0.10);
    }

    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; }
    body { font-family: var(--font-body); background: var(--cream); color: var(--dark); overflow-x: hidden; }
    img { max-width: 100%; display: block; }
    a { color: inherit; text-decoration: none; }
    button { cursor: pointer; border: none; background: none; font-family: inherit; }

    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
    }

    /* ====== LOADER ====== */
    #loader {
      position: fixed; inset: 0; z-index: 9999;
      background: var(--cream);
      display: flex; flex-direction: column; align-items: center; justify-content: center;
      transition: opacity 0.7s ease, visibility 0.7s ease;
    }
    #loader.hidden { opacity: 0; visibility: hidden; pointer-events: none; }
    .loader-logo-svg { width: 180px; margin-bottom: 2rem; }
    .loader-flowers { display: flex; gap: 10px; align-items: flex-end; }
    .loader-stem {
      width: 4px; border-radius: 2px;
      transform-origin: bottom center;
      animation: stemUp 1s ease-out forwards; opacity: 0;
    }
    .loader-stem:nth-child(1){height:32px;background:var(--teal);animation-delay:0s}
    .loader-stem:nth-child(2){height:44px;background:var(--sand);animation-delay:0.15s}
    .loader-stem:nth-child(3){height:36px;background:var(--mauve);animation-delay:0.30s}
    .loader-stem:nth-child(4){height:40px;background:var(--teal-dark);animation-delay:0.45s}
    .loader-stem:nth-child(5){height:30px;background:var(--sand-light);animation-delay:0.60s}
    @keyframes stemUp {
      0%   { opacity:0; transform:scaleY(0); }
      60%  { opacity:1; transform:scaleY(1.08); }
      100% { opacity:1; transform:scaleY(1); }
    }

    /* ====== NAV ====== */
    nav {
      position: fixed; top: 0; left: 0; right: 0; z-index: 100;
      display: flex; align-items: center; justify-content: space-between;
      padding: 0 5%; height: 76px;
      background: rgba(253,248,242,0.94);
      backdrop-filter: blur(12px);
      border-bottom: 1px solid rgba(201,169,122,0.15);
      transition: box-shadow 0.3s;
    }
    nav.scrolled { box-shadow: var(--shadow-soft); }
    .nav-logo-img { height: 48px; width: auto; display: block; }
    .nav-links { display: flex; gap: 2rem; align-items: center; list-style: none; }
    .nav-links a {
      font-size: 0.8rem; font-weight: 700; letter-spacing: 0.06em;
      color: var(--dark); text-transform: uppercase;
      position: relative; transition: color 0.2s;
    }
    .nav-links a::after {
      content:''; position:absolute; bottom:-4px; left:0; right:0; height:2px;
      background: var(--teal);
      transform: scaleX(0); transform-origin: left;
      transition: transform 0.25s ease;
    }
    .nav-links a:hover { color: var(--teal-dark); }
    .nav-links a:hover::after { transform: scaleX(1); }
    .nav-cta {
      background: var(--mauve) !important; color: var(--white) !important;
      padding: 0.55rem 1.4rem; border-radius: 50px;
      transition: background 0.2s, transform 0.15s;
    }
    .nav-cta::after { display:none !important; }
    .nav-cta:hover { background: var(--mauve-light) !important; transform: translateY(-1px); }
    .hamburger { display:none; flex-direction:column; gap:5px; padding:4px; }
    .hamburger span { display:block; width:24px; height:2px; background:var(--dark); border-radius:2px; transition:0.3s; }
    .mobile-nav {
      display:none; position:fixed; top:76px; left:0; right:0;
      background:var(--cream); z-index:99;
      padding:1.5rem 5%; border-bottom:1px solid rgba(201,169,122,0.2);
      flex-direction:column; gap:1rem;
    }
    .mobile-nav.open { display:flex; }
    .mobile-nav a { font-size:1rem; font-weight:700; padding:0.5rem 0; border-bottom:1px solid rgba(201,169,122,0.12); }

    /* ====== HERO ====== */
    .hero {
      min-height: 100svh; padding-top: 76px;
      display: flex; flex-direction: column;
      overflow: hidden; position: relative;
    }
    .hero-bg {
      position: absolute; inset: 0;
      background: linear-gradient(135deg,#d4f0ec 0%,#f5e8d8 45%,#ecd4e8 100%);
    }
    .blob {
      position:absolute; border-radius:50%;
      filter:blur(72px); opacity:0.42;
      animation: blobDrift 14s ease-in-out infinite alternate;
    }
    .blob-1{width:540px;height:540px;background:var(--teal);top:-120px;left:-120px;animation-duration:18s}
    .blob-2{width:420px;height:420px;background:var(--mauve);top:45%;right:-100px;animation-delay:-4s}
    .blob-3{width:320px;height:320px;background:var(--sand);bottom:40px;left:28%;animation-delay:-9s;animation-duration:13s}
    @keyframes blobDrift {
      0%  { transform:translate(0,0) scale(1); }
      100%{ transform:translate(36px,28px) scale(1.07); }
    }

    .hero-content {
      position:relative; z-index:2;
      flex:1; display:flex; flex-direction:column;
      align-items:center; justify-content:center;
      text-align:center; padding:3rem 5% 2rem;
    }
    .hero-eyebrow {
      font-size:0.68rem; letter-spacing:0.32em; text-transform:uppercase;
      color:var(--sand); font-weight:700;
      background:rgba(255,255,255,0.5); backdrop-filter:blur(4px);
      padding:0.4rem 1.1rem; border-radius:50px; margin-bottom:1.75rem;
      opacity:0; animation:fadeUp 0.7s 0.8s ease forwards;
    }
    .hero-title {
      font-family:var(--font-display);
      font-size:clamp(2.8rem,7vw,5.5rem);
      font-weight:700; line-height:1.05; color:var(--dark); margin-bottom:1.25rem;
      opacity:0; animation:fadeUp 0.7s 1s ease forwards;
    }
    .hero-title em { font-style:italic; color:var(--teal-dark); }
    .hero-sub {
      font-size:clamp(1rem,2vw,1.2rem); color:var(--mid);
      max-width:560px; line-height:1.75; margin-bottom:2.5rem;
      opacity:0; animation:fadeUp 0.7s 1.2s ease forwards;
    }
    .hero-actions {
      display:flex; gap:1rem; flex-wrap:wrap; justify-content:center;
      opacity:0; animation:fadeUp 0.7s 1.4s ease forwards;
    }
    .btn-primary {
      background:var(--teal-dark); color:var(--white);
      padding:0.85rem 2rem; border-radius:50px;
      font-weight:700; font-size:0.95rem;
      transition:transform 0.2s, box-shadow 0.2s;
      box-shadow:0 4px 20px rgba(90,181,171,0.35);
    }
    .btn-primary:hover { transform:translateY(-2px); box-shadow:0 8px 28px rgba(90,181,171,0.5); }
    .btn-secondary {
      background:rgba(255,255,255,0.55); backdrop-filter:blur(6px);
      border:1.5px solid rgba(90,181,171,0.4);
      color:var(--dark); padding:0.85rem 2rem; border-radius:50px;
      font-weight:600; font-size:0.95rem;
      transition:background 0.2s,transform 0.2s;
    }
    .btn-secondary:hover { background:rgba(255,255,255,0.85); transform:translateY(-2px); }
    @keyframes fadeUp {
      from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:translateY(0)}
    }

    /* Garden SVG at hero bottom */
    .hero-garden {
      position:relative; z-index:2;
      width:100%; height:200px; pointer-events:none;
      display:flex; align-items:flex-end;
    }
    .garden-svg { position:absolute; bottom:0; width:100%; }
    .stem-anim { transform-origin:bottom center; animation:stemUp 1.5s ease-out forwards; opacity:0; }
    .head-anim { transform-origin:center; animation:headPop 0.5s ease-out forwards; opacity:0; }
    @keyframes headPop {
      0%  {transform:scale(0) rotate(-15deg);opacity:0}
      70% {transform:scale(1.1) rotate(3deg);opacity:1}
      100%{transform:scale(1) rotate(0);opacity:1}
    }
    /* SVG butterfly animateMotion handles the flying */

    /* ====== PHOTO STRIP (below hero) ====== */
    .photo-strip {
      background: var(--white);
      padding: 0;
      overflow: hidden;
    }
    .photo-strip-inner {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      gap: 0;
      min-height: 380px;
    }
    .photo-slot {
      position: relative; overflow: hidden;
      background: linear-gradient(135deg, var(--teal-light), var(--teal-dark));
      transition: transform 0.4s ease;
    }
    .photo-slot:nth-child(2) { background: linear-gradient(135deg, #eddfc8, #c9a97a); }
    .photo-slot:nth-child(3) { background: linear-gradient(135deg, #ead4ea, #c47bb5); }
    .photo-slot:nth-child(4) { background: linear-gradient(135deg, #c8ecea, #5ab5ab); }
    .photo-slot img {
      width:100%; height:100%; object-fit:cover;
      position:absolute; inset:0; transition:transform 0.5s ease;
    }
    .photo-slot:hover img { transform:scale(1.04); }
    .photo-slot-label {
      position:absolute; bottom:0; left:0; right:0;
      background: linear-gradient(to top, rgba(44,42,39,0.55), transparent);
      padding: 1.5rem 1.25rem 1rem;
      color: var(--white);
      font-size: 0.78rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
      opacity: 0; transition: opacity 0.3s;
    }
    .photo-slot:hover .photo-slot-label { opacity: 1; }
    /* placeholder when no image */
    .photo-slot-placeholder {
      position:absolute; inset:0;
      display:flex; flex-direction:column; align-items:center; justify-content:center; gap:0.75rem;
      color: rgba(255,255,255,0.65); text-align:center; padding:1rem;
    }
    .photo-slot-placeholder svg { width:40px; height:40px; opacity:0.7; }
    .photo-slot-placeholder span { font-size:0.75rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; }

    /* ====== SECTION WRAPPERS ====== */
    section { padding: 5.5rem 5%; }
    .section-label {
      font-size:0.65rem; letter-spacing:0.32em; text-transform:uppercase;
      color:var(--sand); font-weight:700; margin-bottom:0.75rem;
    }
    .section-title {
      font-family:var(--font-display);
      font-size:clamp(1.8rem,4vw,2.8rem);
      font-weight:700; line-height:1.15; color:var(--dark);
    }
    .section-title em { font-style:italic; color:var(--mauve); }
    .reveal { opacity:0; transform:translateY(28px); transition:opacity 0.7s ease, transform 0.7s ease; }
    .reveal.visible { opacity:1; transform:translateY(0); }

    /* ====== SERVICES ====== */
    .services { background: var(--cream); }
    .services-header { text-align:center; max-width:600px; margin:0 auto 3.5rem; }
    .services-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1.5rem; }
    .service-card {
      background:var(--white);
      border-radius:var(--radius-md); padding:2.25rem 1.75rem;
      box-shadow:var(--shadow-card); position:relative; overflow:hidden;
      transition:transform 0.3s,box-shadow 0.3s;
    }
    .service-card::before {
      content:''; position:absolute; top:0; left:0; right:0; height:4px;
    }
    .service-card:nth-child(1)::before{background:var(--teal)}
    .service-card:nth-child(2)::before{background:var(--sand)}
    .service-card:nth-child(3)::before{background:var(--mauve)}
    .service-card:nth-child(4)::before{background:var(--teal-dark)}
    .service-card:hover { transform:translateY(-6px); box-shadow:0 12px 40px rgba(44,42,39,0.13); }
    .service-icon { width:44px; height:44px; margin-bottom:1.1rem; }
    .service-card h3 { font-family:var(--font-display); font-size:1.2rem; font-weight:700; margin-bottom:0.6rem; }
    .service-card p { font-size:0.9rem; line-height:1.75; color:var(--mid); }
    .service-tag {
      display:inline-block; margin-top:1rem;
      font-size:0.68rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase;
      padding:0.3rem 0.85rem; border-radius:50px;
      background:var(--cream); color:var(--mid);
    }

    /* ====== EVENTS ====== */
    .events { background:#f0f9f8; }
    .events-header { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:2.5rem; flex-wrap:wrap; gap:1rem; }
    .events-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:1.5rem; }
    .event-card {
      background:var(--white); border-radius:var(--radius-md); overflow:hidden;
      box-shadow:var(--shadow-card); display:flex; flex-direction:column;
      transition:transform 0.3s,box-shadow 0.3s;
    }
    .event-card:hover { transform:translateY(-5px); box-shadow:0 14px 40px rgba(44,42,39,0.12); }
    .event-img {
      width:100%; height:200px;
      background:linear-gradient(135deg,var(--teal-light),var(--teal-dark));
      position:relative; overflow:hidden;
    }
    .event-img img { width:100%;height:100%;object-fit:cover;position:absolute;inset:0; }
    .event-img-placeholder {
      position:absolute;inset:0;
      display:flex;align-items:center;justify-content:center;
    }
    .event-img-placeholder svg { width:56px;height:56px;opacity:0.35; }
    .event-date-badge {
      position:absolute; top:12px; left:12px; z-index:2;
      background:var(--white); border-radius:var(--radius-sm);
      padding:0.5rem 0.75rem; text-align:center;
      box-shadow:var(--shadow-card);
    }
    .event-date-badge .day { font-family:var(--font-display); font-size:1.4rem; font-weight:700; line-height:1; color:var(--teal-dark); }
    .event-date-badge .month { font-size:0.65rem; text-transform:uppercase; letter-spacing:0.12em; color:var(--mid); font-weight:700; }
    .event-body { padding:1.5rem; flex:1; display:flex; flex-direction:column; }
    .event-category { font-size:0.65rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--mauve); font-weight:700; margin-bottom:0.5rem; }
    .event-body h3 { font-family:var(--font-display); font-size:1.15rem; font-weight:700; margin-bottom:0.5rem; }
    .event-body p { font-size:0.88rem; color:var(--mid); line-height:1.65; flex:1; }
    .event-meta {
      display:flex; gap:1rem; margin-top:1rem; padding-top:1rem;
      border-top:1px solid var(--cream); font-size:0.8rem; color:var(--mid);
      flex-wrap:wrap;
    }
    .event-meta span { display:flex; align-items:center; gap:0.4rem; }
    .event-meta svg { width:14px;height:14px;flex-shrink:0; }
    .no-events { text-align:center; padding:4rem 1rem; color:var(--mid); grid-column:1/-1; }
    .no-events p { margin-top:1rem; font-size:0.95rem; }

    /* ====== GALLERY ====== */
    .gallery { background:var(--white); }
    .gallery-header { text-align:center; max-width:540px; margin:0 auto 2.5rem; }
    .gallery-grid {
      display:grid;
      grid-template-columns:repeat(4,1fr);
      grid-template-rows:repeat(2,200px);
      gap:10px;
    }
    .gallery-item {
      border-radius:var(--radius-sm); overflow:hidden; cursor:pointer;
      background:linear-gradient(135deg,var(--teal-light),var(--teal-dark));
      display:flex;align-items:center;justify-content:center;
      transition:transform 0.3s,box-shadow 0.3s; position:relative;
    }
    .gallery-item img { width:100%;height:100%;object-fit:cover;position:absolute;inset:0; }
    .gallery-item:hover { transform:scale(1.02); box-shadow:0 8px 24px rgba(44,42,39,0.15); z-index:2; }
    .gallery-item:nth-child(1){background:linear-gradient(135deg,#c8ecea,#91d4ce)}
    .gallery-item:nth-child(2){background:linear-gradient(135deg,#eddfc8,#d4b283)}
    .gallery-item:nth-child(3){background:linear-gradient(135deg,#ead4ea,#c985c9);grid-column:span 2}
    .gallery-item:nth-child(4){background:linear-gradient(135deg,#c8ecea,#5ab5ab);grid-column:span 2}
    .gallery-item:nth-child(5){background:linear-gradient(135deg,#eddfc8,#c9a97a)}
    .gallery-item:nth-child(6){background:linear-gradient(135deg,#ead4ea,#c47bb5)}
    .gallery-placeholder-svg { position:relative;z-index:1; }
    .gallery-placeholder-svg svg { width:36px;height:36px;opacity:0.4; }

    /* ====== MISSION TEASER ====== */
    .mission-teaser {
      background: linear-gradient(135deg,#d4f0ec 0%,#f5e8d8 60%,#ecd4e8 100%);
      text-align:center;
    }
    .mission-teaser .inner { max-width:680px; margin:0 auto; }
    .mission-teaser blockquote {
      font-family:var(--font-display);
      font-size:clamp(1.3rem,3vw,2rem);
      font-style:italic; line-height:1.5;
      color:var(--dark); margin:1.5rem 0 2rem;
    }
    .mission-teaser blockquote em { color:var(--teal-dark); }

    /* ====== CONTACT ====== */
    .contact { background:var(--cream); }
    .contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:start; }
    .contact-info h2 { margin-bottom:1.25rem; }
    .contact-info p { font-size:1rem; line-height:1.8; color:var(--mid); margin-bottom:2rem; }
    .contact-links { display:flex; flex-direction:column; gap:0.85rem; }
    .contact-link {
      display:flex; align-items:center; gap:1rem;
      background:var(--white); border-radius:var(--radius-md);
      padding:1rem 1.25rem; box-shadow:var(--shadow-card);
      transition:box-shadow 0.2s,transform 0.2s;
    }
    .contact-link:hover { box-shadow:0 8px 28px rgba(44,42,39,0.13); transform:translateX(4px); }
    .contact-link-icon {
      width:44px; height:44px; border-radius:12px; flex-shrink:0;
      display:flex;align-items:center;justify-content:center;
    }
    .contact-link-icon svg { width:22px;height:22px; }
    .ci-insta{background:linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888)}
    .ci-email{background:var(--teal)}
    .ci-phone{background:var(--sand)}
    .ci-loc{background:var(--mauve)}
    .contact-link-text strong { display:block;font-size:0.72rem;text-transform:uppercase;letter-spacing:0.1em;color:var(--mid); }
    .contact-link-text span { font-size:0.95rem;font-weight:600;color:var(--dark); }
    .contact-form-wrap {
      background:var(--white); border-radius:var(--radius-lg); padding:2.5rem;
      box-shadow:var(--shadow-card);
    }
    .contact-form-wrap h3 { font-family:var(--font-display); font-size:1.5rem; margin-bottom:1.5rem; }
    .form-group { margin-bottom:1.25rem; }
    .form-group label { display:block;font-size:0.72rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--mid);margin-bottom:0.4rem; }
    .form-group input,.form-group textarea,.form-group select {
      width:100%; padding:0.8rem 1rem;
      border:1.5px solid rgba(201,169,122,0.25);
      border-radius:var(--radius-sm); font-family:inherit; font-size:0.95rem;
      background:var(--cream); color:var(--dark);
      outline:none; transition:border-color 0.2s,box-shadow 0.2s;
    }
    .form-group input:focus,.form-group textarea:focus,.form-group select:focus {
      border-color:var(--teal-dark); box-shadow:0 0 0 3px rgba(90,181,171,0.15);
    }
    .form-group textarea { min-height:110px; resize:vertical; }
    .form-submit {
      width:100%; background:var(--teal-dark); color:var(--white);
      padding:1rem; border-radius:50px;
      font-weight:700; font-size:1rem;
      transition:background 0.2s,transform 0.2s;
    }
    .form-submit:hover { background:var(--teal); transform:translateY(-2px); }
    .form-success { display:none; text-align:center; padding:2.5rem 1rem; }
    .form-success svg { width:56px;height:56px;margin:0 auto 1rem; }
    .form-success strong { display:block;font-size:1.1rem;margin-bottom:0.5rem;color:var(--teal-dark); }
    .form-success p { color:var(--mid);font-size:0.9rem; }

    /* ====== FOOTER ====== */
    footer { background:var(--dark); color:rgba(255,255,255,0.65); padding:3.5rem 5% 2rem; }
    .footer-inner { display:grid; grid-template-columns:2fr 1fr 1fr; gap:3rem; margin-bottom:2.5rem; }
    .footer-logo { height:40px; width:auto; margin-bottom:1rem; filter:brightness(0) invert(1) opacity(0.85); }
    .footer-brand p { font-size:0.875rem; line-height:1.75; max-width:300px; }
    footer h4 { font-size:0.68rem; text-transform:uppercase; letter-spacing:0.2em; color:var(--teal-light); margin-bottom:1rem; font-weight:700; }
    footer ul { list-style:none; display:flex; flex-direction:column; gap:0.55rem; }
    footer ul li a { font-size:0.875rem; transition:color 0.2s; }
    footer ul li a:hover { color:var(--white); }
    .footer-bottom { padding-top:1.5rem; border-top:1px solid rgba(255,255,255,0.08); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; }
    .footer-bottom p { font-size:0.78rem; }
    .social-links { display:flex; gap:0.6rem; }
    .social-link {
      width:36px;height:36px;border-radius:50%;
      background:rgba(255,255,255,0.08);
      display:flex;align-items:center;justify-content:center;
      transition:background 0.2s;
    }
    .social-link svg { width:16px;height:16px; }
    .social-link:hover { background:var(--teal-dark); }

    /* ====== RESPONSIVE ====== */
    @media(max-width:1000px){
      .photo-strip-inner { grid-template-columns:repeat(2,1fr); min-height:460px; }
    }
    @media(max-width:900px){
      .contact-grid { grid-template-columns:1fr; gap:2.5rem; }
      .footer-inner { grid-template-columns:1fr 1fr; }
      .footer-brand { grid-column:span 2; }
      .gallery-grid { grid-template-columns:repeat(2,1fr); grid-template-rows:auto; }
      .gallery-item { height:160px; }
      .gallery-item:nth-child(3),.gallery-item:nth-child(4) { grid-column:span 1; }
    }
    @media(max-width:620px){
      nav { padding:0 4%; }
      .nav-links { display:none; }
      .hamburger { display:flex; }
      .hero { min-height: 96dvh; }
      .hero-content { justify-content: flex-start; padding: 3.3rem 4% 5.3rem; }
      .hero-title { font-size: clamp(3.05rem, 10vw, 4.1rem); }
      .hero-sub { font-size: 1.02rem; max-width: 96%; }
      .hero-garden {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 62px;
        height: 410px;
      }
      .garden-svg { transform: scale(1.56); transform-origin: bottom center; }
      section { padding:3.5rem 4%; }
      .photo-strip-inner { grid-template-columns:1fr 1fr; min-height:300px; }
      .footer-inner { grid-template-columns:1fr; }
      .footer-brand { grid-column:span 1; }
    }
    @media(max-width:440px){
      .photo-strip-inner { grid-template-columns:1fr; min-height:auto; }
      .photo-slot { height:220px; }
    }