/* =========================================================
   Sirena 21 Inc. — Stylesheet
   Design tokens live as CSS variables; Tailwind handles utility
   layout, this file handles bespoke components + motion.
   ========================================================= */

:root{
  --ocean:#0D3B66;
  --ocean-light:#1296DB;
  --turquoise:#1296DB;
  --mint:#F45BA3;
  --slate:#22313F;
  --slate-soft:#5B6B78;
  --card:#F3F6F8;
  --ease:cubic-bezier(.4,0,.2,1);
}

html{ scroll-behavior:smooth; }
body{ overflow-x:hidden; }

::selection{ background:var(--mint); color:var(--ocean); }

/* Focus states for accessibility */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
  outline:2px solid var(--turquoise);
  outline-offset:3px;
  border-radius:4px;
}

/* Skip link */
.skip-link{
  position:absolute; left:-999px; top:0; z-index:100;
  background:var(--ocean); color:#fff; padding:.75rem 1.25rem; border-radius:0 0 .5rem 0;
}
.skip-link:focus{ left:0; }

/* prefers-reduced-motion */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}

/* ============ HEADER ============ */
#site-header{
  background:rgba(255,255,255,0.7);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;
}
#site-header.scrolled{
  background:rgba(255,255,255,0.92);
  border-bottom:1px solid rgba(13,59,102,0.08);
  box-shadow:0 8px 30px -12px rgba(13,59,102,0.15);
}

.nav-link{
  position:relative;
  font-weight:500; font-size:.95rem; color:var(--slate);
  transition:color .25s var(--ease);
}
.nav-link::after{
  content:''; position:absolute; left:0; bottom:-6px; width:0; height:2px;
  background:linear-gradient(90deg,var(--ocean),var(--turquoise));
  transition:width .3s var(--ease);
}
.nav-link:hover{ color:var(--ocean); }
.nav-link:hover::after{ width:100%; }

/* Hamburger */
.hamburger{ display:block; width:24px; height:18px; position:relative; }
.hamburger span{
  position:absolute; left:0; width:100%; height:2px; border-radius:2px;
  background:var(--ocean); transition:transform .3s var(--ease), opacity .3s var(--ease), top .3s var(--ease);
}
.hamburger span:nth-child(1){ top:0; }
.hamburger span:nth-child(2){ top:8px; }
.hamburger span:nth-child(3){ top:16px; }
#menu-btn[aria-expanded="true"] .hamburger span:nth-child(1){ top:8px; transform:rotate(45deg); }
#menu-btn[aria-expanded="true"] .hamburger span:nth-child(2){ opacity:0; }
#menu-btn[aria-expanded="true"] .hamburger span:nth-child(3){ top:8px; transform:rotate(-45deg); }

.mobile-menu{
  max-height:0; overflow:hidden; opacity:0;
  background:rgba(255,255,255,0.98); backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(13,59,102,0.08);
  transition:max-height .4s var(--ease), opacity .3s var(--ease);
}
.mobile-menu.open{ max-height:520px; opacity:1; }
.mobile-link{
  padding:.85rem 0.25rem; font-weight:500; color:var(--slate);
  border-bottom:1px solid rgba(13,59,102,0.06);
  transition:color .2s var(--ease), padding-left .2s var(--ease);
}
.mobile-link:hover{ color:var(--ocean); padding-left:.5rem; }

/* ============ BUTTONS ============ */
.btn-primary, .btn-secondary, .btn-cta{
  position:relative; overflow:hidden;
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-family:'Poppins',sans-serif; font-weight:600; font-size:.95rem;
  padding:.85rem 1.6rem; border-radius:999px;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), filter .3s var(--ease);
  cursor:pointer; white-space:nowrap;
}
.btn-primary{
  color:#fff;
  background:linear-gradient(135deg,var(--ocean),var(--turquoise));
  box-shadow:0 10px 25px -8px rgba(13,59,102,0.45);
}
.btn-primary:hover{ transform:translateY(-3px); box-shadow:0 18px 32px -8px rgba(13,59,102,0.5); filter:brightness(1.05); }

