@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&family=Raleway:wght@300;400;500;600;700&display=swap');

/* Fix 4-column contact cards layout */
body .wp-container-core-columns-is-layout-c8d96ec6 {
	    flex-wrap: wrap !important;
}
.wp-block-column a[href*="JustAquatics"] {
	    word-break: break-all;
	    overflow-wrap: anywhere;
}
}
}

/* ============================================================
   JUST AQUATICS — DESIGN SYSTEM v1 (PHASE 1)
   Organic Biophilic · Lora + Raleway · Focused green palette
   ============================================================ */
:root {
  --wp--preset--font-family--fraunces:          'Lora', Georgia, serif;
  --wp--preset--font-family--newsreader:        'Lora', Georgia, serif;
  --wp--preset--font-family--crimson-pro:       'Lora', Georgia, serif;
  --wp--preset--font-family--eb-garamond:       'Lora', Georgia, serif;
  --wp--preset--font-family--instrument-serif:  'Lora', Georgia, serif;
  --wp--preset--font-family--dm-serif-display:  'Lora', Georgia, serif;
  --wp--preset--font-family--cabin:             'Raleway', system-ui, -apple-system, sans-serif;
  --ja-green:#15803D; --ja-emerald:#059669; --ja-amber:#D97706; --ja-cream:#FFFCF9; --ja-ink:#0F172A;
  --wp--preset--color--theme-4: #15803D;
}
body {
  --wp--preset--font-family--fraunces:          'Lora', Georgia, serif;
  --wp--preset--font-family--newsreader:        'Lora', Georgia, serif;
  --wp--preset--font-family--crimson-pro:       'Lora', Georgia, serif;
  --wp--preset--font-family--eb-garamond:       'Lora', Georgia, serif;
  --wp--preset--font-family--instrument-serif:  'Lora', Georgia, serif;
  --wp--preset--font-family--dm-serif-display:  'Lora', Georgia, serif;
  --wp--preset--font-family--cabin:             'Raleway', system-ui, sans-serif;
  --wp--preset--color--theme-4: #15803D;
}
a, .wp-block-button__link, .wp-element-button, button {
  transition: color 200ms ease, background-color 200ms ease, border-color 200ms ease, transform 200ms ease, box-shadow 200ms ease;
}
@media (prefers-reduced-motion: reduce) {
  a, .wp-block-button__link, .wp-element-button, button { transition: none; }
}

/* Immersive Motion & Depth Layer */
:root{--jq-tilt-max:7deg}html.jq-anim-ready .jq-reveal{opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.22,.9,.34,1),transform .8s cubic-bezier(.22,.9,.34,1);will-change:opacity,transform}html.jq-anim-ready .jq-reveal.jq-visible{opacity:1;transform:translateY(0)}.jq-tilt{transition:transform .35s cubic-bezier(.22,.9,.34,1),box-shadow .35s ease;will-change:transform}.jq-tilt:hover{box-shadow:0 24px 48px -12px rgba(20,40,30,.28),0 8px 16px -8px rgba(20,40,30,.18);z-index:2}.wp-block-button__link,a.button,.single_add_to_cart_button,.added_to_cart,.wc-block-components-product-button__button{transition:transform .25s cubic-bezier(.22,.9,.34,1),box-shadow .25s ease!important}.wp-block-button__link:hover,a.button:hover,.single_add_to_cart_button:hover,.added_to_cart:hover,.wc-block-components-product-button__button:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 14px 28px -8px rgba(20,40,30,.35)}.wp-block-button__link:active,a.button:active,.single_add_to_cart_button:active{transform:translateY(-1px) scale(.99)}.jq-bubbles{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1}.jq-bubble{position:absolute;bottom:-10%;border-radius:50%;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.85),rgba(255,255,255,.15) 60%,rgba(255,255,255,0) 75%);opacity:0;animation-name:jq-rise;animation-timing-function:ease-in;animation-iteration-count:infinite}@keyframes jq-rise{0%{transform:translate(0,0) scale(.6);opacity:0}8%{opacity:.85}92%{opacity:.5}100%{transform:translate(var(--jq-drift,10px),-120%) scale(1);opacity:0}}@media (prefers-reduced-motion:reduce){.jq-bubble{display:none!important}html.jq-anim-ready .jq-reveal{opacity:1!important;transform:none!important;transition:none!important}.jq-tilt:hover{transform:none!important}.wp-block-button__link:hover,a.button:hover,.single_add_to_cart_button:hover{transform:none!important}}@media (max-width:640px){.jq-bubble{display:none}}

