/* =========================================================
   Atulya Consultancy Services — testimonials & Google reviews
   Loads after style.css and pages.css and reuses their tokens,
   hero (.phero/.shero), review cards (.review), CTA (.cta) and
   the blog's filter buttons (.bfilter). Same rules: mobile-first,
   square corners, navy/azure/gold.
   ========================================================= */

/* The same filter buttons as the blog listing (blog.css isn't loaded here). */
.bfilter{
  display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;
  margin:0 calc(var(--gutter) * -1) 24px;padding:2px var(--gutter);
}
.bfilter::-webkit-scrollbar{display:none;}
.bfilter__btn{
  display:inline-flex;align-items:center;gap:10px;flex:none;
  min-height:44px;padding:0 16px;cursor:pointer;
  background:#fff;border:1px solid var(--line-warm);color:var(--ink);
  font:inherit;font-size:14px;font-weight:700;white-space:nowrap;
  transition:background-color .25s,border-color .25s,color .25s;
}
.bfilter__btn span{
  display:grid;place-items:center;min-width:24px;height:22px;padding:0 6px;
  background:var(--ivory);color:var(--muted);font-size:11.5px;font-weight:800;
  transition:background-color .25s,color .25s;
}
.bfilter__btn.is-on{background:var(--navy-900);border-color:var(--navy-900);color:#fff;}
.bfilter__btn.is-on span{background:var(--gold);color:var(--navy-900);}
@media (hover:hover){ .bfilter__btn:not(.is-on):hover{border-color:var(--navy-900);} }
@media (min-width:900px){ .bfilter{flex-wrap:wrap;overflow:visible;margin-inline:0;padding-inline:0;margin-bottom:32px;} }
.bcount{margin:-8px 0 22px;color:var(--muted);font-size:14px;font-weight:700;}

/* =========================================================
   HERO — featured quote
   ========================================================= */
.hquote{
  position:relative;width:100%;max-width:560px;margin:0 auto;padding:34px 26px 28px;
  background:#fff;border-top:3px solid var(--gold);box-shadow:0 30px 60px rgba(0,0,0,.35);
  animation:pop .9s .2s var(--ease) both;
}
.hquote::before{
  content:"\201C";position:absolute;right:22px;top:6px;
  font:800 120px/1 Georgia,serif;color:var(--azure-100);
}
.hquote .stars{font-size:15px;}
.hquote blockquote{
  position:relative;margin:18px 0 26px;color:var(--ink);
  font-size:clamp(1.05rem,.95rem + .5vw,1.3rem);font-weight:600;line-height:1.55;letter-spacing:-.01em;
}
.hquote figcaption{display:flex;align-items:center;gap:14px;padding-top:20px;border-top:1px solid var(--line);color:var(--muted);font-size:13px;line-height:1.4;}
.hquote figcaption img,.hquote .initials{flex:none;width:56px;height:56px;object-fit:cover;}
.hquote figcaption strong{display:block;color:var(--ink);font-size:15.5px;}
.hquote__tag{
  position:absolute;left:26px;bottom:0;transform:translateY(50%);
  display:inline-flex;align-items:center;gap:10px;min-height:40px;padding:0 16px;
  background:var(--navy-800);color:#fff;font-size:13px;font-weight:700;
  box-shadow:0 10px 24px rgba(0,0,0,.25);transition:background-color .25s,color .25s;
}
.hquote__tag .fa-google{color:var(--gold);}
.hquote__tag .fa-arrow-down{font-size:11px;}
.hquote__tag:hover{background:var(--gold);color:var(--navy-900);}
.hquote__tag:hover .fa-google{color:var(--navy-900);}
@media (min-width:600px){ .hquote{padding:44px 40px 36px;} .hquote__tag{left:40px;} }

/* =========================================================
   REVIEWS — grid of cards
   ========================================================= */
.rgrid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;}
.rgrid .review[hidden]{display:none;}
.rsrc{display:flex;align-items:center;gap:6px;margin-top:5px;color:var(--muted);font-size:11.5px;font-weight:700;letter-spacing:.02em;}
.rsrc i{font-size:11px;color:var(--ok);}
.rsrc--google i{color:var(--azure);}
.rgrid__more{display:flex;justify-content:center;margin-top:36px;}
@media (min-width:700px){ .rgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;} }
@media (min-width:1100px){
  .rgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;}
  .rgrid .review{padding:42px 36px 34px;}
  .rgrid__more{margin-top:48px;}
}

