/* =========================================================
   CALM & CLEAN
   SHARED SERVICE PAGES CSS
   =========================================================
   
   Used by all CALM & CLEAN service pages:

   01. Deep Cleaning
   02. Villa Cleaning
   03. Apartment Cleaning
   04. Sofa Cleaning
   05. Mattress Cleaning
   06. Carpet Cleaning
   07. Move-In / Move-Out Cleaning
   08. Monthly Cleaning
   09. Home Cleaning Services
   10. Regular Cleaning

   IMPORTANT:
   - Fully scoped to CALM & CLEAN service page wrappers
   - Does not intentionally style the WordPress theme globally
   - Pricing is NOT hard-coded here
   - Pricing comes from calm-clean-prices.php
   ========================================================= */

/* =========================================================
   01. ROOT VARIABLES
========================================================= */

.cc-service-page,
.cc-deep-page,
.cc-villa-page,
.cc-apartment-page,
.cc-sofa-page,
.cc-mattress-page,
.cc-carpet-page,
.cc-move-page,
.cc-monthly-page,
.cc-home-cleaning-page,
.cc-regular-cleaning-page {
  --cc-navy: #123b4a;
  --cc-navy-dark: #0d303c;

  --cc-green: #2e8b70;
  --cc-green-dark: #236c57;

  --cc-green-soft: #eaf6f1;

  --cc-text: #24353b;
  --cc-muted: #68777c;

  --cc-border: #dce7e5;
  --cc-border-soft: #e8efed;

  --cc-white: #ffffff;

  --cc-bg: #ffffff;
  --cc-soft-bg: #f7faf9;

  --cc-shadow: 0 16px 45px rgba(18, 59, 74, 0.08);

  --cc-card-shadow: 0 10px 32px rgba(18, 59, 74, 0.055);

  --cc-radius: 18px;

  width: 100%;
  max-width: 100%;

  margin: 0;
  padding: 0;

  background: #ffffff;
  color: var(--cc-text);

  box-sizing: border-box;
}

/* =========================================================
   02. UNIVERSAL BOX SIZING
========================================================= */

.cc-service-page *,
.cc-service-page *::before,
.cc-service-page *::after,
.cc-deep-page *,
.cc-deep-page *::before,
.cc-deep-page *::after,
.cc-villa-page *,
.cc-villa-page *::before,
.cc-villa-page *::after,
.cc-apartment-page *,
.cc-apartment-page *::before,
.cc-apartment-page *::after,
.cc-sofa-page *,
.cc-sofa-page *::before,
.cc-sofa-page *::after,
.cc-mattress-page *,
.cc-mattress-page *::before,
.cc-mattress-page *::after,
.cc-carpet-page *,
.cc-carpet-page *::before,
.cc-carpet-page *::after,
.cc-move-page *,
.cc-move-page *::before,
.cc-move-page *::after,
.cc-monthly-page *,
.cc-monthly-page *::before,
.cc-monthly-page *::after,
.cc-home-cleaning-page *,
.cc-home-cleaning-page *::before,
.cc-home-cleaning-page *::after,
.cc-regular-cleaning-page *,
.cc-regular-cleaning-page *::before,
.cc-regular-cleaning-page *::after {
  box-sizing: border-box;
}

/* =========================================================
   03. SHARED CONTAINER
========================================================= */

.cc-service-container,
.cc-deep-container,
.cc-villa-container,
.cc-apartment-container,
.cc-sofa-container,
.cc-mattress-container,
.cc-carpet-container,
.cc-move-container,
.cc-monthly-container,
.cc-home-cleaning-container,
.cc-regular-cleaning-container {
  width: min(1180px, calc(100% - 40px));

  margin-left: auto;
  margin-right: auto;

  padding-left: 0;
  padding-right: 0;
}

/* =========================================================
   04. COMMON HERO
========================================================= */

.cc-service-hero,
.cc-deep-hero,
.cc-villa-hero,
.cc-apartment-hero,
.cc-sofa-hero,
.cc-mattress-hero,
.cc-carpet-hero,
.cc-move-hero,
.cc-monthly-hero,
.cc-home-cleaning-hero,
.cc-regular-cleaning-hero {
  position: relative;

  overflow: hidden;

  background: linear-gradient(135deg, #123b4a 0%, #164d5b 52%, #1d685f 100%);

  padding: 82px 0 78px;
}

.cc-service-hero::before,
.cc-deep-hero::before,
.cc-villa-hero::before,
.cc-apartment-hero::before,
.cc-sofa-hero::before,
.cc-mattress-hero::before,
.cc-carpet-hero::before,
.cc-move-hero::before,
.cc-monthly-hero::before,
.cc-home-cleaning-hero::before,
.cc-regular-cleaning-hero::before {
  content: "";

  position: absolute;

  width: 420px;
  height: 420px;

  right: -170px;
  top: -170px;

  border-radius: 50%;

  background: rgba(255, 255, 255, 0.05);

  pointer-events: none;
}

.cc-service-hero::after,
.cc-deep-hero::after,
.cc-villa-hero::after,
.cc-apartment-hero::after,
.cc-sofa-hero::after,
.cc-mattress-hero::after,
.cc-carpet-hero::after,
.cc-move-hero::after,
.cc-monthly-hero::after,
.cc-home-cleaning-hero::after,
.cc-regular-cleaning-hero::after {
  content: "";

  position: absolute;

  width: 300px;
  height: 300px;

  left: -150px;
  bottom: -180px;

  border-radius: 50%;

  background: rgba(255, 255, 255, 0.04);

  pointer-events: none;
}

/* =========================================================
   05. HERO GRID
========================================================= */

.cc-service-hero-grid,
.cc-deep-hero-grid,
.cc-villa-hero-grid,
.cc-apartment-hero-grid,
.cc-sofa-hero-grid,
.cc-mattress-hero-grid,
.cc-carpet-hero-grid,
.cc-move-hero-grid,
.cc-monthly-hero-grid,
.cc-home-cleaning-hero-grid,
.cc-regular-cleaning-hero-grid {
  position: relative;

  z-index: 2;

  display: grid;

  grid-template-columns:
    minmax(0, 1.08fr)
    minmax(360px, 0.92fr);

  gap: 65px;

  align-items: center;
}

/* =========================================================
   06. HERO CONTENT
========================================================= */

.cc-service-hero-content,
.cc-deep-hero-content,
.cc-villa-hero-content,
.cc-apartment-hero-content,
.cc-sofa-hero-content,
.cc-mattress-hero-content,
.cc-carpet-hero-content,
.cc-move-hero-content,
.cc-monthly-hero-content,
.cc-home-cleaning-hero-content,
.cc-regular-cleaning-hero-content {
  min-width: 0;

  text-align: left;
}

/* =========================================================
   07. HERO EYEBROW
========================================================= */

.cc-service-eyebrow,
.cc-deep-eyebrow,
.cc-villa-eyebrow,
.cc-apartment-eyebrow,
.cc-sofa-eyebrow,
.cc-mattress-eyebrow,
.cc-carpet-eyebrow,
.cc-move-eyebrow,
.cc-monthly-eyebrow,
.cc-home-cleaning-eyebrow,
.cc-regular-cleaning-eyebrow {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  min-height: 34px;

  padding: 8px 14px;

  margin-bottom: 20px;

  border-radius: 999px;

  background: rgba(255, 255, 255, 0.1);

  border: 1px solid rgba(255, 255, 255, 0.17);

  color: #ffffff;

  font-size: 12px;

  font-weight: 800;

  letter-spacing: 1.1px;

  line-height: 1.2;
}

/* =========================================================
   08. HERO H1
========================================================= */

.cc-service-hero h1,
.cc-deep-hero h1,
.cc-villa-hero h1,
.cc-apartment-hero h1,
.cc-sofa-hero h1,
.cc-mattress-hero h1,
.cc-carpet-hero h1,
.cc-move-hero h1,
.cc-monthly-hero h1,
.cc-home-cleaning-hero h1,
.cc-regular-cleaning-hero h1 {
  margin: 0 0 22px;

  color: #ffffff;

  font-size: clamp(40px, 5vw, 64px);

  line-height: 1.04;

  font-weight: 800;

  letter-spacing: -1.8px;
}

.cc-service-hero h1 span,
.cc-deep-hero h1 span,
.cc-villa-hero h1 span,
.cc-apartment-hero h1 span,
.cc-sofa-hero h1 span,
.cc-mattress-hero h1 span,
.cc-carpet-hero h1 span,
.cc-move-hero h1 span,
.cc-monthly-hero h1 span,
.cc-home-cleaning-hero h1 span,
.cc-regular-cleaning-hero h1 span {
  color: #8ed7b9;
}

/* =========================================================
   09. HERO DESCRIPTION
========================================================= */

.cc-service-hero-description,
.cc-deep-hero-text,
.cc-villa-hero-description,
.cc-apartment-hero-description,
.cc-sofa-hero-description,
.cc-mattress-hero-description,
.cc-carpet-hero-description,
.cc-move-hero-description,
.cc-monthly-hero-description,
.cc-home-cleaning-hero-description,
.cc-regular-cleaning-hero-description {
  max-width: 650px;

  margin: 0 0 30px;

  color: rgba(255, 255, 255, 0.84);

  font-size: 17px;

  line-height: 1.75;
}

/* =========================================================
   10. HERO ACTIONS
========================================================= */

.cc-service-hero-actions,
.cc-deep-hero-actions,
.cc-villa-hero-actions,
.cc-apartment-hero-actions,
.cc-sofa-hero-actions,
.cc-mattress-hero-actions,
.cc-carpet-hero-actions,
.cc-move-hero-actions,
.cc-monthly-hero-actions,
.cc-home-cleaning-hero-actions,
.cc-regular-cleaning-hero-actions {
  display: flex;

  flex-wrap: wrap;

  gap: 12px;
}

/* =========================================================
   11. HERO PRIMARY BUTTON
========================================================= */

.cc-service-primary-button,
.cc-deep-btn-primary,
.cc-villa-primary-button,
.cc-apartment-primary-button,
.cc-sofa-primary-button,
.cc-mattress-primary-button,
.cc-carpet-primary-button,
.cc-move-primary-button,
.cc-monthly-primary-button,
.cc-home-cleaning-primary-button,
.cc-regular-cleaning-primary-button {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  min-height: 52px;

  padding: 0 23px;

  border: 0;

  border-radius: 10px;

  background: #ffffff;

  color: var(--cc-navy) !important;

  text-decoration: none !important;

  font-family: inherit;

  font-size: 14px;

  font-weight: 800;

  line-height: 1;

  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);

  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    background 0.2s ease;
}

.cc-service-primary-button:hover,
.cc-deep-btn-primary:hover,
.cc-villa-primary-button:hover,
.cc-apartment-primary-button:hover,
.cc-sofa-primary-button:hover,
.cc-mattress-primary-button:hover,
.cc-carpet-primary-button:hover,
.cc-move-primary-button:hover,
.cc-monthly-primary-button:hover,
.cc-home-cleaning-primary-button:hover,
.cc-regular-cleaning-primary-button:hover {
  transform: translateY(-2px);

  background: #f5faf8;

  color: var(--cc-navy-dark) !important;
}

/* =========================================================
   12. HERO SECONDARY BUTTON
========================================================= */

.cc-service-secondary-button,
.cc-deep-btn-secondary,
.cc-villa-secondary-button,
.cc-apartment-secondary-button,
.cc-sofa-secondary-button,
.cc-mattress-secondary-button,
.cc-carpet-secondary-button,
.cc-move-secondary-button,
.cc-monthly-secondary-button,
.cc-home-cleaning-secondary-button,
.cc-regular-cleaning-secondary-button {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  min-height: 52px;

  padding: 0 23px;

  border: 1px solid rgba(255, 255, 255, 0.45);

  border-radius: 10px;

  background: transparent;

  color: #ffffff !important;

  text-decoration: none !important;

  font-family: inherit;

  font-size: 14px;

  font-weight: 800;

  line-height: 1;

  transition:
    transform 0.2s ease,
    background 0.2s ease;
}

.cc-service-secondary-button:hover,
.cc-deep-btn-secondary:hover,
.cc-villa-secondary-button:hover,
.cc-apartment-secondary-button:hover,
.cc-sofa-secondary-button:hover,
.cc-mattress-secondary-button:hover,
.cc-carpet-secondary-button:hover,
.cc-move-secondary-button:hover,
.cc-monthly-secondary-button:hover,
.cc-home-cleaning-secondary-button:hover,
.cc-regular-cleaning-secondary-button:hover {
  transform: translateY(-2px);

  background: rgba(255, 255, 255, 0.1);

  color: #ffffff !important;
}

/* =========================================================
   13. GOOGLE RATING / TRUST
========================================================= */

.cc-service-hero-trust,
.cc-deep-trust,
.cc-villa-hero-trust,
.cc-apartment-hero-trust,
.cc-sofa-hero-trust,
.cc-mattress-hero-trust,
.cc-carpet-hero-trust,
.cc-move-hero-trust,
.cc-monthly-hero-trust,
.cc-home-cleaning-hero-trust,
.cc-regular-cleaning-hero-trust {
  margin-top: 24px;

  padding-top: 20px;

  min-height: 45px;

  border-top: 1px solid rgba(255, 255, 255, 0.18);

  display: flex;

  align-items: center;

  justify-content: flex-start;

  overflow: hidden;
}

