/* ==========================================================================
   Centre Médical ProCare — Design System
   Palette: teal (trust/clinical) + lime (vitality) drawn from the ProCare mark
   Display: Fraunces (warm serif, humanises a clinical subject)
   Body/UI: Inter
   Signature element: the "pulse line" — an ECG trace used as section divider,
   scroll accent and loader, echoing the ECG/Holter service the centre offers.
   ========================================================================== */

:root{
  /* ---- Color tokens ---- */
  --teal-950:#082C29;
  --teal-900:#0A3D3A;
  --teal-800:#0D4B47;
  --teal-700:#115C56;
  --teal-600:#167269;
  --teal-500:#1E8C80;
  --teal-100:#DCEEEA;
  --lime-600:#74A72E;
  --lime-500:#8DC63F;
  --lime-400:#ABDB6E;
  --lime-100:#EEF6D9;
  --sky-500:#4FB9C9;
  --sky-400:#73CAD7;
  --sky-100:#E2F5F7;
  --cream-50:#F7FAF8;
  --cream-100:#EFF5F1;
  --ink-900:#12211D;
  --ink-700:#2C3E39;
  --ink-500:#5B6E68;
  --white:#FFFFFF;
  --line:#E3ECE8;

  /* ---- Type ---- */
  --font-display:'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* ---- Radius / shadow ---- */
  --radius-sm:10px;
  --radius-md:18px;
  --radius-lg:28px;
  --radius-pill:999px;
  --shadow-soft:0 10px 30px -12px rgba(10,61,58,.18);
  --shadow-lift:0 24px 48px -18px rgba(10,61,58,.28);

  --ease:cubic-bezier(.22,1,.36,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font-body);
  color:var(--ink-900);
  background:var(--cream-50);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.font-display{
  font-family:var(--font-display);
  font-weight:600;
  color:var(--teal-900);
  line-height:1.12;
  letter-spacing:-0.01em;
}
p{color:var(--ink-700);}
a{color:var(--teal-700); text-decoration:none;}
::selection{background:var(--lime-400); color:var(--teal-950);}

.eyebrow{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:var(--font-body); font-weight:700; font-size:.72rem;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--teal-600);
}
.eyebrow::before{
  content:""; width:22px; height:2px; background:var(--lime-500); display:inline-block; border-radius:2px;
}

.section{padding:5.5rem 0;}
@media(max-width:767.98px){.section{padding:3.5rem 0;}}
.section-tight{padding:3rem 0;}
.bg-teal{background:var(--teal-900); color:var(--white);}
.bg-teal h1,.bg-teal h2,.bg-teal h3,.bg-teal .font-display{color:var(--white);}
.bg-cream{background:var(--cream-100);}

.container-xl{max-width:1240px;}

/* Focus visibility (accessibility floor) */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:3px solid var(--lime-500); outline-offset:3px; border-radius:4px;
}

/* ---- Buttons ---- */
.btn{
  font-family:var(--font-body); font-weight:600; border-radius:var(--radius-pill);
  padding:.75rem 1.6rem; transition:transform .35s var(--ease), box-shadow .35s var(--ease), background-color .25s var(--ease), color .25s var(--ease);
  border:1.5px solid transparent;
}
.btn-lime{
  background:var(--lime-500); color:var(--teal-950); box-shadow:var(--shadow-soft);
}
.btn-lime:hover{background:var(--lime-400); color:var(--teal-950); transform:translateY(-2px); box-shadow:var(--shadow-lift);}
.btn-outline-light-teal{
  border-color:rgba(255,255,255,.55); color:var(--white); background:transparent;
}
.btn-outline-light-teal:hover{background:rgba(255,255,255,.12); color:var(--white); transform:translateY(-2px);}
.btn-ghost-light{background:transparent; border:none; color:var(--white); padding:.75rem .3rem; display:inline-flex; align-items:center; font-weight:600; font-family:var(--font-body);}
.btn-ghost-light .play-icon{
  width:44px; height:44px; border-radius:50%; border:1.5px solid rgba(255,255,255,.55); display:inline-flex;
  align-items:center; justify-content:center; margin-right:.7rem; transition:all .3s var(--ease); flex-shrink:0;
}
.btn-ghost-light .play-icon i{color:var(--lime-400); font-size:1rem;}
.btn-ghost-light:hover{color:var(--white);}
.btn-ghost-light:hover .play-icon{background:var(--lime-500); border-color:var(--lime-500);}
.btn-ghost-light:hover .play-icon i{color:var(--teal-950);}
.btn-outline-teal{
  border-color:var(--teal-700); color:var(--teal-700); background:transparent;
}
.btn-outline-teal:hover{background:var(--teal-700); color:var(--white); transform:translateY(-2px);}
.btn-sm-pill{padding:.5rem 1.15rem; font-size:.85rem;}

