/* =========================================================
   RAHASYAM - HERITAGE POSTER THEME (FULL CSS)
   - Parchment / Sand / Sepia + Antique Gold
   - Better spacing, alignment, typography, responsive fixes
   ========================================================= */

:root{
  /* Poster palette */
  --paper: #f3e7d2;
  --paper2: #ead8bd;
  --sand: #dcc7a4;

  --ink: #27180f;          /* headings */
  --sepia: #4e331f;        /* main text */
  --sepia2: #6a452c;       /* secondary */
  --muted: rgba(78, 51, 31, .72);

  --gold: #caa25a;
  --gold2: #b1843f;
  --gold3: #e6c889;

  --line: rgba(177,132,63,.35);
  --line2: rgba(177,132,63,.22);

  --shadow: 0 18px 44px rgba(78,51,31,.16);
  --softShadow: 0 10px 26px rgba(78,51,31,.12);

  --radius: 18px;
  --radius2: 22px;

  --container-max: 1180px;
}

/* Base reset + smoothing */
*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin: 0;
  font-family: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--sepia);
  background:
    radial-gradient(900px 520px at 20% 8%, rgba(230,200,137,.40), transparent 62%),
    radial-gradient(950px 520px at 85% 18%, rgba(202,162,90,.28), transparent 60%),
    linear-gradient(180deg, var(--paper), var(--paper2));
  overflow-x: hidden;
}

img{ max-width: 100%; display: block; }
a{ color: inherit; }
::selection{ background: rgba(202,162,90,.35); }

/* Bootstrap container fine-tune */
.container{
  max-width: var(--container-max);
}

.brand-logo{
  height:75px;   /* adjust as needed */
  width:auto;
}

/* =========================================================
   TYPOGRAPHY
   ========================================================= */
.section-title,
.hero-title,
.brand-title,
.footer-title{
  font-family: "Cinzel", serif;
  letter-spacing: .5px;
  color: var(--ink);
}

.section-title{
  font-weight: 800;
  font-size: clamp(1.55rem, 2.1vw, 2.25rem);
  line-height: 1.12;
  margin: 0;
}

.section-eyebrow{
  display:inline-block;
  font-weight: 800;
  color: var(--gold2);
  letter-spacing: .18em;
  text-transform: uppercase;
  font-size: .76rem;
  margin-bottom: .55rem;
}

.section-lead{
  max-width: 820px;
  margin: .65rem auto 0;
  color: var(--muted);
  line-height: 1.7;
}

.section-text{
  color: rgba(78,51,31,.83);
  line-height: 1.78;
}

/* Keep headings from exploding in some sections */
h1, h2, h3, h4{
  word-break: normal;
  overflow-wrap: anywhere;
}

/* =========================================================
   SECTION SPACING (Fix empty space + better density)
   ========================================================= */
.section-pad{ padding: 72px 0; }

@media (min-width: 1200px){
  .section-pad{ padding: 84px 0; }
}

.section-soft{
  background:
    radial-gradient(1050px 400px at 28% 0%, rgba(230,200,137,.30), transparent 66%),
    linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.30));
  border-top: 1px solid var(--line2);
  border-bottom: 1px solid var(--line2);
}

/* =========================================================
   TOPBAR
   ========================================================= */
.topbar{
  background: linear-gradient(90deg, rgba(202,162,90,.40), rgba(177,132,63,.18));
  border-bottom: 1px solid var(--line);
}

.topbar-item{
  color: rgba(39,24,15,.88);
  font-size: .92rem;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.topbar-item:hover{
  color: var(--gold2);
}

.topbar .social-icon{
  width: 34px; height: 34px;
  border-radius: 50%;
  display:grid; place-items:center;
  color: var(--sepia);
  background: rgba(255,255,255,.62);
  border: 1px solid rgba(177,132,63,.40);
  transition: .22s ease;
  text-decoration: none;
}

.topbar .social-icon:hover{
  transform: translateY(-2px);
  background: rgba(230,200,137,.60);
  box-shadow: 0 10px 18px rgba(177,132,63,.18);
}

/* =========================================================
   NAVBAR / HEADER
   - Fixes: alignment, button spacing, consistent height
   ========================================================= */
.site-header{
  backdrop-filter: blur(10px);
}

/* Heritage navbar – matched with logo background */
.nav-heritage{
  background:
    linear-gradient(
      180deg,
      #f3e6d2 0%,   /* light sandstone */
      #ead6b6 55%,  /* warm marble beige */
      #e3caa3 100%  /* soft gold base */
    );

  border-bottom: 1px solid rgba(177,132,63,.22);
  box-shadow: 0 8px 20px rgba(78,51,31,.06);

  /* subtle texture feel */
  position: relative;
}

.nav-heritage::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(
      600px 200px at 50% 0%,
      rgba(255,255,255,.25),
      transparent 60%
    );
  pointer-events:none;
}


.navbar-brand{
  padding: .55rem 0;
}

.brand-mark{
  width: 44px; height: 44px;
  border-radius: 14px;
  display:grid; place-items:center;
  background: linear-gradient(145deg, rgba(230,200,137,.80), rgba(177,132,63,.32));
  border: 1px solid rgba(177,132,63,.45);
  box-shadow: 0 12px 20px rgba(78,51,31,.12);
  color: var(--ink);
  font-size: 1.15rem;
  flex: 0 0 auto;
}

.brand-mark.sm{
  width: 40px; height: 40px;
  border-radius: 14px;
}

.brand-text{
  line-height: 1.1;
}

.brand-title{
  font-weight: 900;
  font-size: 1.10rem;
  margin: 0;
  letter-spacing: .7px;

  /* embossed-gold look */
  background: linear-gradient(180deg, #f3dbab, #b1843f);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-shadow: 0 1px 0 rgba(39,24,15,.18);
}

.brand-subtitle{
  font-size: .72rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(78,51,31,.72);
  margin-top: 2px;
}

.navbar .nav-link{
  color: rgba(78,51,31,.88);
  font-weight: 700;
  position: relative;
  padding: .65rem .75rem;
}

.navbar .nav-link:hover,
.navbar .nav-link.active{
  color: var(--gold2);
}

.navbar .nav-link::after{
  content:"";
  position:absolute;
  left: .65rem; right: .65rem; bottom: .28rem;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(177,132,63,.88), transparent);
  transform: scaleX(0);
  transition: .25s ease;
}