.btn-secondary{
  color:var(--ocean);
  background:#fff;
  border:1.5px solid rgba(13,59,102,0.18);
}
.btn-secondary:hover{ transform:translateY(-3px); border-color:var(--turquoise); box-shadow:0 14px 28px -10px rgba(13,59,102,0.2); }

.btn-cta{
  color:var(--ocean);
  background:#fff;
  padding:1rem 2.2rem; font-size:1.02rem;
  box-shadow:0 16px 34px -10px rgba(0,0,0,0.35);
}
.btn-cta:hover{ transform:translateY(-3px) scale(1.02); }

.btn-lg{ padding:1rem 2rem; font-size:1rem; }

/* Ripple effect */
.ripple{
  position:absolute; border-radius:50%; transform:scale(0);
  background:rgba(255,255,255,0.55); animation:ripple .6s var(--ease);
  pointer-events:none;
}
@keyframes ripple{ to{ transform:scale(3); opacity:0; } }

/* ============ SHARED SECTION STYLES ============ */
.section-pad{ padding-top:6rem; padding-bottom:6rem; }
.section-head{ max-width:640px; margin:0 auto; text-align:center; }
.section-title{
  font-family:'Poppins',sans-serif; font-weight:700; color:var(--ocean);
  font-size:clamp(1.9rem,3vw,2.6rem); line-height:1.15; margin-top:.75rem;
}
.section-sub{ color:var(--slate-soft); font-size:1.05rem; margin-top:1rem; }

.eyebrow{
  display:inline-flex; align-items:center; gap:.4rem;
  font-family:'Poppins',sans-serif; font-weight:600; font-size:.8rem; letter-spacing:.06em;
  text-transform:uppercase; color:var(--turquoise);
  background:rgba(18,150,219,0.08); padding:.4rem .9rem; border-radius:999px;
}
.eyebrow-light{ color:var(--mint); background:rgba(244,91,163,0.12); }
.eyebrow-mark{ color:var(--mint); }

/* ============ HERO ============ */
.hero-section{
  background:
    radial-gradient(ellipse 80% 60% at 15% 0%, rgba(18,150,219,0.10), transparent 60%),
    radial-gradient(ellipse 60% 50% at 100% 10%, rgba(244,91,163,0.14), transparent 60%),
    #ffffff;
}
.blob{
  position:absolute; border-radius:50%; filter:blur(60px); z-index:0; opacity:.55;
}
.blob-1{ width:420px; height:420px; background:radial-gradient(circle,var(--mint),transparent 70%); top:-120px; right:-80px; }
.blob-2{ width:320px; height:320px; background:radial-gradient(circle,var(--turquoise),transparent 70%); bottom:-100px; left:-60px; }

.sparkle-field{ position:absolute; inset:0; pointer-events:none; z-index:0; }
.sparkle{ position:absolute; color:var(--turquoise); opacity:.5; animation:twinkle 3.2s ease-in-out infinite; }
.sparkle-light{ color:var(--mint); }
.sparkle.s1{ top:18%; left:6%; font-size:1.4rem; animation-delay:0s; }
.sparkle.s2{ top:65%; left:12%; font-size:1rem; animation-delay:.8s; }
.sparkle.s3{ top:30%; right:10%; font-size:1.2rem; animation-delay:1.4s; }
@keyframes twinkle{ 0%,100%{ opacity:.25; transform:scale(1);} 50%{ opacity:.8; transform:scale(1.3);} }

.hero-logo-wrap{ position:relative; z-index:1; }
.hero-logo-frame{
  aspect-ratio:1/1; border-radius:50%;
  /* background:linear-gradient(145deg,var(--ocean),var(--ocean-light) 45%,var(--turquoise)); */
  /* display:flex; align-items:center; justify-content:center;  */
  box-shadow:0 30px 60px -20px rgba(13,59,102,0.45);
}
.hero-logo-img{
  width:100%; height:100%; object-fit:contain;
  filter:drop-shadow(0 14px 26px rgba(0,0,0,0.25));
}
.floating{ animation:floaty 6s ease-in-out infinite; }
@keyframes floaty{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-16px);} }

