/* --------------------------------------------------------------
   Self-hosted Inter font (copied from Google Fonts .woff2)
   Keep these URLs exactly as-is if you want to continue using
   Google’s CDN .woff2 files, or download them and replace the
   URLs with /fonts/Inter-*.woff2 later.
   -------------------------------------------------------------- */

/* latin, latin-ext, greek, cyrillic, vietnamese ranges are all included */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7W0I5nvwU.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7W0I5nvwU.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7W0I5nvwU.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* -------------------------------------------------------------- */

:root{
  --bg: #ffffff;
  --ink: #0d1b2a;
  --muted: #545e69;
  --brand: #2e429b;        /* teal-blue */
  --brand-600: #4968f1;
  --brand-700: #0d5a66;
  --accent: #84c5d6;       /* light teal accent */
  --surface: #f6fafb;      /* soft background */
  --ring: rgba(31,122,140,0.35);
  --ok: #1f9d55;
  --warn: #b7791f;
  --error: #c53030;
}

/* CSS Reset */
*,*::before,*::after{box-sizing:border-box}
html:focus-within{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";color:var(--ink);background:var(--bg);line-height:1.6;display:flex;flex-direction:column;min-height:100vh}
/* Booking page background */
body.booking-bg{
  /* Base page color */
  background-color: var(--bg);
  /* Image + on-image gradient overlay that fades from white on the image's left edge to transparent */
  background-image: linear-gradient(to right, rgba(255,255,255,.97) 0%, rgba(255,255,255,0) 65%), url('images/bookings image.avif');
  background-repeat: no-repeat, no-repeat;
  background-attachment: scroll, scroll; /* both gradient and image scroll with page */
  /* Position both layers together on the right, below the sticky navbar */
  background-position: right 0 top 78px, right 0 top 78px;
  /* Make the gradient the same size as the image so it overlays its left edge */
  background-size: 70% auto, 70% auto;
}

/* Adjust offset for smaller header size on mobile */
@media (max-width: 860px){
  body.booking-bg{
    /* Hide background image (and overlay) on mobile */
    background-image: none !important;
    background-position: initial !important;
    background-size: auto !important;
    background-attachment: scroll !important;
  }
}

/* Ensure hero sections stay hidden on booking page */
.booking-bg .hero{display:none !important;}
img,picture,svg,video{max-width:100%;display:block}
input,button,textarea,select{font:inherit}
a{color:inherit}

/* Make footer stick to bottom on short pages */
main{flex:1 0 auto}

/* Global */
.container{width:min(1100px, 92vw);margin-inline:auto}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;padding:.85rem 1.1rem;border-radius:999px;font-weight:600;border:1px solid transparent;cursor:pointer;text-decoration:none;text-align:center}
.btn.primary{background:var(--brand);color:white}
.btn.primary:hover{background:var(--brand-600)}
.btn.ghost{background:transparent;border-color:rgba(13,27,42,.15)}
.btn.ghost:hover{background:rgba(13,27,42,.04)}
.badge{display:inline-block;padding:.25rem .6rem;border-radius:999px;background:var(--surface);border:1px solid rgba(13,27,42,.08);font-size:.8rem;color:var(--brand);font-weight:600}
.muted-text{color:var(--muted)}
.hero-features{display:flex;gap:1rem;margin:1rem 0 0;padding:0;list-style:none;color:var(--muted);font-size:.95rem}
.team-image{
  display:block;
  width:100%;
  border-radius:0;
  border:1px solid rgba(13,27,42,.06);
  transition:opacity .8s ease-in-out;
}

.team-image.is-hidden{opacity:0;}

.team-rotator{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.75rem;
  margin:0 auto;
  width:100%;
  max-width:420px;
}

.team-caption{
  font-weight:600;
  text-align:center;
  color:var(--ink,#0d1b2a);
}
.contact-list{list-style:none;padding:0;margin:0 0 1rem 0}
.contact-form{display:grid;gap:.6rem;max-width:520px}
.contact-form input,.contact-form textarea{width:100%;padding:.9rem;border:1px solid rgba(13,27,42,.15);border-radius:12px}
/* iOS date input: show inline placeholder overlay, keep native control visible */
.date-field{ display:block; position: relative; }
.is-ios .date-field::after{
  content: attr(data-placeholder);
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--muted);
  pointer-events: none; /* allow taps to reach the native input */
  opacity: .9;
  transition: opacity .15s ease;
}
.is-ios .date-field.has-value::after,
.is-ios .date-field:focus-within::after{ opacity: 0; }

