.elementor-7005 .elementor-element.elementor-element-ea984aa{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}:root{--page-title-display:none;}/* Start custom CSS */@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600&family=Questrial&display=swap');
/* ==========================================================================
   Qlarity ClearShield — scoped stylesheet
   Everything lives under .qlarity-clearshield so it cannot leak into,
   or be overridden by, the surrounding WordPress theme.
   ========================================================================== */
 
.qlarity-clearshield {
  --qcs-navy: #0c2736;
  --qcs-navy-soft: #4a5f6b;
  --qcs-orange: #f36827;
  --qcs-surface: #f4f9fc;
  --qcs-surface-deep: #e7f0f6;
  --qcs-hairline: #e2ecf2;
  --qcs-whatsapp: #25d366;
  --qcs-white: #ffffff;
  --qcs-muted: #5b6d78;
  --qcs-font-display: "Lora", Georgia, serif;
  --qcs-font-sans: "Questrial", "Helvetica Neue", Arial, sans-serif;
  --qcs-shadow-card: 0 1px 2px rgba(12,39,54,0.04), 0 12px 32px -18px rgba(12,39,54,0.22);
  --qcs-shadow-lift: 0 2px 4px rgba(12,39,54,0.05), 0 24px 48px -24px rgba(12,39,54,0.28);
 
  all: initial;
  display: block;
  font-family: var(--qcs-font-sans);
  color: var(--qcs-navy);
  background: var(--qcs-white);
  -webkit-font-smoothing: antialiased;
  line-height: 1.5;
}
 
.qlarity-clearshield *,
.qlarity-clearshield *::before,
.qlarity-clearshield *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0 solid var(--qcs-hairline) !important;
  font: inherit;
  color: inherit;
  text-decoration: none;
  list-style: none;
}
 
.qlarity-clearshield img,
.qlarity-clearshield video,
.qlarity-clearshield svg {
  display: block;
  max-width: 100%;
}
 
.qlarity-clearshield button {
  cursor: pointer;
  background: none;
  font-family: inherit;
}
 
.qlarity-clearshield a {
  color: inherit;
}
 
.qlarity-clearshield h1,
.qlarity-clearshield h2,
.qlarity-clearshield h3,
.qlarity-clearshield h4 {
  font-family: var(--qcs-font-display);
  color: var(--qcs-navy);
  letter-spacing: -0.01em;
  font-weight: 500;
  line-height: 1.15;
}
 
.qlarity-clearshield p {
  line-height: 1.7;
}
 
.qlarity-clearshield :focus-visible {
  outline: 2px solid var(--qcs-orange);
  outline-offset: 3px;
  border-radius: 2px;
}
 
/* ---------- layout helpers ---------- */
.qcs-container {
  width: 100%;
  margin-inline: auto;
  max-width: 78rem;
  padding-inline: 1.25rem;
}
@media (min-width: 768px) {
  .qcs-container { padding-inline: 2rem; }
}
 
.qcs-section {
  padding-block: 3.5rem;
}
@media (min-width: 768px) { .qcs-section { padding-block: 4rem; } }
@media (min-width: 1024px) { .qcs-section { padding-block: 5rem; } }
 
.qcs-section--soft { background: var(--qcs-surface); }
.qcs-section--navy { background: var(--qcs-navy); }
 
.qcs-eyebrow {
  font-size: 0.75rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--qcs-orange);
  margin-bottom: 1rem;
  display: block;
  font-weight: 600;
}
 
.qcs-heading {
  max-width: 48rem;
}
.qcs-heading--center { margin-inline: auto; text-align: center; }
.qcs-heading h2 {
  font-size: 1.9rem;
  line-height: 1.15;
}
@media (min-width: 768px) { .qcs-heading h2 { font-size: 2.25rem; } }
@media (min-width: 1024px) { .qcs-heading h2 { font-size: 2.75rem; } }
.qcs-heading--invert h2 { color: var(--qcs-white); }
.qcs-heading p.qcs-intro {
  margin-top: 1.25rem;
  font-size: 1rem;
  line-height: 1.8;
  color: var(--qcs-muted);
}
@media (min-width: 768px) { .qcs-heading p.qcs-intro { font-size: 1.125rem; } }
.qcs-heading--invert p.qcs-intro { color: rgba(255,255,255,0.7); }
 
/* ---------- reveal-on-scroll ---------- */
.qcs-reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.8s cubic-bezier(.22,1,.36,1), transform 0.8s cubic-bezier(.22,1,.36,1);
}
.qcs-reveal.is-visible {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .qcs-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}
 