.cc-service-hero-trust *,
.cc-deep-trust *,
.cc-villa-hero-trust *,
.cc-apartment-hero-trust *,
.cc-sofa-hero-trust *,
.cc-mattress-hero-trust *,
.cc-carpet-hero-trust *,
.cc-move-hero-trust *,
.cc-monthly-hero-trust *,
.cc-home-cleaning-hero-trust *,
.cc-regular-cleaning-hero-trust * {
  max-width: 100%;
}

/* Google Reviews Widget */

.cc-service-hero-trust .grw-widget,
.cc-deep-trust .grw-widget,
.cc-villa-hero-trust .grw-widget,
.cc-apartment-hero-trust .grw-widget,
.cc-sofa-hero-trust .grw-widget,
.cc-mattress-hero-trust .grw-widget,
.cc-carpet-hero-trust .grw-widget,
.cc-move-hero-trust .grw-widget,
.cc-monthly-hero-trust .grw-widget,
.cc-home-cleaning-hero-trust .grw-widget,
.cc-regular-cleaning-hero-trust .grw-widget {
  max-width: 100% !important;

  margin: 0 !important;
}

/* =========================================================
   14. HERO CARD
========================================================= */

.cc-service-hero-card,
.cc-deep-hero-card,
.cc-villa-hero-card,
.cc-apartment-hero-card,
.cc-sofa-hero-card,
.cc-mattress-hero-card,
.cc-carpet-hero-card,
.cc-move-hero-card,
.cc-monthly-hero-card,
.cc-home-cleaning-hero-card,
.cc-regular-cleaning-hero-card {
  position: relative;

  min-width: 0;

  padding: 30px;

  background: #ffffff;

  border: 1px solid rgba(255, 255, 255, 0.55);

  border-radius: 24px;

  color: var(--cc-text);

  box-shadow: 0 25px 65px rgba(5, 31, 40, 0.22);
}

/* =========================================================
   15. HERO CARD TOP
========================================================= */

.cc-service-hero-card-top,
.cc-deep-hero-card-top,
.cc-villa-hero-card-top,
.cc-apartment-hero-card-top,
.cc-sofa-hero-card-top,
.cc-mattress-hero-card-top,
.cc-carpet-hero-card-top,
.cc-move-hero-card-top,
.cc-monthly-hero-card-top,
.cc-home-cleaning-hero-card-top,
.cc-regular-cleaning-hero-card-top {
  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 15px;

  margin-bottom: 18px;
}

.cc-service-hero-card-label,
.cc-deep-hero-card-top span,
.cc-villa-hero-card-label,
.cc-apartment-hero-card-label,
.cc-sofa-hero-card-label,
.cc-mattress-hero-card-label,
.cc-carpet-hero-card-label,
.cc-move-hero-card-label,
.cc-monthly-hero-card-label,
.cc-home-cleaning-hero-card-label,
.cc-regular-cleaning-hero-card-label {
  color: var(--cc-green);

  font-size: 11px;

  font-weight: 900;

  letter-spacing: 1.2px;
}

/* =========================================================
   16. HERO CARD TITLE
========================================================= */

.cc-service-hero-card-title,
.cc-deep-hero-card-top strong,
.cc-villa-hero-card-title,
.cc-apartment-hero-card-title,
.cc-sofa-hero-card-title,
.cc-mattress-hero-card-title,
.cc-carpet-hero-card-title,
.cc-move-hero-card-title,
.cc-monthly-hero-card-title,
.cc-home-cleaning-hero-card-title,
.cc-regular-cleaning-hero-card-title {
  color: var(--cc-navy);

  font-size: 27px;

  line-height: 1.22;

  font-weight: 800;
}

/* =========================================================
   17. HERO CARD BODY
========================================================= */

.cc-service-hero-card-body,
.cc-deep-hero-card-body,
.cc-villa-hero-card-body,
.cc-apartment-hero-card-body,
.cc-sofa-hero-card-body,
.cc-mattress-hero-card-body,
.cc-carpet-hero-card-body,
.cc-move-hero-card-body,
.cc-monthly-hero-card-body,
.cc-home-cleaning-hero-card-body,
.cc-regular-cleaning-hero-card-body {
  display: flex;

  flex-direction: column;

  gap: 14px;
}

/* =========================================================
   18. HERO MINI FEATURES
========================================================= */

.cc-service-mini-feature,
.cc-deep-mini-feature,
.cc-villa-mini-feature,
.cc-apartment-mini-feature,
.cc-sofa-mini-feature,
.cc-mattress-mini-feature,
.cc-carpet-mini-feature,
.cc-move-mini-feature,
.cc-monthly-mini-feature,
.cc-home-cleaning-mini-feature,
.cc-regular-cleaning-mini-feature {
  display: flex;

  align-items: flex-start;

  gap: 12px;
}

.cc-service-mini-icon,
.cc-deep-mini-icon,
.cc-villa-mini-icon,
.cc-apartment-mini-icon,
.cc-sofa-mini-icon,
.cc-mattress-mini-icon,
.cc-carpet-mini-icon,
.cc-move-mini-icon,
.cc-monthly-mini-icon,
.cc-home-cleaning-mini-icon,
.cc-regular-cleaning-mini-icon {
  flex: 0 0 auto;

  width: 30px;
  height: 30px;

  display: flex;

  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: var(--cc-green-soft);

  color: var(--cc-green);

  font-size: 13px;

  font-weight: 900;
}

.cc-service-mini-feature strong,
.cc-deep-mini-feature strong,
.cc-villa-mini-feature strong,
.cc-apartment-mini-feature strong,
.cc-sofa-mini-feature strong,
.cc-mattress-mini-feature strong,
.cc-carpet-mini-feature strong,
.cc-move-mini-feature strong,
.cc-monthly-mini-feature strong,
.cc-home-cleaning-mini-feature strong,
.cc-regular-cleaning-mini-feature strong {
  display: block;

  color: var(--cc-navy);

  font-size: 14px;

  line-height: 1.3;
}

.cc-service-mini-feature small,
.cc-deep-mini-feature small,
.cc-villa-mini-feature small,
.cc-apartment-mini-feature small,
.cc-sofa-mini-feature small,
.cc-mattress-mini-feature small,
.cc-carpet-mini-feature small,
.cc-move-mini-feature small,
.cc-monthly-mini-feature small,
.cc-home-cleaning-mini-feature small,
.cc-regular-cleaning-mini-feature small {
  display: block;

  margin-top: 3px;

  color: var(--cc-muted);

  font-size: 12px;

  line-height: 1.4;
}

/* =========================================================
   19. COMMON SECTIONS
========================================================= */

.cc-service-section,
.cc-deep-intro,
.cc-deep-pricing-section,
.cc-deep-tasks-section,
.cc-deep-addon-section,
.cc-deep-note-section,
.cc-villa-section,
.cc-apartment-section,
.cc-sofa-section,
.cc-mattress-section,
.cc-carpet-section,
.cc-move-section,
.cc-monthly-section,
.cc-home-cleaning-section,
.cc-regular-cleaning-section {
  width: 100%;

  padding: 78px 0;

  background: #ffffff;
}

/* =========================================================
   20. SOFT SECTIONS
========================================================= */

.cc-service-soft-section,
.cc-deep-apartment-section,
.cc-villa-apartment-section,
.cc-apartment-pricing-section,
.cc-sofa-pricing-section,
.cc-mattress-pricing-section,
.cc-carpet-pricing-section,
.cc-move-pricing-section,
.cc-monthly-pricing-section,
.cc-home-cleaning-pricing-section,
.cc-regular-cleaning-pricing-section {
  background: #f7faf9;
}

/* =========================================================
   21. SECTION HEADING
========================================================= */

.cc-service-section-heading,
.cc-deep-section-heading,
.cc-villa-section-heading,
.cc-apartment-section-heading,
.cc-sofa-section-heading,
.cc-mattress-section-heading,
.cc-carpet-section-heading,
.cc-move-section-heading,
.cc-monthly-section-heading,
.cc-home-cleaning-section-heading,
.cc-regular-cleaning-section-heading {
  max-width: 780px;

  margin: 0 auto 45px;

  text-align: center;
}

.cc-service-section-label,
.cc-deep-section-label,
.cc-villa-section-kicker,
.cc-apartment-section-label,
.cc-sofa-section-label,
.cc-mattress-section-label,
.cc-carpet-section-label,
.cc-move-section-label,
.cc-monthly-section-label,
.cc-home-cleaning-section-label,
.cc-regular-cleaning-section-label {
  display: block;

  margin-bottom: 11px;

  color: var(--cc-green);

  font-size: 11px;

  font-weight: 900;

  letter-spacing: 1.25px;

  line-height: 1.3;

  text-align: center;
}

.cc-service-section-heading h2,
.cc-deep-section-heading h2,
.cc-villa-section-heading h2,
.cc-apartment-section-heading h2,
.cc-sofa-section-heading h2,
.cc-mattress-section-heading h2,
.cc-carpet-section-heading h2,
.cc-move-section-heading h2,
.cc-monthly-section-heading h2,
.cc-home-cleaning-section-heading h2,
.cc-regular-cleaning-section-heading h2 {
  margin: 0 0 14px;

  color: var(--cc-navy);

  font-size: clamp(30px, 4vw, 44px);

  line-height: 1.12;

  font-weight: 800;

  letter-spacing: -0.7px;

  text-align: center;
}

.cc-service-section-heading p,
.cc-deep-section-heading p,
.cc-villa-section-heading p,
.cc-apartment-section-heading p,
.cc-sofa-section-heading p,
.cc-mattress-section-heading p,
.cc-carpet-section-heading p,
.cc-move-section-heading p,
.cc-monthly-section-heading p,
.cc-home-cleaning-section-heading p,
.cc-regular-cleaning-section-heading p {
  max-width: 690px;

  margin: 0 auto;

  color: var(--cc-muted);

  font-size: 16px;

  line-height: 1.75;

  text-align: center;
}

/* =========================================================
   22. FEATURE / BENEFIT GRID
========================================================= */

.cc-service-feature-grid,
.cc-deep-benefit-grid,
.cc-villa-feature-grid,
.cc-apartment-benefit-grid,
.cc-sofa-benefit-grid,
.cc-mattress-benefit-grid,
.cc-carpet-benefit-grid,
.cc-move-benefit-grid,
.cc-monthly-benefit-grid,
.cc-home-cleaning-benefit-grid,
.cc-regular-cleaning-benefit-grid {
  display: grid;

  grid-template-columns: repeat(4, minmax(0, 1fr));

  gap: 18px;
}

/* Three-column compatibility */

.cc-service-three-grid,
.cc-villa-feature-grid.three-columns,
.cc-apartment-feature-grid {
  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 20px;
}

/* =========================================================
   23. FEATURE CARD
========================================================= */

.cc-service-feature-card,
.cc-deep-benefit-card,
.cc-villa-feature-card,
.cc-apartment-benefit-card,
.cc-sofa-benefit-card,
.cc-mattress-benefit-card,
.cc-carpet-benefit-card,
.cc-move-benefit-card,
.cc-monthly-benefit-card,
.cc-home-cleaning-benefit-card,
.cc-regular-cleaning-benefit-card {
  min-width: 0;

  padding: 27px 22px;

  background: #ffffff;

  border: 1px solid var(--cc-border);

  border-radius: var(--cc-radius);

  text-align: center;

  box-shadow: 0 8px 25px rgba(18, 59, 74, 0.04);
}

.cc-service-feature-icon,
.cc-deep-benefit-icon,
.cc-villa-feature-icon,
.cc-apartment-benefit-icon {
  width: 48px;
  height: 48px;

  margin: 0 auto 16px;

  display: flex;

  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: var(--cc-green-soft);

  color: var(--cc-green);

  font-size: 17px;

  font-weight: 900;
}

.cc-service-feature-card h3,
.cc-deep-benefit-card h3,
.cc-villa-feature-card h3,
.cc-apartment-benefit-card h3,
.cc-sofa-benefit-card h3,
.cc-mattress-benefit-card h3,
.cc-carpet-benefit-card h3,
.cc-move-benefit-card h3,
.cc-monthly-benefit-card h3,
.cc-home-cleaning-benefit-card h3,
.cc-regular-cleaning-benefit-card h3 {
  margin: 0 0 9px;

  color: var(--cc-navy);

  font-size: 18px;

  line-height: 1.3;

  font-weight: 800;

  text-align: center;
}

.cc-service-feature-card p,
.cc-deep-benefit-card p,
.cc-villa-feature-card p,
.cc-apartment-benefit-card p,
.cc-sofa-benefit-card p,
.cc-mattress-benefit-card p,
.cc-carpet-benefit-card p,
.cc-move-benefit-card p,
.cc-monthly-benefit-card p,
.cc-home-cleaning-benefit-card p,
.cc-regular-cleaning-benefit-card p {
  margin: 0;

  color: var(--cc-muted);

  font-size: 14px;

  line-height: 1.65;

  text-align: center;
}

/* =========================================================
   24. PRICE GRID
========================================================= */