.navbar .nav-link:hover::after,
.navbar .nav-link.active::after{
  transform: scaleX(1);
}

/* Navbar CTA fixes */
.navbar .btn{
  white-space: nowrap;
}

@media (max-width: 991px){
  .navbar .nav-link{ padding: .6rem .2rem; }
  .navbar-collapse{
    padding: .75rem 0 .2rem;
  }
}

/* =========================================================
   BUTTONS
   ========================================================= */
.btn-gold{
  background: linear-gradient(135deg, var(--gold3), var(--gold2));
  border: 1px solid rgba(177,132,63,.42);
  color: #241707;
  font-weight: 900;
  border-radius: 16px;
  padding: .78rem 1.1rem;
  box-shadow: 0 16px 30px rgba(177,132,63,.18);
}

.btn-gold:hover{
  transform: translateY(-1px);
  filter: brightness(1.02);
  color: #241707;
}

.btn-outline-gold{
  border: 1px solid rgba(177,132,63,.60);
  color: rgba(78,51,31,.90);
  background: rgba(255,255,255,.55);
  border-radius: 16px;
  padding: .78rem 1.1rem;
}

.btn-outline-gold:hover{
  background: rgba(230,200,137,.60);
  color: #241707;
}

.btn-glow{
  position: relative;
}

.btn-glow::before{
  content:"";
  position:absolute;
  inset:-7px;
  border-radius: 20px;
  background: radial-gradient(circle, rgba(230,200,137,.65), transparent 60%);
  filter: blur(8px);
  opacity: .85;
  z-index: -1;
}

/* =========================================================
   HERO / CAROUSEL
   - Fix: caption alignment + consistent height across screens
   ========================================================= */
.hero{
  position: relative;
}

.hero .carousel-caption{
  left: 0; right: 0;
  bottom: 10%;
  text-align: left;
  padding: 0;
}

.hero-slide{
  min-height: 82vh;
  background-size: cover;
  background-position: center;
  position: relative;
}

/* poster-like overlay */
.hero-slide::after{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(900px 520px at 25% 22%, rgba(230,200,137,.55), transparent 62%),
    linear-gradient(90deg, rgba(78,51,31,.78), rgba(78,51,31,.22) 60%, rgba(78,51,31,.68)),
    linear-gradient(180deg, rgba(78,51,31,.35), rgba(78,51,31,.58));
}

/* hero content card */
.hero-card{
  position: relative;
  max-width: 760px;
  padding: 26px 24px;
  border-radius: var(--radius2);
  border: 1px solid rgba(177,132,63,.38);
  background: linear-gradient(180deg, rgb(243 231 210 / 22%), rgb(234 216 189 / 58%));
  box-shadow: var(--shadow);
}

.hero-kicker .badge-heritage{
  background: rgba(230,200,137,.62);
  border: 1px solid rgba(177,132,63,.42);
  color: rgba(39,24,15,.92);
  font-weight: 800;
  padding: .55rem .9rem;
  border-radius: 999px;
}

.hero-title{
  font-weight: 900;
  margin-top: 10px;
  font-size: clamp(1.55rem, 3.0vw, 3.0rem);
  line-height: 1.07;
  color: var(--ink);
}

.hero-text{
  margin: 10px 0 16px;
  color: rgba(78,51,31,.78);
  line-height: 1.72;
}

.hero-badges{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 14px;
}

.mini-badge{
  display:flex; align-items:center; gap:8px;
  padding: .48rem .75rem;
  border-radius: 999px;
  border: 1px solid rgba(177,132,63,.35);
  background: rgba(255,255,255,.62);
  color: rgba(78,51,31,.86);
  font-size: .92rem;
}

/* Controls indicator visual */
.carousel-indicators [data-bs-target]{
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

@media (max-width: 991px){
  .hero-slide{ min-height: 72vh; }
  .hero .carousel-caption{ bottom: 8%; }
  .hero-card{ padding: 22px; }
}

@media (max-width: 575px){
  .hero-slide{ min-height: 68vh; }
  .hero-card{ border-radius: 18px; }
}

/* =========================================================
   ORNATE / CONTENT CARDS (Consistency)
   ========================================================= */
.ornate-card{
  border-radius: var(--radius2);
  border: 1px solid rgba(177,132,63,.35);
  background: linear-gradient(180deg, rgba(255,255,255,.80), rgba(243,231,210,.70));
  box-shadow: var(--softShadow);
  padding: 24px;
  position: relative;
  overflow: hidden;
}

.ornate-card::before{
  content:"";
  position:absolute; inset:-2px;
  background: radial-gradient(circle at 20% 0%, rgba(230,200,137,.42), transparent 60%);
  pointer-events:none;
}

/* Checked list */
.list-checked{
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.list-checked li{
  position: relative;
  padding-left: 30px;
  margin: 10px 0;
  color: rgba(78,51,31,.82);
}

.list-checked li::before{
  content:"\F26A";
  font-family: "bootstrap-icons";
  position:absolute; left: 0; top: 0;
  color: var(--gold2);
}

/* =========================================================
   ABOUT RIGHT VISUAL PANEL (Fix spacing on mobile)
   ========================================================= */
/* =========================
   ABOUT RIGHT IMAGE + SHAPES
   ========================= */
.about-media{
  position: relative;
  border-radius: var(--radius2);
  overflow: hidden;
  border: 1px solid rgba(177,132,63,.35);
  box-shadow: var(--shadow);
  min-height: 360px;
  background: linear-gradient(180deg, rgba(255,255,255,.65), rgba(243,231,210,.55));
}

/* Image styling */
.about-media-img{
  width: 100%;
  height: 100%;
  min-height: 360px;
  object-fit: cover;
  display: block;
  transform: scale(1.02);
  filter: sepia(.12) saturate(.98) contrast(1.06);
}

/* Soft poster-like overlay */
.about-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(700px 420px at 25% 25%, rgba(230,200,137,.38), transparent 60%),
    radial-gradient(700px 420px at 80% 55%, rgba(202,162,90,.26), transparent 62%),
    linear-gradient(180deg, rgba(39,24,15,.10), rgba(39,24,15,.20));
  pointer-events:none;
}

/* ===== Floating Shapes Base ===== */
.shape{
  position:absolute;
  pointer-events:none;
  opacity: .85;
  filter: drop-shadow(0 10px 18px rgba(78,51,31,.18));
  transform: translateZ(0);
}

/* Bubbles */
.bubble{
  border-radius: 999px;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.85), rgba(230,200,137,.35) 55%, rgba(177,132,63,.18));
  border: 1px solid rgba(177,132,63,.28);
  animation: floatY 6.5s ease-in-out infinite;
}