/* Immersive Motion v2 - amplified for visibility */
.jq-bubble{opacity:0 !important}
@media (prefers-reduced-motion:no-preference){
.wp-block-cover>img.wp-block-cover__image-background{animation:jq-kenburns 18s ease-in-out infinite alternate;transform-origin:center center}
@keyframes jq-kenburns{0%{transform:scale(1)}100%{transform:scale(1.12) translate(-1.5%,-1.5%)}}
.wp-block-button__link{animation:jq-pulse 2.6s ease-in-out infinite}
@keyframes jq-pulse{0%,100%{box-shadow:0 0 0 0 rgba(37,99,60,.35)}50%{box-shadow:0 0 0 10px rgba(37,99,60,0)}}
.jq-bubble2{position:absolute;bottom:-15%;border-radius:50%;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.98),rgba(200,255,230,.4) 55%,rgba(255,255,255,0) 78%);box-shadow:0 0 8px 1px rgba(255,255,255,.5);opacity:0;animation-name:jq-rise2;animation-timing-function:ease-in;animation-iteration-count:infinite;pointer-events:none}
@keyframes jq-rise2{0%{transform:translate(0,0) scale(.5);opacity:0}10%{opacity:1}85%{opacity:.9}100%{transform:translate(var(--jq-drift,14px),-135%) scale(1.15);opacity:0}}
}
@media (prefers-reduced-motion:reduce){.jq-bubble2{display:none !important}.wp-block-button__link{animation:none !important}.wp-block-cover>img.wp-block-cover__image-background{animation:none !important}}




/* Fix bubble starting position - percentage bottom was resolving against wrong ancestor */
.jq-bubble2{bottom:-30px !important}


/* Water ripple cursor effect (replaces bubbles) */
.jq-bubbles{display:none !important}
.jq-ripple{position:fixed;left:0;top:0;pointer-events:none;border-radius:50%;width:16px;height:16px;margin-left:-8px;margin-top:-8px;border:1.5px solid rgba(255,255,255,.5);box-shadow:0 0 14px 2px rgba(255,255,255,.15) inset,0 0 10px rgba(160,255,210,.2);opacity:.65;transform:scale(.4);animation:jq-ripple-anim 1.05s ease-out forwards;z-index:5}
@keyframes jq-ripple-anim{0%{transform:scale(.4);opacity:.65}100%{transform:scale(3.6);opacity:0}}
@media (prefers-reduced-motion:reduce){.jq-ripple{display:none !important}}


/* Button hover bubbles */
.jq-btn-bubble{position:fixed;pointer-events:none;border-radius:50%;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.95),rgba(180,255,220,.4) 55%,rgba(255,255,255,0) 75%);opacity:0;animation:jq-btn-bubble-rise 1.3s ease-out forwards;z-index:20}
@keyframes jq-btn-bubble-rise{0%{transform:translate(0,0) scale(.5);opacity:0}15%{opacity:.9}100%{transform:translate(var(--bx,0px),-64px) scale(1.1);opacity:0}}
@media (prefers-reduced-motion:reduce){.jq-btn-bubble{display:none !important}}


/* Fix collapsed-width text inside column cards */
.wp-block-columns{min-width:0}
.wp-block-columns > .wp-block-column{min-width:0;flex-basis:0;flex-grow:1}
.wp-block-column > p, .wp-block-column > h1, .wp-block-column > h2, .wp-block-column > h3, .wp-block-column > h4, .wp-block-column > .wp-block-heading, .wp-block-column > .wp-block-paragraph{width:100% !important;max-width:100% !important;box-sizing:border-box !important}


/* Fix Workshops/Farmers Markets/Partners cards - spacing--50 preset (~81px) was used as padding on narrow 3-col cards, leaving ~11px for text. Cap padding to something sane for these card columns. */
.wp-block-column.ja-card{padding:28px !important}
@media (max-width:781px){.wp-block-column.ja-card{padding:20px !important}}


/* Universal fix: cap column padding proportionally so narrow multi-column layouts keep readable content width */
.wp-block-columns > .wp-block-column{padding:clamp(10px, 4%, 24px) !important}
@media (max-width:600px){.wp-block-columns > .wp-block-column{padding:clamp(8px, 4%, 16px) !important}}


/* Decisive fix: let narrow multi-column rows wrap instead of squeezing columns unreadably thin */
.wp-block-columns{flex-wrap:wrap !important;row-gap:28px !important}
.wp-block-columns > .wp-block-column{flex:1 1 190px !important;min-width:190px !important;max-width:100% !important;padding:20px !important}
@media (max-width:479px){.wp-block-columns > .wp-block-column{flex-basis:100% !important;min-width:100% !important;padding:18px !important}}


