/* =========================================================
   VetCanvas Studio — Veterinary Website Design Landing Page
   Design tokens: deep clinical teal + warm sand + burnt amber
   ========================================================= */

:root{
  --teal-900:#0F4C4C;
  --teal-700:#15665F;
  --teal-500:#1F8076;
  --sand-50:#FAF6EE;
  --sand-100:#F3ECDD;
  --sage-200:#CFE3D8;
  --amber-500:#E8763C;
  --amber-600:#D2611F;
  --ink-900:#13201E;
  --ink-700:#3A4744;
  --ink-400:#6B7975;
  --white:#FFFFFF;

  --font-display:'Fraunces', Georgia, serif;
  --font-body:'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:'JetBrains Mono', monospace;

  --radius-lg:22px;
  --radius-md:14px;
  --radius-sm:8px;

  --shadow-soft:0 12px 36px -12px rgba(15,76,76,0.22);
  --shadow-card:0 8px 24px -8px rgba(19,32,30,0.14);

  --header-h:105px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}

body{
  margin:0;
  font-family:var(--font-body);
  color: var(--ink-900);
  background:var(--sand-50);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%; display:block;}

a{color:var(--teal-700); text-decoration:none;}
a:hover{color:var(--amber-600);}

h1,h2,h3,h4{font-family:var(--font-display); color:var(--ink-900); margin:0;}

.container, .container-fluid{padding-left:24px; padding-right:24px;}

::selection{background:var(--amber-500); color:var(--white);}

:focus-visible{
  outline:3px solid var(--amber-500);
  outline-offset:3px;
  border-radius:4px;
}

/* Skip link */
.skip-link{
  position:absolute; left:-999px; top:0;
  background:var(--teal-900); color:var(--white);
  padding:10px 18px; z-index:2000; border-radius:0 0 8px 0;
  font-family:var(--font-body); font-weight:600;
}
.skip-link:focus{left:0;}

.eyebrow{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:0.78rem;
  font-weight:600;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--amber-600);
  margin-bottom:14px;
}
.eyebrow--light{color:#FFD9C2;}

.section-title{
  font-size:clamp(1.8rem, 1.2rem + 2vw, 2.7rem);
  font-weight:600;
  line-height:1.18;
  letter-spacing:-0.01em;
  max-width:18ch;
}
.section-title + .heading-scan{margin-top:18px;}

.heading-scan{
  width:64px; height:3px; border-radius:3px;
  background:linear-gradient(90deg, var(--amber-500), transparent);
  margin:18px 0 22px;
  position:relative;
  overflow:hidden;
}
.heading-scan::after{
  content:'';
  position:absolute; top:0; left:-40%;
  width:40%; height:100%;
  background:rgba(255,255,255,0.9);
  animation:scanSweep 3.2s ease-in-out infinite;
}
.heading-scan--center{margin-left:auto; margin-right:auto;}
@keyframes scanSweep{
  0%{left:-40%;}
  60%{left:110%;}
  100%{left:110%;}
}

.scan-line{
  display:inline-block; width:8px; height:8px; border-radius:50%;
  background:var(--amber-500);
  box-shadow:0 0 0 0 rgba(232,118,60,0.6);
  animation:pulseDot 2.2s infinite;
  margin-right:8px; vertical-align:middle;
}
.pulse-dot{
  display:inline-block; width:9px; height:9px; border-radius:50%;
  background:#2FBF71;
  box-shadow:0 0 0 0 rgba(47,191,113,0.6);
  animation:pulseDot 1.8s infinite;
}
@keyframes pulseDot{
  0%{box-shadow:0 0 0 0 rgba(47,191,113,0.55);}
  70%{box-shadow:0 0 0 9px rgba(47,191,113,0);}
  100%{box-shadow:0 0 0 0 rgba(47,191,113,0);}
}

.section-lead{
  color:var(--ink-700);
  font-size:1.06rem;
  max-width:46ch;
}
.section-lead--center{margin:0 auto; text-align:center;}
.text-center .section-title{margin-left:auto; margin-right:auto;}

/* Buttons (shared) */
.btn{
  font-family:var(--font-body);
  font-weight:700;
  border-radius:999px;
  padding:12px 26px;
  font-size:0.96rem;
  border:none;
  transition:transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease, color 0.25s ease;
  display:inline-flex; align-items:center; gap:8px;
  white-space:nowrap;
}
.btn:active{transform:scale(0.97);}

.btn-primary-cta{
  background:var(--amber-500);
  color:var(--white);
  box-shadow:0 10px 24px -8px rgba(232,118,60,0.55);
  align-items: center;
  display: block;
}
.btn-primary-cta:hover{background:var(--amber-600); color:var(--white); transform:translateY(-2px);}

.btn-secondary-cta{
  background:var(--white); color:var(--teal-900);
  border:1.5px solid var(--sage-200);
}
.btn-secondary-cta:hover{border-color:var(--teal-700); color:var(--teal-900); transform:translateY(-2px);}

.btn-outline-cta{
  background:transparent; color:var(--teal-900);
  border:1.5px solid var(--teal-900);
}
.btn-outline-cta:hover{background:var(--teal-900); color:var(--white);}

.btn-cta-light{background:var(--white); color:var(--teal-900);}
.btn-cta-light:hover{background:var(--amber-500); color:var(--white); transform:translateY(-2px);}
.btn-cta-outline{background:transparent; color:var(--white); border:1.5px solid rgba(255,255,255,0.55);}
.btn-cta-outline:hover{background:rgba(255,255,255,0.14); color:var(--white);}

.section-action-row{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  margin-top:48px;
  justify-content: center;
}
.section-action-row--center{justify-content:center;}

/* =========================================================
   HEADER
   ========================================================= */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  height:var(--header-h);
  background:rgba(250,246,238,0.88);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(15,76,76,0.08);
  transition:background-color 0.3s ease, box-shadow 0.3s ease;
}
.site-header.is-scrolled{
  box-shadow:0 8px 24px -16px rgba(15,76,76,0.35);
}
.header-inner{
  height:100%;
  display:flex; align-items:center; justify-content:space-between;
  max-width:1320px; margin:0 auto;
}
.brand{
  display:flex; align-items:center; gap:10px;
  color:var(--teal-900); font-family:var(--font-display);
}
.brand-mark{color:var(--amber-500); display:flex;}
.brand-text{font-size:1.28rem; font-weight:600; line-height:1; display:flex; flex-direction:column;}
.brand-text-sub{font-family:var(--font-mono); font-size:0.6rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--ink-400); font-weight:500;}
.brand:hover{color:var(--teal-900);}