/* Squares */
.square{
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(230,200,137,.75), rgba(177,132,63,.22));
  border: 1px solid rgba(177,132,63,.32);
  animation: floatRotate 8s ease-in-out infinite;
}

/* Stars (simple 4-point sparkle) */
.star{
  width: 18px; height: 18px;
  background: radial-gradient(circle, rgba(255,255,255,.95), rgba(230,200,137,.55));
  clip-path: polygon(50% 0%, 60% 40%, 100% 50%, 60% 60%, 50% 100%, 40% 60%, 0% 50%, 40% 40%);
  border: 1px solid rgba(177,132,63,.22);
  animation: twinkle 3.2s ease-in-out infinite;
}

/* ===== Individual Positions/Sizes ===== */
.b1{ width: 64px; height: 64px; top: 10%; left: 10%; animation-delay: .2s; }
.b2{ width: 42px; height: 42px; top: 20%; right: 14%; animation-delay: 1.1s; }
.b3{ width: 54px; height: 54px; bottom: 14%; left: 18%; animation-delay: 2.0s; }

.s1{ width: 46px; height: 46px; bottom: 22%; right: 12%; animation-delay: .7s; }
.s2{ width: 34px; height: 34px; top: 55%; left: 55%; animation-delay: 1.6s; opacity: .65; }

.st1{ top: 38%; left: 22%; animation-delay: .4s; }
.st2{ top: 70%; right: 22%; animation-delay: 1.4s; opacity: .7; }

/* ===== Animations ===== */
@keyframes floatY{
  0%,100%{ transform: translateY(0); }
  50%{ transform: translateY(-14px); }
}

@keyframes floatRotate{
  0%,100%{ transform: translateY(0) rotate(0deg); }
  50%{ transform: translateY(-10px) rotate(10deg); }
}

@keyframes twinkle{
  0%,100%{ transform: scale(1); opacity: .75; }
  50%{ transform: scale(1.18); opacity: 1; }
}

/* Responsive adjustments */
@media (max-width: 991px){
  .about-media{ min-height: 320px; }
  .about-media-img{ min-height: 320px; }
}

@media (max-width: 575px){
  .about-media{ min-height: 280px; border-radius: 18px; }
  .about-media-img{ min-height: 280px; }
  .b1{ width: 54px; height: 54px; }
  .b3{ width: 44px; height: 44px; }
}


/* =========================================================
   SERVICES (Fix: equal card height + padding consistency)
   ========================================================= */
.service-card{
  border-radius: var(--radius2);
  border: 1px solid rgba(177,132,63,.35);
  background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(243,231,210,.68));
  box-shadow: var(--softShadow);
  padding: 22px;
  height: 100%;
  transition: transform .20s ease, box-shadow .20s ease, border-color .20s ease;
  position: relative;
  overflow:hidden;
}

.service-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 20px 44px rgba(78,51,31,.18);
  border-color: rgba(177,132,63,.55);
}

.service-icon{
  width: 54px; height: 54px;
  border-radius: 18px;
  display:grid; place-items:center;
  background: linear-gradient(145deg, rgba(230,200,137,.75), rgba(177,132,63,.30));
  border: 1px solid rgba(177,132,63,.45);
  color: var(--ink);
  font-size: 1.20rem;
  margin-bottom: 12px;
}

.service-title{
  font-family: "Cinzel", serif;
  font-weight: 900;
  margin: 0 0 6px;
  color: var(--ink);
  line-height: 1.2;
}

.service-text{
  margin: 0;
  color: rgba(78,51,31,.78);
  line-height: 1.7;
}

.service-tags{
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.service-tags span{
  font-size: .78rem;
  padding: .32rem .58rem;
  border-radius: 999px;
  background: rgba(230,200,137,.55);
  border: 1px solid rgba(177,132,63,.35);
  color: rgba(39,24,15,.88);
  font-weight: 700;
}


/* 360° rotate the icon on service card hover */
.service-icon i{
  display: inline-block;
  transition: transform .65s ease;
  transform-origin: 50% 50%;
  will-change: transform;
}

/* rotate when hovering the whole card */
.service-card:hover .service-icon i{
  transform: rotate(360deg);
}

/* optional: little pop effect on icon box for premium feel */
.service-icon{
  transition: transform .25s ease, box-shadow .25s ease;
}

.service-card:hover .service-icon{
  transform: translateY(-2px);
  box-shadow: 0 16px 28px rgba(78,51,31,.18);
}


/* =========================================================
   WHY CHOOSE (Fix: big gaps + card heights)
   ========================================================= */
.why-points{
  margin-top: 18px;
  display:grid;
  gap: 12px;
}

.why-point{
  display:flex;
  gap: 12px;
  align-items:flex-start;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(177,132,63,.30);
  background: rgba(255,255,255,.60);
}

.why-point i{
  color: var(--gold2);
  font-size: 1.35rem;
  margin-top: 2px;
}

.why-point h4{
  margin: 0;
  font-weight: 900;
  font-size: 1rem;
  color: var(--ink);
}

.why-point p{
  margin: 6px 0 0;
  color: rgba(78,51,31,.76);
  font-size: .95rem;
  line-height: 1.6;
}

.feature-card{
  border-radius: var(--radius2);
  border: 1px solid rgba(177,132,63,.35);
  background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(243,231,210,.68));
  padding: 20px;
  height: 100%;
  box-shadow: var(--softShadow);
}

