/* ==========================================================================
   GB Persianas AI — Frontend CSS
   ========================================================================== */

/* ── Variables ─────────────────────────────────────────────────────────── */
:root {
  --gbpa-primary:      #1a56a0;
  --gbpa-primary-dark: #0e3975;
  --gbpa-accent:       #e8a020;
  --gbpa-whatsapp:     #25d366;
  --gbpa-whatsapp-dk:  #128c7e;
  --gbpa-text:         #1a1a2e;
  --gbpa-text-light:   #555f70;
  --gbpa-bg:           #f8f9fb;
  --gbpa-white:        #ffffff;
  --gbpa-border:       #dde3ec;
  --gbpa-radius-sm:    6px;
  --gbpa-radius:       12px;
  --gbpa-radius-lg:    20px;
  --gbpa-shadow-sm:    0 2px 8px rgba(0,0,0,.06);
  --gbpa-shadow:       0 6px 24px rgba(0,0,0,.10);
  --gbpa-shadow-lg:    0 12px 40px rgba(0,0,0,.14);
  --gbpa-transition:   .2s ease;
}

/* ── Reset scoping ─────────────────────────────────────────────────────── */
.gbpa-page *,
.gbpa-grid *,
.gbpa-card *,
.gbpa-floating-cta * {
  box-sizing: border-box;
}

/* ── Container ─────────────────────────────────────────────────────────── */
.gbpa-container {
  max-width: 1200px;
  margin:    0 auto;
  padding:   0 clamp(1rem, 4vw, 2.5rem);
}

/* ── Buttons ───────────────────────────────────────────────────────────── */
.gbpa-btn {
  display:         inline-flex;
  align-items:     center;
  gap:             .5rem;
  padding:         .65rem 1.4rem;
  border-radius:   var(--gbpa-radius-sm);
  font-size:       .95rem;
  font-weight:     600;
  text-decoration: none;
  border:          2px solid transparent;
  cursor:          pointer;
  transition:      background var(--gbpa-transition), color var(--gbpa-transition),
                   border-color var(--gbpa-transition), transform var(--gbpa-transition);
  white-space:     nowrap;
}
.gbpa-btn:hover  { transform: translateY(-1px); }
.gbpa-btn:active { transform: translateY(0); }

.gbpa-btn--primary {
  background: var(--gbpa-primary);
  color:      var(--gbpa-white);
}
.gbpa-btn--primary:hover { background: var(--gbpa-primary-dark); color: var(--gbpa-white); }

.gbpa-btn--outline {
  background:    transparent;
  border-color:  var(--gbpa-primary);
  color:         var(--gbpa-primary);
}
.gbpa-btn--outline:hover { background: var(--gbpa-primary); color: var(--gbpa-white); }

.gbpa-btn--whatsapp {
  background: var(--gbpa-whatsapp);
  color:      var(--gbpa-white);
}
.gbpa-btn--whatsapp:hover { background: var(--gbpa-whatsapp-dk); color: var(--gbpa-white); }

