/*
Theme Name: Palma Real Estate & Investment
Theme URI: https://palmarealestate.al
Author: Palma Real Estate & Investment
Description: Custom theme for PALMA REAL ESTATE & INVESTMENT — properties, investment & development opportunities, Durrës, Albania. Bilingual (ALB/ENG). v2: AUREA-style editorial layout (single serif, white/beige, domed section edges, off-canvas menu).
Version: 3.16.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: palma
*/


/* Font (Fraunces)
   are enqueued from inc/setup.php so the browser can fetch them early. */

/* =========================================================
   0. PAGE TRANSITIONS
   ========================================================= */
@view-transition { navigation: auto; }

::view-transition-old(root),
::view-transition-new(root){ animation-duration: .35s; animation-timing-function: cubic-bezier(.22,.61,.36,1); }

.single-gallery .main-img{ view-transition-name: palma-listing-hero; }

@media (prefers-reduced-motion: reduce){
  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*){ animation: none !important; }
  .single-gallery .main-img{ view-transition-name: none; }
}

/* =========================================================
   1. TOKENS
   ========================================================= */
:root{
  /* One serif for everything, like the reference. "SOFT" rounds the
     letterforms; "WONK" off keeps them classical. */
  --serif: 'Fraunces', Georgia, 'Times New Roman', serif;
  --serif-settings: "SOFT" 100, "WONK" 0;

  --ink: #121212;          /* headings, links, lines */
  --text: #333333;         /* body copy */
  --gray: #6B6B6B;
  --gray-light: #9A9A9A;
  --white: #FFFFFF;
  --white-pure: #FFFFFF;
  --off: #FAF8F6;          /* off-white panels with the diagonal lines */
  --beige: #F6F1ED;        /* footer / soft bands */
  --line: rgba(18,18,18,.14);
  --line-on-dark: rgba(255,255,255,.18);

  /* Legacy names still used by inner templates — mapped to the new palette. */
  --navy: #141414;
  --navy-2: #1B1B1B;
  --navy-soft: #262626;
  --gold: #8A7A63;
  --gold-light: #D9CCB8;
  --gold-dark: #6E604B;

  --radius: 0;
  --container: 1240px;
  --gap: 24px;
  --speed: .5s;
  --ease: cubic-bezier(.22,.61,.36,1);
  --dome: 90px;            /* height of the curved section edges */
}
@media (max-width: 768px){ :root{ --dome: 40px; } }

/* =========================================================
   2. RESET / BASE
   ========================================================= */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--serif);
  font-variation-settings: var(--serif-settings);
  font-weight: 300;
  color: var(--text);
  background: var(--white);
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul { margin: 0; padding: 0; list-style: none; }
button { font-family: inherit; cursor: pointer; font-variation-settings: inherit; }
input, textarea, select { font-family: inherit; font-size: 1rem; font-variation-settings: inherit; }
h1, h2, h3, h4, h5 {
  font-family: var(--serif); font-variation-settings: var(--serif-settings);
  font-weight: 400; margin: 0 0 .5em; line-height: 1.2; color: var(--ink);
  text-wrap: balance;
}
strong, b { font-weight: 500; }
p { margin: 0 0 1em; }
.intro p, .hero-tagline, .section-head .lede, .opp-note, .legal-content p{ text-wrap: pretty; }
figure { margin: 0; }
.center{ text-align: center; }

/* =========================================================
   3. LAYOUT
   ========================================================= */