/* ==========================================================================
   Navbar
   ========================================================================== */
.navbar-procare{
  padding:.9rem 0; transition:background-color .4s var(--ease), box-shadow .4s var(--ease), padding .4s var(--ease);
  background:transparent;
}
.navbar-procare.is-scrolled{
  background:rgba(247,250,248,.92); backdrop-filter:blur(10px);
  box-shadow:0 6px 24px -12px rgba(10,61,58,.18); padding:.55rem 0;
}
.brand{display:flex; align-items:center; gap:.6rem; font-family:var(--font-display); font-weight:700; font-size:1.35rem; color:var(--teal-900);}
.navbar-procare:not(.is-scrolled) .brand,
.navbar-procare:not(.is-scrolled) .nav-link{color:var(--white);}
.navbar-procare:not(.is-scrolled) .navbar-toggler-icon{filter:invert(1);}
.brand .brand-mark{
  width:44px; height:44px; border-radius:50%; background:var(--white);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
  box-shadow:0 6px 16px -6px rgba(10,61,58,.45); overflow:hidden;
}
.brand .brand-mark img{width:100%; height:100%; object-fit:contain; display:block;}
.brand-word{color:var(--teal-900);}
.navbar-procare:not(.is-scrolled) .brand-word{color:var(--white);}
.brand-accent{color:var(--lime-500);}

/* Toggler: always readable, whatever background sits behind the navbar */
.navbar-toggler{
  border:1.5px solid rgba(0,0,0,.12); border-radius:10px; padding:.42rem .55rem;
  transition:background-color .3s var(--ease), border-color .3s var(--ease);
}
.navbar-toggler:focus{box-shadow:0 0 0 3px rgba(166,201,61,.45);}
.navbar-procare:not(.is-scrolled) .navbar-toggler{
  border-color:rgba(255,255,255,.5); background:rgba(255,255,255,.1);
}
.navbar-procare .navbar-toggler[aria-expanded="true"]{
  background:var(--white); border-color:var(--white);
}
.navbar-procare .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon{filter:none !important;}

/* ---- Mobile / tablet dropdown panel (<992px) ---- */
@media (max-width:991.98px){
  .navbar-procare{padding:.75rem 0;}
  .navbar-procare .container{padding-left:1.1rem; padding-right:1.1rem;}
  .navbar-procare .navbar-collapse{
    background:var(--white);
    margin-top:.85rem;
    padding:.5rem 1.25rem 1.4rem;
    border-radius:var(--radius-md);
    box-shadow:var(--shadow-lift);
    max-height:calc(100vh - 110px);
    overflow-y:auto;
  }
  .navbar-procare .navbar-nav{width:100%;}
  /* Force readable dark text inside the panel, whatever the scroll/transparency state */
  .navbar-procare:not(.is-scrolled) .navbar-collapse .nav-link,
  .navbar-procare .navbar-collapse .nav-link{
    color:var(--ink-900) !important; width:100%;
    padding:.85rem .1rem !important; margin:0 !important;
    border-bottom:1px solid var(--line);
  }
  .navbar-procare .navbar-collapse .nav-item:last-child .nav-link{border-bottom:none;}
  .navbar-procare .navbar-collapse .nav-link.active{color:var(--teal-700) !important;}
  .navbar-procare .navbar-collapse .nav-link::after{display:none;}
  .navbar-procare .navbar-collapse .btn-lime{
    display:block; width:100%; text-align:center; margin-top:1rem; padding:.85rem 1.2rem;
  }
}

@media (max-width:359.98px){
  .brand-word{font-size:1.1rem;}
  .brand .brand-mark{width:38px; height:38px;}
}

