@import url('https://fonts.googleapis.com/css2?family=Unbounded:wght@300;400;500;600;700;800&display=swap');

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Unbounded', sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.75;
  letter-spacing: 0.01em;
  color: #1a2e3b;
  background: hsl(45 30% 97%);
}
h1, h2, h3, h4, h5, h6 { font-weight: 700; letter-spacing: 0.02em; line-height: 1.15; }
a { text-decoration: none; color: inherit; }
img { max-width: 100%; height: auto; }

.container { max-width: 1152px; margin: 0 auto; padding: 0 24px; }
.container-sm { max-width: 960px; margin: 0 auto; padding: 0 24px; }
.text-center { text-align: center; }

.text-gold-gradient {
  background: linear-gradient(135deg, #C9A84C 0%, #F0D080 50%, #C9A84C 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.text-sea-gradient {
  background: linear-gradient(135deg, #1a6b8a 0%, #2899c4 50%, #0d4f6e 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.gold-line {
  width: 60px; height: 3px;
  background: linear-gradient(90deg, #C9A84C, #F0D080);
  border-radius: 2px;
  margin: 0 auto 20px;
}

.btn-primary {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 16px 32px; border-radius: 9999px;
  background: #1a6b8a; color: #fff; font-weight: 600; font-size: 16px;
  border: none; cursor: pointer;
  box-shadow: 0 4px 16px rgba(26,107,138,.25);
  transition: all .3s;
}
.btn-primary:hover { background: #0d4f6e; transform: translateY(-2px); }

.btn-gold {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 16px 32px; border-radius: 9999px;
  background: #C9A84C; color: #fff; font-weight: 600; font-size: 16px;
  border: none; cursor: pointer;
  box-shadow: 0 4px 16px rgba(201,168,76,.25);
  transition: all .3s;
}
.btn-gold:hover { background: #b8943e; transform: translateY(-2px); }

.btn-outline {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 16px 32px; border-radius: 9999px;
  background: rgba(255,255,255,.15); color: #fff; font-weight: 600; font-size: 16px;
  border: 1px solid rgba(255,255,255,.4); cursor: pointer;
  backdrop-filter: blur(8px); transition: all .3s;
}
.btn-outline:hover { background: rgba(255,255,255,.25); }

.badge {
  display: inline-block; padding: 6px 16px; border-radius: 9999px;
  font-size: 11px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
}
.badge-gold { border: 1px solid rgba(240,208,128,.5); color: #F0D080; background: rgba(255,255,255,.1); }
.badge-sea { background: #e8f5fa; color: #1a6b8a; }
.badge-sold { background: #ef4444; color: #fff; font-size: 10px; padding: 2px 8px; }

/* ============ HEADER ============ */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  padding: 8px 0; transition: all .4s;
}
.site-header.scrolled {
  background: rgba(255,255,255,.95); backdrop-filter: blur(12px);
  box-shadow: 0 2px 16px rgba(0,0,0,.08); padding: 4px 0;
}
.header-inner {
  max-width: 1280px; margin: 0 auto; padding: 0 16px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.header-logo img { height: 80px; width: auto; object-fit: contain; }
.header-nav { display: flex; align-items: center; gap: 4px; }
.nav-item {
  padding: 8px 16px; border-radius: 8px; font-size: 14px; font-weight: 500;
  color: #fff; cursor: pointer; transition: .3s; position: relative;
}
.scrolled .nav-item { color: #1a2e3b; }
.nav-item:hover { background: rgba(255,255,255,.1); }
.scrolled .nav-item:hover { background: #f3f4f6; }
.nav-item.active { color: #F0D080; }
.scrolled .nav-item.active { color: #0d4f6e; background: #e8f5fa; }

.dropdown {
  position: absolute; top: 100%; left: 0; margin-top: 4px;
  min-width: 220px; background: #fff; border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0,0,0,.12); border: 1px solid #f3f4f6;
  padding: 8px 0; display: none; z-index: 50;
}
.nav-item:hover .dropdown { display: block; }
.dropdown a {
  display: block; padding: 12px 20px; font-size: 14px; color: #1a2e3b;
  transition: .2s;
}
.dropdown a:hover { background: #f5f9fc; }

.header-phone {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 20px; border-radius: 9999px; font-size: 14px; font-weight: 600;
  background: rgba(255,255,255,.2); color: #fff;
  border: 1px solid rgba(255,255,255,.4); backdrop-filter: blur(8px); transition: .3s;
}
.scrolled .header-phone {
  background: #1a6b8a; color: #fff; border-color: #1a6b8a;
  box-shadow: 0 2px 8px rgba(26,107,138,.2);
}

/* ============ HERO ============ */
.hero {
  position: relative; height: 100vh; min-height: 600px; max-height: 900px; overflow: hidden;
}
.hero-slide {
  position: absolute; inset: 0; transition: opacity 1s;
}
.hero-slide img { width: 100%; height: 100%; object-fit: cover; }
.hero-wash {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(10,30,50,.5) 0%, rgba(10,30,50,.3) 50%, rgba(10,30,50,.65) 100%);
}
.hero-content {
  position: relative; z-index: 10; height: 100%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 0 24px;
}
.hero h1 {
  color: #fff; margin-bottom: 24px; max-width: 960px;
  font-size: clamp(2rem, 5.5vw, 4.5rem); line-height: 1.15;
}
.hero-subtitle {
  color: rgba(255,255,255,.8); font-size: 1.15rem; max-width: 640px;
  margin-bottom: 40px; line-height: 1.6;
}
.hero-buttons { display: flex; gap: 16px; flex-wrap: wrap; justify-content: center; }
.hero-dots {
  position: absolute; bottom: 32px; left: 0; right: 0;
  display: flex; justify-content: center; gap: 8px; z-index: 10;
}
.hero-dot {
  height: 6px; border-radius: 9999px; border: none; cursor: pointer; transition: .3s;
}
.hero-dot.active { width: 32px; background: #F0D080; }
.hero-dot.inactive { width: 8px; background: rgba(255,255,255,.4); }
.hero-scroll {
  position: absolute; bottom: 32px; right: 32px;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  color: rgba(255,255,255,.5); z-index: 10;
}
.hero-scroll span { font-size: 12px; letter-spacing: .15em; text-transform: uppercase; writing-mode: vertical-rl; }
.hero-scroll-line { width: 1px; height: 40px; background: rgba(255,255,255,.3); }

/* ============ STATS ============ */
.section-sea {
  background: linear-gradient(135deg, #0d4f6e 0%, #1a6b8a 50%, #116e8a 100%);
  padding: 56px 0;
}
.stats-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.stat-card {
  background: rgba(255,255,255,.12); backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,.25); border-radius: 20px;
  padding: 24px; text-align: center; transition: background .25s;
}
.stat-card:hover { background: rgba(255,255,255,.2); }
.stat-val { font-size: 1.8rem; font-weight: 700; margin-bottom: 8px; }
.stat-label { color: rgba(255,255,255,.7); font-size: 14px; }

/* ============ SECTION SAND ============ */
.section-sand {
  background: linear-gradient(135deg, #FDF8F0 0%, #F5EDD8 100%);
  padding: 96px 0;
}

/* ============ REGIONS ============ */
.regions-section { padding: 96px 0; }
.card-sea {
  border-radius: 24px; background: #fff;
  box-shadow: 0 4px 24px rgba(26,107,138,.1);
  transition: transform .25s, box-shadow .25s;
}
.card-sea:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(26,107,138,.18); }

.region-card {
  padding: 32px;
  margin-bottom: 48px;
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
}
.region-header { display: flex; align-items: center; gap: 16px; margin-bottom: 8px; }
.region-icon {
  width: 40px; height: 40px; border-radius: 50%;
  background: rgba(26,107,138,.1); display: flex; align-items: center; justify-content: center;
  color: #1a6b8a;
}
.region-name { font-size: 1.5rem; color: #1a2e3b; }
.region-desc { color: #4a6070; margin-bottom: 24px; margin-left: 56px; }

.projects-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.project-card {
  overflow: hidden; border-radius: 16px; border: 1px solid #e8f5fa;
  transition: all .3s; cursor: pointer;
}
.project-card:hover { border-color: rgba(201,168,76,.4); box-shadow: 0 8px 24px rgba(0,0,0,.1); }
.project-img {
  position: relative; height: 176px; overflow: hidden;
}
.project-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s; }
.project-card:hover .project-img img { transform: scale(1.05); }
.project-img .hero-wash { position: absolute; inset: 0; }
.project-badge {
  position: absolute; top: 12px; left: 12px;
  padding: 4px 10px; border-radius: 9999px; font-size: 10px; font-weight: 600;
  background: #C9A84C; color: #fff;
}
.project-name {
  position: absolute; bottom: 12px; left: 12px; right: 12px;
  color: #fff; font-size: 1.1rem; font-weight: 700;
}
.project-info { padding: 16px; }
.project-price { color: #1a6b8a; font-weight: 700; font-size: 1.1rem; margin-bottom: 8px; }
.project-link { color: #4a6070; font-size: 14px; display: flex; align-items: center; gap: 8px; }

.coming-soon {
  margin-left: 56px; padding: 32px; border-radius: 16px;
  background: rgba(232,245,250,.5); border: 1px dashed rgba(26,107,138,.2);
  text-align: center;
}
.coming-soon-title { color: #1a6b8a; font-weight: 600; margin-bottom: 4px; }
.coming-soon-text { color: #4a6070; font-size: 14px; }

/* ============ ADVANTAGES ============ */
.advantages-section {
  position: relative; padding: 96px 24px; overflow: hidden;
}
.advantages-bg {
  position: absolute; inset: 0;
}
.advantages-bg img { width: 100%; height: 100%; object-fit: cover; }
.advantages-overlay { position: absolute; inset: 0; background: rgba(3,19,29,.8); }
.advantages-content { position: relative; z-index: 10; }
.advantages-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.advantage-card {
  padding: 32px; border-radius: 24px;
  background: rgba(10,35,51,.9); border: 1px solid rgba(26,107,138,.3);
  transition: all .3s;
}
.advantage-card:hover { border-color: rgba(201,168,76,.4); background: rgba(13,43,64,.95); }
.advantage-icon {
  width: 56px; height: 56px; border-radius: 16px;
  background: rgba(201,168,76,.15); border: 1px solid rgba(201,168,76,.4);
  display: flex; align-items: center; justify-content: center;
  color: #F0D080; margin-bottom: 16px;
}
.advantage-title { color: #fff; font-weight: 700; font-size: 1.1rem; margin-bottom: 8px; }
.advantage-text { color: rgba(255,255,255,.75); font-size: 14px; line-height: 1.6; }

/* ============ STEPS ============ */
.steps-section { padding: 96px 0; background: #fff; }
.steps-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.step-card { padding: 24px; text-align: center; }
.step-num { font-size: 3rem; font-weight: 700; margin-bottom: 16px; line-height: 1; }
.step-title { color: #1a2e3b; font-weight: 700; font-size: 16px; margin-bottom: 12px; }
.step-text { color: #4a6070; font-size: 14px; line-height: 1.6; }

/* ============ GOV SUPPORT ============ */
.gov-section {
  position: relative; padding: 96px 24px; overflow: hidden;
}
.gov-bg { position: absolute; inset: 0; }
.gov-bg img { width: 100%; height: 100%; object-fit: cover; }
.gov-overlay { position: absolute; inset: 0; background: rgba(3,19,29,.85); }
.gov-content { position: relative; z-index: 10; }
.gov-grid { display: grid; grid-template-columns: 1fr; gap: 32px; align-items: center; }
.gov-law-card {
  border-radius: 24px; background: rgba(255,255,255,.15);
  backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,.2);
  padding: 40px;
}
.gov-law-title { color: #F0D080; font-size: 1.6rem; font-weight: 700; margin-bottom: 24px; line-height: 1.3; }
.gov-law-text { color: rgba(255,255,255,.9); font-size: 16px; line-height: 1.6; margin-bottom: 24px; }
.gov-law-ref { color: rgba(255,255,255,.75); font-size: 14px; line-height: 1.6; }
.gov-cards { display: flex; flex-direction: column; gap: 20px; }
.gov-card {
  display: flex; align-items: flex-start; gap: 16px;
  border-radius: 16px; background: rgba(255,255,255,.1);
  backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,.15);
  padding: 20px;
}
.gov-card-icon { font-size: 1.5rem; flex-shrink: 0; margin-top: 2px; }
.gov-card-title { color: #fff; font-weight: 700; font-size: 14px; margin-bottom: 4px; }
.gov-card-text { color: rgba(255,255,255,.7); font-size: 12px; line-height: 1.5; }

/* ============ GALLERY ============ */
.gallery-section { padding: 80px 0; overflow: hidden; }
@keyframes slideLeft {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.carousel-track {
  display: flex; gap: 16px;
  animation: slideLeft 30s linear infinite;
}
.carousel-track:hover { animation-play-state: paused; }
.gallery-item {
  flex-shrink: 0; width: 256px; height: 192px;
  border-radius: 16px; overflow: hidden; position: relative;
}
.gallery-item img { width: 100%; height: 100%; object-fit: cover; }
.gallery-label {
  position: absolute; inset: auto 0 0 0;
  background: linear-gradient(to top, rgba(0,0,0,.7), transparent);
  padding: 8px 12px;
}
.gallery-label span { color: #fff; font-size: 12px; font-weight: 600; }

/* ============ CONTACTS ============ */
.contacts-section {
  position: relative; padding: 96px 24px; overflow: hidden;
}
.contacts-bg { position: absolute; inset: 0; }
.contacts-bg img { width: 100%; height: 100%; object-fit: cover; }
.contacts-overlay { position: absolute; inset: 0; background: rgba(3,19,29,.8); }
.contacts-content { position: relative; z-index: 10; text-align: center; }
.contacts-grid {
  display: grid; grid-template-columns: 1fr; gap: 24px;
  max-width: 640px; margin: 0 auto 48px;
}
.contact-card {
  display: flex; align-items: center; gap: 16px; padding: 24px;
  border-radius: 24px; background: rgba(10,35,51,.9);
  border: 1px solid rgba(26,107,138,.3); transition: all .3s; cursor: pointer;
}
.contact-card:hover { border-color: rgba(201,168,76,.4); background: rgba(13,43,64,.95); }
.contact-icon {
  width: 48px; height: 48px; border-radius: 50%;
  background: rgba(201,168,76,.2); border: 1px solid rgba(201,168,76,.4);
  display: flex; align-items: center; justify-content: center;
  color: #F0D080; flex-shrink: 0;
}
.contact-label { color: rgba(255,255,255,.6); font-size: 12px; margin-bottom: 4px; }
.contact-value { color: #fff; font-weight: 700; font-size: 1.1rem; }
.contacts-tags {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 32px;
  color: rgba(255,255,255,.7); font-size: 14px;
}
.contacts-tags span { display: flex; align-items: center; gap: 8px; }

/* ============ FOOTER ============ */
.footer-sea {
  background: linear-gradient(135deg, #0a1e32 0%, #0d2a42 100%);
  color: #fff; padding: 64px 0;
}
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 40px; }
.footer-desc { color: rgba(255,255,255,.65); font-size: 14px; line-height: 1.6; max-width: 320px; }
.footer-heading {
  color: #F0D080; font-weight: 600; font-size: 14px;
  letter-spacing: .15em; text-transform: uppercase; margin-bottom: 20px;
}
.footer-links { list-style: none; }
.footer-links li { margin-bottom: 12px; }
.footer-links a { color: rgba(255,255,255,.65); font-size: 14px; transition: color .2s; }
.footer-links a:hover { color: #fff; }
.footer-contact { display: flex; align-items: center; gap: 8px; color: rgba(255,255,255,.8); font-size: 14px; margin-top: 24px; transition: color .2s; }
.footer-contact:hover { color: #F0D080; }
.footer-bottom {
  margin-top: 48px; padding-top: 32px; border-top: 1px solid rgba(255,255,255,.1);
  display: flex; align-items: center; justify-content: space-between;
}
.footer-copy { color: rgba(255,255,255,.4); font-size: 12px; }
.footer-regions { color: rgba(255,255,255,.3); font-size: 12px; }
.footer-check { display: flex; align-items: flex-start; gap: 8px; font-size: 14px; color: rgba(255,255,255,.65); margin-bottom: 12px; }
.footer-check svg { color: #C9A84C; flex-shrink: 0; margin-top: 2px; }
.badge-soon {
  font-size: 10px; padding: 2px 8px; border-radius: 9999px;
  background: rgba(201,168,76,.2); color: #F0D080;
}

/* ============ PROJECT HERO (left-aligned) ============ */
.hero-left .hero-content {
  align-items: flex-start; text-align: left; justify-content: flex-end;
  padding-bottom: 96px; max-width: 1280px; margin: 0 auto;
}
.hero-left h1 { font-size: clamp(2rem, 5vw, 4rem); }
.hero-left .hero-subtitle { margin-bottom: 32px; }

/* ============ PRICE BANNER ============ */
.price-banner {
  background: #C9A84C; padding: 20px 0;
}
.price-banner-inner {
  max-width: 960px; margin: 0 auto; padding: 0 24px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  flex-wrap: wrap;
}
.price-banner-title { color: #fff; font-weight: 700; font-size: 1.15rem; }
.price-banner-title span { font-size: 1.5rem; }
.price-banner-sub { color: rgba(255,255,255,.8); font-size: 15px; }
.btn-banner {
  display: inline-flex; padding: 10px 24px; border-radius: 9999px;
  background: #fff; color: #C9A84C; font-weight: 700; font-size: 14px;
  border: none; cursor: pointer; transition: .2s; white-space: nowrap;
}
.btn-banner:hover { background: #f9f9f9; }

/* ============ GRID UTILITIES ============ */
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.grid-2-lg { display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px; }
.grid-2-3 { display: grid; grid-template-columns: 1fr 2fr; gap: 24px; }
.grid-3-poi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

/* ============ PLOT CARDS ============ */
.plot-card {
  border-radius: 24px; background: #fff; padding: 24px; position: relative;
  box-shadow: 0 4px 24px rgba(26,107,138,.1); transition: transform .25s, box-shadow .25s;
}
.plot-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(26,107,138,.18); }
.plot-card.sold { opacity: .6; }
.badge-status {
  position: absolute; top: 16px; right: 16px;
  font-size: 10px; font-weight: 700; padding: 4px 10px; border-radius: 4px;
  text-transform: uppercase; letter-spacing: .08em;
}
.badge-active { background: #22c55e; color: #fff; }
.badge-reserved { background: #facc15; color: #713f12; }
.badge-sold { background: #ef4444; color: #fff; }
.plot-num { font-size: 1.5rem; font-weight: 700; color: #1a2e3b; margin-bottom: 8px; }
.plot-price { color: #1a6b8a; font-weight: 700; font-size: 1.15rem; margin-bottom: 12px; }
.plot-status-dot {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 8px;
}
.plot-meta { color: #4a6070; font-size: 12px; }

/* ============ PLOT SIDEBAR ============ */
.plot-sidebar {
  width: 300px; background: #fff; flex-shrink: 0; border-right: 1px solid #e8f5fa;
  display: flex; flex-direction: column;
}
.plot-sidebar-header {
  padding: 12px 16px; border-bottom: 1px solid #e8f5fa;
  display: flex; align-items: center; justify-content: space-between;
  font-size: 14px; font-weight: 600; color: #1a2e3b;
}
.plot-sidebar-list { overflow-y: auto; flex: 1; }
.plot-sidebar-item {
  padding: 12px 16px; border-bottom: 1px solid #f0f4f6; transition: background .15s;
}
.plot-sidebar-item:hover { background: #f7fbfd; }

/* ============ FEATURE CARDS (DARK BG) ============ */
.feature-dark {
  padding: 28px; border-radius: 24px;
  background: rgba(10,35,51,.9); border: 1px solid rgba(26,107,138,.3);
  transition: all .3s;
}
.feature-dark:hover { border-color: rgba(201,168,76,.4); background: rgba(13,43,64,.95); }
.feature-dark-icon {
  width: 48px; height: 48px; border-radius: 16px;
  background: rgba(201,168,76,.15); border: 1px solid rgba(201,168,76,.4);
  display: flex; align-items: center; justify-content: center; color: #F0D080;
  margin-bottom: 16px;
}
.feature-dark h3 { color: #fff; font-weight: 700; font-size: 16px; margin-bottom: 8px; }
.feature-dark p { color: rgba(255,255,255,.75); font-size: 14px; line-height: 1.6; }

/* ============ NATURE / INFO CARDS ============ */
.info-card {
  border-radius: 24px; background: #fff; padding: 32px;
  box-shadow: 0 4px 24px rgba(26,107,138,.1); transition: transform .25s, box-shadow .25s;
}
.info-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(26,107,138,.18); }
.info-card-icon {
  width: 40px; height: 40px; border-radius: 12px;
  background: #e8f5fa; display: flex; align-items: center; justify-content: center;
  font-size: 1.25rem; margin-bottom: 12px;
}
.info-card h3 { color: #1a2e3b; font-weight: 700; font-size: 16px; margin-bottom: 8px; }
.info-card p { color: #4a6070; font-size: 14px; line-height: 1.6; }

/* ============ CLIMATE GRID ============ */
.climate-item {
  text-align: center; padding: 16px; border-radius: 16px; background: #f7fbfd;
}
.climate-val { font-size: 1.1rem; font-weight: 700; color: #1a6b8a; margin-bottom: 4px; }
.climate-label { font-size: 14px; font-weight: 600; color: #1a2e3b; }
.climate-sub { font-size: 12px; color: #4a6070; margin-top: 4px; }

/* ============ DISTANCES ============ */
.distance-row {
  display: flex; align-items: center; gap: 16px; margin-bottom: 16px;
}
.distance-val { width: 64px; text-align: center; color: #1a6b8a; font-weight: 700; font-size: 14px; }
.distance-line { flex: 1; height: 1px; background: #e8f5fa; }
.distance-label { color: #4a6070; font-size: 14px; }

/* ============ BULLET LIST ============ */
.bullet-gold {
  width: 8px; height: 8px; border-radius: 50%; background: #C9A84C; flex-shrink: 0; margin-top: 8px;
}
.bullet-item { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px; font-size: 14px; color: #4a6070; }
.bullet-item strong { color: #1a2e3b; }

/* ============ POI CARDS ============ */
.poi-card {
  border-radius: 16px; overflow: hidden; background: #fff;
  box-shadow: 0 4px 24px rgba(26,107,138,.1); transition: transform .25s, box-shadow .25s;
}
.poi-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(26,107,138,.18); }
.poi-card-img { height: 144px; overflow: hidden; }
.poi-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.poi-card:hover .poi-card-img img { transform: scale(1.05); }
.poi-card-body { padding: 16px; }
.poi-card h4 { color: #1a2e3b; font-weight: 700; font-size: 14px; margin-bottom: 4px; }
.poi-card p { color: #4a6070; font-size: 12px; }

/* ============ CADASTRAL ============ */
.cadastral-badge {
  display: inline-block; padding: 6px 16px; border-radius: 9999px;
  font-size: 12px; font-weight: 600; letter-spacing: .15em; text-transform: uppercase;
  background: #e8f5fa; color: #1a6b8a; margin-bottom: 16px;
}
.doc-image {
  border-radius: 24px; overflow: hidden;
  box-shadow: 0 8px 32px rgba(0,0,0,.12); border: 1px solid #e8f5fa;
  margin-bottom: 12px;
}
.doc-image img { width: 100%; height: auto; display: block; }
.doc-caption { color: #4a6070; font-size: 14px; text-align: center; font-style: italic; }

/* ============ GALLERY (with thumbnails) ============ */
.gallery-main {
  border-radius: 24px; overflow: hidden; height: 320px; position: relative;
  box-shadow: 0 8px 32px rgba(0,0,0,.12); margin-bottom: 16px;
}
.gallery-main img { width: 100%; height: 100%; object-fit: cover; }
.gallery-main-label {
  position: absolute; inset: auto 0 0 0;
  background: linear-gradient(to top, rgba(0,0,0,.6), transparent);
  padding: 16px 24px;
}
.gallery-main-label span { color: #fff; font-weight: 700; font-size: 16px; }
.gallery-thumbs { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
.gallery-thumbs-scroll { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 8px; }
.gallery-thumb {
  border-radius: 12px; overflow: hidden; height: 64px; cursor: pointer;
  opacity: .7; transition: .2s; border: 2px solid transparent;
}
.gallery-thumb.active { opacity: 1; border-color: #C9A84C; box-shadow: 0 2px 8px rgba(0,0,0,.15); }
.gallery-thumb:hover { opacity: 1; }
.gallery-thumb img { width: 100%; height: 100%; object-fit: cover; }
.gallery-thumb-flex { flex-shrink: 0; width: 96px; height: 64px; }

/* ============ CHART BARS ============ */
.chart-container {
  display: flex; align-items: flex-end; gap: 12px; height: 256px;
}
.chart-bar-wrap { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 8px; height: 100%; justify-content: flex-end; }
.chart-bar {
  width: 100%; border-radius: 12px 12px 0 0; min-height: 8px;
  transition: height .7s;
}
.chart-bar-sea { background: linear-gradient(to top, #0d4f6e, #1a6b8a); }
.chart-bar-gold { background: linear-gradient(to top, #b8943e, #F0D080); }
.chart-bar-label { font-size: 12px; font-weight: 700; text-align: center; }
.chart-years {
  display: flex; gap: 12px; margin-left: 84px; margin-top: 8px;
}
.chart-year { flex: 1; text-align: center; font-size: 14px; font-weight: 600; color: #4a6070; }
.chart-prices {
  display: flex; gap: 12px; margin-left: 84px; margin-top: 8px;
}
.chart-price { flex: 1; text-align: center; font-size: 12px; font-weight: 700; border-radius: 8px; padding: 8px 0; }
.chart-price-sea { color: #1a6b8a; }
.chart-price-gold { background: rgba(201,168,76,.15); color: #C9A84C; }
.chart-note {
  display: flex; align-items: flex-start; gap: 12px;
  background: #e8f5fa; border-radius: 16px; padding: 16px; margin-top: 24px;
}
.chart-note p { color: #4a6070; font-size: 14px; line-height: 1.6; }
.chart-note strong { color: #1a2e3b; }

/* ============ EXPANSION TIMELINE ============ */
.timeline-card {
  border-radius: 16px; padding: 20px; text-align: center; border-width: 2px; border-style: solid;
}
.timeline-year { font-size: 1.5rem; font-weight: 700; margin-bottom: 4px; }
.timeline-label { font-weight: 600; font-size: 14px; margin-bottom: 4px; }
.timeline-note { font-size: 12px; color: #4a6070; }

/* ============ SUCCESS CASES TABLE ============ */
.data-table {
  width: 100%; border-collapse: collapse;
  border-radius: 24px; overflow: hidden;
  box-shadow: 0 8px 32px rgba(0,0,0,.08); border: 1px solid #e8f5fa;
}
.data-table thead tr {
  background: linear-gradient(135deg, #1a6b8a, #134f68);
}
.data-table th {
  text-align: left; padding: 16px 24px; color: #fff; font-weight: 600; font-size: 14px;
}
.data-table td {
  padding: 16px 24px; font-size: 14px;
}
.data-table tbody tr { border-bottom: 1px solid #f0f0f0; }
.data-table tbody tr:nth-child(even) { background: #f8fbfd; }
.data-table .growth-badge {
  display: inline-block; padding: 4px 12px; border-radius: 9999px;
  font-size: 14px; font-weight: 700; background: #e8f5fa; color: #1a6b8a;
}

/* ============ SUMMARY TABLE ============ */
.summary-table {
  width: 100%; border-collapse: collapse; font-size: 14px;
}
.summary-table th {
  text-align: left; padding: 12px; font-weight: 700; color: #1a2e3b;
  border-bottom: 2px solid #e8f5fa;
}
.summary-table th:last-child, .summary-table th:nth-child(4) { text-align: right; }
.summary-table td { padding: 12px; border-bottom: 1px solid #f0f0f0; }
.summary-table td:last-child, .summary-table td:nth-child(4) { text-align: right; }
.summary-table .highlight-row { background: #fdf8f0; }
.summary-total {
  margin-top: 24px; padding: 20px; border-radius: 16px; text-align: center;
  background: linear-gradient(135deg, rgba(26,107,138,.08), rgba(201,168,76,.08));
}

/* ============ PRICE COMPARISON BARS ============ */
.compare-bar-wrap { margin-bottom: 16px; }
.compare-bar-header {
  display: flex; justify-content: space-between; font-size: 14px; margin-bottom: 8px;
}
.compare-bar-header .label { font-weight: 600; color: #1a2e3b; }
.compare-bar-header .value { font-weight: 700; color: #4a6070; }
.compare-bar {
  height: 40px; background: #f0f0f0; border-radius: 9999px; overflow: hidden;
}
.compare-bar-fill {
  height: 100%; border-radius: 9999px; display: flex; align-items: center; justify-content: flex-end; padding-right: 16px;
}
.compare-bar-fill span { color: #fff; font-weight: 700; font-size: 14px; }
.compare-bar-fill.sea { background: #1a6b8a; }
.compare-bar-fill.gray { background: #4a6070; }
.compare-savings {
  display: inline-block; padding: 12px 24px; border-radius: 9999px;
  background: rgba(201,168,76,.15); color: #C9A84C; font-weight: 700; font-size: 1.1rem;
}

/* ============ INVESTMENT STAGES ============ */
.stage-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.stage-tab {
  padding: 10px 20px; border-radius: 16px; font-size: 14px; font-weight: 600;
  cursor: pointer; border: 2px solid #e8f5fa; background: #fff; color: #4a6070;
  transition: all .2s;
}
.stage-tab.active { background: #1a6b8a; color: #fff; border-color: #1a6b8a; }
.stage-tab.active-gold { background: #C9A84C; color: #fff; border-color: #C9A84C; }

/* ============ BEACH SECTION ============ */
.beach-section {
  position: relative; height: 520px; overflow: hidden;
}
.beach-section img.beach-bg {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
}
.beach-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to right, rgba(26,46,59,.85) 40%, rgba(26,46,59,.2));
}
.beach-content {
  position: relative; z-index: 10; height: 100%;
  display: flex; align-items: center; padding: 0 24px;
  max-width: 1152px; margin: 0 auto;
}
.beach-inner { max-width: 540px; }
.beach-check {
  display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px;
}
.beach-check-icon {
  width: 20px; height: 20px; border-radius: 50%; background: #C9A84C;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 2px;
}
.beach-check span { color: rgba(255,255,255,.85); font-size: 16px; }

/* ============ ADV ICON ============ */
.adv-icon {
  width: 44px; height: 44px; border-radius: 12px;
  background: #e8f5fa; display: flex; align-items: center; justify-content: center;
  color: #1a6b8a; flex-shrink: 0;
}

/* ============ CHECKLIST (green box) ============ */
.checklist-item {
  display: flex; align-items: flex-start; gap: 12px;
}
.checklist-icon {
  width: 24px; height: 24px; border-radius: 4px; background: #1a6b8a;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 2px;
}

/* ============ LANDSCAPE CARDS ============ */
.landscape-card {
  border-radius: 24px; overflow: hidden; background: #fff;
  box-shadow: 0 4px 24px rgba(26,107,138,.1); transition: transform .25s, box-shadow .25s;
}
.landscape-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(26,107,138,.18); }
.landscape-card-img { height: 208px; overflow: hidden; }
.landscape-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s; }
.landscape-card:hover .landscape-card-img img { transform: scale(1.1); }
.landscape-card-body { padding: 24px; }
.landscape-card h3 { color: #1a2e3b; font-weight: 700; font-size: 1.15rem; margin-bottom: 12px; }
.landscape-card p { color: #4a6070; font-size: 14px; line-height: 1.6; }

/* ============ IFRAME MAP ============ */
.map-frame {
  border-radius: 24px; overflow: hidden;
  box-shadow: 0 8px 32px rgba(0,0,0,.12); border: 1px solid #e8f5fa;
}
.map-frame iframe { width: 100%; height: 400px; border: none; display: block; }

/* ============ NUMBERED ADVANTAGES ============ */
.numbered-item { display: flex; align-items: flex-start; gap: 20px; margin-bottom: 24px; }
.numbered-num { font-size: 2rem; font-weight: 700; flex-shrink: 0; line-height: 1; }
.numbered-item h3 { color: #1a2e3b; font-weight: 700; font-size: 16px; margin-bottom: 4px; }
.numbered-item p { color: #4a6070; font-size: 14px; line-height: 1.5; }

/* ============ POI MINI (text only) ============ */
.poi-mini {
  border-radius: 16px; background: #fff; padding: 16px; text-align: center;
  box-shadow: 0 4px 24px rgba(26,107,138,.1); transition: transform .25s;
}
.poi-mini:hover { transform: translateY(-2px); }
.poi-mini-dist { color: #1a6b8a; font-weight: 700; font-size: 14px; margin-bottom: 4px; }
.poi-mini-name { color: #4a6070; font-size: 12px; }

/* ============ ATTRACTIONS ============ */
.attraction-card {
  border-radius: 24px; overflow: hidden; background: #fff;
  box-shadow: 0 4px 24px rgba(26,107,138,.1); transition: transform .25s, box-shadow .25s;
}
.attraction-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(26,107,138,.18); }
.attraction-card-img { height: 208px; overflow: hidden; position: relative; }
.attraction-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s; }
.attraction-card:hover .attraction-card-img img { transform: scale(1.1); }
.attraction-emoji {
  position: absolute; top: 12px; right: 12px;
  width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,.9);
  display: flex; align-items: center; justify-content: center; font-size: 1.25rem;
}
.attraction-card-body { padding: 20px; }
.attraction-card h3 { color: #1a2e3b; font-weight: 700; font-size: 16px; margin-bottom: 8px; }
.attraction-card p { color: #4a6070; font-size: 13px; line-height: 1.6; }

/* ============ ACTIVITY CARDS ============ */
.activity-card {
  display: flex; gap: 20px; padding: 20px; border-radius: 16px;
  border: 1px solid #e8f5fa; transition: all .25s;
}
.activity-card:hover { border-color: rgba(201,168,76,.3); box-shadow: 0 4px 16px rgba(0,0,0,.06); }
.activity-card-img {
  width: 100px; height: 80px; border-radius: 12px; overflow: hidden; flex-shrink: 0;
}
.activity-card-img img { width: 100%; height: 100%; object-fit: cover; }
.activity-card h4 { color: #1a2e3b; font-weight: 700; font-size: 14px; margin-bottom: 4px; }
.activity-card p { color: #4a6070; font-size: 13px; line-height: 1.5; }

/* ============ RESPONSIVE ============ */
@media (max-width: 768px) {
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .projects-grid { grid-template-columns: 1fr; }
  .advantages-grid { grid-template-columns: 1fr; }
  .steps-grid { grid-template-columns: repeat(2, 1fr); }
  .gov-grid { grid-template-columns: 1fr; }
  .contacts-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: repeat(2, 1fr); }
  .header-nav, .header-phone { display: none; }
  .hero h1 { font-size: 2rem; }
  .hero-subtitle { font-size: 1rem; }
  .grid-2 { grid-template-columns: 1fr; }
  .grid-3 { grid-template-columns: 1fr; }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-2-lg { grid-template-columns: 1fr; }
  .grid-2-3 { grid-template-columns: 1fr; }
  .grid-3-poi { grid-template-columns: repeat(2, 1fr); }
  .price-banner-inner { flex-direction: column; text-align: center; }
  .plot-sidebar { width: 100%; max-height: 300px; }
  .gallery-thumbs { grid-template-columns: repeat(3, 1fr); }
  .chart-container { height: 180px; }
  .chart-years, .chart-prices { margin-left: 0; }
  .beach-section { height: auto; min-height: 520px; }
}

  /* ===== sunny-bay utility classes ===== */
  .sec-w{padding:80px 24px;background:#fff}.sec-p{padding:80px 24px}.sec-wl{padding:96px 24px;background:#fff}.sec-pl{padding:96px 24px}.sec-ws{padding:64px 24px;background:#fff}.py48{padding:48px 0}
  .mb56{margin-bottom:56px}.mb48{margin-bottom:48px}.mb40{margin-bottom:40px}.mb32{margin-bottom:32px}.mb24{margin-bottom:24px}.mb20{margin-bottom:20px}.mb16{margin-bottom:16px}.mb12{margin-bottom:12px}.mb8{margin-bottom:8px}.mb6{margin-bottom:6px}.mb4{margin-bottom:4px}.mb2{margin-bottom:2px}
  .mt32{margin-top:32px}.mt24{margin-top:24px}.mt16{margin-top:16px}.mt12{margin-top:12px}.mt8{margin-top:8px}.mt4{margin-top:4px}.mxa{margin:0 auto}
  .p20{padding:20px}.p32{padding:32px}.p16{padding:16px}
  .h2m{font-size:2.5rem;color:#1a2e3b;margin-bottom:24px;line-height:1.15}.h2s{font-size:2.5rem;color:#1a2e3b;margin-bottom:16px}.h3s{font-size:2rem;color:#1a2e3b;margin-bottom:16px}.h3t{font-size:2rem;color:#1a2e3b;margin-bottom:12px}.h3m{font-size:2rem;color:#1a2e3b;margin-bottom:24px;line-height:1.2}.h4m{font-size:1.25rem;color:#1a2e3b;margin-bottom:24px}.h4s{font-size:1.25rem;color:#1a2e3b}
  .bt{color:#4a6070;font-size:18px;line-height:1.6}.sub540{color:#4a6070;max-width:540px;margin:0 auto;font-size:18px}.sub680{color:#4a6070;max-width:680px;margin:0 auto;font-size:18px}.sub540p{color:#4a6070;max-width:540px;margin:0 auto}.sub680p{color:#4a6070;max-width:680px;margin:0 auto}
  .t16m{color:#4a6070;font-size:16px}.t14m{color:#4a6070;font-size:14px}.t12m{color:#4a6070;font-size:12px}.t14l{color:#4a6070;font-size:14px;line-height:1.5}.t14l6{color:#4a6070;font-size:14px;line-height:1.6}
  .fw14{color:#1a2e3b;font-weight:700;font-size:14px}.fw14s{color:#1a2e3b;font-weight:600;font-size:14px}.fw16{font-weight:700;color:#1a2e3b;font-size:16px}.fw5{color:#1a2e3b;font-weight:500}.fwbd{font-weight:700;color:#1a2e3b}.fwbs{font-weight:600;color:#1a6b8a}
  .f14{font-size:14px}.f12{font-size:12px}.f18{font-size:18px}
  .pxl{font-size:3rem;font-weight:900;margin-bottom:8px}.pxld{font-size:3rem;font-weight:900;color:#1a2e3b;margin-bottom:8px}.pxlg{font-size:2rem;font-weight:900;color:#C9A84C}
  .vs{font-size:1.5rem;font-weight:700;color:#1a6b8a;margin-bottom:4px}.vlg{font-size:1.5rem;font-weight:700}.vg{font-size:1.5rem;font-weight:700;color:#C9A84C}
  .cw{color:#fff}.cd{color:#1a2e3b}.cs{color:#1a6b8a}.cg{color:#C9A84C}.cm{color:#4a6070}.cgold{color:#F0D080}
  .fg12{display:flex;align-items:center;gap:12px}.fg8{display:flex;align-items:center;gap:8px}.fg16{display:flex;align-items:center;gap:16px}.fg6{display:flex;align-items:center;gap:6px}.fg4{display:flex;align-items:center;gap:4px}
  .fgs12{display:flex;align-items:flex-start;gap:12px}.fgs16{display:flex;align-items:flex-start;gap:16px}
  .fbw{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}.fb16{display:flex;align-items:center;justify-content:space-between;gap:16px}.fb{display:flex;align-items:center;justify-content:space-between}
  .fdc16{display:flex;flex-direction:column;gap:16px}.fcw{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}.fwg12{display:flex;flex-wrap:wrap;gap:12px}
  .g5{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}.g3s{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.aic{align-items:center}
  .tc{text-align:center}.f1{flex:1}.f1r{flex:1;position:relative}.h176{height:176px}.w100{width:100%}.w51{width:51%}.r24{border-radius:24px}.oxa{overflow-x:auto}.trs{text-align:right;flex-shrink:0}.noul{text-decoration:none}.i48{width:48px;height:48px;flex-shrink:0}
  .csg{border-radius:24px;padding:32px;color:#fff;box-shadow:0 8px 32px rgba(0,0,0,.12);background:linear-gradient(135deg,#1a6b8a,#134f68)}
  .cwb{border-radius:24px;padding:32px;background:#fff;box-shadow:0 8px 32px rgba(0,0,0,.06);border:1px solid #e0e0e0}
  .csb{border-radius:24px;border:2px solid rgba(26,107,138,.2);padding:32px;background:#f5f9fc}
  .cgb{border-radius:24px;border:2px solid rgba(201,168,76,.2);padding:32px;background:#fdf8f0}
  .cw16{background:#fff;border-radius:16px;padding:16px;display:flex;align-items:flex-start;gap:16px}
  .cl16{background:#f5f9fc;border-radius:16px;padding:16px;display:flex;align-items:flex-start;gap:12px}
  .cgp{background:#fdf3e0;border:1px solid rgba(201,168,76,.3);border-radius:16px;padding:20px}
  .cgps{background:#fdf3e0;border:1px solid rgba(201,168,76,.3);border-radius:16px;padding:16px}
  .clp{border-radius:16px;padding:16px;background:#f5f9fc}
  .tcp{text-align:center;padding:20px}.ptc{padding:20px;text-align:center}
  .dg{width:8px;height:8px;border-radius:50%;background:#0F920A;display:inline-block}.dy{width:8px;height:8px;border-radius:50%;background:#FFD600;display:inline-block}.dr{width:8px;height:8px;border-radius:50%;background:#CC2200;display:inline-block}
  .lg{width:12px;height:12px;border-radius:2px;background:rgba(15,146,10,.26);border:2px solid #0F920A;display:inline-block}.ly{width:12px;height:12px;border-radius:2px;background:rgba(255,255,0,.3);border:2px solid #FFD600;display:inline-block}.lr{width:12px;height:12px;border-radius:2px;background:rgba(255,0,0,.22);border:2px solid #CC2200;display:inline-block}
  .ngl{width:32px;height:32px;border-radius:50%;background:#C9A84C;color:#fff;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .ngs{width:28px;height:28px;border-radius:50%;background:#C9A84C;color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .nsl{width:32px;height:32px;border-radius:50%;background:#1a6b8a;color:#fff;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .nss{width:28px;height:28px;border-radius:50%;background:#1a6b8a;color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .ib40{width:40px;height:40px;border-radius:12px;background:#1a6b8a;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .psp{color:#1a6b8a;font-weight:700;font-size:14px}.psn{font-weight:600;color:#1a2e3b;font-size:14px}.psl{margin-top:6px;display:flex;gap:12px;font-size:12px}
  .badge-reserved{display:inline-block;background:#facc15;color:#713f12;font-size:10px;font-weight:700;padding:2px 8px;border-radius:4px;text-transform:uppercase;letter-spacing:.05em}
  .pill-g{display:inline-block;padding:4px 12px;border-radius:9999px;font-size:12px;font-weight:600;background:#fdf3e0;color:#C9A84C}
  .tg{color:#C9A84C;font-weight:700;font-size:14px;background:#fdf3e0;padding:2px 8px;border-radius:4px}
  .ts{color:#1a6b8a;font-weight:700;font-size:14px;background:#e8f5fa;padding:2px 8px;border-radius:4px}
  .tsr{color:#1a6b8a;font-weight:700;font-size:14px;background:#e8f5fa;padding:2px 8px;border-radius:9999px}
  .pb{margin-top:12px;height:6px;background:#fff;border-radius:9999px;overflow:hidden}.pbd{margin-top:12px;height:6px;background:rgba(255,255,255,.2);border-radius:9999px;overflow:hidden}
  .flogo{height:96px;width:auto;object-fit:contain}
  .fsoon{color:rgba(255,255,255,.65);font-size:14px;display:flex;align-items:center;gap:8px}
  .owh{color:rgba(255,255,255,.7);font-size:14px;text-transform:uppercase;letter-spacing:.15em;margin-bottom:8px}
  .swh{color:rgba(255,255,255,.8)}
  .hdesc{color:rgba(255,255,255,.65);font-size:16px;max-width:540px;margin-bottom:32px}
  .lwh{font-size:14px;color:rgba(255,255,255,.8)}
  .hcta{font-size:clamp(1.5rem,4.5vw,3rem);color:#fff;margin-bottom:24px;line-height:1.3}
  .csub{color:rgba(255,255,255,.75);font-size:18px;margin-bottom:40px;max-width:640px;margin-left:auto;margin-right:auto}
  .bnw{display:block;white-space:nowrap}
  .blg{font-size:18px;padding:16px 40px}
  .pleg{padding:12px 16px;border-top:1px solid #e8f5fa;background:#fafcfd;display:flex;flex-wrap:wrap;gap:12px;font-size:11px;color:#4a6070}
  .spwrap{border-radius:24px;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.12);border:1px solid #e8f5fa;display:flex;height:72vh;min-height:520px}
  .fshadow{border-radius:24px;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.12);border:1px solid #e8f5fa}
  .ifull{width:100%;height:100%;border:none}
  .imap{width:100%;height:460px;border:none;display:block}
  .i3d{width:100%;height:80vh;border:none;display:block}
  .dwh{margin-top:24px;padding-top:24px;border-top:1px solid rgba(255,255,255,.2)}
  
.u0{color:#C9A84C;font-weight:700;font-size:14px;background:#fdf3e0;padding:2px 8px;border-radius:9999px}
.u1{width:48px;height:48px;border-radius:16px;background:#1a6b8a;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.25rem;font-weight:700;flex-shrink:0}
.u2{margin-top:16px;padding:16px;border-radius:16px;text-align:center;background:linear-gradient(135deg,rgba(26,107,138,.08),rgba(201,168,76,.08))}
.u3{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px}
.u4{padding:24px;display:flex;gap:16px}
.u5{font-weight:700;font-size:14px;color:#C9A84C}
.u6{width:40px;height:40px;border-radius:12px;background:#C9A84C;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.u7{font-weight:600;color:#1a2e3b}
.u8{color:#1a2e3b;font-weight:600}
.u9{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.15em;color:#1a6b8a;margin-bottom:4px}
.u10{color:#4a6070;font-size:12px;text-transform:uppercase;letter-spacing:.15em;margin-bottom:16px}
.u11{color:#4a6070;font-size:12px;text-transform:uppercase;letter-spacing:.15em;margin-bottom:24px}
.u12{color:#4a6070;font-size:14px;text-transform:uppercase;letter-spacing:.15em;margin-bottom:8px}
.u13{border-radius:16px;padding:16px;background:rgba(26,107,138,.07);border:2px solid #1a6b8a}
.u14{font-weight:700;font-size:14px;color:#1a6b8a}
.u15{color:#1a2e3b;font-weight:700;font-size:18px}
.u16{border-radius:24px;border:2px solid rgba(201,168,76,.3);padding:32px;background:#fdf8f0}
.u17{font-weight:700;color:#22c55e}
.u18{width:100%;height:23px;border-radius:12px 12px 0 0;background:rgba(26,107,138,.25)}
.u19{display:flex;flex-direction:column;align-items:center;gap:4px;padding-bottom:24px}
.u20{color:#1a2e3b;font-weight:700;font-size:18px;margin-bottom:24px;text-align:center}
.u21{font-size:1.3rem}
.u22{color:#4a6070;font-size:14px;text-align:center;margin-top:16px;font-style:italic}
.u23{border-radius:24px;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.12)}
.u24{padding:16px 20px;text-align:center}
.u25{width:100%;height:40px;border-radius:12px 12px 0 0;background:#1a6b8a}
.u26{background:#e8f5fa;border-radius:16px;padding:20px;margin-top:16px}
.u27{color:rgba(255,255,255,.8);font-size:1.25rem;margin-bottom:24px}
.u28{text-align:center;color:#4a6070;font-size:14px;margin-top:16px}
.u29{padding:32px;margin-bottom:40px}
.u30{height:100%;width:100%;background:#C9A84C;border-radius:9999px}
.u31{color:#1a6b8a;font-weight:700;font-size:14px;margin-bottom:8px}
.u32{height:100%;width:16%;background:#1a6b8a;border-radius:9999px}
.u33{height:100%;width:20%;background:#1a6b8a;border-radius:9999px}
.u34{height:100%;width:24%;background:#C9A84C;border-radius:9999px}
.u35{height:100%;width:60%;background:#C9A84C;border-radius:9999px}
.u36{margin-top:24px;padding-top:24px;border-top:1px solid #e0e0e0}
.u37{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.u38{color:#1a6b8a;font-weight:700;font-size:14px;margin-top:2px}
.u39{color:rgba(255,255,255,.7);font-size:12px;margin-bottom:4px}
.u40{font-weight:700;color:#C9A84C}
.u41{color:#9ab0be;font-size:12px}
.u42{width:100%;height:320px;object-fit:cover;display:block}
.u43{border-color:#1a6b8a;background:rgba(26,107,138,.05)}
.u44{border-color:#C9A84C;background:rgba(201,168,76,.05)}
.u45{border-color:#4a6070;background:rgba(74,96,112,.05)}
.u46{background:#f5f9fc;border-radius:16px;padding:24px}
.u47{font-size:1.5rem;color:#1a2e3b;margin-bottom:24px}
.u48{color:#4a6070;line-height:1.6;margin-bottom:32px}
.u49{font-size:2.5rem;color:#fff;margin-bottom:16px}
.u50{font-size:1.5rem;font-weight:900;color:#1a6b8a}
.u51{color:#4a6070;font-size:12px;margin-bottom:4px}
.u52{font-size:1.5rem;font-weight:700;color:#1a2e3b}
.u53{color:#C9A84C;font-weight:900;font-size:1.5rem}
.u54{font-size:2rem;font-weight:900;margin-top:4px}
.u55{font-size:12px;color:#4a6070;font-weight:400}
.u56{color:#1a2e3b;font-size:16px;line-height:1.6}
.u57{font-weight:700;color:#C9A84C;font-size:16px}
.u58{display:flex;flex-direction:column;gap:12px}
.u59{display:flex;align-items:flex-end;gap:16px}
.u60{justify-content:center;margin-bottom:40px}
.u61{margin-top:24px;text-align:center}
.u62{color:#4a6070;margin-bottom:24px}
.u63{max-width:768px;margin:0 auto}
.u64{font-size:14px;color:#4a6070}
.u65{align-items:flex-start}
.u66{opacity:0}
.u67{opacity:1}

  /* ===== SVG Icons via CSS ===== */
  .ic{display:inline-block;width:20px;height:20px;background-size:contain;background-repeat:no-repeat;background-position:center;vertical-align:middle;flex-shrink:0}
  .ic-check{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23fff' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M5 13l4 4L19 7'/%3E%3C/svg%3E");width:14px;height:14px}
  .ic-download{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='currentColor' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z'/%3E%3C/svg%3E")}
  .ic-phone{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='currentColor' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z'/%3E%3C/svg%3E")}
  .ic-mail{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='currentColor' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z'/%3E%3C/svg%3E")}
  .ic-building{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23fff' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4'/%3E%3C/svg%3E")}
  .ic-shield{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23fff' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z'/%3E%3C/svg%3E")}
  .ic-chart{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='currentColor' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M13 7h8m0 0v8m0-8l-8 8-4-4-6 6'/%3E%3C/svg%3E")}
  .ic-pin{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23F0D080' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z'/%3E%3Ccircle cx='12' cy='11' r='3' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3C/svg%3E")}
  .ic-star{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%231a6b8a' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M11.049 2.927c.3-.921 1.603-.921 1.902 0l1.519 4.674a1 1 0 00.95.69h4.915c.969 0 1.371 1.24.588 1.81l-3.976 2.888a1 1 0 00-.363 1.118l1.518 4.674c.3.922-.755 1.688-1.538 1.118l-3.976-2.888a1 1 0 00-1.176 0l-3.976 2.888c-.783.57-1.838-.197-1.538-1.118l1.518-4.674a1 1 0 00-.363-1.118l-3.976-2.888c-.784-.57-.38-1.81.588-1.81h4.914a1 1 0 00.951-.69l1.519-4.674z'/%3E%3C/svg%3E")}
  .ic-arrow{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='currentColor' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 5l7 7-7 7'/%3E%3C/svg%3E");width:16px;height:16px}
  .ic-chevdown{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='currentColor' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");width:14px;height:14px}
  .ic-close{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23999' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 18L18 6M6 6l12 12'/%3E%3C/svg%3E");width:16px;height:16px}
  .ic-dot{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='5' fill='%231a6b8a'/%3E%3C/svg%3E");width:16px;height:16px}
  .ic-home{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='currentColor' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6'/%3E%3C/svg%3E")}
  .ic-globe{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='currentColor' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10' stroke-width='2'/%3E%3Cpath stroke-width='2' d='M2 12h20M12 2a15.3 15.3 0 014 10 15.3 15.3 0 01-4 10 15.3 15.3 0 01-4-10 15.3 15.3 0 014-10z'/%3E%3C/svg%3E")}
  .ic-users{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='currentColor' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M17 21v-2a4 4 0 00-4-4H5a4 4 0 00-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4' stroke-width='2'/%3E%3C/svg%3E")}
  .ic-clock{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='currentColor' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10' stroke-width='2'/%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 6v6l4 2'/%3E%3C/svg%3E")}
  .ic-eye{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='currentColor' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M15 12a3 3 0 11-6 0 3 3 0 016 0z'/%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z'/%3E%3C/svg%3E")}
  .checklist-icon .ic-check,.beach-check-icon .ic-check{filter:brightness(10)}
  .btn-primary .ic,.btn-gold .ic,.btn-outline .ic{filter:brightness(10)}
  
  .stage-panel{grid-column:1}
  .stage-tab{cursor:pointer;transition:all .2s}
  
  .ic-doc{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%231a6b8a' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z'/%3E%3C/svg%3E")}
  .ic-arrow-down{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%231a6b8a' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 14l-7 7m0 0l-7-7m7 7V3'/%3E%3C/svg%3E")}
  .adv-icon .ic{width:24px;height:24px}
  .u6 .ic{width:24px;height:24px}
  .contact-icon .ic{width:24px;height:24px}
  
  .adv-icon .ic-building{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%231a6b8a' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4'/%3E%3C/svg%3E")}
  .adv-icon .ic-users{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%231a6b8a' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M17 21v-2a4 4 0 00-4-4H5a4 4 0 00-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4' stroke-width='2'/%3E%3C/svg%3E")}
  .adv-icon .ic-shield{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%231a6b8a' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z'/%3E%3C/svg%3E")}
  .u6 .ic-globe{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23fff' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10' stroke-width='2'/%3E%3Cpath stroke-width='2' d='M2 12h20M12 2a15.3 15.3 0 014 10 15.3 15.3 0 01-4 10 15.3 15.3 0 01-4-10 15.3 15.3 0 014-10z'/%3E%3C/svg%3E")}
  
  .section-sand .beach-check span{color:#1a2e3b}
  
/* ============ MOBILE FIXES (2026-03-17) ============ */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}

*, *::before, *::after {
  min-width: 0;
}

img, iframe, table {
  max-width: 100%;
}

.hero h1,
.hero-subtitle,
.h2m,
.h2s,
.h3s,
.h3t,
.h3m,
.h4m,
.h4s,
.project-name,
.contact-value,
.gov-law-title,
.price-banner-title,
.btn-banner,
.bnw {
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
}

.data-table,
.summary-table {
  display: block;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 1024px) {
  .projects-grid,
  .advantages-grid,
  .steps-grid,
  .footer-grid,
  .g5,
  .g3s,
  .grid-3,
  .grid-4,
  .grid-3-poi {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grid-2,
  .grid-2-lg,
  .grid-2-3,
  .stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  .container,
  .container-sm,
  .header-inner,
  .price-banner-inner,
  .hero-content,
  .beach-content {
    padding-left: 16px;
    padding-right: 16px;
  }

  .section-sand,
  .regions-section,
  .steps-section,
  .gallery-section,
  .footer-sea,
  .section-sea,
  .advantages-section,
  .gov-section,
  .contacts-section,
  .sec-w,
  .sec-p,
  .sec-wl,
  .sec-pl,
  .sec-ws {
    padding-left: 16px;
    padding-right: 16px;
  }

  .hero {
    min-height: 560px;
    height: auto;
  }

  .hero-content {
    padding-top: 112px;
    padding-bottom: 88px;
    justify-content: center;
  }

  .hero-left .hero-content {
    align-items: flex-start;
    text-align: left;
    padding-bottom: 72px;
  }

  .hero-buttons,
  .fcw,
  .fb,
  .fb16,
  .fbw,
  .fg12,
  .fg16,
  .fg8,
  .fg6,
  .fg4 {
    flex-direction: column;
    align-items: stretch;
  }

  .btn-primary,
  .btn-gold,
  .btn-outline,
  .btn-banner {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  .hero-scroll {
    display: none;
  }

  .site-header {
    padding: 6px 0;
  }

  .header-logo img {
    height: 56px;
  }

  .stats-grid,
  .projects-grid,
  .advantages-grid,
  .steps-grid,
  .footer-grid,
  .grid-2,
  .grid-3,
  .grid-4,
  .grid-2-lg,
  .grid-2-3,
  .grid-3-poi,
  .g5,
  .g3s,
  .gallery-thumbs {
    grid-template-columns: minmax(0, 1fr);
  }

  .region-card,
  .u29,
  .gov-law-card,
  .plot-card,
  .info-card,
  .landscape-card-body,
  .advantage-card,
  .feature-dark,
  .contact-card,
  .project-info {
    padding: 20px;
  }

  .region-header {
    align-items: flex-start;
  }

  .region-desc,
  .coming-soon {
    margin-left: 0;
  }

  .coming-soon {
    padding: 20px;
  }

  .project-img,
  .landscape-card-img,
  .attraction-card-img,
  .gallery-main {
    height: auto;
    min-height: 220px;
  }

  .gallery-thumb-flex {
    width: 88px;
  }

  .activity-card,
  .contact-card,
  .gov-card,
  .u4,
  .distance-row,
  .numbered-item {
    flex-direction: column;
    align-items: flex-start;
  }

  .activity-card-img {
    width: 100%;
    height: 180px;
  }

  .distance-val,
  .trs {
    width: auto;
    text-align: left;
  }

  .chart-container {
    gap: 8px;
    height: 180px;
    overflow-x: auto;
    padding-bottom: 8px;
  }

  .chart-bar-wrap {
    min-width: 44px;
  }

  .chart-years,
  .chart-prices {
    gap: 8px;
    margin-left: 0;
    overflow-x: auto;
  }

  .spwrap {
    flex-direction: column;
    height: auto;
    min-height: 0;
  }

  .plot-sidebar {
    width: 100%;
    border-right: none;
    border-bottom: 1px solid #e8f5fa;
    max-height: 260px;
  }

  .map-frame iframe,
  .imap,
  .i3d {
    height: 320px;
  }

  .beach-section {
    min-height: 0;
    height: auto;
  }

  .beach-overlay {
    background: linear-gradient(to top, rgba(26,46,59,.9) 35%, rgba(26,46,59,.4));
  }

  .beach-content {
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .contacts-tags {
    gap: 12px;
    flex-direction: column;
    align-items: center;
  }

  .price-banner-title span,
  .pxl,
  .pxld,
  .u49,
  .h2m,
  .h2s,
  .h3s,
  .h3t,
  .h3m,
  .u47 {
    font-size: clamp(1.75rem, 7vw, 2.2rem);
    line-height: 1.2;
  }

  .bt,
  .sub540,
  .sub680,
  .csub,
  .hdesc {
    font-size: 16px;
  }
}

@media (max-width: 480px) {
  .container,
  .container-sm,
  .header-inner,
  .price-banner-inner,
  .hero-content,
  .beach-content,
  .section-sand,
  .regions-section,
  .steps-section,
  .gallery-section,
  .footer-sea,
  .section-sea,
  .advantages-section,
  .gov-section,
  .contacts-section,
  .sec-w,
  .sec-p,
  .sec-wl,
  .sec-pl,
  .sec-ws {
    padding-left: 12px;
    padding-right: 12px;
  }

  .hero-content {
    padding-top: 96px;
    padding-bottom: 72px;
  }

  .hero h1 {
    font-size: 1.75rem;
  }

  .hero-subtitle,
  .project-link,
  .footer-links a,
  .footer-contact,
  .stat-label,
  .contact-value,
  .gov-law-text,
  .gov-law-ref {
    font-size: 13px;
  }

  .badge,
  .badge-soon,
  .badge-sold,
  .project-badge {
    letter-spacing: 0.08em;
  }

  .region-card,
  .gov-law-card,
  .plot-card,
  .info-card,
  .advantage-card,
  .feature-dark,
  .contact-card,
  .u29,
  .csg,
  .cwb,
  .csb,
  .cgb,
  .u16 {
    padding: 16px;
    border-radius: 18px;
  }

  .project-name,
  .region-name,
  .gov-law-title,
  .contact-value,
  .u15,
  .u52 {
    font-size: 1rem;
  }

  .gallery-item {
    width: 220px;
    height: 160px;
  }

  .footer-grid {
    gap: 24px;
  }
}

/* ============ MOBILE TEXT OVERFLOW FIXES (2026-03-17 v2) ============ */
@media (max-width: 768px) {
  h1, h2, h3, h4, h5, h6,
  .hero h1,
  .hero-subtitle,
  .stat-val,
  .stat-label,
  .distance-val,
  .distance-name,
  .project-name,
  .region-name,
  .price-banner-title,
  .price-banner-sub,
  .gov-law-title,
  .gov-law-text,
  .contact-value,
  .contact-label,
  .u15,
  .u47,
  .u49,
  .u52,
  .pxl,
  .pxld,
  .h2m,
  .h2s,
  .h3m,
  .h3s,
  .h3t,
  .h4m,
  .h4s,
  .bt,
  .sub540,
  .sub680,
  .csub,
  .hdesc {
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
  }

  .hero h1 span[style*="white-space:nowrap"],
  h1 span[style*="white-space:nowrap"],
  h2 span[style*="white-space:nowrap"] {
    white-space: normal !important;
  }

  .hero h1 {
    font-size: clamp(1.9rem, 8vw, 2.6rem);
    line-height: 1.08;
    letter-spacing: 0.01em;
  }

  .section-sand h2,
  .section-sea h2,
  .sec-w h2,
  .sec-p h2,
  .sec-wl h2,
  .sec-pl h2,
  .sec-ws h2,
  .h2m,
  .h2s,
  .u47,
  .u49 {
    font-size: clamp(1.9rem, 8.2vw, 2.5rem) !important;
    line-height: 1.08 !important;
  }

  .stats-grid,
  .grid-4,
  .g5,
  .g3s,
  [style*="grid-template-columns:repeat(5,1fr)"],
  [style*="grid-template-columns:repeat(4,1fr)"],
  [style*="grid-template-columns:repeat(3,1fr)"],
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns:1fr 2fr"] {
    grid-template-columns: 1fr !important;
  }

  .stat-card,
  .distance-card,
  .cw16,
  .cl16 {
    padding: 18px 16px !important;
  }

  .stat-val {
    font-size: clamp(1.45rem, 7vw, 2rem) !important;
    line-height: 1.15;
  }

  .stat-label,
  .distance-name,
  .distance-label {
    font-size: 14px !important;
    line-height: 1.45;
  }

  .distance-row {
    grid-template-columns: 1fr !important;
  }

  .map-frame,
  .map-frame iframe,
  .imap,
  .i3d,
  iframe[src*="yandex"],
  iframe[src*="maps"] {
    width: 100% !important;
    max-width: 100% !important;
  }
}

@media (max-width: 480px) {
  .hero h1 {
    font-size: clamp(1.7rem, 9vw, 2.15rem) !important;
  }

  .section-sand h2,
  .section-sea h2,
  .sec-w h2,
  .sec-p h2,
  .sec-wl h2,
  .sec-pl h2,
  .sec-ws h2,
  .h2m,
  .h2s,
  .u47,
  .u49 {
    font-size: clamp(1.65rem, 9vw, 2.1rem) !important;
  }

  .hero-subtitle,
  .bt,
  .sub540,
  .sub680,
  .csub,
  .hdesc,
  .gov-law-text,
  .contact-value,
  .contact-label {
    font-size: 14px !important;
    line-height: 1.5;
  }

  .stat-val {
    font-size: clamp(1.3rem, 8vw, 1.7rem) !important;
  }

  .stat-label {
    font-size: 13px !important;
  }
}