.header-actions{display:flex; align-items:center; gap:12px;}

.btn-call{
  background:transparent; color:var(--teal-900);
  border:1.5px solid var(--sage-200);
  padding:10px 18px;
}
.btn-call:hover{border-color:var(--teal-700); color:var(--teal-900);}
.btn-call .icon-phone{flex-shrink:0;}

.btn-quote{
  background:var(--teal-900); color:var(--white);
  padding:11px 22px;
  box-shadow:0 10px 22px -10px rgba(15,76,76,0.55);
}
.btn-quote:hover{background:var(--amber-500); color:var(--white); transform:translateY(-2px);}

@media (max-width:575.98px){
  .btn-call .call-text{display:none;}
  .btn-call{padding:10px; border-radius:50%;}
  .btn-quote{padding:10px 16px; font-size:0.86rem;}
  .brand-text{font-size:1.05rem;}
}

/* =========================================================
   HERO
   ========================================================= */
.hero{
  position:relative;
  padding-top:calc(var(--header-h) + 64px);
  padding-bottom:80px;
  overflow:hidden;
  background:var(--sand-50);
}
.hero-diagonal{
  position:absolute; top:0; right:0;
  width:58%; height:100%;
  background:linear-gradient(160deg, var(--teal-900) 0%, var(--teal-700) 100%);
  clip-path:polygon(28% 0, 100% 0, 100% 100%, 0% 100%);
  z-index:0;
}
.hero-container{position:relative; z-index:1; max-width:1320px;}

.hero-title{
  font-size:clamp(2.4rem, 1.6rem + 3vw, 3.6rem);
  font-weight:600;
  line-height:1.08;
  letter-spacing:-0.015em;
  margin-bottom:22px;
}
.hero-title-accent{color:var(--amber-500); font-style:italic;}

.hero-sub{
  font-size:1.12rem;
  color:var(--ink-700);
  max-width:46ch;
  margin-bottom:34px;
}

.hero-cta-row{display:flex; gap:16px; flex-wrap:wrap; margin-bottom:44px;}