.nav-link{
  font-weight:600; font-size:.95rem; color:var(--ink-900); margin:0 .35rem; position:relative; padding:.4rem .2rem !important;
}
.nav-link::after{
  content:""; position:absolute; left:0; bottom:0; width:0; height:2px; background:var(--lime-500);
  transition:width .3s var(--ease);
}
.nav-link:hover::after,.nav-link.active::after{width:100%;}
.nav-link.active{color:var(--teal-700);}

/* ==========================================================================
   Hero / Carousel
   ========================================================================== */
.hero{
  position:relative; min-height:92vh; overflow:hidden; display:flex; align-items:center;
  background:var(--teal-900);
}
.hero-slide{
  position:absolute; inset:0; opacity:0; transition:opacity 1.1s var(--ease);
  background-size:cover; background-position:center;
}
.hero-slide.active{opacity:1;}
.hero-slide::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(115deg, rgba(8,44,41,.92) 10%, rgba(10,61,58,.72) 48%, rgba(17,92,86,.35) 100%);
}
.hero-slide-a{background-image:url('../images/hero-clinic.png'); background-color:#0A3D3A;}
.hero-slide-b{background-image:url('../images/hero-consultation.png'); background-color:#082C29;}
.hero-slide-c{background-image:url('../images/hero-equipment.png'); background-color:#0A3D3A;}

.hero-content{position:relative; z-index:2; color:var(--white); padding-top:4.5rem;}
.hero-content .eyebrow{color:var(--lime-400);}
.hero-content .eyebrow::before{background:var(--lime-400);}
.hero-title{font-size:clamp(2.3rem, 4.6vw, 4rem); color:var(--white); max-width:720px;}
.hero-title .hl{color:var(--lime-400);}
.hero-sub{font-size:1.08rem; color:rgba(255,255,255,.82); max-width:560px; margin:1.1rem 0 2rem;}

.hero-dots{position:absolute; left:0; right:0; bottom:2.4rem; z-index:3; display:flex; justify-content:center; gap:.55rem;}
.hero-dots button{
  width:34px; height:4px; border-radius:4px; border:none; background:rgba(255,255,255,.35); cursor:pointer; transition:background .3s var(--ease), width .3s var(--ease);
}
.hero-dots button.active{background:var(--lime-500); width:52px;}

.hero-stats{position:relative; z-index:2; display:flex; flex-wrap:wrap; gap:2.4rem; margin-top:3rem; padding-top:2rem; border-top:1px solid rgba(255,255,255,.18);}
.hero-stat b{display:block; font-family:var(--font-display); font-size:1.7rem; color:var(--white);}
.hero-stat span{font-size:.8rem; color:rgba(255,255,255,.7); letter-spacing:.03em;}

/* ==========================================================================
   Signature: the pulse line (ECG divider)
   ========================================================================== */
.pulse-divider{width:100%; overflow:hidden; line-height:0; position:relative; background:var(--cream-50);}
.pulse-divider.on-teal{background:var(--teal-900);}
.pulse-divider svg{width:100%; height:64px; display:block;}
.pulse-path{
  fill:none; stroke:var(--lime-500); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round;
  stroke-dasharray:1400; stroke-dashoffset:1400;
}
.pulse-divider.in-view .pulse-path{animation:draw-pulse 2.2s var(--ease) forwards;}
.pulse-dot{fill:var(--lime-500); opacity:0;}
.pulse-divider.in-view .pulse-dot{animation:pulse-dot-fade 2.2s var(--ease) forwards;}
@keyframes draw-pulse{ to{stroke-dashoffset:0;} }
@keyframes pulse-dot-fade{ 0%{opacity:0;} 70%{opacity:0;} 100%{opacity:1;} }

/* ==========================================================================
   Intro / presentation (two column)
   ========================================================================== */
.presentation-logo-panel{
  background:var(--teal-900); border-radius:var(--radius-lg); padding:4.5rem 2.5rem;
  display:flex; align-items:center; justify-content:center; min-height:480px; position:relative; overflow:hidden;
}
.presentation-logo-panel::before{
  content:""; position:absolute; inset:0; opacity:.15;
  background-image:radial-gradient(circle, var(--lime-400) 1.5px, transparent 1.5px);
  background-size:22px 22px;
}
.presentation-logo-panel::after{
  content:""; position:absolute; top:50%; left:50%; width:520px; height:520px; border-radius:50%;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle, rgba(141,198,63,.25), rgba(115,202,215,.13) 55%, transparent 75%);
  z-index:0;
}
.presentation-logo-panel .logo-lg{
  width:460px; max-width:88%; position:relative; z-index:1;
  filter:drop-shadow(0 26px 44px rgba(0,0,0,.42));
  transition:transform .5s var(--ease);
}
.presentation-logo-panel:hover .logo-lg{transform:scale(1.03);}
.presentation-logo-panel .brand-word-lg{font-family:var(--font-display); font-size:1.55rem; color:rgba(255,255,255,.82); margin-top:1.8rem; position:relative; z-index:1; letter-spacing:.03em;}

.value-row{display:flex; gap:1rem; align-items:flex-start; margin-bottom:1.5rem;}
.value-row .icon-chip{
  width:46px; height:46px; border-radius:13px; background:var(--lime-100); color:var(--teal-700);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.value-row .icon-chip svg{width:22px; height:22px;}
.value-row h4{font-size:1.05rem; margin-bottom:.25rem; color:var(--teal-900);}
.value-row p{margin:0; font-size:.94rem;}

/* ==========================================================================
   Partners
   ========================================================================== */
.partner-tile{
  height:92px; border-radius:var(--radius-md); background:var(--white); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:600;
  color:var(--ink-500); font-size:1rem; line-height:1.2; text-align:center; padding:.9rem 1.3rem;
  transition:all .3s var(--ease); filter:grayscale(1); opacity:.75;
}
.partner-tile:hover{filter:none; opacity:1; border-color:var(--lime-500); transform:translateY(-3px); box-shadow:var(--shadow-soft); color:var(--teal-700);}
.partner-tile img{max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain;}

/* ==========================================================================
   Cards: services
   ========================================================================== */
.service-card{
  background:var(--white); border-radius:var(--radius-md); padding:2rem 1.7rem; height:100%;
  border:1px solid var(--line); transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
  position:relative;
}
.service-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-lift); border-color:transparent;}
.service-card .icon-wrap{
  width:56px; height:56px; border-radius:16px; background:var(--teal-900); color:var(--lime-400);
  display:flex; align-items:center; justify-content:center; margin-bottom:1.3rem; transition:background .35s var(--ease);
}
.service-card:hover .icon-wrap{background:var(--lime-500); color:var(--teal-950);}
.service-card .icon-wrap svg{width:26px; height:26px;}
.service-card h3{font-size:1.15rem; margin-bottom:.6rem;}
.service-card p{font-size:.92rem; margin-bottom:1.2rem;}
.service-card .card-link{font-weight:700; font-size:.86rem; display:inline-flex; align-items:center; gap:.4rem; color:var(--teal-700);}
.service-card .card-link svg{width:15px; height:15px; transition:transform .3s var(--ease);}
.service-card .card-link:hover svg{transform:translateX(4px);}

.category-pill{
  border:none; background:var(--white); border:1.5px solid var(--line); color:var(--ink-700);
  padding:.55rem 1.3rem; border-radius:var(--radius-pill); font-weight:600; font-size:.88rem; transition:all .25s var(--ease);
}
.category-pill.active,.category-pill:hover{background:var(--teal-900); color:var(--white); border-color:var(--teal-900);}

/* ==========================================================================
   Team
   ========================================================================== */
.team-card{background:var(--white); border-radius:var(--radius-md); overflow:hidden; border:1px solid var(--line); transition:box-shadow .35s var(--ease), transform .35s var(--ease); height:100%;}
.team-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-lift);}
.team-photo{
  aspect-ratio:4/4.6; background:linear-gradient(150deg, var(--teal-700), var(--teal-900));
  display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;
}
.team-photo::before{
  content:""; position:absolute; inset:0; opacity:.18;
  background-image:radial-gradient(circle, #fff 1.5px, transparent 1.5px); background-size:18px 18px;
}
.team-photo svg{width:64px; height:64px; color:rgba(255,255,255,.85); position:relative; z-index:1;}
.team-info{padding:1.3rem 1.4rem;}
.team-info h4{font-size:1.05rem; margin-bottom:.1rem; color:var(--teal-900);}
.team-role{font-size:.82rem; color:var(--lime-600); font-weight:700; text-transform:uppercase; letter-spacing:.05em; display:block; margin-bottom:.6rem;}
.team-info p{font-size:.88rem; margin:0;}

/* ==========================================================================
   Timeline (about page)
   ========================================================================== */
.timeline{position:relative; padding-left:2.2rem; border-left:2px solid var(--line);}
.timeline-item{position:relative; padding-bottom:2.4rem;}
.timeline-item:last-child{padding-bottom:0;}
.timeline-item::before{
  content:""; position:absolute; left:-2.53rem; top:.2rem; width:14px; height:14px; border-radius:50%;
  background:var(--lime-500); border:3px solid var(--cream-50); box-shadow:0 0 0 2px var(--teal-700);
}
.timeline-item h4{color:var(--teal-900); margin-bottom:.3rem;}
.timeline-year{font-family:var(--font-display); color:var(--teal-600); font-weight:600;}

/* ==========================================================================
   Stats / mission-vision
   ========================================================================== */
.mv-card{background:var(--white); border-radius:var(--radius-md); padding:2.4rem; height:100%; border-top:3px solid var(--lime-500); box-shadow:var(--shadow-soft);}
.mv-card .icon-wrap{width:52px; height:52px; border-radius:14px; background:var(--teal-100); color:var(--teal-700); display:flex; align-items:center; justify-content:center; margin-bottom:1.2rem;}
.mv-card .icon-wrap svg{width:26px; height:26px;}

/* ==========================================================================
   Rendez-vous — process steps & option cards
   ========================================================================== */
.step-item{display:flex; gap:1rem; align-items:flex-start;}
.step-num{
  width:38px; height:38px; border-radius:50%; background:var(--lime-500); color:var(--teal-950);
  font-family:var(--font-display); font-weight:700; display:flex; align-items:center; justify-content:center;
  flex-shrink:0; font-size:1.02rem;
}
.step-item h4{font-size:1rem; margin-bottom:.2rem; color:var(--teal-900);}
.step-item p{font-size:.88rem; margin:0;}

.option-card{position:relative;}
.option-card input{position:absolute; opacity:0; inset:0; margin:0; cursor:pointer;}
.option-card label{
  display:flex; align-items:center; gap:.6rem; border:1.5px solid var(--line); border-radius:var(--radius-sm);
  padding:.7rem 1rem; font-size:.9rem; font-weight:600; color:var(--ink-700); cursor:pointer;
  transition:all .25s var(--ease); background:var(--white); height:100%;
}
.option-card input:checked + label{border-color:var(--teal-700); background:var(--teal-100); color:var(--teal-900);}
.option-card input:focus-visible + label{outline:3px solid var(--lime-500); outline-offset:2px;}

.rdv-sidebar-card{background:var(--white); border-radius:var(--radius-md); padding:1.8rem; border:1px solid var(--line); margin-bottom:1.5rem;}
.rdv-sidebar-card h4{font-size:1rem; color:var(--teal-900); margin-bottom:1rem;}

/* ==========================================================================
   Galerie — modale "Découvrir le centre en images"
   ========================================================================== */
.gallery-modal .modal-dialog{max-width:900px;}
.gallery-modal .modal-content{background:var(--teal-950); border:none; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lift);}
.gallery-modal .modal-header{border:none; position:absolute; right:0; top:0; z-index:5; padding:1rem;}
.gallery-modal .btn-close{filter:invert(1); opacity:.85; background-color:rgba(8,44,41,.55); border-radius:50%; padding:.6rem; box-shadow:0 4px 12px rgba(0,0,0,.3);}
.gallery-modal .modal-body{padding:0;}
.gallery-slide{position:relative;}
.gallery-slide img{width:100%; height:56vh; min-height:340px; object-fit:cover; display:block; background:var(--teal-900);}
.gallery-caption{position:absolute; left:0; right:0; bottom:0; padding:1.6rem 2rem; background:linear-gradient(0deg, rgba(6,37,34,.92) 20%, transparent 100%);}
.gallery-caption .eyebrow{color:var(--lime-400); margin-bottom:.3rem;}
.gallery-caption h4{color:var(--white); margin:0 0 .2rem; font-size:1.2rem;}
.gallery-caption p{color:rgba(255,255,255,.75); margin:0; font-size:.86rem;}
.gallery-modal .carousel-indicators{bottom:auto; top:1rem; left:2rem; right:auto; width:auto; justify-content:flex-start; margin:0;}
.gallery-modal .carousel-indicators [data-bs-target]{
  width:8px; height:8px; border-radius:50%; background-color:rgba(255,255,255,.5); border:none; margin:0 4px; opacity:1;
}
.gallery-modal .carousel-indicators .active{background-color:var(--lime-500); width:22px; border-radius:5px;}
.gallery-modal .carousel-control-prev,.gallery-modal .carousel-control-next{width:56px;}
.gallery-modal .carousel-control-prev-icon,.gallery-modal .carousel-control-next-icon{
  background-color:rgba(8,44,41,.55); border-radius:50%; padding:14px; background-size:16px;
}
.gallery-trigger-label{font-size:.8rem; color:rgba(255,255,255,.7); margin-top:.15rem;}