/* ---------- buttons ---------- */
.qcs-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 0.375rem;
  font-family: var(--qcs-font-sans);
  font-size: 0.875rem;
  padding: 0.625rem 1.25rem;
  transition: all 0.3s ease-out;
  white-space: nowrap;
  text-decoration:none!important;
}
.qcs-btn:active { transform: scale(0.985); }
.qcs-btn--lg { padding: 0.875rem 1.75rem; font-size: 0.95rem; }
.qcs-btn--primary {
  background: var(--qcs-orange);
  color: var(--qcs-white) !important;
  box-shadow: 0 10px 24px -14px var(--qcs-orange) !important;
}
.qcs-btn--primary:hover {
  background: rgba(243,104,39,0.9);
  box-shadow: 0 16px 32px -16px var(--qcs-orange);
  transform: translateY(-2px);
}
.qcs-btn--outline {
  border: 1px solid var(--qcs-hairline) !important;
  background: var(--qcs-white) !important;
  color: var(--qcs-navy) !important;
}
.qcs-btn--outline:hover {
  border-color: var(--qcs-orange);
  color: var(--qcs-orange);
  transform: translateY(-2px);
}
.qcs-btn--light {
  background: var(--qcs-white);
  color: var(--qcs-navy);
  box-shadow: 0 10px 24px -16px rgba(0,0,0,0.5);
}
.qcs-btn--light:hover { background: rgba(255,255,255,0.9); transform: translateY(-2px); }
 
.qcs-btn-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}
 
/* ---------- card ---------- */
.qcs-card {
  height: 100%;
  border-radius: 0.75rem;
  border: 1px solid var(--qcs-hairline) !important;
  background: var(--qcs-white);
  box-shadow: var(--qcs-shadow-card);
  transition: all 0.5s ease-out;
}
.qcs-card--interactive:hover {
  transform: translateY(-4px);
  border-color: rgba(243,104,39,0.3);
  box-shadow: var(--qcs-shadow-lift);
}
.qcs-card-pad { padding: 2rem; }
@media (min-width: 768px) { .qcs-card-pad-lg { padding: 2.5rem; } }
 
/* ---------- image placeholder ---------- */
.qcs-placeholder {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 0.75rem;
  border: 1px solid var(--qcs-hairline);
  background: var(--qcs-surface-deep);
  color: var(--qcs-navy-soft);
}
.qcs-placeholder--square { border-radius: 0; }
.qcs-placeholder--dark {
  background: rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.7);
  border-color: rgba(255,255,255,0.12);
}
.qcs-placeholder-inner {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 1.5rem;
  text-align: center;
}
.qcs-placeholder-inner svg { width: 1.75rem; height: 1.75rem; opacity: 0.6; }
.qcs-placeholder-subject { max-width: 26ch; font-size: 0.75rem; line-height: 1.5; letter-spacing: 0.01em; }
.qcs-placeholder-ratio { font-size: 0.65rem; letter-spacing: 0.18em; text-transform: uppercase; opacity: 0.6; }
.qcs-placeholder-tag {
  position: absolute;
  top: 0.6rem;
  left: 0.6rem;
  background: var(--qcs-orange);
  color: #fff;
  font-size: 0.6rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 0.2rem 0.5rem;
  border-radius: 0.25rem;
}
 
/* ratio boxes via padding-top trick (no aspect-ratio dependency issues) */
.qcs-ratio-5-4 { aspect-ratio: 5 / 4; }
.qcs-ratio-4-3 { aspect-ratio: 4 / 3; }
.qcs-ratio-16-10 { aspect-ratio: 16 / 10; }
.qcs-ratio-9-16 { aspect-ratio: 9 / 16; }
.qcs-ratio-16-9 { aspect-ratio: 16 / 9; }
 
/* ---------- stat grid ---------- */
.qcs-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem 2rem;
  border-top: 1px solid var(--qcs-hairline);
  border-bottom: 1px solid var(--qcs-hairline);
  padding-block: 1.75rem;
}
@media (min-width: 640px) { .qcs-stats { grid-template-columns: repeat(4, 1fr); } }
.qcs-stat-value { display: block; font-family: var(--qcs-font-display); font-size: 1.5rem; color: var(--qcs-navy); }
.qcs-stat-label { display: block; margin-top: 0.25rem; font-size: 0.75rem; line-height: 1.4; color: var(--qcs-muted); }
 
