/* VELTORRA Climatización — veltorraclimatizacion.es
   Light "frost" design system. Independent from veltorra.es (dark editorial). */

:root {
  --paper: #f4f8fc;
  --card: #ffffff;
  --ink: #0b1f33;
  --muted: #4a6076;
  --line: #dce7f2;
  --frost: #e9f2fb;
  --sky: #1273e6;
  --sky-deep: #0a55b8;
  --cyan: #35c3f0;
  --navy: #07182b;
  --navy-2: #0c2340;
  --heat: #ff7a29;
  --heat-deep: #e5610f;
  --ok: #16a34a;
  --radius: 18px;
  --shadow: 0 10px 30px rgba(11, 31, 51, 0.08);
  --shadow-lg: 0 24px 60px rgba(11, 31, 51, 0.14);
  --font-head: 'Sora', 'Segoe UI', system-ui, sans-serif;
  --font-body: 'Inter', 'Segoe UI', system-ui, sans-serif;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-body);
  background: var(--paper);
  color: var(--ink);
  line-height: 1.6;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
body { overflow-x: hidden; }
.vc-hero > *, .vc-shero > *, .vc-price > *, .vc-contact > *, .vc-foot__grid > * { min-width: 0; }
a { color: var(--sky); text-decoration: none; }
a:hover { color: var(--sky-deep); }
ul, ol { list-style: none; }
h1, h2, h3 { font-family: var(--font-head); line-height: 1.18; letter-spacing: -0.015em; }
b, strong { font-weight: 600; }