.cc-service-price-grid,
.cc-deep-service-grid,
.cc-villa-price-grid,
.cc-apartment-price-grid,
.cc-sofa-price-grid,
.cc-mattress-price-grid,
.cc-carpet-price-grid,
.cc-move-price-grid,
.cc-monthly-price-grid,
.cc-home-cleaning-price-grid,
.cc-regular-cleaning-price-grid {
  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 22px;

  align-items: stretch;
}

/* =========================================================
   25. SERVICE CARD
========================================================= */

.cc-service-card,
.cc-deep-service-card,
.cc-villa-service-card,
.cc-apartment-service-card,
.cc-sofa-service-card,
.cc-mattress-service-card,
.cc-carpet-service-card,
.cc-move-service-card,
.cc-monthly-service-card,
.cc-home-cleaning-service-card,
.cc-regular-cleaning-service-card {
  display: flex;

  flex-direction: column;

  min-width: 0;

  padding: 25px;

  background: #ffffff;

  border: 1px solid var(--cc-border);

  border-radius: var(--cc-radius);

  box-shadow: var(--cc-card-shadow);

  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    border-color 0.2s ease;
}

.cc-service-card:hover,
.cc-deep-service-card:hover,
.cc-villa-service-card:hover,
.cc-apartment-service-card:hover,
.cc-sofa-service-card:hover,
.cc-mattress-service-card:hover,
.cc-carpet-service-card:hover,
.cc-move-service-card:hover,
.cc-monthly-service-card:hover,
.cc-home-cleaning-service-card:hover,
.cc-regular-cleaning-service-card:hover {
  transform: translateY(-4px);

  border-color: #c8ddd7;

  box-shadow: 0 18px 42px rgba(18, 59, 74, 0.1);
}

/* =========================================================
   26. SERVICE CARD HEADER
========================================================= */

.cc-service-card-top,
.cc-deep-service-card-header,
.cc-villa-service-card-header,
.cc-apartment-service-card-header,
.cc-sofa-service-card-header,
.cc-mattress-service-card-header,
.cc-carpet-service-card-header,
.cc-move-service-card-header,
.cc-monthly-service-card-header,
.cc-home-cleaning-service-card-header,
.cc-regular-cleaning-service-card-header {
  margin-bottom: 20px;
}

.cc-service-kicker,
.cc-deep-service-card-kicker,
.cc-villa-service-card-kicker,
.cc-apartment-service-card-kicker,
.cc-sofa-service-card-kicker,
.cc-mattress-service-card-kicker,
.cc-carpet-service-card-kicker,
.cc-move-service-card-kicker,
.cc-monthly-service-card-kicker,
.cc-home-cleaning-service-card-kicker,
.cc-regular-cleaning-service-card-kicker {
  display: block;

  margin-bottom: 7px;

  color: var(--cc-green);

  font-size: 9px;

  line-height: 1.3;

  font-weight: 900;

  letter-spacing: 1px;
}

.cc-service-card h3,
.cc-deep-service-card h3,
.cc-villa-service-card h3,
.cc-apartment-service-card h3,
.cc-sofa-service-card h3,
.cc-mattress-service-card h3,
.cc-carpet-service-card h3,
.cc-move-service-card h3,
.cc-monthly-service-card h3,
.cc-home-cleaning-service-card h3,
.cc-regular-cleaning-service-card h3 {
  margin: 0;

  color: var(--cc-navy);

  font-size: 21px;

  line-height: 1.25;

  font-weight: 800;

  text-align: left;

  overflow-wrap: anywhere;
}

/* =========================================================
   27. PRICE AREA
========================================================= */

.cc-service-price-area,
.cc-deep-service-price-area,
.cc-villa-price-options,
.cc-apartment-price-options,
.cc-sofa-price-options,
.cc-mattress-price-options,
.cc-carpet-price-options,
.cc-move-price-options,
.cc-monthly-price-options,
.cc-home-cleaning-price-options,
.cc-regular-cleaning-price-options {
  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: 10px;

  margin-bottom: 20px;
}

/* Single price */

.cc-service-price,
.cc-sofa-price,
.cc-mattress-price,
.cc-carpet-price,
.cc-move-price {
  padding: 17px 14px;

  border-radius: 12px;

  background: var(--cc-soft-bg);

  border: 1px solid var(--cc-border-soft);

  text-align: center;
}

/* Price row */

.cc-service-price-row {
  padding: 15px 13px;

  border-radius: 12px;

  background: var(--cc-soft-bg);

  border: 1px solid var(--cc-border-soft);

  text-align: center;
}

.cc-service-price-row span,
.cc-villa-price-option-label,
.cc-service-price-label {
  display: block;

  margin-bottom: 7px;

  color: var(--cc-muted);

  font-size: 11px;

  line-height: 1.3;
}

.cc-service-price-row strong,
.cc-villa-price-option strong,
.cc-service-price strong,
.cc-sofa-price strong,
.cc-mattress-price strong,
.cc-carpet-price strong,
.cc-move-price strong {
  display: block;

  color: var(--cc-green);

  font-size: 22px;

  line-height: 1.15;

  font-weight: 900;
}

/* =========================================================
   28. META
========================================================= */

.cc-service-meta,
.cc-deep-service-meta,
.cc-villa-service-meta,
.cc-apartment-service-meta,
.cc-sofa-service-meta,
.cc-mattress-service-meta,
.cc-carpet-service-meta,
.cc-move-service-meta,
.cc-monthly-service-meta,
.cc-home-cleaning-service-meta,
.cc-regular-cleaning-service-meta {
  display: flex;

  flex-wrap: wrap;

  align-items: center;

  justify-content: center;

  gap: 8px 18px;

  min-height: 30px;

  margin: 0 0 22px;

  color: var(--cc-muted);

  font-size: 12px;

  line-height: 1.5;

  text-align: center;
}

.cc-service-meta span,
.cc-deep-service-meta span,
.cc-villa-service-meta span,
.cc-apartment-service-meta span,
.cc-sofa-service-meta span,
.cc-mattress-service-meta span,
.cc-carpet-service-meta span,
.cc-move-service-meta span,
.cc-monthly-service-meta span,
.cc-home-cleaning-service-meta span,
.cc-regular-cleaning-service-meta span {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  white-space: nowrap;
}

/* =========================================================
   29. CARD BUTTON
========================================================= */

.cc-service-card-button,
.cc-deep-service-card-button,
.cc-villa-service-card-button,
.cc-apartment-service-card-button,
.cc-sofa-service-card-button,
.cc-mattress-service-card-button,
.cc-carpet-service-card-button,
.cc-move-service-card-button,
.cc-monthly-service-card-button,
.cc-home-cleaning-service-card-button,
.cc-regular-cleaning-service-card-button {
  display: flex !important;

  align-items: center;

  justify-content: center;

  width: 100%;

  min-height: 48px;

  margin-top: auto;

  padding: 13px 16px;

  border: 0;

  border-radius: 9px;

  background: var(--cc-navy) !important;

  color: #ffffff !important;

  text-decoration: none !important;

  font-family: inherit;

  font-size: 13px;

  line-height: 1.2;

  font-weight: 800;

  text-align: center;

  visibility: visible !important;

  opacity: 1 !important;

  position: relative;

  z-index: 5;

  overflow: visible;

  cursor: pointer;

  transition:
    background 0.2s ease,
    transform 0.2s ease;
}

.cc-service-card-button:hover,
.cc-deep-service-card-button:hover,
.cc-villa-service-card-button:hover,
.cc-apartment-service-card-button:hover,
.cc-sofa-service-card-button:hover,
.cc-mattress-service-card-button:hover,
.cc-carpet-service-card-button:hover,
.cc-move-service-card-button:hover,
.cc-monthly-service-card-button:hover,
.cc-home-cleaning-service-card-button:hover,
.cc-regular-cleaning-service-card-button:hover {
  background: var(--cc-green) !important;

  color: #ffffff !important;

  transform: translateY(-1px);
}

.cc-service-card-button *,
.cc-deep-service-card-button *,
.cc-villa-service-card-button *,
.cc-apartment-service-card-button *,
.cc-sofa-service-card-button *,
.cc-mattress-service-card-button *,
.cc-carpet-service-card-button *,
.cc-move-service-card-button *,
.cc-monthly-service-card-button *,
.cc-home-cleaning-service-card-button *,
.cc-regular-cleaning-service-card-button * {
  color: #ffffff !important;

  visibility: visible !important;

  opacity: 1 !important;
}

/* =========================================================
   30. TASK GRID
========================================================= */

.cc-service-task-grid,
.cc-deep-task-grid,
.cc-villa-task-grid,
.cc-apartment-task-grid,
.cc-sofa-task-grid,
.cc-mattress-task-grid,
.cc-carpet-task-grid,
.cc-move-task-grid,
.cc-monthly-task-grid,
.cc-home-cleaning-task-grid,
.cc-regular-cleaning-task-grid {
  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: 20px;
}

/* =========================================================
   31. TASK CARD
========================================================= */

.cc-service-task-card,
.cc-deep-task-card,
.cc-villa-task-card,
.cc-apartment-task-card,
.cc-sofa-task-card,
.cc-mattress-task-card,
.cc-carpet-task-card,
.cc-move-task-card,
.cc-monthly-task-card,
.cc-home-cleaning-task-card,
.cc-regular-cleaning-task-card {
  min-width: 0;

  padding: 26px;

  background: #ffffff;

  border: 1px solid var(--cc-border);

  border-radius: var(--cc-radius);

  box-shadow: 0 8px 25px rgba(18, 59, 74, 0.035);
}

.cc-service-task-card h3,
.cc-deep-task-card h3,
.cc-villa-task-card h3,
.cc-apartment-task-card h3,
.cc-sofa-task-card h3,
.cc-mattress-task-card h3,
.cc-carpet-task-card h3,
.cc-move-task-card h3,
.cc-monthly-task-card h3,
.cc-home-cleaning-task-card h3,
.cc-regular-cleaning-task-card h3 {
  margin: 0 0 19px;

  color: var(--cc-navy);

  font-size: 19px;

  line-height: 1.3;

  font-weight: 800;

  text-align: left;
}

.cc-service-task-card ul,
.cc-deep-task-card ul,
.cc-villa-task-card ul,
.cc-apartment-task-card ul,
.cc-sofa-task-card ul,
.cc-mattress-task-card ul,
.cc-carpet-task-card ul,
.cc-move-task-card ul,
.cc-monthly-task-card ul,
.cc-home-cleaning-task-card ul,
.cc-regular-cleaning-task-card ul {
  list-style: none;

  margin: 0;

  padding: 0;
}

.cc-service-task-card li,
.cc-deep-task-card li,
.cc-villa-task-card li,
.cc-apartment-task-card li,
.cc-sofa-task-card li,
.cc-mattress-task-card li,
.cc-carpet-task-card li,
.cc-move-task-card li,
.cc-monthly-task-card li,
.cc-home-cleaning-task-card li,
.cc-regular-cleaning-task-card li {
  position: relative;

  display: flex;

  align-items: flex-start;

  gap: 9px;

  padding: 7px 0;

  color: var(--cc-muted);

  font-size: 13px;

  line-height: 1.55;

  text-align: left;
}

.cc-service-task-card li span,
.cc-deep-task-card li span,
.cc-villa-task-card li span,
.cc-apartment-task-card li span,
.cc-sofa-task-card li span,
.cc-mattress-task-card li span,
.cc-carpet-task-card li span,
.cc-move-task-card li span,
.cc-monthly-task-card li span,
.cc-home-cleaning-task-card li span,
.cc-regular-cleaning-task-card li span {
  flex: 0 0 auto;

  color: var(--cc-green);

  font-weight: 900;
}

/* =========================================================
   32. BONUS CARD
========================================================= */