/* ---------- hero ---------- */
.qcs-hero { position: relative; overflow: hidden; background: var(--qcs-surface); }
.qcs-hero-grid {
  display: grid;
  gap: 2.5rem;
  padding-block: 3.5rem;
}
@media (min-width: 1024px) {
  .qcs-hero-grid {
    grid-template-columns: minmax(0,1fr) minmax(0,1.05fr);
    align-items: center;
    gap: 5rem;
    padding-block: 7rem;
  }
  .qcs-hero-media { grid-column: 2; grid-row: 1 / span 2; }
  .qcs-hero-stats { grid-column: 1; grid-row: 2; }
  .qcs-hero-copy { grid-column: 1; grid-row: 1; }
}
.qcs-hero h1 { font-size: 2.25rem; margin-top: 1.25rem; }
@media (min-width: 768px) { .qcs-hero h1 { font-size: 3rem; } }
@media (min-width: 1024px) { .qcs-hero h1 { font-size: 3.5rem; } }
.qcs-hero h1 span { display: block; color: var(--qcs-orange); }
.qcs-hero-lead { margin-top: 1.75rem; max-width: 36rem; font-size: 1rem; line-height: 1.8; color: var(--qcs-muted); }
@media (min-width: 768px) { .qcs-hero-lead { font-size: 1.125rem; } }
.qcs-hero .qcs-btn-row { margin-top: 2.25rem; }
 
/* ---------- grids ---------- */
.qcs-grid-3 { display: grid; gap: 1.5rem; }
@media (min-width: 768px) { .qcs-grid-3 { grid-template-columns: repeat(3, 1fr); } }
.qcs-grid-2 { display: grid; gap: 1.5rem; }
@media (min-width: 640px) { .qcs-grid-2 { grid-template-columns: repeat(2, 1fr); } }
.qcs-grid-4 { display: grid; gap: 1.5rem; }
@media (min-width: 640px) { .qcs-grid-4 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .qcs-grid-4 { grid-template-columns: repeat(4, 1fr); } }
 
.qcs-icon-wrap {
  display: grid;
  place-items: center;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 1rem;
  background: rgba(243,104,39,0.08);
  transition: background 0.5s;
}
.qcs-card:hover .qcs-icon-wrap { background: rgba(243,104,39,0.14); }
.qcs-icon-wrap svg { width: 1.5rem; height: 1.5rem; color: var(--qcs-orange); }
.qcs-feature-index {
  display: block;
  margin-top: 1.5rem;
  font-size: 0.75rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(243,104,39,0.7);
}
 
/* who-is-it-for cards */
.qcs-who-card { overflow: hidden; }
.qcs-who-body { padding: 1.75rem; }
 
/* ---------- CTA band ---------- */
.qcs-cta-band {
  margin-top: 4rem;
  display: grid;
  gap: 1.5rem;
  border-radius: 0.75rem;
  border: 1px solid rgba(243,104,39,0.2);
  background: rgba(243,104,39,0.05);
  padding: 1.75rem;
}
@media (min-width: 640px) {
  .qcs-cta-band { grid-template-columns: minmax(0,1fr) auto; align-items: center; padding: 2.25rem; }
}
.qcs-cta-title { font-family: var(--qcs-font-display); font-size: 1.25rem; color: var(--qcs-navy); }
@media (min-width: 768px) { .qcs-cta-title { font-size: 1.5rem; } }
.qcs-cta-note { margin-top: 0.5rem; font-size: 0.875rem; line-height: 1.7; color: var(--qcs-muted); }
 
/* ---------- logo strip ---------- */
.qcs-logo-grid {
  margin-top: 3.5rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}
@media (min-width: 640px) { .qcs-logo-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .qcs-logo-grid { grid-template-columns: repeat(4, 1fr); } }
.qcs-logo-box {
  height: 6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  border: 1px solid var(--qcs-hairline);
  background: var(--qcs-surface);
  padding: 0 1.5rem;
  text-align: center;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  color: var(--qcs-navy-soft);
}
 
/* ---------- why-clearshield comparison ---------- */
.qcs-compare {
  margin-top: 3rem;
  overflow: hidden;
  border-radius: 0.75rem;
  border: 1px solid var(--qcs-hairline);
  background: var(--qcs-white);
  box-shadow: var(--qcs-shadow-card);
}
.qcs-compare-grid { display: grid; }
@media (min-width: 768px) { .qcs-compare-grid { grid-template-columns: repeat(3, 1fr); } }
.qcs-compare-col {
  padding: 2rem;
  border-bottom: 1px solid var(--qcs-hairline);
}
@media (min-width: 768px) {
  .qcs-compare-col { padding: 2.5rem; border-bottom: 0; border-right: 1px solid var(--qcs-hairline); }
  .qcs-compare-col:last-child { border-right: 0; }
}
.qcs-compare-col--accent { background: rgba(243,104,39,0.05); }
.qcs-compare-tag { font-size: 0.75rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--qcs-muted); }
.qcs-compare-col--accent .qcs-compare-tag { color: var(--qcs-orange); }
.qcs-compare-col h3 { margin-top: 0.75rem; font-family: var(--qcs-font-display); font-size: 1.25rem; color: var(--qcs-navy); }
.qcs-compare-list { margin-top: 1.5rem; display: grid; gap: 1rem; }
.qcs-compare-list li { display: flex; gap: 0.75rem; font-size: 0.875rem; line-height: 1.7; color: var(--qcs-muted); }
.qcs-compare-col--accent .qcs-compare-list li { color: var(--qcs-navy-soft); }
.qcs-compare-list svg { width: 1rem; height: 1rem; flex-shrink: 0; margin-top: 0.2rem; color: var(--qcs-orange); }
.qcs-dash { display: block; margin-top: 0.85rem; height: 1px; width: 0.75rem; flex-shrink: 0; background: var(--qcs-hairline); }
 
