/* Welcome to Smokey — Figma 376:899 (1920x7888). Hodnoty v calc(N * var(--u)) = design px pri 1920. */

/* ---------------------------------------------------------------- HERO + modry pas (0–1154) */
.wl-hero { position: relative; color: #fff; }
.wl-hero__media { position: relative; height: calc(746 * var(--u)); min-height: 380px; overflow: hidden; }
.wl-hero__media img { position: absolute; left: 0; top: calc(12 * var(--u)); width: 100%; height: calc(869 * var(--u)); min-height: 100%; object-fit: cover; }
.wl-hero__media::after { content: ""; position: absolute; inset: 0; background: rgba(0, 23, 122, .32); }
.wl-hero__band { position: relative; z-index: 3; background: var(--c-navy); box-shadow: 0 4px 41px rgba(0, 0, 0, .36); }
.wl-hero__inner { max-width: var(--maxw); margin-inline: auto; min-height: calc(408 * var(--u)); display: flex; gap: calc(71.6 * var(--u)); padding: calc(54 * var(--u)) calc(114.5 * var(--u)) calc(78.8 * var(--u)) calc(96.7 * var(--u)); }
.wl-hero__titles { flex: none; width: calc(788 * var(--u)); }
.wl-hero__h { font-weight: 900; font-size: max(32px, calc(50 * var(--u))); line-height: 1; letter-spacing: 0; text-transform: uppercase; }
.wl-hero__sub { margin-top: calc(19 * var(--u)); font-weight: 700; font-size: max(13px, calc(20 * var(--u))); line-height: 1.22; letter-spacing: max(1.6px, calc(3.62 * var(--u))); text-transform: uppercase; }
.wl-hero__p { width: calc(549 * var(--u)); font-weight: 400; font-size: max(14px, calc(16 * var(--u))); line-height: calc(26 / 16); letter-spacing: .3px; }

/* ---------------------------------------------------------------- THE FUTURE OF SMOKEY + WHAT IS COMING (1154–3209) */
.wl-future { position: relative; isolation: isolate; color: #fff; }
.wl-future__bg { position: absolute; left: 0; right: 0; top: 0; height: calc(2344 * var(--u)); max-height: calc(100% + 300px); z-index: -1; overflow: hidden; }
.wl-future__bg img { width: 100%; height: 100%; object-fit: cover; }
.wl-future__bg::after { content: ""; position: absolute; inset: 0; background: rgba(0, 23, 122, .62); }
.wl-future__wrap { position: relative; max-width: var(--maxw); margin-inline: auto; min-height: calc(2055 * var(--u)); }
.wl-future__intro { padding: calc(55 * var(--u)) 0 0 calc(113 * var(--u)); width: calc(113 * var(--u) + 642 * var(--u)); }
.wl-future__h { font-weight: 900; font-size: max(28px, calc(45 * var(--u))); line-height: calc(117 / 45); letter-spacing: 0; text-transform: uppercase; white-space: nowrap; }
.wl-future__p { margin-top: calc(-5 * var(--u)); width: calc(465 * var(--u)); font-weight: 500; font-size: max(14px, calc(16 * var(--u))); line-height: calc(26 / 16); letter-spacing: .3px; }
.wl-future__p p + p { margin-top: calc(26 * var(--u)); }
.wl-future__p a { text-decoration: underline; text-underline-offset: 2px; }
.wl-future__p a:hover { color: var(--c-gold-4); }
.wl-future__photo { position: absolute; z-index: 1; left: calc(944 * var(--u)); top: calc(-204 * var(--u)); width: calc(865 * var(--u)); height: calc(961 * var(--u)); border-radius: 7px; overflow: hidden; }
.wl-future__photo img { width: 100%; height: 100%; object-fit: cover; }

.wl-coming { position: absolute; left: 0; right: 0; top: calc(843 * var(--u)); height: calc(1083 * var(--u)); }
.wl-coming__h { position: absolute; z-index: 2; left: calc(131 * var(--u)); top: calc(107 * var(--u)); font-weight: 900; font-size: max(26px, calc(43 * var(--u))); line-height: calc(117 / 43); letter-spacing: 0; text-transform: uppercase; white-space: nowrap; }
.wl-coming__card { position: absolute; z-index: 2; left: calc(131 * var(--u)); top: calc(221 * var(--u)); width: calc(495 * var(--u)); height: calc(783 * var(--u)); border-radius: 7px; overflow: hidden; isolation: isolate; color: #fff; }
.wl-coming__card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .6s var(--ease); }
.wl-coming__card::before { content: ""; position: absolute; inset: 0; background: rgba(204, 153, 75, .26); z-index: -1; }
.wl-coming__card:hover img { transform: scale(1.03); }
.wl-coming__label { position: absolute; left: calc(110 * var(--u)); top: calc(664 * var(--u)); font-weight: 700; font-size: max(20px, calc(32 * var(--u))); line-height: calc(117 / 32); text-transform: uppercase; }
.wl-coming__map { position: absolute; left: calc(568 * var(--u)); top: 0; width: calc(1288 * var(--u)); min-height: calc(1083 * var(--u)); }

/* ---------------------------------------------------------------- REAL ESTATE (4337–5310, #00177a) */
.wl-own { position: relative; z-index: 2; background: var(--c-navy); color: #fff; padding: calc(110 * var(--u)) 0 calc(126 * var(--u)); box-shadow: 0 4px 34px rgba(0, 0, 0, .25); }
.wl-own .cs-wrap { padding-inline: calc(107 * var(--u)); }
.wl-own__h { line-height: calc(46 / 52); }
.wl-own__h em { display: block; font-size: calc(35 / 52 * 1em); line-height: calc(46 / 35); margin-top: 6px; }
.wl-own__p { max-width: calc(609 * var(--u)); margin-top: calc(19 * var(--u)); margin-left: calc(-4 * var(--u)); font-weight: 500; font-size: max(15px, calc(20 * var(--u))); line-height: 1.3; }
.wl-own .cs-btn { margin-top: calc(35 * var(--u)); min-width: calc(211 * var(--u)); }
.wl-own__cards { display: flex; gap: calc(28 * var(--u)); margin-top: calc(119 * var(--u)); margin-left: calc(4 * var(--u)); }
.wl-recard { position: relative; flex: none; width: calc(514 * var(--u)); height: calc(289 * var(--u)); border-radius: var(--r); overflow: hidden; isolation: isolate; color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; padding-bottom: calc(35 * var(--u)); }
.wl-recard img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .6s var(--ease); }
.wl-recard::before { content: ""; position: absolute; inset: 0; background: rgba(0, 23, 122, .30); z-index: -1; }
.wl-recard:hover img { transform: scale(1.04); }
.wl-recard__logo { position: absolute; top: calc(45 * var(--u)); left: 50%; transform: translateX(-50%); width: calc(179 * var(--u)); height: auto; color: #fff; }
.wl-recard__logo--rh { top: calc(52 * var(--u)); width: calc(148 * var(--u)); }
.wl-recard__name { position: absolute; top: calc(92 * var(--u)); left: 0; right: 0; text-align: center; font-weight: 500; font-size: max(20px, calc(27 * var(--u))); line-height: 1.7; text-transform: uppercase; }
.wl-recard__btn { display: inline-flex; align-items: center; gap: 10px; height: calc(60 * var(--u)); min-height: 40px; padding: 0 calc(21 * var(--u)); border: 3px solid #fff; border-radius: var(--r); font-weight: 700; font-size: max(11px, calc(13 * var(--u))); letter-spacing: .3px; text-transform: uppercase; }
.wl-recard:hover .wl-recard__btn { background: #fff; color: var(--c-navy); }

/* ---------------------------------------------------------------- ABOUT SMOKEY history & future (5307–6507) */
.wl-about { position: relative; isolation: isolate; color: #fff; min-height: calc(1200 * var(--u)); }
.wl-about__bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; box-shadow: inset 0 4px 4px rgba(0, 0, 0, .25); }
.wl-about__bg img { width: 100%; height: 100%; object-fit: cover; }
.wl-about__bg::after { content: ""; position: absolute; inset: 0; background: rgba(0, 23, 122, .39); }
.wl-about__wrap { position: relative; max-width: var(--maxw); margin-inline: auto; min-height: calc(1200 * var(--u)); }
.wl-about__glass { position: absolute; left: calc(212 * var(--u)); top: calc(331 * var(--u)); width: calc(657 * var(--u)); min-height: calc(698 * var(--u)); padding: calc(56 * var(--u)) calc(60 * var(--u)) calc(56 * var(--u)) calc(83 * var(--u)); background: rgba(0, 23, 122, .65); border-radius: var(--r); }
.wl-about__h { line-height: calc(46 / 52); }
.wl-about__h em { display: block; font-size: calc(42 / 52 * 1em); line-height: calc(46 / 42); }
.wl-about__p { margin-top: calc(30 * var(--u)); margin-left: calc(3 * var(--u)); max-width: calc(409 * var(--u)); font-weight: 500; font-size: max(14px, calc(16 * var(--u))); line-height: calc(26 / 16); letter-spacing: .3px; }
.wl-about__p p + p { margin-top: calc(26 * var(--u)); }
.wl-about__cards { position: absolute; left: calc(957 * var(--u)); top: calc(82 * var(--u)); display: flex; gap: calc(50 * var(--u)); }
.wl-hcard { position: relative; flex: none; width: calc(372 * var(--u)); height: calc(786 * var(--u)); border-radius: var(--r); overflow: hidden; isolation: isolate; color: #fff; }
.wl-hcard + .wl-hcard { width: calc(373 * var(--u)); }
.wl-hcard img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .6s var(--ease); }
.wl-hcard:first-child::before { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .20); z-index: -1; }
.wl-hcard::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 56.5px rgba(0, 0, 0, .40); pointer-events: none; }
.wl-hcard:hover img { transform: scale(1.04); }
.wl-hcard__t { position: absolute; left: 0; right: 0; bottom: calc(24 * var(--u)); text-align: center; font-weight: 900; font-size: max(17px, calc(23 * var(--u))); line-height: calc(28 / 23); text-transform: uppercase; }

/* ---------------------------------------------------------------- EVENTS (6507–7352, #f8f8f8) */
.wl-events { background: #f8f8f8; color: var(--c-navy); padding: calc(123 * var(--u)) 0 calc(119 * var(--u)); }
.wl-events .cs-wrap { padding-inline: calc(93 * var(--u)) calc(102 * var(--u)); }
.wl-events__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; min-height: calc(122 * var(--u)); padding-left: calc(2 * var(--u)); }
.wl-events__h { font-weight: 800; font-size: max(28px, calc(52 * var(--u))); line-height: calc(53 / 52); }
.wl-events__h em { display: block; font-weight: 600; }
.wl-events__more { flex: none; display: inline-flex; align-items: center; justify-content: center; margin-top: calc(9 * var(--u)); width: calc(205 * var(--u)); min-width: 150px; height: max(38px, calc(43 * var(--u))); border: 2px solid var(--c-navy); border-radius: var(--r); font-weight: 600; font-size: max(12px, calc(15 * var(--u))); text-transform: uppercase; transition: background-color .2s, color .2s; }
.wl-events__more:hover { background: var(--c-navy); color: #fff; }
.wl-events__rail { --gap: calc(30 * var(--u)); }
.wl-ecard { position: relative; display: flex; flex-direction: column; width: calc(320 * var(--u)); min-width: 240px; height: calc(481 * var(--u)); min-height: 400px; border: 3px solid var(--c-navy); border-radius: var(--r); overflow: hidden; padding: 0 calc(16 * var(--u)) calc(16 * var(--u)); transition: background-color .2s; }
.wl-ecard:hover { background: #fff; }
.wl-ecard__img { display: block; height: calc(310 * var(--u)); min-height: 230px; margin: -3px calc(-16 * var(--u) - 3px) calc(11 * var(--u)); flex: none; }
.wl-ecard__img img { width: 100%; height: 100%; object-fit: cover; }
.wl-ecard__t { font-weight: 600; font-size: max(15px, calc(18 * var(--u))); line-height: 1.15; min-height: 1.5em; }
.wl-ecard__d { font-weight: 600; font-size: max(10px, calc(11 * var(--u))); line-height: 2.47; color: #cc994a; text-transform: uppercase; }
.wl-ecard__p { font-weight: 500; font-size: max(12px, calc(13 * var(--u))); line-height: 1.48; max-width: calc(242 * var(--u) + 40px); display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.wl-ecard__arr { position: absolute; right: calc(21 * var(--u) + 2px); bottom: calc(16 * var(--u)); width: 16px; height: 16px; color: var(--c-navy); transform: rotate(90deg); }

/* ---------------------------------------------------------------- RESPONZIVITA */
@media (max-width: 1279px) {
  .wl-own__cards { flex-wrap: wrap; }
}
@media (max-width: 1279px) {
  .wl-hero__inner { flex-direction: column; gap: 24px; padding: 40px var(--gut) 48px; min-height: 0; }
  .wl-hero__titles, .wl-hero__p { width: auto; max-width: 640px; }
  .wl-future__wrap { min-height: 0; padding: 0 var(--gut) 64px; display: flex; flex-direction: column; gap: 32px; }
  .wl-future__intro { width: auto; padding: 48px 0 0; }
  .wl-future__h { white-space: normal; line-height: 1.15; margin-bottom: 16px; }
  .wl-future__p { width: auto; max-width: 560px; margin-top: 0; }
  .wl-future__photo { position: relative; left: auto; top: auto; width: 100%; height: auto; aspect-ratio: 865 / 961; max-height: 80vh; }
  .wl-coming { position: static; height: auto; display: flex; flex-direction: column; gap: 24px; }
  .wl-coming__h, .wl-coming__card, .wl-coming__map { position: relative; left: auto; top: auto; }
  .wl-coming__h { white-space: normal; line-height: 1.15; }
  .wl-coming__card { width: 100%; max-width: 495px; height: auto; aspect-ratio: 495 / 783; max-height: 640px; }
  .wl-coming__label { left: 24px; top: auto; bottom: 24px; line-height: 1.2; }
  .wl-coming__map { width: 100%; min-height: 0; }
  .wl-own .cs-wrap { padding-inline: var(--gut); }
  .wl-recard { width: 100%; max-width: 515px; height: 240px; }
  .wl-about__wrap { min-height: 0; padding: 64px var(--gut); display: flex; flex-direction: column; gap: 32px; }
  .wl-about__glass, .wl-about__cards { position: relative; left: auto; top: auto; }
  .wl-about__glass { width: 100%; max-width: 657px; min-height: 0; padding: 32px 28px; }
  .wl-about__p { max-width: none; }
  .wl-about__cards { overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; gap: 16px; margin-inline: calc(-1 * var(--gut)); padding-inline: var(--gut); }
  .wl-hcard, .wl-hcard + .wl-hcard { width: 280px; height: 500px; scroll-snap-align: start; }
  .wl-events .cs-wrap { padding-inline: var(--gut); }
  .wl-events__head { flex-direction: column; min-height: 0; margin-bottom: 32px; }
}
@media (max-width: 767px) {
  .wl-own { padding-block: 64px; }
  .wl-own__cards { margin-top: 40px; }
  .wl-own__h em { font-size: .62em; }
  .wl-about__h em { font-size: .7em; }
  .wl-hcard, .wl-hcard + .wl-hcard { width: 70vw; height: 120vw; max-height: 480px; }
}