.floating-badge{
  position:absolute; bottom:-1.25rem; left:-1.25rem; z-index:2;
  background:#fff; border-radius:1.1rem; padding:1rem 1.25rem;
  box-shadow:0 20px 40px -14px rgba(13,59,102,0.3);
}
.floating-badge-2{ top:1.5rem; right:-1rem; left:auto; bottom:auto; }
.badge-icon{
  width:2.6rem; height:2.6rem; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,var(--ocean),var(--turquoise)); color:#fff; font-size:1.1rem;
}
.badge-icon-mint{ background:linear-gradient(135deg,var(--turquoise),var(--mint)); }

.wave-divider{ position:absolute; left:0; right:0; bottom:-2px; line-height:0; z-index:0; }
.wave-divider svg{ width:100%; height:70px; display:block; }
.wave-divider path{ fill:var(--card); }

.placeholder-label{
  font-family:'Inter',sans-serif; font-size:.7rem; letter-spacing:.03em;
  background:rgba(255,255,255,0.15); padding:.25rem .6rem; border-radius:999px;
}

/* ============ FEATURE CARDS ============ */
.feature-card{
  background:#fff; border:1px solid rgba(13,59,102,0.06);
  border-radius:1.5rem; padding:2rem; text-align:left;
  box-shadow:0 10px 30px -18px rgba(13,59,102,0.15);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.feature-card:hover{ transform:translateY(-6px); box-shadow:0 24px 40px -18px rgba(13,59,102,0.25); border-color:rgba(18,150,219,0.25); }
.feature-icon{
  width:3.2rem; height:3.2rem; border-radius:1rem; margin-bottom:1.1rem;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,rgba(13,59,102,0.08),rgba(244,91,163,0.18));
  color:var(--ocean);
}
.feature-icon svg{ width:1.5rem; height:1.5rem; }
.feature-title{ font-family:'Poppins',sans-serif; font-weight:600; font-size:1.15rem; color:var(--slate); margin-bottom:.5rem; }
.feature-text{ color:var(--slate-soft); font-size:.95rem; line-height:1.55; }

/* ============ SERVICE CARDS ============ */
.service-card{
  background:#fff; border-radius:1.5rem; padding:2rem 1.75rem;
  box-shadow:0 10px 26px -18px rgba(13,59,102,0.15);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
  display:flex; flex-direction:column; text-align:left; border:none; cursor:pointer;
  width:100%;
}
.service-card:hover{ transform:translateY(-8px) scale(1.015); box-shadow:0 26px 44px -18px rgba(13,59,102,0.28); }
.service-icon{
  width:3rem; height:3rem; border-radius:.85rem; margin-bottom:1.2rem;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,var(--ocean),var(--turquoise)); color:#fff;
}
.service-icon svg{ width:1.4rem; height:1.4rem; }
.service-title{ font-family:'Poppins',sans-serif; font-weight:600; font-size:1.05rem; color:var(--slate); margin-bottom:.5rem; }
.service-text{ color:var(--slate-soft); font-size:.9rem; line-height:1.55; flex:1; }
.service-link{
  margin-top:1.1rem; font-family:'Poppins',sans-serif; font-weight:600; font-size:.88rem;
  color:var(--turquoise); transition:gap .25s var(--ease), color .25s var(--ease);
}
.service-card:hover .service-link{ color:var(--ocean); }