.hero-trust{
  display:flex; align-items:center; gap:20px; flex-wrap:wrap;
}
.hero-trust-item{display:flex; flex-direction:column; gap:2px;}
.hero-trust-item strong{font-family:var(--font-display); font-size:1.3rem; color:var(--teal-900);}
.hero-trust-item span{font-size:0.82rem; color:var(--ink-400);}
.hero-trust-divider{width:1px; height:34px; background:rgba(15,76,76,0.18);}

.hero-media{position:relative; z-index:1;}
.hero-image-frame{
  position:relative;
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:var(--shadow-soft);
  max-width:440px;
  margin-left:auto;
}
.hero-img{
  width:100%; height:520px; object-fit:cover;
  border-radius:var(--radius-lg);
}

.hero-floating-card{
  position:absolute;
  background:var(--white);
  border-radius:var(--radius-md);
  box-shadow:var(--shadow-card);
  padding:12px 16px;
  display:flex; align-items:center; gap:10px;
  font-size:0.85rem; font-weight:600;
  animation:floatCard 5s ease-in-out infinite;
}
.hero-floating-card--top{top:28px; left:-26px;}
.hero-floating-card--bottom{
  bottom:30px; right:-22px;
  animation-delay:1.4s;
}
.hero-floating-card--bottom strong{display:block; font-family:var(--font-display); font-size:1rem; color:var(--teal-900);}
.hero-floating-card--bottom span{display:block; font-size:0.74rem; color:var(--ink-400); font-weight:500;}
.hero-floating-card--bottom svg{color:var(--amber-500); flex-shrink:0;}

@keyframes floatCard{
  0%, 100%{transform:translateY(0);}
  50%{transform:translateY(-9px);}
}

.scroll-cue{
  position:absolute; bottom:18px; left:50%; transform:translateX(-50%);
  width:24px; height:38px; border:2px solid rgba(15,76,76,0.3);
  border-radius:14px; z-index:1;
}
.scroll-cue span{
  position:absolute; top:6px; left:50%; transform:translateX(-50%);
  width:4px; height:8px; border-radius:3px;
  background:var(--amber-500);
  animation:scrollCueMove 1.8s ease-in-out infinite;
}
@keyframes scrollCueMove{
  0%{opacity:1; top:6px;}
  60%{opacity:0; top:18px;}
  100%{opacity:0; top:6px;}
}

@media (max-width:991.98px){
  .hero-diagonal{width:100%; clip-path:polygon(0 78%, 100% 60%, 100% 100%, 0 100%); opacity:0.95;}
  .hero{padding-top:calc(var(--header-h) + 40px);}
  .hero-image-frame{margin:0 auto; max-width:380px;}
  .hero-floating-card--top{left:-10px;}
  .hero-floating-card--bottom{right:-10px;}
}
@media (max-width:575.98px){
  .hero-img{height:400px;}
  .hero-floating-card{padding:9px 12px; font-size:0.76rem;}
  .hero-cta-row .btn{width:100%; justify-content:center;}
  .hero-cta-row{flex-direction:column;}
}

/* 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;}
}

/* =========================================================
   ABOUT
   ========================================================= */
.about-section{padding:96px 0; background:var(--white);}

.about-image-stack{position:relative; max-width:480px;}
.about-img-main{
  border-radius:var(--radius-lg);
  width:100%; height:420px; object-fit:cover;
  box-shadow:var(--shadow-card);
}
.about-image-tag{
  position:absolute; bottom:-22px; left:24px; right:24px;
  background:var(--white);
  border-radius:var(--radius-md);
  box-shadow:var(--shadow-soft);
  padding:14px 18px;
  font-size:0.88rem; font-weight:600; color:var(--ink-900);
  display:flex; align-items:center;
}

.about-stats{margin-top:38px;}
.about-stat-num{
  font-size:2rem; font-weight:600; color:var(--teal-900);
  margin-bottom:4px;
}
.about-stat-label{
  font-size:0.86rem; color:var(--ink-400); margin:0; max-width:20ch;
}

@media (max-width:991.98px){
  .about-image-stack{margin:0 auto 36px; max-width:420px;}
}

/* =========================================================
   SERVICES
   ========================================================= */
.services-section{padding:96px 0; background:var(--sand-100);}