.container{ max-width: var(--container); margin: 0 auto; padding: 0 40px; }
@media (max-width: 640px){ .container{ padding: 0 20px; } }
.section{ padding: 110px 0; position: relative; }
.section--tight{ padding: 80px 0; }
.section--dark{
  color: rgba(255,255,255,.88); background-color: var(--navy);
  background-image: linear-gradient(rgba(0,0,0,.62), rgba(0,0,0,.62)), url('assets/img/hero-durres-v4-poster.jpg');
  background-size: cover; background-position: center;
}
.section--dark h1, .section--dark h2, .section--dark h3, .section--dark h4{ color: #fff; }

/* Domed edges — a section either rises over the one before it (top) or
   bulges down over the one after it (bottom), as on the reference site. */
.dome-top{
  position: relative; z-index: 2; background: var(--white);
  margin-top: calc(-1 * var(--dome));
  border-radius: 50% 50% 0 0 / var(--dome) var(--dome) 0 0;
  padding-top: calc(var(--dome) + 60px);
}
.dome-bottom{
  position: relative; z-index: 2; background: var(--white);
  margin-bottom: calc(-1 * var(--dome));
  border-radius: 0 0 50% 50% / 0 0 var(--dome) var(--dome);
  padding-bottom: calc(var(--dome) + 50px);
}

/* Off-white with the thin diagonal hairlines. */
.section--lines,
.section--soft{
  background-color: var(--off);
  background-image: repeating-linear-gradient(112deg, transparent 0 179px, rgba(18,18,18,.055) 179px 180px);
}

.grid{ display: grid; gap: var(--gap); }
.g-2{ grid-template-columns: repeat(2,1fr); }
.g-3{ grid-template-columns: repeat(3,1fr); }
.g-4{ grid-template-columns: repeat(4,1fr); }
.g-5{ grid-template-columns: repeat(5,1fr); }
@media (max-width: 1024px){ .g-4{ grid-template-columns: repeat(2,1fr); } .g-5{ grid-template-columns: repeat(2,1fr); } .g-3{ grid-template-columns: repeat(2,1fr); } }
@media (max-width: 640px){ .g-2, .g-3, .g-4, .g-5{ grid-template-columns: 1fr; } }

.split{ display: grid; grid-template-columns: 1fr 1.3fr; gap: 80px; align-items: center; }
.split--wide-first{ grid-template-columns: 1.3fr 1fr; align-items: center; }
.split--even{ grid-template-columns: 1fr 1fr; }
@media (max-width: 900px){
  .split, .split--wide-first, .split--even{ grid-template-columns: 1fr; gap: 44px; }
}
.mini-steps{ display: grid; grid-template-columns: repeat(2,1fr); gap: 28px; }
@media (max-width: 600px){ .mini-steps{ grid-template-columns: 1fr; } }

.eyebrow{
  display: block; font-family: var(--serif); font-size: 12px; letter-spacing: .38em;
  text-transform: uppercase; color: var(--ink); font-weight: 300; margin-bottom: 22px;
}
.eyebrow--center{ text-align: center; }
.section--dark .eyebrow{ color: rgba(255,255,255,.8); }

.section-head{ max-width: 780px; margin-bottom: 56px; }
.section-head.center{ margin-left: auto; margin-right: auto; text-align: center; }
.section-head h2{ font-size: clamp(30px, 3.4vw, 46px); }
.section-head .lede{ color: var(--gray); font-size: 18px; max-width: 640px; }
.section-head.center .lede{ margin-left: auto; margin-right: auto; }
.section--dark .section-head .lede{ color: rgba(255,255,255,.68); }

.reveal{ opacity: 0; transform: translateY(28px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.is-visible{ opacity: 1; transform: translateY(0); }

.split-words .word{ display: inline-block; overflow: hidden; vertical-align: bottom; }
.split-words .word-inner{ display: inline-block; transform: translateY(105%); transition: transform .9s var(--ease); }
.split-words.is-visible .word-inner{ transform: translateY(0); }

.listing-card .thumb,
.opp-card .opp-media,
.single-gallery .main-img{
  clip-path: inset(100% 0 0 0);
  transition: clip-path 1.05s var(--ease);
}
.reveal.is-visible .thumb,
.reveal.is-visible .opp-media,
.reveal.is-visible .main-img,
.opp-card.is-visible .opp-media,
.listing-card.is-visible .thumb,
.single-gallery.is-visible .main-img{ clip-path: inset(0 0 0 0); }
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity: 1; transform: none; transition: none; }
  html{ scroll-behavior: auto; }
  .hero-media video, .hero-media img{ animation: none; transform: none; }
  .split-words .word-inner{ transform: none; transition: none; }
  .listing-card .thumb, .opp-card .opp-media, .single-gallery .main-img{ clip-path: none; transition: none; }
  .marquee-track{ animation: none !important; }
  .hero-scroll svg{ animation: none !important; }
}

[id]{ scroll-margin-top: 100px; }

:focus-visible{ outline: 2px solid var(--ink); outline-offset: 3px; }
.hero :focus-visible, .section--dark :focus-visible, .find-us :focus-visible, .page-hero :focus-visible{ outline-color: #fff; }

/* =========================================================
   4. BUTTONS & LINKS
   ========================================================= */
.btn{
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 12px 26px; border: 1px solid currentColor; border-radius: 0;
  font-size: 15px; letter-spacing: .01em; font-weight: 400;
  background: transparent; color: var(--ink);
  transition: background var(--speed) var(--ease), color var(--speed) var(--ease), border-color var(--speed) var(--ease);
  white-space: nowrap;
}
.btn:hover{ background: var(--ink); color: #fff; border-color: var(--ink); }
.btn-gold{ color: var(--ink); }
.btn-light{ color: #fff; }
.btn-light:hover{ background: #fff; color: var(--ink); border-color: #fff; }
.btn-solid, .btn-solid-gold{ background: var(--ink); color: #fff; border-color: var(--ink); }
.btn-solid:hover, .btn-solid-gold:hover{ background: transparent; color: var(--ink); }
.section--dark .btn-solid:hover, .section--dark .btn-solid-gold:hover{ color: #fff; border-color: #fff; }
.btn-sm{ padding: 9px 18px; font-size: 13.5px; }
.btn-row{ display: flex; gap: 16px; flex-wrap: wrap; }
@media (max-width: 600px){
  .btn{ white-space: normal; text-align: center; }
  .btn-row{ gap: 12px; }
  .btn-row > .btn{ flex: 1 1 100%; }
}

/* Rounded outline pill (hero). */
.btn-pill{
  display: inline-flex; align-items: center; padding: 9px 24px; border-radius: 40px;
  border: 1px solid rgba(255,255,255,.9); color: #fff; font-size: 16px; font-weight: 400;
  transition: background var(--speed) var(--ease), color var(--speed) var(--ease);
}
.btn-pill:hover{ background: #fff; color: var(--ink); }

/* Square outline (forms). */
.btn-outline{
  display: inline-flex; align-items: center; padding: 11px 22px; background: transparent;
  border: 1px solid var(--ink); color: var(--ink); font-size: 15px; font-weight: 400;
  transition: background var(--speed) var(--ease), color var(--speed) var(--ease);
}
.btn-outline:hover{ background: var(--ink); color: #fff; }

.link-underline{
  display: inline-block; font-size: 14px; letter-spacing: .1em; color: var(--ink);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px;
  background: none; border: 0; padding: 0; transition: opacity var(--speed);
}
.link-underline:hover{ opacity: .6; }
.link-underline--light{ color: #fff; }

/* =========================================================
   5. HEADER + OFF-CANVAS MENU
   ========================================================= */
.site-header{ position: fixed; top: 0; left: 0; right: 0; z-index: 100; pointer-events: none; }
.header-inner{
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding: 20px 40px;
}
.site-header a, .site-header button, .admin-setup-bar{ pointer-events: auto; }
.brand{ display: flex; align-items: center; transition: opacity var(--speed) var(--ease), transform var(--speed) var(--ease); }
.brand img{ height: 72px; width: auto; }
.site-header.is-solid .brand{ opacity: 0; transform: translateY(-12px); pointer-events: none; }

.header-right{
  display: flex; align-items: center; gap: 18px; padding: 4px 4px 4px 16px; border-radius: 14px;
  transition: background var(--speed) var(--ease), box-shadow var(--speed) var(--ease);
}
.header-contact{ color: #fff; font-size: 15px; font-weight: 400; transition: color var(--speed); }
.header-contact:hover{ opacity: .7; }
.hamburger{
  width: 46px; height: 42px; position: relative; border: 0; padding: 0; border-radius: 10px;
  background: rgba(255,255,255,.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  transition: background var(--speed);
}
.hamburger:hover{ background: rgba(255,255,255,.85); }
.hamburger span{ position: absolute; left: 12px; right: 12px; height: 1.3px; background: var(--ink); }
.hamburger span:nth-child(1){ top: 14px; }
.hamburger span:nth-child(2){ top: 20.5px; }
.hamburger span:nth-child(3){ top: 27px; }

.site-header.is-solid .header-right,
.site-header.is-dark-text .header-right{
  background: rgba(255,255,255,.78); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 6px 24px rgba(0,0,0,.06);
}
.site-header.is-solid .header-contact,
.site-header.is-dark-text .header-contact{ color: var(--ink); }
.site-header.is-solid .hamburger,
.site-header.is-dark-text .hamburger{ background: rgba(18,18,18,.06); }

@media (max-width: 640px){
  .header-inner{ padding: 14px 16px; }
  .brand img{ height: 56px; }
  .header-contact{ font-size: 14px; }
}

.nav-overlay{
  position: fixed; inset: 0; z-index: 200; background: rgba(0,0,0,.62);
  opacity: 0; visibility: hidden; transition: opacity var(--speed) var(--ease), visibility var(--speed);
}
.main-nav{
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 210; width: min(430px, 100%);
  background: #fff; display: flex; flex-direction: column; padding: 34px 56px 36px;
  overflow-y: auto; transform: translateX(100%); visibility: hidden;
  /* Hidden once slid out, so its links are not tabbable while closed. */
  transition: transform .6s var(--ease), visibility 0s linear .6s;
}
.nav-open .nav-overlay{ opacity: 1; visibility: visible; }
.nav-open .main-nav{ transform: translateX(0); visibility: visible; transition: transform .6s var(--ease), visibility 0s; }
.nav-close{
  position: absolute; top: 22px; right: 22px; width: 42px; height: 42px; background: none; border: 0;
  color: var(--ink); display: flex; align-items: center; justify-content: center;
}
.nav-logo{ align-self: center; margin-bottom: 26px; }
.nav-logo img{ height: 78px; width: auto; }
.nav-links ul{ display: flex; flex-direction: column; gap: 4px; }
.nav-links a{
  display: inline-block; font-size: 25px; font-weight: 400; color: var(--ink); line-height: 1.5;
  transition: opacity var(--speed), transform var(--speed) var(--ease);
}
.nav-links a:hover{ opacity: .55; transform: translateX(4px); }
.nav-links .current-menu-item > a{ text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 1px; }
.nav-links .sub-menu{ padding: 2px 0 8px 16px; gap: 0; }
.nav-links .sub-menu a{ font-size: 16px; color: var(--gray); line-height: 1.9; }
.nav-lang{ display: flex; flex-direction: column; gap: 2px; margin-top: 28px; font-size: 14px; }
.nav-lang a{ color: var(--gray); }
.nav-lang a.is-active{ color: var(--ink); }
.nav-contact{ margin-top: auto; padding-top: 40px; display: flex; flex-direction: column; gap: 4px; font-size: 14px; color: var(--ink); }
.nav-contact a:hover{ opacity: .6; }
.social-row{ display: flex; gap: 16px; align-items: center; margin-top: 16px; }
.social-row a{ color: var(--ink); display: inline-flex; transition: opacity var(--speed); }
.social-row a:hover{ opacity: .55; }
.social-row svg{ width: 16px; height: 16px; }
@media (max-width: 480px){ .main-nav{ padding: 30px 32px; } }

/* =========================================================
   6. HERO
   ========================================================= */
.hero{
  position: relative; min-height: 100vh; display: flex; align-items: center; justify-content: center;
  overflow: hidden; background: var(--navy);
}
@supports (height: 100svh){ .hero{ min-height: 100svh; } }
.hero-media{ position: absolute; inset: 0; z-index: 0; }
.hero-media video, .hero-media img{ width: 100%; height: 100%; object-fit: cover; transform: scale(1.06); animation: heroZoom 18s ease-out forwards; }
@keyframes heroZoom{ to{ transform: scale(1); } }
.hero-media::after{ content:''; position: absolute; inset: 0; background: rgba(0,0,0,.34); }
.hero-fallback-bg{ position: absolute; inset: 0; background: linear-gradient(160deg, #2a2724 0%, #151515 100%); }

.admin-setup-bar{
  background: #3A2E17; color: #F3D9A4; font-size: 12px; padding: 9px 32px; font-family: -apple-system, 'Segoe UI', sans-serif;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap; position: relative;
}
.admin-setup-bar strong{ color: #fff; font-weight: 600; }
.admin-setup-bar a{ color: #F3D9A4; text-decoration: underline; text-underline-offset: 2px; }
.admin-setup-bar a:hover{ color: #fff; }
.admin-setup-bar .sep{ opacity: .5; }
.admin-setup-bar-close{
  position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
  background: none; border: 0; color: #F3D9A4; font-size: 18px; line-height: 1; padding: 4px 8px;
}
.admin-setup-bar-close:hover{ color: #fff; }
body.setup-bar-dismissed .admin-setup-bar{ display: none; }

.hero-content{
  position: relative; z-index: 2; text-align: center; color: #fff;
  padding: 150px 24px calc(var(--dome) + 120px); max-width: 1100px;
}
.hero-brand{
  font-size: clamp(44px, 7.2vw, 108px); font-weight: 500; letter-spacing: .01em; line-height: 1.04;
  color: #fff; margin: 0 0 22px; text-shadow: 0 2px 30px rgba(0,0,0,.25);
}
.hero-title{
  font-size: clamp(26px, 3.2vw, 46px); font-weight: 400; letter-spacing: .03em; line-height: 1.2;
  color: #fff; margin: 0 0 16px;
}
.rotator{ position: relative; display: inline-block; white-space: nowrap; vertical-align: bottom; }
.rotator-word{
  position: absolute; left: 0; top: 0; opacity: 0; transform: translateY(45%);
  transition: opacity .6s var(--ease), transform .7s var(--ease);
}
.rotator-word.is-active{ position: relative; opacity: 1; transform: none; }
.rotator-word.is-leaving{ opacity: 0; transform: translateY(-45%); }
.hero-sub{ font-size: clamp(24px, 2.8vw, 40px); font-weight: 500; color: #fff; margin: 0 0 14px; line-height: 1.2; }
.hero-tagline{ font-size: clamp(16px, 1.5vw, 21px); color: rgba(255,255,255,.95); max-width: 860px; margin: 0 auto 34px; line-height: 1.4; }
.hero-scroll{
  position: absolute; left: 50%; bottom: calc(var(--dome) + 34px); transform: translateX(-50%); z-index: 2;
  color: rgba(255,255,255,.85);
}
.hero-scroll svg{ display: block; animation: chevronBob 2.4s ease-in-out infinite; }
@keyframes chevronBob{ 0%,100%{ transform: translateY(0); } 50%{ transform: translateY(7px); } }

@media (max-height: 760px){
  .hero-content{ padding-top: 110px; padding-bottom: calc(var(--dome) + 90px); }
  .hero-scroll{ bottom: calc(var(--dome) + 18px); }
}

/* Inner page hero: dark photo band ending in a white dome. */
.page-hero{
  position: relative; min-height: 58vh; display: flex; align-items: flex-end; background: var(--navy); color: #fff;
  padding: 190px 0 calc(var(--dome) + 70px); background-size: cover; background-position: center; overflow: hidden;
  /* Durrës aerial as the default; templates that set their own inline
     background-image override it. */
  background-image: url('assets/img/hero-durres-v4-poster.jpg');
}
.page-hero::before{ content:''; position:absolute; inset:0; background: linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.6)); }
.page-hero::after{
  content:''; position: absolute; left: 0; right: 0; bottom: -1px; height: var(--dome); background: var(--white);
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
}
.page-hero{ align-items: center; text-align: center; min-height: 72vh; }
.page-hero .container{ position: relative; z-index: 1; width: 100%; }
.page-hero .eyebrow{ color: rgba(255,255,255,.85); }
.page-hero h1{ color: #fff; font-size: clamp(34px, 4.8vw, 64px); max-width: 960px; margin: 0 auto 14px; }
.page-hero-sub, .page-hero p{ color: rgba(255,255,255,.92); font-size: clamp(16px, 1.5vw, 20px); max-width: 760px; margin: 0 auto; }
.page-hero .breadcrumbs{ font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.6); margin-bottom: 18px; }
.page-hero .breadcrumbs a{ color: rgba(255,255,255,.85); }
.page-hero .breadcrumbs a:hover{ color: #fff; }

/* =========================================================
   7. HOMEPAGE SECTIONS
   ========================================================= */
/* Intro */
.intro-split{ padding-bottom: 150px; }
.intro-title{ font-size: clamp(28px, 2.7vw, 38px); line-height: 1.25; margin-bottom: 6px; }
.intro-caps{ font-size: clamp(22px, 2.1vw, 30px); text-transform: uppercase; color: var(--ink); letter-spacing: .02em; margin-bottom: 30px; }
.intro-split p{ max-width: 470px; }
.intro-split .link-underline{ margin-top: 18px; }
.intro-media img{ width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }

/* What we do */
.services{ padding-bottom: calc(var(--dome) + 110px); }
.services-grid{ display: grid; grid-template-columns: 1fr 1.2fr; gap: 90px; align-items: start; }
.services-lead{ position: sticky; top: 120px; }
.services-statement{ font-size: clamp(26px, 2.8vw, 40px); line-height: 1.3; color: var(--ink); font-weight: 300; margin-bottom: 30px; }
.services-statement strong{ font-weight: 500; }
.services-list{ display: grid; grid-template-columns: 1fr 1fr; gap: 56px 50px; }
.service{ display: block; color: var(--ink); }
.service-icon{ display: block; margin-bottom: 14px; color: var(--ink); transition: transform var(--speed) var(--ease); }
.service:hover .service-icon{ transform: translateY(-4px); }
.service h3{ font-size: 20px; font-weight: 400; margin-bottom: 10px; }
.service p{ font-size: 14.5px; color: #555; margin: 0; }
@media (max-width: 960px){
  .services-grid{ grid-template-columns: 1fr; gap: 56px; }
  .services-lead{ position: static; }
}
@media (max-width: 560px){ .services-list{ grid-template-columns: 1fr; gap: 40px; } }

/* Quote */
.quote-band{ padding-bottom: 60px; }
.big-quote{
  text-align: center; font-size: clamp(24px, 2.6vw, 38px); line-height: 1.4; color: var(--ink);
  max-width: 1040px; margin: 0 auto; font-weight: 300; text-wrap: balance;
}
.big-quote strong{ font-weight: 500; }

/* Carousel */
.carousel-section{ padding: 80px 0 90px; overflow: hidden; }
.carousel{ position: relative; height: 580px; margin: 10px auto 34px; max-width: 1180px; touch-action: pan-y; }
.carousel-track{ position: absolute; inset: 0; }
.slide-card{
  --o: 0; --s: 1;
  position: absolute; left: 50%; top: 50%; width: 360px; height: 540px; overflow: hidden; color: #fff;
  transform: translate(-50%, -50%) translateX(calc(var(--o) * 400px)) scale(var(--s));
  transition: transform .8s var(--ease), opacity .6s var(--ease); background: var(--navy-2);
  opacity: 0; pointer-events: none;
}
.slide-card.is-center, .slide-card.is-side{ opacity: 1; pointer-events: auto; }
.slide-card.is-center{ z-index: 3; }
.slide-card.is-side{ z-index: 2; }
.slide-media{ position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform 1.1s var(--ease); }
.slide-card:hover .slide-media, .tile-card:hover .slide-media{ transform: scale(1.05); }
.slide-media::after{ content:''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.55) 100%); }
.slide-price{
  position: absolute; top: 16px; right: 16px; z-index: 2; font-size: 13px; color: var(--ink);
  border-radius: 8px; padding: 4px 12px; background: #fff; box-shadow: 0 2px 10px rgba(0,0,0,.08);
}
.slide-price .price-tag{ font-weight: 400; font-size: 1em; color: var(--ink); }
.slide-price .price-original{ color: var(--gray-light); }
.slide-body{ position: absolute; left: 24px; right: 24px; bottom: 22px; z-index: 2; }
.slide-title{ display: block; font-size: 27px; line-height: 1.2; font-weight: 400; }
.slide-cat{ display: block; font-size: 13px; opacity: .85; margin-top: 4px; }
.carousel-nav{
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; background: none; border: 0;
  color: var(--ink); width: 46px; height: 46px; display: flex; align-items: center; justify-content: center;
  transition: opacity var(--speed);
}
.carousel-nav:hover{ opacity: .5; }
.carousel-prev{ left: 0; }
.carousel-next{ right: 0; }
@media (max-width: 900px){
  .carousel{ height: 480px; }
  .slide-card{ width: 300px; height: 440px; transform: translate(-50%, -50%) translateX(calc(var(--o) * 320px)) scale(var(--s)); }
}
@media (max-width: 600px){
  .carousel{ height: 440px; }
  .slide-card{ width: 72vw; height: 400px; transform: translate(-50%, -50%) translateX(calc(var(--o) * 76vw)) scale(var(--s)); }
  .carousel-prev{ left: -8px; }
  .carousel-next{ right: -8px; }
}

/* Word marquee */
.marquee-section{ padding: 70px 0 calc(var(--dome) + 70px); overflow: hidden; }
.marquee{ overflow: hidden; margin-top: 16px; mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.marquee-track{ display: flex; align-items: center; gap: 44px; width: max-content; animation: marquee 45s linear infinite; }
.marquee-track span{ font-size: clamp(24px, 2.4vw, 34px); color: var(--ink); white-space: nowrap; }
.marquee-track i{ font-style: normal; font-size: 12px; color: var(--gold); }
@keyframes marquee{ to{ transform: translateX(-50%); } }

/* Durrës band */
.find-us{
  position: relative; color: #fff; background-size: cover; background-position: center;
  padding: calc(var(--dome) + 150px) 0 calc(var(--dome) + 150px);
}
.find-us::before{ content:''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.35) 55%, rgba(0,0,0,.15) 100%); }
.find-us-inner{ position: relative; z-index: 1; }
.find-us-inner > *{ max-width: 620px; }
.find-us .eyebrow{ color: #fff; }
.find-us h2{ color: #fff; font-size: clamp(28px, 3vw, 42px); line-height: 1.3; }
.find-us p{ color: rgba(255,255,255,.9); font-size: 17px; margin-bottom: 24px; }

/* Founder */
.founder-photo{ position: relative; }
.founder-photo img, .founder-photo .ph-placeholder{ width: 100%; aspect-ratio: 4/5; object-fit: cover; max-height: 640px; }
.founder h2, .founder h3{ font-size: clamp(32px, 3vw, 44px); margin-bottom: 4px; }
.founder .role{ display: block; font-size: 12px; letter-spacing: .3em; text-transform: uppercase; color: var(--gray); margin-bottom: 26px; }
.founder blockquote{ font-style: italic; font-size: 21px; color: var(--ink); border-left: 1px solid var(--ink); padding-left: 22px; margin: 0 0 26px; }
.founder p{ color: var(--text); }
.founder .frame{ display: none; }
.founder-photo .ph-placeholder{ background: var(--beige); color: var(--gray); }

/* Testimonials */
.testimonials-section{ padding-bottom: calc(var(--dome) + 100px); }
.testimonials{ margin-top: 20px; gap: 48px; }
.testimonial-card blockquote{ font-style: italic; font-size: 19px; color: var(--ink); margin: 0 0 16px; line-height: 1.55; font-weight: 300; }
.testimonial-card cite{ font-style: normal; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--gray); }

/* Process */
.process-list{ display: grid; grid-template-columns: repeat(4,1fr); gap: 40px; margin-top: 30px; }
.process-step{ padding-top: 26px; border-top: 1px solid var(--line); }
.process-step .num{ display: block; font-size: 44px; font-weight: 300; color: var(--gold); line-height: 1; margin-bottom: 18px; }
.process-step h3, .process-step h4{ font-size: 20px; font-weight: 400; margin-bottom: 10px; }
.process-step p{ font-size: 14.5px; color: #555; }
.section--dark .process-step{ border-color: var(--line-on-dark); }
.section--dark .process-step p{ color: rgba(255,255,255,.6); }
@media (max-width: 900px){ .process-list{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px){ .process-list{ grid-template-columns: 1fr; } }

/* Meeting form */
.meeting{ padding-bottom: 120px; }
.meeting-media img{ width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.meeting-title{ font-size: clamp(24px, 2.3vw, 34px); font-weight: 300; line-height: 1.4; margin-bottom: 30px; }
.meeting-title strong{ font-weight: 500; }
.line-form{ display: grid; grid-template-columns: 1fr 1fr; gap: 22px 22px; }
.line-form .full{ grid-column: 1 / -1; }
.line-field input, .line-field textarea{
  width: 100%; border: 0; border-bottom: 1px solid #BDBDBD; background: transparent; padding: 12px 0;
  font-size: 15px; color: var(--ink); border-radius: 0; resize: vertical; transition: border-color var(--speed);
}
.line-field input::placeholder, .line-field textarea::placeholder{ color: #555; }
.line-field input:focus, .line-field textarea:focus{ outline: none; border-color: var(--ink); }
.line-consent{ display: flex; gap: 10px; align-items: flex-start; font-size: 12.5px; color: var(--gray); }
.line-consent input{ margin-top: 3px; accent-color: var(--ink); }
@media (max-width: 560px){ .line-form{ grid-template-columns: 1fr; } }

/* =========================================================
   8. LEGACY BLOCKS USED ON INNER PAGES (restyled)
   ========================================================= */
.intro{ text-align: center; max-width: 880px; margin: 0 auto; }
.intro h2{ font-size: clamp(28px, 3.4vw, 42px); }
.intro p{ font-size: 18px; color: var(--gray); }

.pillars{ margin-top: 64px; }
.pillar{ border-top: 1px solid var(--line); padding: 30px 4px 8px; text-align: left; }
.section--dark .pillar{ border-color: var(--line-on-dark); }
.pillar .num{ font-size: 15px; color: var(--gold); letter-spacing: .08em; }
.pillar h3{ font-size: 21px; margin: 12px 0 10px; }
.pillar p{ color: var(--gray); font-size: 15px; margin: 0; }
.section--dark .pillar p{ color: rgba(255,255,255,.62); }

.search-band{ background: var(--off); border: 1px solid var(--line); padding: 64px 48px; text-align: center; }
.search-band h2{ font-size: clamp(26px, 3vw, 36px); }
.search-band p{ color: var(--gray); max-width: 560px; margin: 0 auto 30px; }

.opp-grid{ margin-top: 60px; }
.opp-card{ position: relative; overflow: hidden; aspect-ratio: 4/5; background: var(--navy-2); isolation: isolate; }
.opp-card .opp-media{ position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform 1.1s var(--ease); }
.opp-card:hover .opp-media{ transform: scale(1.06); }
.opp-card .opp-media::after{ content:''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.75) 100%); }
.opp-card .opp-index{ position: absolute; top: 22px; left: 24px; z-index: 2; color: rgba(255,255,255,.8); font-size: 15px; letter-spacing: .1em; }
.opp-card .opp-status{
  position: absolute; top: 18px; right: 18px; z-index: 2; font-size: 12px; color: #fff;
  border: 1px solid rgba(255,255,255,.7); padding: 4px 12px; border-radius: 20px; backdrop-filter: blur(4px);
}
.opp-card .opp-body{ position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 26px; color: #fff; }
.opp-card .opp-cat{ font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: rgba(255,255,255,.8); margin-bottom: 8px; display:block; }
.opp-card h3{ color: #fff; font-size: 25px; margin-bottom: 10px; }
.opp-card .opp-text{ color: rgba(255,255,255,.85); font-size: 14.5px; max-height: 0; opacity: 0; overflow: hidden; transition: max-height .6s var(--ease), opacity .5s var(--ease), margin .5s var(--ease); }
.opp-card:hover .opp-text{ max-height: 140px; opacity: 1; margin-bottom: 14px; }
@media (hover: none){ .opp-card .opp-text{ max-height: 140px; opacity: 1; margin-bottom: 14px; } }
.opp-card .opp-cta{ display: inline-flex; align-items: center; gap: 10px; font-size: 14px; color: #fff; text-decoration: underline; text-underline-offset: 5px; }
.opp-card .opp-cta svg{ width: 12px; height: 12px; transition: transform var(--speed) var(--ease); }
.opp-card:hover .opp-cta svg{ transform: translateX(5px); }
.opp-note{ text-align: center; color: var(--gray); font-size: 14px; max-width: 620px; margin: 48px auto 0; }
.section--dark .opp-note{ color: rgba(255,255,255,.55); }

.coop-grid{ margin-top: 56px; }
.coop-card{ background: #fff; border: 1px solid var(--line); padding: 44px 36px; transition: border-color var(--speed), transform var(--speed) var(--ease); }
.coop-card:hover{ border-color: var(--ink); transform: translateY(-4px); }
.coop-card h3{ font-size: 21px; }
.coop-card p{ color: var(--gray); font-size: 15px; margin-bottom: 26px; }

.process{ margin-top: 60px; position: relative; }

.cta-band{ text-align: center; padding: 100px 0; }
.cta-band h2{ font-size: clamp(28px, 3.6vw, 44px); max-width: 780px; margin: 0 auto 34px; }
.cta-band .btn-row{ justify-content: center; }

/* =========================================================
   9. FOOTER
   ========================================================= */
.site-footer{
  background-color: var(--beige);
  background-image: repeating-linear-gradient(112deg, transparent 0 179px, rgba(18,18,18,.045) 179px 180px);
  color: var(--ink); padding: 70px 0 34px; font-size: 14.5px;
}
.footer-grid{
  display: grid; grid-template-columns: .8fr 1.2fr 1.2fr 1fr; gap: 40px; align-items: start;
  padding-top: 50px; border-top: 1px solid rgba(18,18,18,.3);
}
.footer-brand img{ height: 96px; width: auto; }
.footer-label{ margin-bottom: 4px; }
.site-footer p{ margin: 0 0 4px; }
.footer-tagline{ color: var(--gray); font-size: 13px; margin-top: 10px !important; }
.site-footer ul li{ margin-bottom: 4px; }
.site-footer a:hover{ opacity: .6; }
.footer-nav ul + ul{ margin-top: 14px; }
.footer-social{ justify-content: center; margin: 56px 0 18px; }
.footer-lang{ display: flex; flex-direction: column; align-items: center; gap: 0; font-size: 13.5px; }
.footer-lang a{ color: var(--gray); }
.footer-lang a.is-active{ color: var(--ink); }
.footer-bottom{ text-align: center; margin-top: 26px; font-size: 13px; letter-spacing: .04em; }
@media (max-width: 900px){ .footer-grid{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px){ .footer-grid{ grid-template-columns: 1fr; text-align: center; } .footer-brand img{ margin: 0 auto; } }

/* =========================================================
   10. FLOATING "CHAT WITH US"
   ========================================================= */
.wa-float{
  position: fixed; right: 22px; bottom: 22px; z-index: 90; display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 16px; border-radius: 30px; font-size: 14px; color: var(--ink);
  background: rgba(255,255,255,.85); border: 1px solid rgba(18,18,18,.18);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  box-shadow: 0 6px 22px rgba(0,0,0,.08); transition: background var(--speed), color var(--speed), transform var(--speed) var(--ease);
}
.wa-float:hover{ background: var(--ink); color: #fff; transform: translateY(-3px); }
.wa-float svg{ width: 16px; height: 16px; }

/* =========================================================
   11. FORMS
   ========================================================= */
.form-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.form-grid .full{ grid-column: 1 / -1; }
.field{ position: relative; }
.field label{ display: block; font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--gray); margin-bottom: 9px; }
.field input, .field select, .field textarea{
  width: 100%; border: 1px solid var(--line); background: #fff; padding: 14px 16px; border-radius: var(--radius);
  color: var(--ink); transition: border-color var(--speed);
}
.field input:focus, .field select:focus, .field textarea:focus{ outline: none; border-color: var(--gold); }
.field textarea{ min-height: 130px; resize: vertical; }
.field.checkbox{ display: flex; align-items: flex-start; gap: 10px; }
.field.checkbox input{ width: auto; margin-top: 4px; }
.field.checkbox label{ text-transform: none; letter-spacing: 0; font-size: 13.5px; }
.form-note{ font-size: 12.5px; color: var(--gray); margin-top: 6px; }
.form-msg{ padding: 16px 20px; border-radius: var(--radius); font-size: 14px; margin-bottom: 24px; display:none; }
.form-msg.is-success{ display:block; background: #EEF6EE; color: #2F6B3A; border: 1px solid #CFE7D2; }
.form-msg.is-error{ display:block; background: #FBECEC; color: #A3312A; border: 1px solid #F3CFCE; }

/* Steps wizard */
.steps-wizard{ max-width: 720px; margin: 0 auto; }
.steps-progress{ display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 44px; }
.steps-progress .dot{ width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--line); display: flex; align-items: center; justify-content: center; font-size: 12.5px; color: var(--gray); }
.steps-progress .bar{ width: 46px; height: 1px; background: var(--line); }
.steps-progress .dot.is-active{ border-color: var(--gold); color: var(--gold); background: rgba(173,138,84,.08); }
.steps-progress .dot.is-done{ border-color: var(--gold); background: var(--gold); color: #fff; }
.step-pane{ display: none; }
.step-pane.is-active{ display: block; animation: fadeIn .5s var(--ease); }
@keyframes fadeIn{ from{ opacity:0; transform: translateY(10px);} to{opacity:1; transform: translateY(0);} }
.step-actions{ display: flex; justify-content: space-between; margin-top: 34px; }
.option-grid{ display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-bottom: 10px; }
.option-pill{ border: 1px solid var(--line); padding: 14px 10px; text-align: center; font-size: 13px; border-radius: var(--radius); transition: all var(--speed); }
.option-pill input{ display: none; }
.option-pill.is-selected, .option-pill:has(input:checked){ border-color: var(--gold); background: rgba(173,138,84,.08); color: var(--gold-dark); }
@media (max-width: 640px){ .form-grid, .option-grid{ grid-template-columns: 1fr; } }

/* Modal (quick "what are you looking for" form) */
.palma-modal{ position: fixed; inset: 0; z-index: 200; display: none; }
.palma-modal.is-open{ display: block; }
.palma-modal .overlay{ position: absolute; inset: 0; background: rgba(15,20,26,.72); }
.palma-modal .modal-box{
  position: relative; z-index: 1; max-width: 780px; margin: 6vh auto; background: #fff; border-radius: var(--radius);
  padding: 56px; max-height: 88vh; overflow-y: auto;
}
.palma-modal .modal-close{ position: absolute; top: 22px; right: 22px; width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 50%; display:flex; align-items:center; justify-content:center; background: none; }
@media (max-width: 640px){ .palma-modal .modal-box{ padding: 32px 22px; margin: 0; max-height: 100vh; height: 100vh; border-radius: 0; } }

/* =========================================================
   17. PROPERTY / OPPORTUNITY ARCHIVE & FILTERS
   ========================================================= */
.filters-bar{ display: flex; flex-wrap: wrap; gap: 14px; padding: 28px; background: #F2EEE7; border-radius: var(--radius); margin-bottom: 50px; }
.view-toggle{ display: inline-flex; gap: 8px; margin-bottom: 30px; }
.view-toggle button{ background: #fff; border: 1px solid var(--line); padding: 10px 22px; font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; border-radius: 20px; color: var(--gray); }
.view-toggle button.is-active{ background: var(--navy); border-color: var(--navy); color: #fff; }
#palma-view-map .leaflet-popup-content{  font-size: 13px; }
.filters-bar select,
.filters-bar input[type="search"]{ border: 1px solid var(--line); background: #fff; padding: 12px 14px; font-size: 13px; border-radius: var(--radius); min-width: 170px; }
.filters-bar input[type="search"]{ color: var(--ink); }
.filters-bar input[type="search"]:focus{ outline: none; border-color: var(--gold); }
.filters-bar .btn{ margin-left: auto; }
.listing-grid{ display: grid; grid-template-columns: repeat(3,1fr); gap: 34px; }
@media (max-width: 1024px){ .listing-grid{ grid-template-columns: repeat(2,1fr); } }
@media (max-width: 680px){ .listing-grid{ grid-template-columns: 1fr; } .filters-bar .btn{ margin-left: 0; width: 100%; } }

/* paginate_links() output — unstyled it renders as a cramped row of raw links. */
.pagination .page-numbers{
  display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 42px;
  padding: 0 12px; margin: 0 4px; border: 1px solid var(--line); border-radius: var(--radius);
  font-size: 13px; color: var(--navy); transition: background var(--speed), color var(--speed), border-color var(--speed);
}
.pagination a.page-numbers:hover{ background: var(--navy); border-color: var(--navy); color: #fff; }
.pagination .page-numbers.current{ background: var(--gold); border-color: var(--gold); color: #fff; }
.pagination .page-numbers.dots{ border-color: transparent; }

.listing-card{ background: #fff; border: 1px solid var(--line); transition: box-shadow var(--speed), transform var(--speed) var(--ease); }
.listing-card:hover{ box-shadow: 0 26px 50px rgba(15,20,26,.1); transform: translateY(-4px); }
/* The thumb is an <a>; without display:block it stays inline, where
   aspect-ratio does not apply — the card then collapses to the image height
   and its body overflows on top of whatever follows. */
.listing-card .thumb{ display: block; position: relative; aspect-ratio: 4/3; overflow: hidden; }
.listing-card .thumb img, .listing-card .thumb .ph-placeholder{ width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.listing-card:hover .thumb img{ transform: scale(1.06); }
.listing-card .cat-tag{ position: absolute; top: 16px; left: 16px; background: rgba(19,27,36,.86); color: #fff; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; padding: 6px 12px; }
.listing-card .status-tag{ position: absolute; top: 16px; right: 16px; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; padding: 6px 12px; border-radius: 20px; color:#fff; }
.status-active{ background: #3E7A4B; }
.status-reserved{ background: #B08A2E; }
.status-sold{ background: #6E7580; }
.status-inactive{ background: #9CA3AC; }
.listing-card .body{ padding: 26px; }
.listing-card .loc{ font-size: 12px; letter-spacing: .06em; color: var(--gold-dark); text-transform: uppercase; margin-bottom: 8px; display:block; }
.listing-card h3{ font-size: 21px; margin-bottom: 10px; }
.listing-card .meta{ display: flex; gap: 16px; font-size: 12.5px; color: var(--gray); margin-bottom: 14px; }
.listing-card p.desc{ color: var(--gray); font-size: 14.5px; margin-bottom: 18px; }
.listing-card .price-note{ font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--gold-dark); margin-bottom: 16px; display:block; }
/* Per-listing price (brief-revised: agent chooses fixed/discount/negotiable/inquiry per listing) */
.price-tag{ text-transform: none; letter-spacing: normal; font-weight: 600; font-size: 1.15em; }
.price-original{ text-decoration: line-through; opacity: .55; font-weight: 400; text-transform: none; letter-spacing: normal; font-size: .9em; margin-right: 4px; }
.price-discount{ color: var(--gold-dark); }
.opp-price{ display: block; color: #fff; margin-bottom: 12px; }
.opp-card .opp-price .price-original{ color: rgba(255,255,255,.55); }
.opp-card .opp-price .price-tag{ color: #fff; }
.ph-placeholder{ background: linear-gradient(135deg, #1E2933 0%, #131B24 100%); display:flex; align-items:center; justify-content:center; color: rgba(255,255,255,.35); font-size: 11px; letter-spacing:.14em; text-transform:uppercase; text-align:center; padding: 10px; }

/* =========================================================
   18. SINGLE PROPERTY / OPPORTUNITY
   ========================================================= */
.single-gallery{ display: grid; grid-template-columns: 2fr 1fr; gap: 12px; margin-bottom: 0; }
.single-gallery .main-img{ aspect-ratio: 16/10; overflow: hidden; position: relative; }
.single-gallery .main-img img, .single-gallery .main-img .ph-placeholder{ width:100%; height:100%; object-fit:cover; }
.single-gallery .side-imgs{ display: grid; grid-template-rows: 1fr 1fr; gap: 12px; }
.single-gallery .side-imgs > div{ overflow: hidden; position: relative; }
.single-gallery .side-imgs img, .single-gallery .side-imgs .ph-placeholder{ width:100%; height:100%; object-fit:cover; }
.single-gallery [data-lightbox-open]{ cursor: pointer; }
.single-gallery [data-lightbox-open]:hover img{ transform: scale(1.04); }
.single-gallery img{ transition: transform .6s var(--ease); }
.gallery-more{
  position: absolute; inset: 0; background: rgba(15,20,26,.55); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; letter-spacing: .08em; text-transform: uppercase;
}
@media (max-width: 780px){ .single-gallery{ grid-template-columns: 1fr; } .single-gallery .side-imgs{ grid-template-columns: 1fr 1fr; grid-template-rows: auto; } }

/* Lightbox */
.lightbox{ position: fixed; inset: 0; z-index: 300; display: none; background: rgba(10,14,18,.97); }
.lightbox.is-open{ display: flex; flex-direction: column; }
.lightbox-top{ display: flex; justify-content: space-between; align-items: center; padding: 20px 24px; color: rgba(255,255,255,.7); font-size: 12.5px; letter-spacing: .1em; text-transform: uppercase; }
.lightbox-close{ background: none; border: 1px solid rgba(255,255,255,.3); color: #fff; width: 38px; height: 38px; border-radius: 50%; font-size: 18px; line-height:1; }
.lightbox-stage{ flex: 1; display: flex; align-items: center; justify-content: center; position: relative; padding: 0 76px; min-height: 0; }
.lightbox-stage img{ max-width: 100%; max-height: 70vh; object-fit: contain; }
.lightbox-nav{ position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.25); color: #fff; width: 46px; height: 46px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.lightbox-nav svg{ width: 16px; height: 16px; }
.lightbox-prev{ left: 16px; }
.lightbox-next{ right: 16px; }
.lightbox-thumbs{ display: flex; gap: 10px; padding: 18px 24px; overflow-x: auto; }
.lightbox-thumbs img{ width: 78px; height: 56px; object-fit: cover; opacity: .45; cursor: pointer; border-radius: 2px; transition: opacity var(--speed); flex-shrink: 0; }
.lightbox-thumbs img.is-active{ opacity: 1; outline: 2px solid var(--gold); outline-offset: 2px; }
@media (max-width: 640px){ .lightbox-stage{ padding: 0 50px; } .lightbox-nav{ width: 38px; height: 38px; } }

.single-wrap{ display: grid; grid-template-columns: 1fr 380px; gap: 70px; margin-top: 60px; align-items: flex-start; }
.single-main .ref{ color: var(--gold-dark); font-size: 12.5px; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 12px; display:block; }
.single-main h1{ font-size: clamp(30px, 4vw, 44px); margin-bottom: 20px; }
.spec-grid{ display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; padding: 30px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin: 34px 0; }
.spec-grid .spec-item .label{ font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--gray); margin-bottom: 6px; }
.spec-grid .spec-item .value{  font-size: 22px; color: var(--navy); }
.single-main h2, .single-main h3{ margin-top: 42px; }
.single-main .why-box{ background: #F2EEE7; padding: 34px; border-left: 3px solid var(--gold); margin-top: 30px; }
.single-sidebar{ position: sticky; top: 120px; background: #fff; border: 1px solid var(--line); padding: 36px; }
.single-sidebar .price-note{ display:block; font-size: 12px; letter-spacing:.1em; text-transform:uppercase; color: var(--gold-dark); margin-bottom: 18px; }
.single-sidebar .btn{ width: 100%; margin-bottom: 12px; }
.single-sidebar .agent{ display:flex; gap:14px; align-items:center; margin-top: 26px; padding-top: 26px; border-top:1px solid var(--line); }
.single-sidebar .agent img{ width: 54px; height:54px; border-radius:50%; object-fit:cover; }
.single-sidebar .agent .name{ font-weight:500; font-size:14px; }
.single-sidebar .agent .role{ font-size:12px; color:var(--gray); }
@media (max-width: 980px){ .single-wrap{ grid-template-columns: 1fr; } .single-sidebar{ position: static; } }
@media (max-width: 640px){ .spec-grid{ grid-template-columns: 1fr 1fr; } }

.share-row{ display: flex; align-items: center; gap: 12px; margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--line); }
.share-label{ font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--gray); }
.share-btn{
  display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px;
  padding: 9px 16px; border: 1px solid var(--line); border-radius: 20px; color: var(--navy);
  transition: background var(--speed), color var(--speed), border-color var(--speed);
}
.share-btn:hover{ background: #25D366; border-color: #25D366; color: #fff; }
.share-btn svg{ width: 15px; height: 15px; }

/* Sticky enquiry bar — phones/tablets only, where the sidebar CTA falls
   below the entire description and scrolls out of reach. */
.sticky-cta{
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 120;
  display: none; align-items: center; justify-content: space-between; gap: 14px;
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
  background: rgba(19,27,36,.97); backdrop-filter: saturate(160%) blur(8px);
  border-top: 1px solid var(--line-on-dark);
  transform: translateY(100%); transition: transform .45s var(--ease);
}
.sticky-cta.is-visible{ transform: translateY(0); }
.sticky-cta-price{ color: #fff; font-size: 14px; }
.sticky-cta-price .price-tag{ color: #fff; }
.sticky-cta-price .price-original{ color: rgba(255,255,255,.5); }
.sticky-cta .btn{ flex-shrink: 0; }
@media (max-width: 980px){ .sticky-cta{ display: flex; } }
/* Keep the floating WhatsApp button and the cookie notice clear of the bar. */
body.has-sticky-cta .wa-float{ bottom: 88px; }
@media (max-width: 640px){ body.has-sticky-cta .cookie-banner{ bottom: 80px; } }
@media (prefers-reduced-motion: reduce){ .sticky-cta{ transition: none; } }

.related-strip{ margin-top: 90px; padding-top: 70px; border-top: 1px solid var(--line); }

/* =========================================================
   19. ABOUT PAGE EXTRAS
   ========================================================= */
.principles-grid{ margin-top: 20px; }
.principle{ text-align: center; padding: 30px 16px; }
.principle h4{ font-size: 15px; letter-spacing: .1em; text-transform: uppercase; color: var(--navy); margin-bottom: 12px; }
.principle p{ font-size: 13.5px; color: var(--gray); }

/* =========================================================
   20. INSIGHTS / BLOG
   ========================================================= */
.insight-card .thumb{ aspect-ratio: 3/2; }
.insight-card .meta{ font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--gold-dark); margin-bottom: 10px; }
.single-article{ max-width: 780px; margin: 0 auto; }
.single-article .content{ font-size: 17px; color: #333; }
.single-article .content p{ margin-bottom: 1.4em; }
.single-article .content h2{ margin-top: 2em; font-size: 28px; }
.article-disclaimer{ margin-top: 60px; padding: 22px 26px; background: #F2EEE7; font-size: 13px; color: var(--gray); border-left: 3px solid var(--gold); }

/* =========================================================
   21. LEGAL PAGES
   ========================================================= */
.legal-content{ max-width: 820px; margin: 0 auto; }
.legal-content h2{ font-size: 24px; margin-top: 2.2em; }
.legal-content p, .legal-content li{ color: #3a4048; font-size: 15.5px; }
.legal-content .updated{ color: var(--gray); font-size: 13px; margin-bottom: 40px; display:block; }
.legal-placeholder{ background: #FBECEC; border: 1px dashed #D9A6A3; color: #8B332E; padding: 16px 20px; font-size: 13px; margin: 18px 0; }

/* =========================================================
   22. 404
   ========================================================= */
.error-404{ text-align:center; padding: 180px 0 140px; }
.error-404 .code{  font-size: 120px; color: var(--gold); line-height:1; }

/* =========================================================
   23. MISC
   ========================================================= */
/* Cookie consent banner */
/* Anchored bottom-LEFT so it never sits on top of the bottom-right WhatsApp
   button; on phones it spans the width, so the button is lifted above it
   instead (body.cookie-open, set from main.js). */
.cookie-banner{
  position: fixed; left: 20px; bottom: 20px; right: auto; z-index: 250; width: 360px; max-width: calc(100vw - 40px);
  background: var(--navy); color: rgba(255,255,255,.85); padding: 20px 22px; border-radius: var(--radius);
  box-shadow: 0 20px 50px rgba(0,0,0,.3); display: none;
}
.cookie-banner.is-visible{ display: block; }
.cookie-banner p{ font-size: 13px; margin: 0 0 14px; line-height: 1.5; }
.cookie-banner a{ color: var(--gold-light); text-decoration: underline; }
.cookie-banner-actions{ display: flex; gap: 10px; }
.cookie-banner .btn{ color: #fff; flex: 1; }
.cookie-banner .btn-solid-gold{ color: var(--navy); }
@media (max-width: 640px){
  .cookie-banner{ right: 12px; left: 12px; bottom: 12px; width: auto; padding: 16px; }
  body.cookie-open .wa-float{ bottom: 200px; }
}

/* Safety net: every palma_icon() SVG carries width/height="1em" inline,
   but this guarantees correct inline sizing/alignment even if that ever
   gets stripped (e.g. pasted elsewhere without the helper). */
.icon{ width: 1em; height: 1em; display: inline-block; vertical-align: -0.125em; flex-shrink: 0; }

::selection{ background: var(--gold); color: #fff; }
.skip-link{ position:absolute; left:-9999px; top:0; background:#fff; padding:12px 18px; z-index: 999; }
.skip-link:focus{ left: 16px; top: 16px; }

/* Outline buttons on dark bands read white. */
.section--dark .btn{ color: #fff; }
.section--dark .btn:hover{ background: #fff; color: var(--ink); border-color: #fff; }
.section--dark .btn-solid, .section--dark .btn-solid-gold{ background: #fff; color: var(--ink); border-color: #fff; }
.section--dark .link-underline{ color: #fff; }


/* =========================================================
   12. INNER PAGES — AUREA STYLE (v2.0)
   ========================================================= */
/* Archive grid of tall cards */
.tile-grid{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.tile-card{ position: relative; display: block; aspect-ratio: 3 / 4; overflow: hidden; color: #fff; background: var(--navy-2); }
.tile-card .slide-title{ font-size: 22px; }
@media (max-width: 1100px){ .tile-grid{ grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 800px){ .tile-grid{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px){ .tile-grid{ grid-template-columns: 1fr; } }

/* Filters: quiet underlined selects instead of a filled bar */
.filters-bar{ background: transparent; padding: 0; gap: 18px 26px; align-items: flex-end; margin-bottom: 44px; }
.filters-bar select, .filters-bar input[type="search"]{
  border: 0; border-bottom: 1px solid #BDBDBD; border-radius: 0; background: transparent;
  padding: 10px 2px; font-size: 14.5px; color: var(--ink); min-width: 160px;
}
.filters-bar select:focus, .filters-bar input[type="search"]:focus{ outline: none; border-color: var(--ink); }
.view-toggle button{ border-radius: 0; background: transparent; font-size: 13px; letter-spacing: .12em; }
.view-toggle button.is-active{ background: var(--ink); border-color: var(--ink); color: #fff; }
.pagination{ margin-top: 50px; text-align: center; }
.pagination .page-numbers{ border-radius: 0; font-size: 14px; color: var(--ink); }
.pagination a.page-numbers:hover, .pagination .page-numbers.current{ background: var(--ink); border-color: var(--ink); color: #fff; }

/* Single listing: full-screen photo */
.listing-hero{ position: relative; height: 100vh; min-height: 520px; overflow: hidden; background: var(--navy); }
@supports (height: 100svh){ .listing-hero{ height: 100svh; } }
.listing-hero-media{ position: absolute; inset: 0; background-size: cover; background-position: center; view-transition-name: palma-listing-hero; }
.listing-hero-media::after{ content:''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,.15) 100%); }
.listing-hero .hero-scroll{ color: #fff; }
@media (prefers-reduced-motion: reduce){ .listing-hero-media{ view-transition-name: none; } }

.listing-details{ text-align: center; padding-bottom: calc(var(--dome) + 80px); }
.listing-details .breadcrumbs{ font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--gray); margin-bottom: 26px; }
.listing-details .breadcrumbs a:hover{ color: var(--ink); }
.listing-title{ font-size: clamp(34px, 4vw, 56px); margin-bottom: 50px; }
.spec-grid--center{
  grid-template-columns: repeat(3, 1fr); gap: 44px 30px; border: 0; padding: 0; margin: 0 auto; max-width: 1000px;
}
.spec-grid--center .spec-item .label{ font-size: 13px; letter-spacing: .02em; text-transform: none; color: var(--gray); margin-bottom: 4px; }
.spec-grid--center .spec-item .value{ font-size: 19px; color: var(--ink); }
.spec-grid--center .price-tag{ font-weight: 400; font-size: 1em; }
@media (max-width: 640px){ .spec-grid--center{ grid-template-columns: 1fr 1fr; gap: 30px 16px; } }

/* One-photo slider */
.photo-section{ padding-bottom: calc(var(--dome) + 90px); }
.photo-slider{ position: relative; max-width: 1080px; margin: 0 auto; padding: 0 56px; }
.photo-viewport{ overflow: hidden; }
.photo-track{ display: flex; transition: transform .8s var(--ease); }
.photo-slide{ flex: 0 0 100%; aspect-ratio: 16 / 10; overflow: hidden; cursor: zoom-in; margin: 0; }
.photo-slide img, .photo-slide .ph-placeholder{ width: 100%; height: 100%; object-fit: cover; }
.photo-count{ text-align: center; font-size: 13px; letter-spacing: .12em; color: var(--gray); margin-top: 14px; }
.listing-video{ max-width: 968px; margin: 24px auto 0; aspect-ratio: 16 / 9; overflow: hidden; }
.listing-video video, .listing-video iframe{ width: 100%; height: 100%; object-fit: cover; border: 0; }
@media (max-width: 640px){ .photo-slider{ padding: 0 34px; } }

/* Description column */
.listing-text{ max-width: 860px; }
.listing-text h3{ font-size: 24px; margin: 44px 0 12px; }
.listing-text h3:first-child{ margin-top: 0; }
.listing-text p, .listing-text .content{ font-size: 16.5px; color: var(--text); }
.listing-text .lead{ font-size: 20px; color: var(--ink); line-height: 1.5; }
.listing-text .why-box{ background: var(--off); border-left: 1px solid var(--ink); padding: 30px 34px; margin-top: 40px; }
.listing-text .why-box h3{ margin-top: 0; }
.listing-text .why-box p{ margin: 0; }
.listing-map{ margin-top: 14px; aspect-ratio: 16 / 9; overflow: hidden; }
.listing-map > *{ height: 100%; }

/* Enquiry block */
.interest-direct{ display: flex; flex-wrap: wrap; gap: 22px; margin-top: 30px; font-size: 14.5px; color: var(--ink); }
.interest-direct a{ display: inline-flex; align-items: center; gap: 8px; }
.interest-direct a:hover{ opacity: .6; }
.interest .share-row{ border-top: 0; padding-top: 0; margin-top: 14px; }
.interest .share-btn{ border-radius: 0; }
.interest .form-note{ margin-top: 14px; }
.related-section{ padding-top: calc(var(--dome) + 40px); overflow: hidden; }
.related-strip{ margin: 0; padding: 0; border: 0; }

/* Contact page */
.contact-info{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; text-align: center; margin-bottom: 90px; }
.contact-col{ display: flex; flex-direction: column; align-items: center; gap: 6px; }
.contact-icon{ color: var(--ink); margin-bottom: 8px; }
.contact-main{ font-size: 20px; color: var(--ink); line-height: 1.35; }
.contact-note{ font-size: 13.5px; color: var(--gray); }
.contact-note a{ text-decoration: underline; text-underline-offset: 3px; }
.contact-form-wrap{ max-width: 720px; margin: 0 auto; }
.contact-form-wrap h2{ text-align: center; font-size: clamp(26px, 2.4vw, 34px); margin-bottom: 26px; }
.contact-form-wrap .form-note{ margin-top: 22px; }
.line-field select{
  width: 100%; border: 0; border-bottom: 1px solid #BDBDBD; padding: 12px 0;
  font-size: 15px; color: #555; border-radius: 0; appearance: none; -webkit-appearance: none;
  background-color: transparent;
  background-image: linear-gradient(45deg, transparent 50%, #555 50%), linear-gradient(135deg, #555 50%, transparent 50%);
  background-position: calc(100% - 12px) 55%, calc(100% - 7px) 55%; background-size: 5px 5px; background-repeat: no-repeat;
}
.line-field select:focus{ outline: none; border-color: var(--ink); }
.contact-map{ height: 460px; }
.contact-map iframe{ display: block; }
@media (max-width: 760px){ .contact-info{ grid-template-columns: 1fr; gap: 40px; margin-bottom: 60px; } }

/* About page */
.about-statement{ font-size: clamp(24px, 2.3vw, 32px); color: var(--ink); line-height: 1.35; margin-bottom: 26px; }
.mission-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 60px; max-width: 1040px; margin: 0 auto 100px; }
.mission p{ font-size: clamp(19px, 1.7vw, 23px); color: var(--ink); line-height: 1.5; }
.principles-head{ margin-bottom: 36px; }
.principle{ padding: 26px 10px; border-top: 1px solid var(--line); text-align: left; }
.principle h4{ font-size: 20px; letter-spacing: 0; text-transform: none; font-weight: 400; }
.principle p{ font-size: 14.5px; color: #555; }
.founder-quote{ font-size: clamp(22px, 2.2vw, 30px); color: var(--ink); line-height: 1.4; font-weight: 400; margin-bottom: 26px; }
.founder-sign{ font-size: 20px; color: var(--ink); margin-top: 26px; }
.founder-sign span{ display: block; font-size: 12px; letter-spacing: .3em; text-transform: uppercase; color: var(--gray); margin-top: 4px; }
.cta-band.section--lines{ padding-bottom: 120px; }
@media (max-width: 760px){ .mission-grid{ grid-template-columns: 1fr; gap: 30px; margin-bottom: 60px; } }

/* Short page hero (legal pages, blog, plain pages). */
.page-hero--short{ min-height: 50vh; }

/* A dark photo band that also rises over the section before it. */
.section--dark.dome-top{
  background-color: var(--navy);
  background-image: linear-gradient(rgba(0,0,0,.62), rgba(0,0,0,.62)), url('assets/img/hero-durres-v4-poster.jpg');
  background-size: cover; background-position: center;
}

/* Every form field is a single underline, as on the reference site. */
.field label{ font-size: 12px; letter-spacing: .14em; color: var(--gray); margin-bottom: 4px; }
.field input, .field select, .field textarea{
  border: 0; border-bottom: 1px solid #BDBDBD; border-radius: 0; background: transparent;
  padding: 10px 0; color: var(--ink); font-size: 15px;
}
.field input[type="file"]{ border-bottom: 0; padding: 6px 0; }
.field input:focus, .field select:focus, .field textarea:focus{ border-color: var(--ink); }
.field textarea{ min-height: 90px; }
.field.checkbox input{ accent-color: var(--ink); }
.section--dark .field label{ color: rgba(255,255,255,.7); }
.section--dark .field input, .section--dark .field select, .section--dark .field textarea{ border-color: rgba(255,255,255,.4); color: #fff; }
.section--dark .field select option{ color: var(--ink); }
.section--dark .field input:focus, .section--dark .field select:focus, .section--dark .field textarea:focus{ border-color: #fff; }
.option-pill{ border-radius: 0; }
.option-pill.is-selected, .option-pill:has(input:checked){ border-color: var(--ink); background: var(--off); color: var(--ink); }
.steps-progress .dot.is-active{ border-color: var(--ink); color: var(--ink); background: var(--off); }
.steps-progress .dot.is-done{ border-color: var(--ink); background: var(--ink); color: #fff; }
.palma-modal .modal-box{ border-radius: 0; }

/* Placeholders read as a soft panel, not a dark hole. */
.ph-placeholder{ background: #EDE7E1; color: var(--gray); }


/* =========================================================
   13. SCROLL MOTION (v2.0)
   ========================================================= */
/* Hero text moves on its own layer while scrolling (set from main.js). */
.hero-content, .listing-hero-media{ will-change: transform; }

/* Photos slightly larger than their frame so the parallax never shows an edge. */
.parallax-wrap{ overflow: hidden; }
.parallax-wrap img{ transform: scale(1.14); will-change: transform; }

/* Photos open from a band in the middle instead of just fading in. */
.intro-media.reveal, .meeting-media.reveal, .founder-photo.reveal{
  opacity: 1; transform: none;
  clip-path: inset(14% 8% 14% 8%);
  transition: clip-path 1.5s var(--ease);
}
.intro-media.reveal.is-visible, .meeting-media.reveal.is-visible, .founder-photo.reveal.is-visible{ clip-path: inset(0 0 0 0); }

/* Service icons draw themselves in. */
.service.reveal .service-icon svg *{ stroke-dasharray: 120; stroke-dashoffset: 120; transition: stroke-dashoffset 1.6s var(--ease) .25s; }
.service.reveal.is-visible .service-icon svg *{ stroke-dashoffset: 0; }

/* Carousel: all cards start stacked in the middle, then fan out. */
.carousel.is-stacked .slide-card{ transform: translate(-50%, -50%) scale(.86); }
.carousel.is-stacked .slide-card.is-side{ opacity: 0; }

/* Archive tiles rise one after another (delays come from main.js). */
.tile-card.reveal{ transform: translateY(40px); }
.tile-card.reveal.is-visible{ transform: none; }


@media (prefers-reduced-motion: reduce){
  .intro-media.reveal, .meeting-media.reveal, .founder-photo.reveal{ clip-path: none; transition: none; }
  .service.reveal .service-icon svg *{ stroke-dasharray: none; stroke-dashoffset: 0; transition: none; }
  .carousel.is-stacked .slide-card{ transform: translate(-50%, -50%); }
  .parallax-wrap img{ transform: none; }
}


/* =========================================================
   14. BLOG — "LEXONI RRUGËTIMIN TONË" (v2.0)
   ========================================================= */
.journal-section{ padding-bottom: calc(var(--dome) + 70px); }
.journal-grid{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px 28px; margin-top: 10px; }
.journal-grid--3{ grid-template-columns: repeat(3, 1fr); }
.journal-thumb{ display: block; aspect-ratio: 8 / 7; overflow: hidden; margin-bottom: 14px; background: #EDE7E1; }
.journal-thumb img, .journal-thumb .ph-placeholder{ width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--ease); }
.journal-card:hover .journal-thumb img{ transform: scale(1.05); }
.journal-meta{ display: flex; gap: 8px; font-size: 12.5px; color: var(--gray); margin-bottom: 8px; }
.journal-meta .sep{ opacity: .5; }
.journal-title{ font-size: clamp(18px, 1.5vw, 21px); line-height: 1.3; margin-bottom: 14px; }
.journal-title a:hover{ opacity: .65; }
.journal-card .link-underline{ font-size: 13px; }
.journal-all{ margin-top: 44px; }
@media (max-width: 1024px){ .journal-grid, .journal-grid--3{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px){ .journal-grid, .journal-grid--3{ grid-template-columns: 1fr; } }

/* =========================================================
   15. BACKGROUND VIDEOS (v2.0)
   ========================================================= */
.bg-video{ display: block; width: 100%; height: 100%; object-fit: cover; background: #EDE7E1; }
.intro-media .bg-video, .meeting-media .bg-video{ aspect-ratio: 1 / 1; height: auto; }
.parallax-wrap video{ transform: scale(1.14); will-change: transform; }

/* Photo bands: video under the dark overlay, text above it. */
.find-us .bg-video, .page-hero--video .bg-video{ position: absolute; inset: 0; z-index: 0; }
.find-us::before, .page-hero::before{ z-index: 1; }
.find-us-inner{ z-index: 2; }
.page-hero .container{ z-index: 3; }
.page-hero::after{ z-index: 2; }
.page-hero--video::before{ background: linear-gradient(180deg, rgba(0,0,0,.42), rgba(0,0,0,.5)); }

/* Cookie notice in the new style: a quiet white card. */
.cookie-banner{
  background: #fff; color: var(--text); border: 1px solid var(--line);
  box-shadow: 0 16px 40px rgba(0,0,0,.1); border-radius: 0;
}
.cookie-banner a{ color: var(--ink); }
.cookie-banner .btn{ color: var(--ink); }
.cookie-banner .btn:hover{ color: #fff; }
.cookie-banner .btn-solid-gold{ color: #fff; }
.cookie-banner .btn-solid-gold:hover{ color: var(--ink); }

/* The hero video has its own slow camera move; adding the CSS zoom on top of
   it (60 fps scaling over 25 fps footage) read as a jitter. Only the still
   poster/image keeps the zoom. */
.hero-media video{ transform: none; animation: none; }

/* The hero footage is bright (white shirt, hazy sea), so the text needs a touch
   more shade behind it to stay readable. */
.hero-media::after{ background: linear-gradient(180deg, rgba(0,0,0,.38) 0%, rgba(0,0,0,.46) 55%, rgba(0,0,0,.4) 100%); }

/* 404 page */
.error-404{ text-align: center; padding: 200px 0 150px; }
.error-404 .code{ font-size: clamp(110px, 16vw, 200px); font-weight: 300; color: var(--ink); line-height: 1; margin-bottom: 10px; }
.error-404 h1{ font-size: clamp(26px, 2.6vw, 36px); }
.error-text{ color: var(--gray); max-width: 480px; margin: 0 auto 34px; }
.error-actions{ display: flex; gap: 28px; justify-content: center; align-items: center; flex-wrap: wrap; }

/* Single article */
.article-hero{ min-height: 62vh; }
.article-meta{ font-size: 14px !important; letter-spacing: .04em; margin-top: 6px !important; }
.article-meta span{ opacity: .5; margin: 0 6px; }
.single-article{ max-width: 780px; }
.single-article .content{ font-size: 17.5px; line-height: 1.75; color: var(--text); }
.single-article .content h2{ font-size: clamp(22px, 2vw, 28px); margin: 1.8em 0 .5em; }
.single-article .content ul{ list-style: disc; padding-left: 1.3em; margin: 0 0 1.2em; }
.single-article .content li{ margin-bottom: .4em; }
.article-disclaimer{ background: var(--off); border-left: 1px solid var(--ink); }
.article-actions{ margin-top: 40px; align-items: center; gap: 28px; }

/* Sticky enquiry bar (phones): white, like the rest of the new design. */
.sticky-cta{ background: rgba(255,255,255,.96); border-top: 1px solid var(--line); box-shadow: 0 -8px 30px rgba(0,0,0,.06); }
.sticky-cta-price, .sticky-cta-price .price-tag{ color: var(--ink); }
.sticky-cta-price .price-original{ color: var(--gray-light); }

/* =========================================================
   v3.0 — AUREA TYPE SCALE + WEBMASTER PACKAGE 2026
   Font sizes, weights, line heights and letter spacing measured on
   aureaestates.com (desktop 1440 px and mobile). AUREA sets everything in
   "The Seasons": weights up to 600 use its regular cut, 700+ its bold cut.
   The same two weights are used here (400 / 700), so the licensed font can
   drop in unchanged; until then Fraunces renders them.
   ========================================================= */
:root{
  --serif: 'The Seasons', 'the-seasons', 'Fraunces', Georgia, 'Times New Roman', serif;
  --text: #333333;
}
body{ font-weight: 400; font-size: 16px; line-height: 1.6; color: var(--text); }
strong, b{ font-weight: 700; }
h1, h2, h3, h4, h5{ font-weight: 700; }

/* Overline / section label — "AT AUREA ESTATES", "WHAT WE DO" */
.eyebrow, h2.eyebrow{
  font-size: 14px; font-weight: 400; letter-spacing: 5px; line-height: 1.3;
  text-transform: uppercase; color: var(--ink); margin: 0 0 30px;
}

/* Links styled as text buttons */
.link-underline{ font-size: 14px; font-weight: 400; letter-spacing: 2px; }
.link-strong{ font-size: 16px; font-weight: 700; letter-spacing: 2px; }

/* HERO — photo, no video */
.hero-media img{ animation: heroZoom 20s ease-out forwards; }
.hero-media::after{ background: linear-gradient(180deg, rgba(0,0,0,.42) 0%, rgba(0,0,0,.38) 45%, rgba(0,0,0,.45) 100%); }
.hero-content{ max-width: 1180px; }
.hero-overline{ font-size: 14px; letter-spacing: 5px; text-transform: uppercase; color: #fff; margin: 0 0 26px; }
.hero-title{
  font-size: 62px; font-weight: 700; line-height: 1.05; letter-spacing: 5px;
  color: #fff; margin: 0 0 14px; text-wrap: balance;
}
.hero-sub{ font-size: 48px; font-weight: 700; line-height: 1.1; color: #fff; margin: 0 0 26px; }
.hero-tagline{ font-size: 21px; font-weight: 400; letter-spacing: 1px; line-height: 1.45; max-width: 952px; margin: 0 auto 36px; color: #fff; }
.hero-ctas{ display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.btn-pill{ font-size: 16px; font-weight: 400; letter-spacing: 1px; padding: 10px 26px; }
.btn-pill--ghost{ border-color: rgba(255,255,255,.55); }

/* Intro — "Finding the perfect home is more than a transaction. ITS AN ART." */
.intro-title{ font-size: 42px; font-weight: 700; line-height: 1.2; color: var(--ink); margin: 0 0 22px; text-transform: none; letter-spacing: 0; }
.intro-text{ font-size: 21px; line-height: 1.4; color: var(--ink); margin-bottom: 34px; }
.intro-split p{ max-width: 520px; }
.intro-media img{ aspect-ratio: 4 / 5; }

/* What we do */
.services-statement{ font-size: 36px; font-weight: 400; line-height: 1.5; color: var(--ink); }
.services-statement strong{ font-weight: 700; }
.service h3{ font-size: 21px; font-weight: 700; line-height: 1.2; }
.service p{ font-size: 14px; line-height: 1.6; color: var(--ink); }

/* Quote */
.big-quote{ font-size: 42px; font-weight: 400; line-height: 1.5; color: #1D1D1D; }
.big-quote strong{ font-weight: 700; }

/* Carousel cards */
.slide-price{ font-size: 14px; font-weight: 700; letter-spacing: 1px; }
.slide-price .price-tag{ font-weight: 700; }
.slide-title{ font-size: 28px; font-weight: 700; line-height: 1.2; }
.slide-cat{ font-size: 15px; color: #DFDFDF; opacity: 1; }
.tile-card .slide-title{ font-size: 24px; }

/* Durrës band — "From our hub in Dubai…" */
.find-us .find-us-title{ font-size: 42px; font-weight: 700; line-height: 1.5; color: #fff; margin: 0 0 20px; }
.find-us p{ font-size: 21px; line-height: 1.5; color: #fff; }
.find-us-inner > *{ max-width: 760px; }

/* Founder */
.founder .founder-name{ font-size: 42px; font-weight: 700; line-height: 1.2; color: var(--ink); margin: 0 0 8px; }
.founder .role{ font-size: 14px; letter-spacing: 5px; color: var(--gray); }
.founder p{ font-size: 16px; line-height: 1.8; }
.founder-photo img{ aspect-ratio: 397 / 630; object-fit: cover; object-position: top; max-width: 440px; margin: 0 auto; background: #fff; }

/* Journal */
.journal-meta{ font-size: 14px; font-weight: 700; color: var(--text); }
.journal-title{ font-size: 21px; font-weight: 700; letter-spacing: 1px; line-height: 1.2; }
.journal-card .link-underline{ font-size: 14px; letter-spacing: 1px; }

/* Meeting form */
.meeting-title{ font-size: 36px; font-weight: 400; line-height: 1.5; color: var(--ink); }
.meeting-title strong{ font-weight: 700; }
.meeting-media img{ aspect-ratio: 4 / 5; object-fit: cover; }
.line-consent{ font-size: 12px; line-height: 1.5; color: var(--text); }
.btn-outline{ font-size: 15px; font-weight: 400; }

/* Header, menu, footer */
.header-contact{ font-size: 15px; font-weight: 700; }
.nav-links a{ font-size: 24px; font-weight: 700; line-height: 1.7; }
.nav-lang{ font-size: 17px; font-weight: 700; }
.nav-contact{ font-size: 16px; line-height: 1.8; }
.site-footer{ font-size: 16px; line-height: 1.8; }
.site-footer .footer-nav a{ font-size: 16px; }
.footer-bottom{ font-size: 15px; font-weight: 700; letter-spacing: 0; }

/* Inner page heroes and statements */
.page-hero h1{ font-size: 48px; font-weight: 700; line-height: 1.15; }
.page-hero-sub, .page-hero p{ font-size: 21px; letter-spacing: 1px; line-height: 1.45; }
.page-hero::before{ background: linear-gradient(180deg, rgba(0,0,0,.42), rgba(0,0,0,.5)); }
.about-statement, .section-statement{ font-size: 36px; font-weight: 400; line-height: 1.5; color: var(--ink); }
.section-statement{ max-width: 900px; margin: 0 auto 60px; }
.mission p{ font-size: 24px; line-height: 1.5; }
.listing-text h3{ font-weight: 700; }
.listing-disclaimer{ margin-top: 40px; font-size: 13px; color: var(--gray); border-top: 1px solid var(--line); padding-top: 18px; }
.contact-main{ font-size: 21px; }
.contact-col .contact-note + .contact-main{ margin-top: 10px; }

/* Lists with hairlines (owners / investors) */
.list-label{ font-size: 14px; letter-spacing: 5px; text-transform: uppercase; color: var(--ink); margin: 34px 0 10px; }
.line-list{ margin: 0 0 34px; }
.line-list li{ padding: 11px 0; border-bottom: 1px solid var(--line); font-size: 16px; color: var(--ink); }
.line-list li:first-child{ border-top: 1px solid var(--line); }
#investitoret .btn-row{ align-items: center; gap: 28px; }

/* Home — projects band */
.projects-band{ padding: 90px 0 100px; }
.project-tiles{ display: grid; grid-template-columns: 1.25fr 1fr; gap: 28px; margin: 10px 0 44px; }
.project-tile{ position: relative; display: block; min-height: 560px; overflow: hidden; color: #fff; background: var(--navy-2); }
.project-tile-media{ position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform 1.1s var(--ease); }
.project-tile-media::after{ content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.62) 100%); }
.project-tile:hover .project-tile-media{ transform: scale(1.05); }
.project-tile-body{ position: absolute; left: 34px; right: 34px; bottom: 30px; display: flex; flex-direction: column; gap: 8px; }
.project-tile-title{ font-size: 28px; font-weight: 700; line-height: 1.2; }
.project-tile-text{ font-size: 16px; line-height: 1.5; max-width: 460px; }
.project-tile-cta{ font-size: 14px; letter-spacing: 2px; text-decoration: underline; text-underline-offset: 5px; margin-top: 6px; }

/* Services page */
.service-rows{ display: grid; grid-template-columns: 1fr 1fr; gap: 0 80px; max-width: 1100px; margin: 0 auto; }
.service-row{ padding: 34px 0 38px; border-top: 1px solid var(--line); }
.service-num{ display: block; font-size: 14px; letter-spacing: 5px; color: var(--gray); margin-bottom: 14px; }
.service-row h3{ font-size: 21px; font-weight: 700; line-height: 1.2; margin-bottom: 12px; }
.service-row p{ font-size: 16px; line-height: 1.6; color: var(--text); margin-bottom: 18px; }
.photo-strip{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.photo-strip figure{ position: relative; aspect-ratio: 4 / 3; overflow: hidden; }
.photo-strip img{ width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--ease); }
.photo-strip figure:hover img{ transform: scale(1.04); }
.photo-strip figcaption{ position: absolute; left: 22px; bottom: 18px; color: #fff; font-size: 14px; letter-spacing: 5px; text-transform: uppercase; text-shadow: 0 1px 12px rgba(0,0,0,.45); }
.photo-note{ font-size: 12px; color: var(--gray); text-align: center; margin: 14px auto 0; padding-bottom: 70px; }

/* Projects page */
.project-media img{ width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.project-title{ font-size: 42px; font-weight: 700; line-height: 1.2; color: var(--ink); margin: 0 0 20px; }
.project-feature p:not(.project-title), .zone-feature p:not(.project-title){ font-size: 18px; line-height: 1.6; color: var(--ink); margin-bottom: 28px; }
.rinia-band{ position: relative; min-height: 88vh; display: flex; align-items: flex-end; color: #fff; background-size: cover; background-position: center; padding: 160px 0 110px; overflow: hidden; }
.rinia-band .bg-video{ position: absolute; inset: 0; z-index: 0; }
.rinia-band::before{ content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(0,0,0,.1) 30%, rgba(0,0,0,.6) 100%); }
.rinia-band-inner{ position: relative; z-index: 2; }
.rinia-band-inner > *{ max-width: 720px; }
.rinia-band .eyebrow, .rinia-band .project-title{ color: #fff; }
.rinia-band p:not(.project-title){ font-size: 21px; line-height: 1.5; }
.rinia-gallery-section{ padding: 6px 0 calc(var(--dome) + 90px); }
.rinia-gallery-section .container{ max-width: none; padding: 0 6px; }
.rinia-gallery{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.rinia-gallery figure{ aspect-ratio: 4 / 3; overflow: hidden; }
.rinia-gallery figure.is-wide{ grid-column: span 4; aspect-ratio: 21 / 8; }
.rinia-gallery img{ width: 100%; height: 100%; object-fit: cover; }
.zone-feature{ margin-bottom: 80px; }
.zone-feature .intro-media img{ aspect-ratio: 4 / 3; }
.zone-list{ display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 50px; }
.zone{ border-top: 1px solid var(--line); padding-top: 26px; }
.zone h3{ font-size: 21px; margin-bottom: 12px; }
.zone p{ font-size: 16px; color: var(--text); }

/* About — team */
.team-section{ padding-bottom: calc(var(--dome) + 100px); }
.team-grid{ display: grid; grid-template-columns: repeat(5, 1fr); gap: 22px; }
.team-card{ margin: 0; background: #fff; box-shadow: 0 10px 30px rgba(0,0,0,.05); }
.team-card img{ width: 100%; height: auto; }
.team-photo{ margin: 60px 0 0; }
.team-photo img{ width: 100%; aspect-ratio: 21 / 9; object-fit: cover; }

/* Tablet */
@media (max-width: 1024px){
  .hero-title{ font-size: 50px; }
  .hero-sub{ font-size: 38px; }
  .intro-title, .find-us .find-us-title, .founder .founder-name, .project-title{ font-size: 34px; }
  .services-statement, .meeting-title, .about-statement, .section-statement{ font-size: 30px; }
  .big-quote{ font-size: 34px; }
  .team-grid{ grid-template-columns: repeat(3, 1fr); }
  .zone-list{ grid-template-columns: 1fr; gap: 30px; }
}

/* Mobile — the AUREA phone sizes */
@media (max-width: 767px){
  .eyebrow, h2.eyebrow, .hero-overline, .list-label{ font-size: 12px; margin-bottom: 22px; }
  .hero-overline{ margin-bottom: 18px; }
  .hero-title{ font-size: 34px; line-height: 1.12; letter-spacing: 1px; }
  .hero-sub{ font-size: 24px; margin-bottom: 18px; }
  .hero-tagline{ font-size: 16px; letter-spacing: .5px; line-height: 1.5; margin-bottom: 28px; }
  .btn-pill{ font-size: 14px; padding: 9px 20px; }
  .link-strong{ font-size: 15px; }
  .intro-title, .founder .founder-name, .project-title{ font-size: 24px; }
  .intro-text{ font-size: 16px; }
  .services-statement, .meeting-title, .about-statement, .section-statement{ font-size: 24px; }
  .service h3{ font-size: 18px; }
  .big-quote{ font-size: 24px; }
  .slide-price{ font-size: 12px; }
  .slide-title{ font-size: 24px; }
  .slide-cat{ font-size: 14px; }
  .find-us .find-us-title{ font-size: 24px; }
  .find-us p:not(.find-us-title), .rinia-band p:not(.project-title){ font-size: 16px; }
  .journal-meta{ font-size: 12px; }
  .journal-title{ font-size: 19px; }
  .header-contact{ font-size: 14px; }
  .nav-links a{ font-size: 19px; }
  .page-hero h1{ font-size: 32px; }
  .page-hero-sub, .page-hero p{ font-size: 16px; letter-spacing: .5px; }
  .mission p{ font-size: 18px; }
  .project-tiles{ grid-template-columns: 1fr; }
  .project-tile{ min-height: 420px; }
  .project-tile-body{ left: 22px; right: 22px; bottom: 22px; }
  .project-tile-title{ font-size: 24px; }
  .service-rows{ grid-template-columns: 1fr; }
  .photo-strip{ grid-template-columns: 1fr; }
  .rinia-band{ min-height: 72vh; padding: 120px 0 70px; }
  .rinia-gallery{ grid-template-columns: 1fr 1fr; }
  .rinia-gallery figure.is-wide{ grid-column: span 2; aspect-ratio: 4 / 3; }
  .team-grid{ grid-template-columns: 1fr 1fr; gap: 14px; }
  .team-photo img{ aspect-ratio: 4 / 3; }
}

/* Card titles are bold, as on AUREA */
.process-step h3, .process-step h4, .principle h4, .coop-card h3{ font-weight: 700; }

/* Body copy under the large statements — AUREA body size */
.split > .reveal > p:not([class]){ font-size: 16px; line-height: 1.8; color: var(--text); }

/* =========================================================
   v3.1 — FINE TYPE (client feedback: no thick or large lettering)
   Everything light: titles 200, text 300, nothing bold. Sizes one step
   smaller than before. font-optical-sizing lets Fraunces use its
   high-contrast display cut at large sizes, so hairlines stay fine.
   ========================================================= */
html{ font-optical-sizing: auto; }
body{ font-weight: 300; }
h1, h2, h3, h4, h5, strong, b,
.hero-title, .hero-sub, .intro-title, .find-us .find-us-title, .founder .founder-name,
.project-title, .page-hero h1, .slide-title, .project-tile-title, .journal-title,
.service h3, .service-row h3, .zone h3, .listing-text h3, .process-step h3, .process-step h4,
.principle h4, .coop-card h3, .section-head h2, .cta-band h2, .single-article h1{ font-weight: 200; }
.services-statement strong, .big-quote strong, .meeting-title strong, .intro-caps{ font-weight: 350; }
.hero-tagline, .intro-text, .services-statement, .big-quote, .meeting-title, .about-statement,
.section-statement, .mission p, .find-us p, .rinia-band p, .page-hero-sub, .page-hero p{ font-weight: 300; }
.eyebrow, h2.eyebrow, .hero-overline, .list-label, .service-num, .founder .role{ font-weight: 300; }
.link-underline, .link-strong, .btn-pill, .btn-outline, .btn, .header-contact, .nav-links a, .nav-lang,
.footer-bottom, .slide-price, .slide-price .price-tag, .journal-meta, .project-tile-cta{ font-weight: 300; }
.link-strong{ font-size: 14px; letter-spacing: 2px; }
.header-contact{ font-size: 15px; }
.footer-bottom{ font-size: 13px; letter-spacing: .12em; }

/* Sizes — desktop */
.hero-title{ font-size: 50px; letter-spacing: 1px; line-height: 1.1; }
.hero-sub{ font-size: 32px; line-height: 1.2; }
.hero-tagline{ font-size: 18px; letter-spacing: .5px; }
.intro-title, .find-us .find-us-title, .founder .founder-name, .project-title{ font-size: 34px; line-height: 1.25; }
.intro-text{ font-size: 18px; }
.services-statement, .meeting-title, .about-statement, .section-statement{ font-size: 28px; line-height: 1.45; }
.big-quote{ font-size: 32px; line-height: 1.45; }
.page-hero h1{ font-size: 42px; }
.page-hero-sub, .page-hero p{ font-size: 18px; letter-spacing: .5px; }
.mission p{ font-size: 21px; }
.find-us p:not(.find-us-title), .rinia-band p:not(.project-title){ font-size: 18px; }
.slide-title{ font-size: 24px; }
.tile-card .slide-title, .project-tile-title{ font-size: 22px; }
.service h3, .service-row h3, .zone h3{ font-size: 20px; }
.journal-title{ font-size: 19px; letter-spacing: .3px; line-height: 1.3; }
.nav-links a{ font-size: 22px; }
.nav-lang{ font-size: 15px; }
.contact-main{ font-size: 19px; }
.marquee-track span{ font-weight: 200; }
.process-step .num{ font-weight: 200; }

@media (max-width: 1024px){
  .hero-title{ font-size: 42px; }
  .hero-sub{ font-size: 28px; }
  .intro-title, .find-us .find-us-title, .founder .founder-name, .project-title{ font-size: 30px; }
  .services-statement, .meeting-title, .about-statement, .section-statement{ font-size: 25px; }
  .big-quote{ font-size: 28px; }
}
@media (max-width: 767px){
  .hero-title{ font-size: 32px; letter-spacing: .5px; }
  .hero-sub{ font-size: 21px; }
  .hero-tagline{ font-size: 15px; }
  .intro-title, .find-us .find-us-title, .founder .founder-name, .project-title{ font-size: 24px; }
  .intro-text{ font-size: 16px; }
  .services-statement, .meeting-title, .about-statement, .section-statement{ font-size: 21px; }
  .big-quote{ font-size: 22px; }
  .page-hero h1{ font-size: 30px; }
  .page-hero-sub, .page-hero p{ font-size: 15px; }
  .mission p{ font-size: 17px; }
  .find-us p:not(.find-us-title), .rinia-band p:not(.project-title){ font-size: 15px; }
  .slide-title{ font-size: 21px; }
  .service h3, .service-row h3, .zone h3{ font-size: 18px; }
  .journal-title{ font-size: 18px; }
  .nav-links a{ font-size: 19px; }
}

/* =========================================================
   v3.2 — HERO BUILT LIKE AUREA (measured at 1440×900 and 390×844)
   Title 62 px / letter-spacing 5 px with the rotating last word,
   second line 48 px, text 21 px, one rounded 229×42 button, chevron,
   centred logo, 60 px curve. Weights stay light (client feedback).
   ========================================================= */
:root{ --dome: 60px; }
@media (max-width: 768px){ :root{ --dome: 34px; } }

.hero-content{ padding: 200px 24px 0; max-width: 1400px; }
.hero-title{
  font-size: 62px; line-height: 1.05; letter-spacing: 5px; font-weight: 400;
  margin: 0 0 40px; white-space: nowrap; text-wrap: nowrap;
}
.hero-title .rotator{ letter-spacing: 5px; }
.hero-sub{ font-size: 48px; line-height: 1; font-weight: 400; letter-spacing: 0; margin: 0 0 32px; }
.hero-tagline{ font-size: 21px; line-height: 1.35; letter-spacing: 1px; font-weight: 300; max-width: 952px; margin: 0 auto 32px; }
.hero .btn-pill{
  min-width: 229px; height: 42px; justify-content: center; padding: 0 24px;
  border: 1px solid #F9F9F9; border-radius: 60px; font-size: 16px; letter-spacing: 1px; font-weight: 300;
}
.hero-media::after{ background: rgba(0,0,0,.36); }
.hero-scroll{ bottom: 110px; color: #fff; }
.hero-scroll svg{ width: 36px; height: 36px; stroke-width: .9; }

/* Header: logo centred on desktop, as on AUREA */
@media (min-width: 1025px){
  .header-inner{ position: relative; padding: 13px 24px 0; min-height: 100px; align-items: flex-start; }
  .brand{ position: absolute; left: 50%; top: 13px; transform: translateX(-50%); }
  .brand img{ height: 74px; }
  .site-header.is-solid .brand{ transform: translate(-50%, -12px); }
  .header-right{ margin-left: auto; margin-top: 17px; }
}
.header-contact{ font-size: 15px; font-weight: 400; padding: 12px 8px; }
.hamburger{ width: 41px; height: 41px; border-radius: 12px; background: rgba(255,255,255,.18); }
.hamburger span{ background: #fff; }
.site-header.is-solid .hamburger span, .site-header.is-dark-text .hamburger span{ background: var(--ink); }

@media (max-width: 1024px){
  .hero-title{ font-size: 46px; white-space: normal; text-wrap: balance; }
  .hero-sub{ font-size: 36px; }
}
@media (max-width: 767px){
  .hero-content{ padding: 150px 20px 0; }
  .hero-title{ font-size: 28px; line-height: 1.55; letter-spacing: 0; margin-bottom: 14px; }
  .hero-title .rotator{ letter-spacing: 0; }
  .hero-sub{ font-size: 24px; margin-bottom: 18px; }
  .hero-tagline{ font-size: 16px; line-height: 1.5; letter-spacing: .5px; margin-bottom: 30px; }
  .hero .btn-pill{ min-width: 208px; height: 40px; font-size: 14px; }
  .hero-scroll{ bottom: 70px; }
}

/* v3.3 — the team photo is shown whole (client request) */
.team-photo img{ aspect-ratio: auto; height: auto; object-fit: contain; }
@media (max-width: 767px){ .team-photo img{ aspect-ratio: auto; } }

/* v3.4 — the meeting photo (whole team) is shown uncropped */
.meeting-media img{ aspect-ratio: auto; height: auto; object-fit: contain; }
.meeting .split{ align-items: center; }

/* =========================================================
   v3.5 — FONT CLOSEST TO AUREA
   Gilda Display stands in for "The Seasons" (licensed); it has a single
   regular weight, so faux bold is switched off to keep lettering fine.
   ========================================================= */
:root{ --serif: 'The Seasons', 'the-seasons', 'Gilda Display', Georgia, 'Times New Roman', serif; --serif-settings: normal; }
html, body, button, input, textarea, select{ font-synthesis: none; }
body{ font-family: var(--serif); font-variation-settings: normal; }

/* =========================================================
   v3.7 — HERO COPIED FROM AUREA (text, weights, spacing)
   Title and second line in The Seasons Bold, as on aureaestates.com;
   gaps measured there: title→line 36 px, line→text 32 px, text→button 32 px.
   ========================================================= */
.hero-title{ font-weight: 700; margin-bottom: 36px; }
.hero-title .rotator-word{ font-weight: 700; }
.hero-sub{ font-weight: 700; font-size: 48px; line-height: 1; margin-bottom: 32px; }
.hero-tagline{ font-weight: 400; font-size: 21px; line-height: 1.25; letter-spacing: 1px; margin-bottom: 32px; }
.hero .btn-pill{ font-weight: 400; }
.header-contact{ font-weight: 700; font-size: 15px; }
@media (max-width: 767px){
  .hero-title{ font-size: 28px; line-height: 1.15; margin-bottom: 14px; }
  .hero-sub{ font-size: 24px; margin-bottom: 18px; }
  .hero-tagline{ font-size: 16px; line-height: 1.5; letter-spacing: 1.2px; margin-bottom: 30px; }
  .hero .btn-pill{ font-size: 14px; }
  .header-contact{ font-size: 14px; }
}
.hero-media::after{ background: rgba(0,0,0,.44); }

/* =========================================================
   v3.9 — THE SEASONS WITH AUREA'S OWN WEIGHTS
   Measured on aureaestates.com: text, labels and buttons use the regular
   cut; the hero lines, section and card titles, menu and "Contact us"
   the bold cut. Nothing else is emboldened.
   ========================================================= */
:root{ --serif: 'The Seasons', Georgia, 'Times New Roman', serif; }
html body, html body *{ font-family: var(--serif); font-weight: 400 !important; font-synthesis: none; }
html body .hero-sub,
html body .intro-title, html body .founder .founder-name, html body .project-title,
html body .find-us .find-us-title, html body .slide-title, html body .project-tile-title,
html body .service h3, html body .service-row h3, html body .zone h3, html body .journal-title,
html body .journal-title a, html body .nav-links a, html body .header-contact, html body .page-hero h1,
html body strong, html body b, html body .footer-bottom{ font-weight: 700 !important; }

/* =========================================================
   v3.10 — CLEANER HERO, AS CALM AS AUREA'S
   AUREA's video is soft, warm and low in contrast, so the lettering sits
   on a quiet surface. The Durrës aerial is sharp and busy; it is softened
   (slight blur, less saturation) and darkened most where the text sits.
   ========================================================= */
.hero-media img{
  filter: blur(1.6px) saturate(.82) contrast(.92) brightness(.9);
  transform: scale(1.04); animation: none;
}
.hero-media::after{
  background:
    radial-gradient(ellipse 70% 55% at 50% 52%, rgba(12,10,8,.42) 0%, rgba(12,10,8,.18) 100%),
    linear-gradient(180deg, rgba(12,10,8,.30) 0%, rgba(12,10,8,.22) 50%, rgba(12,10,8,.34) 100%);
}

/* v3.11 — hero title one step finer (client request): regular cut instead of bold */
html body .hero-title, html body .hero-title *{ font-weight: 400 !important; }

/* v3.12 — phone fixes found in the bug check */
.wa-float{ transition: opacity .4s var(--ease), transform .4s var(--ease), background var(--speed), color var(--speed); }
@media (max-width: 767px){
  /* WhatsApp pill no longer covers the hero button */
  html.hero-in-view .wa-float{ opacity: 0; pointer-events: none; transform: translateY(12px); }
  /* The fifth team card sits centred instead of alone on the left */
  .team-grid .team-card:last-child:nth-child(odd){ grid-column: 1 / -1; width: calc(50% - 7px); justify-self: center; }
}

/* =========================================================
   v3.13 — SMOOTHER WORD CHANGE IN THE HERO
   Letters leave upwards and arrive from below one after another, coming
   into focus from a slight blur; the slot eases to the new word's width.
   Without JavaScript (or with reduced motion) the first word simply shows.
   ========================================================= */
.hero-title .rotator{
  position: relative; display: inline-block; vertical-align: bottom; white-space: nowrap;
  text-align: left; transition: width .9s cubic-bezier(.65, 0, .35, 1);
}
.hero-title .rotator.is-ready::before{ content: '\00a0'; visibility: hidden; }
.hero-title .rotator .rotator-word{ position: absolute; left: 0; top: 0; opacity: 0; transform: none; transition: none; }
.hero-title .rotator .rotator-word.is-active,
.hero-title .rotator .rotator-word.is-leaving{ opacity: 1; }
.hero-title .rotator:not(.is-ready) .rotator-word.is-active{ position: relative; }

.hero-title .rotator .ch{
  display: inline-block; opacity: 0; transform: translateY(.5em); filter: blur(8px);
  transition: opacity .7s cubic-bezier(.22, 1, .36, 1), transform .9s cubic-bezier(.22, 1, .36, 1), filter .7s ease;
  will-change: transform, opacity, filter;
}
.hero-title .rotator .rotator-word.is-active .ch{
  opacity: 1; transform: none; filter: blur(0);
  transition-delay: calc(220ms + var(--i) * 40ms);
}
.hero-title .rotator .rotator-word.is-leaving .ch{
  opacity: 0; transform: translateY(-.4em); filter: blur(8px);
  transition-duration: .45s, .6s, .45s;
  transition-timing-function: ease-in, cubic-bezier(.55, 0, .75, .2), ease-in;
  transition-delay: calc(var(--i) * 25ms);
}
@media (prefers-reduced-motion: reduce){
  .hero-title .rotator{ transition: none; }
}

/* Two fixed title lines on phones (see front-page.php) */
.br-mobile{ display: none; }
@media (max-width: 767px){ .br-mobile{ display: inline; } }

/* =========================================================
   v3.14 — HERO: ARROW UNDER THE BUTTON, FINER AND SMALLER TYPE
   The scroll arrow now sits in the text column, right under the button,
   instead of a fixed distance from the bottom of the screen (on shorter
   laptop screens it used to land on top of the button).
   ========================================================= */
.hero-content{ padding-bottom: calc(var(--dome) + 40px); }
.hero-content .hero-scroll{
  position: static; transform: none; display: block; width: 36px; margin: 38px auto 0;
  color: rgba(255,255,255,.85); bottom: auto; left: auto;
}
.hero-content .hero-scroll svg{ width: 32px; height: 32px; margin: 0 auto; }

/* Finer, a little smaller */
.hero-title{ font-size: 52px; letter-spacing: 4px; margin-bottom: 28px; }
html body .hero-title, html body .hero-title *{ font-weight: 300 !important; }
.hero-sub{ font-size: 36px; margin-bottom: 26px; }
html body .hero-sub{ font-weight: 400 !important; }
.hero-tagline{ font-size: 18px; letter-spacing: .8px; margin-bottom: 30px; }
html body .hero-tagline{ font-weight: 300 !important; }
.hero .btn-pill{ font-size: 15px; min-width: 214px; height: 40px; }
html body .hero .btn-pill{ font-weight: 300 !important; }

@media (max-width: 1024px){
  .hero-title{ font-size: 42px; }
  .hero-sub{ font-size: 30px; }
}
@media (max-width: 767px){
  .hero-title{ font-size: 25px; letter-spacing: .5px; margin-bottom: 12px; }
  .hero-sub{ font-size: 20px; margin-bottom: 16px; }
  .hero-tagline{ font-size: 15px; margin-bottom: 26px; }
  .hero .btn-pill{ font-size: 14px; min-width: 196px; height: 38px; }
  .hero-content .hero-scroll{ margin-top: 26px; }
  .hero-content{ padding-bottom: calc(var(--dome) + 30px); }
}

/* v3.15 — file field in the page's language (replaces "Choose File") */
.file-pick{ display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding-top: 6px; }
.file-pick input[type=file]{ position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.file-pick .file-pick-button{
  display: inline-flex; align-items: center; padding: 9px 18px; border: 1px solid var(--ink); cursor: pointer;
  font-size: 14px; letter-spacing: .5px; text-transform: none; color: var(--ink); margin: 0;
  transition: background var(--speed), color var(--speed);
}
.file-pick .file-pick-button:hover{ background: var(--ink); color: #fff; }
.file-pick input[type=file]:focus-visible + .file-pick-button{ outline: 2px solid var(--ink); outline-offset: 3px; }
.file-pick-name{ font-size: 13px; color: var(--gray); }

/* v3.16 — lists in the legal pages (privacy policy) get their bullets back */
.legal-content ul{ list-style: disc; padding-left: 1.3em; margin: 0 0 1.2em; }
.legal-content li{ margin-bottom: .45em; padding-left: .2em; }
.legal-content li::marker{ color: var(--gold); }
.legal-content h2{ margin-top: 1.8em; }
.legal-content a{ text-decoration: underline; text-underline-offset: 3px; }