/* ============================================================
   RIVIERA · The Horizon Line — GRIMIT yacht-luxury identity
   Monaco yacht club × superyacht × Aman × Bentley Mulliner.
   NO BLACK anywhere — only layered yacht navy.
     · Yacht navy #061A2D / #081E34 / #0B223B (+ #040F1C nightfall)
       = the sea & the night            → dark sections
     · Warm stone / ivory #F4EFE3..#FBF7EC = the sunlit deck (light sections)
     · Champagne metal = the CO-LEAD: engraved brass labels, champagne
       numerals on navy, brass focus rings, gold hairline frames —
       the polished metalwork of a $500M flagship. No green anywhere.
     · The Horizon Line — a thin low-tone burnt-coral seam where
       light meets dark: section boundaries, nav, kickers, loading.
     · Burnt yacht orange #C2622E (CTA leather) + deep coral #CF7A4A
       (accents) — controlled & low-tone, never neon.
     · Muted coral red #A84A35 = rare premium emphasis (the price).
     · Champagne metal #D9C49A = hairlines, frames, labels on navy.
     · Estate greens (#2F4A3C/#6A7355/#9FB09A) = subtle support only.
   ============================================================ */
@import url("styles-base.css?v=2");

:root{
  /* — yacht-navy layers (NO black anywhere) — */
  --navy:#061A2D; --navy-2:#081E34; --navy-3:#0B223B; --navy-glass:rgba(6,26,45,0.90);
  --navy-deep:#040F1C;   /* deepest layer: footer nightfall, lightbox — still navy, never black */
  /* kill the blacks inherited from styles-base.css at the source */
  --black:#061A2D; --graphite:#081E34; --graphite-2:#0B223B;

  /* — controlled orange: burnt yacht + deep coral, LOW-TONE (never neon) — */
  --terra:#C2622E;          /* burnt yacht orange — primary CTA leather */
  --coral:#CF7A4A;          /* deep coral orange — accents / the Horizon Line */
  --coral-hi:#DD9163;       /* hover lift */
  --coral-deep:#A84A35;     /* muted coral red — rare premium emphasis (the price) */
  --coral-text:#9C4A22;     /* AA terracotta for small labels on stone */

  /* — champagne metal — */
  --champagne:#D9C49A; --champagne-hi:#E9DCBE; --champagne-deep:#B89A66;
  --titanium:#A9B4BE;

  /* — antique brass ink — engraved labels on the stone deck — */
  --brass-ink:#8A6D3B;
  --cblue:var(--champagne); --cblue-hi:var(--champagne-hi); --cblue-ink:var(--champagne-deep);

  /* — warm stone / ivory — */
  --ivory:#F4EFE3; --ivory-2:#EBE3D3; --ivory-hi:#FBF7EC;

  /* — The Horizon Line — refined low-tone burnt-coral, restrained glow — */
  --hz:linear-gradient(90deg, rgba(207,122,74,0) 0%, rgba(168,74,53,0.42) 28%, #CF7A4A 50%, rgba(168,74,53,0.42) 72%, rgba(207,122,74,0) 100%);
  --hz-glow:0 0 13px rgba(207,122,74,0.34), 0 0 34px rgba(207,122,74,0.12);
  /* dividers & frames = champagne brass inlay */
  --ti-line:linear-gradient(90deg, rgba(217,196,154,0), rgba(217,196,154,0.55) 50%, rgba(217,196,154,0));

  /* — role tokens (cascade into base) — */
  --sky-blue:var(--champagne); --sky-bright:var(--champagne-hi); --sky-ink:var(--champagne-deep);
  --orange:var(--coral); --orange-hi:var(--coral-hi);
  --lemon:var(--champagne); --lemon-hi:var(--champagne-hi);
  --mint:var(--champagne-deep);
  --cpurple:var(--champagne); --cpurple-hi:var(--champagne-hi); --cpurple-deep:var(--champagne-deep);
  --accent-rgb:207,122,74;
  --accent2-rgb:217,196,154;
  /* navy sea surfaces (dark) */
  --surface-base:var(--navy-2); --surface-deep:var(--navy); --surface-raised:var(--navy-3);
  /* warm-stone surfaces (light sections = the sunlit deck) */
  --paper:var(--ivory); --paper-2:var(--ivory-2); --paper-raised:var(--ivory-hi);
  --text-bone:#F4EFE3; --dark-muted:#A6B4C0; --text-ink:#17293A; --text-muted:#566679;
  --bronze:var(--terra); --bronze-hi:var(--coral); --bronze-deep:var(--coral-text);
  --line-bone:rgba(244,239,227,0.12); --line-ink:rgba(23,41,58,0.13);
  /* type */
  --font-sans:"Manrope","Golos Text",system-ui,-apple-system,sans-serif;
}

::selection{ background:rgba(207,122,74,0.85); color:var(--navy); }

/* ============================================================
   STONE DECK — ivory sections carry near-invisible seams
   (two plank scales). Dark sections stay clean: open water.
   ============================================================ */
.sec--light{
  background-color:var(--paper);
  background-image:
    repeating-linear-gradient(90deg, rgba(12,28,48,0.05) 0 1px, transparent 1px 118px),
    repeating-linear-gradient(90deg, rgba(12,28,48,0.02) 0 1px, transparent 1px 29px),
    linear-gradient(180deg, rgba(12,28,48,0.045), rgba(12,28,48,0) 120px);
}

/* ============================================================
   THE HORIZON LINE — boundary ritual: wherever deck meets water.
   ============================================================ */
.hero, .numbers, .vband, .cband, .footer, .parkview{ position:relative; }
.hero::after,
.numbers.sec--dark::before, .numbers.sec--dark::after,
.vband::before, .vband::after,
.parkview::before, .parkview::after,
.partners.sec--dark::before, .partners.sec--dark::after,
.pvhero::after, .plans.sec--dark::after,
.footer::after{
  content:""; position:absolute; left:50%; transform:translateX(-50%);
  width:min(760px,78vw); height:1px; z-index:5; pointer-events:none;
  background:var(--hz); box-shadow:var(--hz-glow);
}
.hero::after, .numbers.sec--dark::after, .vband::after, .parkview::after,
.partners.sec--dark::after, .pvhero::after, .plans.sec--dark::after{ bottom:0; }
.numbers.sec--dark::before, .vband::before, .parkview::before,
.partners.sec--dark::before, .footer::after{ top:0; }
.footer::after{ width:min(980px,86vw); }
.pvhero, .plans{ position:relative; }

/* ============================================================
   HEADER — navy glass, titanium hairline, horizon nav states
   ============================================================ */
.site-header.is-scrolled{
  background:var(--navy-glass);
  -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(169,180,190,0.18);
}
.site-header.is-scrolled .site-nav__link{ color:var(--dark-muted); }
.site-header.is-scrolled .site-nav__link:hover,
.site-header.is-scrolled .site-nav__link.is-active{ color:var(--text-bone); }
.site-header.is-scrolled .site-header__phone{ color:var(--text-bone); }
.site-header.is-scrolled .nav-burger span{ background:var(--text-bone); }
.site-nav__link{ letter-spacing:0.08em; }
.site-nav__link::after{
  left:50%; right:auto; bottom:-3px; width:100%; transform:translateX(-50%) scaleX(0);
  transform-origin:center; background:var(--hz); box-shadow:var(--hz-glow); height:1px;
}
.site-nav__link:hover::after, .site-nav__link.is-active::after{ transform:translateX(-50%) scaleX(1); }
.site-nav__link.is-active{ color:var(--text-bone); }
.site-header__phone{ font-variant-numeric:tabular-nums; letter-spacing:0.06em; }
.site-header__phone:hover{ color:var(--champagne-hi); }

/* ============================================================
   KICKERS — each label opens with a rising-sun horizon segment
   ============================================================ */
.kicker{ font-weight:600; font-size:0.68rem; letter-spacing:0.26em; color:var(--text-muted); }
.kicker--on-dark{ color:var(--champagne); }
.kicker::before, .kicker--on-dark::before{
  width:44px; height:1px; border-radius:1px;
  background:linear-gradient(90deg, rgba(207,122,74,0), #CF7A4A 55%, rgba(207,122,74,0) 95%);
  box-shadow:0 0 12px rgba(207,122,74,0.55);
}
.sec--light .kicker{ color:var(--brass-ink); }   /* engraved brass label on stone */

/* ============================================================
   TYPE — editorial serif voice (FT × Aman × Rolls-Royce)
   ============================================================ */
.section__title{ font-weight:500; letter-spacing:-0.005em; }
.section__title em, .hero__title em{ font-style:italic; color:var(--coral); }
.section__lead{ color:var(--text-muted); }
.sec--dark .section__lead{ color:var(--dark-muted); }

/* ============================================================
   BUTTONS — hull curves: precision pills, varnish sweep on hover
   ============================================================ */
.btn{ border-radius:999px; padding:17px 38px; font-weight:600; letter-spacing:0.18em; font-size:0.72rem; }
.btn--primary{ background:var(--terra); border-color:var(--terra); color:var(--ivory-hi);
  box-shadow:inset 0 1px 0 rgba(251,247,236,0.22), 0 14px 30px -16px rgba(6,26,45,0.6); }
.btn--primary::before{ background:var(--coral); }
.btn--primary:hover{ box-shadow:inset 0 1px 0 rgba(251,247,236,0.22), 0 18px 40px -14px rgba(6,26,45,0.7), 0 0 0 1px rgba(217,196,154,0.55); }
.btn--ghost{ color:var(--text-ink); border-color:rgba(23,41,58,0.28); }
.btn--ghost:hover{ color:var(--coral-text); border-color:var(--coral); }
.btn--ghost-light{ color:var(--text-bone); border-color:rgba(217,196,154,0.4); }
.btn--ghost-light:hover{ border-color:var(--champagne-hi); color:var(--champagne-hi); }
.btn--nav{ padding:12px 24px; font-size:0.66rem; }
@media (max-width:1180px){ .btn--nav{ display:none; } }
.carousel__btn{ border-radius:50%; }
.carousel__btn:hover{ border-color:var(--coral); color:var(--coral-deep); }

/* inline links — cognac leather underline */
.link{ background-image:linear-gradient(var(--coral-deep), var(--coral-deep)); color:var(--coral-text); }
.link:hover{ color:var(--coral-deep); }

/* ============================================================
   HERO — night approach to the city; horizon at the waterline
   ============================================================ */
.hero__scrim{ background:
  linear-gradient(200deg, rgba(201,134,66,0.12), transparent 40%),
  radial-gradient(60% 54% at 50% 54%, rgba(6,26,45,0.55), rgba(6,26,45,0) 100%),
  linear-gradient(180deg, rgba(6,26,45,0.5) 0%, rgba(6,26,45,0.3) 42%, rgba(6,26,45,0.9) 100%); }
.hero__grain{ background:
  radial-gradient(120% 120% at 50% 38%, transparent 55%, rgba(6,26,45,0.6) 100%),
  linear-gradient(115deg, transparent 40%, rgba(207,122,74,0.07) 70%, transparent 100%); }
.hero__title{ font-size:clamp(2.5rem,5.2vw,4.7rem); line-height:1.04; }
.hero__title .line{ overflow:visible; }
.hero__title .line:nth-child(2) .line__i{ color:var(--text-bone); padding-right:0.12em; }
.hero__lead{ color:rgba(242,237,226,0.92); }
.hero__stats{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:9px 18px;
  margin:26px auto 0; font-size:0.8rem; letter-spacing:0.12em; text-transform:uppercase;
  color:rgba(217,199,160,0.92); font-weight:500; }
.hero__stats i{ color:var(--coral); font-style:normal; }
.hero__stats span{ white-space:nowrap; }
.hero__actions{ display:flex; justify-content:center; flex-wrap:wrap; gap:14px; margin-top:36px; }
.hero__scroll{ border-color:rgba(242,237,226,0.35); }
.hero__scroll span{ background:var(--champagne); }
/* Sofia coordinates — quiet editorial signature on the hero edge */
.hero__coords{ position:absolute; right:30px; bottom:110px; z-index:2;
  writing-mode:vertical-rl; font-family:var(--font-sans); font-size:0.62rem;
  letter-spacing:0.34em; color:rgba(217,199,160,0.6); font-variant-numeric:tabular-nums; }
@media (max-width:900px){ .hero__coords{ display:none; } }
.site-header__actions{ display:flex; align-items:center; gap:22px; }

/* ============================================================
   PROJECTS (ivory deck) — open editorial cards, titanium frames
   ============================================================ */
.pcard__img{ border:1px solid rgba(12,28,48,0.08); }
.pcard__status{ color:var(--brass-ink); }   /* engraved brass status plate */
.pcard__status::before{ background:var(--champagne-deep); box-shadow:0 0 8px rgba(184,154,102,0.8); }
.pcard:hover h3{ color:var(--coral-deep); }
.pcard__meta{ list-style:none; display:flex; gap:24px; margin-top:16px; }
.pcard__meta li{ display:flex; flex-direction:column; gap:3px; }
.pcard__meta span{ font-size:0.62rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--text-muted); }
.pcard__meta b{ font-family:var(--font-serif); font-size:1.5rem; font-weight:600; color:var(--text-ink); line-height:1; }

/* ============================================================
   NUMBERS (deep navy sea) — serif champagne figures over horizon
   ============================================================ */
.numbers .num b{ color:var(--champagne-hi); text-shadow:0 0 34px rgba(233,220,190,0.28); font-weight:500; }   /* champagne figures — polished metal on night water */
/* playful tri-colour stats — 35+ lemon · 53 baby-blue · 12 coral-red */
.numbers .num:nth-child(1) b{ color:#F1D24C; text-shadow:0 0 30px rgba(241,210,76,0.32); }   /* лимонено жълто */
.numbers .num:nth-child(2) b{ color:#5FC8F5; text-shadow:0 0 30px rgba(95,200,245,0.32); }   /* детско синьо */
.numbers .num:nth-child(3) b{ color:#EF5B49; text-shadow:0 0 30px rgba(239,91,73,0.32); }    /* коралово червено */
.numbers .num b::after{ content:""; display:block; width:54px; height:1px; margin:22px auto 0;
  background:var(--hz); box-shadow:0 0 14px rgba(207,122,74,0.4);
  transform:scaleX(0); transform-origin:center; transition:transform 1s var(--ease-lux) .9s; }
.numbers .num.is-in b::after{ transform:scaleX(1); }
@media (prefers-reduced-motion: reduce){ .numbers .num b::after{ transform:scaleX(1); transition:none; } }
.numbers .num span{ color:var(--dark-muted); letter-spacing:0.22em; font-size:0.72rem; }

/* ============================================================
   IMOTI (ivory deck) — trust plaques + listing cards
   ============================================================ */
.trust__grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:18px; margin-bottom:64px; }
.trust{ position:relative; padding:30px 22px 26px;
  background:linear-gradient(165deg, #0C2A46, #071E33 80%);   /* midnight lacquer panel — the salon wall */
  border:1px solid rgba(217,196,154,0.20);
  box-shadow:inset 0 0 0 1px rgba(217,196,154,0.06), 0 30px 56px -38px rgba(6,26,45,0.7);
  display:flex; flex-direction:column; gap:10px;
  transition:transform .5s var(--ease), box-shadow .5s var(--ease), border-color .4s; }
.trust:hover{ transform:translateY(-5px); border-color:rgba(217,196,154,0.42);
  box-shadow:inset 0 0 0 1px rgba(217,196,154,0.08), 0 40px 66px -36px rgba(6,26,45,0.8); }
.trust::before{ content:""; position:absolute; top:0; left:0; right:0; height:1px; background:var(--ti-line); }
.trust__n{ font-family:var(--font-serif); font-style:italic; font-size:1.35rem; color:var(--coral); }
.trust h3{ font-family:var(--font-serif); font-weight:600; font-size:1.2rem; color:var(--ivory-hi); line-height:1.15; }
.trust p{ color:var(--dark-muted); font-size:0.94rem; }
@media (max-width:980px){ .trust__grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .trust__grid{ grid-template-columns:1fr; } }
.imoti__sub{ font-family:var(--font-serif); font-weight:600; font-size:1.6rem; color:var(--text-ink); margin-bottom:28px; text-align:center; }
.imoti__cta{ text-align:center; margin-top:44px; }

/* listing cards — titanium hairline turns horizon on hover + varnish sheen */
.lcard{ position:relative; }
.lcard::before{ content:""; position:absolute; top:0; left:0; right:0; height:1px; z-index:6;
  background:var(--ti-line); }
.lcard:hover::before{ background:var(--hz); box-shadow:none; }
.lcard::after{ content:""; position:absolute; inset:0; z-index:5; pointer-events:none;
  background:linear-gradient(115deg, transparent 42%, rgba(251,248,241,0.16) 50%, transparent 58%);
  transform:translateX(-130%) skewX(-4deg); }
.lcard:hover::after{ transform:translateX(130%) skewX(-4deg); transition:transform 1.1s var(--ease); }
.lcard:hover{ box-shadow:0 30px 60px -36px rgba(12,28,48,0.4); }
.lcard__price b{ color:var(--coral-deep) !important; }
.lcard__tag{ color:var(--coral-text) !important; }

/* dcards (if shown) — same hairline language */
.dcard{ position:relative; }
.dcard::before{ content:""; position:absolute; top:0; left:0; right:0; height:1px; z-index:6; background:var(--ti-line); }
.dcard:hover::before{ background:var(--hz); box-shadow:none; }
.dcard:hover{ box-shadow:0 28px 52px -30px rgba(12,28,48,0.3), 0 0 0 1px rgba(207,122,74,0.14); }
.dcard:hover .dcard__body h3{ color:var(--coral-deep); }

/* ============================================================
   VIDEO BANDS — navy scrims, horizon at the waterline (top)
   ============================================================ */
.vband__scrim{ background:
  radial-gradient(125% 125% at 50% 42%, transparent 54%, rgba(6,26,45,0.55) 100%),
  linear-gradient(180deg, rgba(6,26,45,0.55) 0%, rgba(6,26,45,0.4) 45%, rgba(6,26,45,0.7) 100%); }
.cband::before{ background:linear-gradient(180deg, rgba(6,26,45,0.45) 0%, rgba(6,26,45,0.34) 50%, rgba(6,26,45,0.55) 100%); }

/* ============================================================
   PARK VIEW scene — coral rail, navy scrim
   ============================================================ */
.parkview__scrim{ background:linear-gradient(90deg, rgba(6,26,45,0.92) 0%, rgba(6,26,45,0.6) 44%, rgba(6,26,45,0.18) 100%); }
.pv-rail li.is-active{ background:var(--champagne-hi); box-shadow:0 0 12px rgba(233,220,190,0.6); }

/* ============================================================
   ABOUT (ivory deck) — horizon ticks on the points
   ============================================================ */
.about__points li::before{ width:16px; background:linear-gradient(90deg, var(--champagne-deep), rgba(184,154,102,0)); box-shadow:none; }
.about__points strong{ color:var(--text-ink); }
.about__points span, .about__lead{ color:var(--text-muted); }

/* ============================================================
   CONTACT (ivory deck) — form focus = horizon lights up
   ============================================================ */
.contact__form{ position:relative; background:var(--paper-raised); border:1px solid rgba(12,28,48,0.1);
  box-shadow:0 34px 64px -44px rgba(12,28,48,0.4); }
.contact__form::before{ content:""; position:absolute; top:0; left:0; right:0; height:1px; background:var(--ti-line); }
.field input, .field textarea{ background:var(--ivory-hi); border-color:rgba(12,28,48,0.16); color:var(--text-ink); border-radius:2px; }
.field input::placeholder, .field textarea::placeholder{ color:rgba(86,103,122,0.7); }
.field input:focus, .field textarea:focus{
  outline:none; border-color:var(--champagne-deep);
  box-shadow:0 1px 0 0 var(--champagne-deep), 0 10px 24px -16px rgba(184,154,102,0.5); }   /* brass focus ring */
.contact__list a:hover{ color:var(--coral-deep); }
.contact__hint{ color:var(--coral-deep); }

/* ============================================================
   FOOTER — the night sea; horizon line above, coordinates below
   ============================================================ */
.footer{ background:var(--navy-deep); }
.footer::before{ background:radial-gradient(60% 60% at 30% 0%, rgba(207,122,74,0.1), transparent 70%); }
.footer__cta-kicker{ color:var(--champagne); }
.footer__cta-strong::after{ height:1px; background:var(--hz); box-shadow:var(--hz-glow); }
.footer__cta-arrow{ color:var(--coral-hi); }
.footer__cta:hover .footer__cta-strong{ color:var(--coral-hi); }
.footer a:hover{ color:var(--champagne-hi); }
.footer__coords{ font-variant-numeric:tabular-nums; letter-spacing:0.34em; font-size:0.68rem; color:rgba(217,199,160,0.55); }

/* ============================================================
   CHROME — progress as sunset spectrum, intro horizon, to-top
   ============================================================ */
.scroll-progress{ height:2px; background:linear-gradient(90deg, var(--cblue), var(--coral) 62%, var(--champagne-hi)); box-shadow:0 0 12px rgba(207,122,74,0.4); }
.to-top{ background:rgba(6,26,45,0.78); border-color:rgba(169,180,190,0.3); border-radius:50%; }
.to-top:hover{ border-color:var(--coral); color:var(--coral-hi); }
.intro__logo{ display:block; animation:introLogo 1s var(--ease-lux) both; }
.intro__logo .grimit-logo-svg{ width:min(300px,70vw); height:auto; display:block; }
@keyframes introLogo{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }
.intro__line{ background:var(--hz); box-shadow:var(--hz-glow); height:1px; }
@keyframes introLine{ to{ width:min(320px,60vw); } }

/* ============================================================
   HERO — Sofia from above: Vitosha mountain + the twin towers
   (still pulled from the Sofia-aerial footage), slow ken-burns
   ============================================================ */
.hero__media::before{ background:url("../img/hero-sofia.jpg") center/cover; }

/* ============================================================
   PARK VIEW — one screen, no pinned multi-scroll: static entrance
   ============================================================ */
.parkview--scene{ min-height:auto; }
.parkview--scene .parkview__stage{ position:relative; height:auto; min-height:92vh; padding:130px 0; }
.pv-steps{ min-height:0; display:flex; flex-direction:column; gap:16px; }
.pv-step{ position:static; opacity:1; transform:none; transition:none; pointer-events:auto; }
.pv-rail{ display:none !important; }

/* ============================================================
   GRIMIT SYSTEM tabs + tech tiles (hidden sections — kept themed)
   ============================================================ */
/* unified anchor offset for the FIXED header — applies to native anchors
   AND scrollIntoView(); --scroll-offset is kept in sync with the real
   header height by main.js (load + resize). */
:root{ --scroll-offset:88px; }
section[id], [id].section, .pvhero[id]{ scroll-margin-top:var(--scroll-offset); }
.tabs__nav{ display:flex; flex-wrap:wrap; gap:10px; border-bottom:1px solid var(--line-bone); padding-bottom:18px; margin-bottom:40px; }
.tabs__tab{ display:inline-flex; align-items:center; gap:10px; padding:13px 24px; background:transparent; border:1px solid var(--line-bone); color:var(--text-bone-dim); font-family:var(--font-sans); font-size:0.78rem; font-weight:500; letter-spacing:0.03em; cursor:pointer; border-radius:999px; transition:color .35s var(--ease),border-color .35s var(--ease),background .35s var(--ease); }
.tabs__tab .tabs__no{ font-size:0.7rem; color:var(--champagne-deep); letter-spacing:0.08em; }
.tabs__tab:hover{ color:var(--text-bone); border-color:rgba(207,122,74,0.45); }
.tabs__tab.is-active{ color:var(--navy); background:var(--coral); border-color:var(--coral); }
.tabs__tab.is-active .tabs__no{ color:rgba(6,26,45,0.6); }
.tabs__panel{ display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; animation:tabIn .5s var(--ease-lux) both; }
.tabs__panel[hidden]{ display:none; }
@keyframes tabIn{ from{opacity:0;transform:translateY(14px);} to{opacity:1;transform:none;} }
.tabs__copy h3{ font-family:var(--font-serif); font-weight:600; font-size:clamp(1.7rem,3vw,2.3rem); color:var(--text-bone); line-height:1.1; }
.tabs__copy > p{ color:var(--text-bone-dim); margin:16px 0 24px; font-size:1.05rem; line-height:1.6; max-width:46ch; }
.ticks{ list-style:none; display:flex; flex-direction:column; gap:13px; }
.ticks li{ position:relative; padding-left:30px; color:var(--text-bone); font-size:1rem; }
.ticks li::before{ content:""; position:absolute; left:0; top:0.62em; width:16px; height:1px; background:linear-gradient(90deg,var(--champagne-deep),rgba(184,154,102,0)); }
.tabs__visual{ aspect-ratio:4/3; background-size:cover; background-position:center; filter:saturate(0.85) contrast(1.02); border:1px solid var(--line-bone); }
@media (max-width:860px){ .tabs__panel{ grid-template-columns:1fr; gap:26px; } .tabs__visual{ order:-1; aspect-ratio:16/9; } }
.tech__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.tile{ position:relative; padding:32px 28px; background:var(--paper-raised); border:1px solid var(--line-bone); display:flex; flex-direction:column; gap:12px; transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .4s; }
.tile::before{ content:""; position:absolute; top:0; left:0; right:0; height:1px; background:var(--ti-line); }
.tile:hover{ transform:translateY(-5px); border-color:rgba(207,122,74,0.35); box-shadow:0 30px 56px -38px rgba(6,26,45,0.7); }
.tile__ic{ width:42px; height:42px; color:var(--champagne); }
.tile__ic svg{ width:100%; height:100%; }
.tile h3{ font-family:var(--font-serif); font-weight:600; font-size:1.35rem; color:var(--text-bone); line-height:1.15; }
.tile p{ color:var(--text-bone-dim); font-size:0.96rem; }
@media (max-width:880px){ .tech__grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .tech__grid{ grid-template-columns:1fr; } }

/* ============================================================
   PARK VIEW portal — chips as hull pills
   ============================================================ */
.pvfilter{ display:flex; flex-direction:column; gap:14px; align-items:center; margin-bottom:42px; }
.pvfilter__row{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:center; }
.pvfilter__lbl{ font-size:0.66rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--text-bone-dim); margin-right:6px; font-weight:600; }
.chip{ padding:9px 20px; background:transparent; border:1px solid var(--line-bone); color:var(--text-bone-dim); font-family:var(--font-sans); font-size:0.78rem; font-weight:500; cursor:pointer; border-radius:999px; transition:color .3s,border-color .3s,background .3s; }
.chip:hover{ color:var(--text-bone); border-color:rgba(207,122,74,0.45); }
.chip.is-on{ color:var(--navy); background:var(--coral); border-color:var(--coral); }
.pvfilter__count{ font-size:0.82rem; color:var(--champagne-deep); letter-spacing:0.04em; }
.lcard.is-hidden{ display:none; }

/* ============================================================
   NAV one-row + brand lockup
   ============================================================ */
.site-header__inner{ gap:18px; }
.site-nav{ gap:20px; flex-wrap:nowrap; }
.site-nav__link{ white-space:nowrap; font-size:0.74rem; }
.site-header__phone{ white-space:nowrap; font-size:0.8rem; }
.site-header__actions{ gap:12px; }
.btn--nav{ white-space:nowrap; }
.btn--nav .btn__label{ white-space:nowrap; }
@media (max-width:1280px){
  .site-nav{ gap:14px; }
  .site-nav__link{ font-size:0.71rem; letter-spacing:0.04em; }
}
.brand__name{ color:var(--ivory); letter-spacing:0.12em; white-space:nowrap; }
.brand__logo{ display:inline-flex; align-items:center; }
.brand__logo .grimit-logo-svg{ height:40px; width:auto; display:block; }
/* ALL-CORAL logo — unified coral wordmark in header, footer & intro curtain */
.grimit-logo-svg path{ fill:var(--coral) !important; }
.site-header.is-scrolled .brand__logo .grimit-logo-svg{ height:34px; }
.footer .brand__logo .grimit-logo-svg{ height:38px; }
@media (max-width:900px){ .brand__logo .grimit-logo-svg{ height:32px; } }

/* mobile nav drawer — navy glass */
@media (max-width:900px){
  .site-nav{ background:rgba(6,26,45,0.97); }
}

/* ============================================================
   No text-caret / selection on clickable controls
   ============================================================ */
.btn, .footer__cta, .footer__cols a, .footer a, .site-nav__link, .site-header__phone,
.hero__actions a, .hero__cta a, .link, .pcard__go, .carousel__btn, .to-top, .brand,
.tabs__tab, .chip, .lcard__dl, .contact__list a, .nav-burger, .hero__scroll, .pcard{
  -webkit-user-select:none; user-select:none;
}

/* ============================================================
   AWARD POLISH — cinematic film grain over everything
   ============================================================ */
body::after{
  content:""; position:fixed; inset:0; z-index:130; pointer-events:none; opacity:0.05;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E") repeat;
  background-size:180px 180px;
}

/* ============================================================
   AWARD POLISH — editorial section index (01, 02, …) on kickers
   ============================================================ */
body{ counter-reset:sec; }
section .kicker{ counter-increment:sec; }
section .kicker::after{
  content:counter(sec,decimal-leading-zero);
  margin-left:12px; font-family:var(--font-serif); font-style:italic;
  font-size:0.92rem; letter-spacing:0.06em; color:var(--coral); line-height:1;
}
.sec--light .kicker::after{ color:var(--coral-deep); }

/* ============================================================
   AWARD POLISH — The Horizon Line ignites as you arrive
   (JS adds body.hz-anim + .hz-lit per section; no-JS = always lit)
   ============================================================ */
.hero::after, .numbers.sec--dark::before, .vband::before, .footer::after{
  transition:transform 1.9s var(--ease-lux), opacity 1.4s var(--ease);
}
body.hz-anim .hero:not(.hz-lit)::after,
body.hz-anim .numbers.sec--dark:not(.hz-lit)::before,
body.hz-anim .vband:not(.hz-lit)::before,
body.hz-anim .footer:not(.hz-lit)::after{
  transform:translateX(-50%) scaleX(0.16); opacity:0;
}

/* ============================================================
   AWARD POLISH — horizon facts ticker (the crossing)
   ============================================================ */
.ticker{ overflow:hidden; padding:21px 0; background:var(--navy-deep);
  border-top:1px solid rgba(217,196,154,0.14); border-bottom:1px solid rgba(217,196,154,0.10); }
.ticker__track{ display:inline-flex; white-space:nowrap; will-change:transform; animation:tickerRun 56s linear infinite; }
.ticker:hover .ticker__track{ animation-play-state:paused; }
.ticker__set{ display:inline-flex; align-items:center; gap:46px; padding-right:46px; }
.ticker__set i{ font-family:var(--font-serif); font-style:italic; font-weight:500; font-size:clamp(1.05rem,1.5vw,1.4rem); color:var(--champagne); }
.ticker__set b{ color:var(--coral); font-weight:400; }
@keyframes tickerRun{ to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){
  .ticker__track{ animation:none; }
  .ticker__set:last-child{ display:none; }
  .ticker{ text-align:center; }
}

/* ============================================================
   AWARD POLISH — display type scale + italic accent voice
   ============================================================ */
.hero__title{ font-size:clamp(2.6rem,5.6vw,5.2rem); }
.section__title{ font-size:clamp(2.3rem,4.8vw,3.8rem); }
.sec--light .section__title em{ color:var(--coral-deep); }
.cband__title em{ font-style:italic; color:var(--coral); }

/* ============================================================
   AWARD POLISH — choreography details
   ============================================================ */
.site-header::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px;
  background:var(--hz); opacity:0; transition:opacity .7s var(--ease); pointer-events:none; }
.site-header.is-scrolled::after{ opacity:0.65; }
.scroll-progress{ background-size:200% 100%; background-position:calc((1 - var(--sp,0)) * 100%) 50%; }
.carousel__track .pcard:nth-child(2){ --rd:0.08s; }
.carousel__track .pcard:nth-child(3){ --rd:0.16s; }
.carousel__track .pcard:nth-child(4){ --rd:0.24s; }
.listings__grid .lcard:nth-child(2){ --rd:0.1s; }
.listings__grid .lcard:nth-child(3){ --rd:0.2s; }
.lcard__plan img{ transition:transform 1.4s var(--ease); }
.lcard:hover .lcard__plan img{ transform:scale(1.045); }
.footer__cta{ transition:transform .8s var(--ease); }
.footer__cta:hover{ transform:translateX(10px); }

/* ============================================================
   HERO — centered composition (като живия сайт): целият текст
   в средата, мек тъмен радиал зад него за четимост
   ============================================================ */
.hero{ justify-content:center; text-align:center; }
.hero__lead{ margin-left:auto; margin-right:auto; }

/* ============================================================
   JURY ROUND — gallery as editorial mosaic (desktop)
   ============================================================ */
@media (min-width:761px){
  .gallery__grid{ grid-template-columns:repeat(12,1fr); grid-auto-rows:74px; gap:18px; }
  .gallery__img{ height:100%; aspect-ratio:auto; }
  .gallery__item:nth-child(1){ grid-column:1/8; grid-row:span 6; }
  .gallery__item:nth-child(2){ grid-column:8/13; grid-row:span 3; }
  .gallery__item:nth-child(3){ grid-column:8/13; grid-row:span 3; }
  .gallery__item:nth-child(4){ grid-column:1/5; grid-row:span 4; }
  .gallery__item:nth-child(5){ grid-column:5/9; grid-row:span 4; }
  .gallery__item:nth-child(6){ grid-column:9/13; grid-row:span 4; }
}

/* ============================================================
   JURY ROUND — trust plaques: ghost numerals + quincunx stagger
   ============================================================ */
.trust{ overflow:hidden; padding-top:40px; }
.trust__n{ position:absolute; top:2px; right:12px; font-size:4.6rem; line-height:1;
  color:transparent; -webkit-text-stroke:1.5px rgba(217,196,154,0.30); pointer-events:none;
  transition:-webkit-text-stroke-color .4s; }   /* champagne ghost numerals on lacquer — warm to terra on hover */
.trust:hover .trust__n{ -webkit-text-stroke-color:var(--terra); }
@media (min-width:981px){
  .trust:nth-child(even){ margin-top:36px; }
}

/* ============================================================
   JURY ROUND — Park View progress spine (desktop)
   ============================================================ */
@media (min-width:901px){
  .parkview__panel{ position:relative; padding-left:34px; border-left:1px solid rgba(242,237,226,0.16); }
  .pv-rail{ position:absolute; left:-1px; top:10px; flex-direction:column; gap:14px; margin:0; }
  .pv-rail li{ width:2px; height:34px; }
}

/* ============================================================
   JURY ROUND — partners as quiet night strip (section flipped dark)
   ============================================================ */
.partners.sec--dark{ background:var(--navy); }

/* ============================================================
   JURY ROUND — price = serif display moment
   ============================================================ */
.lcard__price{ align-items:baseline; }
.lcard__price b{ font-family:var(--font-serif); font-size:1.45rem; font-weight:600; line-height:1;
  font-variant-numeric:lining-nums tabular-nums; letter-spacing:0.01em; }
.lcard__specs li b{ font-variant-numeric:tabular-nums; }

/* ============================================================
   JURY ROUND — focus-visible coverage for controls the base missed
   ============================================================ */
.lb__close:focus-visible, .lb__nav:focus-visible, .chip:focus-visible,
.tabs__tab:focus-visible, .lcard__dl:focus-visible{
  outline:2px solid var(--coral); outline-offset:3px;
}

/* ============================================================
   Cinematic still band (vband--still) — premium dusk image,
   slow ken-burns; the placeholder for owner's construction media
   ============================================================ */
.vband--still .vband__media{ background-size:cover; background-position:center;
  filter:saturate(0.94) contrast(1.02); will-change:transform;
  animation:kenburns 34s ease-in-out infinite alternate; }
@media (prefers-reduced-motion: reduce){ .vband--still .vband__media{ animation:none; transform:none; } }

/* ============================================================
   Mobile polish
   ============================================================ */
@media (max-width:600px){
  .hero__inner{ padding:100px 0 44px; }
  .hero__title{ font-size:clamp(1.9rem,8vw,2.6rem); }
  .hero__lead{ font-size:1rem; }
  .hero__stats{ font-size:0.66rem; gap:5px 12px; }
  .hero__actions{ flex-direction:column; align-items:stretch; gap:10px; width:100%; max-width:300px; margin-inline:auto; }
  .hero__actions .btn{ width:100%; justify-content:center; }
  .section__title{ font-size:clamp(1.8rem,7vw,2.3rem); }
  .statement__lead{ font-size:clamp(1.45rem,6.4vw,2rem); }
  .tabs__tab{ flex:1 1 100%; justify-content:flex-start; }
  .footer__cta-line{ font-size:clamp(2rem,9vw,2.8rem); }
}