/* Booking form emphasis */
#booking .contact-form{
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(13,27,42,.08);
  border-radius: 16px;
  padding: 1.25rem;
  box-shadow: 0 12px 30px rgba(13,27,42,.18);
  backdrop-filter: saturate(140%) blur(3px);
}
@media (max-width: 860px){
  #booking .contact-form{ box-shadow: 0 8px 22px rgba(13,27,42,.16); }
}
.contact-form input,.contact-form textarea{width:100%;padding:.9rem;border:1px solid rgba(13,27,42,.15);border-radius:12px}
.map-placeholder{
  aspect-ratio:4/3;
  border-radius:0;
  border:1px solid rgba(13,27,42,.06);
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#eaf7fa, #ffffff);
  position: relative;         /* ensure iframe sizes against this box */
  overflow: hidden;           /* prevent odd iOS clipping/bleed */
}
/* Ensure iframe fills the box across browsers */
.map-placeholder iframe{
  display:block;
  width:100%;
  height:100%;
  border:0;
}
/* iOS/mobile fallback: use explicit height to avoid partial rendering */
@media (max-width: 860px){
  .map-placeholder{
    /* Safari iOS sometimes miscomputes aspect-ratio inside grid; use fixed height */
    aspect-ratio:auto;
    height: 320px; /* tweak if you want taller map on phones */
  }
}
.map-inner{text-align:center;color:var(--muted)}
.map-inner .icon{margin-inline:auto;margin-bottom:.6rem}
.footer-brand{margin-bottom:.6rem}
.footer-text{color:#cfe0ea;max-width:45ch;margin-top:.5rem}
.footer-links{list-style:none;padding:0;margin:.6rem 0 0}

/* Focus ring: show for keyboard focus only */
:where(a,button,[role="button"],input,select,textarea):focus-visible{outline:2px solid transparent;box-shadow:0 0 0 .2rem var(--ring)}

/* Reviews badge (Google rating) */
.reviews-cta{display:flex;justify-content:flex-start;margin-top:.75rem}
.google-rating{display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;color:var(--muted)}
.google-rating img{display:block;height:32px}
.google-rating .stars{position:relative;display:inline-block;line-height:1;letter-spacing:.5px;font-size:1.6rem}
.google-rating .stars::before{content:'★★★★★';color:#d5d9df}
.google-rating .stars::after{
  content:'★★★★★';
  color:#f6b01e;
  position:absolute;inset:0 auto 0 0;
  width: calc(var(--rating, 4.6) / 5 * 100%);
  overflow:hidden;white-space:nowrap
}
.google-rating strong{color:var(--ink);font-size:.9rem}
.google-rating .muted-text{font-size:.9rem}


/* Header */
header{position:sticky;top:0;background:rgba(255,255,255,.78);backdrop-filter:saturate(150%) blur(8px);-webkit-backdrop-filter:saturate(150%) blur(8px);z-index:50;border-bottom:1px solid rgba(13,27,42,.06)}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:.7rem 0;position:relative}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none}
.logo{inline-size:40px;block-size:40px;border-radius:10px;background:linear-gradient(135deg,var(--brand),var(--accent));display:grid;place-items:center;color:white;font-weight:800}
nav ul{list-style:none;display:flex;gap:1.2rem;margin:0;padding:0}
nav a{opacity:.9;text-decoration:none;transition:color .5s ease, opacity .5s ease;font-weight:600}
nav a[aria-current="page"]{color:var(--brand);opacity:1}
.topbar #procedures-trigger,
.topbar #locations-trigger{display:inline-flex;align-items:center;gap:.4rem}
.topbar #procedures-trigger::after,
.topbar #locations-trigger::after{content:"";display:inline-block;width:.45em;height:.45em;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .2s ease}
.topbar #procedures-trigger[aria-expanded="true"]::after,
.topbar #locations-trigger[aria-expanded="true"]::after{transform:rotate(-135deg)}
.topbar #procedures-trigger[aria-expanded="true"]{color:var(--brand);opacity:1}
.topbar #locations-trigger[aria-expanded="true"]{color:var(--brand);opacity:1}
.nav-actions{display:flex;align-items:center;gap:.6rem}
/* Header brand logo image */
.brand-logo{inline-size:48px;block-size:48px;object-fit:contain;border-radius:10px}

/* --- Desktop defaults --- */
nav[aria-label="Main"] {
  display: flex;
}
.menu-toggle{
  gap:0.3rem;
  padding:0.5rem 0.75rem;
  min-height:2.25rem;
  min-width:2.75rem;
}
.menu-toggle .menu-icon{
  position:relative;
  display:block;
  width:20px;
  height:2px;
  background:currentColor;
  border-radius:999px;
  transition:background .2s ease;
}
.menu-toggle .menu-icon::before,
.menu-toggle .menu-icon::after{
  content:'';
  position:absolute;
  inset:0;
  height:2px;
  background:currentColor;
  border-radius:999px;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  transform-origin:center;
}
.menu-toggle .menu-icon::before{transform:translateY(-6px);}
.menu-toggle .menu-icon::after{transform:translateY(6px);}
.menu-toggle[aria-expanded='true'] .menu-icon{background:transparent;}
.menu-toggle[aria-expanded='true'] .menu-icon::before{transform:rotate(45deg);}
.menu-toggle[aria-expanded='true'] .menu-icon::after{transform:rotate(-45deg);}
.menu-toggle {
  display: none; /* hide hamburger on desktop */
}
.mobile-panel {
  display: none; /* mobile panel hidden by default */
}