.cc-service-bonus,
.cc-deep-bonus,
.cc-villa-bonus-card,
.cc-apartment-bonus,
.cc-sofa-bonus,
.cc-mattress-bonus,
.cc-carpet-bonus,
.cc-move-bonus,
.cc-monthly-bonus,
.cc-home-cleaning-bonus,
.cc-regular-cleaning-bonus {
  display: flex;

  align-items: center;

  gap: 20px;

  margin-top: 28px;

  padding: 25px 28px;

  background: linear-gradient(135deg, #eef8f4, #f7fbf9);

  border: 1px solid #d4e9e1;

  border-radius: var(--cc-radius);
}

.cc-service-bonus-icon,
.cc-deep-bonus-icon,
.cc-villa-bonus-icon {
  flex: 0 0 auto;

  width: 50px;
  height: 50px;

  display: flex;

  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: #ffffff;

  color: var(--cc-green);

  font-size: 19px;

  font-weight: 900;
}

.cc-service-bonus strong,
.cc-deep-bonus strong,
.cc-villa-bonus-content h2 {
  color: var(--cc-navy);

  font-size: 19px;

  line-height: 1.3;

  font-weight: 800;
}

.cc-service-bonus p,
.cc-deep-bonus p,
.cc-villa-bonus-content p {
  margin: 5px 0 0;

  color: var(--cc-muted);

  font-size: 14px;

  line-height: 1.6;
}

/* =========================================================
   33. ADD-ON GRID
========================================================= */

.cc-service-addon-grid,
.cc-deep-addon-grid,
.cc-villa-addon-grid,
.cc-apartment-addon-grid,
.cc-sofa-addon-grid,
.cc-mattress-addon-grid,
.cc-carpet-addon-grid,
.cc-move-addon-grid,
.cc-monthly-addon-grid {
  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 18px;
}

.cc-service-addon-card,
.cc-deep-addon-card,
.cc-villa-addon-card,
.cc-apartment-addon-card,
.cc-sofa-addon-card,
.cc-mattress-addon-card,
.cc-carpet-addon-card,
.cc-move-addon-card,
.cc-monthly-addon-card {
  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 15px;

  padding: 20px;

  background: #ffffff;

  border: 1px solid var(--cc-border);

  border-radius: 14px;
}

.cc-service-addon-card h3,
.cc-deep-addon-card h3,
.cc-villa-addon-card h3 {
  margin: 0;

  color: var(--cc-navy);

  font-size: 15px;

  line-height: 1.3;

  font-weight: 800;
}

.cc-service-addon-card span,
.cc-deep-addon-card span,
.cc-villa-addon-card span {
  display: block;

  margin-top: 4px;

  color: var(--cc-muted);

  font-size: 11px;
}

.cc-service-addon-card strong,
.cc-deep-addon-card strong,
.cc-villa-addon-card strong {
  flex: 0 0 auto;

  color: var(--cc-green);

  font-size: 18px;

  font-weight: 900;
}

/* =========================================================
   34. BOOKING SECTION
========================================================= */

.cc-service-booking,
.cc-deep-booking-section,
.cc-villa-booking-section,
.cc-apartment-booking-section,
.cc-sofa-booking-section,
.cc-mattress-booking-section,
.cc-carpet-booking-section,
.cc-move-booking-section,
.cc-monthly-booking-section,
.cc-home-cleaning-booking-section,
.cc-regular-cleaning-booking-section {
  padding: 82px 0;

  background: linear-gradient(135deg, #123b4a, #1a5b5d);
}

.cc-service-booking-grid,
.cc-deep-booking-grid,
.cc-villa-booking-grid,
.cc-apartment-booking-grid,
.cc-sofa-booking-grid,
.cc-mattress-booking-grid,
.cc-carpet-booking-grid,
.cc-move-booking-grid,
.cc-monthly-booking-grid,
.cc-home-cleaning-booking-grid,
.cc-regular-cleaning-booking-grid {
  display: grid;

  grid-template-columns:
    minmax(0, 0.9fr)
    minmax(420px, 1.1fr);

  gap: 60px;

  align-items: center;
}

/* =========================================================
   35. BOOKING CONTENT
========================================================= */

.cc-service-booking-content,
.cc-deep-booking-content,
.cc-villa-booking-content,
.cc-apartment-booking-content,
.cc-sofa-booking-content,
.cc-mattress-booking-content,
.cc-carpet-booking-content,
.cc-move-booking-content,
.cc-monthly-booking-content,
.cc-home-cleaning-booking-content,
.cc-regular-cleaning-booking-content {
  min-width: 0;
}

.cc-service-booking-content h2,
.cc-deep-booking-content h2,
.cc-villa-booking-content h2,
.cc-apartment-booking-content h2,
.cc-sofa-booking-content h2,
.cc-mattress-booking-content h2,
.cc-carpet-booking-content h2,
.cc-move-booking-content h2,
.cc-monthly-booking-content h2,
.cc-home-cleaning-booking-content h2,
.cc-regular-cleaning-booking-content h2 {
  margin: 0 0 15px;

  color: #ffffff;

  font-size: clamp(30px, 4vw, 46px);

  line-height: 1.12;

  font-weight: 800;

  text-align: left;
}

.cc-service-booking-content > p,
.cc-deep-booking-content > p,
.cc-villa-booking-content > p,
.cc-apartment-booking-content > p,
.cc-sofa-booking-content > p,
.cc-mattress-booking-content > p,
.cc-carpet-booking-content > p,
.cc-move-booking-content > p,
.cc-monthly-booking-content > p,
.cc-home-cleaning-booking-content > p,
.cc-regular-cleaning-booking-content > p {
  margin: 0;

  color: rgba(255, 255, 255, 0.8);

  font-size: 16px;

  line-height: 1.7;
}

/* =========================================================
   36. BOOKING POINTS
========================================================= */

.cc-service-booking-points,
.cc-deep-booking-points,
.cc-villa-booking-points,
.cc-apartment-booking-points,
.cc-sofa-booking-points,
.cc-mattress-booking-points,
.cc-carpet-booking-points,
.cc-move-booking-points,
.cc-monthly-booking-points,
.cc-home-cleaning-booking-points,
.cc-regular-cleaning-booking-points {
  display: grid;

  gap: 12px;

  margin-top: 28px;
}

.cc-service-booking-points > div,
.cc-deep-booking-points > div,
.cc-villa-booking-points > div,
.cc-apartment-booking-points > div,
.cc-sofa-booking-points > div,
.cc-mattress-booking-points > div,
.cc-carpet-booking-points > div,
.cc-move-booking-points > div,
.cc-monthly-booking-points > div,
.cc-home-cleaning-booking-points > div,
.cc-regular-cleaning-booking-points > div {
  display: flex;

  align-items: flex-start;

  gap: 10px;

  color: rgba(255, 255, 255, 0.86);

  font-size: 14px;

  line-height: 1.5;
}

.cc-service-booking-points span,
.cc-deep-booking-points span,
.cc-villa-booking-points span,
.cc-apartment-booking-points span,
.cc-sofa-booking-points span,
.cc-mattress-booking-points span,
.cc-carpet-booking-points span,
.cc-move-booking-points span,
.cc-monthly-booking-points span,
.cc-home-cleaning-booking-points span,
.cc-regular-cleaning-booking-points span {
  color: #8ed7b9;

  font-weight: 900;
}

/* =========================================================
   37. BOOKING CARD
========================================================= */

.cc-service-booking-card,
.cc-deep-booking-card,
.cc-villa-booking-card,
.cc-apartment-booking-card,
.cc-sofa-booking-card,
.cc-mattress-booking-card,
.cc-carpet-booking-card,
.cc-move-booking-card,
.cc-monthly-booking-card,
.cc-home-cleaning-booking-card,
.cc-regular-cleaning-booking-card {
  min-width: 0;

  padding: 30px;

  background: #ffffff;

  border-radius: 20px;

  box-shadow: 0 25px 65px rgba(5, 31, 40, 0.2);
}

/* =========================================================
   38. FORM
========================================================= */

.cc-service-booking-card form,
.cc-deep-booking-card form,
.cc-villa-booking-card form,
.cc-apartment-booking-card form,
.cc-sofa-booking-card form,
.cc-mattress-booking-card form,
.cc-carpet-booking-card form,
.cc-move-booking-card form,
.cc-monthly-booking-card form,
.cc-home-cleaning-booking-card form,
.cc-regular-cleaning-booking-card form {
  width: 100%;
}

.cc-service-form-row,
.cc-deep-form-row,
.cc-villa-form-row,
.cc-apartment-form-row,
.cc-sofa-form-row,
.cc-mattress-form-row,
.cc-carpet-form-row,
.cc-move-form-row,
.cc-monthly-form-row,
.cc-home-cleaning-form-row,
.cc-regular-cleaning-form-row {
  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: 15px;
}

.cc-service-form-group,
.cc-deep-form-group,
.cc-villa-form-group,
.cc-apartment-form-group,
.cc-sofa-form-group,
.cc-mattress-form-group,
.cc-carpet-form-group,
.cc-move-form-group,
.cc-monthly-form-group,
.cc-home-cleaning-form-group,
.cc-regular-cleaning-form-group {
  margin-bottom: 16px;
}

.cc-service-form-group label,
.cc-deep-form-group label,
.cc-villa-form-group label,
.cc-apartment-form-group label,
.cc-sofa-form-group label,
.cc-mattress-form-group label,
.cc-carpet-form-group label,
.cc-move-form-group label,
.cc-monthly-form-group label,
.cc-home-cleaning-form-group label,
.cc-regular-cleaning-form-group label {
  display: block;

  margin-bottom: 7px;

  color: var(--cc-navy);

  font-size: 12px;

  line-height: 1.3;

  font-weight: 800;
}

.cc-service-form-group input,
.cc-service-form-group select,
.cc-service-form-group textarea,
.cc-deep-form-group input,
.cc-deep-form-group select,
.cc-deep-form-group textarea,
.cc-villa-form-group input,
.cc-villa-form-group select,
.cc-villa-form-group textarea,
.cc-apartment-form-group input,
.cc-apartment-form-group select,
.cc-apartment-form-group textarea,
.cc-sofa-form-group input,
.cc-sofa-form-group select,
.cc-sofa-form-group textarea,
.cc-mattress-form-group input,
.cc-mattress-form-group select,
.cc-mattress-form-group textarea,
.cc-carpet-form-group input,
.cc-carpet-form-group select,
.cc-carpet-form-group textarea,
.cc-move-form-group input,
.cc-move-form-group select,
.cc-move-form-group textarea,
.cc-monthly-form-group input,
.cc-monthly-form-group select,
.cc-monthly-form-group textarea,
.cc-home-cleaning-form-group input,
.cc-home-cleaning-form-group select,
.cc-home-cleaning-form-group textarea,
.cc-regular-cleaning-form-group input,
.cc-regular-cleaning-form-group select,
.cc-regular-cleaning-form-group textarea {
  display: block;

  width: 100%;

  min-height: 48px;

  padding: 12px 13px;

  border: 1px solid var(--cc-border);

  border-radius: 9px;

  background: #ffffff;

  color: var(--cc-text);

  font-family: inherit;

  font-size: 14px;

  line-height: 1.4;

  outline: none;

  box-shadow: none;

  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}

.cc-service-form-group textarea,
.cc-deep-form-group textarea,
.cc-villa-form-group textarea,
.cc-apartment-form-group textarea,
.cc-sofa-form-group textarea,
.cc-mattress-form-group textarea,
.cc-carpet-form-group textarea,
.cc-move-form-group textarea,
.cc-monthly-form-group textarea,
.cc-home-cleaning-form-group textarea,
.cc-regular-cleaning-form-group textarea {
  min-height: 105px;

  resize: vertical;
}

.cc-service-form-group input:focus,
.cc-service-form-group select:focus,
.cc-service-form-group textarea:focus,
.cc-deep-form-group input:focus,
.cc-deep-form-group select:focus,
.cc-deep-form-group textarea:focus,
.cc-villa-form-group input:focus,
.cc-villa-form-group select:focus,
.cc-villa-form-group textarea:focus,
.cc-apartment-form-group input:focus,
.cc-apartment-form-group select:focus,
.cc-apartment-form-group textarea:focus,
.cc-sofa-form-group input:focus,
.cc-sofa-form-group select:focus,
.cc-sofa-form-group textarea:focus,
.cc-mattress-form-group input:focus,
.cc-mattress-form-group select:focus,
.cc-mattress-form-group textarea:focus,
.cc-carpet-form-group input:focus,
.cc-carpet-form-group select:focus,
.cc-carpet-form-group textarea:focus,
.cc-move-form-group input:focus,
.cc-move-form-group select:focus,
.cc-move-form-group textarea:focus,
.cc-monthly-form-group input:focus,
.cc-monthly-form-group select:focus,
.cc-monthly-form-group textarea:focus,
.cc-home-cleaning-form-group input:focus,
.cc-home-cleaning-form-group select:focus,
.cc-home-cleaning-form-group textarea:focus,
.cc-regular-cleaning-form-group input:focus,
.cc-regular-cleaning-form-group select:focus,
.cc-regular-cleaning-form-group textarea:focus {
  border-color: var(--cc-green);

  box-shadow: 0 0 0 3px rgba(46, 139, 112, 0.1);
}

/* =========================================================
   39. SUBMIT BUTTON
========================================================= */

.cc-service-submit,
.cc-deep-submit,
.cc-villa-submit,
.cc-apartment-submit,
.cc-sofa-submit,
.cc-mattress-submit,
.cc-carpet-submit,
.cc-move-submit,
.cc-monthly-submit,
.cc-home-cleaning-submit,
.cc-regular-cleaning-submit {
  display: flex;

  align-items: center;

  justify-content: center;

  width: 100%;

  min-height: 52px;

  padding: 13px 18px;

  border: 0;

  border-radius: 9px;

  background: var(--cc-green) !important;

  color: #ffffff !important;

  font-family: inherit;

  font-size: 14px;

  line-height: 1.2;

  font-weight: 900;

  cursor: pointer;

  text-align: center;

  box-shadow: none;

  transition:
    background 0.2s ease,
    transform 0.2s ease;
}

.cc-service-submit:hover,
.cc-deep-submit:hover,
.cc-villa-submit:hover,
.cc-apartment-submit:hover,
.cc-sofa-submit:hover,
.cc-mattress-submit:hover,
.cc-carpet-submit:hover,
.cc-move-submit:hover,
.cc-monthly-submit:hover,
.cc-home-cleaning-submit:hover,
.cc-regular-cleaning-submit:hover {
  background: var(--cc-green-dark) !important;

  color: #ffffff !important;

  transform: translateY(-1px);
}

/* =========================================================
   40. FORM NOTE
========================================================= */

.cc-service-form-note,
.cc-deep-form-note,
.cc-villa-form-note,
.cc-apartment-form-note,
.cc-sofa-form-note,
.cc-mattress-form-note,
.cc-carpet-form-note,
.cc-move-form-note,
.cc-monthly-form-note,
.cc-home-cleaning-form-note,
.cc-regular-cleaning-form-note {
  margin: 12px 0 0;

  color: var(--cc-muted);

  font-size: 11px;

  line-height: 1.5;

  text-align: center;
}

/* =========================================================
   41. NOTE / INFO BOX
========================================================= */

.cc-service-note,
.cc-deep-note-box,
.cc-villa-note-box,
.cc-apartment-note-box,
.cc-sofa-note-box,
.cc-mattress-note-box,
.cc-carpet-note-box,
.cc-move-note-box,
.cc-monthly-note-box,
.cc-home-cleaning-note-box,
.cc-regular-cleaning-note-box {
  display: flex;

  align-items: flex-start;

  gap: 17px;

  padding: 25px 28px;

  background: #f7faf9;

  border: 1px solid var(--cc-border);

  border-radius: var(--cc-radius);
}

.cc-service-note-icon,
.cc-deep-note-icon,
.cc-villa-note-icon,
.cc-apartment-note-icon,
.cc-sofa-note-icon,
.cc-mattress-note-icon,
.cc-carpet-note-icon,
.cc-move-note-icon,
.cc-monthly-note-icon,
.cc-home-cleaning-note-icon,
.cc-regular-cleaning-note-icon {
  flex: 0 0 auto;

  width: 40px;
  height: 40px;

  display: flex;

  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: var(--cc-green-soft);

  color: var(--cc-green);

  font-size: 15px;

  font-weight: 900;
}

.cc-service-note h3,
.cc-deep-note-box h3,
.cc-villa-note-box h3,
.cc-apartment-note-box h3,
.cc-sofa-note-box h3,
.cc-mattress-note-box h3,
.cc-carpet-note-box h3,
.cc-move-note-box h3,
.cc-monthly-note-box h3,
.cc-home-cleaning-note-box h3,
.cc-regular-cleaning-note-box h3 {
  margin: 0 0 7px;

  color: var(--cc-navy);

  font-size: 17px;

  line-height: 1.3;

  font-weight: 800;
}

.cc-service-note p,
.cc-deep-note-box p,
.cc-villa-note-box p,
.cc-apartment-note-box p,
.cc-sofa-note-box p,
.cc-mattress-note-box p,
.cc-carpet-note-box p,
.cc-move-note-box p,
.cc-monthly-note-box p,
.cc-home-cleaning-note-box p,
.cc-regular-cleaning-note-box p {
  margin: 0;

  color: var(--cc-muted);

  font-size: 13px;

  line-height: 1.65;
}

/* =========================================================
   42. FINAL CTA
========================================================= */

.cc-service-final-cta,
.cc-deep-final-cta,
.cc-villa-final-cta,
.cc-apartment-final-cta,
.cc-sofa-final-cta,
.cc-mattress-final-cta,
.cc-carpet-final-cta,
.cc-move-final-cta,
.cc-monthly-final-cta,
.cc-home-cleaning-final-cta,
.cc-regular-cleaning-final-cta {
  padding: 82px 0;

  background: linear-gradient(135deg, #123b4a, #1a5b5d);
}

.cc-service-final-cta-inner,
.cc-deep-final-cta-inner,
.cc-villa-final-cta-inner,
.cc-apartment-final-cta-inner,
.cc-sofa-final-cta-inner,
.cc-mattress-final-cta-inner,
.cc-carpet-final-cta-inner,
.cc-move-final-cta-inner,
.cc-monthly-final-cta-inner,
.cc-home-cleaning-final-cta-inner,
.cc-regular-cleaning-final-cta-inner {
  max-width: 760px;

  margin: 0 auto;

  text-align: center;
}

.cc-service-final-cta h2,
.cc-deep-final-cta h2,
.cc-villa-final-cta h2,
.cc-apartment-final-cta h2,
.cc-sofa-final-cta h2,
.cc-mattress-final-cta h2,
.cc-carpet-final-cta h2,
.cc-move-final-cta h2,
.cc-monthly-final-cta h2,
.cc-home-cleaning-final-cta h2,
.cc-regular-cleaning-final-cta h2 {
  margin: 0 0 15px;

  color: #ffffff;

  font-size: clamp(30px, 4vw, 46px);

  line-height: 1.12;

  font-weight: 800;

  letter-spacing: -0.7px;

  text-align: center;
}

.cc-service-final-cta p,
.cc-deep-final-cta p,
.cc-villa-final-cta p,
.cc-apartment-final-cta p,
.cc-sofa-final-cta p,
.cc-mattress-final-cta p,
.cc-carpet-final-cta p,
.cc-move-final-cta p,
.cc-monthly-final-cta p,
.cc-home-cleaning-final-cta p,
.cc-regular-cleaning-final-cta p {
  max-width: 650px;

  margin: 0 auto 27px;

  color: rgba(255, 255, 255, 0.8);

  font-size: 16px;

  line-height: 1.7;

  text-align: center;
}

.cc-service-final-button,
.cc-deep-final-button,
.cc-villa-final-button,
.cc-apartment-final-button,
.cc-sofa-final-button,
.cc-mattress-final-button,
.cc-carpet-final-button,
.cc-move-final-button,
.cc-monthly-final-button,
.cc-home-cleaning-final-button,
.cc-regular-cleaning-final-button {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  min-height: 52px;

  padding: 0 25px;

  border-radius: 10px;

  background: #ffffff;

  color: var(--cc-navy) !important;

  text-decoration: none !important;

  font-size: 14px;

  line-height: 1;

  font-weight: 900;

  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.16);

  transition:
    transform 0.2s ease,
    background 0.2s ease;
}

.cc-service-final-button:hover,
.cc-deep-final-button:hover,
.cc-villa-final-button:hover,
.cc-apartment-final-button:hover,
.cc-sofa-final-button:hover,
.cc-mattress-final-button:hover,
.cc-carpet-final-button:hover,
.cc-move-final-button:hover,
.cc-monthly-final-button:hover,
.cc-home-cleaning-final-button:hover,
.cc-regular-cleaning-final-button:hover {
  transform: translateY(-2px);

  background: #f4faf7;

  color: var(--cc-navy-dark) !important;
}

/* =========================================================
   43. LEGACY DEEP CLEANING CARD SUPPORT
   Existing Deep Cleaning.php currently uses:
   .cc-service-card
   .cc-service-price-area
   .cc-service-price-row
   .cc-service-meta
   .cc-service-card-button

   Keep these rules because they allow the existing
   Deep Cleaning PHP template to work without modification.
========================================================= */

.cc-deep-page .cc-service-card,
.cc-villa-page .cc-service-card,
.cc-apartment-page .cc-service-card {
  display: flex;

  flex-direction: column;

  min-width: 0;

  padding: 25px;

  background: #ffffff;

  border: 1px solid var(--cc-border);

  border-radius: var(--cc-radius);

  box-shadow: var(--cc-card-shadow);

  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    border-color 0.2s ease;
}

.cc-deep-page .cc-service-card:hover,
.cc-villa-page .cc-service-card:hover,
.cc-apartment-page .cc-service-card:hover {
  transform: translateY(-4px);

  border-color: #c8ddd7;

  box-shadow: 0 18px 42px rgba(18, 59, 74, 0.1);
}

.cc-deep-page .cc-service-price-area,
.cc-villa-page .cc-service-price-area,
.cc-apartment-page .cc-service-price-area {
  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: 10px;

  margin-bottom: 20px;
}

.cc-deep-page .cc-service-price-row,
.cc-villa-page .cc-service-price-row,
.cc-apartment-page .cc-service-price-row {
  padding: 15px 13px;

  border-radius: 12px;

  background: var(--cc-soft-bg);

  border: 1px solid var(--cc-border-soft);

  text-align: center;
}

.cc-deep-page .cc-service-price-row span,
.cc-villa-page .cc-service-price-row span,
.cc-apartment-page .cc-service-price-row span {
  display: block;

  margin-bottom: 7px;

  color: var(--cc-muted);

  font-size: 11px;
}

.cc-deep-page .cc-service-price-row strong,
.cc-villa-page .cc-service-price-row strong,
.cc-apartment-page .cc-service-price-row strong {
  display: block;

  color: var(--cc-green);

  font-size: 22px;

  line-height: 1.15;

  font-weight: 900;
}

.cc-deep-page .cc-service-meta,
.cc-villa-page .cc-service-meta,
.cc-apartment-page .cc-service-meta {
  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  gap: 8px 18px;

  margin-bottom: 22px;

  color: var(--cc-muted);

  font-size: 12px;

  text-align: center;
}

.cc-deep-page .cc-service-card-button,
.cc-villa-page .cc-service-card-button,
.cc-apartment-page .cc-service-card-button {
  display: flex !important;

  align-items: center;

  justify-content: center;

  width: 100%;

  min-height: 48px;

  margin-top: auto;

  padding: 13px 16px;

  border-radius: 9px;

  background: var(--cc-navy) !important;

  color: #ffffff !important;

  text-decoration: none !important;

  font-size: 13px;

  line-height: 1.2;

  font-weight: 800;

  text-align: center;

  visibility: visible !important;

  opacity: 1 !important;

  position: relative;

  z-index: 5;
}

.cc-deep-page .cc-service-card-button:hover,
.cc-villa-page .cc-service-card-button:hover,
.cc-apartment-page .cc-service-card-button:hover {
  background: var(--cc-green) !important;

  color: #ffffff !important;
}

/* =========================================================
   44. DEEP CLEANING TASK DIVIDER
========================================================= */

.cc-deep-task-divider {
  display: flex;

  align-items: center;

  gap: 15px;

  margin: 48px 0 30px;
}

.cc-deep-task-divider-line {
  flex: 1;

  height: 1px;

  background: var(--cc-border);
}

.cc-deep-task-divider span {
  flex: 0 0 auto;

  color: var(--cc-green);

  font-size: 10px;

  font-weight: 900;

  letter-spacing: 1px;

  text-align: center;
}

/* =========================================================
   45. DISABLE UNWANTED THEME ENTRY CONTENT WIDTH
========================================================= */

.cc-service-page .container,
.cc-service-page .container-fluid,
.cc-service-page .site-content,
.cc-service-page .entry-content,
.cc-deep-page .container,
.cc-deep-page .container-fluid,
.cc-deep-page .site-content,
.cc-deep-page .entry-content,
.cc-villa-page .container,
.cc-villa-page .container-fluid,
.cc-villa-page .site-content,
.cc-villa-page .entry-content,
.cc-apartment-page .container,
.cc-apartment-page .container-fluid,
.cc-apartment-page .site-content,
.cc-apartment-page .entry-content,
.cc-sofa-page .container,
.cc-sofa-page .container-fluid,
.cc-sofa-page .site-content,
.cc-sofa-page .entry-content,
.cc-mattress-page .container,
.cc-mattress-page .container-fluid,
.cc-mattress-page .site-content,
.cc-mattress-page .entry-content,
.cc-carpet-page .container,
.cc-carpet-page .container-fluid,
.cc-carpet-page .site-content,
.cc-carpet-page .entry-content,
.cc-move-page .container,
.cc-move-page .container-fluid,
.cc-move-page .site-content,
.cc-move-page .entry-content,
.cc-monthly-page .container,
.cc-monthly-page .container-fluid,
.cc-monthly-page .site-content,
.cc-monthly-page .entry-content,
.cc-home-cleaning-page .container,
.cc-home-cleaning-page .container-fluid,
.cc-home-cleaning-page .site-content,
.cc-home-cleaning-page .entry-content,
.cc-regular-cleaning-page .container,
.cc-regular-cleaning-page .container-fluid,
.cc-regular-cleaning-page .site-content,
.cc-regular-cleaning-page .entry-content {
  max-width: none;

  width: auto;

  padding-left: 0;

  padding-right: 0;
}

/* =========================================================
   46. GLOBAL PAGE ELEMENT SAFETY
========================================================= */

.cc-service-page img,
.cc-deep-page img,
.cc-villa-page img,
.cc-apartment-page img,
.cc-sofa-page img,
.cc-mattress-page img,
.cc-carpet-page img,
.cc-move-page img,
.cc-monthly-page img,
.cc-home-cleaning-page img,
.cc-regular-cleaning-page img {
  max-width: 100%;

  height: auto;
}

.cc-service-page a,
.cc-deep-page a,
.cc-villa-page a,
.cc-apartment-page a,
.cc-sofa-page a,
.cc-mattress-page a,
.cc-carpet-page a,
.cc-move-page a,
.cc-monthly-page a,
.cc-home-cleaning-page a,
.cc-regular-cleaning-page a {
  text-decoration: none;
}

.cc-service-page button,
.cc-service-page input,
.cc-service-page select,
.cc-service-page textarea,
.cc-deep-page button,
.cc-deep-page input,
.cc-deep-page select,
.cc-deep-page textarea,
.cc-villa-page button,
.cc-villa-page input,
.cc-villa-page select,
.cc-villa-page textarea,
.cc-apartment-page button,
.cc-apartment-page input,
.cc-apartment-page select,
.cc-apartment-page textarea,
.cc-sofa-page button,
.cc-sofa-page input,
.cc-sofa-page select,
.cc-sofa-page textarea,
.cc-mattress-page button,
.cc-mattress-page input,
.cc-mattress-page select,
.cc-mattress-page textarea,
.cc-carpet-page button,
.cc-carpet-page input,
.cc-carpet-page select,
.cc-carpet-page textarea,
.cc-move-page button,
.cc-move-page input,
.cc-move-page select,
.cc-move-page textarea,
.cc-monthly-page button,
.cc-monthly-page input,
.cc-monthly-page select,
.cc-monthly-page textarea,
.cc-home-cleaning-page button,
.cc-home-cleaning-page input,
.cc-home-cleaning-page select,
.cc-home-cleaning-page textarea,
.cc-regular-cleaning-page button,
.cc-regular-cleaning-page input,
.cc-regular-cleaning-page select,
.cc-regular-cleaning-page textarea {
  font-family: inherit;
}

/* =========================================================
   47. TABLET
========================================================= */

@media (max-width: 1050px) {
  .cc-service-hero-grid,
  .cc-deep-hero-grid,
  .cc-villa-hero-grid,
  .cc-apartment-hero-grid,
  .cc-sofa-hero-grid,
  .cc-mattress-hero-grid,
  .cc-carpet-hero-grid,
  .cc-move-hero-grid,
  .cc-monthly-hero-grid,
  .cc-home-cleaning-hero-grid,
  .cc-regular-cleaning-hero-grid {
    grid-template-columns:
      minmax(0, 1fr)
      minmax(320px, 0.85fr);

    gap: 35px;
  }

  .cc-service-price-grid,
  .cc-deep-service-grid,
  .cc-villa-price-grid,
  .cc-apartment-price-grid,
  .cc-sofa-price-grid,
  .cc-mattress-price-grid,
  .cc-carpet-price-grid,
  .cc-move-price-grid,
  .cc-monthly-price-grid,
  .cc-home-cleaning-price-grid,
  .cc-regular-cleaning-price-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cc-service-feature-grid,
  .cc-deep-benefit-grid,
  .cc-villa-benefit-grid,
  .cc-apartment-benefit-grid,
  .cc-sofa-benefit-grid,
  .cc-mattress-benefit-grid,
  .cc-carpet-benefit-grid,
  .cc-move-benefit-grid,
  .cc-monthly-benefit-grid,
  .cc-home-cleaning-benefit-grid,
  .cc-regular-cleaning-benefit-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cc-service-addon-grid,
  .cc-deep-addon-grid,
  .cc-villa-addon-grid,
  .cc-apartment-addon-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cc-service-booking-grid,
  .cc-deep-booking-grid,
  .cc-villa-booking-grid,
  .cc-apartment-booking-grid,
  .cc-sofa-booking-grid,
  .cc-mattress-booking-grid,
  .cc-carpet-booking-grid,
  .cc-move-booking-grid,
  .cc-monthly-booking-grid,
  .cc-home-cleaning-booking-grid,
  .cc-regular-cleaning-booking-grid {
    grid-template-columns: 1fr 1fr;

    gap: 35px;
  }
}

/* =========================================================
   48. MOBILE
========================================================= */

@media (max-width: 760px) {
  .cc-service-container,
  .cc-deep-container,
  .cc-villa-container,
  .cc-apartment-container,
  .cc-sofa-container,
  .cc-mattress-container,
  .cc-carpet-container,
  .cc-move-container,
  .cc-monthly-container,
  .cc-home-cleaning-container,
  .cc-regular-cleaning-container {
    width: min(100% - 28px, 1180px);
  }

  .cc-service-hero,
  .cc-deep-hero,
  .cc-villa-hero,
  .cc-apartment-hero,
  .cc-sofa-hero,
  .cc-mattress-hero,
  .cc-carpet-hero,
  .cc-move-hero,
  .cc-monthly-hero,
  .cc-home-cleaning-hero,
  .cc-regular-cleaning-hero {
    padding: 58px 0 52px;
  }

  .cc-service-hero-grid,
  .cc-deep-hero-grid,
  .cc-villa-hero-grid,
  .cc-apartment-hero-grid,
  .cc-sofa-hero-grid,
  .cc-mattress-hero-grid,
  .cc-carpet-hero-grid,
  .cc-move-hero-grid,
  .cc-monthly-hero-grid,
  .cc-home-cleaning-hero-grid,
  .cc-regular-cleaning-hero-grid {
    grid-template-columns: 1fr;

    gap: 35px;
  }

  .cc-service-hero-content,
  .cc-deep-hero-content,
  .cc-villa-hero-content,
  .cc-apartment-hero-content,
  .cc-sofa-hero-content,
  .cc-mattress-hero-content,
  .cc-carpet-hero-content,
  .cc-move-hero-content,
  .cc-monthly-hero-content,
  .cc-home-cleaning-hero-content,
  .cc-regular-cleaning-hero-content {
    text-align: center;
  }

  .cc-service-eyebrow,
  .cc-deep-eyebrow,
  .cc-villa-eyebrow,
  .cc-apartment-eyebrow,
  .cc-sofa-eyebrow,
  .cc-mattress-eyebrow,
  .cc-carpet-eyebrow,
  .cc-move-eyebrow,
  .cc-monthly-eyebrow,
  .cc-home-cleaning-eyebrow,
  .cc-regular-cleaning-eyebrow {
    margin-left: auto;

    margin-right: auto;
  }

  .cc-service-hero h1,
  .cc-deep-hero h1,
  .cc-villa-hero h1,
  .cc-apartment-hero h1,
  .cc-sofa-hero h1,
  .cc-mattress-hero h1,
  .cc-carpet-hero h1,
  .cc-move-hero h1,
  .cc-monthly-hero h1,
  .cc-home-cleaning-hero h1,
  .cc-regular-cleaning-hero h1 {
    font-size: 42px;

    letter-spacing: -1.2px;
  }

  .cc-service-hero-description,
  .cc-deep-hero-text,
  .cc-villa-hero-description,
  .cc-apartment-hero-description,
  .cc-sofa-hero-description,
  .cc-mattress-hero-description,
  .cc-carpet-hero-description,
  .cc-move-hero-description,
  .cc-monthly-hero-description,
  .cc-home-cleaning-hero-description,
  .cc-regular-cleaning-hero-description {
    margin-left: auto;

    margin-right: auto;

    font-size: 15px;
  }

  .cc-service-hero-actions,
  .cc-deep-hero-actions,
  .cc-villa-hero-actions,
  .cc-apartment-hero-actions,
  .cc-sofa-hero-actions,
  .cc-mattress-hero-actions,
  .cc-carpet-hero-actions,
  .cc-move-hero-actions,
  .cc-monthly-hero-actions,
  .cc-home-cleaning-hero-actions,
  .cc-regular-cleaning-hero-actions {
    justify-content: center;
  }

  .cc-service-hero-trust,
  .cc-deep-trust,
  .cc-villa-hero-trust,
  .cc-apartment-hero-trust,
  .cc-sofa-hero-trust,
  .cc-mattress-hero-trust,
  .cc-carpet-hero-trust,
  .cc-move-hero-trust,
  .cc-monthly-hero-trust,
  .cc-home-cleaning-hero-trust,
  .cc-regular-cleaning-hero-trust {
    justify-content: center;
  }

  .cc-service-hero-card,
  .cc-deep-hero-card,
  .cc-villa-hero-card,
  .cc-apartment-hero-card,
  .cc-sofa-hero-card,
  .cc-mattress-hero-card,
  .cc-carpet-hero-card,
  .cc-move-hero-card,
  .cc-monthly-hero-card,
  .cc-home-cleaning-hero-card,
  .cc-regular-cleaning-hero-card {
    padding: 24px;
  }

  .cc-service-section,
  .cc-deep-intro,
  .cc-deep-pricing-section,
  .cc-deep-tasks-section,
  .cc-deep-addon-section,
  .cc-deep-note-section,
  .cc-villa-section,
  .cc-apartment-section,
  .cc-sofa-section,
  .cc-mattress-section,
  .cc-carpet-section,
  .cc-move-section,
  .cc-monthly-section,
  .cc-home-cleaning-section,
  .cc-regular-cleaning-section {
    padding: 60px 0;
  }

  .cc-service-section-heading,
  .cc-deep-section-heading,
  .cc-villa-section-heading,
  .cc-apartment-section-heading,
  .cc-sofa-section-heading,
  .cc-mattress-section-heading,
  .cc-carpet-section-heading,
  .cc-move-section-heading,
  .cc-monthly-section-heading,
  .cc-home-cleaning-section-heading,
  .cc-regular-cleaning-section-heading {
    margin-bottom: 34px;
  }

  .cc-service-section-heading h2,
  .cc-deep-section-heading h2,
  .cc-villa-section-heading h2,
  .cc-apartment-section-heading h2,
  .cc-sofa-section-heading h2,
  .cc-mattress-section-heading h2,
  .cc-carpet-section-heading h2,
  .cc-move-section-heading h2,
  .cc-monthly-section-heading h2,
  .cc-home-cleaning-section-heading h2,
  .cc-regular-cleaning-section-heading h2 {
    font-size: 31px;
  }

  .cc-service-section-heading p,
  .cc-deep-section-heading p,
  .cc-villa-section-heading p,
  .cc-apartment-section-heading p,
  .cc-sofa-section-heading p,
  .cc-mattress-section-heading p,
  .cc-carpet-section-heading p,
  .cc-move-section-heading p,
  .cc-monthly-section-heading p,
  .cc-home-cleaning-section-heading p,
  .cc-regular-cleaning-section-heading p {
    font-size: 14px;
  }

  .cc-service-feature-grid,
  .cc-deep-benefit-grid,
  .cc-villa-feature-grid,
  .cc-apartment-benefit-grid,
  .cc-sofa-benefit-grid,
  .cc-mattress-benefit-grid,
  .cc-carpet-benefit-grid,
  .cc-move-benefit-grid,
  .cc-monthly-benefit-grid,
  .cc-home-cleaning-benefit-grid,
  .cc-regular-cleaning-benefit-grid,
  .cc-service-three-grid,
  .cc-villa-feature-grid.three-columns,
  .cc-apartment-feature-grid,
  .cc-service-price-grid,
  .cc-deep-service-grid,
  .cc-villa-price-grid,
  .cc-apartment-price-grid,
  .cc-sofa-price-grid,
  .cc-mattress-price-grid,
  .cc-carpet-price-grid,
  .cc-move-price-grid,
  .cc-monthly-price-grid,
  .cc-home-cleaning-price-grid,
  .cc-regular-cleaning-price-grid,
  .cc-service-task-grid,
  .cc-deep-task-grid,
  .cc-villa-task-grid,
  .cc-apartment-task-grid,
  .cc-sofa-task-grid,
  .cc-mattress-task-grid,
  .cc-carpet-task-grid,
  .cc-move-task-grid,
  .cc-monthly-task-grid,
  .cc-home-cleaning-task-grid,
  .cc-regular-cleaning-task-grid {
    grid-template-columns: 1fr;
  }

  .cc-service-addon-grid,
  .cc-deep-addon-grid,
  .cc-villa-addon-grid,
  .cc-apartment-addon-grid,
  .cc-sofa-addon-grid,
  .cc-mattress-addon-grid,
  .cc-carpet-addon-grid,
  .cc-move-addon-grid,
  .cc-monthly-addon-grid {
    grid-template-columns: 1fr;
  }

  .cc-service-card,
  .cc-deep-page .cc-service-card,
  .cc-villa-page .cc-service-card,
  .cc-apartment-page .cc-service-card {
    padding: 23px;
  }

  .cc-service-price-area,
  .cc-deep-page .cc-service-price-area,
  .cc-villa-page .cc-service-price-area,
  .cc-apartment-page .cc-service-price-area {
    grid-template-columns: 1fr;
  }

  .cc-service-booking-grid,
  .cc-deep-booking-grid,
  .cc-villa-booking-grid,
  .cc-apartment-booking-grid,
  .cc-sofa-booking-grid,
  .cc-mattress-booking-grid,
  .cc-carpet-booking-grid,
  .cc-move-booking-grid,
  .cc-monthly-booking-grid,
  .cc-home-cleaning-booking-grid,
  .cc-regular-cleaning-booking-grid {
    grid-template-columns: 1fr;

    gap: 35px;
  }

  .cc-service-booking-content h2,
  .cc-deep-booking-content h2,
  .cc-villa-booking-content h2,
  .cc-apartment-booking-content h2,
  .cc-sofa-booking-content h2,
  .cc-mattress-booking-content h2,
  .cc-carpet-booking-content h2,
  .cc-move-booking-content h2,
  .cc-monthly-booking-content h2,
  .cc-home-cleaning-booking-content h2,
  .cc-regular-cleaning-booking-content h2 {
    text-align: center;
  }

  .cc-service-booking-content > p,
  .cc-deep-booking-content > p,
  .cc-villa-booking-content > p,
  .cc-apartment-booking-content > p,
  .cc-sofa-booking-content > p,
  .cc-mattress-booking-content > p,
  .cc-carpet-booking-content > p,
  .cc-move-booking-content > p,
  .cc-monthly-booking-content > p,
  .cc-home-cleaning-booking-content > p,
  .cc-regular-cleaning-booking-content > p {
    text-align: center;
  }

  .cc-service-booking-card,
  .cc-deep-booking-card,
  .cc-villa-booking-card,
  .cc-apartment-booking-card,
  .cc-sofa-booking-card,
  .cc-mattress-booking-card,
  .cc-carpet-booking-card,
  .cc-move-booking-card,
  .cc-monthly-booking-card,
  .cc-home-cleaning-booking-card,
  .cc-regular-cleaning-booking-card {
    padding: 23px;
  }

  .cc-service-bonus,
  .cc-deep-bonus,
  .cc-villa-bonus-card,
  .cc-apartment-bonus,
  .cc-sofa-bonus,
  .cc-mattress-bonus,
  .cc-carpet-bonus,
  .cc-move-bonus,
  .cc-monthly-bonus,
  .cc-home-cleaning-bonus,
  .cc-regular-cleaning-bonus {
    align-items: flex-start;

    padding: 23px;

    gap: 16px;
  }
}

/* =========================================================
   49. SMALL MOBILE
========================================================= */

@media (max-width: 430px) {
  .cc-service-container,
  .cc-deep-container,
  .cc-villa-container,
  .cc-apartment-container,
  .cc-sofa-container,
  .cc-mattress-container,
  .cc-carpet-container,
  .cc-move-container,
  .cc-monthly-container,
  .cc-home-cleaning-container,
  .cc-regular-cleaning-container {
    width: calc(100% - 22px);
  }

  .cc-service-hero h1,
  .cc-deep-hero h1,
  .cc-villa-hero h1,
  .cc-apartment-hero h1,
  .cc-sofa-hero h1,
  .cc-mattress-hero h1,
  .cc-carpet-hero h1,
  .cc-move-hero h1,
  .cc-monthly-hero h1,
  .cc-home-cleaning-hero h1,
  .cc-regular-cleaning-hero h1 {
    font-size: 36px;
  }

  .cc-service-hero-actions,
  .cc-deep-hero-actions,
  .cc-villa-hero-actions,
  .cc-apartment-hero-actions,
  .cc-sofa-hero-actions,
  .cc-mattress-hero-actions,
  .cc-carpet-hero-actions,
  .cc-move-hero-actions,
  .cc-monthly-hero-actions,
  .cc-home-cleaning-hero-actions,
  .cc-regular-cleaning-hero-actions {
    flex-direction: column;

    width: 100%;
  }

  .cc-service-primary-button,
  .cc-service-secondary-button,
  .cc-deep-btn-primary,
  .cc-deep-btn-secondary,
  .cc-villa-primary-button,
  .cc-villa-secondary-button,
  .cc-apartment-primary-button,
  .cc-apartment-secondary-button,
  .cc-sofa-primary-button,
  .cc-sofa-secondary-button,
  .cc-mattress-primary-button,
  .cc-mattress-secondary-button,
  .cc-carpet-primary-button,
  .cc-carpet-secondary-button,
  .cc-move-primary-button,
  .cc-move-secondary-button,
  .cc-monthly-primary-button,
  .cc-monthly-secondary-button,
  .cc-home-cleaning-primary-button,
  .cc-home-cleaning-secondary-button,
  .cc-regular-cleaning-primary-button,
  .cc-regular-cleaning-secondary-button {
    width: 100%;
  }

  .cc-service-price-area,
  .cc-deep-page .cc-service-price-area,
  .cc-villa-page .cc-service-price-area,
  .cc-apartment-page .cc-service-price-area {
    grid-template-columns: 1fr;
  }

  .cc-service-meta,
  .cc-deep-service-meta,
  .cc-villa-service-meta,
  .cc-apartment-service-meta,
  .cc-sofa-service-meta,
  .cc-mattress-service-meta,
  .cc-carpet-service-meta,
  .cc-move-service-meta,
  .cc-monthly-service-meta,
  .cc-home-cleaning-service-meta,
  .cc-regular-cleaning-service-meta,
  .cc-deep-page .cc-service-meta,
  .cc-villa-page .cc-service-meta,
  .cc-apartment-page .cc-service-meta {
    flex-direction: column;

    gap: 5px;

    margin-bottom: 21px;
  }

  .cc-service-card-button,
  .cc-deep-service-card-button,
  .cc-villa-service-card-button,
  .cc-apartment-service-card-button,
  .cc-sofa-service-card-button,
  .cc-mattress-service-card-button,
  .cc-carpet-service-card-button,
  .cc-move-service-card-button,
  .cc-monthly-service-card-button,
  .cc-home-cleaning-service-card-button,
  .cc-regular-cleaning-service-card-button,
  .cc-deep-page .cc-service-card-button,
  .cc-villa-page .cc-service-card-button,
  .cc-apartment-page .cc-service-card-button {
    min-height: 50px;

    font-size: 13px;
  }

  .cc-service-bonus,
  .cc-deep-bonus,
  .cc-villa-bonus-card,
  .cc-apartment-bonus,
  .cc-sofa-bonus,
  .cc-mattress-bonus,
  .cc-carpet-bonus,
  .cc-move-bonus,
  .cc-monthly-bonus,
  .cc-home-cleaning-bonus,
  .cc-regular-cleaning-bonus {
    flex-direction: column;

    align-items: center;

    text-align: center;
  }

  .cc-service-bonus p,
  .cc-deep-bonus p,
  .cc-villa-bonus-content p {
    text-align: center;
  }

  .cc-service-form-row,
  .cc-deep-form-row,
  .cc-villa-form-row,
  .cc-apartment-form-row,
  .cc-sofa-form-row,
  .cc-mattress-form-row,
  .cc-carpet-form-row,
  .cc-move-form-row,
  .cc-monthly-form-row,
  .cc-home-cleaning-form-row,
  .cc-regular-cleaning-form-row {
    grid-template-columns: 1fr;
  }

  .cc-service-note,
  .cc-deep-note-box,
  .cc-villa-note-box,
  .cc-apartment-note-box,
  .cc-sofa-note-box,
  .cc-mattress-note-box,
  .cc-carpet-note-box,
  .cc-move-note-box,
  .cc-monthly-note-box,
  .cc-home-cleaning-note-box,
  .cc-regular-cleaning-note-box {
    padding: 22px;

    gap: 13px;
  }

  .cc-service-final-cta,
  .cc-deep-final-cta,
  .cc-villa-final-cta,
  .cc-apartment-final-cta,
  .cc-sofa-final-cta,
  .cc-mattress-final-cta,
  .cc-carpet-final-cta,
  .cc-move-final-cta,
  .cc-monthly-final-cta,
  .cc-home-cleaning-final-cta,
  .cc-regular-cleaning-final-cta {
    padding: 65px 0;
  }

  .cc-service-final-cta h2,
  .cc-deep-final-cta h2,
  .cc-villa-final-cta h2,
  .cc-apartment-final-cta h2,
  .cc-sofa-final-cta h2,
  .cc-mattress-final-cta h2,
  .cc-carpet-final-cta h2,
  .cc-move-final-cta h2,
  .cc-monthly-final-cta h2,
  .cc-home-cleaning-final-cta h2,
  .cc-regular-cleaning-final-cta h2 {
    font-size: 32px;
  }
}

/* =========================================================
   50. END
========================================================= */

/* =========================================================
   51. NEW SERVICE HUB + LOCATION PAGE COMPATIBILITY
   Added for:
   - Services hub
   - Service Areas hub
   - Regular Home Cleaning
   - Sharjah location/service-area pages

   These rules extend the existing CALM & CLEAN design system
   without changing pricing or the WordPress theme globally.
========================================================= */

/* Keep long service/location headings safe on all screens */
.cc-services-page h1,
.cc-location-page h1,
.cc-service-areas-page h1,
.cc-regular-page h1,
.cc-services-page h2,
.cc-location-page h2,
.cc-service-areas-page h2,
.cc-regular-page h2,
.cc-services-page h3,
.cc-location-page h3,
.cc-service-areas-page h3,
.cc-regular-page h3 {
  overflow-wrap: break-word;
  word-break: normal;
}

/* ---------------------------------------------------------
   HERO STARTING PRICE
--------------------------------------------------------- */

.cc-villa-page .cc-apartment-hero-price {
  display: inline-flex;
  align-items: center;
  gap: 10px;

  margin: 0 0 28px;
  padding: 11px 15px;

  border: 1px solid rgba(255, 255, 255, 0.17);
  border-radius: 12px;

  background: rgba(255, 255, 255, 0.09);

  color: #ffffff;
}

.cc-villa-page .cc-apartment-hero-price span {
  color: rgba(255, 255, 255, 0.78);

  font-size: 12px;
  line-height: 1.3;
  font-weight: 700;
}

.cc-villa-page .cc-apartment-hero-price strong {
  color: #ffffff;

  font-size: 20px;
  line-height: 1;
  font-weight: 900;
}

/* ---------------------------------------------------------
   HERO CARD ICON + META / STAT ROW
--------------------------------------------------------- */

.cc-villa-page .cc-villa-hero-card-icon {
  flex: 0 0 auto;

  width: 38px;
  height: 38px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: var(--cc-green-soft);
  color: var(--cc-green);

  font-size: 15px;
  font-weight: 900;
}

.cc-villa-page .cc-villa-hero-card-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 10px;

  margin-top: 23px;
}

.cc-villa-page .cc-villa-hero-card-meta > div {
  min-width: 0;

  padding: 13px 8px;

  border: 1px solid var(--cc-border-soft);
  border-radius: 12px;

  background: var(--cc-soft-bg);

  text-align: center;
}

.cc-villa-page .cc-villa-hero-card-meta strong {
  display: block;

  margin-bottom: 4px;

  color: var(--cc-green);

  font-size: 18px;
  line-height: 1.1;
  font-weight: 900;
}

.cc-villa-page .cc-villa-hero-card-meta span {
  display: block;

  color: var(--cc-muted);

  font-size: 10px;
  line-height: 1.35;
  font-weight: 700;
}

/*
 * Newer pages place Google Reviews inside the WHITE hero card.
 * Override the generic dark-hero trust divider only in that case.
 */
.cc-villa-hero-card .cc-villa-hero-trust {
  margin-top: 22px;
  padding-top: 18px;

  border-top: 1px solid var(--cc-border-soft);

  justify-content: flex-start;

  overflow: visible;
}

/* ---------------------------------------------------------
   THREE-CARD SECTIONS USED BY NEW HUB/LOCATION PAGES
--------------------------------------------------------- */

.cc-services-page .cc-villa-feature-grid,
.cc-location-page .cc-villa-feature-grid,
.cc-service-areas-page .cc-villa-feature-grid,
.cc-regular-page .cc-villa-feature-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cc-services-page .cc-villa-task-grid,
.cc-location-page .cc-villa-task-grid,
.cc-service-areas-page .cc-villa-task-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Feature cards are sometimes internal links */
.cc-villa-page a.cc-villa-feature-card {
  color: inherit;
  text-decoration: none !important;

  transition:
    transform 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}

.cc-villa-page a.cc-villa-feature-card:hover {
  transform: translateY(-3px);

  border-color: #c8ddd7;

  box-shadow: 0 16px 36px rgba(18, 59, 74, 0.09);
}

/* ---------------------------------------------------------
   SERVICE CARD HEADER / BADGE / COPY
--------------------------------------------------------- */

.cc-services-page .cc-villa-service-card-header,
.cc-location-page .cc-villa-service-card-header,
.cc-regular-page .cc-villa-service-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;

  gap: 14px;
}