/* =========================================================
   CLIENT STORIES — the gallery's testimonial cards
   ========================================================= */
.cstories__in{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;}
.cstories .head{margin-bottom:24px;}
.cstories .head p{max-width:440px;font-size:15.5px;}
.cstories__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.cstory{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);transition:transform .35s var(--ease),box-shadow .35s;}
.cstory__img{display:block;overflow:hidden;aspect-ratio:4/5;background:var(--ivory);}
.cstory__img img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .8s var(--ease);}
.cstory__body{display:flex;flex-direction:column;gap:4px;padding:14px 14px 16px;}
.cstory__body b{color:var(--ink);font-size:14.5px;line-height:1.3;}
.cstory__body small{display:none;color:var(--muted);font-size:13px;line-height:1.5;}
@media (hover:hover){
  .cstory:hover{transform:translateY(-4px);box-shadow:var(--sh-2);}
  .cstory:hover .cstory__img img{transform:scale(1.04);}
}
@media (min-width:600px){
  .cstories__grid{gap:20px;}
  .cstory__body{padding:20px 22px 22px;}
  .cstory__body b{font-size:1.05rem;}
  .cstory__body small{display:block;}
}
@media (min-width:1000px){
  .cstories__in{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;gap:72px;}
  .cstories .head{margin-bottom:0;}
}

/* =========================================================
   GOOGLE REVIEW BAND
   ========================================================= */
.gband{position:relative;overflow:hidden;}
.gband__in{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:44px;}
.gband h2{margin:16px 0 14px;font-size:clamp(1.75rem,1.1rem + 2.5vw,3.1rem);}
.gband__copy > p{max-width:560px;font-size:1.02rem;}

.gsteps{display:grid;gap:1px;margin-top:32px;background:var(--line-dark);border:1px solid var(--line-dark);}
.gsteps li{display:flex;align-items:flex-start;gap:18px;padding:18px 20px;background:var(--navy-900);}
.gsteps__n{flex:none;color:var(--gold);font-size:1.2rem;font-weight:800;line-height:1.3;letter-spacing:-.02em;}
.gsteps li > span:last-child{font-size:14px;line-height:1.5;}
.gsteps b{display:block;margin-bottom:2px;color:#fff;font-size:15.5px;}

.gband__btns{display:grid;gap:10px;margin-top:30px;}
@media (min-width:480px){ .gband__btns{display:flex;flex-wrap:wrap;} }

.gcard{
  justify-self:start;width:100%;max-width:360px;padding:24px;
  background:#fff;border-top:3px solid var(--gold);box-shadow:0 24px 48px rgba(0,0,0,.3);
}
.gcard__head{display:flex;align-items:center;gap:14px;padding-bottom:18px;border-bottom:1px solid var(--line);}
.gcard__g{display:grid;place-items:center;flex:none;width:46px;height:46px;background:var(--navy-900);color:var(--gold);font-size:19px;}
.gcard__head small{display:block;color:var(--muted);font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;}
.gcard__head b{display:block;color:var(--ink);font-size:15px;line-height:1.3;}
.gcard__score{display:flex;align-items:center;gap:14px;padding:18px 0;border-bottom:1px solid var(--line);}
.gcard__score > b{color:var(--ink);font-size:2.6rem;font-weight:800;line-height:1;letter-spacing:-.04em;}
.gcard__score > span{display:flex;flex-direction:column;gap:4px;}
.gcard__score .stars{font-size:14px;}
.gcard__score small{color:var(--muted);font-size:12.5px;line-height:1.3;}
.gcard__qr{display:block;width:180px;margin:18px auto 6px;}
.gcard__qr img{width:100%;height:auto;}
.gcard__hint{display:flex;align-items:center;justify-content:center;gap:8px;color:var(--muted);font-size:12.5px;font-weight:600;text-align:center;}
.gcard__hint i{color:var(--azure);}
/* On a phone, the QR code can't be scanned by the phone showing it — the button does the job. */
@media (max-width:599px){ .gcard__qr{width:140px;} .gcard__hint{display:none;} }
@media (min-width:960px){
  .gband__in{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);align-items:center;gap:72px;}
  .gcard{justify-self:end;padding:30px;}
  .gcard__qr{width:210px;}
}