/* ==========================================================================
   Contact
   ========================================================================== */
.contact-form-wrap{background:var(--white); border-radius:var(--radius-lg); padding:2.6rem; box-shadow:var(--shadow-soft); border:1px solid var(--line);}
.form-control,.form-select{
  border:1.5px solid var(--line); border-radius:var(--radius-sm); padding:.7rem 1rem; font-size:.95rem;
  transition:border-color .25s var(--ease), box-shadow .25s var(--ease);
}
.form-control:focus,.form-select:focus{border-color:var(--teal-600); box-shadow:0 0 0 4px var(--teal-100); outline:none;}
.form-label{font-weight:600; font-size:.85rem; color:var(--teal-900); margin-bottom:.4rem;}
.form-floating>label{color:var(--ink-500);}

.contact-info-card{background:var(--teal-900); color:var(--white); border-radius:var(--radius-lg); padding:2.6rem;}
.contact-info-card h3{color:var(--white);}
.contact-line{display:flex; gap:1rem; align-items:flex-start; margin-bottom:1.4rem;}
.contact-line .icon-chip{
  width:44px; height:44px; border-radius:12px; background:rgba(255,255,255,.1); color:var(--lime-400);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.contact-line .icon-chip svg{width:20px; height:20px;}
.contact-line strong{display:block; color:var(--white); font-size:.95rem;}
.contact-line span,.contact-line a{color:rgba(255,255,255,.75); font-size:.9rem;}
.hours-table{width:100%; font-size:.88rem; color:rgba(255,255,255,.85); margin-top:.4rem;}
.hours-table td{padding:.25rem 0; border-bottom:1px dashed rgba(255,255,255,.15);}
.hours-table td:last-child{text-align:right; font-weight:600; color:var(--lime-400);}

/* Compact variant: used on the Contact page so the map can sit prominently below it */
.contact-info-card--compact{padding:1.6rem 1.8rem;}
.contact-info-card--compact h3{font-size:1.05rem; margin-bottom:1.1rem !important;}
.contact-info-card--compact .eyebrow{font-size:.66rem; margin-bottom:.2rem;}
.contact-info-card--compact .contact-line{margin-bottom:.9rem; gap:.75rem;}
.contact-info-card--compact .contact-line .icon-chip{width:36px; height:36px; border-radius:10px;}
.contact-info-card--compact .contact-line .icon-chip i{font-size:.9rem;}
.contact-info-card--compact .contact-line strong{font-size:.85rem;}
.contact-info-card--compact .contact-line span,
.contact-info-card--compact .contact-line a{font-size:.82rem;}
.contact-info-card--compact .hours-table{font-size:.8rem; margin-top:.15rem;}
.contact-info-card--compact .hours-table td{padding:.15rem 0;}
.contact-info-card--compact .social-row{margin-top:1.1rem;}
.contact-info-card--compact .social-row a{width:34px; height:34px;}
.contact-info-card--compact .social-row svg,
.contact-info-card--compact .social-row i{font-size:.9rem;}

.social-row{display:flex; gap:.7rem; margin-top:1.6rem;}
.social-row a{
  width:40px; height:40px; border-radius:50%; background:rgba(255,255,255,.1); display:flex; align-items:center; justify-content:center;
  color:var(--white); transition:all .3s var(--ease);
}
.social-row a:hover{background:var(--lime-500); color:var(--teal-950); transform:translateY(-3px);}
.social-row svg{width:18px; height:18px;}

.map-frame{border-radius:var(--radius-md); overflow:hidden; border:1px solid var(--line); height:360px;}
.map-frame iframe{width:100%; height:100%; border:0;}

/* ==========================================================================
   Page hero (inner pages)
   ========================================================================== */
.page-hero{
  background:linear-gradient(120deg, var(--teal-950), var(--teal-700));
  padding:9.5rem 0 4.5rem; color:var(--white); position:relative; overflow:hidden;
}
.page-hero::before{
  content:""; position:absolute; right:-60px; top:-60px; width:320px; height:320px; border-radius:50%;
  background:radial-gradient(circle, rgba(166,201,61,.22), transparent 70%);
}
.page-hero h1{color:var(--white); font-size:clamp(2rem,3.6vw,2.9rem);}
.breadcrumb-procare{font-size:.85rem; color:rgba(255,255,255,.7);}
.breadcrumb-procare a{color:rgba(255,255,255,.85); font-weight:600;}
.breadcrumb-procare span{color:var(--lime-400); margin:0 .4rem;}

/* ==========================================================================
   CTA banner
   ========================================================================== */
.cta-banner{
  background:linear-gradient(120deg, var(--teal-800), var(--teal-950)); border-radius:var(--radius-lg); padding:3.2rem;
  position:relative; overflow:hidden;
}
.cta-banner::after{
  content:""; position:absolute; left:-40px; bottom:-60px; width:260px; height:260px; border-radius:50%;
  background:radial-gradient(circle, rgba(166,201,61,.2), transparent 70%);
}
.cta-banner h2{color:var(--white);}
.cta-banner p{color:rgba(255,255,255,.78);}

/* ==========================================================================
   Footer
   ========================================================================== */
.footer{background:var(--teal-950); color:rgba(255,255,255,.75); padding:4rem 0 1.6rem;}
.footer h5{color:var(--white); font-family:var(--font-display); font-size:1.1rem; margin-bottom:1.1rem;}
.footer a{color:rgba(255,255,255,.68); font-size:.92rem;}
.footer a:hover{color:var(--lime-400);}
.footer ul{list-style:none; padding:0; margin:0;}
.footer li{margin-bottom:.6rem;}
.footer .brand-word{color:var(--white);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12); margin-top:2.6rem; padding-top:1.4rem; font-size:.82rem; color:rgba(255,255,255,.55);}