.feature-top{
  display:flex; align-items:center; gap: 10px;
  margin-bottom: 8px;
}

.feature-top i{
  color: var(--gold2);
  font-size: 1.2rem;
}

.feature-top h3{
  font-family: "Cinzel", serif;
  font-weight: 900;
  margin: 0;
  font-size: 1.08rem;
  color: var(--ink);
}

.feature-card p{
  margin: 0;
  color: rgba(78,51,31,.76);
  line-height: 1.7;
}

.heritage-strip{
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 12px;
  border-radius: 18px;
  border: 1px solid rgba(177,132,63,.28);
  background: rgba(255,255,255,.60);
}

.strip-item{
  display:flex; align-items:center; gap: 8px;
  padding: .42rem .7rem;
  border-radius: 999px;
  border: 1px solid rgba(177,132,63,.32);
  background: rgba(230,200,137,.45);
  color: rgba(39,24,15,.88);
  font-size: .92rem;
  font-weight: 700;
}

/* =========================================================
   ACHIEVEMENTS (Fix: too much empty space)
   ========================================================= */
.counter-card{
  border-radius: var(--radius2);
  border: 1px solid rgba(177,132,63,.35);
  background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(243,231,210,.68));
  box-shadow: var(--softShadow);
  padding: 18px 16px;
  height: 100%;
  display:flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
}

.counter-icon{
  width: 52px; height: 52px;
  border-radius: 16px;
  display:grid; place-items:center;
  background: linear-gradient(145deg, rgba(230,200,137,.72), rgba(177,132,63,.30));
  border: 1px solid rgba(177,132,63,.45);
  color: var(--ink);
  font-size: 1.12rem;
  margin-bottom: 6px;
}

.counter-num{
  font-family: "Cinzel", serif;
  font-weight: 900;
  font-size: 2.0rem;
  color: var(--ink);
  line-height: 1.05;
}

.counter-label{
  color: rgba(78,51,31,.74);
  font-size: .95rem;
  line-height: 1.2;
}

/* Add + sign automatically to animated counters */
.counter-num:not(.counter-static)::after{
  content: "+";
  margin-left: 2px;
  font-weight: 900;
  color: inherit;
}


.counter-slash{
  font-size: .75em;
  margin-left: 2px;
  opacity: .9;
  font-weight: 900;
}


/* =========================================================
   GALLERY
   ========================================================= */
.gallery-item{
  position: relative;
  border-radius: var(--radius2);
  overflow:hidden;
  border: 1px solid rgba(177,132,63,.32);
  background: rgba(255,255,255,.55);
  box-shadow: var(--softShadow);
  height: 100%;
  text-decoration: none;
}

.gallery-thumb{
  width: 100%;
  height: 240px;
  object-fit: cover;
  transition: transform .35s ease;
}

.gallery-item:hover .gallery-thumb{
  transform: scale(1.06);
}

.gallery-overlay{
  position:absolute; inset:0;
  background: linear-gradient(180deg, transparent, rgba(78,51,31,.62));
  opacity: 0;
  transition: opacity .22s ease;
  display:flex; align-items:flex-end;
  padding: 14px;
}

.gallery-item:hover .gallery-overlay{ opacity: 1; }

.gallery-overlay .cap{
  display:flex; align-items:center; justify-content:space-between;
  width: 100%;
  color: #fff2d6;
  font-weight: 800;
  letter-spacing: .02em;
}

.gallery-overlay i{
  width: 40px; height: 40px;
  border-radius: 14px;
  display:grid; place-items:center;
  border: 1px solid rgba(230,200,137,.55);
  background: rgba(230,200,137,.18);
}

@media (max-width: 575px){
  .gallery-thumb{ height: 200px; }
}



/* =========================
   TESTIMONIALS (Heritage)
   ========================= */
.testimonial-shell{
  border-radius: var(--radius2);
  border: 1px solid rgba(177,132,63,.35);
  background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(243,231,210,.68));
  box-shadow: var(--shadow);
  padding: 18px;
}

.testimonial-visual{
  position: relative;
  border-radius: var(--radius2);
  overflow: hidden;
  border: 1px solid rgba(177,132,63,.28);
  box-shadow: var(--softShadow);
  min-height: 340px;
  background: linear-gradient(180deg, rgba(255,255,255,.55), rgba(243,231,210,.55));
}

.testimonial-visual-img{
  width: 100%;
  height: 100%;
  min-height: 340px;
  object-fit: cover;
  filter: sepia(.14) saturate(.98) contrast(1.06);
  transform: scale(1.02);
}

.testimonial-visual::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(700px 380px at 30% 20%, rgba(230,200,137,.35), transparent 60%),
    linear-gradient(180deg, rgba(39,24,15,.12), rgba(39,24,15,.28));
  pointer-events:none;
}

.testimonial-visual-badge{
  position:absolute;
  left: 14px;
  top: 14px;
  padding: .45rem .75rem;
  border-radius: 999px;
  background: rgba(255,255,255,.75);
  border: 1px solid rgba(177,132,63,.30);
  font-weight: 900;
  color: rgba(39,24,15,.90);
  z-index: 2;
}

.testimonial-mini-pills{
  position:absolute;
  left: 14px;
  right: 14px;
  bottom: 14px;
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
  z-index: 2;
}

.testimonial-mini-pills span{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: .45rem .7rem;
  border-radius: 999px;
  background: rgba(255,255,255,.70);
  border: 1px solid rgba(177,132,63,.28);
  font-weight: 800;
  color: rgba(39,24,15,.86);
  font-size: .9rem;
}