/* --- Mobile nav (fullscreen overlay, centered, with close button) --- */
@media (max-width: 860px) {
  /* Slimmer header on mobile */
  .topbar { padding: .3rem 0; }
  .nav-actions { gap: .35rem; }
  .brand-logo { inline-size: 36px; block-size: 36px; }
  header .nav-actions .btn { padding: .5rem .75rem; font-size: .95rem; }
  nav[aria-label="Main"] {
    display: none; /* hide desktop nav */
  }

  /* Shorten Book button label on small screens */
  .hide-sm{display:none}

  .menu-toggle {
    display: inline-flex; /* show hamburger */
  }

  /* Fullscreen overlay */
  .mobile-panel {
    position: fixed;
    inset: 0;                  /* full viewport */
    background: white;
    display: none;
    z-index: 9999;             /* sit above all content */
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 5.5rem 1.5rem 2rem;  /* space from top/edges */
    display: flex;
    flex-direction: column;
    justify-content: flex-start;   /* anchor content near top */
    align-items: flex-start;      /* align items left */
    text-align: left;
    transition: transform 0.3s ease-in-out;
    transform: translateY(-100%); /* slide down effect */
  }

  .mobile-panel.open {
    display: flex;            /* show panel */
    transform: translateY(0);
  }

  /* Close button top-right */
  .mobile-panel .menu-close {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    font-size: 2rem;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--ink);
    font-weight: 700;
  }

  /* Centered nav content */
  .mobile-panel ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;              /* space between buttons */
    align-items: flex-start;
    width: 100%;
    max-width: 720px;
  }

  /* Each list item and links */
  .mobile-panel li {
    width: 100%;
    max-width: 720px;
  }

  .mobile-panel a {
    display: block;
    padding: 1rem 0;
    font-size: 1.25rem;
    font-weight: 700;
    text-decoration: none;
    color: var(--ink);
  }

  /* Mobile Procedures submenu */
  .mobile-has-sub { width: 100%; max-width: 720px; }
  .mobile-sub-toggle {
    background: none;
    border: none;
    color: inherit;
    font: inherit;
    width: 100%;
    padding: 1rem 0;
    font-size: 1.25rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: .5rem;             /* even spacing between text and chevron */
    line-height: 1;          /* normalize vertical alignment */
    cursor: pointer;
  }
  .mobile-sub-toggle::after{
    content: "";
    display: inline-block;
    width: .5em; height: .5em;
    border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform .2s ease;
    position: relative; top: 1px; /* optical centering */
  }
  .mobile-sub-toggle[aria-expanded="true"]::after{ transform: rotate(-135deg); }

  .mobile-subpanel {
    width: 100%;
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transition: max-height .25s ease, opacity .25s ease;
    margin-top: .5rem;
  }
  .mobile-subpanel.open { opacity: 1; max-height: 60vh; }
  .mobile-subcontent {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    padding-top: .25rem;
    padding-left: .6rem;
  }
  /* Make Procedures submenu scrollable within the mobile dropdown */
  .mobile-subpanel.open .mobile-subcontent {
    max-height: 60vh;
    overflow-y: scroll; /* prefer showing scrollbar when supported */
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin; /* Firefox */
    scrollbar-color: var(--brand-primary) transparent; /* Firefox thumb & track */
    scrollbar-gutter: stable; /* Reserve space when possible */
    padding-right: .25rem; /* small gutter for scrollbar */
  }

  /* WebKit scrollbar styling for mobile Procedures submenu */
  .mobile-subpanel .mobile-subcontent::-webkit-scrollbar {
    width: 6px;
  }
  .mobile-subpanel .mobile-subcontent::-webkit-scrollbar-track {
    background: rgba(13, 27, 42, 0.06); /* subtle track */
    border-radius: 8px;
  }
  .mobile-subpanel .mobile-subcontent::-webkit-scrollbar-thumb {
    background: var(--brand-primary);
    border-radius: 8px;
  }
  .mobile-subpanel .mobile-subcontent::-webkit-scrollbar-thumb:hover {
    background: color-mix(in oklab, var(--brand-primary) 85%, black);
  }

  /* iOS: hide native overlay scrollbar and show custom moving thumb */
  .is-ios .mobile-subpanel .mobile-subcontent {
    scrollbar-width: none; /* Firefox (not on iOS, harmless) */
  }
  .is-ios .mobile-subpanel .mobile-subcontent::-webkit-scrollbar {
    width: 0 !important; /* Hide native overlay scrollbar */
    height: 0 !important;
  }
  .is-ios .mobile-subpanel { position: relative; }
  .is-ios .mobile-subpanel .custom-scrollbar {
    position: absolute;
    right: 2px;
    top: 8px;
    bottom: 8px;
    width: 3px;
    background: transparent; /* no track */
    pointer-events: none;
    z-index: 2;
  }
  .is-ios .mobile-subpanel .custom-scrollbar-thumb {
    position: absolute;
    left: 0;
    width: 100%;
    background: var(--brand-primary);
    border-radius: 2px;
    transition: transform .05s linear; /* snappier updates on iOS */
  }
  .mobile-subcontent h3 { margin: 0; font-size: 1.05rem; font-weight: 700; }
  .mobile-subcontent h3 a {
    text-decoration: none;
    color: inherit;
    display: block;
    padding: .25rem .75rem;
    border-radius: 8px;
    transition: background-color .2s ease, color .2s ease;
  }
  .mobile-subcontent h3 a:hover, .mobile-subcontent h3 a:focus-visible {
    color: var(--brand);
    background: rgba(46,66,155,0.12);
  }
  .mobile-sublist a:hover, .mobile-sublist a:focus-visible {
    color: var(--brand);
    background: rgba(46,66,155,0.12);
  }

  .mobile-sublist { list-style: none; margin: .25rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .35rem; font-weight: 500; }
  /* Submenu item text: smaller and not bold */
  .mobile-sublist a {
    font-size: 1rem;
    font-weight: 400;
    padding: .5rem .75rem;
    border-radius: 8px;
    display: block;
    transition: background-color .2s ease, color .2s ease;
  }
  #mobile-locations-menu .location-link{display:flex;flex-direction:column;align-items:flex-start;gap:.25rem;padding-left:.6rem;}
  #mobile-locations-menu .location-icon{display:none;}
  #mobile-locations-menu .location-text{display:flex;flex-direction:column;gap:.2rem;align-items:flex-start;text-align:left;padding-left:0;}
  #mobile-locations-menu .location-name{font-weight:600;text-align:left;}
  #mobile-locations-menu .location-meta{font-size:.85rem;line-height:1.35;color:rgba(13,27,42,.7);text-align:left;}
  /* Extra spacing between last item of a section and next title */
  .mobile-subcontent .mobile-sublist + h3 { margin-top: .5rem; }

  .mobile-panel .mobile-booking {
    margin-top: 1rem;
  }

.mobile-panel .mobile-booking .btn.primary {
  width: 100%;
  justify-content: center;
}
}

.success-actions{margin-top:1.25rem;display:flex;gap:.5rem;flex-wrap:wrap}
@media (max-width: 620px){
  .success-actions{flex-direction:column;align-items:flex-start;gap:.75rem}
  .success-actions .btn{margin:0}
}


