:root{
  --blue:#075a98;
  --blue-2:#0d6db6;
  --blue-3:#9edff1;
  --ink:#0c2337;
  --ink-2:#162b3c;
  --paper:#f8fbfd;
  --white:#ffffff;
  --line:rgba(10,54,87,.15);
  --shadow:0 24px 60px rgba(5,53,90,.14);
  --radius:28px;
  --serif:"Playfair Display", Georgia, serif;
  --display:"Cormorant Garamond", Georgia, serif;
  --sans:"DM Sans", Arial, sans-serif;
  --ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box}
html{scroll-behavior:auto;background:var(--paper)}
body{margin:0;color:var(--ink);font-family:var(--sans);background:var(--paper);overflow-x:hidden}
body.is-locked{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit}
button{color:inherit}
img{display:block;max-width:100%}
::selection{background:var(--blue);color:#fff}
.container{width:min(1240px,calc(100% - 56px));margin-inline:auto}
.container-wide{width:min(1520px,calc(100% - 32px));margin-inline:auto}
.section-pad{padding:120px 0}
.section-pad-sm{padding:76px 0}
.section-tag{display:inline-flex;align-items:center;gap:10px;margin-bottom:18px;text-transform:uppercase;letter-spacing:.16em;font-size:12px;font-weight:700;color:var(--blue)}
.section-tag:before{content:"";width:34px;height:1px;background:currentColor}
.section-tag.light{color:#dff5ff}
.section-title{margin:0;font-family:var(--serif);font-size:clamp(42px,5.2vw,78px);line-height:1.02;letter-spacing:-.035em;font-weight:600}
.section-title.light{color:#fff}
/* =========================
   BUTTON SYSTEM
========================= */

.btn {
  position: relative;
  isolation: isolate;
  overflow: hidden;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 11px;

  min-height: 48px;
  padding: 0 20px;

  border: 1px solid transparent;
  border-radius: 999px;

  font: inherit;
  font-weight: 700;

  cursor: pointer;

  transition:
    color .35s ease,
    border-color .35s ease,
    background .35s ease,
    transform .35s ease;
}


/* button text and icons always above hover layer */

.btn span,
.btn i {
  position: relative;
  z-index: 2;
}


/* animated hover fill */

.btn::after {
  content: "";

  position: absolute;
  inset: 0;

  z-index: 1;

  transform: translateY(105%);

  transition:
    transform .45s var(--ease);
}


.btn:hover::after {
  transform: translateY(0);
}


/* =========================
   PRIMARY BUTTON
========================= */

.btn-primary {
  background: var(--blue);
  color: #fff;

  border-color: var(--blue);
}

.btn-primary::after {
  background: #064777;
}

.btn-primary:hover {
  color: #fff;
  border-color: #064777;
}


/* =========================
   LIGHT BUTTON
========================= */

.btn-light {
  background: #fff;
  color: var(--blue);

  border-color: #fff;
}

.btn-light::after {
  background: var(--blue);
}

.btn-light:hover {
  color: #fff;
}


/* =========================
   OUTLINE BUTTON
========================= */

.btn-outline {
  background: transparent;
  color: var(--blue);

  border-color: rgba(7, 90, 152, .35);
}

.btn-outline::after {
  background: var(--blue);
}

.btn-outline:hover {
  color: #fff;
  border-color: var(--blue);
}


/* =========================
   GHOST BUTTON
========================= */

.btn-ghost {
  background: rgba(255, 255, 255, .10);
  color: #fff;

  border-color: rgba(255, 255, 255, .30);

  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.btn-ghost::after {
  background: #fff;
}

.btn-ghost:hover {
  color: var(--blue);
}
.btn-glass{color:#fff;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.35);backdrop-filter:blur(16px)}
.btn-glass:after{background:#fff}.btn-glass:hover{color:var(--blue)}
.btn-xl{min-height:58px;padding-inline:28px;font-size:15px}
.text-link{display:inline-flex;align-items:center;gap:10px;border:0;background:transparent;padding:0;color:var(--blue);font-weight:800;cursor:pointer}
.text-link i{transition:transform .3s var(--ease)}.text-link:hover i{transform:translateX(5px)}

/* Loader / cursor */
.page-loader{position:fixed;inset:0;z-index:9999;background:var(--ink-2);display:grid;place-items:center;color:#fff}
.loader-mark{display:grid;justify-items:center;gap:2px;text-align:center;letter-spacing:.12em;position:relative}.loader-mark strong{font-family:var(--serif);font-size:38px;letter-spacing:.05em}.loader-mark small{font-size:11px;letter-spacing:.36em;margin-left:.36em}
.loader-ring{position:absolute;width:128px;height:128px;border:1px solid rgba(255,255,255,.25);border-top-color:#fff;border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%)}
.loader-line{position:absolute;bottom:0;left:0;width:100%;height:3px;background:rgba(255,255,255,.08)}.loader-line span{display:block;width:0;height:100%;background:var(--blue-3)}
.scroll-progress{position:fixed;z-index:2500;top:0;left:0;width:100%;height:3px;pointer-events:none}.scroll-progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--blue-3),#fff,var(--blue))}
.cursor-dot,.cursor-ring{position:fixed;z-index:9990;pointer-events:none;border-radius:50%;left:0;top:0;opacity:0}.cursor-dot{width:7px;height:7px;background:#fff;mix-blend-mode:difference}.cursor-ring{width:36px;height:36px;border:1px solid rgba(255,255,255,.8);mix-blend-mode:difference}
.cursor-ring.is-hover{width:58px;height:58px;background:rgba(255,255,255,.15)}

/* Header */
.site-header{position:fixed;top:0;left:0;width:100%;z-index:2000;padding:16px 0;transition:padding .35s var(--ease),background .35s var(--ease),box-shadow .35s var(--ease)}
.site-header.scrolled{padding:8px 0;background:rgba(5,57,96,.86);box-shadow:0 12px 40px rgba(0,0,0,.14);backdrop-filter:blur(18px)}
.nav-shell{width:min(1440px,calc(100% - 40px));margin:auto;display:flex;align-items:center;gap:32px;color:#fff}
.brand{display:flex;align-items:center;gap:12px;flex:0 0 auto}.brand-orbit{width:46px;height:46px;border:1px solid rgba(255,255,255,.65);border-radius:50%;display:grid;place-items:center;font-size:19px}.brand-copy{display:flex;flex-direction:column}.brand-copy b{font-family:var(--display);font-size:25px;line-height:.9}.brand-copy small{font-size:9px;text-transform:uppercase;letter-spacing:.14em;margin-top:4px;opacity:.78}
.desktop-nav{margin-left:auto;display:flex;align-items:center;gap:30px}.desktop-nav a{position:relative;font-size:13px;text-transform:uppercase;letter-spacing:.07em;font-weight:700}.desktop-nav a:after{content:"";position:absolute;height:1px;width:100%;left:0;bottom:-7px;background:#fff;transform:scaleX(0);transform-origin:right;transition:transform .35s var(--ease)}.desktop-nav a:hover:after{transform:scaleX(1);transform-origin:left}
.nav-actions{display:flex;align-items:center;gap:10px}.address-chip{display:flex;align-items:center;gap:8px;font-size:12px;opacity:.88;padding:10px}.menu-toggle{display:none;width:46px;height:46px;border:1px solid rgba(255,255,255,.3);border-radius:50%;background:transparent;position:relative;cursor:pointer}.menu-toggle span{position:absolute;left:12px;width:20px;height:1px;background:#fff;transition:.3s}.menu-toggle span:first-child{top:18px}.menu-toggle span:last-child{top:26px}.menu-toggle.active span:first-child{transform:translateY(4px) rotate(45deg)}.menu-toggle.active span:last-child{transform:translateY(-4px) rotate(-45deg)}
.mobile-menu{position:fixed;z-index:1900;inset:0;background:rgba(6,54,91,.97);display:grid;place-items:center;opacity:0;visibility:hidden}.mobile-menu-inner{display:grid;gap:20px;text-align:center}.mobile-menu a{color:#fff;font-family:var(--serif);font-size:clamp(30px,8vw,54px)}

/* Hero */
.hero{min-height:100svh;position:relative;display:flex;align-items:flex-end;overflow:hidden;background:var(--ink)}
.hero-media,.hero-media>*{position:absolute;inset:0}.hero-image{width:100%;height:100%;object-fit:cover;object-position:center 55%;transform:scale(1.08)}
.hero-gradient{background:linear-gradient(90deg,rgba(3,31,53,.9) 0%,rgba(3,31,53,.63) 42%,rgba(3,31,53,.23) 68%,rgba(3,31,53,.46) 100%),linear-gradient(0deg,rgba(3,31,53,.68),transparent 45%)}
.hero-blueprint{opacity:.18;background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(90deg,#000,transparent 72%)}
.hero-content{position:relative;z-index:4;color:#fff;padding-top:190px;padding-bottom:92px}
.hero-badge{display:inline-flex;align-items:center;gap:10px;padding:9px 13px;border:1px solid rgba(255,255,255,.3);border-radius:999px;font-size:11px;letter-spacing:.15em;text-transform:uppercase;background:rgba(255,255,255,.08);backdrop-filter:blur(12px)}.hero-badge span{width:7px;height:7px;background:#aeefff;border-radius:50%;box-shadow:0 0 0 6px rgba(174,239,255,.12)}
.hero-title{font-family:var(--serif);font-size:clamp(78px,12vw,184px);line-height:.72;letter-spacing:-.065em;margin:42px 0 26px;max-width:980px}.hero-title span{display:block}.hero-title span:last-child{padding-left:.28em;font-style:italic;font-weight:600;color:#dff7ff}
.hero-kicker{font-family:var(--display);font-size:clamp(28px,3vw,45px);margin:0 0 15px;color:#e8f8ff}.hero-copy{max-width:630px;font-size:16px;line-height:1.8;color:rgba(255,255,255,.82);margin:0 0 28px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.hero-meta{display:flex;gap:1px;margin-top:48px;width:max-content;border:1px solid rgba(255,255,255,.18);border-radius:18px;overflow:hidden;backdrop-filter:blur(12px)}.hero-meta div{padding:13px 22px;background:rgba(255,255,255,.08);display:grid;gap:2px}.hero-meta strong{font-size:11px;letter-spacing:.13em;text-transform:uppercase}.hero-meta span{font-size:12px;opacity:.72}
.hero-floating-card{position:absolute;z-index:5;right:6vw;bottom:11vh;width:290px;padding:28px;border-radius:24px;color:#fff;background:rgba(4,56,94,.75);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(18px);box-shadow:var(--shadow)}.hero-floating-card .eyebrow{font-size:10px;letter-spacing:.17em;opacity:.7}.hero-floating-card b{display:block;font-family:var(--serif);font-size:28px;line-height:1.16;margin:10px 0 18px}.mini-wave{height:12px;background:radial-gradient(16px 9px at 50% -2px,transparent 12px,#9edff1 13px 14px,transparent 15px) 0 0/32px 12px repeat-x;opacity:.75}
.scroll-cue{position:absolute;z-index:6;right:36px;bottom:28px;color:#fff;display:flex;align-items:center;gap:12px;font-size:10px;letter-spacing:.18em;text-transform:uppercase;writing-mode:vertical-rl}.scroll-cue i{animation:bounce 1.6s infinite}@keyframes bounce{50%{transform:translateY(6px)}}

/* Promo */
.promo-strip{background:#fff}.promo-frame{position:relative;border-radius:28px;overflow:hidden;box-shadow:0 30px 80px rgba(13,68,102,.13);border:1px solid rgba(13,68,102,.08)}.promo-frame img{width:100%;aspect-ratio:2.66/1;object-fit:cover;object-position:center top}.promo-frame:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.45);pointer-events:none}.promo-glass{position:absolute;left:28px;right:28px;bottom:24px;padding:15px 18px;border-radius:16px;background:rgba(255,255,255,.86);backdrop-filter:blur(18px);display:flex;align-items:center;justify-content:space-between;gap:20px;box-shadow:0 8px 30px rgba(0,0,0,.08);font-weight:700}

/* About */
.about{background:linear-gradient(180deg,#f8fbfd,#fff)}.about-grid{display:grid;grid-template-columns:.8fr 1.35fr;align-items:stretch;gap:24px}.panel-blue{background:var(--blue);color:#fff;border-radius:var(--radius);padding:56px;box-shadow:var(--shadow);position:relative;overflow:hidden}.panel-blue:before{content:"";position:absolute;width:270px;height:270px;border:1px solid rgba(255,255,255,.13);border-radius:50%;right:-110px;top:-90px;box-shadow:0 0 0 45px rgba(255,255,255,.03),0 0 0 90px rgba(255,255,255,.02)}.panel-blue .section-title{font-size:clamp(43px,4vw,63px)}.panel-blue p{font-size:15px;line-height:1.9;color:rgba(255,255,255,.82);position:relative}.about-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:35px}.about-stats div{padding:16px 12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.13);border-radius:14px;display:grid;gap:4px}.about-stats strong{font-family:var(--serif);font-size:19px}.about-stats span{font-size:10px;opacity:.72;text-transform:uppercase;letter-spacing:.09em}
.about-image-wrap{position:relative;border-radius:var(--radius);overflow:hidden;min-height:690px;box-shadow:var(--shadow);transform-style:preserve-3d}.about-image-wrap img{width:100%;height:100%;object-fit:cover}.about-image-wrap:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(3,40,67,.42),transparent 38%)}.image-label{position:absolute;z-index:2;left:24px;bottom:24px;right:24px;display:flex;align-items:center;justify-content:space-between;padding:17px 20px;color:#fff;border:1px solid rgba(255,255,255,.32);background:rgba(3,52,87,.35);backdrop-filter:blur(14px);border-radius:16px;font-weight:700}

/* Why */
.why{background:#fff;overflow:hidden}.why-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:76px;align-items:center}.why-copy .section-title{font-size:clamp(42px,4.4vw,67px);max-width:780px}.why-list{margin-top:50px;border-top:1px solid var(--line)}.why-item{display:grid;grid-template-columns:70px 1fr;gap:20px;padding:22px 0;border-bottom:1px solid var(--line);align-items:start}.why-item>span{font-family:var(--display);font-size:18px;color:var(--blue);font-weight:700}.why-item p{margin:0;font-size:15px;line-height:1.75;color:#405567}.why-visual{position:relative;min-height:590px;display:grid;place-items:center}.why-visual img{position:relative;z-index:2;width:min(560px,100%);mix-blend-mode:multiply}.sun-disc{position:absolute;width:430px;height:430px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#effbff,#bceeff);box-shadow:0 0 0 32px #f4fbfd,0 0 0 64px #f8fcfd}.floating-note{position:absolute;z-index:3;right:-10px;bottom:32px;padding:16px 18px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);display:grid}.floating-note b{font-family:var(--serif);font-size:18px}.floating-note span{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:#6a7985}

/* Features */
.features{background:#eef7fb;overflow:hidden}.features-head{display:flex;align-items:end;justify-content:space-between;gap:45px;margin-bottom:55px}.features-head>div{max-width:850px}.features-head>p{max-width:340px;line-height:1.75;color:#627687}.feature-viewport{overflow:hidden}.feature-track{display:flex;gap:28px;padding:0 max(28px,calc((100vw - 1240px)/2));width:max-content}.feature-card{width:min(460px,78vw);background:#fff;border:1px solid rgba(10,82,128,.11);border-radius:30px;overflow:hidden;box-shadow:0 20px 55px rgba(12,69,107,.1);transform-style:preserve-3d}.feature-image{position:relative;aspect-ratio:1.15/1;overflow:hidden}.feature-image img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}.feature-card:hover .feature-image img{transform:scale(1.07)}.feature-index{position:absolute;right:18px;top:18px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.9);font-family:var(--display);font-weight:800;color:var(--blue);box-shadow:0 8px 30px rgba(0,0,0,.1)}.feature-body{padding:30px}.feature-icon{width:48px;height:48px;border-radius:14px;background:#e9f6fc;color:var(--blue);display:grid;place-items:center;font-size:18px}.feature-body h3{font-family:var(--serif);font-size:31px;margin:18px 0 10px}.feature-body p{color:#637687;line-height:1.75;margin:0 0 22px;font-size:14px}

/* Layout */
.layout-plan{background:#fff}.layout-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;align-items:center}.layout-copy p{font-size:15px;line-height:1.8;color:#637687}.layout-actions{display:flex;gap:10px;margin-top:28px;flex-wrap:wrap}.layout-image{position:relative;border:1px solid var(--line);background:#fff;padding:16px;border-radius:28px;box-shadow:var(--shadow);cursor:zoom-in;overflow:hidden}.layout-image img{width:100%;border-radius:16px;transition:transform .6s var(--ease)}.layout-image:hover img{transform:scale(1.025)}.zoom-chip{position:absolute;right:28px;bottom:28px;padding:12px 15px;border-radius:999px;background:rgba(5,51,84,.82);backdrop-filter:blur(14px);color:#fff;font-size:12px;font-weight:700}

/* Highlights */
.highlights{position:relative;background:var(--blue);color:#fff;padding-top:150px}.wave-top{position:absolute;top:-1px;left:0;width:100%;height:62px;background:#fff;clip-path:polygon(0 0,100% 0,100% 20%,96% 54%,92% 24%,87% 61%,82% 22%,77% 56%,71% 18%,65% 55%,59% 23%,53% 64%,47% 20%,41% 55%,35% 22%,29% 62%,23% 18%,17% 55%,11% 22%,5% 61%,0 26%)}.highlights-head{max-width:900px;margin-bottom:65px}.highlight-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.18);border-left:1px solid rgba(255,255,255,.18)}.highlight-item{min-height:230px;padding:38px;border-right:1px solid rgba(255,255,255,.18);border-bottom:1px solid rgba(255,255,255,.18);position:relative;overflow:hidden;transition:background .4s var(--ease),color .4s var(--ease)}.highlight-item:before{content:"";position:absolute;inset:0;background:#fff;transform:translateY(102%);transition:transform .45s var(--ease)}.highlight-item:hover:before{transform:translateY(0)}.highlight-item>*{position:relative;z-index:1}.highlight-item i{font-size:38px;color:#d8f6ff;transition:color .4s}.highlight-item h3{font-family:var(--serif);font-size:25px;font-weight:600;max-width:300px;line-height:1.18;margin:50px 0 0}.highlight-item span{position:absolute;right:24px;top:22px;font-family:var(--display);font-size:14px;opacity:.45}.highlight-item:hover{color:var(--blue)}.highlight-item:hover i{color:var(--blue)}

/* Map */
.map-section{background:#f7fbfd}.map-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:34px;align-items:stretch}.map-card{position:relative;border-radius:30px;overflow:hidden;background:#1e6477;min-height:650px;box-shadow:var(--shadow);transform-style:preserve-3d}.location-panel{background:#fff;border-radius:30px;padding:50px;border:1px solid var(--line);box-shadow:0 20px 60px rgba(10,72,109,.08)}.location-panel .section-title{font-size:clamp(42px,4vw,62px)}.location-list{margin:34px 0;border-top:1px solid var(--line)}.location-list div{display:flex;justify-content:space-between;gap:16px;padding:17px 0;border-bottom:1px solid var(--line)}.location-list span{color:#5c7282}.location-list strong{color:var(--blue)}

/* Tour */
.tour{background:#fff}.tour-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:55px;align-items:center} .tour-poster {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 28px;
  background: #071c2f;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.18);
}

.project-video {
  width: 100%;
  height: 100%;
  min-height: 480px;
  display: block;
  object-fit: cover;
  border-radius: inherit;
}

.tour-label {
  position: absolute;
  left: 24px;
  bottom: 24px;
  padding: 10px 18px;
  border-radius: 999px;

  background: rgba(255, 255, 255, 0.9);
  color: #07558f;

  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;

  pointer-events: none;
}
@media (max-width: 768px) {
  .project-video {
    min-height: 280px;
  }
}

/* FAQ */
.faq{background:#eef7fb}.faq-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:80px}.faq-intro{position:sticky;top:130px;align-self:start}.faq-intro p{line-height:1.8;color:#5e7282;margin-bottom:28px}.accordion{border-top:1px solid rgba(8,74,116,.18)}.faq-item{border-bottom:1px solid rgba(8,74,116,.18)}.faq-item>button{width:100%;border:0;background:transparent;padding:24px 0;display:flex;align-items:center;justify-content:space-between;text-align:left;cursor:pointer;font-family:var(--serif);font-size:23px}.faq-item>button i{font-size:14px;transition:transform .35s}.faq-item.is-open>button i{transform:rotate(45deg)}.faq-answer{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s var(--ease)}.faq-answer>p{overflow:hidden;margin:0;color:#617585;line-height:1.8}.faq-item.is-open .faq-answer{grid-template-rows:1fr}.faq-item.is-open .faq-answer>p{padding-bottom:24px}

/* CTA */
.cta-banner{min-height:620px;position:relative;display:flex;align-items:center;overflow:hidden}.cta-banner>img,.cta-overlay{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.cta-overlay{background:linear-gradient(90deg,rgba(5,44,72,.91),rgba(5,44,72,.62) 55%,rgba(5,44,72,.22))}.cta-content{position:relative;z-index:2}.cta-content .section-title{max-width:950px}.cta-actions{display:flex;gap:12px;margin-top:32px;flex-wrap:wrap}

/* Contact */
.contact{background:var(--ink-2);color:#fff}.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;align-items:start}.contact-info p{max-width:620px;color:rgba(255,255,255,.67);line-height:1.8}.footer-brand{width:210px;margin-bottom:35px}.footer-brand img{width:100%;border-radius:16px}.contact-points{display:grid;gap:10px;margin-top:38px}.contact-points a{display:flex;align-items:center;gap:16px;padding:15px 0;border-bottom:1px solid rgba(255,255,255,.12)}.contact-points i{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.18);color:#9ce9ff}.contact-points span{display:grid;font-weight:700}.contact-points small{font-size:9px;text-transform:uppercase;letter-spacing:.13em;color:rgba(255,255,255,.45);margin-bottom:3px}
.lead-form{background:#fff;color:var(--ink);border-radius:28px;padding:42px;box-shadow:0 25px 80px rgba(0,0,0,.16)}.form-head{display:grid;gap:5px;margin-bottom:25px}.form-head>span{font-family:var(--serif);font-size:38px}.form-head small{color:#6a7d8b}.field{position:relative;margin-top:20px}.field label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.09em;font-weight:800;color:#506575;margin-bottom:8px}.field input,.field textarea{width:100%;border:0;border-bottom:1px solid #bed0db;outline:0;background:transparent;padding:10px 0;font-size:15px;color:var(--ink);resize:vertical}.field-line{position:absolute;height:2px;background:var(--blue);left:0;right:0;bottom:18px;transform:scaleX(0);transform-origin:left;transition:.35s var(--ease)}.field:focus-within .field-line{transform:scaleX(1)}.field .error{display:block;min-height:18px;font-size:11px;color:#cc3b3b;margin-top:4px}.lead-form .submit-btn{margin-top:14px;min-width:150px}.form-status{margin:12px 0 0;font-size:12px;min-height:18px}.hp-field{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}
.site-footer{background:#fff;color:var(--ink);padding:22px 0;border-top:1px solid var(--line)}.footer-row{display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:12px}.footer-row a{color:var(--blue);font-weight:800}

/* Floating quick actions */
.floating-actions{position:fixed;z-index:1500;right:20px;bottom:22px;display:grid;gap:8px}.floating-actions a{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--blue);box-shadow:0 14px 35px rgba(0,0,0,.17);font-size:19px;transition:.3s}.floating-actions a:first-child{background:#1fa855;color:#fff}.floating-actions a:hover{transform:translateY(-4px) scale(1.04)}

/* Modals */
.modal,.video-modal,.lightbox{position:fixed;inset:0;z-index:5000;display:grid;place-items:center;padding:26px;opacity:0;visibility:hidden}.modal-backdrop{position:absolute;inset:0;background:rgba(2,25,42,.74);backdrop-filter:blur(12px)}.modal-panel{position:relative;width:min(980px,100%);max-height:min(880px,calc(100svh - 40px));overflow:auto;background:#fff;border-radius:30px;display:grid;grid-template-columns:.85fr 1.15fr;box-shadow:0 40px 110px rgba(0,0,0,.3)}.modal-copy{background:var(--blue);color:#fff;padding:52px}.modal-copy h2{font-family:var(--serif);font-size:50px;line-height:1.02;margin:15px 0}.modal-copy p{line-height:1.8;color:rgba(255,255,255,.76)}.modal-copy ul{list-style:none;padding:0;margin:32px 0 0;display:grid;gap:13px}.modal-copy li{display:flex;gap:10px;align-items:center;font-size:13px}.modal-copy i{color:#aeeeff}.modal-panel .lead-form{box-shadow:none;border-radius:0;padding:50px}.modal-close{position:absolute;z-index:4;right:18px;top:18px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(13,73,112,.12);background:#fff;color:var(--ink);cursor:pointer}.video-panel{position:relative;z-index:2;width:min(1100px,100%);aspect-ratio:16/9;background:#000;border-radius:26px;overflow:hidden;box-shadow:0 40px 120px rgba(0,0,0,.42)}.video-panel iframe{width:100%;height:100%;border:0}.video-panel .modal-close{background:rgba(255,255,255,.92)}
.lightbox img{position:relative;z-index:2;max-width:min(1200px,94vw);max-height:86vh;border-radius:18px;box-shadow:0 35px 110px rgba(0,0,0,.4)}.lightbox .modal-close{z-index:4;position:fixed;right:28px;top:28px}
.toast{position:fixed;z-index:6000;left:50%;bottom:28px;transform:translate(-50%,24px);display:flex;align-items:center;gap:10px;padding:13px 17px;background:#fff;color:var(--ink);border-radius:999px;box-shadow:0 20px 60px rgba(0,0,0,.18);opacity:0;visibility:hidden;font-size:13px;font-weight:700}.toast i{color:#1aa35c}

/* Initial reveal helpers */
.reveal-up,.reveal-left,.reveal-right,.reveal-scale{will-change:transform,opacity}

@media (max-width:1180px){
  .desktop-nav{gap:18px}.address-chip{display:none}.hero-floating-card{display:none}
  .about-grid{grid-template-columns:1fr 1.3fr}.panel-blue{padding:40px}.about-image-wrap{min-height:620px}
  .why-grid{gap:40px}.map-grid{grid-template-columns:1fr}.map-card{min-height:540px}.location-panel{padding:40px}
  .contact-grid{gap:45px}.faq-grid{gap:50px}
}
@media (max-width:920px){
  .section-pad{padding:90px 0}.section-pad-sm{padding:60px 0}.container{width:min(100% - 34px,1240px)}
  .desktop-nav,.nav-actions .btn{display:none}.nav-actions{margin-left:auto}.menu-toggle{display:block}
  .hero-content{padding-top:150px;padding-bottom:78px}.hero-title{font-size:clamp(72px,18vw,135px)}.hero-copy{max-width:560px}.hero-meta{max-width:100%;width:100%}.hero-meta div{flex:1;padding:12px}
  .about-grid,.why-grid,.layout-grid,.tour-grid,.faq-grid,.contact-grid{grid-template-columns:1fr}.about-image-wrap{min-height:540px}.about-card{order:2}.why-visual{min-height:470px;order:-1}.sun-disc{width:340px;height:340px}.features-head{display:block}.features-head>p{margin-top:20px}.feature-track{overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:15px}.feature-card{scroll-snap-align:start}
  .highlight-grid{grid-template-columns:repeat(2,1fr)}.faq-intro{position:static}.contact-info{padding-right:0}.modal-panel{grid-template-columns:1fr;max-width:620px}.modal-copy{padding:38px}.modal-copy h2{font-size:40px}.modal-panel .lead-form{padding:38px}
  .promo-glass{position:static;border-radius:0}.promo-frame img{aspect-ratio:2.2/1}
}
@media (max-width:640px){
  .container,.nav-shell{width:calc(100% - 28px)}.section-pad{padding:72px 0}.section-pad-sm{padding:48px 0}.site-header{padding-top:10px}.brand-copy b{font-size:21px}.brand-orbit{width:40px;height:40px}
  .hero{min-height:850px}.hero-image{object-position:53% center}.hero-content{padding-bottom:58px}.hero-title{font-size:clamp(67px,22vw,106px);margin-top:32px}.hero-title span:last-child{padding-left:.12em}.hero-kicker{font-size:28px}.hero-copy{font-size:14px;line-height:1.7}.hero-actions{display:grid;grid-template-columns:1fr}.hero-actions .btn{width:100%}.hero-meta{display:grid;grid-template-columns:1fr 1fr}.hero-meta div:last-child{grid-column:span 2}.scroll-cue{display:none}
  .promo-strip{padding-top:30px}.promo-frame{border-radius:18px}.promo-frame img{aspect-ratio:1.65/1}.promo-glass{padding:12px;font-size:12px}.promo-glass>span{display:none}
  .panel-blue{padding:30px;border-radius:22px}.panel-blue .section-title{font-size:42px}.about-image-wrap{min-height:400px;border-radius:22px}.about-stats{grid-template-columns:1fr}.image-label{left:14px;right:14px;bottom:14px}
  .why-grid{gap:25px}.why-copy .section-title{font-size:43px}.why-item{grid-template-columns:48px 1fr}.why-visual{min-height:380px}.sun-disc{width:270px;height:270px}.floating-note{right:0;bottom:0}
  .features-head{margin-bottom:35px}.feature-track{padding-left:16px;padding-right:16px;gap:16px}.feature-card{width:84vw;border-radius:22px}.feature-body{padding:24px}
  .layout-grid{gap:30px}.highlight-grid{grid-template-columns:1fr}.highlight-item{min-height:185px;padding:28px}.highlight-item h3{margin-top:35px}.map-card{min-height:auto}.map-card img{height:auto}.location-panel{padding:28px}.tour-grid{gap:30px}.play-button{width:68px;height:68px}.faq-item>button{font-size:20px;gap:20px}.cta-banner{min-height:600px}.cta-actions{display:grid}.cta-actions .btn{width:100%}
  .contact-grid{gap:38px}.lead-form{padding:28px;border-radius:22px}.footer-row{display:grid;text-align:center;justify-content:center}.floating-actions{right:12px;bottom:12px}.floating-actions a{width:45px;height:45px}
  .modal,.video-modal,.lightbox{padding:12px}.modal-panel{border-radius:22px}.modal-copy{padding:30px}.modal-copy h2{font-size:36px}.modal-panel .lead-form{padding:28px}.modal-close{right:12px;top:12px}.video-panel{border-radius:18px}
  .cursor-dot,.cursor-ring{display:none}
}
@media (hover:none){.cursor-dot,.cursor-ring{display:none}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.page-loader{display:none}.hero-image{transform:none!important}}

/* ==================================================
   MAP SECTION - FINAL FIX
================================================== */

#map {
  width: 100%;
  padding: 100px 0;
  background: #f5fafc;
  overflow: hidden;
}

#map .map-grid {
  width: min(1280px, calc(100% - 48px));
  margin: 0 auto;

  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  align-items: center;
  gap: 70px;
}


/* ===============================
   KEY PLAN CARD
================================ */

#map .keyplan-card {
  position: relative;

  width: 100%;
  min-width: 0;

  padding: 12px;

  border-radius: 28px;
  overflow: hidden;

  background: #1f6275;

  box-shadow:
    0 30px 70px rgba(8, 48, 70, 0.15);
}


#map .keyplan-image-box {
  position: relative;

  width: 100%;
  aspect-ratio: 720 / 373;

  overflow: hidden;

  border-radius: 20px;

  background: #1f6275;
}


#map .keyplan-image {
  width: 100% !important;
  height: 100% !important;

  display: block !important;

  object-fit: contain !important;
  object-position: center !important;

  border-radius: 20px;
}


/* KEY PLAN PILL */

#map .keyplan-overlay {
  position: absolute !important;

  left: 28px !important;
  bottom: 26px !important;

  z-index: 10;

  display: flex !important;
  align-items: center;
  gap: 8px;

  width: auto !important;

  padding: 10px 16px;

  border-radius: 100px;

  color: #fff !important;
  background: rgba(2, 49, 78, 0.88);

  border: 1px solid rgba(255,255,255,.2);

  backdrop-filter: blur(10px);

  font-size: 12px;
  font-weight: 700;

  letter-spacing: 1px;
  text-transform: uppercase;

  pointer-events: none;
}


/* ===============================
   LOCATION RIGHT SIDE
================================ */

#map .map-copy {
  width: 100%;
  min-width: 0;
}


#map .map-copy .section-tag {
  display: flex;
  align-items: center;
  gap: 12px;

  margin-bottom: 25px;

  color: #0066a6;

  font-size: 12px;
  font-weight: 700;

  letter-spacing: 2px;
  text-transform: uppercase;
}


#map .map-copy .section-tag::before {
  content: "";

  width: 34px;
  height: 1px;

  background: #0066a6;
}


#map .map-copy .section-title {
  margin: 0 0 42px !important;

  max-width: 600px;

  color: #09283d;

  font-size: clamp(48px, 4.6vw, 76px);
  line-height: 0.96;

  letter-spacing: -2px;
}


/* ===============================
   DISTANCE LIST
================================ */

#map .distance-list {
  width: 100%;

  border-top: 1px solid rgba(8, 52, 78, 0.13);
}


#map .distance-item {
  display: flex !important;

  align-items: center;
  justify-content: space-between;

  width: 100%;

  gap: 20px;

  padding: 18px 2px;

  border-bottom:
    1px solid rgba(8, 52, 78, 0.13);
}


#map .distance-item span {
  color: #647b89;

  font-size: 16px;
  font-weight: 400;
}


#map .distance-item strong {
  color: #006cab;

  font-size: 17px;
  font-weight: 700;

  white-space: nowrap;
}


/* ===============================
   TABLET
================================ */

@media (max-width: 1050px) {

  #map .map-grid {
    grid-template-columns: 1fr;
    gap: 55px;
  }

  #map .keyplan-card,
  #map .map-copy {
    max-width: 900px;
    margin: 0 auto;
  }
}


/* ===============================
   MOBILE
================================ */

@media (max-width: 768px) {

  #map {
    padding: 65px 0;
  }

  #map .map-grid {
    width: calc(100% - 28px);
    gap: 40px;
  }

  #map .keyplan-card {
    padding: 7px;
    border-radius: 18px;
  }

  #map .keyplan-image-box,
  #map .keyplan-image {
    border-radius: 13px;
  }

  #map .keyplan-overlay {
    left: 18px !important;
    bottom: 18px !important;

    padding: 8px 13px;

    font-size: 10px;
  }

  #map .map-copy .section-title {
    font-size: clamp(40px, 11vw, 56px);
    line-height: 1;

    margin-bottom: 30px !important;
  }

  #map .distance-item {
    padding: 16px 2px;
  }
}

/* =========================================================
   FINAL HEADER / LOGO / MOBILE RESPONSIVE FIX
   Keep this block at the END of style.css
========================================================= */

/* Desktop logo sizing */
.brand-logo{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  flex:0 1 auto;
  min-width:0;
  height:64px;
  padding:4px 0;
  text-decoration:none;
}

.nav-logo{
  display:block;
  width:auto;
  height:166px;
  max-width:220px;
  object-fit:contain;
  object-position:left center;
}

/* Keep header content inside viewport */
.nav-shell{
  min-width:0;
}

.nav-actions{
  flex:0 0 auto;
}

/* Tablet */
@media (max-width:1180px){
  .nav-logo{
    height:50px;
    max-width:190px;
  }
}

/* =========================================================
   MOBILE HEADER + MENU
========================================================= */
@media (max-width:920px){
  .site-header{
    padding:8px 0;
    background:rgba(5,57,96,.92);
    -webkit-backdrop-filter:blur(16px);
    backdrop-filter:blur(16px);
    box-shadow:0 10px 30px rgba(0,0,0,.10);
  }

  .site-header.scrolled{
    padding:7px 0;
    background:rgba(5,57,96,.96);
  }

  .nav-shell{
    width:calc(100% - 24px);
    min-height:56px;
    margin:0 auto;
    padding:0;
    gap:12px;
    justify-content:space-between;
    overflow:visible;
  }

  .brand-logo{
    flex:0 1 auto;
    min-width:0;
    height:52px;
    padding:2px 0;
    overflow:visible;
  }

  .nav-logo{
    width:auto;
    height:116px;
    max-width:150px;
  }

  .desktop-nav,
  .address-chip,
  .nav-actions .btn{
    display:none !important;
  }

  .nav-actions{
    display:flex !important;
    align-items:center;
    justify-content:flex-end;
    margin-left:auto;
    gap:0;
  }

  .menu-toggle{
    position:relative;
    display:block !important;
    flex:0 0 44px;
    width:44px;
    height:44px;
    padding:0;
    border:1px solid rgba(255,255,255,.42);
    border-radius:50%;
    background:rgba(255,255,255,.10);
    cursor:pointer;
    z-index:2100;
    -webkit-backdrop-filter:blur(10px);
    backdrop-filter:blur(10px);
  }

  .menu-toggle span{
    position:absolute;
    left:50%;
    width:18px;
    height:2px;
    margin:0;
    background:#fff;
    border-radius:20px;
    transform:translateX(-50%);
    transition:top .3s ease,transform .3s ease,opacity .3s ease;
  }

  .menu-toggle span:first-child{top:17px}
  .menu-toggle span:last-child{top:25px}

  .menu-toggle.active span:first-child{
    top:21px;
    transform:translateX(-50%) rotate(45deg);
  }

  .menu-toggle.active span:last-child{
    top:21px;
    transform:translateX(-50%) rotate(-45deg);
  }

  .mobile-menu{
    z-index:1950;
    padding:86px 20px 28px;
  }

  .mobile-menu-inner{
    width:min(100%,420px);
    gap:18px;
  }

  .mobile-menu a{
    font-size:clamp(30px,10vw,46px);
    line-height:1.05;
  }

  .mobile-menu .btn{
    display:inline-flex !important;
    width:100%;
    margin-top:8px;
  }
}

/* =========================================================
   MOBILE HERO - PREVENT CLIPPING / OVERFLOW
========================================================= */
@media (max-width:640px){
  html,
  body{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
  }

  .container,
  .container-wide{
    width:calc(100% - 28px);
    max-width:none;
    margin-left:auto;
    margin-right:auto;
  }

  .section-pad{padding:68px 0}
  .section-pad-sm{padding:48px 0}

  .section-title{
    font-size:clamp(38px,11vw,52px);
    line-height:1.02;
    letter-spacing:-.03em;
  }

  .hero{
    min-height:100svh;
    align-items:flex-end;
  }

  .hero-media,
  .hero-media > *{
    width:100%;
    max-width:100%;
  }

  .hero-image{
    transform:scale(1.03);
    object-position:center center;
  }

  .hero-gradient{
    background:
      linear-gradient(180deg,rgba(3,31,53,.28) 0%,rgba(3,31,53,.55) 38%,rgba(3,31,53,.92) 100%),
      linear-gradient(90deg,rgba(3,31,53,.42),rgba(3,31,53,.12));
  }

  .hero-content{
    width:calc(100% - 32px) !important;
    max-width:none !important;
    margin:0 auto !important;
    padding:118px 0 38px !important;
    overflow:visible;
  }

  .hero-badge{
    max-width:100%;
    padding:8px 11px;
    font-size:10px;
    letter-spacing:.12em;
  }

  .hero-title{
    width:100%;
    max-width:100%;
    margin:28px 0 18px;
    font-size:clamp(56px,18vw,72px);
    line-height:.80;
    letter-spacing:-.055em;
    overflow:visible;
  }

  .hero-title span{
    display:block;
    width:100%;
    max-width:100%;
  }

  .hero-title span:last-child{
    padding-left:.08em;
  }

  .hero-kicker{
    margin-bottom:12px;
    font-size:27px;
    line-height:1.05;
  }

  .hero-copy{
    width:100%;
    max-width:100%;
    margin-bottom:22px;
    font-size:14px;
    line-height:1.65;
  }

  .hero-actions{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
    gap:10px;
  }

  .hero-actions .btn{
    width:100%;
    min-width:0;
    min-height:54px;
  }

  .hero-meta{
    width:100%;
    max-width:100%;
    margin-top:22px;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    border-radius:14px;
  }

  .hero-meta div,
  .hero-meta div:last-child{
    grid-column:auto;
    min-width:0;
    padding:10px 7px;
  }

  .hero-meta strong{font-size:9px}
  .hero-meta span{font-size:17px;white-space:normal}

  .hero-floating-card,
  .scroll-cue{
    display:none !important;
  }

  /* Cards and sections */
  .panel-blue{padding:28px;border-radius:22px}
  .about-image-wrap{min-height:390px}
  .about-stats{grid-template-columns:1fr}
  .why-visual{min-height:350px}
  .sun-disc{width:245px;height:245px}
  .floating-note{right:0;bottom:0;max-width:180px}

  .feature-card{
    width:min(88vw,360px);
    border-radius:22px;
  }

  .feature-body{padding:22px}

  .layout-grid,
  .tour-grid,
  .faq-grid,
  .contact-grid{
    gap:34px;
  }

  .layout-actions,
  .cta-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .layout-actions .btn,
  .cta-actions .btn{
    width:100%;
  }

  .highlight-grid{grid-template-columns:1fr}
  .highlight-item{min-height:170px;padding:26px}

  #map{
    padding:68px 0;
  }

  #map .map-grid{
    width:calc(100% - 28px);
    grid-template-columns:1fr;
    gap:34px;
  }

  #map .keyplan-card{
    padding:6px;
    border-radius:18px;
  }

  #map .keyplan-image-box,
  #map .keyplan-image{
    border-radius:13px;
  }

  #map .keyplan-overlay{
    left:16px !important;
    bottom:16px !important;
    padding:8px 12px;
    font-size:9px;
  }

  #map .map-copy .section-title{
    font-size:clamp(38px,11vw,50px);
    line-height:1;
    margin-bottom:24px !important;
  }

  #map .distance-item{
    gap:12px;
    padding:14px 2px;
  }

  #map .distance-item span{font-size:14px}
  #map .distance-item strong{font-size:14px}

  .tour-poster{
    border-radius:20px;
  }

  .project-video{
    min-height:230px;
    aspect-ratio:16/10;
    object-fit:cover;
  }

  .faq-item > button{
    padding:20px 0;
    font-size:20px;
    gap:16px;
  }

  .cta-banner{
    min-height:560px;
  }

  .lead-form{
    padding:26px;
    border-radius:20px;
  }

  .contact-points a{
    align-items:flex-start;
  }

  .footer-row{
    display:grid;
    justify-content:center;
    text-align:center;
  }

  .floating-actions{
    right:12px;
    bottom:12px;
  }

  .floating-actions a{
    width:44px;
    height:44px;
  }

  .modal,
  .video-modal,
  .lightbox{
    padding:10px;
  }

  .modal-panel{
    border-radius:20px;
  }

  .modal-copy,
  .modal-panel .lead-form{
    padding:26px;
  }

  .modal-copy h2{
    font-size:34px;
  }

  .video-panel{
    border-radius:16px;
  }

  .cursor-dot,
  .cursor-ring{
    display:none !important;
  }
}

/* Extra-small phones */
@media (max-width:390px){
  .nav-shell{width:calc(100% - 18px)}
  .nav-logo{height:92px;max-width:136px}
  .menu-toggle{width:42px;height:42px;flex-basis:42px}

  .hero-content{
    width:calc(100% - 26px) !important;
    padding-top:112px !important;
  }

  .hero-title{
    font-size:clamp(54px,17.5vw,67px);
  }

  .hero-kicker{font-size:25px}
  .hero-copy{font-size:13.5px}

  .hero-meta{
    grid-template-columns:1fr 1fr;
  }

  .hero-meta div:last-child{
    grid-column:1 / -1;
  }
}

/* =========================================================
   ABOUT SECTION - DESKTOP + MOBILE FLEX ALIGNMENT FIX
   Scoped only to the About section
========================================================= */

.about .about-grid{
  display:flex;
  align-items:stretch;
  justify-content:space-between;
  gap:24px;
}

.about .about-grid > *{
  min-width:0;
}

.about .panel-blue{
  flex:0 0 38%;
  width:38%;
  height:auto;
  align-self:stretch;
}

.about .about-image-wrap{
  flex:1 1 62%;
  width:auto;
  min-height:690px;
  height:auto;
  align-self:stretch;
}

.about .about-image-wrap img{
  width:100%;
  height:100%;
  min-height:100%;
  object-fit:cover;
  object-position:center;
}

/* Tablet */
@media (max-width:1180px){
  .about .about-grid{
    gap:20px;
  }

  .about .panel-blue{
    flex-basis:42%;
    width:42%;
  }

  .about .about-image-wrap{
    flex-basis:58%;
    min-height:620px;
  }
}

/* Mobile / tablet stack */
@media (max-width:920px){
  .about .about-grid{
    flex-direction:column;
    gap:24px;
  }

  .about .panel-blue,
  .about .about-image-wrap{
    flex:0 0 auto;
    width:100%;
    max-width:100%;
  }

  .about .panel-blue{
    order:1;
  }

  .about .about-image-wrap{
    order:2;
    min-height:520px;
  }
}

/* Phones */
@media (max-width:640px){
  .about .about-grid{
    gap:18px;
  }

  .about .panel-blue{
    width:100%;
    padding:28px;
    border-radius:22px;
  }

  .about .panel-blue .section-title{
    font-size:clamp(38px,11vw,48px);
  }

  .about .about-image-wrap{
    width:100%;
    min-height:0;
    aspect-ratio:4 / 5;
    border-radius:22px;
  }

  .about .about-image-wrap img{
    width:100%;
    height:100%;
    min-height:0;
    object-fit:cover;
  }

  .about .about-stats{
    grid-template-columns:1fr;
  }
}

/* Extra-small phones */
@media (max-width:390px){
  .about .panel-blue{
    padding:24px;
  }

  .about .about-image-wrap{
    aspect-ratio:3 / 4;
  }
}

/* =========================================================
   ABOUT SECTION - FORCE VISIBLE + FLEX ALIGNMENT FIX
   Keep this block at the VERY END of style.css
========================================================= */
.about .about-grid{
  display:flex !important;
  align-items:stretch !important;
  gap:24px !important;
}

.about .panel-blue{
  flex:0 0 38% !important;
  width:38% !important;
  min-width:0 !important;
}

.about .about-image-wrap{
  flex:1 1 0 !important;
  width:auto !important;
  min-width:0 !important;
  min-height:690px !important;
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
}

.about .about-image-wrap img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-height:690px !important;
  object-fit:cover !important;
  object-position:center !important;
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
}

@media (max-width:920px){
  .about .about-grid{
    flex-direction:column !important;
    gap:24px !important;
  }

  .about .panel-blue,
  .about .about-image-wrap{
    flex:0 0 auto !important;
    width:100% !important;
  }

  .about .about-image-wrap,
  .about .about-image-wrap img{
    min-height:520px !important;
  }
}

@media (max-width:640px){
  .about .about-grid{
    gap:18px !important;
  }

  .about .panel-blue{
    padding:28px !important;
  }

  .about .about-image-wrap{
    min-height:0 !important;
    aspect-ratio:4/5 !important;
  }

  .about .about-image-wrap img{
    min-height:0 !important;
    height:100% !important;
  }
}

/* =========================================================
   MOBILE FEATURES - TOUCH HORIZONTAL SCROLL FIX
   Desktop behavior untouched
   Keep this block at the VERY END of style.css
========================================================= */
@media (max-width: 920px){
  .features{
    overflow: hidden;
  }

  .feature-viewport{
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scroll-padding-left: 17px;
    overscroll-behavior-x: contain;
    touch-action: pan-x pan-y;
    scrollbar-width: none;
  }

  .feature-viewport::-webkit-scrollbar{
    display: none;
  }

  .feature-track{
    display: flex !important;
    width: max-content !important;
    min-width: 100%;
    gap: 16px !important;
    padding: 0 17px 18px !important;
    overflow: visible !important;
    transform: none !important;
  }

  .feature-card{
    flex: 0 0 min(84vw, 360px) !important;
    width: min(84vw, 360px) !important;
    max-width: none !important;
    scroll-snap-align: start;
    scroll-snap-stop: always;
    transform: none !important;
  }
}

@media (max-width: 640px){
  .features-head{
    margin-bottom: 30px;
  }

  .feature-viewport{
    scroll-padding-left: 14px;
  }

  .feature-track{
    gap: 14px !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .feature-card{
    flex-basis: 86vw !important;
    width: 86vw !important;
    max-width: 360px !important;
  }
}

/* =========================================
   HERO AVAILABILITY - LIGHT SWEEP ONLY
========================================= */

.hero-availability{
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

/* keep all content above the effect */
.hero-availability > *{
  position: relative;
  z-index: 2;
}

/* moving light */
.hero-availability::after{
  content: "";

  position: absolute;
  top: -60%;
  left: -45%;

  width: 28%;
  height: 220%;

  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255,255,255,0.08) 25%,
    rgba(255,255,255,0.70) 50%,
    rgba(255,255,255,0.08) 75%,
    transparent 100%
  );

  transform: rotate(18deg);

  filter: blur(5px);

  opacity: 0;

  pointer-events: none;

  animation: heroAvailabilityLight 3.2s ease-in-out infinite;
}

@keyframes heroAvailabilityLight{

  0%{
    left: -45%;
    opacity: 0;
  }

  15%{
    opacity: 1;
  }

  55%{
    opacity: 1;
  }

  75%,
  100%{
    left: 125%;
    opacity: 0;
  }

}

.hero-availability{
  display: inline-flex;
  align-items: center;
  gap: 10px;

  padding: 8px 12px;
  border-radius: 10px;

  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.06);

  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* =========================================
   HERO AVAILABILITY SPACING FIX
========================================= */

/* Keep a clear gap below the availability strip */
.hero-availability{
  margin-bottom: 0 !important;
}

/* The action row comes immediately after the availability strip.
   Give that row the spacing, so the button can never touch the strip. */
.hero-availability + .hero-actions{
  margin-top: 24px !important;
}

/* TABLET */
@media (max-width: 920px){
  .hero-availability + .hero-actions{
    margin-top: 22px !important;
  }
}

/* MOBILE */
@media (max-width: 640px){

  .hero-availability{
    width: 100%;
    margin-bottom: 0 !important;
  }

  .hero-availability + .hero-actions{
    margin-top: 20px !important;
  }

  .hero-actions{
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .hero-actions .btn{
    width: 100%;
  }
}

@media (max-width:640px){

  .hero-availability{
    padding: 11px 14px;
    border-radius: 14px;

    display: grid;
    grid-template-columns: 1fr auto;
    column-gap: 12px;
    row-gap: 4px;
  }

  .availability-text{
    min-width: 0;
  }

  .availability-text strong{
    display: block;
    line-height: 1.2;
  }

  .availability-text small{
    display: block;
    margin-top: 3px;
    line-height: 1.4;
  }

  .availability-badge{
    align-self: center;
    white-space: nowrap;
  }
}

/* Hero content mobile view adjustment */

/* =========================================================
   MOBILE HERO - FINAL CLEANUP
   Desktop untouched
========================================================= */

@media (max-width: 640px){

  /* Hero spacing */
  .hero-content{
    width: calc(100% - 28px) !important;
    padding-top: 120px !important;
    padding-bottom: 34px !important;
  }

  /* Title */
  .hero-title{
    margin: 22px 0 14px !important;
    font-size: clamp(54px, 17vw, 68px) !important;
    line-height: .82 !important;
  }

  .hero-title span:last-child{
    padding-left: .04em !important;
  }

  /* Beach View Villa Plots */
  .hero-kicker{
    margin: 0 0 14px !important;
    font-size: 25px !important;
    line-height: 1.1 !important;
  }


  /* =========================================
     AVAILABILITY BOX
  ========================================= */

  .hero-availability{
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;

    width: 100% !important;
    max-width: 100% !important;

    gap: 4px 8px !important;

    margin: 0 0 18px !important;
    padding: 12px 14px !important;

    border-radius: 14px !important;

    background: rgba(5, 36, 60, .48) !important;
    border: 1px solid rgba(255,255,255,.22) !important;

    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }


  /* "Only 8 Plots Available" */
  .availability-text{
    display: flex !important;
    flex: 1 1 100% !important;
    flex-direction: column !important;

    min-width: 0 !important;

    text-align: left !important;
  }

  .availability-text strong{
    display: block !important;

    font-size: 15px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;

    white-space: normal !important;
  }

  .availability-text small{
    display: block !important;

    margin-top: 4px !important;

    font-size: 11px !important;
    line-height: 1.35 !important;

    color: rgba(255,255,255,.72) !important;
  }


  /* Selling Fast */
  .availability-badge{
    display: inline-flex !important;
    align-items: center !important;

    width: max-content !important;

    margin-top: 8px !important;
    padding: 6px 10px !important;

    border-radius: 999px !important;

    background: rgba(255,255,255,.13) !important;
    border: 1px solid rgba(255,255,255,.18) !important;

    color: #fff !important;

    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1 !important;

    letter-spacing: .06em !important;
    text-transform: uppercase !important;

    white-space: nowrap !important;
  }


  /* =========================================
     BUTTONS
  ========================================= */

  .hero-availability + .hero-actions{
    margin-top: 0 !important;
  }

  .hero-actions{
    display: grid !important;
    grid-template-columns: 1fr !important;

    width: 100% !important;

    gap: 10px !important;
  }

  .hero-actions .btn{
    width: 100% !important;
    min-height: 52px !important;
  }


  /* =========================================
     HERO META
  ========================================= */

  .hero-meta{
    width: 100% !important;

    margin-top: 18px !important;

    grid-template-columns: repeat(3, minmax(0,1fr)) !important;

    border-radius: 14px !important;
  }

  .hero-meta div,
  .hero-meta div:last-child{
    min-width: 0 !important;
    padding: 10px 7px !important;

    grid-column: auto !important;
  }

  .hero-meta strong{
    font-size: 8px !important;
  }

  .hero-meta span{
    font-size: 11px !important;
    line-height: 1.25 !important;

    word-break: normal !important;
    overflow-wrap: anywhere !important;
  }
}


/* very small phones */
@media (max-width: 390px){

  .hero-content{
    width: calc(100% - 24px) !important;
  }

  .hero-title{
    font-size: 56px !important;
  }

  .hero-kicker{
    font-size: 23px !important;
  }

  .hero-availability{
    padding: 11px 12px !important;
  }

  .availability-text strong{
    font-size: 14px !important;
  }

  .availability-text small{
    font-size: 10px !important;
  }

}
/* =========================================================
   ABOUT VIDEO - CLICK / PLAY CONTROLS FIX
   Added at the end so existing layout remains unchanged
========================================================= */
.about .about-image-wrap{
  position:relative;
}

.about .about-image-wrap::after{
  pointer-events:none !important;
  z-index:1;
}

.about .about-image-wrap video,
.about .about-image-wrap .project-video{
  position:relative;
  z-index:2;
  display:block;
  width:100%;
  height:100%;
  pointer-events:auto !important;
  cursor:pointer;
}