.service-card{
  background:var(--white);
  border-radius:var(--radius-lg);
  padding:34px 28px;
  height:100%;
  box-shadow:var(--shadow-card);
  transition:transform 0.3s ease, box-shadow 0.3s ease;
  border:1px solid transparent;
}
.service-card:hover{
  transform:translateY(-6px);
  box-shadow:0 18px 40px -14px rgba(15,76,76,0.28);
  border-color:var(--sage-200);
}
.service-icon{
  width:56px; height:56px; border-radius:16px;
  background:var(--sage-200); color:var(--teal-900);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:20px;
  transition:background-color 0.3s ease, transform 0.3s ease;
}
.service-card:hover .service-icon{background:var(--amber-500); color:var(--white); transform:rotate(-6deg) scale(1.06);}
.service-card h3{font-size:1.18rem; font-weight:600; margin-bottom:10px;}
.service-card p{color:var(--ink-700); font-size:0.95rem; margin:0;}

/* =========================================================
   PORTFOLIO
   ========================================================= */
.portfolio-section{padding:96px 0; background:var(--white);}

.portfolio-card{
  border-radius:var(--radius-lg);
  overflow:hidden;
  background:var(--sand-50);
  box-shadow:var(--shadow-card);
  height:100%;
  transition:transform 0.35s ease, box-shadow 0.35s ease;
}
.portfolio-card:hover{transform:translateY(-6px); box-shadow:0 20px 44px -16px rgba(15,76,76,0.3);}

.portfolio-img-wrap{position:relative; overflow:hidden; height:240px;}
.portfolio-img-wrap img{
  width:100%; height:100%; object-fit:cover;
  transition:transform 0.5s ease;
}
.portfolio-card:hover .portfolio-img-wrap img{transform:scale(1.08);}

.portfolio-tag{
  position:absolute; top:14px; left:14px;
  background:rgba(15,76,76,0.92); color:var(--white);
  font-family:var(--font-mono); font-size:0.7rem; letter-spacing:0.06em;
  text-transform:uppercase; padding:6px 12px; border-radius:999px;
}
.portfolio-body{padding:22px 24px 26px;}
.portfolio-body h3{font-size:1.1rem; font-weight:600; margin-bottom:8px;}
.portfolio-body p{font-size:0.92rem; color:var(--ink-700); margin:0;}

/* =========================================================
   CTA
   ========================================================= */