/* Vimazi carousel */
#vimazi .vimazi-gallery{display:flex;align-items:center;gap:.75rem;margin-top:2rem;position:relative;overflow:hidden;padding:0 3rem;}
#vimazi .vimazi-track{display:flex;gap:0;flex:1;transition:transform .4s ease;will-change:transform;}
#vimazi .vimazi-slide{flex:0 0 auto;max-width:450px!important;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;background:var(--surface);border:0.5px solid rgba(13,27,42,.12);border-radius:18px;padding:.7rem;transform:scale(.88);transform-origin:center;transition:transform .2s ease;}
#vimazi .vimazi-slide img{width:100%;max-width:360px;height:auto;object-fit:contain;}
#vimazi .vimazi-caption{margin:0;font-size:1.1rem;font-weight:600;color:rgba(13,27,42,.85);text-align:center;}
#vimazi .vimazi-nav{appearance:none;border:none;background:#fff;border:1px solid rgba(13,27,42,.12);color:var(--brand);width:44px;height:44px;border-radius:50%;display:grid;place-items:center;cursor:pointer;box-shadow:0 6px 18px rgba(13,27,42,.08);transition:background-color .2s ease,border-color .2s ease,transform .2s ease;position:absolute;top:50%;transform:translateY(-50%);z-index:2;}
#vimazi .vimazi-nav:hover,#vimazi .vimazi-nav:focus-visible{background:#f3f5ff;border-color:rgba(46,66,155,.4);transform:translateY(calc(-50% - 2px));}
#vimazi .vimazi-nav span{font-size:1.5rem;line-height:1;display:block;}
#vimazi .vimazi-prev{left:.75rem;}
#vimazi .vimazi-next{right:.75rem;}
#vimazi .vimazi-gallery.vimazi-static{overflow:visible;}
#vimazi .vimazi-gallery.vimazi-static .vimazi-nav{display:none;}
#vimazi .vimazi-gallery.vimazi-static .vimazi-track{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.32rem;transform:none;}
@media (max-width: 960px){
  #vimazi .vimazi-gallery{padding:0 2.25rem;}
  #vimazi .vimazi-track{gap:0;}
  #vimazi .vimazi-slide{flex-basis:50%;max-width:50%;padding:1.25rem;transform:scale(.9);}
  #vimazi .vimazi-prev{left:.5rem;}
  #vimazi .vimazi-next{right:.5rem;}
}
@media (max-width: 620px){
  #vimazi .vimazi-gallery{gap:.4rem;padding:0 1.5rem;}
  #vimazi .vimazi-track{gap:0;}
  #vimazi .vimazi-slide{flex-basis:100%;max-width:100%;padding:1rem;transform:scale(.95);}
  #vimazi .vimazi-slide img{width:100%;max-width:300px;} 
  #vimazi .vimazi-prev{left:.35rem;}
  #vimazi .vimazi-next{right:.35rem;}
  #vimazi .vimazi-nav{width:40px;height:40px;}
}

/* Hero */
.hero{background:linear-gradient(180deg,var(--surface),#ffffff);padding:clamp(2rem,5vw,4rem) 0;position:relative;overflow:hidden}
.hero::before{
  content:"";
  position:absolute;inset:0;
  background:url('images/shef\ header\ image.avif') center/cover no-repeat;
  /* Scale image down by ~50% total now */
  background-size: 50% auto;
  background-position: right center;
  z-index:0;
}
.hero::after{
  content:"";
  position:absolute;inset:0;
  pointer-events:none; /* ensure overlay doesn't block interactions */
  /* Harder blend starting at image edge (50%), extended by ~200px falloff */
  background:linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0) 49.5%,
    rgba(255,255,255,1) 50%,                        /* seam at image edge */
    rgba(255,255,255,0.75) calc(50% + 60px),        /* extended, smoother */
    rgba(255,255,255,0.50) calc(50% + 110px),
    rgba(255,255,255,0.25) calc(50% + 160px),
    rgba(255,255,255,0.00) calc(50% + 200px),       /* longer falloff */
    rgba(255,255,255,0.00) 100%
  );
  z-index:0;
}
.hero .wrap{position:relative;z-index:1}

