/* ==========================================================================
   Vitrin theme — photo-led, loaded after site.css when the theme is active.
   Tokens are overridden first; component rules follow.
   ========================================================================== */

.theme-vitrin {
  --paper: #F6F3ED;
  --paper-2: #EDE7DC;
  --paper-3: #E2DACB;
  --ink: #16191A;
  --ink-2: #2A2E2F;
  --ink-3: #4C4F4D;
  --muted: #74706A;
  --faint: #A09A90;
  --line: #E0D9CC;
  --line-strong: #C9C0B0;
  --accent-ink: #16191A;
  --dark: #121516;
  --dark-2: #1B1F20;
  --dark-line: rgba(246, 243, 237, .16);
  --dark-muted: #B3ADA3;
  --font: "Manrope", "Helvetica Neue", Arial, sans-serif;
  --display: "Fraunces", Georgia, "Times New Roman", serif;
  --mono: "Manrope", "Helvetica Neue", Arial, sans-serif;
  --r: 0px;
  --header-h: 84px;
  font-variation-settings: normal;
}

.theme-vitrin .mono { font-size: 11.5px; font-weight: 600; letter-spacing: .14em; }

/* ---------- type ---------- */
.theme-vitrin .hero-title, .theme-vitrin .page-title, .theme-vitrin .section-title, .theme-vitrin .cta-title,
.theme-vitrin .vhero-title, .theme-vitrin .h3, .theme-vitrin .pcard-title, .theme-vitrin .prose h2, .theme-vitrin .prose h3 {
  font-family: var(--display); font-weight: 400; letter-spacing: -.015em; font-variation-settings: "opsz" 120;
}
.theme-vitrin .page-title { font-size: clamp(38px, 5.4vw, 72px); line-height: 1.02; }
.theme-vitrin .section-title { font-size: clamp(30px, 3.8vw, 50px); line-height: 1.06; }
.theme-vitrin .cta-title { font-size: clamp(32px, 4.2vw, 56px); line-height: 1.04; }
.theme-vitrin .section-title em, .theme-vitrin .page-title em { font-style: italic; color: var(--accent); }
.theme-vitrin .service-body strong, .theme-vitrin .service-card strong, .theme-vitrin .area-card strong,
.theme-vitrin .list-card-body strong, .theme-vitrin .post-row strong, .theme-vitrin .quote p, .theme-vitrin .steps li strong,
.theme-vitrin .side-cta strong, .theme-vitrin .contact-big {
  font-family: var(--display); font-weight: 400; letter-spacing: -.01em;
}
.theme-vitrin .stats-grid dd { font-family: var(--display); font-weight: 300; letter-spacing: -.02em; font-variation-settings: "opsz" 144; }
.theme-vitrin .section-kicker > span:last-child::before { width: 40px; }