/* ---------- stat cards (damage cost) ---------- */
.qcs-stat-card {
  border-radius: 0.75rem;
  border: 1px solid var(--qcs-hairline);
  background: var(--qcs-surface);
  padding: 2rem;
  text-align: center;
}
.qcs-stat-card-value { font-family: var(--qcs-font-display); font-size: 1.85rem; line-height: 1; color: var(--qcs-orange); }
@media (min-width: 768px) { .qcs-stat-card-value { font-size: 2.15rem; } }
.qcs-stat-card-label { margin-top: 1rem; font-size: 0.875rem; line-height: 1.7; color: var(--qcs-muted); }
 
/* ---------- comparison table ---------- */
.qcs-table-wrap {
  margin-top: 2.5rem;
  overflow-x: auto;
  border-radius: 0.75rem;
  border: 1px solid var(--qcs-hairline) !important;
  background: var(--qcs-white) !important;
  box-shadow: var(--qcs-shadow-card) !important;
}
.qcs-table { width: 100%; min-width: 640px; border-collapse: collapse; text-align: left; }
.qcs-table thead tr { background: var(--qcs-surface); }
.qcs-table th, .qcs-table td { padding: 1.25rem 1.5rem; font-size: 0.875rem; }
.qcs-table thead th { font-weight: 400; color: var(--qcs-navy-soft); }
.qcs-table thead th.qcs-col-highlight { color: var(--qcs-orange); }
.qcs-table tbody tr { border-top: 1px solid var(--qcs-hairline); }
.qcs-table tbody th { font-weight: 400; color: var(--qcs-navy); text-align: left; }
.qcs-table tbody td { color: var(--qcs-muted); }
.qcs-table tbody td.qcs-col-highlight { background: rgba(243,104,39,0.04); color: var(--qcs-navy); }
 
/* ---------- timeline ---------- */
.qcs-timeline { position: relative; border-left: 1px solid var(--qcs-hairline); padding-left: 2rem; display: grid; gap: 2.5rem; }
@media (min-width: 768px) { .qcs-timeline { padding-left: 3rem; gap: 3rem; } }
.qcs-timeline-item { position: relative; }
.qcs-timeline-num {
  position: absolute;
  top: 0.25rem;
  left: -2.55rem;
  display: grid;
  place-items: center;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 999px;
  border: 1px solid rgba(243,104,39,0.4);
  background: var(--qcs-white);
  font-size: 0.75rem;
  color: var(--qcs-orange);
}
@media (min-width: 768px) { .qcs-timeline-num { left: -3.55rem; } }
.qcs-timeline-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.25rem 1rem; }
.qcs-timeline-head h3 { font-size: 1.25rem; font-weight: 500; }
.qcs-timeline-meta { font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--qcs-orange); }
.qcs-timeline-desc { margin-top: 0.75rem; max-width: 42rem; font-size: 0.95rem; line-height: 1.8; color: var(--qcs-muted); }
 
/* ---------- DIY section ---------- */
.qcs-diy-grid { display: grid; gap: 3rem; align-items: start; }
@media (min-width: 1024px) { .qcs-diy-grid { grid-template-columns: minmax(0,1fr) minmax(0,0.72fr); gap: 5rem; } }
.qcs-diy-stats { margin-top: 2.5rem; display: grid; gap: 1.5rem; }
@media (min-width: 640px) { .qcs-diy-stats { grid-template-columns: repeat(3, 1fr); } }
.qcs-diy-stat { border-radius: 0.75rem; border: 1px solid var(--qcs-hairline); background: var(--qcs-white); padding: 1.5rem; }
.qcs-diy-stat dt { font-family: var(--qcs-font-display); font-size: 1.5rem; color: var(--qcs-orange); }
.qcs-diy-stat dd { margin-top: 0.75rem; font-size: 0.875rem; line-height: 1.7; color: var(--qcs-muted); }
.qcs-check-list { margin-top: 2rem; display: grid; gap: 1rem; }
@media (min-width: 640px) { .qcs-check-list { grid-template-columns: repeat(2, 1fr); } }
.qcs-check-list li { display: flex; gap: 0.75rem; font-size: 0.875rem; line-height: 1.7; color: var(--qcs-navy-soft); }
.qcs-check-list li svg { width: 1rem; height: 1rem; flex-shrink: 0; margin-top: 0.25rem; color: var(--qcs-orange); }
 