.gbpa-btn--call { background: var(--gbpa-accent); color: var(--gbpa-text); }
.gbpa-btn--call:hover { background: #d08800; color: var(--gbpa-text); }

.gbpa-btn--lg   { padding: .85rem 2rem; font-size: 1.05rem; }
.gbpa-btn--block { display: flex; width: 100%; justify-content: center; }

/* ── Badges ────────────────────────────────────────────────────────────── */
.gbpa-badge {
  display:       inline-block;
  padding:       .2rem .7rem;
  border-radius: 999px;
  font-size:     .78rem;
  font-weight:   700;
  background:    var(--gbpa-bg);
  color:         var(--gbpa-text-light);
  border:        1px solid var(--gbpa-border);
}
.gbpa-badge--price {
  background: #fff8e8;
  color:      #b35c00;
  border-color: #f5c880;
}

/* ── Hero ──────────────────────────────────────────────────────────────── */
.gbpa-hero {
  background:   linear-gradient(135deg, var(--gbpa-primary) 0%, var(--gbpa-primary-dark) 100%);
  color:        var(--gbpa-white);
  padding:      clamp(3rem, 8vw, 6rem) 0;
  text-align:   center;
}
.gbpa-hero--service { background: linear-gradient(135deg, #0e3975 0%, #1a56a0 60%, #2d7dd2 100%); }
.gbpa-hero--archive { background: linear-gradient(135deg, #1a2040 0%, #1a56a0 100%); }

.gbpa-hero__title {
  font-size:   clamp(1.8rem, 5vw, 3rem);
  font-weight: 800;
  margin:      0 0 1rem;
  line-height: 1.2;
}
.gbpa-hero__subtitle {
  font-size:  clamp(1rem, 2.5vw, 1.3rem);
  opacity:    .9;
  max-width:  700px;
  margin:     0 auto 2rem;
}
.gbpa-hero__service-icon {
  font-size:   4rem;
  margin-bottom: 1rem;
}
.gbpa-hero__service-icon .dashicons { font-size: 4rem; width: 4rem; height: 4rem; color: rgba(255,255,255,.85); }
.gbpa-hero__badges { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin-bottom: 1.5rem; }
.gbpa-hero__badges .gbpa-badge { background: rgba(255,255,255,.15); color: #fff; border-color: rgba(255,255,255,.3); }
.gbpa-hero__cta {
  display:         flex;
  flex-wrap:       wrap;
  gap:             1rem;
  justify-content: center;
}

/* ── Trust Bar ─────────────────────────────────────────────────────────── */
.gbpa-trust-bar {
  background:  var(--gbpa-white);
  border-bottom: 1px solid var(--gbpa-border);
  padding:     1.2rem 0;
}
.gbpa-trust-bar__items {
  display:         flex;
  flex-wrap:       wrap;
  justify-content: center;
  gap:             1.5rem 3rem;
}
.gbpa-trust-item {
  display:     flex;
  align-items: center;
  gap:         .5rem;
  font-size:   .9rem;
  font-weight: 600;
  color:       var(--gbpa-text);
}
.gbpa-trust-item .dashicons { color: var(--gbpa-primary); font-size: 1.3rem; }

/* ── Sections ──────────────────────────────────────────────────────────── */
.gbpa-content-section {
  padding: clamp(2.5rem, 6vw, 4.5rem) 0;
}
.gbpa-reviews-section { background: var(--gbpa-bg); }

.gbpa-section-title { text-align: center; margin-bottom: 2rem; }
.gbpa-section-title h2,
.gbpa-section-title__text {
  font-size:   clamp(1.4rem, 3vw, 2rem);
  font-weight: 800;
  color:       var(--gbpa-text);
  margin:      0 0 .5rem;
}

/* ── Content Grid ──────────────────────────────────────────────────────── */
.gbpa-content-grid {
  display:               grid;
  grid-template-columns: 1fr 320px;
  gap:                   2.5rem;
  align-items:           start;
}
@media (max-width: 900px) {
  .gbpa-content-grid { grid-template-columns: 1fr; }
  .gbpa-content-sidebar { order: -1; }
}

/* ── Prose ─────────────────────────────────────────────────────────────── */
.gbpa-prose { color: var(--gbpa-text); line-height: 1.8; }
.gbpa-prose p { margin: 0 0 1.2rem; }
.gbpa-prose h2 { font-size: 1.4rem; margin: 2rem 0 .8rem; }

/* ── Translation block ─────────────────────────────────────────────────── */
.gbpa-translation-block {
  margin:        2.5rem 0;
  padding:       1.5rem;
  background:    #f0f7ff;
  border-left:   4px solid var(--gbpa-primary);
  border-radius: var(--gbpa-radius-sm);
}
.gbpa-translation-block h2 { font-size: 1.2rem; color: var(--gbpa-primary); margin: 0 0 .8rem; }

/* ── Features Block ────────────────────────────────────────────────────── */
.gbpa-features-block {
  margin:       2rem 0;
  padding:      1.5rem;
  background:   var(--gbpa-bg);
  border-radius: var(--gbpa-radius);
}
.gbpa-features-block h2 { font-size: 1.2rem; margin: 0 0 1rem; }

.gbpa-features-list {
  list-style: none;
  margin:     0;
  padding:    0;
}
.gbpa-features-list li {
  display:     flex;
  align-items: center;
  gap:         .6rem;
  padding:     .4rem 0;
  font-size:   .95rem;
  color:       var(--gbpa-text);
}
.gbpa-features-list--cols {
  display:               grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap:                   .2rem 1.5rem;
}
.gbpa-feature-check { color: var(--gbpa-whatsapp); font-size: 1.2rem; flex-shrink: 0; }

/* ── Grid ──────────────────────────────────────────────────────────────── */
.gbpa-grid {
  display: grid;
  gap:     1.5rem;
}
.gbpa-cols-2 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.gbpa-cols-3 { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.gbpa-cols-4 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.gbpa-cols-5 { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }

/* ── Cards ─────────────────────────────────────────────────────────────── */
.gbpa-card {
  background:    var(--gbpa-white);
  border:        1px solid var(--gbpa-border);
  border-radius: var(--gbpa-radius);
  padding:       1.5rem;
  box-shadow:    var(--gbpa-shadow-sm);
  transition:    box-shadow var(--gbpa-transition), transform var(--gbpa-transition);
  display:       flex;
  flex-direction: column;
  gap:           .7rem;
}
.gbpa-card:hover { box-shadow: var(--gbpa-shadow); transform: translateY(-3px); }

.gbpa-card__icon .dashicons { font-size: 2.2rem; width: 2.2rem; height: 2.2rem; color: var(--gbpa-primary); }
.gbpa-card__title { font-size: 1.1rem; font-weight: 700; margin: 0; }
.gbpa-card__title a { color: var(--gbpa-text); text-decoration: none; }
.gbpa-card__title a:hover { color: var(--gbpa-primary); }
.gbpa-card__excerpt { font-size: .9rem; color: var(--gbpa-text-light); margin: 0; }
.gbpa-card__subtitle { font-size: .85rem; color: var(--gbpa-text-light); margin: 0; }
.gbpa-card .gbpa-btn { margin-top: auto; }

/* Location card */
.gbpa-location-card .gbpa-card__icon .dashicons { color: var(--gbpa-accent); }

/* Single service card */
.gbpa-service-single-card {
  background:    var(--gbpa-white);
  border:        1px solid var(--gbpa-border);
  border-radius: var(--gbpa-radius);
  overflow:      hidden;
  box-shadow:    var(--gbpa-shadow);
}
.gbpa-service-single-card__header {
  background: var(--gbpa-primary);
  color:      var(--gbpa-white);
  padding:    1.5rem;
  display:    flex;
  align-items: center;
  gap:        1rem;
}
.gbpa-service-single-card__header h3 { margin: 0; font-size: 1.2rem; flex: 1; }
.gbpa-service-icon { font-size: 2rem; width: 2rem; height: 2rem; }
.gbpa-service-single-card__body { padding: 1.5rem; }
.gbpa-service-single-card__footer { padding: 0 1.5rem 1.5rem; }

/* ── Sidebar Cards ─────────────────────────────────────────────────────── */
.gbpa-sidebar-card {
  background:    var(--gbpa-white);
  border:        1px solid var(--gbpa-border);
  border-radius: var(--gbpa-radius);
  padding:       1.5rem;
  box-shadow:    var(--gbpa-shadow-sm);
  margin-bottom: 1.5rem;
}
.gbpa-sidebar-card h3 { font-size: 1.1rem; margin: 0 0 .8rem; color: var(--gbpa-text); }
.gbpa-sidebar-card p  { font-size: .9rem; color: var(--gbpa-text-light); margin-bottom: 1rem; }
.gbpa-sidebar-card .gbpa-btn + .gbpa-btn { margin-top: .6rem; }
.gbpa-sidebar-card--contact { border-top: 4px solid var(--gbpa-primary); }
.gbpa-sidebar-card__note { margin-top: .8rem !important; text-align: center; color: #888 !important; }

/* ── Breadcrumb ────────────────────────────────────────────────────────── */
.gbpa-breadcrumb { margin-bottom: 1.5rem; }
.gbpa-breadcrumb ol {
  list-style:  none;
  margin:      0;
  padding:     0;
  display:     flex;
  flex-wrap:   wrap;
  gap:         .3rem;
  font-size:   .85rem;
}
.gbpa-breadcrumb li { color: rgba(255,255,255,.7); }
.gbpa-breadcrumb a  { color: rgba(255,255,255,.85); text-decoration: underline; }
.gbpa-breadcrumb a:hover { color: #fff; }
[aria-current="page"] { color: #fff; font-weight: 600; }

/* ── Nearby list ───────────────────────────────────────────────────────── */
.gbpa-nearby-list {
  list-style: none;
  margin:     0;
  padding:    0;
}
.gbpa-nearby-list li { border-bottom: 1px solid var(--gbpa-border); }
.gbpa-nearby-list li:last-child { border-bottom: none; }
.gbpa-nearby-list a {
  display:     block;
  padding:     .5rem 0;
  color:       var(--gbpa-primary);
  font-size:   .9rem;
  text-decoration: none;
}
.gbpa-nearby-list a:hover { text-decoration: underline; }

/* ── CTA Banner ────────────────────────────────────────────────────────── */
.gbpa-cta-banner {
  background:   linear-gradient(135deg, var(--gbpa-accent) 0%, #c47a10 100%);
  color:        var(--gbpa-text);
  padding:      clamp(2rem, 5vw, 4rem) 0;
  text-align:   center;
}
.gbpa-cta-banner__content { max-width: 700px; margin: 0 auto; padding: 0 1.5rem; }
.gbpa-cta-banner__title   { font-size: clamp(1.3rem, 3vw, 2rem); font-weight: 800; margin: 0 0 .8rem; }
.gbpa-cta-banner__subtitle { font-size: 1.05rem; margin: 0 0 1.8rem; opacity: .9; }
.gbpa-cta-banner__buttons  { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem; }

/* ── Contact Info ──────────────────────────────────────────────────────── */
.gbpa-contact-info {
  display:       grid;
  gap:           1rem;
  padding:       1.5rem;
  background:    var(--gbpa-white);
  border:        1px solid var(--gbpa-border);
  border-radius: var(--gbpa-radius);
}
.gbpa-contact-info__item {
  display:     flex;
  align-items: flex-start;
  gap:         1rem;
  font-size:   .95rem;
}
.gbpa-contact-info__item .dashicons { color: var(--gbpa-primary); flex-shrink: 0; margin-top: 2px; }
.gbpa-contact-info a { color: var(--gbpa-primary); }

/* ── Reviews ───────────────────────────────────────────────────────────── */
.gbpa-reviews-grid {
  display:               grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap:                   1.5rem;
}
.gbpa-review-card {
  background:    var(--gbpa-white);
  border:        1px solid var(--gbpa-border);
  border-radius: var(--gbpa-radius);
  padding:       1.5rem;
  margin:        0;
  box-shadow:    var(--gbpa-shadow-sm);
}
.gbpa-review-card__stars { color: #f5b300; font-size: 1.2rem; margin-bottom: .8rem; letter-spacing: 2px; }
.gbpa-review-card__text  { font-size: .95rem; color: var(--gbpa-text); line-height: 1.7; margin: 0 0 1rem; }
.gbpa-review-card__author { font-size: .85rem; color: var(--gbpa-text-light); }
.gbpa-review-card__author strong { color: var(--gbpa-text); }

/* ── Map ───────────────────────────────────────────────────────────────── */
.gbpa-map-wrapper {
  border-radius: var(--gbpa-radius);
  overflow:      hidden;
  border:        1px solid var(--gbpa-border);
}
.gbpa-map-wrapper iframe { display: block; }

/* ── Empty state ───────────────────────────────────────────────────────── */
.gbpa-empty {
  text-align: center;
  color:      var(--gbpa-text-light);
  padding:    2rem;
}

/* ── Responsive ────────────────────────────────────────────────────────── */
@media (max-width: 600px) {
  .gbpa-hero__cta     { flex-direction: column; align-items: center; }
  .gbpa-trust-bar__items { flex-direction: column; align-items: flex-start; gap: .8rem; }
  .gbpa-cta-banner__buttons { flex-direction: column; align-items: center; }
}