.testimonial-card{
  border-radius: var(--radius2);
  border: 1px solid rgba(177,132,63,.30);
  background: rgba(255,255,255,.62);
  box-shadow: var(--softShadow);
  padding: 22px;
  min-height: 250px;
  position: relative;
  overflow: hidden;
}

.testimonial-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  background: radial-gradient(circle at 80% 20%, rgba(202,162,90,.20), transparent 55%);
  pointer-events:none;
}

.t-head{
  display:flex;
  align-items:center;
  gap: 12px;
  margin-bottom: 12px;
}

.t-avatar{
  width: 54px; height: 54px;
  border-radius: 18px;
  overflow:hidden;
  border: 1px solid rgba(177,132,63,.30);
  flex: 0 0 auto;
}

.t-avatar img{
  width:100%;
  height:100%;
  object-fit: cover;
  filter: sepia(.10) saturate(.98) contrast(1.05);
}

.t-name{
  font-family: "Cinzel", serif;
  font-weight: 900;
  margin: 0;
  color: var(--ink);
  font-size: 1.12rem;
}

.t-meta{
  color: rgba(78,51,31,.72);
  font-weight: 700;
  font-size: .9rem;
}

.t-stars{
  display:flex;
  gap: 2px;
  color: rgba(202,162,90,.95);
  filter: drop-shadow(0 6px 12px rgba(78,51,31,.15));
}

.t-text{
  margin: 0;
  color: rgba(78,51,31,.82);
  line-height: 1.75;
  font-size: 1.02rem;
}

/* Controls */
.testimonial-controls{
  display:flex;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 12px;
}

.t-btn{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  border: 1px solid rgba(177,132,63,.30);
  background: linear-gradient(135deg, rgba(230,200,137,.70), rgba(177,132,63,.25));
  color: rgba(39,24,15,.92);
  display:grid;
  place-items:center;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.t-btn:hover{
  transform: translateY(-2px);
  border-color: rgba(177,132,63,.55);
  box-shadow: 0 18px 36px rgba(78,51,31,.16);
}

.testimonial-dots{
  position: static;
  margin: 12px 0 0;
  justify-content: center;
  gap: 8px;
}

.testimonial-dots [data-bs-target]{
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: rgba(177,132,63,.35);
}

.testimonial-dots .active{
  background: rgba(202,162,90,.95);
}

/* Responsive */
@media (max-width: 991px){
  .testimonial-shell{ padding: 14px; }
  .testimonial-card{ min-height: auto; }
}



/* =========================================================
   CONTACT (Fix: huge left title + form spacing)
   ========================================================= */
.contact-card,
.form-card{
  border-radius: var(--radius2);
  border: 1px solid rgba(177,132,63,.35);
  background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(243,231,210,.70));
  box-shadow: var(--softShadow);
  padding: 22px;
  height: 100%;
}

.contact-card .section-title{
  font-size: clamp(1.35rem, 1.8vw, 2.0rem);
  line-height: 1.12;
}

.contact-info{
  display:grid;
  gap: 12px;
  margin-top: 16px;
}

.info-item{
  display:flex;
  gap: 12px;
  align-items:flex-start;
  padding: 12px 12px;
  border-radius: 18px;
  border: 1px solid rgba(177,132,63,.28);
  background: rgba(255,255,255,.62);
}

.info-item i{
  color: var(--gold2);
  font-size: 1.25rem;
  margin-top: 2px;
  flex: 0 0 auto;
}

.info-label{
  font-size: .78rem;
  font-weight: 800;
  opacity: .85;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: rgba(78,51,31,.74);
}

.info-value{
  color: rgba(39,24,15,.92);
  text-decoration:none;
  font-weight: 600;
}

.info-value:hover{
  color: var(--gold2);
}

.notice-box{
  border-radius: 18px;
  padding: 12px;
  border: 1px solid rgba(177,132,63,.28);
  background: rgba(230,200,137,.38);
  color: rgba(39,24,15,.92);
  font-weight: 800;
  display:flex; align-items:center;
  gap: 8px;
  margin-top: 16px;
}

.form-title{
  font-family: "Cinzel", serif;
  font-weight: 900;
  margin: 0 0 6px;
  color: var(--ink);
  line-height: 1.2;
}

.form-sub{
  margin: 0 0 14px;
  color: rgba(78,51,31,.74);
  line-height: 1.6;
}

/* Inputs */
.form-label{
  font-weight: 700;
  color: rgba(78,51,31,.86);
}

.form-control-heritage{
  background: rgba(255,255,255,.72) !important;
  border: 1px solid rgba(177,132,63,.35) !important;
  color: rgba(39,24,15,.92) !important;
  border-radius: 14px !important;
  padding: .72rem .85rem !important;
}

.form-control-heritage::placeholder{
  color: rgba(78,51,31,.50);
}

.form-control-heritage:focus{
  box-shadow: 0 0 0 .2rem rgba(202,162,90,.28) !important;
  border-color: rgba(177,132,63,.60) !important;
}

/* Fix: textarea not too tall on large screen */
textarea.form-control-heritage{
  resize: vertical;
  min-height: 140px;
}

/* =========================================================
   MAP
   ========================================================= */
/* =========================
   MAP SECTION (Heritage)
   ========================= */
.map-section{
  position: relative;
  background:
    radial-gradient(1000px 420px at 30% 0%, rgba(230,200,137,.28), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.10));
  border-top: 1px solid rgba(177,132,63,.25);
  border-bottom: 1px solid rgba(177,132,63,.25);
}

/* Left Info Card */
.map-info-card{
  border-radius: var(--radius2);
  border: 1px solid rgba(177,132,63,.35);
  background: linear-gradient(180deg, rgba(255,255,255,.80), rgba(243,231,210,.70));
  box-shadow: var(--softShadow);
  padding: 22px;
  position: relative;
  overflow: hidden;
}