.cta-section{
  position:relative;
  padding:110px 0;
  overflow:hidden;
  background:var(--teal-900);
}
.cta-bg-img{position:absolute; inset:0;}
.cta-bg-img img{width:100%; height:100%; object-fit:cover; opacity:0.32;}
.cta-overlay{
  position:absolute;
  inset:0;
  background: linear-gradient(160deg, #0f4c4cf0, rgba(15, 76, 76, 0.86));
}
.cta-content{position:relative; z-index:1; max-width:760px; margin:0 auto; text-align:center;}
.cta-title{
  font-size:clamp(1.9rem, 1.3rem + 2.2vw, 2.7rem);
  color:var(--white); font-weight:600; line-height:1.18; margin-bottom:18px;
}
.cta-sub{color:rgba(255,255,255,0.82); font-size:1.05rem; max-width:52ch; margin:0 auto 8px;}

@media (max-width:575.98px){
  .cta-section{padding:80px 0;}
}

/* =========================================================
   TESTIMONIALS
   ========================================================= */
.testimonials-section{padding:96px 0; background:var(--sage-200);}

.testimonial-card{
  background:var(--white);
  border-radius:var(--radius-lg);
  padding:30px 28px;
  height:100%;
  box-shadow:var(--shadow-card);
  transition:transform 0.3s ease;
}
.testimonial-card:hover{transform:translateY(-5px);}
.testimonial-stars{color:var(--amber-500); letter-spacing:3px; margin-bottom:16px; font-size:1rem;}
.testimonial-text{color:var(--ink-700); font-size:0.97rem; margin-bottom:22px;}
.testimonial-author{display:flex; align-items:center; gap:12px;}
.testimonial-avatar{
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 50%;
  background: var(--teal-700, #1a6b6b);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 0.82rem;
  flex-shrink: 0;
  letter-spacing: 0.05em;
  overflow: hidden;
}
.testimonial-avatar--dr { background: #0f4c4c; }
.testimonial-avatar--mk { background: #b5541a; }
.testimonial-avatar--jt { background: #2d6a4f; }
.testimonial-author strong{display:block; font-size:0.92rem; color:var(--ink-900);}
.testimonial-author span{display:block;font-size: 1.2rem;color:var(--ink-400);}

/* =========================================================
   CONTACT
   ========================================================= */
.contact-section{padding:96px 0; background:var(--white);}

.contact-info-list{margin-top:30px; display:flex; flex-direction:column; gap:18px;}
.contact-info-item{display:flex; align-items:center; gap:14px; color:var(--ink-700); font-size:0.96rem;}
.contact-info-item svg{color:var(--amber-500); flex-shrink:0;}

/* Forms (shared between contact section + quote modal) */
.vet-form .form-label{font-size:0.85rem; font-weight:600; color:var(--ink-900); margin-bottom:6px;}
.vet-form .form-control{
  border:1.5px solid var(--sage-200);
  border-radius:var(--radius-sm);
  padding:11px 14px;
  font-family:var(--font-body);
  font-size:0.95rem;
  background:var(--sand-50);
  transition:border-color 0.2s ease, box-shadow 0.2s ease;
}
.vet-form .form-control:focus{
  border-color:var(--teal-700);
  box-shadow:0 0 0 3px rgba(31,128,118,0.15);
  background:var(--white);
}
.optional-tag{color:var(--ink-400); font-weight:400;}

.vet-consent-check{
  background:transparent;
  border-radius:var(--radius-sm);
  padding:6px 0;
  display:flex; align-items:flex-start; gap:10px;
}
.vet-consent-check .form-check-input{
  margin-top:3px; flex-shrink:0;
  width:18px; height:18px;
  border:1.5px solid var(--teal-700);
}
.vet-consent-check .form-check-input:checked{background-color:var(--teal-900); border-color:var(--teal-900);}
.vet-consent-check .form-check-label{font-size:0.86rem; color:var(--ink-700); line-height:1.5;}
.vet-consent-check .form-check-label a{color:var(--teal-900); font-weight:600; text-decoration:underline;}

.form-success-msg{
  display:none;
  margin:14px 0 0;
  padding:12px 16px;
  background:rgba(47,191,113,0.12);
  border:1px solid rgba(47,191,113,0.35);
  border-radius:var(--radius-sm);
  color:#1B7A45;
  font-size:0.88rem;
  font-weight:600;
}
.form-success-msg.is-visible{display:block;}

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer{background: var(--teal-900) !important;color:rgba(255,255,255,0.78);padding:64px 0 36px;}
.site-footer .brand{color:var(--white);}
.site-footer .brand-mark{color:var(--amber-500);}
.site-footer .brand-text-sub{color:rgba(255,255,255,0.55);}
.footer-top{display:flex; flex-direction:column; gap:14px; max-width:480px;}
.footer-top.footer-top--with-contact{max-width:100%; width:100%; flex-direction:row; align-items:flex-start; justify-content:space-between;}
.footer-tagline{font-size:0.92rem; color:rgba(255,255,255,0.65); margin:0;}
.footer-divider{border-color:rgba(255,255,255,0.16); margin:36px 0 22px;}
.footer-bottom{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;
}
.footer-copy{font-size:0.84rem; margin:0; color:rgba(255,255,255,0.55);}
.footer-legal-links{display:flex; gap:10px; align-items:center; font-size:0.84rem;}
.footer-legal-links a{color:rgba(255,255,255,0.78);}
.footer-legal-links a:hover{color:var(--amber-500);}
.footer-legal-sep{color:rgba(255,255,255,0.35);}

/* =========================================================
   COOKIE CONSENT BAR
   ========================================================= */
.cookie-bar{
  position:fixed; bottom:0; left:0; right:0; z-index:1050;
  background:var(--ink-900); color:rgba(255,255,255,0.9);
  padding:18px 24px;
  transform:translateY(120%);
  transition:transform 0.5s cubic-bezier(.2,.8,.2,1);
  box-shadow:0 -8px 28px -10px rgba(0,0,0,0.4);
}
.cookie-bar.is-visible{transform:translateY(0);}
.cookie-bar-inner{
  max-width:1320px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
}
.cookie-text{font-size:0.86rem; margin:0; max-width:62ch; line-height:1.55;}
.cookie-text a{color:#FFB68A; text-decoration:underline;}
.cookie-actions{display:flex; gap:10px; flex-shrink:0;}
.btn-cookie-accept{background:var(--amber-500); color:var(--white); padding:9px 20px; font-size:0.86rem;}
.btn-cookie-accept:hover{background:var(--amber-600); color:var(--white);}
.btn-cookie-decline{background:transparent; color:rgba(255,255,255,0.75); border:1.5px solid rgba(255,255,255,0.3); padding:9px 20px; font-size:0.86rem;}
.btn-cookie-decline:hover{border-color:rgba(255,255,255,0.6); color:var(--white);}

@media (max-width:575.98px){
  .cookie-bar-inner{flex-direction:column; align-items:flex-start;}
  .cookie-actions{width:100%;}
  .cookie-actions .btn{flex:1; justify-content:center;}
}

/* =========================================================
   MODALS
   ========================================================= */
.vet-modal .modal-content{
  border-radius:var(--radius-lg);
  border:none;
  overflow:hidden;
}
.vet-modal-close{
  position:absolute;
  top:16px;
  right:16px;
  z-index:10;
  border-radius:50%;
  width:36px;
  height:36px;
  opacity:1;
  box-shadow:0 4px 12px rgba(0,0,0,0.15);
}
.quote-modal-side{position:relative; min-height:260px; height:100%;}
.quote-modal-side img{width:100%;height:100%;object-fit:cover;min-height: 700px;}
.quote-modal-side-overlay{
  position:absolute; inset:0; top:auto;
  background:linear-gradient(180deg, transparent, rgba(15,32,30,0.88));
  padding:26px 22px 22px;
  color:var(--white);
}
.quote-modal-side-quote{font-family:var(--font-display); font-style:italic; font-size:1.02rem; line-height:1.4; margin-bottom:8px;}
.quote-modal-side-overlay span{font-size:0.82rem; color:rgba(255,255,255,0.75);}

.vet-modal .modal-body{padding:40px 36px;}
.modal-title-text{font-size:1.5rem; font-weight:600; margin-bottom:10px;}
.modal-sub-text{color:var(--ink-700); font-size:0.94rem; margin-bottom:26px;}

@media (max-width:991.98px){
  .quote-modal-side{display:none;}
}

.legal-modal .modal-content{border-radius:var(--radius-lg); border:none;}
.legal-modal .modal-header{border-bottom:1px solid var(--sand-100); padding:24px 30px;}
.legal-body{padding:28px 30px; max-height:62vh; overflow-y:auto;}
.legal-body h3{font-size:1.02rem; font-weight:600; margin:22px 0 8px; color:var(--teal-900);}
.legal-body h3:first-of-type{margin-top:6px;}
.legal-body p{font-size:0.93rem; color:var(--ink-700); margin-bottom:6px;}

/* =========================================================
   AOS animation tuning
   ========================================================= */
[data-aos]{transition-timing-function:cubic-bezier(.2,.8,.2,1) !important;}

/* =========================================================
   AWS LOGO IMAGE
   ========================================================= */
.aws-logo-img {
  height: 110px;
  width: auto;
  object-fit: contain;
  display: block;
}
.aws-logo-img--footer {
  height: 96px;
  filter: brightness(0) invert(1);
}
.brand--logo-img {
  display: flex;
  align-items: center;
}

/* =========================================================
   CONSENT CHECKBOX — FINAL FIX (both forms)
   ========================================================= */
.vet-consent-check {
  position: relative !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  padding: 4px 0 4px 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  min-height: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
/* Override Bootstrap's padding-left on .form-check */
.vet-consent-check.form-check {
  padding-left: 0 !important;
}
.vet-consent-check .form-check-input {
  position: static !important;
  float: none !important;
  flex-shrink: 0 !important;
  width: 17px !important;
  height: 17px !important;
  margin: 3px 0 0 0 !important;
  border: 1.5px solid var(--teal-700) !important;
  cursor: pointer !important;
  background-color: #fff !important;
}
.vet-consent-check .form-check-input:checked {
  background-color: var(--teal-900) !important;
  border-color: var(--teal-900) !important;
}
.vet-consent-check .form-check-label {
  position: static !important;
  float: none !important;
  display: block !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  font-size: 0.84rem !important;
  color: var(--ink-700) !important;
  line-height: 1.55 !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
  margin: 0 !important;
  padding: 0 !important;
}
.vet-consent-check .form-check-label a {
  color: var(--teal-900) !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
}


/*new footer css*/
.site-footer .footer-top--with-contact {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start;
  justify-content: space-between;
  gap: 40px;
  flex-wrap: nowrap;
  max-width: 100% !important;
  width: 100%;
}

.site-footer .footer-brand-content {
  max-width: 340px;
  flex: 0 0 auto;
}

.site-footer .footer-contact-box {
  flex: 0 0 auto;
  max-width: 320px;
  text-align: left;
}

.site-footer .footer-contact-title {
  margin: 0 0 16px;
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.2;
  color: var(--amber-500, #e8a045);
  letter-spacing: 0.02em;
}

.site-footer .contact-info-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.site-footer .contact-info-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.site-footer .contact-info-item svg {
  flex: 0 0 20px;
  margin-top: 2px;
  color: var(--amber-500, #e8a045);
}

.site-footer .contact-info-item a,
.site-footer .contact-info-item span {
  color: rgba(255,255,255,0.85);
  text-decoration: none;
  line-height: 1.5;
  font-size: 0.9rem;
}

.site-footer .contact-info-item a:hover {
  text-decoration: underline;
}

@media (max-width: 767px) {
  .site-footer .footer-top--with-contact {
    flex-direction: column;
  }

  .site-footer .footer-contact-box {
    margin-left: 0;
    max-width: 100%;
  }
  
  header#siteHeader {
    position: relative;
    width: 100%;
}

.header-inner {
    display: inline-block !important;
    width: 100%;
    max-width: 100%;
}

.header-inner a {
    display: inline-block;
    width: 100%;
    text-align: center;
}

.header-inner a img {
    margin: 0 auto;
}

.header-actions {
    display: none;
}

section#hero {
    padding-top: 40px;
}

}

/* =========================================================
   AWS PACKAGES SECTION
   ========================================================= */
.aws-packages-section {
  padding: 96px 0;
  background: var(--sand-50);
}

/* ── Tab Pills ── */
.aws-packages-section .nav-pills .nav-link {
  font-family: var(--font-mono);
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--ink-700);
  background: var(--white);
  border: 1.5px solid var(--sage-200);
  border-radius: 999px;
  padding: 8px 18px;
  transition: all 0.25s ease;
  white-space: nowrap;
}
.aws-packages-section .nav-pills .nav-link:hover {
  border-color: var(--amber-500);
  color: var(--amber-600);
}
.aws-packages-section .nav-pills .nav-link.active {
  background: #0f4c4c;
  color: var(--white);
  border-color: #0f4c4c;
  box-shadow: 0 6px 18px -6px rgba(15,76,76,0.45);
}

/* ── Package Card ── */
.aws-pkg-card {
  background: var(--white);
  border-radius: var(--radius-lg);
  border: 1.5px solid var(--sand-100);
  padding: 24px 20px 20px;
  height: 100%;
  display: flex;
  flex-direction: column;
  box-shadow: var(--shadow-card);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.aws-pkg-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px -12px rgba(15,76,76,0.22);
}
.aws-pkg-card--featured {
  border-color: var(--amber-500);
  box-shadow: 0 12px 36px -10px rgba(232,118,60,0.35);
  position: relative;
}

/* ── Featured badge ─────────────────────────────────────────
   top: -14px  →  badge sits just above the card top edge
   The track has padding-top: 22px so there is always room.
   ───────────────────────────────────────────────────────── */
.aws-pkg-card--featured::before {
  content: '⭐ Most Popular';
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
  background: #e8763c !important;
  color: var(--white);
  font-family: var(--font-mono);
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  padding: 4px 14px;
  border-radius: 999px;
  white-space: nowrap;
  z-index: 10;
}

.aws-pkg-title {
  font-family: var(--font-display);
  font-size: 0.98rem;
  font-weight: 600;
  color: var(--teal-900);
  margin-bottom: 10px;
  line-height: 1.3;
}
.aws-pkg-price {
  font-family: var(--font-display);
  font-size: 2rem;
  font-weight: 700;
  color: var(--ink-900);
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin-bottom: 4px;
}
.aws-currency {
  font-size: 1.1rem;
  color: var(--amber-600);
  font-weight: 700;
}
.aws-pkg-old-price {
  font-size: 0.9rem;
  color: var(--ink-400);
  font-weight: 400;
  margin-left: 6px;
}
.aws-pkg-old-price s { text-decoration: line-through; }
.aws-pkg-addon {
  font-size: 0.76rem;
  color: var(--ink-400);
  margin-bottom: 10px;
  font-style: italic;
}

/* ── Feature list with internal scroll ── */
.aws-pkg-list {
  list-style: none;
  padding: 0;
  margin: 0;
  flex-grow: 1;
  max-height: 260px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--sage-200) transparent;
}
.aws-pkg-list::-webkit-scrollbar { width: 4px; }
.aws-pkg-list::-webkit-scrollbar-track { background: transparent; }
.aws-pkg-list::-webkit-scrollbar-thumb {
  background: var(--sage-200);
  border-radius: 4px;
}
.aws-pkg-list li {
  padding: 6px 0 6px 24px;
  position: relative;
  font-size: 0.84rem;
  color: var(--ink-700);
  border-bottom: 1px solid var(--sand-50);
  line-height: 1.4;
}
.aws-pkg-list li::before {
  content: '✓';
  position: absolute;
  left: 0;
  top: 6px;
  color: var(--amber-500);
  font-weight: 700;
  font-size: 0.8rem;
}

/* ── Actions ── */
.aws-pkg-actions { margin-top: 16px; flex-shrink: 0; }
.aws-speak-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background: var(--sand-100);
  border: 1.5px solid var(--sage-200);
  border-radius: var(--radius-sm);
  padding: 9px 12px;
  color: var(--ink-900);
  text-decoration: none;
  width: 100%;
  transition: border-color 0.2s ease, background 0.2s ease;
  margin-bottom: 8px;
}
.aws-speak-btn:hover {
  border-color: var(--teal-700);
  background: var(--white);
  color: var(--teal-900);
}
.aws-speak-btn small {
  font-size: 0.70rem;
  color: var(--ink-400);
  font-family: var(--font-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 2px;
}
.aws-speak-btn span {
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--teal-900);
}

/* =========================================================
   PKG SLIDER
   ========================================================= */
.pkg-slider {
  position: relative;
}

/* track-wrap clips the hidden side cards.
   margin-left/right = arrow button width + small gap */
.pkg-slider__track-wrap {
  overflow: hidden;
  margin: 0 52px;
}

/* The moving rail */
.pkg-slider__track {
  display: flex;
  gap: 20px;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  align-items: stretch;
  /* 22px top padding = room for the badge (14px above card top + a little air) */
  padding-top: 22px;
}

.pkg-slider__card {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
}
.pkg-slider__card .aws-pkg-card { flex: 1; }

/* ── Arrows ── */
.pkg-slider__btn {
  position: absolute;
  top: calc(50% + 11px); /* +11px shifts down to account for badge padding-top */
  transform: translateY(-50%);
  width: 40px !important;
  height: 40px !important;
  border-radius: 50%;
  border: none;
  background: #e8763c !important;
  color: #fff !important;
  font-size: 1.8rem;
  line-height: 1;
  display: flex !important;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 20;
  transition: background 0.2s ease, opacity 0.2s ease;
  padding: 0;
  box-shadow: 0 4px 12px rgba(0,0,0,0.18);
}
.pkg-slider__btn:hover { background: #c9622a !important; }
.pkg-slider__btn--prev { left: 4px; }
.pkg-slider__btn--next { right: 4px; }
.pkg-slider__btn[disabled],
.pkg-slider__btn.is-disabled {
  opacity: 0.3;
  cursor: default;
  pointer-events: none;
}

/* ── Dots ── */
.pkg-slider__dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 24px;
}
.pkg-slider__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #e8763c !important;
  opacity: 0.35;
  border: none;
  padding: 0;
  cursor: pointer;
  transition: opacity 0.2s, transform 0.2s;
}
.pkg-slider__dot.is-active {
  opacity: 1;
  transform: scale(1.3);
}

/* ── Responsive ── */
@media (max-width: 991.98px) {
  .pkg-slider__track-wrap { margin: 0 48px; }
}
@media (max-width: 767.98px) {
  .aws-packages-section .nav-pills .nav-link {
    font-size: 0.68rem;
    padding: 7px 12px;
  }
  .pkg-slider__track-wrap { margin: 0 44px; }
  .aws-pkg-price { font-size: 1.7rem; }
}


@media only screen and (max-width: 768px) and (orientation: portrait) {
    
        iframe#webWidget {
        max-width: 80%;
        margin: 0 auto;
        display: inline-block;
        right: 0;
        height: 80% !important;
        bottom: 0;
        top: initial !important;
    }
    
}