.cc-villa-page .cc-villa-service-card-title-wrap {
  min-width: 0;
}

.cc-villa-page .cc-villa-service-card-badge {
  flex: 0 0 auto;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 28px;

  padding: 6px 9px;

  border-radius: 999px;

  background: var(--cc-green-soft);
  color: var(--cc-green-dark);

  font-size: 9px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: 0.8px;
}

.cc-villa-page .cc-villa-service-card > p {
  margin: 0 0 21px;

  color: var(--cc-muted);

  font-size: 13px;
  line-height: 1.65;
}

/* New hub/location cards use one price box per card */
.cc-services-page .cc-villa-price-options,
.cc-location-page .cc-villa-price-options,
.cc-regular-page .cc-villa-price-options {
  grid-template-columns: 1fr;
}

.cc-villa-page .cc-villa-price-option {
  min-width: 0;

  padding: 16px 14px;

  border: 1px solid var(--cc-border-soft);
  border-radius: 12px;

  background: var(--cc-soft-bg);

  text-align: center;
}

/* Make nested card links fill the visual button */
.cc-services-page .cc-villa-service-card-button,
.cc-location-page .cc-villa-service-card-button,
.cc-regular-page .cc-villa-service-card-button {
  padding: 0;
}

.cc-services-page .cc-villa-service-card-button > a,
.cc-location-page .cc-villa-service-card-button > a,
.cc-regular-page .cc-villa-service-card-button > a {
  width: 100%;
  min-height: 48px;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 13px 16px;

  color: #ffffff !important;
  text-decoration: none !important;

  font-size: 13px;
  line-height: 1.25;
  font-weight: 800;
  text-align: center;
}