/* ---------- buttons ---------- */
.theme-vitrin .btn { font-weight: 600; letter-spacing: .02em; }
.theme-vitrin .btn-accent { color: var(--accent-ink); }
.theme-vitrin .btn-accent:hover { background: #fff; color: var(--ink); border-color: #fff; }
.btn-light { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .65); }
.btn-light:hover { background: #fff; color: var(--ink); border-color: #fff; }

/* ---------- header: dark everywhere, transparent over photos ---------- */
.theme-vitrin .topline { display: none; }
.theme-vitrin .site-header { background: var(--dark); color: #fff; border-bottom: 1px solid var(--dark-line); backdrop-filter: none; transition: background-color .25s, border-color .25s; }
.theme-vitrin:has(.photo-top) .site-header { position: fixed; left: 0; right: 0; top: 0; background: linear-gradient(rgba(0, 0, 0, .45), transparent); border-bottom-color: transparent; }
.theme-vitrin:has(.photo-top) .site-header.is-scrolled { background: rgba(18, 21, 22, .94); backdrop-filter: blur(12px); border-bottom-color: var(--dark-line); }
.theme-vitrin .nav > ul > li > a { color: rgba(255, 255, 255, .86); font-weight: 500; letter-spacing: .01em; }
.theme-vitrin .nav > ul > li > a:hover, .theme-vitrin .nav > ul > li > a[aria-current="page"] { color: #fff; border-bottom-color: var(--accent); }
.theme-vitrin .nav .sub { background: var(--dark); border-top: 2px solid var(--accent); }
.theme-vitrin .logo-mark { background: #fff; }
.theme-vitrin .site-header .logo-words span { color: rgba(255, 255, 255, .6); }
.theme-vitrin .logo-words b { font-family: var(--display); font-weight: 500; text-transform: none; font-size: 22px; letter-spacing: -.01em; }
.theme-vitrin .logo-words span { letter-spacing: .3em; }
.theme-vitrin .header-phone { color: #fff; }
.theme-vitrin .burger { border-color: rgba(255, 255, 255, .35); }
.theme-vitrin .burger span { background: #fff; }

/* ---------- home hero ---------- */
.vhero { position: relative; min-height: max(640px, 100svh); display: flex; flex-direction: column; justify-content: flex-end; color: #fff; background: var(--dark); overflow: hidden; }
.vhero-media { position: absolute; inset: 0; }
.vhero-slide { position: absolute; inset: 0; margin: 0; opacity: 0; transition: opacity 1.2s ease; }
.vhero-slide.is-active { opacity: 1; }
.vhero-slide img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.06); transition: transform 7s ease-out; }
.vhero-slide.is-active img { transform: scale(1); }
.vhero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, calc(var(--overlay) * .55)) 35%, rgba(0, 0, 0, calc(var(--overlay) + .2)) 100%); pointer-events: none; }
.vhero-inner { position: relative; z-index: 1; padding: calc(var(--header-h) + 48px) 0 56px; }
.vhero-copy { max-width: 820px; }
.vhero-kicker { display: inline-flex; align-items: center; gap: 14px; font-size: 12px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: rgba(255, 255, 255, .85); margin-bottom: 26px; }
.vhero-kicker::before { content: ""; width: 44px; height: 1px; background: var(--accent); }
.vhero-title { font-size: clamp(44px, 7vw, 100px); line-height: .98; text-wrap: balance; }
.vhero-text { font-size: clamp(17px, 1.6vw, 20px); line-height: 1.6; color: rgba(255, 255, 255, .86); max-width: 58ch; margin: 28px 0 36px; }
.vhero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.vhero-bar { position: relative; z-index: 1; border-top: 1px solid rgba(255, 255, 255, .2); background: rgba(10, 12, 13, .35); backdrop-filter: blur(8px); }
.vhero-bar-inner { display: grid; grid-template-columns: 1fr auto auto; gap: 40px; align-items: center; min-height: 92px; }
.vhero-captions { position: relative; min-height: 44px; }
.vhero-caption { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; gap: 2px; opacity: 0; transition: opacity .6s; pointer-events: none; }
.vhero-caption.is-active { opacity: 1; pointer-events: auto; }
.vhero-caption span { font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--accent); }
.vhero-caption a, .vhero-caption strong { display: inline-flex; align-items: center; gap: 8px; font-family: var(--display); font-size: 21px; font-weight: 400; }
.vhero-caption a:hover { text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }
.vhero-facts { display: flex; gap: 36px; }
.vhero-facts dd { font-family: var(--display); font-size: 30px; font-weight: 300; line-height: 1; }
.vhero-facts dt { font-size: 12px; color: rgba(255, 255, 255, .7); margin-top: 4px; }
.vhero-dots { display: flex; gap: 8px; }
.vhero-dots button { width: 28px; height: 3px; padding: 0; border: 0; background: rgba(255, 255, 255, .35); cursor: pointer; transition: background .2s, width .2s; }
.vhero-dots button.is-active { width: 48px; background: var(--accent); }

/* ---------- page heroes with photos ---------- */
.theme-vitrin .page-hero { padding-top: clamp(40px, 6vw, 80px); }
.theme-vitrin .page-hero.has-image, .theme-vitrin .detail-head-photo {
  position: relative; display: flex; align-items: flex-end; min-height: clamp(420px, 58vh, 620px);
  padding: calc(var(--header-h) + 60px) 0 clamp(40px, 5vw, 64px); color: #fff; background: var(--dark); border: 0; overflow: hidden;
}
.theme-vitrin .detail-head-photo { min-height: clamp(480px, 72vh, 760px); }
.theme-vitrin .page-hero.has-image .wrap, .theme-vitrin .detail-head-photo .wrap { position: relative; z-index: 1; width: min(var(--wrap), 100% - 2 * var(--gutter)); }
.theme-vitrin .page-hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 1; }
.theme-vitrin .page-hero.has-image::after, .theme-vitrin .detail-head-photo::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(0, 0, 0, .55) 0%, rgba(0, 0, 0, calc(var(--overlay) * .6)) 40%, rgba(0, 0, 0, calc(var(--overlay) + .22)) 100%);
}
.theme-vitrin .page-hero.has-image .crumbs, .theme-vitrin .detail-head-photo .crumbs,
.theme-vitrin .page-hero.has-image .crumbs [aria-current], .theme-vitrin .detail-head-photo .crumbs [aria-current] { color: rgba(255, 255, 255, .8); }
.theme-vitrin .page-hero.has-image .crumbs a:hover, .theme-vitrin .detail-head-photo .crumbs a:hover { color: #fff; }
.theme-vitrin .page-hero.has-image .page-kicker, .theme-vitrin .detail-head-photo .page-kicker { color: var(--accent); }
.theme-vitrin .detail-head-photo .page-kicker [class^="tone-text"] { color: #fff; }
.theme-vitrin .page-hero.has-image .page-text { color: rgba(255, 255, 255, .88); opacity: 1; }
.theme-vitrin .detail-head-photo .detail-location { color: rgba(255, 255, 255, .88); }
.theme-vitrin .detail-head-photo .detail-location svg.i { color: var(--accent); }
.theme-vitrin .detail-head-photo .detail-title-row { width: 100%; align-items: flex-end; }
.theme-vitrin .detail-head-photo .partner-box { background: rgba(18, 21, 22, .78); color: #fff; border-color: rgba(255, 255, 255, .25); backdrop-filter: blur(8px); }
.theme-vitrin .detail-head-photo .partner-box .muted { color: rgba(255, 255, 255, .7); }
.theme-vitrin .detail-head-photo + .wrap .detail-grid { margin-top: clamp(40px, 5vw, 64px); }
.theme-vitrin .page-hero.has-image .type-tabs a { border-color: rgba(255, 255, 255, .4); color: #fff; }
.theme-vitrin .page-hero.has-image .type-tabs a[aria-current="page"], .theme-vitrin .page-hero.has-image .type-tabs a:hover { background: #fff; color: var(--ink); border-color: #fff; }

/* ---------- project & land cards: text on the photo ---------- */
.theme-vitrin .pcard { position: relative; overflow: hidden; background: var(--dark); }
.theme-vitrin .pcard-media { border: 0; }
.theme-vitrin .pcard .cover { aspect-ratio: 4 / 5 !important; }
.theme-vitrin .pcard .cover::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 35%, rgba(0, 0, 0, .82) 100%); pointer-events: none; }
.theme-vitrin .pcard .cover-placeholder { color: #fff; background: linear-gradient(var(--angle, 35deg), #2B3031, #171A1B); }
.theme-vitrin .pcard .cover-placeholder svg { opacity: .35; }
.theme-vitrin .pcard .cover-index, .theme-vitrin .pcard .cover-label { display: none; }
.theme-vitrin .pcard-body { position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 24px 22px; color: #fff; gap: 6px; pointer-events: none; z-index: 1; }
.theme-vitrin .pcard-body a { pointer-events: auto; }
.theme-vitrin .pcard-kicker { color: var(--accent); }
.theme-vitrin .pcard-title { font-size: 27px; line-height: 1.12; }
.theme-vitrin .pcard-title a:hover { border-bottom-color: var(--accent); }
.theme-vitrin .pcard-text { display: none; }
.theme-vitrin .pcard-meta { color: rgba(255, 255, 255, .72); border-top-color: rgba(255, 255, 255, .22); text-transform: none; letter-spacing: .02em; font-size: 13px; font-weight: 500; }
.theme-vitrin .pcard-status { top: 18px; left: 18px; background: rgba(18, 21, 22, .62); color: #fff; backdrop-filter: blur(6px); border-left-width: 2px; z-index: 1; }
.theme-vitrin .pcard-partner { top: 18px; right: 18px; bottom: auto; z-index: 1; }
.theme-vitrin .pcard:hover .cover img { transform: scale(1.05); }
.theme-vitrin .grid-3 { gap: 20px; }

/* ---------- sections ---------- */
.theme-vitrin .section-sand { background: var(--paper-2); }
.theme-vitrin .service-icon { border-radius: 50%; border-color: var(--line-strong); color: var(--accent); background: transparent; }
.theme-vitrin .service-row { padding: 26px 0; }
.theme-vitrin .service-body strong { font-size: 24px; }
.theme-vitrin .service-cards { background: var(--line); border-color: var(--line); }
.theme-vitrin .service-card strong { font-size: 26px; }
.theme-vitrin .area-chips a { border-radius: 999px; font-weight: 500; }
.theme-vitrin .area-chips a svg.i { color: var(--accent); }
.theme-vitrin .quote p { font-size: 22px; line-height: 1.4; }
.theme-vitrin .quote-mark { color: var(--accent); }
.theme-vitrin .faq-item summary { font-family: var(--display); font-weight: 400; font-size: 20px; }
.theme-vitrin .hero-plan, .theme-vitrin .list-card-media { border-color: var(--line); }
.theme-vitrin .list-card-body strong { font-size: 21px; }

/* CTA: dark band with accent rule */
.theme-vitrin .cta-band { background: var(--dark); color: #fff; border-top: 3px solid var(--accent); }
.theme-vitrin .cta-band .section-kicker, .theme-vitrin .cta-band .section-number { color: var(--accent); opacity: 1; }
.theme-vitrin .cta-text { color: rgba(255, 255, 255, .78); }
.theme-vitrin .cta-actions .btn-accent { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.theme-vitrin .cta-actions .btn-accent:hover { background: #fff; border-color: #fff; color: var(--ink); }

/* detail pages */
.theme-vitrin .spec-card, .theme-vitrin .side-nav { border-color: var(--line); background: #fff; }
.theme-vitrin .side-cta { background: var(--dark); }
.theme-vitrin .gallery { gap: 6px; }
.theme-vitrin .gallery-item { border: 0; }
.theme-vitrin .contact-form-wrap { background: #fff; border-color: var(--line); }

/* footer */
.theme-vitrin .site-footer { background: var(--dark); }
.theme-vitrin .footer-col h3 { color: var(--accent); }

/* ---------- responsive ---------- */
@media (max-width: 960px) {
  .theme-vitrin .nav { inset: var(--header-h) 0 0 0; background: var(--dark); }
  .theme-vitrin .nav > ul > li > a { color: #fff; border-bottom-color: var(--dark-line); }
  .theme-vitrin .nav .sub a { color: var(--dark-muted); }
  .theme-vitrin .nav .sub { border-top: 0; }
  .vhero-bar-inner { grid-template-columns: 1fr; gap: 14px; padding: 18px 0; }
  .vhero-facts { gap: 28px; }
}
@media (max-width: 640px) {
  .theme-vitrin { --header-h: 68px; }
  .theme-vitrin .logo-words b { font-size: 19px; }
  .vhero { min-height: max(600px, 92svh); }
  .vhero-inner { padding-bottom: 36px; }
  .vhero-actions .btn { flex: 1 1 100%; }
  .vhero-captions { display: none; }
  .vhero-facts dd { font-size: 24px; }
  .theme-vitrin .pcard .cover { aspect-ratio: 4 / 4.4 !important; }
  .theme-vitrin .pcard-title { font-size: 24px; }
}
