:root {
  --ink: #222222;
  --teal: #d7264e;
  --sea: #ff385c;
  --coral: #ff385c;
  --cream: #fff7f8;
  --sand: #ffd8df;
  --muted: #5f5f5f;
  --line: #e7e7e7;
  --shadow: 0 20px 55px rgba(34, 34, 34, .14);
}

body { background: #ffffff !important; color: #222222 !important; }
.top { background: #222222; }
.top b { color: #ff8fa3; }
header {
  background: rgba(255, 255, 255, .96) !important;
  border-bottom-color: #eeeeee !important;
}
.brand img,
img.brand-logo,
.footer-row img {
  filter: none;
}
footer .brand img,
footer .footer-brand-logo,
footer .footer-row img {
  filter: brightness(0) invert(1);
}
.brand img,
.logo-horizonte img,
.footer-row img {
  display: block;
  width: auto;
  height: 52px;
  max-width: min(280px, 72vw);
  object-fit: contain;
}
.logo-horizonte { display: inline-flex; align-items: center; }
.brand span,
.links a:hover,
.links a:focus-visible,
.footer-links a:hover { color: #ff385c !important; }
.btn.primary,
.btn:not(.ghost),
button.btn {
  background: linear-gradient(135deg, #ff385c, #e61e4d);
  box-shadow: 0 12px 28px rgba(255, 56, 92, .27);
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.btn.primary:hover,
.btn:not(.ghost):hover,
button.btn:hover {
  filter: saturate(1.12);
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(255, 56, 92, .32);
}
.hero-card,
.hero {
  background: linear-gradient(115deg, #fff7f8 0%, #ffd8df 50%, #ff8fa3 100%) !important;
}
h1,
h2,
h3 { color: #222222; }
.owners h1,
.owners h2,
.owners h3,
.dark h1,
.dark h2,
.dark h3,
footer h1,
footer h2,
footer h3 { color: #ffffff; }
.eyebrow,
.kicker { color: #d7264e; }
.search,
.card,
.paper,
.formbox,
.contactbox { border-color: rgba(255, 56, 92, .18); }
.card,
.review,
.step,
.contactbox,
.formbox,
.paper,
.owner-card,
.story-card,
.hero-card,
.panel,
.visual,
.bubble {
  box-shadow: 0 16px 42px rgba(255, 56, 92, .10);
}
.card:hover { border-color: rgba(255, 56, 92, .35); }
.paper,
.card,
.review,
.step,
.formbox,
.contactbox,
.owner-card,
.bubble,
.stat { background-color: #ffffff !important; }
.paper a,
.card a,
.intro a,
.text a { color: #d7264e; }
.badge,
.phone { color: #d7264e !important; }
.notice {
  background: #ffe9ee !important;
  border-left-color: #ff385c !important;
}
.listings,
.form-section,
.contact,
.privacy { background: #fff7f8; }
.privacy,
.listings,
.form-section,
.contact { background-color: #fff7f8 !important; }
.owners,
.dark,
footer { background: linear-gradient(145deg, #222222, #3a252a); }
.panel,
.hero-card:not(.hero .hero-card),
.visual:not(.hero .visual) {
  border-color: rgba(255, 56, 92, .2);
}
.cta-box { background: linear-gradient(120deg, #ff385c, #e61e4d); }
.icon,
.dot { background: #ffe5ea; color: #d7264e; }
.num,
.mark { background: #ff385c !important; color: #ffffff !important; }
.stat strong,
.stars,
.step span,
.meta { color: #ff385c !important; }
input:focus,
select:focus,
textarea:focus {
  border-color: #ff385c !important;
  box-shadow: 0 0 0 4px rgba(255, 56, 92, .10);
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid #ff8fa3;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .btn { transition: none; }
}

@media (max-width: 540px) {
  .brand img,
  .logo-horizonte img,
  .footer-row img { height: 44px; max-width: 66vw; }
}

/* Adaptación móvil común a todas las páginas */
html,
body { max-width: 100%; overflow-x: hidden; }
img,
video,
iframe { max-width: 100%; height: auto; }
input,
select,
textarea,
button { max-width: 100%; }
.btn,
button,
input,
select { min-height: 44px; }

@media (max-width: 900px) {
  .wrap { width: min(100% - 32px, 1180px) !important; }
  header { min-height: 70px; height: auto !important; padding: 9px 0; }
  .nav { gap: 12px !important; }
  .links,
  header nav {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }
  .grid,
  .hero-grid,
  .split,
  .story-grid,
  .contactbox,
  .formbox,
  .section-grid,
  .footer-grid,
  .footer-row { grid-template-columns: 1fr !important; }
  .hero-grid,
  .grid,
  .split,
  .story-grid,
  .contactbox,
  .formbox { gap: 32px !important; }
  .cards,
  .destinations,
  .review-grid,
  .four,
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .steps { grid-template-columns: 1fr !important; }
  .cta-box,
  .contact-card,
  .footer-row { flex-wrap: wrap; }
  .paper { padding: clamp(25px, 6vw, 46px) !important; }
}

@media (max-width: 620px) {
  .wrap { width: calc(100% - 28px) !important; }
  section,
  main { max-width: 100%; }
  section { padding-top: 56px !important; padding-bottom: 56px !important; }
  h1 { font-size: clamp(34px, 11vw, 46px) !important; overflow-wrap: anywhere; }
  h2 { font-size: clamp(29px, 9vw, 38px) !important; overflow-wrap: anywhere; }
  p,
  li { overflow-wrap: anywhere; }
  .brand img,
  .logo-horizonte img,
  .footer-row img { height: 40px; max-width: 68vw; }
  header { position: relative !important; top: auto !important; }
  header .nav { display: block !important; }
  header .brand { display: flex !important; justify-content: center; margin: 0 auto 10px !important; }
  header .links,
  header nav {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    max-width: none;
    gap: 4px 8px !important;
    overflow: visible !important;
    padding: 0 !important;
  }
  header .links a,
  header nav a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 7px 5px !important;
    border: 1px solid #f1d7de;
    border-radius: 10px;
    background: #fff7f8;
    color: #333333;
    text-align: center;
    line-height: 1.2;
    white-space: normal;
  }
  header .nav > .btn {
    display: flex !important;
    width: 100%;
    margin: 18px 0 8px !important;
  }
  header + main {
    padding-top: 18px !important;
  }
  .links { font-size: 12px !important; }
  .actions { display: none !important; }
  .cards,
  .destinations,
  .review-grid,
  .four,
  .stats,
  .benefits,
  .steps { grid-template-columns: 1fr !important; }
  .card { grid-template-columns: 1fr !important; }
  .card-body { display: block !important; padding: 21px !important; }
  .price {
    grid-column: 1 !important;
    grid-row: auto !important;
    min-width: 0 !important;
    border-left: 0 !important;
    border-top: 1px solid var(--line) !important;
    padding: 15px 0 0 !important;
    margin-top: 16px;
  }
  .search { grid-template-columns: 1fr !important; left: 14px !important; right: 14px !important; }
  .search .field:nth-child(4) { display: block !important; }
  .search .btn { grid-column: 1 !important; width: 100%; }
  form { grid-template-columns: 1fr !important; }
  form input,
  form select,
  form textarea,
  form .btn,
  form .note { grid-column: 1 !important; width: 100%; font-size: 16px; }
  .formbox,
  .contactbox,
  .owner-card,
  .panel,
  .paper,
  .cta-box { padding: 24px !important; border-radius: 20px !important; }
  .visual,
  .team-photo,
  .team-photo img { min-height: 300px !important; height: 300px !important; }
  .payment-logos,
  .hv-payment-strip > div { overflow-x: auto; flex-wrap: nowrap !important; padding-bottom: 8px; }
  .payment-logos img,
  .hv-payment-strip img { flex: 0 0 auto; }
  .hv-legal-links,
  .legal-links { gap: 10px 16px !important; }
  .paper a,
  .footer-grid a,
  .footer-links a,
  .hv-legal-links a,
  .legal-links a,
  .phone {
    display: inline-flex !important;
    align-items: center;
    min-height: 44px;
    padding-top: 8px;
    padding-bottom: 8px;
  }
}