/* ---------------------------------------------------------
   TASK CARD HEADING + ICON
--------------------------------------------------------- */

.cc-villa-page .cc-villa-task-card-heading {
  display: flex;
  align-items: center;

  gap: 12px;

  margin-bottom: 17px;
}

.cc-villa-page .cc-villa-task-card-heading h3 {
  margin: 0;
}

.cc-villa-page .cc-villa-task-icon {
  flex: 0 0 auto;

  width: 38px;
  height: 38px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: var(--cc-green-soft);
  color: var(--cc-green);

  font-size: 12px;
  line-height: 1;
  font-weight: 900;
}

/* ---------------------------------------------------------
   BONUS / CTA LABEL
--------------------------------------------------------- */

.cc-villa-page .cc-villa-bonus-label {
  display: block;

  margin-bottom: 7px;

  color: var(--cc-green);

  font-size: 10px;
  line-height: 1.3;
  font-weight: 900;
  letter-spacing: 1.1px;
}

.cc-villa-page .cc-villa-bonus-content h2 {
  margin: 0 0 8px;
}

.cc-villa-page .cc-villa-bonus-content > p:last-child {
  display: flex;
  flex-wrap: wrap;

  gap: 10px;

  margin-top: 18px;
}

/* ---------------------------------------------------------
   FAQ ACCORDION
--------------------------------------------------------- */