/* ---------- video block ---------- */
.qcs-video-figure { position: relative; }
.qcs-video-frame {
  overflow: hidden;
  border-radius: 0.75rem;
  border: 1px solid rgba(226,236,242,0.6);
  background: var(--qcs-navy);
  box-shadow: var(--qcs-shadow-lift);
}
.qcs-video-caption { margin-top: 0.75rem; text-align: center; font-size: 0.875rem; color: var(--qcs-muted); }
.qcs-video-caption--invert { color: rgba(255,255,255,0.55); }
 
/* ---------- what's included box ---------- */
.qcs-included-box { border-radius: 0.75rem; border: 1px solid var(--qcs-hairline); background: var(--qcs-white); padding: 1.75rem; margin-top: 1.5rem; }
.qcs-included-list { margin-top: 1.25rem; display: grid; gap: 0.75rem; }
.qcs-included-list li { display: flex; gap: 0.75rem; font-size: 0.875rem; line-height: 1.7; color: var(--qcs-navy-soft); }
.qcs-included-list li svg { width: 1rem; height: 1rem; flex-shrink: 0; margin-top: 0.25rem; color: var(--qcs-orange); }
 
/* ---------- installation figures ---------- */
.qcs-install-figs { display: grid; gap: 1.5rem; }
@media (min-width: 640px) { .qcs-install-figs { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .qcs-install-figs { grid-template-columns: 1fr; } }
.qcs-install-figcap { margin-top: 0.75rem; font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--qcs-muted); }
 
/* ---------- warranty box ---------- */
.qcs-warranty-box { border-radius: 0.75rem; border: 1px solid var(--qcs-hairline); background: var(--qcs-surface); padding: 2.5rem; }
@media (min-width: 768px) { .qcs-warranty-box { padding: 4rem; } }
.qcs-warranty-grid { display: grid; gap: 2.5rem; }
@media (min-width: 768px) { .qcs-warranty-grid { grid-template-columns: repeat(2, 1fr); align-items: center; gap: 4rem; } }
.qcs-warranty-body { margin-top: 1.5rem; font-size: 0.95rem; line-height: 1.8; color: var(--qcs-muted); }
.qcs-warranty-list { display: grid; gap: 1rem; }
.qcs-warranty-list li { display: flex; gap: 0.75rem; font-size: 0.875rem; line-height: 1.7; color: var(--qcs-navy-soft); }
.qcs-warranty-list li svg { width: 1rem; height: 1rem; flex-shrink: 0; margin-top: 0.25rem; color: var(--qcs-orange); }
 
/* ---------- reviews ---------- */
.qcs-review-stars { display: flex; gap: 0.15rem; color: var(--qcs-orange); }
.qcs-review-stars svg { width: 1rem; height: 1rem; }
.qcs-review-quote { margin-top: 1.25rem; flex: 1; font-family: var(--qcs-font-display); font-size: 1.05rem; line-height: 1.8; color: var(--qcs-navy); }
.qcs-review-card { display: flex; flex-direction: column; }
.qcs-review-footer { margin-top: 1.5rem; border-top: 1px solid var(--qcs-hairline); padding-top: 1.25rem; font-size: 0.875rem; }
.qcs-review-footer .qcs-review-loc { margin-top: 0.25rem; color: var(--qcs-muted); }
 