.map-info-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  background: radial-gradient(circle at 80% 20%, rgba(202,162,90,.22), transparent 55%);
  pointer-events:none;
}

.map-info-icon{
  width: 56px;
  height: 56px;
  border-radius: 18px;
  display:grid;
  place-items:center;
  background: linear-gradient(145deg, rgba(230,200,137,.75), rgba(177,132,63,.30));
  border: 1px solid rgba(177,132,63,.45);
  color: var(--ink);
  font-size: 1.35rem;
  margin-bottom: 12px;
}

.map-info-title{
  font-family: "Cinzel", serif;
  font-weight: 900;
  color: var(--ink);
  margin: 0 0 6px;
  font-size: 1.25rem;
}

.map-info-text{
  margin: 0 0 14px;
  color: rgba(78,51,31,.78);
  line-height: 1.7;
}

/* Mini list */
.map-mini-list{
  display: grid;
  gap: 12px;
  margin-top: 10px;
}

.map-mini-item{
  display:flex;
  gap: 12px;
  align-items:flex-start;
  padding: 12px;
  border-radius: 18px;
  border: 1px solid rgba(177,132,63,.28);
  background: rgba(255,255,255,.62);
}

.map-mini-item i{
  color: var(--gold2);
  font-size: 1.22rem;
  margin-top: 2px;
}

.mini-label{
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: rgba(78,51,31,.70);
}

.mini-value{
  font-weight: 700;
  color: rgba(39,24,15,.90);
  text-decoration: none;
}

.mini-value:hover{
  color: var(--gold2);
}

/* Badges */
.map-badges{
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
}

.map-badge{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: .45rem .7rem;
  border-radius: 999px;
  background: rgba(230,200,137,.45);
  border: 1px solid rgba(177,132,63,.32);
  color: rgba(39,24,15,.88);
  font-weight: 800;
  font-size: .9rem;
}

.map-badge i{
  color: var(--gold2);
}

/* Right Map Frame */
.map-frame{
  border-radius: var(--radius2);
  border: 1px solid rgba(177,132,63,.35);
  background: linear-gradient(180deg, rgba(255,255,255,.70), rgba(243,231,210,.60));
  box-shadow: var(--shadow);
  overflow: hidden;
}

.map-frame-top{
  display:flex;
  gap: 10px;
  justify-content: space-between;
  align-items: center;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(177,132,63,.25);
  background: rgba(255,255,255,.65);
}

.map-frame-title{
  font-weight: 900;
  color: var(--ink);
  display:flex;
  align-items:center;
  font-family: "Cinzel", serif;
  letter-spacing: .4px;
}

.map-frame-note{
  font-size: .9rem;
  color: rgba(78,51,31,.72);
  display:flex;
  align-items:center;
  gap: 6px;
}

.map-embed iframe{
  width: 100%;
  height: 420px;
  border: 0;
  display:block;
  filter: sepia(.18) saturate(.95) contrast(1.06);
}

/* Responsive */
@media (max-width: 991px){
  .map-embed iframe{ height: 360px; }
  .map-frame-note{ display:none; } /* keeps top bar clean on small screens */
}

@media (max-width: 575px){
  .map-embed iframe{ height: 320px; }
  .map-info-card{ padding: 18px; }
  .map-frame-top{ flex-direction: column; align-items: flex-start; }
}

/* =========================================================
   FOOTER (Warm heritage)
   ========================================================= */