.cc-villa-page .cc-villa-faq-list {
  width: min(900px, 100%);

  margin: 0 auto;

  display: grid;
  gap: 12px;
}

.cc-villa-page .cc-villa-faq-list details {
  overflow: hidden;

  background: #ffffff;

  border: 1px solid var(--cc-border);
  border-radius: 14px;

  box-shadow: 0 7px 22px rgba(18, 59, 74, 0.035);
}

.cc-villa-page .cc-villa-faq-list summary {
  position: relative;

  display: flex;
  align-items: center;

  min-height: 62px;

  padding: 18px 52px 18px 20px;

  color: var(--cc-navy);

  font-size: 15px;
  line-height: 1.45;
  font-weight: 800;

  cursor: pointer;

  list-style: none;
}

.cc-villa-page .cc-villa-faq-list summary::-webkit-details-marker {
  display: none;
}

.cc-villa-page .cc-villa-faq-list summary::after {
  content: "+";

  position: absolute;

  right: 20px;
  top: 50%;

  transform: translateY(-50%);

  width: 28px;
  height: 28px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: var(--cc-green-soft);
  color: var(--cc-green);

  font-size: 18px;
  line-height: 1;
  font-weight: 800;
}

.cc-villa-page .cc-villa-faq-list details[open] summary::after {
  content: "−";
}