/* ---------- gallery ---------- */
.qcs-gallery-filters { margin-bottom: 2.5rem; display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5rem; }
.qcs-filter-btn {
  border-radius: 999px !important;
  border: 1px solid var(--qcs-hairline)  !important;
  padding: 0.5rem 1.25rem  !important;
  font-size: 0.875rem  !important;
  color: var(--qcs-navy-soft) !important;
  transition: all 0.3s  !important;
}
.qcs-filter-btn:hover { border-color: rgba(243,104,39,0.4) !important; color: var(--qcs-navy) !important;background-color: #fff !important; }
.qcs-filter-btn.is-active { border-color: var(--qcs-orange) !important; background: var(--qcs-orange) !important; color: #fff !important; }
.qcs-gallery-grid { display: grid; gap: 1.5rem; }
@media (min-width: 640px) { .qcs-gallery-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .qcs-gallery-grid { grid-template-columns: repeat(3, 1fr); } }
.qcs-gallery-item { display: none; }
.qcs-gallery-item.is-visible { display: block; }
.qcs-gallery-cat { margin-top: 0.75rem; font-size: 0.875rem; color: var(--qcs-muted); }
 
/* ---------- before/after slider ---------- */
.qcs-ba-wrap { overflow: hidden; border-radius: 0.75rem; border: 1px solid var(--qcs-hairline); background: var(--qcs-white); box-shadow: var(--qcs-shadow-card); }
.qcs-ba-frame { position: relative; touch-action: none; user-select: none; cursor: ew-resize; }
.qcs-ba-after, .qcs-ba-before-wrap { pointer-events: none; }
.qcs-ba-before-wrap { position: absolute; inset: 0; overflow: hidden; will-change: clip-path; clip-path: inset(0 50% 0 0); }
.qcs-ba-tag {
  position: absolute; top: 1rem; pointer-events: none;
  border-radius: 0.375rem; padding: 0.25rem 0.75rem;
  font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; color: #fff;
}
.qcs-ba-tag--before { left: 1rem; background: rgba(12,39,54,0.85); }
.qcs-ba-tag--after { right: 1rem; background: var(--qcs-orange); }
.qcs-ba-handle-track {
  position: absolute; inset-block: 0; width: 1px;
  background: rgba(255,255,255,0.9);
  box-shadow: 0 0 0 1px rgba(12,39,54,0.15);
  left: 50%;
}
.qcs-ba-handle {
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  display: grid !important; place-items: center;
  width: 3rem  !important; height: 3rem  !important;
  border-radius: 999px  !important;
  background: #fff !important;
  color: var(--qcs-navy)  !important;
  box-shadow: var(--qcs-shadow-lift)  !important;
  cursor: ew-resize !important;
  transition: transform 0.2s !important;
}
.qcs-ba-handle svg { width: 1rem; height: 1rem; }
.qcs-ba-drag-hint {
  position: absolute; left: 0; right: 0; bottom: 1rem;
  text-align: center; font-size: 0.7rem; letter-spacing: 0.14em;
  text-transform: uppercase; color: #fff; pointer-events: none;
  text-shadow: 0 1px 6px rgba(12,39,54,0.6);
  transition: opacity 0.5s;
}
 
/* ---------- surface body.elementor-page-7005 ---------- */
.qcs-surface-grid { display: grid; gap: 2rem; }
@media (min-width: 1024px) { .qcs-surface-grid { grid-template-columns: minmax(0,320px) minmax(0,1fr); gap: 3.5rem; } }
.qcs-surface-tabs { display: none; flex-direction: column; gap: 0.5rem; }
@media (min-width: 1024px) { .qcs-surface-tabs { display: flex; } }
.qcs-surface-tab {
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  border-radius: 0.5rem !important; border: 1px solid var(--qcs-hairline)!important;
  padding: 1rem 1.25rem !important; text-align: left !important; font-size: 0.95rem !important;
  background: rgba(255,255,255,0.6) !important; color: var(--qcs-navy-soft) !important;
  transition: all 0.3s !important;
}
.qcs-surface-tab:hover { border-color: rgba(243,104,39,0.3); color: var(--qcs-navy); }
.qcs-surface-tab.is-active { border-color: rgba(243,104,39,0.4); background: #fff; color: var(--qcs-navy); box-shadow: var(--qcs-shadow-card); }
.qcs-surface-tab svg { width: 1rem; height: 1rem; opacity: 0; color: var(--qcs-orange); transition: opacity 0.3s; }
.qcs-surface-tab.is-active svg { opacity: 1; }
.qcs-surface-panel { display: grid; gap: 2rem; align-items: center; }
@media (min-width: 768px) { .qcs-surface-panel { grid-template-columns: repeat(2, 1fr); gap: 2.5rem; } }
.qcs-surface-mobile-tabs { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1.75rem; }
@media (min-width: 1024px) { .qcs-surface-mobile-tabs { display: none; } }
.qcs-surface-mobile-btn {
  border-radius: 999px; border: 1px solid var(--qcs-hairline);
  padding: 0.5rem 1rem; font-size: 0.875rem; white-space: nowrap;
  background: #fff; color: var(--qcs-navy-soft); transition: all 0.3s;
}
.qcs-surface-mobile-btn.is-active { border-color: var(--qcs-orange); background: var(--qcs-orange); color: #fff; }
.qcs-surface-media { position: relative; }
.qcs-surface-nav { position: absolute; inset-inline: 0.75rem; top: 50%; transform: translateY(-50%); display: flex; justify-content: space-between; pointer-events: none; }
@media (min-width: 1024px) { .qcs-surface-nav { display: none; } }
.qcs-surface-nav button {
  pointer-events: auto; display: grid; place-items: center;
  width: 2.5rem; height: 2.5rem; border-radius: 999px;
  background: rgba(255,255,255,0.9); color: var(--qcs-navy);
  box-shadow: var(--qcs-shadow-card);
}
.qcs-surface-nav svg { width: 1rem; height: 1rem; }
.qcs-surface-headline { font-size: 1.5rem; font-weight: 500; }
.qcs-surface-desc { margin-top: 1rem; font-size: 0.95rem; line-height: 1.8; color: var(--qcs-muted); }
.qcs-surface-notes { margin-top: 1.5rem; display: grid; gap: 0.75rem; }
.qcs-surface-notes li { display: flex; gap: 0.75rem; font-size: 0.875rem; line-height: 1.7; color: var(--qcs-navy-soft); }
.qcs-surface-notes li svg { width: 1rem; height: 1rem; flex-shrink: 0; margin-top: 0.2rem; color: var(--qcs-orange); }
 
/* ---------- FAQ ---------- */
.qcs-faq { max-width: 48rem; margin-inline: auto; overflow: hidden; border-radius: 0.75rem; border: 1px solid var(--qcs-hairline); background: #fff; box-shadow: var(--qcs-shadow-card); }
.qcs-faq-item + .qcs-faq-item { border-top: 1px solid var(--qcs-hairline); }
.qcs-faq-btn {
  display: flex !important; width: 100% !important; align-items: center !important; justify-content: space-between !important;
  gap: 1.5rem !important; padding: 1.5rem !important; text-align: left !important; font-size: 1.05rem !important;
  color: var(--qcs-navy) !important; transition: color 0.3s !important;
}
.qcs-faq-btn:hover { color: var(--qcs-orange) !important; background-color: #fff !important;}
@media (min-width: 768px) { .qcs-faq-btn { padding: 1.5rem 2rem; background: #ffffff !important} }
.qcs-faq-btn span.q { font-family: var(--qcs-font-display) !important; }
.qcs-faq-btn svg { width: 1.25rem; height: 1.25rem; flex-shrink: 0; color: var(--qcs-orange); transition: transform 0.3s; }
.qcs-faq-item.is-open .qcs-faq-btn svg { transform: rotate(45deg); }
.qcs-faq-panel { display: none; padding: 0 1.5rem 1.75rem; font-size: 0.95rem; line-height: 1.8; color: var(--qcs-muted); }
@media (min-width: 768px) { .qcs-faq-panel { padding: 0 2rem 1.75rem; } }
.qcs-faq-item.is-open .qcs-faq-panel { display: block; }
 
/* ---------- contact form ---------- */
.qcs-form { display: grid; gap: 1.25rem; }
.qcs-field { display: grid; gap: 0.5rem; }
.qcs-field label { font-size: 0.875rem; color: var(--qcs-navy); }
.qcs-field input,
.qcs-field select,
.qcs-field textarea {
  border-radius: 0.375rem; border: 1px solid var(--qcs-hairline);
  background: #fff; padding: 0.75rem 1rem; font-size: 0.875rem;
  color: var(--qcs-navy); outline: none; transition: border-color 0.3s;
  width: 100%; font-family: var(--qcs-font-sans);
}
.qcs-field input::placeholder, .qcs-field textarea::placeholder { color: rgba(91,109,120,0.7); }
.qcs-field input:focus, .qcs-field select:focus, .qcs-field textarea:focus { border-color: var(--qcs-orange); }
.qcs-field textarea { resize: none; }
.qcs-form-note { font-size: 0.75rem; line-height: 1.6; color: var(--qcs-muted); }
 
/* ---------- final CTA ---------- */
.qcs-final-cta { text-align: center; padding-block: 5rem; }
@media (min-width: 768px) { .qcs-final-cta { padding-block: 7rem; } }
.qcs-final-cta-inner { max-width: 40rem; margin-inline: auto; }
.qcs-final-cta h2 { margin-top: 1.25rem; font-size: 1.9rem; color: #fff; }
@media (min-width: 768px) { .qcs-final-cta h2 { font-size: 2.75rem; } }
.qcs-final-cta p { margin-top: 1.5rem; font-size: 1rem; line-height: 1.8; color: rgba(255,255,255,0.7); }
.qcs-final-cta .qcs-btn-row { margin-top: 2.5rem; justify-content: center; }
.qcs-final-cta-tag { margin-top: 2rem; font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255,255,255,0.45); }
 
/* ---------- floating actions ---------- */
.qcs-progress-bar {
  position: fixed; top: 0; left: 0; z-index: 999998;
  height: 3px; width: 100%; background: var(--qcs-orange);
  transform-origin: left; transform: scaleX(0);
  transition: transform 0.15s;
}
.qcs-float-stack {
  position: fixed; right: 1rem; bottom: 6rem; z-index: 999997;
  display: flex; flex-direction: column; align-items: flex-end; gap: 0.75rem;
}
@media (min-width: 768px) { .qcs-float-stack { bottom: 2rem; } }
.qcs-float-top {
  display: grid; place-items: center; width: 2.75rem; height: 2.75rem;
  border-radius: 999px; border: 1px solid var(--qcs-hairline);
  background: #fff; color: var(--qcs-navy); box-shadow: var(--qcs-shadow-card);
  transition: all 0.3s; opacity: 0; pointer-events: none; transform: translateY(0.5rem);
}
.qcs-float-top.is-visible { opacity: 1; pointer-events: auto; transform: none; }
.qcs-float-top:hover { border-color: var(--qcs-orange); color: var(--qcs-orange); }
.qcs-float-wa {
  display: grid; place-items: center; width: 3.25rem; height: 3.25rem;
  border-radius: 999px; background: var(--qcs-whatsapp); color: #fff;
  box-shadow: var(--qcs-shadow-lift); transition: transform 0.3s;
}
.qcs-float-wa:hover { transform: scale(1.05); }
.qcs-float-wa svg { width: 1.5rem; height: 1.5rem; }
.qcs-mobile-order-bar {
  position: fixed; inset-inline: 0; bottom: 0; z-index: 999996;
  border-top: 1px solid var(--qcs-hairline);
  background: rgba(255,255,255,0.95);
  padding: 0.75rem 1rem;
  backdrop-filter: blur(6px);
  display: flex; align-items: center; gap: 0.75rem;
}
@media (min-width: 768px) { .qcs-mobile-order-bar { display: none; } }
.qcs-mobile-order-bar .qcs-mob-text { min-width: 0; flex: 1; }
.qcs-mobile-order-bar .qcs-mob-title { font-size: 0.875rem; color: var(--qcs-navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qcs-mobile-order-bar .qcs-mob-sub { font-size: 0.75rem; color: var(--qcs-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qcs-mobile-spacer { height: 4rem; }
@media (min-width: 768px) { .qcs-mobile-spacer { display: none; } }
 
/* ---------- misc ---------- */
.qcs-sr-only { position: absolute; width: 1px; height: 1px; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
.qlarity-clearshield .qcs-mt-12 { margin-top: 3rem !important; }
.qlarity-clearshield .qcs-mt-14 { margin-top: 3.5rem !important; }
.qlarity-clearshield .qcs-border-t { border-top: 1px solid var(--qcs-hairline) !important; padding-top: 3.5rem !important; margin-top: 3rem !important; }

.qcs-cf7-wrap .wpcf7-form p { margin-bottom: 1.25rem !important; }
.qcs-cf7-wrap .wpcf7-form label { display: block !important; font-size: 0.875rem !important; color: var(--qcs-navy) !important; margin-bottom: 0.5rem !important; }
.qcs-cf7-wrap .wpcf7-form-control:not([type="submit"]) {
  width: 100% !important;
  border-radius: 0.375rem !important;
  border: 1px solid var(--qcs-hairline) !important;
  background: #fff !important;
  padding: 0.75rem 1rem !important;
  font-size: 0.875rem !important;
  font-family: var(--qcs-font-sans) !important;
  color: var(--qcs-navy) !important;
  outline: none !important;
  transition: border-color 0.3s !important;
}
.qcs-cf7-wrap .wpcf7-form-control:not([type="submit"]):focus { border-color: var(--qcs-orange) !important; }
.qcs-cf7-wrap textarea.wpcf7-form-control { resize: none !important; }
.qcs-cf7-wrap input[type="submit"].wpcf7-form-control {
  width: 100% !important;
  margin-top: 0.25rem !important;
  border-radius: 0.375rem  !important;
  background: var(--qcs-orange) !important;
  color: #fff !important;
  border: 0 !important;
  padding: 0.875rem 1.75rem !important;
  font-size: 0.95rem !important;
  font-family: var(--qcs-font-sans) !important;
  cursor: pointer !important;
  transition: all 0.3s ease-out !important;
}
.qcs-cf7-wrap input[type="submit"].wpcf7-form-control:hover { background: rgba(243,104,39,0.9) !important; }
.qcs-cf7-wrap .wpcf7-not-valid-tip { color: #c0392b !important; font-size: 0.75rem !important; margin-top: 0.25rem !important; }
.qcs-cf7-wrap .wpcf7-response-output { border-radius: 0.375rem !important; padding: 0.75rem 1rem !important; font-size: 0.875rem !important; margin-top: 1rem !important; }/* End custom CSS */