/* Hide hero header image and overlay on small screens */
@media (max-width: 860px){
  .hero::before{content:none}
  .hero::after{content:none}
}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center}
.hero h1{font-size:clamp(1.8rem,4.5vw,3rem);line-height:1.3;margin:.25rem 0}
.hero p{color:var(--muted);font-size:1.05rem}
.hero .cta{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1rem}
.hero-visual{position:relative;aspect-ratio:4/3;border-radius:24px;overflow:hidden;background:radial-gradient(120% 140% at 80% 10%, var(--accent) 0%, transparent 60%),linear-gradient(135deg,#eaf7fa 0%, #ffffff 60%);border:1px solid rgba(13,27,42,.06)}
.hero-cards{position:absolute;inset:auto 1rem 1rem auto;display:grid;gap:.6rem}
.hero-card{background:white;border:1px solid rgba(13,27,42,.08);padding:.7rem .9rem;border-radius:14px;box-shadow:0 8px 24px rgba(13,27,42,.05)}

@media (max-width: 860px){
  .hero .wrap{grid-template-columns:1fr}
}

.trust{padding:1rem 0;border-top:1px solid rgba(13,27,42,.06);border-bottom:1px solid rgba(13,27,42,.06);background:var(--surface)}
.trust .logos{display:flex;gap:2rem;align-items:center;justify-content:center;flex-wrap:wrap;opacity:.7}

/* Trust bar */

/* Sections */
section{padding:clamp(2rem,5vw,4rem) 0}
.section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1.5rem;margin-bottom:1.6rem;text-align:left;}
.section-head h2{font-size:clamp(1.4rem,3.2vw,2rem);line-height:1.2;margin:0}
.section-head h1{font-size:clamp(1.4rem,3.2vw,2rem);line-height:1.2;margin:0}
.kicker{letter-spacing:.08em;text-transform:uppercase;font-weight:700;font-size:.75rem;color:var(--brand);display:block;margin-bottom:.35rem}

/* Procedure pages: use default flex row so button stays right on mobile */
@media (max-width: 860px){
  body.procedure .section-head .btn{
    justify-content: center; /* center label inside the button */
    text-align: center;
  }
}

/* Services section with muted brand tint */
#services{background: #2e429b; scroll-margin-top: 30px}

/* Anchor offset for Team section */
#team{scroll-margin-top: 75px}
#services .section-head h2{
  /* Match card tint */
  color:#e0e3f0;
  color: color-mix(in srgb, #2e429b 15%, white);
}
#services .section-head .kicker{
  /* Match card tint */
  color:#e0e3f0;
  color: color-mix(in srgb, #2e429b 15%, white);
}
#services .btn.ghost{color:#ffffff;border-color:rgba(255,255,255,.65)}
#services .btn.ghost:hover{background:rgba(255,255,255,.12)}

/* Light-tint cards on dark section background */
#services .card{
  /* Fallback: 15% brand mixed with white */
  background: #e0e3f0;
  /* Prefer dynamic mix where supported */
  background: color-mix(in srgb, #2e429b 5%, white);
  /* Subtle border for definition */
  border-color: #cbd0e2;
  border-color: color-mix(in srgb, #e0e3f0, black 12%);
}

/* Services */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:0.8rem}
.card{background:#fff;border:1px solid rgba(13,27,42,.08);border-radius:18px;padding:1rem;display:flex;flex-direction:column;gap:.32rem;box-shadow:0 10px 22px rgba(13,27,42,.04);transition:background-color .25s ease,border-color .25s ease;position:relative}
/* Make entire card clickable when a stretched link is present */
.card .stretched-link{position:absolute;inset:0;border-radius:inherit;z-index:1;text-indent:-9999px;overflow:hidden}
.card .stretched-link:focus-visible{outline:none;text-indent:0}
/* Accessible focus ring rendered inside card so it isn't clipped */
.card:focus-within{box-shadow:0 0 0 3px var(--brand-primary) inset}
.card img{border-radius:14px;border:1px solid rgba(13,27,42,.06)}
.card h3{margin:.4rem 0;font-size:1.05rem}
.center-text{text-align:center}
.ba-labels{display:grid;grid-template-columns:1fr 1fr;gap:.25rem;margin-top:.25rem;color:var(--muted);font-weight:600;font-size:.95rem}
.ba-labels > div{text-align:center}
.card p{color:var(--muted);font-size:.95rem}
.card .meta{margin-top:auto;display:flex;justify-content:space-between;align-items:center}
.card .meta a{font-weight:600;color:var(--brand);text-decoration:none}
.icon{inline-size:40px;block-size:40px;border-radius:10px;background:linear-gradient(135deg,var(--brand),var(--accent));display:grid;place-items:center;color:white;font-weight:700}


@media (max-width: 900px){
  .cards{grid-template-columns:1fr 1fr}
}
@media (max-width: 620px){
  .cards{grid-template-columns:1fr}
}

/* Split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}
.split p{color:var(--muted)}
#team .container.split{
  display:flex;
  gap:2rem;
  align-items:flex-start;
}

#team .container.split > div:first-child{
  flex:1 1 0;
}

#team .container.split > div:last-child{
  flex:0 0 auto;
  display:flex;
  justify-content:flex-end;
}

#team .container.split > div:last-child .team-rotator{
  margin:0;
}

#contact .container.split{
  display:flex;
  gap:2rem;
  align-items:flex-start;
}

#contact .container.split > div:first-child{
  flex:1 1 0;
}

#contact .container.split > div:last-child{
  flex:0 0 420px;
  display:flex;
  justify-content:flex-end;
}

#contact .container.split > div:last-child .map-placeholder{
  width:100%;
}


.feature{background:linear-gradient(180deg,#ffffff, #f7fcfd);border:1px solid rgba(13,27,42,.06);border-radius:20px;padding:1.2rem}
@media (max-width: 900px){
  .split{grid-template-columns:1fr}
  .feature .split > div:last-child{
    justify-self:stretch;
    display:flex;
    justify-content:center;
  }
  #team .container.split{
    flex-direction:column;
    align-items:flex-start;
  }
  #team .container.split > div:first-child{
    width:100%;
  }
  #team .container.split > div:last-child{
    width:100%;
    justify-content:center;
  }
  #team .container.split > div:last-child .team-rotator{
    margin:0 auto;
  }
  #contact .container.split{
    flex-direction:column;
    align-items:flex-start;
  }
  #contact .container.split > div:first-child{
    width:100%;
  }
  #contact .container.split > div:last-child{
    width:100%;
    justify-content:center;
  }
  #contact .container.split > div:last-child .map-placeholder{
    width:100%;
  }
}

/* Testimonials */
.testimonials{background:var(--surface);border-top:1px solid rgba(13,27,42,.06);border-bottom:1px solid rgba(13,27,42,.06)}

/* Mobile brand title size tweak */
@media (max-width: 860px){
  .brand strong{font-size:.95rem;line-height:1.1}
}
.testimonial-track{display:flex;gap:0;overflow-x:auto;scroll-snap-type:none;padding-bottom:.5rem;-ms-overflow-style:none;scrollbar-width:none;max-height:400px;overflow-y:hidden;-webkit-overflow-scrolling:touch}
.testimonial-track::-webkit-scrollbar{display:none}

/* Procedures mega panel */
.mega-panel{position:absolute;left:0;right:0;top:100%;z-index:60;background:#fff;border:1px solid rgba(13,27,42,.08);border-radius:14px;box-shadow:0 10px 30px rgba(13,27,42,.12);padding:1rem;margin-top:.5rem;opacity:0;transform:translateY(-8px) scaleY(.98);transform-origin:top;visibility:hidden;pointer-events:none;transition:opacity .22s ease,transform .22s ease}
.mega-panel.open{opacity:1;transform:translateY(0) scaleY(1);visibility:visible;pointer-events:auto}
.mega-panel.closing{visibility:visible;pointer-events:none}
  .mega-content{display:grid;grid-template-columns:1fr 1fr;gap:0 2rem;align-items:start;grid-auto-flow:row}
  .mega-content h3{margin:0 0 .2rem 0;font-size:1.05rem}
  .mega-content h3 a{ text-decoration: none; color: inherit; }
  .mega-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.35rem}
  .mega-list a,.mobile-sublist a{text-decoration:none;color:inherit;display:block}
  #locations-menu .mega-list a{font-size:1.18rem;}
  #locations-menu .location-link{display:flex;align-items:flex-start;gap:.6rem;line-height:1.1;text-align:left;}
  #locations-menu .location-text{display:flex;flex-direction:column;gap:.2rem;}
  #locations-menu .location-name{display:block;font-weight:600;}
  #locations-menu .location-icon{display:block;width:1rem;height:1.4rem;flex-shrink:0;color:var(--brand);}
  #locations-menu .location-icon .marker-body{fill:currentColor;}
  #locations-menu .location-icon .marker-hole{fill:#fff;}
  #locations-menu .location-meta{display:block;font-size:.85rem;color:rgba(13,27,42,.7);margin-top:0;padding-left:0;line-height:1.35;}
  
  .mega-list li{transition:color .15s ease}
.mega-list li:hover{color:#2e429b}
.mega-list a:hover,.mega-list a:focus-visible{color:#2e429b}
.mobile-sublist a:active,.mobile-sublist a:focus-visible{color:#2e429b}

/* Two-column layout */
.mega-content{ grid-auto-flow: row; }
/* Default mapping: first four items to left column, remainder to right */
.mega-content > :nth-child(1),
.mega-content > :nth-child(2),
.mega-content > :nth-child(3),
.mega-content > :nth-child(4){ grid-column: 1; }
.mega-content > :nth-child(n+5){ grid-column: 2; }
/* Ensure sections align to top, with consistent inner spacing */
.mega-section{ align-self: start; }

/* Index mega menu: place Chiropody and Physiotherapy on the right */
#procedures-menu .mega-content > .mega-section:nth-child(1),
#procedures-menu .mega-content > .mega-section:nth-child(2){ grid-column: 1; }
#procedures-menu .mega-content > .mega-section:nth-child(3),
#procedures-menu .mega-content > .mega-section:nth-child(4){ grid-column: 2; }

/* Pin rows on index dropdown so right column starts at the top */
#procedures-menu .mega-content > .mega-section:nth-child(1){ grid-row: 1; }
#procedures-menu .mega-content > .mega-section:nth-child(2){ grid-row: 2; }
#procedures-menu .mega-content > .mega-section:nth-child(3){ grid-row: 1; }
#procedures-menu .mega-content > .mega-section:nth-child(4){ grid-row: 2; }

/* Ensure items align to the top of each column */
.mega-content > *{align-self:start}

/* Tight, consistent spacing between headings and their lists */
  .mega-content h3 + .mega-list{ margin-top: .1rem; }
  /* Avoid gaps when headings appear back-to-back (e.g., right column intro heading) */
  .mega-content h3 + h3 { margin-top: .2rem; }
  /* Add separation between a list and the next section heading */
  .mega-content .mega-list + h3 { margin-top: .3rem; }

/* Add vertical gaps between sections in Procedures dropdown */
/* Gap between Surgery list and Podiatry (left column) */
#procedures-menu .mega-content > .mega-section:nth-child(2) { margin-top: 0.6rem; }
/* Gap between Chiropody list and Physiotherapy (right column) */
#procedures-menu .mega-content > .mega-section:nth-child(4) { margin-top: 0.6rem; }
.quote{scroll-snap-align:start;flex:0 0 min(390px, 90%);background:#fff;border:1px solid rgba(13,27,42,.08);border-radius:18px;padding:1rem;transition:background-color .25s ease,border-color .25s ease}
.stars{letter-spacing:.08em}
.quote p{color:var(--muted)}

/* Testimonial card enhancements */
.quote{display:flex;flex-direction:column;gap:.5rem}
/* Let the card size naturally; rely on text clamp instead of max-height */
.quote{position:relative}
/* Clamp testimonial text to avoid spilling out of the card */
.quote blockquote p{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:6;
  /* Modern, unprefixed support (Chrome/Safari/Edge 119+, Safari 17+) */
  line-clamp: 6;
  overflow:hidden;
}
/* Subtle fade at bottom to indicate more text */
.quote::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2.2rem;background:linear-gradient(180deg, rgba(255,255,255,0), #fff);border-bottom-left-radius:18px;border-bottom-right-radius:18px;pointer-events:none}
@media (max-width: 860px){
  .quote blockquote p{
    -webkit-line-clamp:5;
    line-clamp:5;
  }
}
.reviewer{display:flex;align-items:center;gap:.6rem}
.avatar{inline-size:40px;block-size:40px;border-radius:50%;display:grid;place-items:center;font-weight:700;color:#fff;background:linear-gradient(135deg,var(--brand),var(--accent))}
.avatar img{inline-size:40px;block-size:40px;border-radius:50%;object-fit:cover;display:block}
.reviewer .info{display:flex;flex-direction:column;line-height:1.1}
.reviewer .name{font-weight:700}
.reviewer .meta{display:flex;align-items:center;gap:.4rem;color:var(--muted);font-size:.85rem}
.rating{color:#f5b50a;letter-spacing:.06em}
.g-badge{font-weight:800;color:var(--brand);font-size:.85rem}
.quote blockquote{margin:0}

/* Testimonial hover tint to match Services cards */
.testimonials .quote:hover{
  /* Fallback light tint similar to Services cards */
  background:#e0e3f0;
  /* Preferred dynamic mix (supported browsers) */
  background:color-mix(in srgb, #2e429b 15%, white);
  /* Subtle darker border for definition */
  border-color:#cbd0e2;
  border-color:color-mix(in srgb, #e0e3f0, black 12%);
}

/* Before & Afters cards: hover tint to match Services cards */
#Before & Afters .card:hover{
  /* Fallback tint similar to Services cards */
  background:#e0e3f0;
  /* Preferred dynamic mix (supported browsers) */
  background:color-mix(in srgb, #2e429b 15%, white);
  /* Subtle darker border for definition */
  border-color:#cbd0e2;
  border-color:color-mix(in srgb, #e0e3f0, black 12%);
}

/* Before & Afters carousel */
.ba-carousel-wrapper{position:relative;display:block;overflow:hidden;padding:0}
.ba-carousel{display:flex;gap:1rem;will-change:transform;transition:transform .32s ease}
/* Desktop: mimic 3-column width */
.ba-carousel .card{flex:0 0 calc((100% - 2rem)/3)}
/* Tablet: mimic 2-column width */
@media (max-width: 900px){
  .ba-carousel .card{flex:0 0 calc((100% - 1rem)/2)}
}
/* Mobile: 1-column width */
@media (max-width: 620px){
  .ba-carousel .card{flex:0 0 100%}
}
.ba-nav{appearance:none;border:none;background:#ffffffcc;border:1px solid rgba(13,27,42,.12);color:#0d1b2a;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;cursor:pointer;box-shadow:0 6px 18px rgba(13,27,42,.08);transition:background-color .2s ease,border-color .2s ease;position:absolute;top:50%;transform:translateY(-50%);z-index:3}
.ba-nav:hover{background:#fff;border-color:rgba(13,27,42,.2)}
.ba-prev{left:6px}
.ba-next{right:6px}

/* Center carousel on larger screens without changing mobile size */
@media (min-width: 621px){
  .ba-carousel-wrapper{display:flex;justify-content:center}
  .ba-carousel{flex:0 1 auto}
}

/* Edge fade indicators to suggest more content */
/* (edge fades removed on request) */

/* CTA */
.cta-line{display:flex;gap:1rem;flex-wrap:wrap}

/* Footer */
footer{background:#0f2233;color:#e7eef5;padding-top:1rem}
footer .grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem}
footer a{text-decoration:none;color:#e7eef5;opacity:.9}
footer li{margin:.4rem 0}
footer .bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(255,255,255,.08);margin-top:clamp(2rem,4vw,3rem);padding-top:1rem}
@media (max-width: 900px){
  footer .grid{grid-template-columns:1fr}
  footer .bottom{flex-direction:column;gap:1rem;align-items:flex-start}
}

/* Utilities */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Motion preferences */
@media (prefers-reduced-motion: reduce){
  html:focus-within{scroll-behavior:auto}
  nav a{transition:none !important}
}

/* Page fade transition (focus on fade-out only to avoid jitter) */
body.fade-transition{will-change:opacity}
body.fade-transition.leaving{opacity:0;transition:opacity .25s ease;pointer-events:none}
@media (prefers-reduced-motion: reduce){
  body.fade-transition.leaving{opacity:1;transition:none}
}

/* Content-only fade-in (e.g., booking page main content) */
.content-fade{opacity:0}
.content-fade.ready{opacity:1;transition:opacity .25s ease}
/* Content-only fade-out */
.content-fade.leaving{opacity:0;transition:opacity .25s ease}
@media (prefers-reduced-motion: reduce){
  .content-fade, .content-fade.ready, .content-fade.leaving{opacity:1;transition:none}
}

.animated-location {
  display: inline-block;
  transition: opacity 0.5s ease-in-out;
  color: #2e429b; /* change to your preferred color */
  font-weight: 700;    /* optional: make it bold */
}
.fade-out {
  opacity: 0;
}
.fade-in {
  opacity: 1;
}

/* Brand variables */
:root {
  --brand-primary: #2e429b;
  /* Muted version of the brand color (reduced saturation, slightly lighter) */
  --brand-primary-muted: hsl(229 30% 52%);
}

/* Our Services cards */
#our-services .card,
.our-services .card,
.services .card {
  background: var(--brand-primary-muted);
  color: #fff;
  /* Fallback border color for older browsers */
  border: 1px solid #4d5a93;
  /* Prefer a slightly darker mix for definition where supported */
  border-color: color-mix(in hsl, var(--brand-primary-muted), black 15%);
}

/* Anchor offset for Fees section */
#fees{scroll-margin-top:30px}

/* Anchor offset for Contact section */
#contact{scroll-margin-top:60px}




  .footer-social{display:flex;gap:.75rem;margin-top:1rem}
  .footer-social .social-link{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.08);transition: background-color .2s ease, transform .2s ease}
  .footer-social .social-link:hover,.footer-social .social-link:focus-visible{background:rgba(255,255,255,.16);transform:translateY(-2px)}
  .footer-social svg{width:18px;height:18px;fill:currentColor}










 #vimazi .vimazi-slide > s{display:inline-block;margin-top:.08rem;margin-right:.15rem;font-size:.8rem;color:rgba(13,27,42,.55);text-decoration:line-through;vertical-align:baseline;}
#vimazi .vimazi-slide > a{display:inline-block;margin-top:.08rem;font-size:.9rem;font-weight:600;color:var(--brand);text-decoration:none;vertical-align:baseline;}
#vimazi .vimazi-slide > a:hover,#vimazi .vimazi-slide > a:focus-visible{color:color-mix(in srgb,var(--brand) 80%,#000 20%);}





.insurance-subheading{
  margin-top:clamp(2rem,4vw,3rem);
  font-size:clamp(1.4rem,3.2vw,2rem);
  line-height:1.2;
  font-weight:700;
  color:var(--ink);
}

.insurance .section-head .muted-text{
  margin-bottom:clamp(2.5rem,5vw,3.5rem);
}

.insurance .section-head{
  display:block;
  text-align:left;
}
.insurance .section-head > div:first-of-type{display:flex;flex-direction:column;gap:.35rem;align-items:flex-start;text-align:left;}
.insurer-hero .section-head .muted-text{
  margin-bottom:clamp(0.5rem,1.5vw,1rem);
}

.insurer-hero .section-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1.5rem;
}

.insurer-hero .section-head > div:last-of-type{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
  justify-content:flex-start;
  align-items:center;
  align-self:auto;
}

@media (max-width:900px){
  .insurer-hero .section-head{
    flex-direction:column;
  }
  .insurer-hero .section-head > div:last-of-type{
    width:100%;
  }
}
.insurance .section-head > div:last-of-type{
  display:flex;
  align-self:flex-start;
  align-items:center;
  gap:.75rem;
  flex-wrap:wrap;
  justify-content:flex-start;
}
@media (max-width:900px){
  .insurance .section-head > div:last-of-type{
    justify-content:flex-start;
  }
}

.insurance{
  padding-bottom:clamp(0.75rem,2vw,1.5rem);
}

#prices{
  padding-top:clamp(1rem,3vw,1.8rem);
}

.insurer-grid{
  display:flex;
  flex-wrap:wrap;
  gap:1.5rem;
  align-items:center;
  justify-content:center;
  width:100%;
  margin-top:1.25rem;
}
.insurer-grid .insurer-link{
  flex:1 1 clamp(84px,10.8%,132px);
  max-width:132px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0.5rem;
  border-radius:12px;
  border:1px solid rgba(13,27,42,0.1);
  box-shadow:0 6px 16px rgba(13,27,42,0.12);
  background:white;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.insurer-grid .insurer-link:hover,
.insurer-grid .insurer-link:focus-visible{
  transform:translateY(-3px);
  box-shadow:0 12px 24px rgba(13,27,42,0.16);
  border-color:rgba(13,27,42,0.18);
}

.insurer-grid img{
  width:100%;
  height:auto;
  object-fit:contain;
}
.insurer-note{
  margin-top:1rem;
  width:100%;
}

@media (max-width:700px){
  .insurer-grid{justify-content:center;}
}

@media (hover:none) and (pointer:coarse){
  .insurer-grid .insurer-link{
    box-shadow:0 16px 28px rgba(13,27,42,0.16) !important;
    border-color:rgba(13,27,42,0.14) !important;
  }

}


.align-left{
  text-align:left !important;
  margin-left:0 !important;
  margin-right:auto !important;
  display:block;
}


#prices .section-head > div:last-of-type{
  display:grid;
  justify-items:end;
  gap:.6rem;
}

#prices .section-head > div:last-of-type .btn{
  width:clamp(140px,18vw,200px);
  justify-content:center;
}

@media (max-width:720px){
  #prices .section-head > div:last-of-type{
    justify-items:stretch;
  }
  #prices .section-head > div:last-of-type .btn{
    width:100%;
  }
}


.procedure-gallery{
  margin-top:1.5rem;
  display:grid;
  gap:1rem;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
}

.procedure-gallery img{
  width:100%;
  height:auto;
  border-radius:14px;
  box-shadow:0 10px 24px rgba(13,27,42,0.12);
  object-fit:cover;
}

@media (max-width:520px){
  .procedure-gallery{
    grid-template-columns:1fr;
  }
}



.procedure-gallery figure{
  margin:0;
  display:flex;
  flex-direction:column;
  gap:.6rem;
  align-items:center;
  text-align:center;
}




.procedure-gallery .image-labels{
  width:100%;
  margin-top:.25rem;
}










.procedure-gallery.single{
  grid-template-columns:repeat(auto-fit,minmax(180px,260px));
  justify-content:center;
}

.feature-column{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:1.5rem;
}

.feature-column .procedure-photo{
  margin:0;
  border:0;
  box-shadow:none;
}

.procedure-photo img{
  width:100%;
  height:auto;
  border-radius:14px;
  border:0;
  box-shadow:none;
  object-fit:cover;
}

@media (max-width:600px){
  .feature-column .procedure-photo{
    margin:0 auto;
  }
}


@media (max-width: 860px){
  #services,
  #team,
  #contact{
    scroll-margin-top:110px;
  }
}






/* --------------------------------------------------------------
   Performance: reduce render cost for below-the-fold sections
   - Uses content-visibility so the browser can skip layout/paint
     until the user scrolls near the section.
   - contain-intrinsic-size reserves space to prevent layout shift.
   - Safe for modern Chromium/Safari/Firefox; ignored by old browsers.
   -------------------------------------------------------------- */
@media (min-width: 768px) {
  :where(.testimonials,
         #vimazi,
         .insurance,
         #prices,
         .procedure-gallery,
         .ba-carousel-wrapper,
         .insurer-grid,
         #contact .container.split > div:last-child .map-placeholder) {
    content-visibility: auto;
    contain-intrinsic-size: 720px 800px; /* tune values if sections look too tall/short before paint */
  }
}

/* Hint: when you deploy, serve this file with long cache-lifetimes (Cache-Control: public, max-age=31536000, immutable)
   and bump the querystring in HTML like styles.css?v=1.0.1 when you change it.
*/