/* Service details modal */
.service-modal-card{
  background:#fff; border-radius:1.5rem; padding:2.25rem 2rem;
  max-height:80vh; overflow-y:auto;
}
.service-modal-title{
  font-family:'Poppins',sans-serif; font-weight:700; font-size:1.5rem; color:var(--ocean);
}
.service-modal-desc{ color:var(--slate-soft); margin-top:.6rem; font-size:1rem; line-height:1.55; }
.service-modal-list{
  margin-top:1.5rem; display:grid; gap:.7rem;
  grid-template-columns:repeat(auto-fit, minmax(220px,1fr));
}
.service-modal-list li{
  display:flex; align-items:flex-start; gap:.6rem; font-size:.92rem; color:var(--slate);
}
.service-modal-list li::before{
  content:'✓'; flex-shrink:0; width:1.4rem; height:1.4rem; border-radius:50%;
  background:rgba(18,150,219,0.12); color:var(--ocean); font-size:.75rem; font-weight:700;
  display:flex; align-items:center; justify-content:center; margin-top:.1rem;
}

/* ============ SERVICE AREAS ============ */
.area-chip{
  display:flex; align-items:center; gap:.6rem;
  background:#fff; border:1px solid rgba(13,59,102,0.08);
  border-radius:.9rem; padding:.85rem 1rem; font-weight:500; font-size:.92rem;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.area-chip:hover{ transform:translateY(-3px); box-shadow:0 12px 24px -14px rgba(13,59,102,0.25); border-color:rgba(18,150,219,0.3); }
.area-dot{ width:.55rem; height:.55rem; border-radius:50%; background:linear-gradient(135deg,var(--turquoise),var(--mint)); flex-shrink:0; }

.map-placeholder{
  aspect-ratio:4/3; border-radius:1.75rem;
  background:linear-gradient(160deg,var(--ocean-light),var(--turquoise));
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1rem;
  color:rgba(255,255,255,0.85);
  box-shadow:0 26px 50px -18px rgba(13,59,102,0.35);
}
.map-placeholder-tall{ aspect-ratio:3/4; border-radius:1.5rem; }

.contact-map-frame{
  overflow:hidden; background:#fff;
  box-shadow:0 26px 50px -18px rgba(13,59,102,0.25);
  border:1px solid rgba(13,59,102,0.06);
}
.contact-map-img{ width:100%; height:100%; object-fit:cover; display:block; }

/* ============ AREA SEARCH ============ */
.area-search-wrap{ position:relative; margin-bottom:1.25rem; }
.area-search-icon{
  position:absolute; left:1rem; top:50%; transform:translateY(-50%);
  width:1.1rem; height:1.1rem; color:var(--slate-soft); pointer-events:none;
}
.area-search-wrap input{
  width:100%; padding:.85rem 1rem .85rem 2.6rem; border-radius:999px;
  border:1.5px solid rgba(13,59,102,0.14); font-family:'Inter',sans-serif; font-size:.92rem; color:var(--slate);
  transition:border-color .25s var(--ease), box-shadow .25s var(--ease);
}
.area-search-wrap input:focus{ outline:none; border-color:var(--turquoise); box-shadow:0 0 0 4px rgba(18,150,219,0.12); }

/* ============ COUNTY TABS ============ */
.county-tabs{ display:flex; flex-wrap:wrap; gap:.6rem; margin-bottom:1.25rem; }
.county-tab{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:'Poppins',sans-serif; font-weight:600; font-size:.88rem; color:var(--slate-soft);
  background:#fff; border:1.5px solid rgba(13,59,102,0.12); border-radius:999px;
  padding:.6rem 1.1rem; transition:border-color .25s var(--ease), color .25s var(--ease), background .25s var(--ease), box-shadow .25s var(--ease);
}
.county-tab:hover{ border-color:rgba(18,150,219,0.4); }
.county-tab.active{
  color:#fff; border-color:transparent;
  background:linear-gradient(135deg,var(--ocean),var(--turquoise));
  box-shadow:0 10px 22px -10px rgba(13,59,102,0.4);
}
.county-tab-dot{ width:.5rem; height:.5rem; border-radius:50%; flex-shrink:0; }
.county-count{
  font-size:.72rem; font-weight:700; background:rgba(255,255,255,0.25);
  padding:.1rem .5rem; border-radius:999px;
}
.county-tab:not(.active) .county-count{ background:rgba(13,59,102,0.08); color:var(--ocean); }

.county-panel{ animation:panelFade .35s var(--ease); }
@keyframes panelFade{ from{ opacity:0; transform:translateY(6px);} to{ opacity:1; transform:translateY(0);} }

.area-chip-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:.65rem; max-height:340px; overflow-y:auto; padding-right:.35rem; }
.area-chip-grid::-webkit-scrollbar{ width:6px; }
.area-chip-grid::-webkit-scrollbar-thumb{ background:rgba(13,59,102,0.15); border-radius:999px; }