.cc-villa-page .cc-villa-faq-list details[open] summary {
  border-bottom: 1px solid var(--cc-border-soft);
}

.cc-villa-page .cc-villa-faq-list details > p {
  margin: 0;

  padding: 17px 20px 20px;

  color: var(--cc-muted);

  font-size: 14px;
  line-height: 1.7;
}

/* ---------------------------------------------------------
   EMPTY / FALLBACK MESSAGE
--------------------------------------------------------- */

.cc-villa-page .cc-villa-empty-message {
  max-width: 760px;

  margin: 0 auto;
  padding: 22px;

  border: 1px solid var(--cc-border);
  border-radius: 14px;

  background: var(--cc-soft-bg);

  color: var(--cc-muted);

  font-size: 14px;
  line-height: 1.65;
  text-align: center;
}

/* ---------------------------------------------------------
   FLOATING WHATSAPP
--------------------------------------------------------- */

.cc-villa-page .pricing-floating-whatsapp {
  position: fixed;

  right: 22px;
  bottom: 22px;

  z-index: 999;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  gap: 9px;

  min-height: 50px;

  padding: 0 17px;

  border-radius: 999px;

  background: var(--cc-green);
  color: #ffffff !important;

  text-decoration: none !important;

  font-size: 13px;
  line-height: 1;
  font-weight: 900;

  box-shadow: 0 12px 32px rgba(18, 59, 74, 0.22);

  transition:
    transform 0.2s ease,
    background 0.2s ease,
    box-shadow 0.2s ease;
}

.cc-villa-page .pricing-floating-whatsapp:hover {
  transform: translateY(-2px);

  background: var(--cc-green-dark);

  color: #ffffff !important;

  box-shadow: 0 16px 36px rgba(18, 59, 74, 0.28);
}

.cc-villa-page .pricing-floating-whatsapp i {
  font-size: 18px;
}

/* ---------------------------------------------------------
   ACCESSIBILITY / KEYBOARD FOCUS
--------------------------------------------------------- */

.cc-villa-page a:focus-visible,
.cc-villa-page button:focus-visible,
.cc-villa-page summary:focus-visible,
.cc-villa-page input:focus-visible,
.cc-villa-page select:focus-visible,
.cc-villa-page textarea:focus-visible {
  outline: 3px solid rgba(46, 139, 112, 0.28);
  outline-offset: 3px;
}

/* ---------------------------------------------------------
   TABLET COMPATIBILITY FOR NEW PAGE TYPES
--------------------------------------------------------- */

@media (max-width: 980px) {
  .cc-services-page .cc-villa-feature-grid,
  .cc-location-page .cc-villa-feature-grid,
  .cc-service-areas-page .cc-villa-feature-grid,
  .cc-regular-page .cc-villa-feature-grid,
  .cc-services-page .cc-villa-task-grid,
  .cc-location-page .cc-villa-task-grid,
  .cc-service-areas-page .cc-villa-task-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cc-villa-page .cc-villa-hero-card-meta {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* ---------------------------------------------------------
   MOBILE COMPATIBILITY FOR NEW PAGE TYPES
--------------------------------------------------------- */

@media (max-width: 760px) {
  .cc-services-page .cc-villa-feature-grid,
  .cc-location-page .cc-villa-feature-grid,
  .cc-service-areas-page .cc-villa-feature-grid,
  .cc-regular-page .cc-villa-feature-grid,
  .cc-services-page .cc-villa-task-grid,
  .cc-location-page .cc-villa-task-grid,
  .cc-service-areas-page .cc-villa-task-grid {
    grid-template-columns: 1fr;
  }

  .cc-villa-page .cc-apartment-hero-price {
    margin-left: auto;
    margin-right: auto;
  }

  .cc-villa-page .cc-villa-bonus-content > p:last-child {
    justify-content: center;
  }

  .cc-villa-page .cc-villa-faq-list summary {
    padding-left: 17px;
    padding-right: 48px;
  }
}

/* ---------------------------------------------------------
   SMALL MOBILE
--------------------------------------------------------- */

@media (max-width: 430px) {
  .cc-villa-page .cc-villa-hero-card-meta {
    grid-template-columns: 1fr;
  }

  .cc-villa-page .cc-villa-service-card-header {
    flex-direction: column;
  }

  .cc-villa-page .cc-villa-bonus-content > p:last-child {
    flex-direction: column;
  }

  .cc-villa-page .cc-villa-bonus-content > p:last-child a {
    width: 100%;
  }

  .cc-villa-page .pricing-floating-whatsapp {
    right: 14px;
    bottom: 14px;

    width: 52px;
    height: 52px;
    min-height: 52px;

    padding: 0;
  }

  .cc-villa-page .pricing-floating-whatsapp span {
    display: none;
  }

  .cc-villa-page .pricing-floating-whatsapp i {
    font-size: 20px;
  }
}

/* =========================================================
   52. FINAL END
========================================================= */

/* =========================================================
   53. FINAL PHP/CSS COMPATIBILITY AUDIT PATCH
   Covers verified class gaps found across the final PHP set.
========================================================= */

/* ---------------------------------------------------------
   VILLA HERO PRICE
--------------------------------------------------------- */
.cc-villa-page .cc-villa-hero-price {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;

  margin: 22px 0 8px;
  padding: 12px 16px;

  border: 1px solid rgba(255, 255, 255, 0.17);
  border-radius: 12px;

  background: rgba(255, 255, 255, 0.09);

  color: #ffffff;
}

.cc-villa-page .cc-villa-hero-price span {
  color: rgba(255, 255, 255, 0.78);
}

.cc-villa-page .cc-villa-hero-price strong {
  color: #ffffff;

  font-size: 24px;
  line-height: 1.1;
  font-weight: 900;
}

/* ---------------------------------------------------------
   VILLA HERO TRUST POINTS
--------------------------------------------------------- */
.cc-villa-page .cc-villa-hero-trust-points {
  display: flex;
  flex-wrap: wrap;

  gap: 10px 18px;

  margin-top: 20px;

  color: rgba(255, 255, 255, 0.84);

  font-size: 13px;
  line-height: 1.5;
}

.cc-villa-page .cc-villa-hero-trust-points span {
  display: inline-flex;
  align-items: center;
}

/* ---------------------------------------------------------
   CARD BUTTON WRAPPER + FULL CLICKABLE LINK
   All verified PHP templates use a DIV wrapper here.
--------------------------------------------------------- */
.cc-villa-page .cc-villa-service-card-button {
  padding: 0 !important;
}

.cc-villa-page .cc-villa-service-card-button > a {
  width: 100%;
  min-height: 48px;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 13px 16px;

  border-radius: 9px;

  color: #ffffff !important;
  text-decoration: none !important;

  font-family: inherit;
  font-size: 13px;
  line-height: 1.25;
  font-weight: 800;
  text-align: center;
}

.cc-villa-page .cc-villa-service-card-button > a:focus-visible {
  outline-color: rgba(255, 255, 255, 0.8);
  outline-offset: -4px;
}

/* ---------------------------------------------------------
   LEGACY FAQ LIST
   Used by Villa Cleaning.php and Deep Cleaning.php.
--------------------------------------------------------- */
.cc-villa-page .faq-list {
  width: min(900px, 100%);

  margin: 0 auto;

  display: grid;
  gap: 12px;
}

.cc-villa-page .faq-list details {
  overflow: hidden;

  background: #ffffff;

  border: 1px solid var(--cc-border);
  border-radius: 14px;

  box-shadow: 0 7px 22px rgba(18, 59, 74, 0.035);
}

.cc-villa-page .faq-list summary {
  position: relative;

  display: flex;
  align-items: center;

  min-height: 62px;

  padding: 18px 52px 18px 20px;

  color: var(--cc-navy);

  font-size: 15px;
  line-height: 1.45;
  font-weight: 800;

  cursor: pointer;

  list-style: none;
}

.cc-villa-page .faq-list summary::-webkit-details-marker {
  display: none;
}

.cc-villa-page .faq-list summary::after {
  content: "+";

  position: absolute;

  right: 20px;
  top: 50%;

  transform: translateY(-50%);

  width: 28px;
  height: 28px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: var(--cc-green-soft);
  color: var(--cc-green);

  font-size: 18px;
  line-height: 1;
  font-weight: 800;
}

.cc-villa-page .faq-list details[open] summary::after {
  content: "−";
}

.cc-villa-page .faq-list details[open] summary {
  border-bottom: 1px solid var(--cc-border-soft);
}

.cc-villa-page .faq-list details > p {
  margin: 0;

  padding: 17px 20px 20px;

  color: var(--cc-muted);

  font-size: 14px;
  line-height: 1.7;
}

/* ---------------------------------------------------------
   SECTION MODIFIERS
   Keep alternating sections visually consistent.
--------------------------------------------------------- */
.cc-villa-page .cc-villa-pricing-section,
.cc-villa-page .cc-villa-faq-section {
  background: var(--cc-soft-bg);
}

.cc-villa-page .cc-villa-intro-section,
.cc-villa-page .cc-villa-tasks-section,
.cc-villa-page .cc-villa-bonus-section {
  background: #ffffff;
}

/* ---------------------------------------------------------
   MOBILE AUDIT FIXES
--------------------------------------------------------- */
@media (max-width: 760px) {
  .cc-villa-page .cc-villa-hero-price {
    align-items: center;

    margin-left: auto;
    margin-right: auto;

    text-align: center;
  }

  .cc-villa-page .cc-villa-hero-trust-points {
    justify-content: center;
  }

  .cc-villa-page .faq-list summary {
    padding-left: 17px;
    padding-right: 48px;
  }
}

/* =========================================================
   54. END FINAL AUDIT PATCH
========================================================= */
/* ============================================================
   SECONDARY HERO BUTTON — HIGHER CONTRAST
============================================================ */

.cc-villa-secondary-button {
  background: rgba(255, 255, 255, 0.14) !important;
  border: 2px solid rgba(255, 255, 255, 0.85) !important;

  color: #ffffff !important;

  font-weight: 800 !important;

  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12);

  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.cc-villa-secondary-button:hover {
  background: #ffffff !important;
  border-color: #ffffff !important;

  color: #123b4a !important;

  transform: translateY(-2px);

  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16);
}

.cc-villa-secondary-button:focus-visible {
  outline: 3px solid rgba(255, 255, 255, 0.45);
  outline-offset: 3px;
}