.back-to-top{
  position:fixed; right:1.5rem; bottom:1.5rem; width:46px; height:46px; border-radius:50%; background:var(--teal-900);
  color:var(--white); display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden;
  transform:translateY(10px); transition:all .3s var(--ease); z-index:60; box-shadow:var(--shadow-lift); border:none;
}
.back-to-top.show{opacity:1; visibility:visible; transform:translateY(0);}
.back-to-top:hover{background:var(--lime-500); color:var(--teal-950);}

/* ==========================================================================
   Reveal-on-scroll
   ========================================================================== */
.reveal{opacity:0; transform:translateY(24px); transition:opacity .7s var(--ease), transform .7s var(--ease);}
.reveal.in-view{opacity:1; transform:translateY(0);}
.reveal-delay-1{transition-delay:.08s;}
.reveal-delay-2{transition-delay:.16s;}
.reveal-delay-3{transition-delay:.24s;}
.reveal-delay-4{transition-delay:.32s;}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important;}
  .reveal{opacity:1; transform:none;}
}

/* ==========================================================================
   Misc utility
   ========================================================================== */
.text-lime{color:var(--lime-500) !important;}
.badge-soft{background:var(--lime-100); color:var(--teal-700); font-weight:700; font-size:.72rem; letter-spacing:.05em; text-transform:uppercase; padding:.4rem .8rem; border-radius:var(--radius-pill);}