/* ---------- topbar ---------- */
.vc-topbar {
  background: var(--navy);
  color: #cfe3f7;
  font-size: 13px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 7px clamp(16px, 4vw, 48px);
}
.vc-topbar a { color: #fff; font-weight: 500; }
.vc-topbar a:hover { color: var(--cyan); }
.vc-topbar__links { display: flex; gap: 18px; white-space: nowrap; }
.vc-topbar__area { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- header ---------- */
.vc-head {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  gap: 22px;
  padding: 10px clamp(16px, 4vw, 48px);
}
.vc-head.is-scrolled { box-shadow: var(--shadow); }
.vc-logo { display: flex; align-items: center; gap: 10px; color: var(--ink); flex-shrink: 0; }
.vc-logo__mark { color: var(--sky); }
.vc-logo__text { display: flex; flex-direction: column; line-height: 1.05; }
.vc-logo__text b { font-family: var(--font-head); font-size: 19px; letter-spacing: 0.06em; }
.vc-logo__text i { font-style: normal; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--sky); font-weight: 600; }

.vc-nav { display: flex; align-items: center; gap: 4px; flex: 1; min-width: 0; }
.vc-navitem { position: relative; display: flex; align-items: center; }
.vc-navlink {
  color: var(--ink);
  font-weight: 500;
  font-size: 14.5px;
  padding: 10px 6px 10px 12px;
  border-radius: 10px;
}
.vc-navlink:hover { color: var(--sky); }
.vc-ddbtn {
  background: none;
  border: 0;
  color: var(--muted);
  cursor: pointer;
  padding: 10px 8px 10px 2px;
  display: flex;
  align-items: center;
  transition: transform 0.2s;
}
.vc-navitem.is-open .vc-ddbtn { transform: rotate(180deg); color: var(--sky); }
.vc-dd {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  min-width: 300px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: var(--shadow-lg);
  padding: 10px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 0.18s, transform 0.18s, visibility 0.18s;
}
.vc-navitem.is-open .vc-dd,
.vc-navitem:hover .vc-dd,
.vc-navitem:focus-within .vc-dd { opacity: 1; visibility: visible; transform: translateY(0); }
.vc-dd li a {
  display: block;
  padding: 8px 12px;
  border-radius: 9px;
  color: var(--ink);
  font-size: 14px;
}
.vc-dd li a:hover { background: var(--frost); color: var(--sky-deep); }
.vc-dd__all a { font-weight: 600; color: var(--sky) !important; border-top: 1px solid var(--line); margin-top: 6px; padding-top: 12px !important; border-radius: 0 0 9px 9px; }
.vc-nav__sec { display: flex; gap: 2px; margin-left: 6px; }
.vc-nav__sec a { color: var(--muted); font-size: 14px; font-weight: 500; padding: 10px 9px; border-radius: 10px; }
.vc-nav__sec a:hover { color: var(--sky); }

.vc-head__actions { display: flex; align-items: center; gap: 14px; flex-shrink: 0; }

/* language dropdown */
.vc-langdd { position: relative; }
.vc-langdd__btn {
  display: flex; align-items: center; gap: 7px;
  background: var(--frost);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 7px 12px;
  cursor: pointer;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 12.5px;
  letter-spacing: 0.04em;
  color: var(--ink);
  transition: border-color 0.15s;
}
.vc-langdd__btn:hover { border-color: var(--sky); }
.vc-langdd__btn > svg:last-child { color: var(--muted); transition: transform 0.2s; }
.vc-langdd.is-open .vc-langdd__btn { border-color: var(--sky); }
.vc-langdd.is-open .vc-langdd__btn > svg:last-child { transform: rotate(180deg); }
.vc-flag { width: 21px; height: 14px; border-radius: 3px; flex-shrink: 0; box-shadow: 0 0 0 1px rgba(11, 31, 51, 0.1); }
.vc-langdd__menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 200px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: var(--shadow-lg);
  padding: 8px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 0.18s, transform 0.18s, visibility 0.18s;
  z-index: 130;
}
.vc-langdd.is-open .vc-langdd__menu { opacity: 1; visibility: visible; transform: translateY(0); }
.vc-langdd__menu a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 9px; color: var(--ink); font-size: 14px; }
.vc-langdd__menu a b { font-weight: 500; flex: 1; }
.vc-langdd__menu a i { font-style: normal; font-size: 11px; font-weight: 700; letter-spacing: 0.08em; color: var(--muted); }
.vc-langdd__menu a:hover { background: var(--frost); color: var(--ink); }
.vc-langdd__menu a.is-active { background: var(--frost); }
.vc-langdd__menu a.is-active::after { content: '✓'; color: var(--sky); font-weight: 700; }
.vc-cta {
  background: var(--heat);
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  padding: 10px 20px;
  border-radius: 999px;
  white-space: nowrap;
  transition: background 0.2s, transform 0.15s;
}
.vc-cta:hover { background: var(--heat-deep); color: #fff; transform: translateY(-1px); }
.vc-burger { display: none; background: none; border: 0; cursor: pointer; padding: 8px; }
.vc-burger span { display: block; width: 22px; height: 2px; background: var(--ink); margin: 5px 0; border-radius: 2px; transition: 0.25s; }

/* ---------- buttons ---------- */
.vc-btn {
  display: inline-block;
  font-weight: 600;
  font-size: 15px;
  padding: 13px 26px;
  border-radius: 999px;
  border: 2px solid transparent;
  cursor: pointer;
  transition: all 0.18s;
  text-align: center;
}
.vc-btn--heat { background: var(--heat); color: #fff; }
.vc-btn--heat:hover { background: var(--heat-deep); color: #fff; transform: translateY(-2px); box-shadow: 0 10px 24px rgba(255,122,41,.35); }
.vc-btn--line { background: transparent; color: var(--sky-deep); border-color: var(--sky); }
.vc-btn--line:hover { background: var(--sky); color: #fff; }
.vc-btn--ghost { background: rgba(255,255,255,.14); color: #fff; border-color: rgba(255,255,255,.4); }
.vc-btn--ghost:hover { background: #fff; color: var(--navy); }
.vc-btn--glass { background: rgba(255,255,255,.16); color: #fff; border-color: rgba(255,255,255,.35); backdrop-filter: blur(6px); }
.vc-btn--glass:hover { background: #fff; color: var(--sky-deep); }
.vc-btn--block { display: block; width: 100%; }

/* ---------- hero (home) ---------- */
.vc-hero {
  background-color: var(--navy);
  /* heavily overlaid, so a small variant is indistinguishable and much lighter */
  background-image:
    linear-gradient(128deg, rgba(7, 24, 43, 0.95) 0%, rgba(10, 58, 117, 0.92) 48%, rgba(18, 115, 230, 0.88) 82%, rgba(53, 195, 240, 0.82) 105%),
    url('/images/vc-interior-air-960.jpg');
  background-size: cover;
  background-position: center right;
  color: #fff;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.85fr);
  gap: clamp(24px, 5vw, 72px);
  align-items: center;
  padding: clamp(44px, 7vw, 92px) clamp(16px, 5vw, 72px);
  position: relative;
  overflow: hidden;
}
@supports (background-image: image-set(url('a.webp') type('image/webp'))) {
  .vc-hero {
    background-image:
      linear-gradient(128deg, rgba(7, 24, 43, 0.95) 0%, rgba(10, 58, 117, 0.92) 48%, rgba(18, 115, 230, 0.88) 82%, rgba(53, 195, 240, 0.82) 105%),
      image-set(url('/images/vc-interior-air-960.webp') type('image/webp'), url('/images/vc-interior-air-960.jpg') type('image/jpeg'));
  }
  @media (max-width: 700px) {
    .vc-hero {
      background-image:
        linear-gradient(128deg, rgba(7, 24, 43, 0.95) 0%, rgba(10, 58, 117, 0.92) 48%, rgba(18, 115, 230, 0.88) 82%, rgba(53, 195, 240, 0.82) 105%),
        image-set(url('/images/vc-interior-air-480.webp') type('image/webp'), url('/images/vc-interior-air-480.jpg') type('image/jpeg'));
    }
  }
}
.vc-hero::after {
  content: '❄';
  position: absolute;
  right: -40px;
  top: -60px;
  font-size: 340px;
  opacity: 0.05;
  pointer-events: none;
}
.vc-hero__eyebrow { font-size: 13px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--cyan); font-weight: 600; margin-bottom: 18px; }
.vc-hero h1 { font-size: clamp(30px, 4.4vw, 52px); font-weight: 700; margin-bottom: 18px; }
.vc-hero .vc-lead { color: #d9e9fa; font-size: clamp(16px, 1.6vw, 18.5px); max-width: 60ch; }
.vc-hero__bullets { margin: 22px 0 26px; display: grid; gap: 9px; }
.vc-hero__bullets li { padding-left: 28px; position: relative; color: #eaf4ff; font-weight: 500; font-size: 15.5px; }
.vc-hero__bullets li::before { content: '✓'; position: absolute; left: 0; top: 0; color: var(--cyan); font-weight: 700; }
.vc-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; }
.vc-hero__hint { margin-top: 16px; font-size: 13.5px; color: #a9c6e4; }
.vc-hero__card {
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.22);
  backdrop-filter: blur(14px);
  border-radius: 22px;
  padding: 26px;
  box-shadow: var(--shadow-lg);
}
.vc-hero__cardtitle { font-family: var(--font-head); font-weight: 600; font-size: 17px; margin-bottom: 16px; }
.vc-quick { display: grid; gap: 0; margin-bottom: 20px; }
.vc-quick li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; padding: 9px 0; border-bottom: 1px dashed rgba(255,255,255,.2); font-size: 14.5px; }
.vc-quick li span { color: #cfe3f7; }
.vc-quick li b { white-space: nowrap; }

/* ---------- trust strip ---------- */
.vc-trust {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  padding: 22px clamp(16px, 5vw, 72px);
  background: #fff;
  border-bottom: 1px solid var(--line);
}
.vc-trust__item { display: grid; gap: 2px; padding: 10px 14px; border-left: 3px solid var(--cyan); }
.vc-trust__item b { font-family: var(--font-head); font-size: 15.5px; }
.vc-trust__item span { color: var(--muted); font-size: 13.5px; }

/* ---------- sections ---------- */
.vc-sec { padding: clamp(44px, 6vw, 80px) clamp(16px, 5vw, 72px); max-width: 1280px; margin: 0 auto; }
.vc-sec--frost { background: var(--frost); max-width: none; }
.vc-sec--frost > * { max-width: 1136px; margin-left: auto; margin-right: auto; }
.vc-sec--navy { background: var(--navy); color: #fff; max-width: none; }
.vc-sec--navy > * { max-width: 1136px; margin-left: auto; margin-right: auto; }
.vc-sec--navy .vc-h2 { color: #fff; }
.vc-sec--navy .vc-lead { color: #c7dcf2; }
.vc-eyebrow { font-size: 12.5px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--sky); font-weight: 700; margin-bottom: 12px; }
.vc-sec--navy .vc-eyebrow { color: var(--cyan); }
.vc-h2 { font-size: clamp(24px, 3vw, 36px); font-weight: 700; margin-bottom: 16px; }
.vc-h2--table { margin-top: 40px; font-size: clamp(20px, 2.4vw, 27px); }
.vc-lead { color: var(--muted); font-size: clamp(15.5px, 1.5vw, 17.5px); max-width: 76ch; margin-bottom: 10px; }

/* ---------- TLDR + key facts ---------- */
.vc-tldr {
  background: linear-gradient(115deg, var(--frost), #fff);
  border: 1px solid var(--line);
  border-left: 4px solid var(--sky);
  border-radius: var(--radius);
  padding: 20px 24px;
  margin-bottom: 34px;
}
.vc-tldr__label { font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700; color: var(--sky); margin-bottom: 6px; }
.vc-tldr__text { font-size: 15.5px; color: var(--ink); }
.vc-keyfacts { margin-top: 34px; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px 26px; box-shadow: var(--shadow); }
.vc-keyfacts__title { font-family: var(--font-head); font-weight: 600; font-size: 15px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--sky-deep); margin-bottom: 12px; }
.vc-keyfacts__dl { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px 28px; }
.vc-keyfacts__dl > div { display: grid; grid-template-columns: auto 1fr; gap: 10px; padding: 8px 0; border-bottom: 1px dashed var(--line); align-items: baseline; }
.vc-keyfacts__dl dt { font-weight: 600; font-size: 13.5px; color: var(--muted); white-space: nowrap; }
.vc-keyfacts__dl dd { font-size: 14.5px; }

/* ---------- service hero ---------- */
.vc-shero {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.9fr);
  gap: clamp(24px, 4vw, 56px);
  align-items: center;
  padding: clamp(32px, 5vw, 64px) clamp(16px, 5vw, 72px);
  max-width: 1280px;
  margin: 0 auto;
}
.vc-shero h1 { font-size: clamp(27px, 3.6vw, 44px); font-weight: 700; margin: 10px 0 16px; }
.vc-shero__actions { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 22px; }
.vc-shero__hint { margin-top: 14px; font-size: 13.5px; color: var(--muted); }
.vc-shero__media { position: relative; }
.vc-shero__media img { border-radius: 22px; box-shadow: var(--shadow-lg); width: 100%; height: auto; object-fit: cover; aspect-ratio: 3/2; }
.vc-shero__price {
  position: absolute;
  left: 18px;
  bottom: 18px;
  background: #fff;
  border-radius: 14px;
  padding: 10px 18px;
  box-shadow: var(--shadow-lg);
  display: flex;
  flex-direction: column;
  line-height: 1.2;
}
.vc-shero__price span { font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.12em; color: var(--muted); font-weight: 600; }
.vc-shero__price b { font-family: var(--font-head); font-size: 22px; color: var(--sky-deep); }

.vc-crumbs { font-size: 13px; color: var(--muted); margin-bottom: 14px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.vc-crumbs i { font-style: normal; color: var(--line); }
.vc-crumbs a { color: var(--muted); }
.vc-crumbs a:hover { color: var(--sky); }
.vc-crumbs span { color: var(--ink); font-weight: 500; }

/* ---------- hub hero ---------- */
.vc-hubhero {
  background: linear-gradient(160deg, #fff 30%, var(--frost));
  border-bottom: 1px solid var(--line);
  padding: clamp(32px, 5vw, 60px) clamp(16px, 5vw, 72px);
}
.vc-hubhero > * { max-width: 1136px; margin-left: auto; margin-right: auto; }
.vc-hubhero h1 { font-size: clamp(28px, 3.8vw, 46px); font-weight: 700; margin: 8px 0 16px; }
.vc-hubhero__grid { display: block; }
.vc-hubhero--media .vc-hubhero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, 0.95fr);
  gap: clamp(24px, 4vw, 56px);
  align-items: center;
}
.vc-hubhero--media .vc-hubhero__copy { min-width: 0; }
.vc-hubhero--media h1 { font-size: clamp(26px, 3.3vw, 40px); }
.vc-hubhero__media img {
  border-radius: 20px;
  box-shadow: var(--shadow-lg);
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

/* ---------- benefit cards ---------- */
.vc-bens { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 18px; margin-top: 28px; }
.vc-ben {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 24px;
  box-shadow: var(--shadow);
  transition: transform 0.2s, box-shadow 0.2s;
  position: relative;
}
.vc-ben:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.vc-ben__n { font-family: var(--font-head); font-size: 13px; font-weight: 700; color: var(--cyan); letter-spacing: 0.1em; }
.vc-ben h3 { font-size: 17px; margin: 8px 0 8px; }
.vc-ben p { color: var(--muted); font-size: 14.5px; }
.vc-sec--navy .vc-ben, .vc-sec--frost .vc-ben { background: #fff; }
.vc-sec--navy .vc-ben { background: var(--navy-2); border-color: rgba(255,255,255,.12); }
.vc-sec--navy .vc-ben h3 { color: #fff; }
.vc-sec--navy .vc-ben p { color: #b9d0e8; }

/* ---------- steps ---------- */
.vc-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 16px; margin-top: 30px; counter-reset: step; }
.vc-step { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; position: relative; counter-increment: step; }
.vc-step::before {
  content: counter(step);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px; height: 34px;
  border-radius: 50%;
  background: var(--sky);
  color: #fff;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: 15px;
  margin-bottom: 12px;
}
.vc-step h3 { font-size: 16.5px; margin-bottom: 6px; }
.vc-step p { color: var(--muted); font-size: 14px; }
.vc-sec--navy .vc-step { background: var(--navy-2); border-color: rgba(255,255,255,.12); }
.vc-sec--navy .vc-step h3 { color: #fff; }
.vc-sec--navy .vc-step p { color: #b9d0e8; }
.vc-sec--navy .vc-step::before { background: var(--cyan); color: var(--navy); }

/* ---------- price panel ---------- */
.vc-price { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(260px, 0.9fr); gap: clamp(24px, 4vw, 56px); margin-top: 26px; align-items: start; }
.vc-price__from { display: block; font-size: 12.5px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--cyan); font-weight: 700; }
.vc-price__num { font-family: var(--font-head); font-size: clamp(42px, 6vw, 64px); font-weight: 700; line-height: 1.1; display: block; margin: 6px 0 12px; }
.vc-price__note { color: #c7dcf2; font-size: 15px; max-width: 52ch; }
.vc-price__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 22px; }
.vc-price__all { color: var(--cyan); font-weight: 600; }
.vc-price__all:hover { color: #fff; }
.vc-price__list { background: var(--navy-2); border: 1px solid rgba(255,255,255,.12); border-radius: var(--radius); padding: 22px 24px; display: grid; gap: 10px; }
.vc-price__listhead { font-family: var(--font-head); font-weight: 600; font-size: 13px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--cyan); margin-bottom: 4px; }
.vc-price__list li:not(.vc-price__listhead) { padding-left: 26px; position: relative; font-size: 14.5px; color: #dcebfa; }
.vc-price__list li:not(.vc-price__listhead)::before { content: '✓'; position: absolute; left: 0; color: var(--ok); font-weight: 700; }

/* ---------- signs ---------- */
.vc-signs { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 12px; margin-top: 26px; }
.vc-signs li {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px 18px 14px 44px;
  position: relative;
  font-size: 14.5px;
  font-weight: 500;
}
.vc-signs li::before { content: '→'; position: absolute; left: 16px; color: var(--heat); font-weight: 700; }

/* ---------- zone ---------- */
.vc-cities { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.vc-city { background: #fff; border: 1px solid var(--line); color: var(--sky-deep); font-weight: 600; font-size: 14px; padding: 8px 18px; border-radius: 999px; }

/* ---------- FAQ ---------- */
.vc-faq { display: grid; gap: 12px; margin-top: 24px; max-width: 860px; }
.vc-faq__item { background: var(--card); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.vc-faq__item summary {
  cursor: pointer;
  padding: 16px 48px 16px 20px;
  font-weight: 600;
  font-size: 15.5px;
  font-family: var(--font-head);
  list-style: none;
  position: relative;
}
.vc-faq__item summary::-webkit-details-marker { display: none; }
.vc-faq__item summary::after {
  content: '+';
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 22px;
  color: var(--sky);
  transition: transform 0.2s;
}
.vc-faq__item[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.vc-faq__item p { padding: 0 20px 18px; color: var(--muted); font-size: 14.5px; }
.vc-faq__more { margin-top: 18px; font-weight: 600; }

/* ---------- related ---------- */
.vc-related { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 16px; margin-top: 24px; }
.vc-rel {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 22px;
  color: var(--ink);
  display: grid;
  gap: 6px;
  transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
}
.vc-rel:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); border-color: var(--cyan); color: var(--ink); }
.vc-rel h3 { font-size: 16.5px; }
.vc-rel p { color: var(--muted); font-size: 14px; }
.vc-rel span { color: var(--sky); font-weight: 700; }

/* ---------- CTA band ---------- */
.vc-band { background: linear-gradient(120deg, var(--sky-deep), var(--sky) 60%, var(--cyan)); color: #fff; padding: clamp(40px, 6vw, 72px) clamp(16px, 5vw, 72px); }
.vc-band__inner { max-width: 900px; margin: 0 auto; text-align: center; }
.vc-band h2 { font-size: clamp(24px, 3.2vw, 38px); font-weight: 700; margin-bottom: 14px; }
.vc-band p { color: #e2f0fd; font-size: 16.5px; max-width: 62ch; margin: 0 auto 26px; }
.vc-band__actions { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 16px; }
.vc-band__tel { color: #fff; font-family: var(--font-head); font-weight: 600; font-size: 17px; }

/* ---------- tables ---------- */
.vc-tablewrap { overflow-x: auto; margin-top: 22px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--card); box-shadow: var(--shadow); }
.vc-table { width: 100%; border-collapse: collapse; font-size: 14.5px; min-width: 560px; }
.vc-table thead th {
  background: var(--navy);
  color: #fff;
  text-align: left;
  font-family: var(--font-head);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 13px 18px;
}
.vc-table tbody th, .vc-table tbody td { padding: 12px 18px; border-top: 1px solid var(--line); text-align: left; vertical-align: top; }
.vc-table tbody th { font-weight: 600; }
.vc-table tbody tr:nth-child(even) { background: var(--frost); }
.vc-table tbody tr:hover { background: #ddebfa; }
.vc-tablenote { margin-top: 14px; color: var(--muted); font-size: 14px; }

/* ---------- category cards (home) ---------- */
.vc-cats { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 20px; margin-top: 30px; }
.vc-cat { background: var(--card); border: 1px solid var(--line); border-top: 4px solid var(--sky); border-radius: var(--radius); padding: 0 26px 26px; box-shadow: var(--shadow); display: flex; flex-direction: column; overflow: hidden; }
.vc-cat__media { display: block; margin: 0 -26px 20px; }
.vc-cat__media img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.vc-cat:nth-child(2) { border-top-color: var(--heat); }
.vc-cat:nth-child(3) { border-top-color: var(--cyan); }
.vc-cat h3 { font-size: 20px; margin-bottom: 8px; }
.vc-cat h3 a { color: var(--ink); }
.vc-cat h3 a:hover { color: var(--sky); }
.vc-cat > p { color: var(--muted); font-size: 14.5px; margin-bottom: 14px; }
.vc-cat ul { display: grid; gap: 4px; margin-bottom: 18px; }
.vc-cat ul a { color: var(--ink); font-size: 14px; padding: 4px 0 4px 18px; display: block; position: relative; }
.vc-cat ul a::before { content: '›'; position: absolute; left: 2px; color: var(--cyan); font-weight: 700; }
.vc-cat ul a:hover { color: var(--sky); }
.vc-cat__go { margin-top: auto; font-weight: 600; font-size: 14.5px; }

/* ---------- service cards (hub) ---------- */
.vc-scards { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 18px; margin-top: 28px; }
.vc-scard {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 24px;
  color: var(--ink);
  display: flex;
  flex-direction: column;
  gap: 10px;
  box-shadow: var(--shadow);
  transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
}
.vc-scard:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: var(--cyan); color: var(--ink); }
.vc-scard__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.vc-scard h3 { font-size: 17px; }
.vc-scard__price { background: var(--frost); color: var(--sky-deep); font-weight: 700; font-size: 12.5px; padding: 5px 12px; border-radius: 999px; white-space: nowrap; }
.vc-scard p { color: var(--muted); font-size: 14px; flex: 1; }
.vc-scard__go { color: var(--sky); font-weight: 600; font-size: 14px; }

/* ---------- brands ---------- */
.vc-brandstrip { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.vc-brand { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 10px 22px; font-family: var(--font-head); font-weight: 600; font-size: 14.5px; color: var(--navy-2); }
.vc-brandgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; margin-top: 26px; }
.vc-brandcard { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; box-shadow: var(--shadow); }
.vc-brandcard h3 { font-size: 18px; margin-bottom: 8px; color: var(--sky-deep); }
.vc-brandcard p { color: var(--muted); font-size: 14px; }

/* ---------- notes ---------- */
.vc-noteblock { margin-top: 48px; }
.vc-notelist { display: grid; gap: 12px; margin-top: 18px; max-width: 860px; }
.vc-notelist li { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 14px 18px 14px 44px; position: relative; font-size: 14.5px; color: var(--muted); }
.vc-notelist li::before { content: 'ℹ'; position: absolute; left: 16px; color: var(--sky); font-weight: 700; }
.vc-notelist li b { color: var(--ink); }

/* ---------- contact ---------- */
.vc-contact {
  background: var(--navy);
  color: #fff;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 520px);
  gap: clamp(28px, 5vw, 72px);
  padding: clamp(44px, 6vw, 80px) clamp(16px, 5vw, 72px);
}
.vc-contact .vc-h2 { color: #fff; }
.vc-contact .vc-lead { color: #c7dcf2; }
.vc-contact .vc-eyebrow { color: var(--cyan); }
.vc-contact__pills { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.vc-contact__pills a { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.25); color: #fff; padding: 10px 22px; border-radius: 999px; font-weight: 600; font-size: 14.5px; }
.vc-contact__pills a:hover { background: #fff; color: var(--navy); }
.vc-contactgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.vc-ccard { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 24px; box-shadow: var(--shadow); color: var(--ink); display: grid; gap: 4px; transition: transform .2s, box-shadow .2s; }
.vc-ccard:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); color: var(--ink); }
.vc-ccard b { font-family: var(--font-head); font-size: 17px; color: var(--sky-deep); }
.vc-ccard span { font-weight: 600; font-size: 15.5px; }
.vc-ccard p { color: var(--muted); font-size: 13.5px; }
.vc-ministeps { display: grid; gap: 10px; margin-top: 24px; counter-reset: mini; }
.vc-ministeps li { counter-increment: mini; padding-left: 40px; position: relative; color: #dcebfa; font-size: 15px; }
.vc-ministeps li::before {
  content: counter(mini);
  position: absolute; left: 0; top: 0;
  width: 26px; height: 26px;
  border-radius: 50%;
  background: var(--cyan);
  color: var(--navy);
  font-weight: 700; font-size: 13px;
  display: flex; align-items: center; justify-content: center;
}

/* ---------- form ---------- */
.vc-form { background: #fff; border-radius: 20px; padding: 26px; color: var(--ink); box-shadow: var(--shadow-lg); display: grid; gap: 14px; align-self: start; }
.vc-form__modes { display: grid; grid-template-columns: 1fr 1fr; background: var(--frost); border-radius: 12px; padding: 4px; gap: 4px; }
.vc-form__mode { border: 0; background: transparent; padding: 9px; font-weight: 600; font-size: 14px; color: var(--muted); border-radius: 9px; cursor: pointer; font-family: var(--font-body); }
.vc-form__mode.is-active { background: #fff; color: var(--sky-deep); box-shadow: 0 1px 5px rgba(11,31,51,.14); }
.vc-field { display: grid; gap: 5px; }
.vc-field label { font-weight: 600; font-size: 13px; }
.vc-field label span { color: var(--muted); font-weight: 400; }
.vc-field input, .vc-field select, .vc-field textarea {
  border: 1.5px solid var(--line);
  border-radius: 10px;
  padding: 11px 13px;
  font-family: var(--font-body);
  font-size: 14.5px;
  color: var(--ink);
  background: #fff;
  width: 100%;
}
.vc-field input:focus, .vc-field select:focus, .vc-field textarea:focus { outline: none; border-color: var(--sky); box-shadow: 0 0 0 3px rgba(18,115,230,.14); }
.vc-hp { position: absolute; left: -9999px; opacity: 0; height: 0; }

/* custom file input — language-consistent, replaces the browser-locale native button */
.vc-file { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; position: relative; }
.vc-file__input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; clip: rect(0 0 0 0); }
.vc-file__btn {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--frost);
  border: 1.5px dashed var(--sky);
  color: var(--sky-deep);
  font-weight: 600;
  font-size: 13.5px;
  padding: 9px 16px;
  border-radius: 10px;
  cursor: pointer;
  transition: background 0.15s;
}
.vc-file__btn:hover { background: #ddebfa; }
.vc-file__input:focus-visible ~ .vc-file__btn { outline: 2px solid var(--sky); outline-offset: 2px; }
.vc-file__status { font-size: 12.5px; color: var(--muted); max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vc-file__status.has-files { color: var(--ink); font-weight: 500; }
.vc-form__submit { border: 2px solid transparent; font-family: var(--font-body); }
.vc-form__note { font-size: 12px; color: var(--muted); }
.vc-form__status { font-size: 14px; font-weight: 600; min-height: 1em; }
.vc-form__status.is-ok { color: var(--ok); }
.vc-form__status.is-err { color: #dc2626; }

/* ---------- prose (legal) ---------- */
.vc-sec--prose { max-width: 820px; }
.vc-sec--prose p { margin-bottom: 16px; color: var(--muted); font-size: 15px; }
.vc-sec--prose p b { color: var(--ink); }

/* ---------- footer ---------- */
.vc-foot { background: var(--navy); color: #b9d0e8; padding: clamp(40px, 5vw, 64px) clamp(16px, 5vw, 72px) 0; }
.vc-foot__grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr 1.1fr; gap: clamp(20px, 3vw, 44px); max-width: 1280px; margin: 0 auto; padding-bottom: 40px; }
.vc-foot__logo { font-family: var(--font-head); color: #fff; font-size: 19px; letter-spacing: 0.05em; }
.vc-foot__logo span { display: block; font-size: 11px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--cyan); font-weight: 600; }
.vc-foot__tag { font-size: 13.5px; margin: 14px 0 18px; max-width: 30ch; }
.vc-foot__cta { display: inline-block; background: var(--heat); color: #fff; font-weight: 600; font-size: 13.5px; padding: 9px 18px; border-radius: 999px; }
.vc-foot__cta:hover { background: var(--heat-deep); color: #fff; }
.vc-foot__h { font-family: var(--font-head); color: #fff; font-weight: 600; font-size: 13.5px; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 12px; }
.vc-foot__h a { color: #fff; }
.vc-foot__h a:hover { color: var(--cyan); }
.vc-foot__h--space { margin-top: 22px; }
.vc-foot__col ul { display: grid; gap: 6px; }
.vc-foot__col ul a { color: #b9d0e8; font-size: 13.5px; }
.vc-foot__col ul a:hover { color: var(--cyan); }
.vc-foot__contact li { font-size: 13.5px; }
.vc-foot__bottom {
  border-top: 1px solid rgba(255,255,255,.12);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px 24px;
  padding: 18px 0 22px;
  max-width: 1280px;
  margin: 0 auto;
  font-size: 12.5px;
  color: #7d99b8;
}
.vc-foot__bottom a { color: #b9d0e8; }
.vc-foot__bottom a:hover { color: var(--cyan); }

/* ---------- price calculator ---------- */
.vc-calc { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 1.1fr); gap: clamp(20px, 3vw, 40px); align-items: start; }
.vc-calc__form { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 26px; box-shadow: var(--shadow); display: grid; gap: 14px; }
.vc-calc__label { font-weight: 600; font-size: 14px; }
.vc-calc__form select { border: 1.5px solid var(--line); border-radius: 10px; padding: 11px 13px; font-family: var(--font-body); font-size: 15px; background: #fff; }
.vc-calc__room { display: flex; align-items: center; gap: 10px; background: var(--frost); border-radius: 10px; padding: 10px 14px; font-size: 14.5px; }
.vc-calc__room span { flex: 1; font-weight: 500; }
.vc-calc__room input { width: 76px; border: 1.5px solid var(--line); border-radius: 8px; padding: 8px 10px; font-family: var(--font-body); font-size: 15px; text-align: center; }
.vc-calc__room b { color: var(--muted); font-weight: 500; }
.vc-calc__check { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; color: var(--muted); cursor: pointer; }
.vc-calc__check input { margin-top: 3px; accent-color: var(--sky); width: 16px; height: 16px; }
.vc-calc__result { background: var(--navy); color: #fff; border-radius: var(--radius); padding: 26px; display: grid; gap: 12px; box-shadow: var(--shadow-lg); }
.vc-calc__rtitle { font-family: var(--font-head); font-weight: 600; font-size: 17px; }
.vc-calc__power { font-size: 13.5px; color: #b9d0e8; }
.vc-calc__power b { color: var(--cyan); }
.vc-calc__opt { background: var(--navy-2); border: 1px solid rgba(255,255,255,.12); border-radius: 14px; padding: 16px 18px; position: relative; }
.vc-calc__opt.is-best { border-color: var(--cyan); }
.vc-calc__badge { position: absolute; top: -9px; right: 14px; background: var(--cyan); color: var(--navy); font-size: 10.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; padding: 3px 10px; border-radius: 999px; }
.vc-calc__opt h3 { font-size: 15.5px; margin-bottom: 4px; }
.vc-calc__price { font-size: 13px; color: #b9d0e8; }
.vc-calc__price b { font-family: var(--font-head); font-size: 22px; color: #fff; margin-left: 4px; }
.vc-calc__note { font-size: 12.5px; color: #8fabc9; margin-top: 4px; }
.vc-calc__disclaimer { font-size: 12px; color: #8fabc9; }

/* ---------- cases ---------- */
.vc-cases { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 18px; margin-top: 8px; }
.vc-case { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 24px; box-shadow: var(--shadow); display: flex; flex-direction: column; gap: 12px; }
.vc-case__place { font-family: var(--font-head); font-weight: 600; font-size: 16px; color: var(--sky-deep); }
.vc-case__place span { color: var(--muted); font-family: var(--font-body); font-weight: 500; font-size: 13.5px; }
.vc-case dl { display: grid; gap: 10px; flex: 1; }
.vc-case dt { font-size: 11.5px; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700; color: var(--cyan); margin-bottom: 2px; }
.vc-case dd { font-size: 14px; color: var(--muted); }
.vc-case__meta { display: flex; justify-content: space-between; gap: 12px; border-top: 1px dashed var(--line); padding-top: 12px; font-size: 13px; color: var(--muted); flex-wrap: wrap; }
.vc-case__meta b { color: var(--ink); font-size: 15px; }

/* ---------- service-area map ---------- */
.vc-map { max-width: 640px; margin-top: 24px; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; box-shadow: var(--shadow); }
.vc-map svg { width: 100%; height: auto; display: block; }
.vc-map__sea { fill: #d5e9fa; }
.vc-map__coast { fill: none; stroke: var(--sky); stroke-width: 2.5; stroke-dasharray: 1 6; stroke-linecap: round; }
.vc-map__dot { fill: var(--sky); stroke: #fff; stroke-width: 2.5; transition: r 0.15s; cursor: pointer; }
.vc-map__dot--main { fill: var(--heat); }
.vc-map a:hover .vc-map__dot { r: 10; }
.vc-map__label { font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 600; fill: var(--ink); }
.vc-map__label--main { font-size: 15px; font-weight: 700; }

/* ---------- linked brand cards ---------- */
.vc-brandcard--link { display: flex; flex-direction: column; gap: 8px; color: var(--ink); transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s; }
.vc-brandcard--link:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); border-color: var(--cyan); color: var(--ink); }
.vc-brandcard--link .vc-scard__go { margin-top: auto; }

/* ---------- prose (guide articles) ---------- */
.vc-prose p { margin-bottom: 14px; color: var(--muted); font-size: 15.5px; max-width: 76ch; }
.vc-prose p b { color: var(--ink); }
.vc-prose ul, .vc-prose ol { margin: 14px 0; }
.vc-prose .vc-tablewrap { margin-bottom: 16px; }

/* ---------- sticky mobile CTA bar ---------- */
.vc-sticky { display: none; }
@media (max-width: 980px) {
  .vc-sticky {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 95;
    background: #fff;
    border-top: 1px solid var(--line);
    box-shadow: 0 -8px 24px rgba(11, 31, 51, 0.12);
    padding-bottom: env(safe-area-inset-bottom);
  }
  .vc-sticky__item {
    display: flex; flex-direction: column; align-items: center; gap: 3px;
    padding: 9px 4px 10px;
    font-size: 11.5px; font-weight: 600;
    color: var(--ink);
  }
  .vc-sticky__item svg { color: var(--sky); }
  .vc-sticky__item--wa svg { color: #25d366; }
  .vc-sticky__item--cta { background: var(--heat); color: #fff; }
  .vc-sticky__item--cta svg { color: #fff; }
  .vc-fab { display: none; }
  body { padding-bottom: 62px; }
  .vc-calc { grid-template-columns: 1fr; }
}

/* ---------- WhatsApp FAB ---------- */
.vc-fab {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 90;
  width: 56px; height: 56px;
  border-radius: 50%;
  background: #25d366;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 26px rgba(37, 211, 102, 0.45);
  transition: transform 0.2s;
}
.vc-fab:hover { transform: scale(1.08); color: #fff; }

/* ---------- responsive ---------- */
@media (max-width: 1120px) {
  .vc-nav__sec { display: none; }
}
@media (max-width: 980px) {
  .vc-topbar__area { display: none; }
  .vc-topbar { justify-content: center; }
  .vc-burger { display: block; }
  .vc-cta { display: none; }
  .vc-nav {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: #fff;
    z-index: 200;
    flex-direction: column;
    align-items: stretch;
    padding: 74px 20px 40px;
    overflow-y: auto;
    gap: 0;
  }
  body.nav-open .vc-nav { display: flex; }
  body.nav-open { overflow: hidden; }
  body.nav-open .vc-burger { position: fixed; top: 14px; right: 16px; z-index: 210; }
  body.nav-open .vc-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  body.nav-open .vc-burger span:nth-child(2) { opacity: 0; }
  body.nav-open .vc-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .vc-navitem { flex-wrap: wrap; border-bottom: 1px solid var(--line); }
  .vc-navlink { flex: 1; font-size: 16px; padding: 14px 4px; }
  .vc-ddbtn { padding: 14px 10px; }
  .vc-dd {
    position: static;
    display: none;
    opacity: 1; visibility: visible; transform: none;
    box-shadow: none; border: 0;
    width: 100%;
    padding: 0 0 12px;
  }
  .vc-navitem.is-open .vc-dd { display: block; }
  .vc-navitem:hover .vc-dd { display: none; }
  .vc-navitem.is-open:hover .vc-dd { display: block; }
  .vc-nav__sec { display: grid; margin: 8px 0 0; gap: 0; }
  .vc-nav__sec a { font-size: 16px; padding: 13px 4px; border-bottom: 1px solid var(--line); }
  .vc-hero { grid-template-columns: 1fr; }
  .vc-price { grid-template-columns: 1fr; }
  .vc-contact { grid-template-columns: 1fr; }
  .vc-shero { grid-template-columns: 1fr; }
  .vc-shero__media { order: -1; }
  .vc-trust { grid-template-columns: repeat(2, 1fr); }
  .vc-foot__grid { grid-template-columns: 1fr 1fr; }
  .vc-hubhero--media .vc-hubhero__grid { grid-template-columns: 1fr; }
  .vc-hubhero__media { order: -1; }
}
@media (max-width: 560px) {
  .vc-trust { grid-template-columns: 1fr; }
  .vc-foot__grid { grid-template-columns: 1fr; }
  .vc-topbar__links { flex-wrap: wrap; justify-content: center; }
  .vc-topbar__mail { display: none; }
  .vc-hero__actions .vc-btn, .vc-band__actions .vc-btn { width: 100%; }
  .vc-shero__actions .vc-btn { width: 100%; }
}