.area-chip{ font-size:.86rem; padding:.65rem .85rem; }
.area-chip.filtered-out{ display:none; }

.dot-orange{ background:linear-gradient(135deg,var(--ocean),var(--turquoise)); }
.dot-osceola{ background:linear-gradient(135deg,var(--turquoise),var(--mint)); }

.area-empty{
  font-size:.88rem; color:var(--slate-soft); background:var(--card);
  border-radius:.85rem; padding:.9rem 1.1rem; margin-top:.5rem;
}
.area-empty a{ color:var(--ocean); font-weight:600; text-decoration:underline; }

/* ============ INTERACTIVE COUNTY MAP ============ */
.map-widget{
  position:relative; border-radius:1.75rem; overflow:hidden; box-shadow:0 26px 50px -18px rgba(13,59,102,0.25);
  border:1px solid rgba(13,59,102,0.06);
}
.map-widget svg{ width:100%; height:auto; display:block; }

.map-compass-label{ font-family:'Poppins',sans-serif; font-weight:700; font-size:11px; fill:#0D3B66; fill-opacity:.5; text-anchor:middle; }

.map-road-label{
  font-family:'Inter',sans-serif; font-weight:600; font-size:11px; letter-spacing:.03em;
  fill:#0D3B66; fill-opacity:0.3;
}

.map-county-label{
  font-family:'Poppins',sans-serif; font-weight:700; font-size:14px; letter-spacing:.08em;
  fill:#0D3B66; fill-opacity:0.4; text-anchor:middle; pointer-events:none; transition:opacity .4s var(--ease);
}
.map-county-label-osceola{ fill:#0e8a94; }
.map-county-label.is-dim{ opacity:0.35; }

/* Pins */
.map-pin{ cursor:pointer; transition:opacity .35s var(--ease), transform .25s var(--ease); }
.map-pin.is-dim{ opacity:0.25; }
.map-pin:hover, .map-pin:focus, .map-pin.pin-highlight{ transform:scale(1.3); outline:none; }
.map-pin:focus .pin-dot{ stroke-width:3; }

.pin-dot{ fill:#0D3B66; stroke:#ffffff; stroke-width:2; transition:fill .25s var(--ease); }
.pin-dot-osceola{ fill:#1296DB; }
.pin-dot-hub{ fill:#0D3B66; }
.map-pin.pin-highlight .pin-dot{ fill:#F45BA3; stroke:#0D3B66; }

.pin-pulse{
  fill:#0D3B66; opacity:.25; transform-origin:center;
  animation:pinPulse 2.6s ease-out infinite;
}
.pin-pulse-osceola{ fill:#1296DB; }
@keyframes pinPulse{ 0%{ transform:scale(0.7); opacity:.45;} 100%{ transform:scale(2.4); opacity:0;} }

.pin-label{
  font-family:'Poppins',sans-serif; font-weight:600; font-size:12px; fill:#0D3B66;
  text-anchor:middle; paint-order:stroke; stroke:#ffffff; stroke-width:4px; stroke-linejoin:round;
  pointer-events:none;
}
.pin-label-hub{ font-size:13px; font-weight:700; }

/* Locator inset (real Florida silhouette for context) */
.locator-box{
  position:absolute; top:1rem; right:1rem; width:96px;
  background:rgba(255,255,255,0.92); backdrop-filter:blur(6px);
  border-radius:.9rem; padding:.6rem .5rem .5rem; text-align:center;
  box-shadow:0 10px 24px -12px rgba(13,59,102,0.3); z-index:3;
}
.locator-svg{ width:100%; height:auto; display:block; }
.locator-caption{ display:block; font-size:.6rem; line-height:1.3; color:var(--slate-soft); margin-top:.3rem; font-weight:600; }
.locator-dot{ fill:var(--turquoise); }
.locator-pulse{ fill:var(--turquoise); opacity:.4; animation:pinPulse 2.6s ease-out infinite; }

/* Tooltip */
.map-tooltip{
  position:absolute; left:0; top:0; z-index:4; pointer-events:none;
  transform:translate(-50%,-135%); opacity:0; transition:opacity .18s var(--ease), transform .18s var(--ease);
  background:var(--ocean); color:#fff; font-family:'Poppins',sans-serif; font-weight:600; font-size:.78rem;
  padding:.4rem .8rem; border-radius:.6rem; white-space:nowrap; box-shadow:0 10px 20px -8px rgba(13,59,102,0.4);
}
.map-tooltip::after{
  content:''; position:absolute; left:50%; top:100%; transform:translateX(-50%);
  border:5px solid transparent; border-top-color:var(--ocean);
}
.map-tooltip.show{ opacity:1; transform:translate(-50%,-150%); }

/* Sidebar chip <-> map cross-highlight */
.area-chip{ cursor:pointer; transition:transform .2s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease); }
.area-chip.chip-highlight{ background:linear-gradient(135deg,rgba(18,150,219,0.12),rgba(244,91,163,0.18)); transform:translateY(-2px); box-shadow:0 10px 20px -12px rgba(13,59,102,0.25); }

.map-legend{
  display:flex; gap:1.5rem; justify-content:center; margin-top:1.25rem;
  font-size:.85rem; color:var(--slate-soft); font-weight:500;
}
.map-legend span{ display:inline-flex; align-items:center; gap:.5rem; }
.legend-dot{ width:.7rem; height:.7rem; border-radius:50%; display:inline-block; }

/* ============ GALLERY / MASONRY ============ */
.masonry{
  columns:1; column-gap:1.25rem;
}
@media(min-width:640px){ .masonry{ columns:2; } }
@media(min-width:1024px){ .masonry{ columns:3; } }
.gallery-item{
  break-inside:avoid; width:100%; margin-bottom:1.25rem;
  aspect-ratio:4/3; border-radius:1.25rem; position:relative; overflow:hidden;
  background:linear-gradient(150deg,var(--ocean),var(--turquoise));
  cursor:pointer; border:none; padding:0;
  transition:transform .4s var(--ease), box-shadow .4s var(--ease);
}
.gallery-item.tall{ aspect-ratio:4/5; }
.gallery-item:hover{ transform:scale(1.035); box-shadow:0 24px 44px -16px rgba(13,59,102,0.4); }
.gallery-item:hover .gallery-img{ transform:scale(1.1); }
.gallery-img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .5s var(--ease);
}
.gallery-tag{
  position:absolute; top:1rem; left:1rem;
  font-size:.7rem; font-weight:600; letter-spacing:.04em; color:#fff;
  background:rgba(13,59,102,0.55); backdrop-filter:blur(3px);
  padding:.3rem .7rem; border-radius:999px;
}

/* Lightbox / modal (shared) */
.lightbox{
  position:fixed; inset:0; z-index:100;
  background:rgba(8,30,42,0.88); backdrop-filter:blur(6px);
  display:flex; align-items:center; justify-content:center; padding:1.5rem;
  opacity:0; visibility:hidden; transition:opacity .3s var(--ease);
}
.lightbox.open{ opacity:1; visibility:visible; }
.lightbox-inner{ width:100%; max-width:720px; position:relative; }
.lightbox-inner-narrow{ max-width:640px; }
.lightbox-close{
  position:absolute; top:-2.75rem; right:0; color:#fff; font-size:2rem; line-height:1;
  background:none; border:none; cursor:pointer; transition:transform .25s var(--ease);
}
.lightbox-close:hover{ transform:rotate(90deg); }
.lightbox-panel{
  aspect-ratio:4/3; border-radius:1rem; background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.12); overflow:hidden; position:relative;
}
.lightbox-img{ width:100%; height:100%; object-fit:cover; display:block; }
.panel-tag{
  position:absolute; top:.75rem; left:.75rem; z-index:1;
  font-size:.75rem; font-weight:600; letter-spacing:.04em; color:#fff;
  background:rgba(13,59,102,0.6); backdrop-filter:blur(3px); padding:.3rem .8rem; border-radius:999px;
}
.panel-tag-mint{ background:rgba(15,110,100,0.6); color:var(--mint); }

/* ============ VIDEO CARDS ============ */
.video-card{
  background:#fff; border-radius:1.5rem; overflow:hidden; text-align:left;
  box-shadow:0 10px 26px -18px rgba(13,59,102,0.15); cursor:pointer; border:none;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
  display:flex; flex-direction:column;
}
.video-card:hover{ transform:translateY(-6px); box-shadow:0 22px 40px -18px rgba(13,59,102,0.25); }
.video-thumb{
  aspect-ratio:16/10; position:relative; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(150deg,var(--ocean),var(--turquoise));
}
.video-preview{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  pointer-events:none;
}
.play-btn{
  position:relative; z-index:1;
  width:3.4rem; height:3.4rem; border-radius:50%; background:rgba(255,255,255,0.92);
  color:var(--ocean); display:flex; align-items:center; justify-content:center;
  font-size:1.1rem; padding-left:3px; transition:transform .3s var(--ease);
  box-shadow:0 10px 22px -8px rgba(0,0,0,0.35);
}
.video-card:hover .play-btn{ transform:scale(1.12); }
.play-btn-lg{ width:5rem; height:5rem; font-size:1.6rem; }
.video-info{ padding:1.25rem 1.4rem; display:flex; flex-direction:column; gap:.4rem; }
.video-title{ font-family:'Poppins',sans-serif; font-weight:600; color:var(--slate); }
.video-desc{ font-size:.88rem; color:var(--slate-soft); line-height:1.5; }
.video-player-frame{
  aspect-ratio:16/9; border-radius:1rem; overflow:hidden;
  background:#000; border:1px solid rgba(255,255,255,0.12);
}
.video-player-frame video{ width:100%; height:100%; display:block; }

/* ============ TESTIMONIALS ============ */
.bg-ocean{ background:linear-gradient(160deg,var(--ocean),var(--ocean-light) 60%, #0c5a7d); }
.testimonial-carousel{ position:relative; overflow:hidden; }
.testimonial-track{ display:flex; transition:transform .6s var(--ease); }
.testimonial-slide{
  min-width:100%; text-align:center; padding:0 1rem;
  display:flex; flex-direction:column; align-items:center;
}
.avatar-placeholder{
  width:4rem; height:4rem; border-radius:50%; margin-bottom:1.1rem;
  background:linear-gradient(135deg,var(--turquoise),var(--mint));
  color:var(--ocean); font-family:'Poppins',sans-serif; font-weight:700;
  display:flex; align-items:center; justify-content:center; font-size:1.15rem;
}
.stars{ color:var(--mint); letter-spacing:.15em; margin-bottom:1rem; }
.testimonial-text{ color:rgba(255,255,255,0.92); font-size:1.2rem; line-height:1.6; max-width:640px; font-style:italic; }
.testimonial-footer{ margin-top:1.4rem; display:flex; flex-direction:column; gap:.2rem; color:#fff; }
.carousel-controls{ display:flex; align-items:center; justify-content:center; gap:1.5rem; margin-top:2.5rem; }
.carousel-btn{
  width:2.75rem; height:2.75rem; border-radius:50%; border:1px solid rgba(255,255,255,0.25);
  color:#fff; background:rgba(255,255,255,0.06); transition:background .25s var(--ease), transform .25s var(--ease);
}
.carousel-btn:hover{ background:rgba(255,255,255,0.16); transform:scale(1.06); }
.carousel-dots{ display:flex; gap:.5rem; }
.carousel-dot{ width:.55rem; height:.55rem; border-radius:50%; background:rgba(255,255,255,0.3); transition:background .3s var(--ease), transform .3s var(--ease); }
.carousel-dot.active{ background:var(--mint); transform:scale(1.3); }

/* ============ STATS ============ */
.stat-card{ padding:1.5rem 1rem; }
.stat-number{ font-family:'Poppins',sans-serif; font-weight:800; font-size:clamp(2.2rem,4vw,3rem); color:var(--ocean); }
.stat-label{ color:var(--slate-soft); font-size:.95rem; margin-top:.35rem; }

/* ============ CTA ============ */
.cta-section{
  padding:5.5rem 1.5rem;
  background:linear-gradient(135deg,var(--ocean),var(--ocean-light) 50%,var(--turquoise));
}

/* ============ CONTACT ============ */
.contact-card{
  display:flex; flex-direction:column; gap:.5rem;
  background:#fff; border-radius:1.4rem; padding:1.6rem 1.5rem;
  box-shadow:0 12px 28px -18px rgba(13,59,102,0.18);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
a.contact-card:hover{ transform:translateY(-5px); box-shadow:0 22px 38px -18px rgba(13,59,102,0.28); }
.contact-card-static{ cursor:default; }
.contact-card-icon{
  width:2.6rem; height:2.6rem; border-radius:.85rem; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background:rgba(18,150,219,0.1); color:var(--ocean); font-size:1.2rem;
}
.contact-card-label{ font-size:.8rem; font-weight:600; color:var(--slate-soft); text-transform:uppercase; letter-spacing:.04em; margin-top:.3rem; }
.contact-card-value{ font-family:'Poppins',sans-serif; font-weight:600; font-size:1.05rem; color:var(--slate); line-height:1.4; }

.social-icon{
  width:2.4rem; height:2.4rem; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:rgba(18,150,219,0.1); color:var(--ocean); font-weight:600; font-size:.9rem;
  transition:transform .25s var(--ease), background .25s var(--ease), color .25s var(--ease);
}
.social-icon:hover{ transform:translateY(-3px); background:var(--ocean); color:#fff; }
.social-icon-dark{ background:rgba(255,255,255,0.08); color:rgba(255,255,255,0.8); }
.social-icon-dark:hover{ background:var(--mint); color:var(--ocean); }

/* ============ FOOTER ============ */
.footer{ background:#0B2233; color:#fff; }
.footer-heading{ font-family:'Poppins',sans-serif; font-weight:600; margin-bottom:1.1rem; font-size:.95rem; }
.footer-links{ display:flex; flex-direction:column; gap:.7rem; }
.footer-links a{ color:rgba(255,255,255,0.6); font-size:.9rem; transition:color .2s var(--ease), padding-left .2s var(--ease); }
.footer-links a:hover{ color:var(--mint); padding-left:.3rem; }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,0.08); margin-top:3rem; padding-top:1.75rem;
  text-align:center; color:rgba(255,255,255,0.45); font-size:.85rem;
}

/* ============ SCROLL ANIMATIONS ============ */
[data-animate]{ opacity:0; transition:opacity .8s var(--ease), transform .8s var(--ease); }
[data-animate="fade-up"]{ transform:translateY(28px); }
[data-animate="fade-left"]{ transform:translateX(40px); }
[data-animate="fade-right"]{ transform:translateX(-40px); }
[data-animate="scale-in"]{ transform:scale(.92); }
[data-animate].in-view{ opacity:1; transform:translate(0,0) scale(1); }

/* Font weight utility classes referenced by Tailwind arbitrary usage */
.font-700{ font-weight:700; }
.font-600{ font-weight:600; }
.font-800{ font-weight:800; }