.footer-heritage{
  padding: 64px 0 26px;
  background:
    radial-gradient(950px 380px at 30% 0%, rgba(230,200,137,.42), transparent 60%),
    linear-gradient(180deg, #d8c1a0, #b89464);
  color: rgba(39,24,15,.92);
  border-top: 1px solid rgba(177,132,63,.35);
}

.footer-heading{
  font-family: "Cinzel", serif;
  font-weight: 900;
  font-size: 1.05rem;
  margin-bottom: 14px;
  color: var(--ink);
}

.footer-text{
  color: rgba(78,51,31,.78);
  line-height: 1.75;
}

.footer-links,
.footer-contact{
  margin: 0; padding: 0;
  list-style: none;
  display:grid;
  gap: 10px;
}

.footer-links a{
  color: rgba(39,24,15,.88);
  text-decoration:none;
  font-weight: 600;
}

.footer-links a:hover{
  color: var(--gold2);
}

.footer-contact li{
  color: rgba(39,24,15,.86);
  display:flex;
  gap: 10px;
  align-items:flex-start;
}

.footer-contact i{
  color: var(--gold2);
  margin-top: 2px;
}

.footer-contact a{
  color: rgba(39,24,15,.90);
  text-decoration:none;
  font-weight: 700;
}

.footer-contact a:hover{
  color: var(--gold2);
}

.footer-bottom{
  border-top: 1px solid rgba(177,132,63,.35);
  padding-top: 16px;
  color: rgba(39,24,15,.76);
}

/* footer social icons */
.footer-social .social-icon{
  width: 36px; height: 36px;
  border-radius: 50%;
  display:grid; place-items:center;
  background: rgba(255,255,255,.45);
  border: 1px solid rgba(177,132,63,.35);
  text-decoration: none;
  transition: .22s ease;
}

.footer-social .social-icon:hover{
  transform: translateY(-2px);
  background: rgba(230,200,137,.55);
}


.footer-logo{
  height:55px;   /* adjust as needed */
  width:auto;
}

/* Blinking call number (professional pulse) */
.blink-call{
  font-weight: 800;
  color: var(--gold2);
  position: relative;
  animation: callBlink 1.8s infinite;
}

/* Icon glow */
.blink-call i{
  animation: phoneShake 1.8s infinite;
  color: var(--gold2);
}

/* Blink animation */
@keyframes callBlink{
  0%,100%{
    opacity: 1;
    text-shadow: 0 0 0 rgba(0,0,0,0);
  }
  50%{
    opacity: .55;
    text-shadow: 0 0 12px rgba(202,162,90,.65);
  }
}

/* Subtle icon movement (attention-grabbing but classy) */
@keyframes phoneShake{
  0%,100%{ transform: rotate(0deg); }
  25%{ transform: rotate(-8deg); }
  50%{ transform: rotate(8deg); }
  75%{ transform: rotate(-6deg); }
}

/* =========================================================
   FLOATING BUTTONS (WhatsApp + Call)
   ========================================================= */
/* Fix mobile extra space / overflow */
html, body{
  overflow-x: hidden;
}

/* Floating buttons */
.float-actions{
  position: fixed;
  right: max(12px, env(safe-area-inset-right));
  bottom: max(12px, env(safe-area-inset-bottom));
  display: flex;
  flex-direction: column;
  gap: 12px;
  z-index: 9999;

  /* prevent any accidental overflow calculations */
  width: auto;
  max-width: 100%;
}

/* Button */
.float-btn{
  width: 56px;
  height: 56px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  text-decoration: none;
  color: #241707;
  font-size: 1.35rem;
  position: relative;

  animation: glowPulse 2.2s ease-in-out infinite;
  border: 1px solid rgba(255,255,255,.28);
  box-shadow: 0 18px 40px rgba(78,51,31,.22);

  /* IMPORTANT: keep effects inside the button box */
  overflow: hidden;
  isolation: isolate;
  transform: translateZ(0);
}

/* Glow (no negative inset now) */
.float-btn::before{
  content:"";
  position: absolute;
  inset: 0;                 /* ✅ no negative inset */
  border-radius: inherit;
  background: radial-gradient(circle at 30% 30%, rgba(230,200,137,.70), transparent 62%);
  filter: blur(10px);
  opacity: .75;
  transform: scale(1.35);   /* ✅ glow grows inward, not outside viewport */
  z-index: -1;
  animation: pulseGlow 1.8s infinite ease-in-out;
}


/* Colors */
.float-btn.whatsapp{
  background: linear-gradient(135deg, #5cffb2, #1ddc79);
}

.float-btn.call{
  background: linear-gradient(135deg, var(--gold3), var(--gold2));
}

/* Animation */
@keyframes pulseGlow{
  0%,100%{ transform: scale(1.25); opacity: .55; }
  50%{ transform: scale(1.45); opacity: .92; }
}


.float-btn.whatsapp{
  background: linear-gradient(135deg, #5cffb2, #1ddc79);
  animation: glowPulseGreen 2.2s ease-in-out infinite;
}

.float-btn.call{
  background: linear-gradient(135deg, var(--gold3), var(--gold2));
  animation: glowPulseGold 2.2s ease-in-out infinite;
}

@keyframes glowPulseGreen{
  0%,100%{
    box-shadow:
      0 18px 40px rgba(78,51,31,.22),
      0 0 10px rgba(29,220,121,.35),
      0 0 22px rgba(29,220,121,.20);
  }
  50%{
    box-shadow:
      0 18px 40px rgba(78,51,31,.22),
      0 0 20px rgba(29,220,121,.70),
      0 0 44px rgba(29,220,121,.45);
  }
}

@keyframes glowPulseGold{
  0%,100%{
    box-shadow:
      0 18px 40px rgba(78,51,31,.22),
      0 0 10px rgba(202,162,90,.35),
      0 0 24px rgba(202,162,90,.22);
  }
  50%{
    box-shadow:
      0 18px 40px rgba(78,51,31,.22),
      0 0 22px rgba(202,162,90,.85),
      0 0 52px rgba(202,162,90,.55);
  }
}

.float-btn i{
  text-shadow: 0 0 12px rgba(255,255,255,.55);
}



/* Mobile sizing */
@media (max-width: 575px){
  .float-actions{
    right: max(10px, env(safe-area-inset-right));
    bottom: max(10px, env(safe-area-inset-bottom));
  }
  .float-btn{
    width: 52px;
    height: 52px;
    border-radius: 16px;
    font-size: 1.25rem;
  }
}




/* Label default (hidden on desktop) */
.float-label{
  display:none;
  font-weight: 900;
  letter-spacing: .2px;
  font-size: .92rem;
  line-height: 1;
}

/* =========================
   DESKTOP (your current style)
   - right-side vertical icons
   ========================= */
/* keep your existing desktop .float-actions + .float-btn styles here */


/* =========================
   MOBILE/TABLET: Bottom sticky pills
   ========================= */
@media (max-width: 991px){

  .float-actions{
    left: 0;
    right: 0;
    bottom: max(10px, env(safe-area-inset-bottom));
    transform: none;

    position: fixed;
    z-index: 9999;

    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 14px;

    padding: 0 14px;            /* page side padding */
    width: 100%;
    max-width: 100%;
  }

  /* make each button a pill with text */
  .float-btn{
    width: auto;
    height: 52px;
    padding: 0 16px;
    border-radius: 999px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    font-size: 1.15rem;         /* icon size base */
    box-shadow: 0 16px 36px rgba(78,51,31,.20);
  }

  .float-label{ display:inline-block; }

  /* Icon sizing inside pill */
  .float-btn i{
    font-size: 1.15rem;
    text-shadow: 0 0 10px rgba(255,255,255,.45);
  }

  /* Heritage Theme Colors */
 /* =========================
   WhatsApp Button – Light Green
   ========================= */
@media (max-width: 991px){

  .float-btn.whatsapp{
    background: linear-gradient(
      135deg,
      #6ee7b7,   /* light green */
      #22c55e    /* emerald green */
    );
    color: #0f2f1f;
    border: 1px solid rgba(34,197,94,.45);
    animation: glowPulseGreen 2.2s ease-in-out infinite;
  }

  .float-btn.whatsapp i{
    color: #0f2f1f;
    text-shadow: 0 0 10px rgba(255,255,255,.55);
  }
}


  .float-btn.call{
    background: linear-gradient(135deg, rgba(202,162,90,.95), rgba(143,101,44,.88));
    color: #241707;
    border: 1px solid rgba(177,132,63,.35);
    animation: glowPulseGold 2.2s ease-in-out infinite;
  }

  /* Make them fit well on small screens */
  .float-btn{
    min-width: 150px;
  }

  /* Make sure buttons don’t overflow on very small width */
  @media (max-width: 380px){
    .float-actions{ gap: 10px; padding: 0 10px; }
    .float-btn{ min-width: 140px; padding: 0 14px; }
    .float-label{ font-size: .88rem; }
  }
}

@keyframes glowPulseGreen{
  0%,100%{
    box-shadow:
      0 14px 32px rgba(15,47,31,.25),
      0 0 10px rgba(34,197,94,.40),
      0 0 24px rgba(34,197,94,.25);
  }
  50%{
    box-shadow:
      0 16px 38px rgba(15,47,31,.35),
      0 0 22px rgba(34,197,94,.85),
      0 0 50px rgba(34,197,94,.55);
  }
}

/* prevent bottom pills from covering content */
@media (max-width: 991px){
  body{ padding-bottom: 86px; }
}

/* =========================================================
   SMALL SCREEN FIXES (Seen in your screenshots)
   ========================================================= */
@media (max-width: 991px){
  .section-pad{ padding: 62px 0; }
  .counter-card{ padding: 16px 14px; }
  .hero-title{ font-size: clamp(1.45rem, 4.7vw, 2.2rem); }
}
@media(max-width:767px)
{
	.cu-mb-ds-nn{
		display:none!important
	}
	.jf-cn-cntr{
		justify-content:center!important
	}
}
@media (max-width: 575px){
  .section-pad{ padding: 54px 0; }
  .service-card, .feature-card{ padding: 18px; }
  .contact-card, .form-card{ padding: 18px; }
}







/* =========================
   MODAL (Heritage Style)
   ========================= */
.modal-heritage{
  border-radius: var(--radius2);
  border: 1px solid rgba(177,132,63,.35);
  background: linear-gradient(180deg, rgba(255,255,255,.85), rgba(243,231,210,.72));
  box-shadow: 0 26px 70px rgba(78,51,31,.25);
  overflow: hidden;
  position: relative;
}

.modal-close-heritage{
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 5;
  filter: sepia(.35) saturate(1.2);
  opacity: .9;
}

.modal-heritage-side{
  height: 100%;
  padding: 28px;
  background:
    radial-gradient(760px 420px at 20% 10%, rgba(230,200,137,.45), transparent 65%),
    linear-gradient(180deg, rgba(78,51,31,.78), rgba(78,51,31,.55));
  color: #fff2d6;
  position: relative;
}

.modal-heritage-side::after{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(circle at 70% 30%, rgba(230,200,137,.22), transparent 60%);
  pointer-events:none;
}

.side-badge{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: .45rem .75rem;
  border-radius: 999px;
  background: rgba(230,200,137,.18);
  border: 1px solid rgba(230,200,137,.35);
  font-weight: 800;
  letter-spacing: .02em;
  margin-bottom: 14px;
  position: relative;
  z-index: 1;
}

.side-title{
  font-family: "Cinzel", serif;
  font-weight: 900;
  margin: 0 0 10px;
  line-height: 1.2;
  position: relative;
  z-index: 1;
}

.side-text{
  margin: 0 0 16px;
  color: rgba(255,242,214,.88);
  line-height: 1.7;
  position: relative;
  z-index: 1;
}

.side-pills{
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
  position: relative;
  z-index: 1;
}

.side-pill{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: .45rem .7rem;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(230,200,137,.30);
  color: rgba(255,242,214,.92);
  font-weight: 800;
}

.modal-heritage-form{
  padding: 26px;
}

@media (max-width: 575px){
  .modal-heritage-form{ padding: 20px; }
}


#callme {
        position: fixed;
        right: 10px;
        top: 190px;
        width: 70px;
        height: 70px;
        cursor: pointer;
      
        z-index: 99990;
    }
    #callme #callmeMain {
        -moz-border-radius: 50% !important;
        -webkit-border-radius: 50% !important;
        border-radius: 50% !important;
        -moz-background-clip: padding;
        -webkit-background-clip: padding-box;
        background-clip: padding-box;
        background-color: rgb(40 167 69);
        width: 60px;
        height: 60px;
        -webkit-animation: zcwmini2 1.5s 0s ease-out infinite;
        -moz-animation: zcwmini2 1.5s 0s ease-out infinite;
        animation: zcwmini2 1.5s 0s ease-out infinite;
    }
    #callme #callmeMain:before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        top: -6px;
        left: -6px;
        background-image: url(https://ss.zadarma.com/callbackWidget/images/mini.png);
        background-repeat: no-repeat;
        background-position: center center;
        -webkit-animation: zcwphone2 1.5s linear infinite;
        -moz-animation: zcwphone2 1.5s linear infinite;
        animation: zcwphone2 1.5s linear infinite;
    }
    @-webkit-keyframes zcwphone {
        0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
        25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
        50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
        75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
        100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    }
    @-moz-keyframes zcwphone {
        0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
        25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
        50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
        75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
        100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    }
    @keyframes zcwphone {
        0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
        25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
        50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
        75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
        100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    }
    @-webkit-keyframes zcwphone2 {
        0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
        25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
        50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
        75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
        100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    }
    @-moz-keyframes zcwphone2 {
        0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
        25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
        50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
        75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
        100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    }
    @keyframes zcwphone2 {
        0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
        25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
        50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
        75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
        100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    }
    @-webkit-keyframes zcwmini {
        0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
        10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;}
        100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
    }
    @-moz-keyframes zcwmini {
        0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
        10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;}
        100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
    }
    @keyframes zcwmini {
        0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
        10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;}
        100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
    }
    @-webkit-keyframes zcwmini2 {
        0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
        10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;}
        100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
    }
    @-moz-keyframes zcwmini2 {
        0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
        10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;}
        100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
    }
    @keyframes zcwmini2 {
        0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
        10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;}
        100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
    }