*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    @font-face {
      font-family: 'MazzardM';
      src: url('../fonts/MazzardM-Light.otf') format('opentype');
      font-weight: 300;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: 'MazzardM';
      src: url('../fonts/MazzardM-Regular.otf') format('opentype');
      font-weight: 400;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: 'MazzardM';
      src: url('../fonts/MazzardM-SemiBold.otf') format('opentype');
      font-weight: 600;
      font-style: normal;
      font-display: swap;
    }


    :root {
      --bg:       #173C69;
      --bg2:      #173C69;
      --green:    #173C69;
      --green-l:  #0F2D50;
      --gold:     #D18557;
      --gold-l:   #F4C4B2;
      --cream:    #F5F3F0;
      --cream2:   #EDE8E3;
      --stone:    #7A7570;
      --white:    #FFFFFF;
    }

    html { overflow-x: clip; overflow-y: scroll; }

    body {
      font-family: 'MazzardM', sans-serif;
      background: var(--bg);
      color: var(--white);
      overflow-x: clip;
    }

    
    #loader {
      position: fixed; inset: 0;
      background: url('../images/render/render-01.webp') center/cover no-repeat;
      z-index: 9000;
      display: flex; align-items: center; justify-content: center;
      flex-direction: column; gap: 28px;
      clip-path: inset(0 0 0% 0);
    }
    #loader-overlay {
      position: absolute; inset: 0;
      background: rgba(15,30,55,.68);
      z-index: 0;
    }
    #loader img {
      height: 73px;
      opacity: 0; position: relative; z-index: 1;
    }
    #loader-bar {
      width: 200px; height: 1px;
      background: rgba(255,255,255,.15);
      position: relative; overflow: hidden; z-index: 1;
    }
    #loader-bar::after {
      content: ''; position: absolute; top: 0; left: -100%;
      width: 100%; height: 100%;
      background: var(--cream);
    }
    #loader-tagline {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(13px, 1.5vw, 16px);
      font-weight: 300; letter-spacing: .22em;
      text-transform: uppercase; color: rgba(247,249,248,.55);
      position: relative; z-index: 1; opacity: 0;
    }

    
    #navbar {
      position: fixed; top: 0; left: 0; right: 0;
      z-index: 1000;
      padding: 28px 64px;
      display: flex; align-items: center; justify-content: space-between;
      background: linear-gradient(to bottom, rgba(23,60,105,.72) 0%, transparent 100%);
      transition: padding .4s, background .4s, box-shadow .4s;
    }
    #navbar.solid {
      background: #fff;
      backdrop-filter: blur(12px);
      padding: 9px 64px;
      box-shadow: 0 1px 0 rgba(23,60,105,.1), 0 6px 24px rgba(23,60,105,.08);
    }
    .nav-logo { display: block; }
    .nav-logo img {
      height: 64px;
      opacity: 1;
      display: block;
      transition: height .4s;
    }
    .nav-logo .logo-dark { display: none; }
    #navbar.solid .nav-logo .logo-light { display: none; }
    #navbar.solid .nav-logo .logo-dark { display: block; }
    #navbar.solid .nav-logo img { height: 38px; }
    #navbar.solid .nav-links a { color: var(--green); }
    #navbar.solid .nav-lang { color: var(--green); }
    #navbar.solid .nav-divider { background: rgba(23,60,105,.25); }
    #navbar.solid .nav-phone-btn { color: var(--green); }
    #navbar.solid .nav-phone-num { color: var(--green); }
    #navbar.solid .nav-toggle span { background: var(--green); }

    .nav-links { display: flex; align-items: center; gap: 38px; list-style: none; }
    .nav-links a {
      font-family: 'MazzardM', sans-serif;
      font-size: 14px; font-weight: 700;
      letter-spacing: .08em; text-transform: uppercase;
      color: #fff; text-decoration: none;
      transition: opacity .3s;
      opacity: 1;
    }
    .nav-links a:hover { opacity: .7; }
    .nav-cta {
      border: 1px solid rgba(247,249,248,.3);
      color: var(--gold) !important;
      padding: 10px 26px; border-radius: 2px;
      transition: background .3s, border-color .3s !important;
    }
    .nav-cta:hover { background: rgba(247,249,248,.08); border-color: var(--gold) !important; }

    .nav-toggle {
      display: none; flex-direction: column; gap: 5px;
      cursor: none; background: none; border: none;
    }
    .nav-toggle span { display: block; width: 26px; height: 1.5px; background: rgba(255,255,255,.7); }

    
    #hero {
      position: relative; height: 100vh; min-height: 680px;
      overflow: hidden; display: flex; flex-direction: column; align-items: center;
    }
    #hero-bg {
      position: absolute; inset: -10%;
      background: url('../images/header.webp') center/cover no-repeat;
      will-change: transform;
    }
    #hero-overlay {
      position: absolute; inset: 0;
      background: linear-gradient(to top, rgba(15,30,55,.55) 0%, rgba(15,30,55,.18) 40%, rgba(15,30,55,.05) 100%);
    }
    #hero-content {
      position: relative; z-index: 2;
      padding: 0 64px;
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-end;
      padding-bottom: 100px;
      flex: 1;
    }

    .hero-title-wrap { overflow: hidden; }
    .hero-title {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(58px, 8vw, 110px);
      font-weight: 300; line-height: 1.0;
      letter-spacing: -.01em;
      transform: translateY(110%);
    }
    .hero-title em { font-style: italic; font-weight: 400; }
    .hero-title strong { font-weight: 600; }
    .hero-sub {
      font-size: 15px; font-weight: 300;
      color: rgba(255,255,255,.65);
      max-width: 420px; line-height: 1.8;
      margin-top: 24px; margin-bottom: 44px;
      opacity: 0;
    }
    .hero-btns { display: flex; gap: 14px; opacity: 0; }
    .btn-g {
      display: inline-flex; align-items: center; gap: 10px;
      background: var(--cream); color: var(--green);
      padding: 15px 38px; border-radius: 2px;
      font-size: 11px; font-weight: 500; letter-spacing: .14em;
      text-transform: uppercase; text-decoration: none;
      transition: background .3s, transform .2s;
    }
    .btn-g:hover { background: var(--gold-l); transform: translateY(-2px); }
    .btn-ghost {
      display: inline-flex; align-items: center; gap: 10px;
      background: transparent; color: rgba(255,255,255,.8);
      border: 1px solid rgba(255,255,255,.3);
      padding: 15px 38px; border-radius: 2px;
      font-size: 11px; font-weight: 400; letter-spacing: .14em;
      text-transform: uppercase; text-decoration: none;
      transition: border-color .3s, background .3s;
    }
    .btn-ghost:hover { border-color: rgba(255,255,255,.8); background: rgba(255,255,255,.06); }

    .scroll-hint {
      position: absolute; bottom: 36px; right: 64px;
      display: flex; align-items: center; gap: 12px;
      font-size: 10px; letter-spacing: .16em; text-transform: uppercase;
      color: rgba(255,255,255,.4); z-index: 2;
      opacity: 0;
    }
    .scroll-hint-line {
      width: 1px; height: 40px;
      background: linear-gradient(to bottom, var(--gold), transparent);
    }

    
    #stats {
      background: var(--green);
      padding: 80px 64px 100px;
      position: relative;
      overflow: visible;
    }
    .stat-block {
      padding: 40px 36px;
      background: rgba(255,255,255,.03);
      border-top: 1px solid rgba(247,249,248,.15);
      overflow: hidden;
    }
    /* Old stat styles removed - using new stat-val, stat-unit-new, stat-lbl-new */

    
    #intro {
      background: var(--bg);
      padding: 0;
      margin: 0;
      width: 100%;
    }
    /* Old intro-inner removed - using building layout */
    .intro-lbl {
      font-size: 10px; font-weight: 500; letter-spacing: .22em;
      text-transform: uppercase; color: var(--gold);
      margin-bottom: 22px; display: block;
      opacity: 0; transform: translateY(20px);
    }
    .intro-h {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(38px, 4vw, 58px);
      font-weight: 300; line-height: 1.12;
      color: var(--cream); margin-bottom: 32px;
    }
    .intro-h-wrap { overflow: hidden; }
    .intro-h-line { transform: translateY(100%); display: block; }
    .intro-h em { font-style: italic; }
    .intro-h strong { font-weight: 600; }
    .intro-p {
      font-size: 15px; font-weight: 300; line-height: 1.88;
      color: rgba(245,242,235,.48); margin-bottom: 20px;
      opacity: 0; transform: translateY(20px);
    }
    .intro-quote {
      font-family: 'MazzardM', sans-serif;
      font-size: 21px; font-style: italic; font-weight: 400;
      color: var(--gold-l); line-height: 1.65;
      border-left: 2px solid var(--gold);
      padding: 4px 0 4px 28px;
      margin: 36px 0; list-style: none;
      opacity: 0; transform: translateX(-20px);
    }
    .intro-img-wrap {
      position: relative; overflow: hidden; border-radius: 3px;
      height: 620px;
    }
    .intro-img-wrap img {
      width: 100%; height: 100%; object-fit: cover;
      display: block; will-change: transform;
    }
    .intro-img-clip {
      position: absolute; inset: 0;
      background: var(--bg);
      transform-origin: top;
    }
    @media (max-width: 900px) {
      #intro { padding: 0; }
    }

    
    #manifesto {
      height: 100vh; overflow: hidden;
      display: flex; align-items: center; justify-content: center;
      background: var(--bg);
      position: relative;
    }
    #manifesto-bg {
      position: absolute; inset: 0;
      background: url('../images/render/render-03.webp') center/cover no-repeat;
      opacity: 0; will-change: opacity, transform;
    }
    #manifesto-overlay {
      position: absolute; inset: 0;
      background: rgba(15,30,55,.55); opacity: 0;
    }
    .manifesto-text {
      position: relative; z-index: 2;
      text-align: center; padding: 0 80px;
      max-width: 1100px;
    }
    .manifesto-eyebrow {
      font-size: 10px; letter-spacing: .22em; text-transform: uppercase;
      color: var(--gold); margin-bottom: 28px; opacity: 0;
    }
    .m-word {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(40px, 5.5vw, 76px);
      font-weight: 300; line-height: 1.2;
      color: var(--cream);
      display: inline-block;
      opacity: 0; transform: translateY(32px);
    }
    .m-word.italic { font-style: italic; }
    .m-word.bold   { font-weight: 600; }
    .m-word.space  { margin-right: .28em; }
    .manifesto-sub {
      font-size: 17px; font-weight: 400;
      color: rgba(245,242,235,.75); max-width: 560px;
      margin: 32px auto 0; line-height: 1.7;
      opacity: 0; transform: translateY(16px);
    }

    
    #about {
      background: linear-gradient(to bottom, var(--cream) 0%, var(--cream) 55%, #fff 100%);
      padding: 140px 64px;
    }
    .about-inner {
      max-width: 1360px; margin: 0 auto;
      display: grid; grid-template-columns: 1fr 1fr;
      gap: 96px; align-items: center;
    }
    .about-txt .lbl {
      font-size: 10px; font-weight: 500; letter-spacing: .22em;
      text-transform: uppercase; color: var(--gold);
      margin-bottom: 22px; display: block;
      opacity: 0; transform: translateY(20px);
    }
    .about-h {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(38px, 4vw, 58px);
      font-weight: 300; line-height: 1.12;
      color: var(--green); margin-bottom: 32px;
    }
    .about-h-wrap { overflow: hidden; }
    .about-h-line { transform: translateY(100%); display: block; }
    .about-h em { font-style: italic; }
    .about-h strong { font-weight: 600; }
    .about-p {
      font-size: 15px; font-weight: 300; line-height: 1.88;
      color: var(--stone); margin-bottom: 20px;
      opacity: 0; transform: translateY(20px);
    }
    .about-quote {
      font-family: 'MazzardM', sans-serif;
      font-size: 21px; font-style: italic; font-weight: 400;
      color: var(--green); line-height: 1.65;
      border-left: 2px solid var(--gold);
      padding: 4px 0 4px 28px;
      margin: 36px 0;
      opacity: 0; transform: translateX(-20px);
    }
    .about-img-wrap {
      position: relative; overflow: hidden; border-radius: 3px;
      height: 640px;
    }
    .about-img-wrap img {
      width: 100%; height: 100%; object-fit: cover;
      display: block; will-change: transform;
    }
    .about-img-clip {
      position: absolute; inset: 0;
      background: var(--cream);
      transform-origin: top;
    }

    
    #daynght {
      position: relative; height: 88vh; min-height: 560px;
      overflow: hidden; user-select: none; -webkit-user-select: none;
    }
    #dn-night, #dn-day {
      position: absolute; inset: 0;
    }
    #dn-night img, #dn-day img {
      width: 100%; height: 100%; object-fit: cover;
      display: block; pointer-events: none;
    }
    #dn-day {
      clip-path: inset(0 50% 0 0);
      will-change: clip-path;
    }
    
    .dn-label-day {
      position: absolute; bottom: 52px; left: 52px; z-index: 5;
    }
    .dn-label-night {
      position: absolute; bottom: 52px; right: 52px; z-index: 5; text-align: right;
    }
    .dn-tag {
      display: inline-block;
      font-size: 10px; font-weight: 700; letter-spacing: .22em;
      text-transform: uppercase; color: var(--green);
      background: linear-gradient(135deg, #F4C4B2 0%, #D18557 42%, #C07141 68%, #F0C3AA 100%);
      border: 1px solid rgba(192,113,65,.5);
      border-radius: 3px;
      padding: 6px 14px; margin-bottom: 14px;
      box-shadow: 0 4px 14px rgba(11,21,37,.28);
      opacity: 0; transform: translateY(16px);
    }
    .dn-title {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(28px, 2.8vw, 44px);
      font-weight: 300; color: var(--cream);
      line-height: 1.15; display: block;
      opacity: 0; transform: translateY(16px);
    }
    .dn-title em { font-style: italic; }
    
    #dn-night::after {
      content: ''; position: absolute; inset: 0;
      background: rgba(15,30,55,.3); pointer-events: none;
    }
    
    .dn-hint {
      position: absolute; top: 50%;
      transform: translateY(-50%) translateX(0);
      z-index: 15; color: #fff; pointer-events: none;
      display: flex; align-items: center;
      opacity: .6;
      transition: transform .4s ease, opacity .4s ease;
    }
    .dn-hint svg { width: 36px; height: 36px; filter: drop-shadow(0 2px 8px rgba(0,0,0,.4)); }
    .dn-hint-left  { left: 28px; }
    .dn-hint-right { right: 28px; }
    #daynght:hover .dn-hint-left  { transform: translateY(-50%) translateX(-12px); opacity: 1; }
    #daynght:hover .dn-hint-right { transform: translateY(-50%) translateX(12px);  opacity: 1; }

    #dn-handle {
      position: absolute; top: 0; bottom: 0;
      left: 50%; width: 2px;
      background: var(--gold);
      transform: translateX(-50%);
      z-index: 20; cursor: ew-resize;
    }
    #dn-handle::before {
      content: ''; position: absolute;
      top: 0; bottom: 0; left: -18px; right: -18px;
    }
    #dn-btn {
      position: absolute; top: 50%; left: 50%;
      transform: translate(-50%, -50%);
      width: 52px; height: 52px;
      background: var(--bg); border: 1px solid var(--gold);
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      color: var(--gold); pointer-events: none;
      opacity: 0;
    }
    #dn-btn svg {
      width: 20px; height: 20px;
      animation: dn-btn-pulse .7s ease-in-out infinite alternate;
    }
    @keyframes dn-btn-pulse {
      0%   { transform: scaleX(1); }
      100% { transform: scaleX(1.4); }
    }
    @media (max-width: 700px) {
      #daynght { height: 72vw; min-height: 320px; }
      .dn-label-day { bottom: 24px; left: 20px; }
      .dn-label-night { bottom: 24px; right: 20px; }
    }

    
    #features {
      background: #fff;
      padding: 90px 0 100px;
      overflow: hidden;
      position: relative;
    }
    .feat-top {
      padding: 0 64px;
      margin-bottom: 56px;
    }
    .feat-lbl {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(38px, 4vw, 58px);
      font-weight: 600; letter-spacing: normal;
      text-transform: none;
      color: var(--green);
      display: block;
      line-height: 1.12;
      margin-bottom: 16px;
    }
    .feat-underline {
      width: 80px; height: 3px;
      background: var(--green);
    }
    .feat-begonvil {
      position: absolute; top: -30px; right: 0;
      width: 10vw;
      height: auto; pointer-events: none; z-index: 4;
    }
    .feat-stage {
      position: relative;
      width: 100%;
      height: 540px;
      display: flex; align-items: center;
      overflow: hidden;
    }
    .feat-track {
      display: flex; align-items: center;
      position: relative;
      transition: transform .6s cubic-bezier(.4,0,.2,1);
      will-change: transform;
    }
    .feat-slide {
      flex: 0 0 auto;
      width: min(54vw, 700px);
      height: 500px;
      margin: 0 12px;
      border-radius: 4px;
      overflow: hidden;
      opacity: .3;
      transform: scale(.84);
      transition: opacity .6s, transform .6s;
      cursor: pointer;
    }
    .feat-slide.active { opacity: 1; transform: scale(1); cursor: default; }
    .feat-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .feat-arrows {
      position: absolute;
      left: 50%; bottom: 24px;
      transform: translateX(min(27vw, 350px));
      margin-left: -110px;
      display: flex; gap: 10px; z-index: 5;
    }
    .feat-arrow {
      width: 50px; height: 50px; border-radius: 50%;
      border: 1px solid rgba(255,255,255,.7);
      background: rgba(23,60,105,.25);
      backdrop-filter: blur(6px);
      color: #fff; cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      transition: all .3s;
    }
    .feat-arrow:hover { background: #fff; color: var(--green); border-color: #fff; }
    .feat-arrow svg { width: 20px; height: 20px; }
    .feat-caption {
      max-width: 1100px; margin: 44px auto 0;
      padding: 0 64px;
      display: grid; grid-template-columns: 1fr 1fr;
      gap: 48px; align-items: start;
    }
    .feat-cap-title {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(24px, 2.6vw, 34px);
      font-weight: 800; letter-spacing: .04em;
      text-transform: capitalize;
      color: var(--green);
      line-height: 1.1;
    }
    .feat-cap-desc {
      font-family: 'MazzardM', sans-serif;
      font-size: 17px; font-weight: 400;
      color: var(--stone); line-height: 1.7;
    }
    @media (max-width: 860px) {
      .feat-top { padding: 0 24px; }
      .feat-slide { width: 82vw; height: 380px; }
      .feat-stage { height: 420px; }
      .feat-arrows { transform: translateX(0); margin-left: 0; left: auto; right: 24px; }
      .feat-caption { grid-template-columns: 1fr; gap: 16px; padding: 0 24px; }
      .feat-begonvil { width: 100px; top: -15px; }
    }

    
    #siteplan {
      background: var(--cream);
      padding: 120px 0 0;
    }
    .sp-header {
      max-width: 1360px; margin: 0 auto;
      padding: 0 64px 64px;
      display: flex; align-items: flex-end; justify-content: space-between;
    }
    .sp-header .lbl {
      font-size: 10px; font-weight: 500; letter-spacing: .22em;
      text-transform: uppercase; color: var(--green);
      margin-bottom: 18px; display: block; opacity: .6;
    }
    .sp-header h2 {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(36px, 4vw, 56px);
      font-weight: 300; color: var(--green); line-height: 1.12;
    }
    .sp-header h2 em { font-style: italic; }
    .sp-header p {
      font-size: 15.5px; font-weight: 400; color: var(--stone);
      max-width: 300px; line-height: 1.65; text-align: right;
    }
    .sp-map-wrap {
      position: relative; width: 100%; user-select: none;
    }
    .sp-map-img { width: 100%; display: block; }
    .sp-block {
      position: absolute; transform: translate(-50%,-50%); z-index: 4;
      display: inline-flex; align-items: center; gap: 6px;
      font-family: 'MazzardM', sans-serif;
      font-size: 11px; font-weight: 600; letter-spacing: .12em;
      text-transform: uppercase; color: var(--cream);
      background: rgba(23,60,105,.78); backdrop-filter: blur(3px);
      padding: 5px 10px 5px 6px; border-radius: 40px;
      border: 1px solid rgba(245,243,240,.25);
      box-shadow: 0 4px 14px rgba(0,0,0,.25);
      pointer-events: none; white-space: nowrap;
    }
    .sp-block span {
      display: inline-flex; align-items: center; justify-content: center;
      width: 20px; height: 20px; border-radius: 50%;
      background: var(--gold); color: #fff; font-size: 12px; font-weight: 700;
      letter-spacing: 0;
    }
    .sp-block b { font-weight: 600; }
    .sp-tap-hint { display: none; }
    .sp-entrance {
      position: absolute; transform: translate(-50%,-50%); z-index: 6;
      display: inline-flex; flex-direction: column; align-items: center; gap: 1px;
      font-family: 'MazzardM', sans-serif;
      font-size: 9px; font-weight: 700; letter-spacing: .12em;
      text-transform: uppercase; color: var(--cream);
      background: var(--green);
      padding: 5px 10px 4px; border-radius: 3px;
      box-shadow: 0 4px 12px rgba(0,0,0,.28);
      pointer-events: none; white-space: nowrap; text-align: center;
    }
    .sp-entrance svg { width: 13px; height: 13px; margin-bottom: -1px; }
    .sp-map-label {
      position: absolute; top: 20px; left: 24px; z-index: 5;
      font-family: 'MazzardM', sans-serif;
      font-size: 15px; font-weight: 700; letter-spacing: .18em;
      text-transform: uppercase; color: var(--green);
      background: rgba(245,243,240,.82); backdrop-filter: blur(6px);
      padding: 10px 18px; border-radius: 3px;
      border: 1px solid rgba(23,60,105,.15);
    }
    
    .sp-hot {
      position: absolute; transform: translate(-50%,-50%);
      cursor: pointer; z-index: 5;
    }
    .sp-hot:hover { z-index: 10; }
    .sp-ring {
      width: 32px; height: 32px; border-radius: 50%;
      background: var(--green);
      border: 2px solid rgba(247,249,248,.8);
      display: flex; align-items: center; justify-content: center;
      position: relative; transition: transform .25s;
    }
    .sp-hot:hover .sp-ring { transform: scale(1.15); }
    .sp-ring::before {
      content: ''; position: absolute; inset: -4px;
      border-radius: 50%; border: 1px solid rgba(23,60,105,.5);
      animation: sp-pulse 2.2s ease-out infinite;
    }
    .sp-ring::after {
      content: ''; position: absolute; inset: -4px;
      border-radius: 50%; border: 1px solid rgba(23,60,105,.35);
      animation: sp-pulse 2.2s ease-out infinite .9s;
    }
    @keyframes sp-pulse {
      0%   { transform: scale(1);   opacity: .9; }
      100% { transform: scale(2.6); opacity: 0;  }
    }
    .sp-dot { width: 8px; height: 8px; background: var(--cream); border-radius: 50%; }
    .sp-label {
      position: absolute; bottom: calc(100% + 10px); left: 50%;
      transform: translateX(-50%) translateY(0);
      background: var(--green); color: var(--cream);
      font-size: 9.5px; font-weight: 500; letter-spacing: .14em;
      text-transform: uppercase; white-space: nowrap;
      padding: 5px 11px; border-radius: 2px;
      opacity: .95; transition: opacity .25s, transform .25s, box-shadow .25s;
      pointer-events: none;
      box-shadow: 0 4px 14px rgba(11,21,37,.3);
    }
    .sp-label::after {
      content: ''; position: absolute; top: 100%; left: 50%;
      transform: translateX(-50%);
      border: 5px solid transparent;
      border-top-color: var(--green);
    }
    .sp-hot:hover .sp-label {
      opacity: 1; transform: translateX(-50%) translateY(-3px) scale(1.06);
    }
    
    .sp-legend { display: none; }

    #sp-backdrop {
      position: fixed; inset: 0;
      background: rgba(15,30,55,.82);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      z-index: 800;
      display: flex; align-items: center; justify-content: center;
      opacity: 0; pointer-events: none;
    }
    #sp-backdrop.sp-open { pointer-events: all; }
    #sp-modal {
      background: var(--green); border-radius: 3px;
      width: min(700px, 92vw);
      overflow: hidden; position: relative;
      transform: scale(.9) translateY(24px);
    }
    .sp-modal-img {
      width: 100%; aspect-ratio: 16 / 9; height: auto; object-fit: cover; display: block;
    }
    .sp-modal-body { padding: 36px 42px 42px; }
    .sp-modal-tag {
      font-size: 9px; font-weight: 500; letter-spacing: .2em;
      text-transform: uppercase; color: var(--stone);
      display: block; margin-bottom: 10px;
    }
    .sp-modal-title {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(30px, 3.5vw, 44px);
      font-weight: 300; color: #fff; line-height: 1.12;
      margin-bottom: 14px;
    }
    .sp-modal-desc {
      font-size: 14px; font-weight: 300;
      line-height: 1.85; color: rgba(255,255,255,.7);
    }
    .sp-close {
      position: absolute; top: 18px; right: 18px;
      width: 40px; height: 40px; border-radius: 50%;
      background: rgba(23,60,105,.88); color: var(--cream);
      border: none; cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      transition: background .2s;
    }
    .sp-close:hover { background: var(--green); }
    .sp-close svg { width: 16px; height: 16px; }
    #sp-modal .sp-close {
      background: rgba(23,60,105,.85) !important;
      color: var(--cream) !important;
      border: 1px solid rgba(255,255,255,.15) !important;
    }
    #sp-modal .sp-close:hover { background: var(--green) !important; }

    
    #gallery-section {
      position: relative;
      background: var(--bg);
    }
    .gallery-header-row {
      padding: 120px 64px 64px;
      display: flex; align-items: flex-end; justify-content: space-between;
      max-width: 1360px; margin: 0 auto;
    }
    .gallery-header-row .lbl {
      font-size: 10px; font-weight: 500; letter-spacing: .22em;
      text-transform: uppercase; color: var(--gold);
      margin-bottom: 18px; display: block;
    }
    .gallery-header-row .gh {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(38px, 4vw, 58px);
      font-weight: 300; color: white; line-height: 1.12;
    }
    .gallery-header-row .gh em { font-style: italic; }
    .gallery-header-row .gh { line-height: 1.18; }
    .gallery-header-row .gh-pre {
      font-size: 0.42em; font-weight: 400;
      letter-spacing: .01em; color: rgba(255,255,255,.78);
    }
    .gallery-header-row p {
      font-size: 15.5px; font-weight: 400; color: rgba(255,255,255,.55);
      max-width: 300px; line-height: 1.65; text-align: right;
    }

    #gallery-h-outer {
      overflow: hidden;
      padding: 0 0 16px;
    }
    #gallery-h-track {
      display: flex;
      align-items: center;
      will-change: transform;
    }
    .gal-h-slide {
      flex: 0 0 66vw;
      height: 68vh;
      min-height: 420px;
      margin: 0 14px;
      position: relative;
      overflow: hidden;
      border-radius: 3px;
      opacity: .38;
      transform: scale(.88);
      transition: box-shadow .5s;
      will-change: opacity, transform;
    }
    .gal-h-slide img {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
    }
    .gal-h-caption {
      position: absolute; bottom: 0; left: 0; right: 0;
      padding: 60px 52px 44px;
      background: linear-gradient(to top, rgba(15,30,55,.75) 0%, transparent 100%);
    }
    .gal-h-caption h3 {
      font-family: 'MazzardM', sans-serif;
      font-size: 28px; font-weight: 300; font-style: italic;
      color: white;
    }

    .gal-nav {
      display: flex; justify-content: center;
      gap: 12px; padding: 0 64px 0;
    }
    .rg-dots + .gal-nav { margin-top: 28px; }
    .gal-nav-btn {
      width: 52px; height: 52px;
      border: 1px solid rgba(247,249,248,.2);
      background: transparent; color: var(--gold);
      display: flex; align-items: center; justify-content: center;
      cursor: none; border-radius: 50%;
      transition: all .3s;
    }
    .gal-nav-btn:hover { background: var(--cream); color: var(--green); border-color: var(--cream); }

    
    #outdoor {
      display: grid; grid-template-columns: 1fr 1fr;
      min-height: 720px;
    }
    #outdoor-img {
      overflow: hidden; position: relative;
    }
    #outdoor-img img {
      width: 100%; height: 100%;
      object-fit: cover; display: block;
      will-change: transform;
    }
    .outdoor-body {
      background: var(--cream);
      padding: 110px 84px;
      display: flex; flex-direction: column; justify-content: center;
    }
    .outdoor-body .lbl {
      font-size: 10px; font-weight: 500; letter-spacing: .22em;
      text-transform: uppercase; color: var(--stone);
      margin-bottom: 22px; display: block;
      opacity: 0; transform: translateY(16px);
    }
    .outdoor-h {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(38px, 3.8vw, 56px);
      font-weight: 300; color: var(--green); line-height: 1.12;
      margin-bottom: 32px;
    }
    .outdoor-h-wrap { overflow: hidden; }
    .outdoor-h-line { transform: translateY(100%); display: block; }
    .outdoor-h em { font-style: italic; }
    .outdoor-body p {
      font-size: 15px; font-weight: 300;
      color: var(--stone); line-height: 1.88;
      margin-bottom: 18px;
      opacity: 0; transform: translateY(18px);
    }
    .outdoor-list {
      list-style: none; margin-top: 38px;
      display: flex; flex-direction: column; gap: 14px;
    }
    .outdoor-list li {
      display: flex; align-items: center; gap: 18px;
      font-size: 13.5px; color: var(--green);
      opacity: 0; transform: translateX(-16px);
    }
    .outdoor-list li::before {
      content: ''; flex-shrink: 0;
      width: 32px; height: 1px; background: var(--green);
    }

    
    #yasam-alani {
      background: var(--cream2);
      padding: 100px 64px;
    }
    .ya-head {
      display: flex; align-items: flex-end; justify-content: space-between;
      margin-bottom: 48px;
    }
    .ya-head-l .lbl { display: block; margin-bottom: 14px; color: rgba(23,60,105,.4); }
    .ya-title {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(36px, 4vw, 58px);
      font-weight: 300; color: var(--green); line-height: 1.1;
    }
    .ya-nav { display: flex; gap: 10px; }
    .ya-btn {
      width: 44px; height: 44px; border-radius: 50%;
      border: 1px solid rgba(23,60,105,.2); background: transparent;
      display: flex; align-items: center; justify-content: center;
      cursor: pointer; transition: all .25s;
    }
    .ya-btn:hover { background: var(--green); border-color: var(--green); }
    .ya-btn:hover svg { color: var(--cream); }
    .ya-btn svg { width: 16px; height: 16px; color: var(--green); transition: color .25s; }
    .ya-slider-wrap { overflow: hidden; }
    .ya-track {
      display: flex; gap: 10px;
      transition: transform .55s cubic-bezier(.4,0,.2,1);
      will-change: transform;
    }
    .ya-item {
      flex: 0 0 calc(25% - 7.5px);
      aspect-ratio: 16/9;
      overflow: hidden; border-radius: 2px;
      background: rgba(23,60,105,.2);
    }
    .ya-item img {
      width: 100%; height: 100%; object-fit: cover; display: block;
      transition: transform .55s cubic-bezier(.4,0,.2,1);
    }
    .ya-item:hover img { transform: scale(1.04); }
    .ya-dots { display: flex; gap: 8px; margin-top: 24px; justify-content: center; }
    .ya-dot {
      width: 24px; height: 2px; background: rgba(23,60,105,.2);
      cursor: pointer; transition: background .3s, width .3s;
      border: none;
    }
    .ya-dot.active { background: var(--green); width: 40px; }

    
    #location {
      background: var(--bg2);
      padding: 130px 64px;
      position: relative; overflow: hidden;
    }
    .loc-train {
      position: absolute; left: 0; top: 30px;
      width: 30%; height: auto;
      z-index: 2; pointer-events: none;
    }
    .loc-inner { max-width: 1360px; margin: 0 auto; position: relative; z-index: 1; }
    .loc-head { margin-bottom: 64px; }
    .loc-head .lbl {
      font-size: 10px; font-weight: 500; letter-spacing: .22em;
      text-transform: uppercase; color: var(--gold);
      margin-bottom: 18px; display: block;
      opacity: 0; transform: translateY(16px);
      padding-left: 30%;
    }
    .loc-h {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(40px, 4vw, 60px);
      font-weight: 300; color: white; line-height: 1.1;
      padding-left: 30%;
    }
    .loc-h-wrap { overflow: hidden; }
    .loc-h-line { transform: translateY(100%); display: block; }
    .loc-h strong { font-weight: 600; }
    .loc-sub {
      font-size: 17px; font-weight: 400; color: rgba(255,255,255,.75);
      line-height: 1.6;
      padding-left: 30%; margin-top: 16px;
    }
    .loc-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 2px;
    }
    .loc-card {
      padding: 36px 24px 34px;
      background: rgba(255,255,255,.03);
      border-top: 1px solid rgba(247,249,248,.12);
      opacity: 0; transform: translateY(32px);
      display: flex; flex-direction: column; align-items: center; text-align: center;
    }
    .loc-icon { color: var(--gold-l); margin-bottom: 20px; }
    .loc-icon svg { width: 40px; height: 40px; display: block; stroke: url(#locGold); }
    .loc-name {
      font-family: 'MazzardM', sans-serif;
      font-size: 21px; font-weight: 300; letter-spacing: .01em;
      color: rgba(255,255,255,.92); line-height: 1.25; text-wrap: balance;
    }
    .loc-dist { margin-top: 10px; }
    .loc-num {
      font-family: 'MazzardM', sans-serif;
      font-size: 32px; font-weight: 300;
      color: #ffffff; line-height: 1;
    }
    .loc-unit { font-size: 14px; color: rgba(255,255,255,.7); margin-left: 3px; }
    .loc-map-row {
      margin-top: 48px;
      border-radius: 3px; overflow: hidden;
      height: auto; opacity: 0; transform: translateY(28px);
    }
    .loc-map-row img { width: 100%; height: auto; object-fit: contain; display: block; }

    /* ── Location image gallery ── */
    .loc-gal {
      position: relative;
      overflow: hidden;
      border-radius: 3px;
      background: var(--green);
    }
    .loc-gal-track {
      display: flex;
      width: 100%;
      transition: transform .7s cubic-bezier(.65,.05,.36,1);
      will-change: transform;
    }
    .loc-gal-slide {
      flex: 0 0 100%;
      width: 100%;
    }
    .loc-gal-slide img {
      width: 100%; height: 100%;
      aspect-ratio: 1900 / 1330;
      object-fit: cover; display: block;
    }
    .loc-gal-arrow {
      position: absolute; top: 50%; transform: translateY(-50%);
      width: 54px; height: 54px; border-radius: 50%;
      background: rgba(255,255,255,.9);
      color: var(--green); border: none; cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      box-shadow: 0 6px 20px rgba(15,30,55,.22);
      transition: background .25s, transform .25s, opacity .25s;
      z-index: 3;
    }
    .loc-gal-arrow svg { width: 22px; height: 22px; }
    .loc-gal-arrow:hover { background: #fff; transform: translateY(-50%) scale(1.06); }
    .loc-gal-prev { left: 20px; }
    .loc-gal-next { right: 20px; }
    .loc-gal-dots {
      position: absolute; left: 50%; bottom: 22px; transform: translateX(-50%);
      display: flex; gap: 9px; z-index: 3;
    }
    .loc-gal-dot {
      width: 9px; height: 9px; border-radius: 50%; padding: 0;
      border: none; cursor: pointer;
      background: rgba(255,255,255,.5);
      transition: background .25s, width .25s, border-radius .25s;
    }
    .loc-gal-dot.active {
      background: #fff; width: 26px; border-radius: 5px;
    }

    
    .loc-ymap-wrap { margin-top: 52px; position: relative; border-radius: 3px; overflow: hidden; height: 720px; opacity: 0; transform: translateY(28px); }
    #loc-ymap { width: 100%; height: 100%; display: block; }
    .loc-filter-panel { position: absolute; bottom: 24px; left: 24px; display: flex; flex-direction: column; gap: 7px; z-index: 10; }
    .loc-filter-btn { display: flex; align-items: center; gap: 10px; padding: 9px 18px 9px 13px; background: rgba(11,21,37,.9); color: rgba(244,196,178,.82); border: 1px solid rgba(209,133,87,.4); border-radius: 6px; font-family: 'MazzardM', sans-serif; font-size: 10px; font-weight: 500; letter-spacing: .13em; text-transform: uppercase; cursor: pointer; transition: all .22s; backdrop-filter: blur(10px); box-shadow: 0 8px 24px rgba(11,21,37,.35); white-space: nowrap; }
    .loc-filter-btn svg { width: 14px; height: 14px; flex-shrink: 0; opacity: .8; }
    .loc-filter-btn:hover, .loc-filter-btn.active { background: rgba(11,21,37,.96); color: #F7DFCF; border-color: rgba(209,133,87,.9); }
    .loc-filter-btn.active svg { opacity: 1; }
    #loc-ymap .ymaps-2-1-79-copyright,
    #loc-ymap [class*="copyright"],
    #loc-ymap [class*="-copyright"] { display: none !important; }
    .loc-directions { margin-top: 36px; display: flex; justify-content: center; }
    .loc-dir-btn {
      display: inline-flex; align-items: center; gap: 13px;
      padding: 21px 52px; background: linear-gradient(135deg,#F4C4B2 0%,#D18557 55%,#C07141 100%);
      color: #0B1525;
      font-family: 'MazzardM', sans-serif; font-size: 19px; font-weight: 700; letter-spacing: .03em;
      border-radius: 4px; text-decoration: none;
      box-shadow: 0 14px 38px rgba(192,113,65,.32);
      transition: filter .25s, transform .25s, box-shadow .25s;
    }
    .loc-dir-btn svg { width: 24px; height: 24px; }
    .loc-dir-btn:hover { filter: brightness(1.07); transform: translateY(-2px); box-shadow: 0 18px 46px rgba(192,113,65,.42); }

    
    #sahil-banner {
      background: #fff;
      padding: 0 0 60px;
    }
    .sahil-media {
      position: relative; width: 100%; line-height: 0;
    }
    .sahil-img {
      width: 100%; height: auto; display: block;
    }
    .sahil-fade {
      position: absolute; top: 0; left: 0; right: 0;
      height: 55%;
      background: linear-gradient(to bottom, #fff 0%, rgba(255,255,255,.65) 32%, rgba(255,255,255,0) 100%);
      pointer-events: none;
    }
    .sahil-title {
      position: absolute; top: 40px; left: 64px;
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(38px, 4vw, 58px);
      font-weight: 700; color: var(--green);
      line-height: 1.12; letter-spacing: -.01em;
      margin: 0; z-index: 2;
    }

    #hisset-banner {
      background: #fff;
      padding: 40px 64px 120px;
      display: flex; justify-content: center;
      overflow: hidden;
    }
    .hisset-img {
      width: min(1240px, 100%); height: auto; display: block;
      opacity: 0; transform: translateY(60px) scale(.94);
      will-change: transform, opacity;
    }

    /* ── Render Gallery Carousel ── */
    #render-gallery {
      background: var(--bg);
      padding: 80px 0 80px;
    }
    .rg-header {
      max-width: 1360px; margin: 0 auto 40px;
      padding: 0 64px;
    }
    .rg-header .lbl {
      font-size: 10px; font-weight: 500; letter-spacing: .22em;
      text-transform: uppercase; color: var(--gold);
      margin-bottom: 14px; display: block; opacity: .8;
    }
    .rg-header h2 {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(32px, 4vw, 52px);
      font-weight: 300; color: var(--cream); line-height: 1.12;
    }
    .rg-header h2 em { font-style: italic; }
    .rg-carousel-wrap {
      position: relative;
      overflow: hidden;
    }
    .rg-track {
      display: flex;
      transition: transform .65s cubic-bezier(.4,0,.2,1);
      will-change: transform;
    }
    .rg-slide {
      flex: 0 0 60%;
      max-width: 60%;
      padding: 0 8px;
    }
    .rg-slide img {
      width: 100%; aspect-ratio: 16/9;
      object-fit: cover; display: block;
      border-radius: 6px;
    }
    .rg-arrow {
      position: absolute; top: 50%; transform: translateY(-50%);
      width: 48px; height: 48px; border-radius: 50%;
      background: rgba(255,255,255,.12); backdrop-filter: blur(8px);
      border: 1px solid rgba(255,255,255,.18);
      color: #fff; cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      transition: background .25s;
      z-index: 2;
    }
    .rg-arrow:hover { background: rgba(255,255,255,.22); }
    .rg-arrow svg { width: 20px; height: 20px; }
    .rg-prev { left: 72px; }
    .rg-next { right: 72px; }
    .rg-dots {
      display: flex; align-items: center; justify-content: center;
      gap: 8px; margin-top: 24px;
    }
    .rg-dot {
      width: 6px; height: 6px; border-radius: 50%;
      background: rgba(255,255,255,.25); border: none; cursor: pointer;
      transition: background .3s, transform .3s;
      padding: 0;
    }
    .rg-dot.active { background: var(--gold); transform: scale(1.4); }
    .rg-slide img { cursor: zoom-in; }
    @media (max-width: 860px) {
      .rg-header { padding: 0 24px; }
      .rg-slide { flex: 0 0 80%; max-width: 80%; }
      .rg-prev { left: 16px; }
      .rg-next { right: 16px; }
    }
    @media (max-width: 540px) {
      .rg-slide { flex: 0 0 92%; max-width: 92%; }
      .sp-map-label{
          font-size:10px !important;
          top:0px;
          left:0px;
      }
    }

    /* ── Lightbox ── */
    #rg-lightbox {
      position: fixed; inset: 0; z-index: 9100;
      background: rgba(5,12,25,.96);
      display: flex; align-items: center; justify-content: center;
      opacity: 0; pointer-events: none;
      transition: opacity .3s ease;
    }
    #rg-lightbox.open { opacity: 1; pointer-events: all; }
    .rg-lb-img {
      max-width: 90vw; max-height: 88vh;
      object-fit: contain; display: block;
      border-radius: 4px;
      transition: transform .4s cubic-bezier(.4,0,.2,1), opacity .4s ease;
    }
    .rg-lb-close {
      position: absolute; top: 24px; right: 28px;
      width: 44px; height: 44px; border-radius: 50%;
      background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.18);
      color: #fff; cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      transition: background .2s;
    }
    .rg-lb-close:hover { background: rgba(255,255,255,.22); }
    .rg-lb-close svg { width: 18px; height: 18px; }
    .rg-lb-arrow {
      position: absolute; top: 50%; transform: translateY(-50%);
      width: 52px; height: 52px; border-radius: 50%;
      background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.18);
      color: #fff; cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      transition: background .2s;
    }
    .rg-lb-arrow:hover { background: rgba(255,255,255,.22); }
    .rg-lb-arrow svg { width: 22px; height: 22px; }
    .rg-lb-prev { left: 28px; }
    .rg-lb-next { right: 28px; }

    #req-form {
      background: #fff;
      padding: 120px 64px;
    }
    .rf-inner {
      max-width: 1240px; margin: 0 auto;
      display: grid; grid-template-columns: 1fr 1fr;
      gap: 80px; align-items: center;
    }
    .rf-lbl {
      font-size: 10px; font-weight: 500; letter-spacing: .22em;
      text-transform: uppercase; color: var(--gold);
      margin-bottom: 22px; display: block;
    }
    .rf-family {
      display: block; width: 100%; max-width: 460px;
      height: auto; margin-bottom: 30px;
    }
    .rf-title {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(34px, 3.6vw, 52px);
      font-weight: 400; color: var(--green);
      line-height: 1.12; margin-bottom: 26px; letter-spacing: -.01em;
    }
    .rf-title em { font-style: normal; font-weight: 700; color: var(--green); }
    .rf-desc {
      font-size: 18px; font-weight: 700; color: var(--green);
      line-height: 1.7; max-width: 440px; margin-bottom: 34px;
    }
    .rf-phone {
      font-family: 'MazzardM', sans-serif;
      font-size: 30px; font-weight: 700; color: var(--green);
      text-decoration: none; letter-spacing: -.01em;
      transition: color .3s;
      display: inline-flex; align-items: center; gap: 10px;
    }
    .rf-phone svg { width: 26px; height: 26px; flex-shrink: 0; }
    .rf-phone:hover { color: var(--gold); }
    .rf-right {
      background: var(--green); border-radius: 4px;
      padding: 44px 42px;
    }
    .rf-form-title {
      font-family: 'MazzardM', sans-serif;
      font-size: 18px; font-weight: 600; letter-spacing: .04em;
      color: var(--cream); margin-bottom: 24px;
    }
    .rf-field { position: relative; margin-bottom: 26px; }
    .rf-field label {
      display: block; font-size: 10px; font-weight: 700;
      letter-spacing: .14em; text-transform: uppercase;
      color: rgba(255,255,255,.55); margin-bottom: 10px;
    }
    .rf-field input, .rf-field select {
      width: 100%; border: none; background: transparent;
      font-family: 'MazzardM', sans-serif;
      font-size: 16px; font-weight: 300; color: #fff;
      padding: 0 0 10px; outline: none; border-radius: 0;
      -webkit-appearance: none; appearance: none;
    }
    .rf-field select option { color: var(--green); }
    .rf-field input::placeholder { color: rgba(255,255,255,.4); }
    .rf-line { display: block; height: 1px; background: rgba(255,255,255,.22); }
    .rf-field input:focus ~ .rf-line, .rf-field select:focus ~ .rf-line { background: rgba(255,255,255,.7); }
    .rf-kvkk {
      display: flex; gap: 11px; align-items: flex-start;
      font-size: 12px; font-weight: 300; color: rgba(255,255,255,.6);
      line-height: 1.6; margin: 4px 0 28px; cursor: pointer;
    }
    .rf-kvkk input { margin-top: 2px; accent-color: var(--cream); flex-shrink: 0; }
    .rf-kvkk a { color: #fff; }
    .rf-submit {
      width: 100%;
      display: inline-flex; align-items: center; justify-content: center; gap: 12px;
      background: var(--cream); color: var(--green);
      font-family: 'MazzardM', sans-serif;
      font-size: 13px; font-weight: 600; letter-spacing: .1em;
      text-transform: uppercase;
      padding: 19px; border: none; border-radius: 3px;
      cursor: pointer; transition: background .3s;
    }
    .rf-submit svg { width: 18px; height: 18px; }
    .rf-submit:hover { background: #fff; }
    .rf-success {
      display: none; text-align: center;
      font-size: 15px; font-weight: 300; color: #fff;
      line-height: 1.7; padding: 40px 0;
    }

    #catalog {
      background: linear-gradient(135deg,#F4C4B2 0%,#D18557 55%,#C07141 100%);
      padding: 64px 64px;
      position: relative; overflow: hidden;
      border-top: 1px solid rgba(255,255,255,.12);
    }
    .cat-inner {
      max-width: 1040px; margin: 0 auto;
      display: flex; align-items: center; justify-content: space-between;
      gap: 48px; flex-wrap: wrap;
      position: relative; z-index: 1;
    }
    .cat-lbl {
      font-size: 11px; font-weight: 600; letter-spacing: .24em;
      text-transform: uppercase; color: rgba(11,21,37,.6);
      margin-bottom: 14px; display: block;
    }
    .cat-title {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(28px, 3vw, 40px);
      font-weight: 600; color: #0B1525; line-height: 1.1;
      margin-bottom: 10px; letter-spacing: -.01em;
    }
    .cat-title em { font-style: normal; font-weight: 800; color: #0B1525; }
    .cat-desc {
      font-size: clamp(14px, 1.2vw, 16px); font-weight: 400;
      color: rgba(11,21,37,.7); line-height: 1.7;
      max-width: 460px; margin: 0;
    }
    .cat-text { flex: 1 1 380px; }
    .cat-btn {
      display: inline-flex; align-items: center; gap: 14px;
      background: var(--green); color: var(--cream);
      font-family: 'MazzardM', sans-serif;
      font-size: 14px; font-weight: 600; letter-spacing: .1em;
      text-transform: uppercase;
      padding: 19px 40px; border: none; border-radius: 3px;
      cursor: pointer; flex-shrink: 0;
      transition: background .3s, transform .25s, box-shadow .3s;
      box-shadow: 0 14px 40px rgba(11,21,37,.22);
    }
    .cat-btn svg { width: 22px; height: 22px; }
    .cat-btn:hover { background: var(--green-l); transform: translateY(-3px); box-shadow: 0 20px 48px rgba(11,21,37,.3); }

    .cat-disclaimers {
      text-align: center;
      padding: 12px 40px 0;
    }
    .cat-disclaimers p {
      font-size: 11px;
      color: rgba(255,255,255,0.45);
      margin: 2px 0;
      line-height: 1.5;
    }

    /* ── Catalog modal ── */
    #cat-backdrop {
      position: fixed; inset: 0; z-index: 1200;
      background: rgba(15,30,55,.82); backdrop-filter: blur(4px);
      display: flex; align-items: center; justify-content: center;
      padding: 24px;
      opacity: 0; pointer-events: none;
      transition: opacity .35s;
    }
    #cat-backdrop.open { opacity: 1; pointer-events: all; }
    #cat-modal {
      background: var(--cream); border-radius: 4px;
      width: min(460px, 100%); padding: 48px 44px 44px;
      position: relative;
      transform: scale(.92) translateY(20px);
      transition: transform .4s cubic-bezier(.16,1,.3,1);
      box-shadow: 0 30px 80px rgba(0,0,0,.4);
    }
    #cat-backdrop.open #cat-modal { transform: scale(1) translateY(0); }
    .cat-close {
      position: absolute; top: 16px; right: 16px;
      width: 38px; height: 38px; border-radius: 50%;
      background: rgba(23,60,105,.08); color: var(--green);
      border: none; cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      transition: background .2s;
    }
    .cat-close:hover { background: rgba(23,60,105,.16); }
    .cat-close svg { width: 16px; height: 16px; }
    .cat-modal-lbl {
      font-size: 10px; font-weight: 500; letter-spacing: .22em;
      text-transform: uppercase; color: var(--gold);
      display: block; margin-bottom: 14px;
    }
    .cat-modal-title {
      font-family: 'MazzardM', sans-serif;
      font-size: 26px; font-weight: 600; color: var(--green);
      line-height: 1.18; margin-bottom: 32px;
    }
    .cat-field { position: relative; margin-bottom: 26px; }
    .cat-field label {
      display: block; font-size: 10px; font-weight: 500;
      letter-spacing: .14em; text-transform: uppercase;
      color: var(--stone); margin-bottom: 10px;
    }
    .cat-field input {
      width: 100%; border: none; background: transparent;
      font-family: 'MazzardM', sans-serif;
      font-size: 16px; font-weight: 300; color: var(--green);
      padding: 0 0 10px; outline: none;
    }
    .cat-field input::placeholder { color: rgba(23,60,105,.32); }
    .cat-line { display: block; height: 1px; background: rgba(23,60,105,.18); }
    .cat-field input:focus ~ .cat-line { background: var(--gold); }
    .cat-submit {
      width: 100%; margin-top: 8px;
      display: inline-flex; align-items: center; justify-content: center; gap: 12px;
      background: var(--green); color: var(--cream);
      font-family: 'MazzardM', sans-serif;
      font-size: 13px; font-weight: 600; letter-spacing: .1em;
      text-transform: uppercase;
      padding: 18px; border: none; border-radius: 3px;
      cursor: pointer; transition: background .3s;
    }
    .cat-submit svg { width: 18px; height: 18px; }
    .cat-submit:hover { background: var(--green-l); }
    /* Footer (cta) formunda etiket + placeholder tam beyaz */
    #cta .rf-field label { color: #fff; }
    #cta .rf-field input, #cta .rf-field select { color: #fff; }
    #cta .rf-field input::placeholder { color: rgba(255,255,255,.75); }
    .cat-submit-inner { display: inline-flex; align-items: center; justify-content: center; gap: 12px; }
    .cat-submit.is-loading { background: var(--green); cursor: default; }
    .cat-submit.is-done { background: #1F8A5B; cursor: default; }
    .cat-submit.is-done:hover { background: #1F8A5B; }
    .cat-spin { animation: cat-spin 0.7s linear infinite; transform-origin: 50% 50%; }
    @keyframes cat-spin { to { transform: rotate(360deg); } }
    .cat-success {
      display: none; text-align: center;
      font-size: 15px; font-weight: 300; color: var(--green);
      line-height: 1.7; padding: 20px 0;
    }

    
    #cta {
      background: var(--bg);
      padding: 110px 64px;
      display: flex; align-items: flex-start;
      justify-content: space-between; gap: 80px;
      border-top: 1px solid rgba(247,249,248,.12);
    }
    .cta-l { flex: 1; }
    .cta-l .lbl {
      font-size: 10px; font-weight: 500; letter-spacing: .22em;
      text-transform: uppercase; color: var(--gold);
      margin-bottom: 18px; display: block;
    }
    .cta-l h2 {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(36px, 4vw, 60px);
      font-weight: 300; color: white; line-height: 1.12;
      margin-bottom: 48px;
    }
    .cta-l h2 em { font-style: italic; }
    .cta-phone {
      display: inline-flex; align-items: center; gap: 12px;
      font-family: 'MazzardM', sans-serif;
      font-size: 38px; font-weight: 700;
      color: white; text-decoration: none;
      letter-spacing: -.01em; line-height: 1;
      margin-bottom: 12px;
      transition: color .3s;
    }
    .cta-phone:hover { color: var(--cream2); }
    .cta-phone svg { width: 24px; height: 24px; flex-shrink: 0; }
    .cta-addr { font-size: 12px; color: rgba(255,255,255,.32); line-height: 1.9; margin-bottom: 32px; }
    .cta-btns { display: flex; gap: 12px; }
    .btn-green {
      background: var(--green); color: var(--cream);
      border: 1px solid rgba(247,249,248,.35);
      padding: 14px 32px; border-radius: 2px;
      font-size: 11px; font-weight: 500; letter-spacing: .14em;
      text-transform: uppercase; text-decoration: none;
      transition: background .3s, border-color .3s;
    }
    .btn-green:hover { background: var(--green-l); border-color: rgba(247,249,248,.6); }

    
    .cta-r { flex: 1; max-width: 600px; flex-shrink: 0; }
    .cta-form-head { margin-bottom: 36px; }
    .cta-form-head .lbl { font-size: 9px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: rgba(247,249,248,.35); display: block; margin-bottom: 10px; }
    .cta-form-head h3 { font-family: 'MazzardM', sans-serif; font-size: clamp(22px, 2.2vw, 32px); font-weight: 300; color: white; line-height: 1.2; }
    .cta-form { display: flex; flex-direction: column; gap: 0; }
    .cta-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; }
    .cta-field { position: relative; border-bottom: 1px solid rgba(247,249,248,.15); }
    .cta-field:last-of-type { border-bottom: none; }
    .cta-field label {
      display: block; font-size: 9px; font-weight: 700; letter-spacing: .2em;
      text-transform: uppercase; color: var(--cream);
      padding: 20px 0 6px;
    }
    .cta-field input,
    .cta-field select,
    .cta-field textarea {
      width: 100%; background: transparent; border: none; outline: none;
      font-family: 'MazzardM', sans-serif; font-size: 14px; font-weight: 300;
      color: var(--cream); caret-color: var(--cream);
      padding: 0 0 18px; line-height: 1.5; resize: none;
    }
    .cta-field select { cursor: pointer; appearance: none; }
    .cta-field select option { background: #0F2540; color: var(--cream); }
    .cta-field input::placeholder,
    .cta-field textarea::placeholder { color: rgba(247,249,248,.22); }
    .cta-field-line {
      position: absolute; bottom: 0; left: 0;
      width: 0; height: 1px; background: var(--cream);
      transition: width .4s cubic-bezier(.4,0,.2,1);
    }
    .cta-field:focus-within .cta-field-line { width: 100%; }
    .cta-field:focus-within label { color: rgba(247,249,248,.65); }
    .cta-divider { height: 1px; background: rgba(247,249,248,.1); margin: 0; }
    .cta-form-row .cta-field { border-bottom: none; border-right: 1px solid rgba(247,249,248,.1); }
    .cta-form-row .cta-field:last-child { border-right: none; padding-left: 24px; }
    
    .kvkk-block {
      margin-top: 0;
      padding: 20px 20px 0;
      background: rgba(247,249,248,.05);
      border: 1px solid rgba(247,249,248,.12);
      border-radius: 2px;
    }
    .kvkk-intro {
      font-size: 12px; font-weight: 300; line-height: 1.7;
      color: rgba(247,249,248,.55); margin-bottom: 14px;
    }
    .kvkk-intro a { color: rgba(247,249,248,.75); text-decoration: underline; }
    .kvkk-check {
      display: flex; align-items: flex-start; gap: 10px;
      margin-bottom: 10px;
    }
    .kvkk-check input[type="checkbox"] {
      width: 15px; height: 15px; flex-shrink: 0; margin-top: 2px;
      accent-color: var(--cream); cursor: pointer;
    }
    .kvkk-check label {
      font-size: 12px; font-weight: 300; line-height: 1.65;
      color: rgba(247,249,248,.65); cursor: pointer;
    }
    .kvkk-check label a { color: rgba(247,249,248,.8); text-decoration: underline; }
    .kvkk-channels {
      display: flex; flex-wrap: wrap; gap: 16px;
      margin: 10px 0 14px 25px;
    }
    .kvkk-ch {
      display: flex; align-items: center; gap: 6px;
      font-size: 12px; color: rgba(247,249,248,.65);
    }
    .kvkk-ch input[type="checkbox"] {
      width: 15px; height: 15px;
      accent-color: var(--cream); cursor: pointer;
    }

    .cta-submit {
      margin-top: 32px; display: inline-flex; align-items: center; gap: 16px;
      align-self: flex-start;
      background: linear-gradient(135deg, #F4C4B2 0%, #D18557 55%, #C07141 100%); border: none; cursor: pointer;
      padding: 14px 24px 14px 28px; border-radius: 2px;
      font-family: 'MazzardM', sans-serif;
      position: relative; overflow: hidden;
    }
    .cta-submit::before {
      content: ''; position: absolute; inset: 0;
      background: var(--cream);
      transform: scaleX(0); transform-origin: left;
      transition: transform .45s cubic-bezier(.4,0,.2,1);
    }
    .cta-submit:hover::before { transform: scaleX(1); }
    .cta-submit-txt {
      font-size: 10px; font-weight: 700; letter-spacing: .2em;
      text-transform: uppercase; color: var(--green);
      position: relative; z-index: 1;
      transition: color .45s;
    }
    .cta-submit-arrow {
      width: 32px; height: 32px; border-radius: 50%;
      border: 1px solid rgba(23,60,105,.3);
      display: flex; align-items: center; justify-content: center;
      position: relative; z-index: 1;
      transition: border-color .45s;
    }
    .cta-submit-arrow svg { width: 14px; height: 14px; color: var(--green); transition: color .45s; }
    .cta-submit:hover .cta-submit-txt { color: var(--green); }
    .cta-submit:hover .cta-submit-arrow { border-color: var(--green); }
    .cta-submit:hover .cta-submit-arrow svg { color: var(--green); }
    .cta-success {
      display: none; padding: 20px 0;
      font-family: 'MazzardM', sans-serif;
      font-size: 20px; font-weight: 300; font-style: italic;
      color: rgba(247,249,248,.7); line-height: 1.6;
    }

    
    /* Old side-trigger styles removed - new SVG button styles at end of file */
    
    #side-panel {
      position: fixed; right: 0; bottom: 0;
      z-index: 520;
      width: 420px;
      background: #0B1525;
      border-top: 1px solid rgba(247,249,248,.1);
      border-left: 1px solid rgba(247,249,248,.08);
      transform: translateX(100%);
      display: flex; flex-direction: column;
    }
    .sp-head {
      padding: 28px 32px 20px;
      border-bottom: 1px solid rgba(247,249,248,.08);
      display: flex; align-items: center; justify-content: space-between;
    }
    .sp-head-title {
      font-family: 'MazzardM', sans-serif;
      font-size: 22px; font-weight: 300; color: var(--cream);
    }
    .sp-close {
      background: none; border: none; cursor: pointer;
      color: rgba(247,249,248,.4); padding: 4px;
      display: flex; transition: color .2s;
    }
    .sp-close:hover { color: var(--cream); }
    .sp-close svg { width: 18px; height: 18px; }
    .sp-body { padding: 24px 32px 32px; overflow-y: auto; flex: 1; }
    .sp-subtitle {
      font-size: 10px; font-weight: 600; letter-spacing: .16em;
      text-transform: uppercase; color: var(--gold);
      margin-bottom: 20px; line-height: 1.6;
    }
    #side-panel .sp-subtitle { color: var(--gold); }
    .sp-field { position: relative; border-bottom: 1px solid rgba(247,249,248,.12); margin-bottom: 4px; }
    .sp-field label {
      display: block; font-size: 8px; font-weight: 700; letter-spacing: .22em;
      text-transform: uppercase; color: var(--cream);
      padding: 16px 0 5px;
    }
    .sp-field input,
    .sp-field select,
    .sp-field textarea {
      width: 100%; background: transparent; border: none; outline: none;
      font-family: 'MazzardM', sans-serif; font-size: 13px; font-weight: 300;
      color: var(--cream); caret-color: var(--cream);
      padding: 0 0 14px; resize: none;
    }
    .sp-field select option { background: #0B1525; }
    .sp-field input::placeholder,
    .sp-field textarea::placeholder { color: rgba(247,249,248,.2); }
    .sp-field-line {
      position: absolute; bottom: 0; left: 0;
      width: 0; height: 1px; background: rgba(247,249,248,.5);
      transition: width .4s cubic-bezier(.4,0,.2,1);
    }
    .sp-field:focus-within .sp-field-line { width: 100%; }
    .sp-field:focus-within label { color: rgba(247,249,248,.6); }
    .sp-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
    .sp-submit {
      margin-top: 5px; width: 100%;
      background: linear-gradient(135deg, #F4C4B2 0%, #D18557 55%, #C07141 100%); color: var(--cream);
      border: none; cursor: pointer;
      padding: 15px 24px;
      font-family: 'MazzardM', sans-serif;
      font-size: 13px; font-weight: 700; letter-spacing: .18em;
      text-transform: uppercase;
      display: flex; align-items: center; justify-content: space-between;
      position: relative; overflow: hidden;
      transition: background .3s;
    }
    .sp-submit:hover { background: linear-gradient(135deg, #F4C4B2 0%, #C07141 55%, #A85E30 100%); }
    .sp-success {
      display: none; text-align: center; padding: 32px 0;
      font-family: 'MazzardM', sans-serif;
      font-size: 18px; font-weight: 300; font-style: italic;
      color: rgba(247,249,248,.6); line-height: 1.7;
    }

    
    #back-top {
      position: fixed; right: 24px; bottom: 160px;
      z-index: 500;
      width: 44px; height: 44px;
      background: var(--bg); color: var(--cream);
      border: 1px solid rgba(247,249,248,.22);
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      cursor: pointer;
      opacity: 0; pointer-events: none;
      transform: translateY(12px);
      transition: opacity .35s, transform .35s, background .25s, border-color .25s;
    }
    #back-top.visible { opacity: 1; pointer-events: all; transform: translateY(0); }
    #back-top:hover { background: var(--cream); border-color: var(--cream); }
    #back-top:hover svg { color: var(--green); }
    #back-top svg { width: 18px; height: 18px; transition: color .25s; }
    @media (max-width: 860px) {
      #back-top { right: 16px; bottom: 128px; width: 40px; height: 40px; }
    }

    
    footer {
      background: var(--bg);
      padding: 54px 64px;
      display: flex; flex-direction: column;
      gap: 30px;
    }
    .footer-main { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
    .footer-logo img { height: 44px; opacity: .5; display: block; }
    .footer-social { display: flex; gap: 14px; }
    .footer-social a {
      width: 52px; height: 52px; border-radius: 50%;
      border: 1px solid rgba(255,255,255,.18);
      display: flex; align-items: center; justify-content: center;
      color: rgba(255,255,255,.72); transition: background .3s, color .3s, border-color .3s;
    }
    .footer-social a:hover { background: var(--gold); border-color: var(--gold); color: #fff; }
    .footer-social svg { width: 25px; height: 25px; }
    .footer-bottom {
      display: flex; align-items: center; justify-content: space-between;
      gap: 18px; flex-wrap: wrap;
      border-top: 1px solid rgba(255,255,255,.08); padding-top: 26px;
    }
    footer p { font-size: 11px; color: rgba(255,255,255,.3); letter-spacing: .05em; text-align: left; }
    footer a { font-size: 11px; color: rgba(255,255,255,.4); text-decoration: none; transition: color .3s; }
    footer a:hover { color: var(--gold); }
    .footer-links { display: flex; flex-wrap: wrap; gap: 8px 22px; }
    .footer-links a { cursor: pointer; }

    
    #mobile-nav {
      position: fixed; inset: 0;
      background: var(--bg); z-index: 2000;
      display: flex; flex-direction: column;
      padding: 0 32px 36px;
      clip-path: circle(0% at calc(100% - 48px) 36px);
      transition: clip-path .6s cubic-bezier(.4,0,.2,1);
      overflow-y: auto;
    }
    #mobile-nav.open { clip-path: circle(150% at calc(100% - 48px) 36px); }

    .mn-header {
      display: flex; align-items: center; justify-content: space-between;
      padding: 28px 0 20px; flex-shrink: 0;
      border-bottom: 1px solid rgba(255,255,255,.08);
    }
    .mn-logo img { height: 36px; display: block; }

    #mn-close {
      background: none; border: none; cursor: pointer;
      color: rgba(255,255,255,.7); padding: 6px;
      display: flex; align-items: center; justify-content: center;
      transition: color .2s;
    }
    #mn-close:hover { color: #fff; }
    #mn-close svg { width: 28px; height: 28px; }

    .mn-links {
      display: flex; flex-direction: column;
      padding: 20px 0 0; flex: 1; gap: 2px;
    }
    .mn-links a {
      font-family: 'MazzardM', sans-serif;
      font-size: 23px; font-weight: 300; color: rgba(255,255,255,.75);
      text-decoration: none;
      padding: 8px 0;
      border-bottom: 1px solid rgba(255,255,255,.07);
      transition: color .2s, padding-left .2s;
    }
    .mn-links a:last-child { border-bottom: none; }
    .mn-links a:hover { color: #fff; padding-left: 8px; }

    .mn-phone {
      display: inline-flex; align-items: center; gap: 10px;
      font-family: 'MazzardM', sans-serif;
      font-size: 22px; font-weight: 600; color: #fff;
      text-decoration: none; margin-bottom: 28px;
      transition: color .2s;
    }
    .mn-phone:hover { color: var(--gold); }
    .mn-phone svg { width: 22px; height: 22px; flex-shrink: 0; }

    .mn-footer {
      flex-shrink: 0; padding-top: 24px;
      border-top: 1px solid rgba(255,255,255,.08);
    }
    .mn-social {
      display: flex; gap: 12px; margin-bottom: 24px;
    }
    .mn-soc-btn {
      width: 46px; height: 46px; border-radius: 50%;
      background: rgba(255,255,255,.12);
      display: flex; align-items: center; justify-content: center;
      color: #fff; text-decoration: none;
      transition: background .2s;
    }
    .mn-soc-btn:hover { background: var(--gold); }
    .mn-soc-btn svg { width: 18px; height: 18px; }
    .mn-foot-links {
      display: flex; flex-direction: column; gap: 10px;
    }
    .mn-foot-links a {
      font-family: 'MazzardM', sans-serif;
      font-size: 11px; font-weight: 400; letter-spacing: .06em;
      color: rgba(255,255,255,.7); text-decoration: none;
      transition: color .2s;
    }
    .mn-foot-links a:hover { color: rgba(255,255,255,.7); }

    
    @media (max-width: 1100px) {
      .feat-grid { grid-template-columns: repeat(2,1fr); }
      .feat-header { flex-direction: column; align-items: flex-start; }
      .feat-header p { text-align: left; }
      #outdoor { grid-template-columns: 1fr; }
      #outdoor-img { height: 480px; }
      .outdoor-body { padding: 72px 48px; }
      .loc-grid { grid-template-columns: repeat(2,1fr); }
      #cta { flex-direction: column; align-items: flex-start; }
      .cta-r { max-width: 100%; width: 100%; }
      
      .sp-header { flex-direction: column; align-items: flex-start; gap: 12px; }
      .sp-header p { text-align: left; }
    }
    @media (max-width: 860px) {
      #hero-bg { background-position: 78% center; }
      body { cursor: auto; }

      
      #navbar { padding: 18px 24px; }
      #navbar.solid { padding: 14px 24px; }
      .nav-links { display: none; }
      .nav-toggle { display: flex; cursor: pointer; }

      
      #hero-content { padding: 0 24px 150px; }
      .hero-btns { flex-wrap: wrap; gap: 12px; }
      .scroll-hint { display: none; }

      
      #stats { grid-template-columns: repeat(2,1fr); padding: 48px 20px; }
      .stat-block { padding: 28px 20px; }

      
      #intro { padding: 0; }

      
      .manifesto-text { padding: 0 24px; }
      #manifesto { min-height: 480px; height: auto; padding: 80px 0; }

      
      #about { padding: 80px 24px; }
      .about-inner { grid-template-columns: 1fr; gap: 40px; }
      .about-img-wrap { height: 340px; order: -1; }

      
      #daynght { height: 60vw; min-height: 280px; }
      .dn-label-day { bottom: 20px; left: 20px; }
      .dn-label-night { bottom: 20px; right: 20px; }
      .dn-title { font-size: clamp(20px, 4vw, 32px); }

      
      #features { padding: 80px 24px; }
      .feat-header { padding-bottom: 0; }

      
      #siteplan { padding-top: 72px; }
      .sp-header { flex-direction: column; align-items: flex-start; padding: 0 24px 36px; gap: 10px; }
      .sp-header p { text-align: left; max-width: 100%; }
      .sp-modal-img { aspect-ratio: 16 / 9; height: auto; }
      .sp-modal-body { padding: 24px 28px 32px; }

      
      .gallery-header-row { padding: 72px 24px 40px; flex-direction: column; align-items: flex-start; gap: 14px; }
      .gallery-header-row p { text-align: left; max-width: 100%; }
      .sahil-img { height: 65vh; object-fit: cover; object-position: 35% 30%; }
      .building-cloud { display: none; }
      /* Sticky form yüksekliğini azalt — öğe boşluklarını sıkılaştır */
      #side-panel .sp-head { padding: 16px 22px 12px; }
      #side-panel .sp-body { padding: 14px 22px 18px; }
      #side-panel .sp-field label { padding: 9px 0 3px; font-size: 7.5px; }
      #side-panel .sp-field input,
      #side-panel .sp-field select,
      #side-panel .sp-field textarea { padding-bottom: 9px; }
      #side-panel .sp-subtitle { margin-bottom: 6px; }
      #side-panel .sp-submit { margin-top: 4px; padding: 13px; }
      #side-panel .kvkk-block { margin-top: 8px; padding: 10px 12px; }
      #side-panel .kvkk-check { margin-bottom: 6px; }
      #side-panel .kvkk-channels { gap: 8px 14px; margin: 8px 0; }
      .gal-h-slide { flex: 0 0 86vw; height: 54vh; min-height: 260px; }
      .gal-h-caption { padding: 40px 28px 28px; }
      .gal-nav { padding: 0 24px 56px; justify-content: center; }

      
      .outdoor-body { padding: 60px 24px; }

      
      #location { padding: 80px 24px; }
      .loc-train { position: static; width: 72%; margin: 0 0 28px -24px; top: auto; }
      .loc-head .lbl, .loc-h { padding-left: 0; }
      .loc-map-row { height: auto; }
      .loc-gal-arrow { width: 44px; height: 44px; }
      .loc-gal-arrow svg { width: 18px; height: 18px; }
      .loc-gal-prev { left: 12px; }
      .loc-gal-next { right: 12px; }
      .loc-gal-dots { bottom: 14px; }
      .loc-ymap-wrap { height: 540px; }
      .loc-filter-panel { gap: 5px; }

      
      #req-form { padding: 70px 24px; }
      .sahil-title { top: 22px; left: 24px; }
      .rf-inner { grid-template-columns: 1fr; gap: 40px; }
      .rf-right { padding: 32px 24px; }
      .rf-phone { font-size: 26px; }

      #catalog { padding: 80px 24px; }
      .cat-btn { padding: 18px 34px; font-size: 13px; }

      
      #cta { padding: 72px 24px; }
      .cta-phone { font-size: 32px; }
      .cta-form-row { grid-template-columns: 1fr; }
      .cta-form-row .cta-field { border-right: none !important; padding-left: 0 !important; border-bottom: 1px solid rgba(247,249,248,.15); }
      .cta-submit { width: 100%; justify-content: space-between; }

      
      #side-panel {
        left: 12px; right: 0; bottom: 12px; width: auto;
        border-left: 1px solid rgba(247,249,248,.08);
        border-radius: 10px; overflow: hidden;
      }
      .hero-svg-title { width: min(90vw, 600px); }

      
      footer { padding: 40px 24px; gap: 24px; }
      .footer-main { flex-direction: column; align-items: flex-start; gap: 22px; }
      .footer-bottom { flex-direction: column; align-items: flex-start; gap: 16px; }
    }
    @media (max-width: 540px) {
      
      .hero-btns { flex-direction: column; align-items: flex-start; gap: 10px; }
      .btn-g, .btn-ghost { width: 100%; justify-content: center; }

      
      #stats { padding: 36px 16px; }
      .stat-block { padding: 22px 16px; }

      
      .feat-grid { grid-template-columns: 1fr; }

      
      .loc-grid { grid-template-columns: repeat(2,1fr); }
      .loc-ymap-wrap { height: 460px; }
      .loc-filter-panel { flex-direction: row; flex-wrap: wrap; bottom: 12px; left: 12px; gap: 5px; }
      .loc-filter-btn { font-size: 9px; padding: 6px 10px 6px 8px; }

      
      #mn-close { cursor: pointer; }

      
      .sp-label { display: none; }
      /* Yaşam haritasını mobilde anlaşılır kıl */
      .sp-block { padding: 3px; gap: 0; border-radius: 50%; }
      .sp-block b { display: none; }
      .sp-block span { width: 22px; height: 22px; font-size: 12px; }
      .sp-ring { width: 26px; height: 26px; border-width: 3px; }
      /* Pin numaralandırma */
      .sp-map-wrap { counter-reset: spnum; }
      .sp-hot { counter-increment: spnum; }
      .sp-dot {
        width: 16px; height: 16px;
        background: transparent; border-radius: 0;
        display: flex; align-items: center; justify-content: center;
        font-family: 'MazzardM', sans-serif;
        font-size: 10px; font-weight: 700; color: var(--cream);
      }
      .sp-dot::before { content: counter(spnum); }

      /* Legend */
      .sp-legend {
        display: block;
        padding: 24px 20px 8px;
        counter-reset: spnum;
      }
      .sp-legend-title {
        font-family: 'Cormorant Garamond', serif;
        font-size: 22px; font-weight: 500;
        color: #173C69;
        margin: 0 0 16px;
      }
      .sp-legend-list {
        list-style: none; margin: 0; padding: 0;
        display: grid; grid-template-columns: 1fr 1fr;
        gap: 10px 16px;
      }
      .sp-legend-list li {
        font-family: 'MazzardM', sans-serif;
        font-size: 12px; font-weight: 500;
        color: #173C69;
        display: flex; align-items: center; gap: 8px;
        counter-increment: spnum;
      }
      .sp-legend-list li::before {
        content: counter(spnum);
        min-width: 22px; height: 22px;
        background: var(--green); color: var(--cream);
        border-radius: 50%;
        display: flex; align-items: center; justify-content: center;
        font-size: 10px; font-weight: 700; flex-shrink: 0;
      }

      .sp-tap-hint {
        display: inline-flex; align-items: center; gap: 7px;
        position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%);
        z-index: 6; white-space: nowrap;
        font-family: 'MazzardM', sans-serif;
        font-size: 12px; font-weight: 600; letter-spacing: .04em;
        color: var(--cream);
        background: rgba(23,60,105,.9); backdrop-filter: blur(4px);
        padding: 9px 16px; border-radius: 40px;
        box-shadow: 0 6px 18px rgba(0,0,0,.28);
        display:none !important;
      }
      .sp-tap-hint svg { width: 17px; height: 17px; flex-shrink: 0; }
    }

    /* ── Nav right group ── */
    .nav-right-group {
      display: flex; align-items: center; gap: 16px;
    }
    .nav-lang {
      font-family: 'MazzardM', sans-serif;
      font-size: 14px; font-weight: 700; letter-spacing: .08em;
      color: #fff;
      cursor: pointer; transition: opacity .3s;
    }
    .nav-lang:hover { opacity: .7; }
    .nav-phone-btn {
      display: flex; align-items: center; justify-content: center;
      gap: 9px;
      color: #fff;
      transition: opacity .3s; text-decoration: none;
      padding: 4px;
    }
    .nav-phone-btn:hover { opacity: .7; }
    .nav-phone-btn svg { width: 19px; height: 19px; flex-shrink: 0; }
    .nav-phone-num {
      font-family: 'MazzardM', sans-serif;
      font-size: 14px; font-weight: 700; letter-spacing: .03em;
      color: #fff; white-space: nowrap;
    }
    .nav-divider {
      width: 1px; height: 22px;
      background: rgba(255,255,255,.3);
      display: block;
    }
    @media (max-width: 860px) {
      .nav-right-group { display: none; }
    }

    /* ── Hero new layout ── */
    .hero-kicker {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(14px, 1.8vw, 20px);
      font-weight: 400; letter-spacing: .28em;
      text-transform: uppercase;
      color: rgba(255,255,255,.85);
      text-align: center;
      margin-bottom: 16px;
      opacity: 0;
    }
    .hero-svg-title {
      width: clamp(320px, 56vw, 760px);
      height: auto;
      filter: brightness(0) invert(1);
      opacity: 0;
      display: block;
    }
    .scroll-hint-center {
      position: absolute; bottom: 32px; left: 50%;
      transform: translateX(-50%);
      z-index: 3;
      color: rgba(255,255,255,.5);
      cursor: pointer;
      opacity: 0;
      animation: scrollBounce 2s ease-in-out infinite 3s;
    }
    @keyframes scrollBounce {
      0%, 100% { transform: translateX(-50%) translateY(0); }
      50% { transform: translateX(-50%) translateY(8px); }
    }

    /* ── Stats new layout ── */
    .stats-inner {
      max-width: 1360px; margin: 0 auto;
      padding: 0;
    }
    .stats-top {
      display: flex; align-items: flex-start;
      justify-content: space-between; gap: 60px;
      margin-bottom: 56px;
    }
    .stats-heading {
      display: flex; align-items: flex-start; gap: 20px;
      flex: 1;
    }
    .stats-title {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(22px, 2.4vw, 32px);
      font-weight: 600; color: #fff;
      line-height: 1.45;
    }
    .stats-marti {
      width: 60px; height: auto;
      opacity: .7;
      flex-shrink: 0;
      margin-top: 4px;
    }
    .stats-desc {
      font-family: 'MazzardM', sans-serif;
      font-size: 17px; font-weight: 400;
      color: rgba(255,255,255,.72);
      line-height: 1.7;
      max-width: 420px;
      flex-shrink: 0;
    }
    .stats-numbers {
      display: grid; grid-template-columns: repeat(5, 1fr);
      gap: 18px;
      border-top: none;
    }
    .stat-card {
      background: rgba(255,255,255,.04);
      border: 1px solid rgba(255,255,255,.13);
      border-radius: 4px;
      padding: 34px 18px 26px;
      display: flex; flex-direction: column; align-items: center; text-align: center;
      position: relative;
    }
    .stat-card::before {
      content: ''; position: absolute; inset: 11px;
      border: 1px solid rgba(255,255,255,.09);
      border-radius: 2px; pointer-events: none;
    }
    .stat-icon { color: var(--gold-l); margin-bottom: 20px; position: relative; z-index: 1; }
    .stat-icon svg { width: 48px; height: 48px; display: block; stroke: url(#statGold); }
    .stat-icon svg text { fill: url(#statGold); }
    .stats-numbers .stat-block {
      padding: 32px 40px;
      border-right: 1px solid rgba(255,255,255,.15);
      background: transparent;
      border-top: none;
      overflow: visible;
      opacity: 1;
      transform: none;
    }
    .stats-numbers .stat-block:first-child { padding-left: 0; }
    .stats-numbers .stat-block:last-child { padding-right: 0; }
    .stats-numbers .stat-block:last-child { border-right: none; }
    .stat-num-row {
      display: flex; align-items: baseline; justify-content: center; gap: 2px;
      margin-bottom: 10px; position: relative; z-index: 1;
    }
    .stat-val {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(30px, 2.6vw, 42px);
      font-weight: 700; color: #fff;
      line-height: 1; letter-spacing: -.01em;
    }
    .stat-unit-new {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(20px, 1.8vw, 30px); font-weight: 700;
      color: #fff;
      margin-left: 1px;
    }
    .stat-arrow {
      width: 22px; height: 22px;
      color: rgba(255,255,255,.35);
      margin-left: 8px;
      flex-shrink: 0;
      display: inline-block;
    }
    .stat-lbl-new {
      font-family: 'MazzardM', sans-serif;
      font-size: 14px; font-weight: 400;
      color: rgba(255,255,255,.78);
      line-height: 1.4;
      letter-spacing: .02em;
      position: relative; z-index: 1;
    }
    .stats-begonvil {
      position: absolute; bottom: -60px; left: -30px;
      width: 140px; height: auto;
      transform: scaleX(-1) rotate(10deg);
      opacity: .65;
      pointer-events: none;
      z-index: 2;
    }
    #stats {
      position: relative;
    }
    @media (max-width: 860px) {
      #stats { padding: 56px 24px 80px; }
      .stats-top { flex-direction: column; gap: 24px; }
      .stats-numbers { grid-template-columns: repeat(2, 1fr); }
      .stats-desc { max-width: 100%; }
    }
    @media (max-width: 540px) {
      #stats { padding: 40px 20px 70px; }
    }
    @media (max-width: 540px) {
      .stats-begonvil { width: 100px; bottom: -20px; }
    }

    /* ── Building section (replaces old intro) ── */
    .building-hero {
      position: relative;
      width: 100%;
      height: 70vh;
      min-height: 400px;
      overflow: hidden;
    }
    .building-img {
      position: absolute; left: 0; bottom: 0;
      width: 100%; height: 130%;
      object-fit: cover; object-position: center 70%;
      display: block;
    }
    .building-gradient {
      position: absolute; top: 0; left: 0; right: 0;
      height: 40%;
      background: linear-gradient(to bottom, #173C69 0%, rgba(23,60,105,0) 100%);
      pointer-events: none;
    }
    .building-cloud {
      position: absolute; top: 10%; right: -5%;
      width: clamp(200px, 28vw, 380px);
      height: auto;
      opacity: .8;
      pointer-events: none;
      animation: cloudFloat 20s ease-in-out infinite;
    }
    @keyframes cloudFloat {
      0%, 100% { transform: translateX(0); }
      50% { transform: translateX(-30px); }
    }
    .building-content {
      background: var(--cream);
      padding: 80px 64px;
      position: relative;
      overflow: hidden;
    }
    .building-text {
      max-width: 500px;
    }
    .building-title {
      font-family: 'MazzardM', sans-serif;
      font-size: clamp(24px, 2.8vw, 36px);
      font-weight: 600;
      color: var(--green);
      line-height: 1.45;
      margin-bottom: 20px;
    }
    .building-underline {
      width: 56px; height: 3px;
      background: #C07141;
    }
    .building-begonvil {
      position: absolute; top: -40px; right: -20px;
      width: clamp(140px, 18vw, 240px);
      height: auto;
      pointer-events: none;
      opacity: .85;
    }
    @media (max-width: 860px) {
      .building-hero { height: 50vh; min-height: 300px; }
      .building-content { padding: 56px 24px; }
      .building-begonvil { width: 120px; top: -20px; right: -10px; }
    }


    /* ── Talep Oluştur button ── */
    #side-trigger {
      position: fixed; right: 16px; top: 50%; transform: translateY(-50%);
      z-index: 200;
      width: 52px; min-height: 178px;
      display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
      gap: 6px;
      padding: 16px 0 22px;
      background: linear-gradient(160deg, #4fa6dd 0%, #419BD5 55%, #2f86bf 100%); border: none; border-radius: 26px;
      cursor: pointer;
      transition: transform .3s, background .25s, box-shadow .3s;
      box-shadow: 0 6px 18px rgba(23,60,105,.28);
      -webkit-tap-highlight-color: transparent;
    }
    #side-trigger:hover { transform: translateY(-50%) translateX(-3px); background: linear-gradient(160deg, #419BD5 0%, #2f86bf 55%, #2774a9 100%); box-shadow: 0 8px 22px rgba(23,60,105,.34); }
    #side-trigger.open { transform: translateY(-50%) translateX(20px); opacity: 0; pointer-events: none; }
    #side-trigger .st-icon {
      display: flex; align-items: center; justify-content: center;
      color: #fff;
    }
    #side-trigger .st-icon svg { width: 22px; height: 22px; display: block; }
    #side-trigger .st-text {
      color: #fff;
      font-family: 'Mazzard', sans-serif;
      font-weight: 600;
      font-size: 14px;
      letter-spacing: .12em;
      white-space: nowrap;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      line-height: 1;
    }
    @media (max-width: 540px) {
      #side-trigger { right: 10px; width: 42px; min-height: 0; padding: 12px 0 14px; gap: 7px; border-radius: 21px; }
      #side-trigger .st-text { font-size: 11px; letter-spacing: .08em; }
      #side-trigger .st-icon svg { width: 17px; height: 17px; }
      #side-trigger.open { transform: translateY(-50%) translateX(0); opacity: 0; pointer-events: none; }
    }

    /* ── Bolder, clearer headings + italic→bold ── */
    .intro-h, .about-h, .outdoor-h, .loc-h, .dn-title,
    .sp-header h2, .gallery-header-row .gh,
    .cta-form-head h3, .sp-modal-title, .ya-title, .hero-title { font-weight: 600; }
    .cta-l h2 { font-weight: 400; }
    .cta-l h2 em { font-style: normal; font-weight: 400; }
    .intro-h em, .about-h em, .outdoor-h em, .dn-title em,
    .sp-header h2 em, .gallery-header-row .gh em,
    .hero-title em, .sp-modal-title em { font-style: normal; font-weight: 800; }
    .hero-title strong, .intro-h strong, .about-h strong, .loc-h strong { font-weight: 800; }
    .gal-h-caption h3 { font-style: normal; font-weight: 600; }
    .m-word { font-weight: 500; }
    .m-word.bold { font-weight: 700; }
    .m-word.italic { font-style: normal; font-weight: 700; }

    /* ── Talep Oluştur panel: light (white) theme ── */
    #side-panel {
      background: #FFFFFF;
      border-top: 1px solid rgba(23,60,105,.12);
      border-left: 1px solid rgba(23,60,105,.10);
    }
    #side-panel .sp-head { border-bottom: 1px solid rgba(23,60,105,.10); }
    #side-panel .sp-head-title { color: var(--green); }
    #side-panel .sp-close { color: rgba(23,60,105,.4); border-radius: 50%; width: 32px; height: 32px; align-items: center; justify-content: center; transition: color .2s, background .2s; }
    #side-panel .sp-close:hover { color: #fff; background: var(--gold); }
    #side-panel .sp-field { border-bottom: 1px solid rgba(23,60,105,.18); }
    #side-panel .sp-field label { color: var(--green); }
    #side-panel .sp-field input,
    #side-panel .sp-field select,
    #side-panel .sp-field textarea { color: var(--green); caret-color: var(--green); }
    #side-panel .sp-field select option { background: #fff; color: var(--green); }
    #side-panel .sp-field input::placeholder,
    #side-panel .sp-field textarea::placeholder { color: rgba(23,60,105,.35); }
    #side-panel .sp-field-line { background: var(--green); }
    #side-panel .sp-field:focus-within label { color: var(--green); }
    #side-panel .sp-submit { background: linear-gradient(135deg, #F4C4B2 0%, #D18557 55%, #C07141 100%); color: #fff; }
    #side-panel .sp-submit:hover { background: linear-gradient(135deg, #F4C4B2 0%, #C07141 55%, #A85E30 100%); }
    #side-panel .sp-success { color: rgba(23,60,105,.7); }
    #side-panel .kvkk-block { background: rgba(23,60,105,.04); border: 1px solid rgba(23,60,105,.12); }
    #side-panel .kvkk-intro { color: rgba(23,60,105,.6); }
    #side-panel .kvkk-intro a { color: var(--green); }
    #side-panel .kvkk-check label { color: rgba(23,60,105,.7); }
    #side-panel .kvkk-check label a { color: var(--green); }
    #side-panel .kvkk-ch { color: rgba(23,60,105,.7); }
    #side-panel .kvkk-check input[type="checkbox"],
    #side-panel .kvkk-ch input[type="checkbox"] { accent-color: var(--green); }

    /* ── Lansman geri sayım ── */
    .lbl { display: none !important; }
    #countdown {
      position: fixed; right: 22px; bottom: 22px; z-index: 450;
      transform: scale(1.27); transform-origin: bottom right;
      background: rgba(11,21,37,.9);
      backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
      border: 1px solid rgba(209,133,87,.4);
      border-radius: 6px;
      padding: 13px 20px 14px;
      box-shadow: 0 12px 36px rgba(11,21,37,.42);
      display: flex; flex-direction: column; gap: 9px; align-items: center;
      font-family: 'MazzardM', sans-serif;
    }
    .cd-title {
      font-size: 9px; font-weight: 600; letter-spacing: .26em; text-transform: uppercase;
      background: linear-gradient(135deg,#F4C4B2,#D18557 55%,#C07141);
      -webkit-background-clip: text; background-clip: text; color: transparent;
    }
    .cd-units { display: flex; align-items: flex-start; gap: 9px; }
    .cd-unit { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 34px; }
    .cd-num {
      font-size: 28px; font-weight: 600; line-height: 1;
      background: linear-gradient(150deg,#F4C4B2 0%,#F0C3AA 28%,#D18557 62%,#C07141 100%);
      -webkit-background-clip: text; background-clip: text; color: transparent;
      font-variant-numeric: tabular-nums;
    }
    .cd-lbl {
      font-size: 8px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase;
      color: rgba(245,243,240,.5);
    }
    .cd-sep {
      font-size: 22px; font-weight: 300; line-height: 1; margin-top: 2px;
      color: rgba(209,133,87,.55);
    }
    @media (max-width: 600px) {
      #countdown { right: 12px; bottom: 12px; padding: 10px 14px 11px; gap: 7px; transform: scale(1); }
      .cd-num { font-size: 22px; }
      .cd-unit { min-width: 28px; gap: 3px; }
      .cd-sep { font-size: 18px; }
    }

    /* KVKK Modal */
    .kvkk-modal {
      position: fixed; inset: 0; z-index: 9999;
      display: flex; align-items: center; justify-content: center;
      padding: 24px;
      opacity: 0; visibility: hidden; pointer-events: none;
      transition: opacity .35s ease, visibility .35s ease;
    }
    .kvkk-modal.open { opacity: 1; visibility: visible; pointer-events: auto; }
    .kvkk-modal-overlay {
      position: absolute; inset: 0;
      background: rgba(23,60,105,.55); backdrop-filter: blur(4px);
    }
    .kvkk-modal-box {
      position: relative; z-index: 1;
      width: 100%; max-width: 640px; max-height: 84vh;
      background: #fff; border-radius: 4px;
      box-shadow: 0 30px 80px rgba(23,60,105,.32);
      padding: 48px 52px 44px;
      overflow-y: auto;
      transform: translateY(20px) scale(.98);
      transition: transform .35s cubic-bezier(.16,1,.3,1);
    }
    .kvkk-modal.open .kvkk-modal-box { transform: translateY(0) scale(1); }
    .kvkk-modal-close {
      position: absolute; top: 18px; right: 18px;
      width: 38px; height: 38px; border: none; cursor: pointer;
      background: var(--cream); border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      color: var(--green); transition: background .25s, color .25s;
    }
    .kvkk-modal-close:hover { background: var(--gold); color: #fff; }
    .kvkk-modal-close svg { width: 18px; height: 18px; }
    .kvkk-modal-title {
      font-family: 'MazzardM', sans-serif;
      font-size: 26px; font-weight: 700; color: var(--green);
      letter-spacing: -.01em; line-height: 1.2;
      margin: 0 40px 24px 0; padding-bottom: 18px;
      border-bottom: 1px solid var(--cream2);
    }
    .kvkk-modal-body h4 {
      font-family: 'MazzardM', sans-serif;
      font-size: 15px; font-weight: 700; color: var(--green);
      margin: 22px 0 8px; letter-spacing: .005em;
    }
    .kvkk-modal-body h4:first-child { margin-top: 0; }
    .kvkk-modal-body p {
      font-size: 14px; line-height: 1.75; color: var(--stone);
      margin: 0;
    }
    .kvkk-modal-body ul {
      margin: 8px 0 0; padding-left: 18px;
    }
    .kvkk-modal-body ul li {
      font-size: 14px; line-height: 1.75; color: var(--stone);
      margin-bottom: 4px;
    }
    body.modal-open { overflow: hidden; }
    @media (max-width: 600px) {
      .kvkk-modal-box { padding: 40px 24px 32px; max-height: 88vh; }
      .kvkk-modal-title { font-size: 22px; margin-right: 36px; }
    }
