/* Kudanil-inspired refresh for RAMIX
   Goal: modern editorial + image-forward feel, without copying any third-party design.
   This file intentionally overrides existing styles while keeping the site structure intact.
*/

:root {
  /* Neutral editorial palette */
  --ramix-bg: #f6f2ea;       /* warm off-white */
  --ramix-surface: #ffffff;
  --ramix-ink: #121212;
  --ramix-muted: rgba(18, 18, 18, 0.68);
  --ramix-hairline: rgba(18, 18, 18, 0.10);

  /* Accent: keep RAMIX gold but make it feel more subtle */
  --ramix-accent: var(--gold);
  --ramix-accent-2: var(--gold-dark);

  /* Layout rhythm */
  --ramix-radius: 14px;
  --ramix-radius-sm: 10px;
  --ramix-gap: clamp(16px, 2.5vw, 36px);
  --ramix-section: clamp(64px, 8vw, 120px);

  /* Type scale */
  --ramix-h1: clamp(2.4rem, 4.6vw, 4.25rem);
  --ramix-h2: clamp(1.9rem, 3.2vw, 3rem);
  --ramix-h3: clamp(1.25rem, 2vw, 1.65rem);

  /* Default image for page headers (Services/Blog/etc.) */
  --ramix-page-header-image: url("https://lh3.googleusercontent.com/pw/AP1GczM-qH6Ta0ctYNXeRM6AqTzaVS3XJEw0gw1EBMUGpWzygHENuYrsC2OfbdabVGAOS3pSJwFOFytzaR6sfYLQ9fDRxPa9Xi9CSbm3eIoB7a1DpA5Qspo=w2400");
}

html { scroll-behavior: smooth; }

body {
  background: var(--ramix-bg);
  color: var(--ramix-ink);
  letter-spacing: 0.01em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Page header (used on Services/Blog/etc.) */
.page-header {
  position: relative;
  overflow: hidden;
  background: #0f1115;
  padding: clamp(86px, 12vh, 140px) 0 clamp(34px, 5vw, 54px);
  border-bottom: 1px solid rgba(255,255,255,0.10);
}

.page-header::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(15,17,21,0.72) 0%, rgba(15,17,21,0.62) 45%, rgba(15,17,21,0.78) 100%),
    var(--ramix-page-header-image);
  background-size: cover;
  background-position: center;
  transform: scale(1.03);
  z-index: 0;
}

.page-header .container {
  position: relative;
  z-index: 1;
}

.page-header h1 {
  color: rgba(255,255,255,0.98);
  text-shadow: none;
}

.page-header .header-desc {
  color: rgba(255,255,255,0.76);
  max-width: 72ch;
}

/* Remove the default gold underline in page headers for a cleaner hero feel */
.page-header h2:after { content: none; }

/* Typography: cleaner, more editorial */
h1 { font-size: var(--ramix-h1); text-shadow: none; }
h2 { font-size: var(--ramix-h2); text-shadow: none; }
h3 { font-size: var(--ramix-h3); text-shadow: none; }

p { color: var(--ramix-muted); }

/* Remove the default gold underline for a calmer feel */
h2:after { content: none; }

/* Containers: a touch wider to feel more image-forward */
.container { max-width: 1240px; }
.container-wide { max-width: 1720px; }

.section { padding: var(--ramix-section) 0; }
.section-light { background: transparent; }
.section-dark {
  background: #0f1115;
  color: rgba(255,255,255,0.86);
}
.section-dark p { color: rgba(255,255,255,0.74); }

/* Header: lighter, calmer, more premium */
header {
  background: rgba(246, 242, 234, 0.72);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--ramix-hairline);
}

header.scrolled {
  background: rgba(246, 242, 234, 0.88);
  border-bottom-color: rgba(18,18,18,0.14);
}

.header-container { padding: 10px 18px; }

nav ul { gap: 28px; }
nav ul li a {
  font-weight: 600;
  font-size: 0.82rem;
  letter-spacing: 0.14em;
}

nav ul li a::after {
  height: 1px;
  opacity: 0.6;
}

/* Language switch: simpler pill */
.lang-selector {
  background: rgba(255,255,255,0.55);
  border: 1px solid rgba(18,18,18,0.12);
}

.lang-selector .lang-link.active {
  background: rgba(18,18,18,0.92);
  border-color: rgba(18,18,18,0.92);
}

/* Buttons: understated outline -> filled on hover */
.btn, .cta-button, .view-button {
  border-radius: 999px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 600;
}

.btn, .cta-button {
  background: rgba(18,18,18,0.90);
  color: #fff;
  border: 1px solid rgba(18,18,18,0.90);
}

.btn:hover, .cta-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 30px rgba(18,18,18,0.16);
}

.btn-gold {
  background: transparent;
  color: var(--ramix-ink);
  border: 1px solid rgba(18,18,18,0.20);
}

.btn-gold:hover {
  background: rgba(18,18,18,0.90);
  border-color: rgba(18,18,18,0.90);
  color: #fff;
}

/* Reduce the glossy pseudo-element effect from the base theme */
.btn:before, .cta-button:before { content: none !important; }

/* Hero: image-forward, minimal overlay. Keeps existing hero markup. */
.hero {
  background: transparent;
  position: relative;
  padding: clamp(80px, 12vh, 140px) 0;
  min-height: 74vh;
  display: grid;
  place-items: center;
  text-align: center;
}

.hero:before { content: none; }

.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(18,18,18,0.42) 0%, rgba(18,18,18,0.34) 44%, rgba(18,18,18,0.55) 100%),
    url("https://lh3.googleusercontent.com/pw/AP1GczM-qH6Ta0ctYNXeRM6AqTzaVS3XJEw0gw1EBMUGpWzygHENuYrsC2OfbdabVGAOS3pSJwFOFytzaR6sfYLQ9fDRxPa9Xi9CSbm3eIoB7a1DpA5Qspo=w2400");
  background-size: cover;
  background-position: center;
  z-index: 0;
}

.hero h1,
.hero .tagline,
.hero .cta-button {
  position: relative;
  z-index: 1;
}

.hero h1 { color: #fff; max-width: 18ch; }
.hero .tagline { color: rgba(255,255,255,0.78); max-width: 60ch; }

/* Feature cards: more editorial + less shadowy */
.features {
  width: min(1240px, 92vw);
  margin: 0 auto;
  gap: var(--ramix-gap);
}

.feature-card {
  background: rgba(255,255,255,0.8);
  border: 1px solid rgba(18,18,18,0.10);
  border-radius: var(--ramix-radius);
  box-shadow: none;
}

.feature-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px rgba(18,18,18,0.10);
}

.feature-card h3 { letter-spacing: 0.02em; }
.feature-card p { color: rgba(18,18,18,0.66); }

/* Services page components */
.service-item-elegant,
.process-step,
.cta-section.white-bg {
  background: rgba(255,255,255,0.84) !important;
  border: 1px solid rgba(18,18,18,0.10) !important;
  border-radius: var(--ramix-radius) !important;
  box-shadow: none !important;
}

.service-item-elegant {
  padding: clamp(18px, 3.2vw, 38px) !important;
}

.service-item-elegant:hover,
.process-step:hover {
  box-shadow: 0 18px 40px rgba(18,18,18,0.10) !important;
}

.service-item-elegant,
.service-item-elegant.reverse {
  border-left: 0 !important;
  border-right: 0 !important;
}

.service-icon img {
  filter: brightness(0) saturate(100%) invert(58%) sepia(60%) saturate(442%) hue-rotate(7deg) brightness(94%) contrast(85%) !important;
  opacity: 0.96;
}

.service-description,
.lead {
  color: rgba(18,18,18,0.66) !important;
}

.section-divider {
  background-color: rgba(18,18,18,0.10) !important;
}

.step-number {
  background: rgba(18,18,18,0.92) !important;
  box-shadow: 0 10px 24px rgba(18,18,18,0.16) !important;
}

/* Blog cards */
.blog-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 2.2vw, 24px);
}

.blog-card {
  background: rgba(255,255,255,0.84);
  border: 1px solid rgba(18,18,18,0.10);
  border-radius: var(--ramix-radius);
  overflow: hidden;
  box-shadow: none;
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.blog-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 40px rgba(18,18,18,0.10);
}

.blog-card img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.blog-card-content {
  padding: 16px 16px 18px;
}

.blog-card-title {
  margin: 0 0 8px;
  letter-spacing: 0.02em;
}

.blog-card-title a {
  color: inherit;
}

.blog-card-meta {
  color: rgba(18,18,18,0.56);
  font-size: 0.9rem;
  margin-bottom: 10px;
}

.blog-card-excerpt {
  margin: 0 0 12px;
  color: rgba(18,18,18,0.66);
}

.blog-card-link {
  color: rgba(18,18,18,0.92);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 0.78rem;
}

.blog-card-link:hover {
  color: rgba(18,18,18,1);
}

@media (max-width: 980px) {
  .blog-grid {
    grid-template-columns: 1fr;
  }
}

/* Slideshow: cleaner controls */
.property-slideshow {
  border-radius: var(--ramix-radius);
  overflow: hidden;
  background: #0d0f12;
  box-shadow: 0 18px 60px rgba(18,18,18,0.12);
}

/* Homepage compact About cards (replaces slideshow) */
.home-about-mini.section {
  padding: clamp(32px, 4.5vw, 58px) 0;
}

.mini-about-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 2.2vw, 24px);
  align-items: stretch;
}

.mini-about-card {
  background: rgba(255,255,255,0.82);
  border: 1px solid rgba(18,18,18,0.10);
  border-radius: var(--ramix-radius);
  overflow: hidden;
  box-shadow: none;
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.mini-about-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 40px rgba(18,18,18,0.10);
}

.mini-about-media {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: rgba(18,18,18,0.06);
}

.mini-about-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.mini-about-body {
  padding: 16px 16px 18px;
}

.mini-about-body h3 {
  margin: 0 0 8px;
  letter-spacing: 0.02em;
}

.mini-about-body p {
  margin: 0;
  color: rgba(18,18,18,0.66);
  line-height: 1.55;
}

/* Contact section: calmer, premium form card */
.contact-section {
  padding: var(--ramix-section) 0;
  position: relative;
  overflow: hidden;
}

/* Soft background accents behind the form card */
.contact-section::before,
.contact-section::after {
  content: "";
  position: absolute;
  inset: auto;
  width: min(780px, 70vw);
  height: min(780px, 70vw);
  border-radius: 999px;
  filter: blur(44px);
  opacity: 0.45;
  pointer-events: none;
  z-index: 0;
}

.contact-section::before {
  top: -240px;
  left: -260px;
  background: radial-gradient(circle at 30% 30%, rgba(212,170,79,0.42), transparent 62%);
}

.contact-section::after {
  bottom: -280px;
  right: -260px;
  background: radial-gradient(circle at 60% 40%, rgba(18,18,18,0.24), transparent 60%);
}

.contact-section .contact-container.single {
  max-width: 980px;
  position: relative;
  z-index: 1;
}

.contact-section .contact-form-container {
  background: rgba(255,255,255,0.74);
  border: 1px solid rgba(18,18,18,0.08);
  border-radius: calc(var(--ramix-radius) + 4px);
  box-shadow:
    0 30px 90px rgba(18,18,18,0.12),
    0 12px 32px rgba(18,18,18,0.08),
    inset 0 1px 0 rgba(255,255,255,0.65);
  padding: clamp(32px, 4vw, 56px);
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

/* Bring back the gold accent stripe (premium, not loud) */
.contact-section .contact-form-container:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 5px;
  height: 100%;
  background: linear-gradient(180deg, rgba(212,170,79,1) 0%, rgba(192,144,41,1) 50%, rgba(147,112,31,1) 100%);
  border-top-left-radius: var(--ramix-radius);
  border-bottom-left-radius: var(--ramix-radius);
  z-index: 0;
}

/* Subtle sheen for a more premium, modern feel */
.contact-section .contact-form-container:after {
  content: '';
  position: absolute;
  inset: -40% -20% auto -20%;
  height: 70%;
  background: radial-gradient(circle at 40% 30%, rgba(255,255,255,0.55), rgba(255,255,255,0.0) 60%);
  transform: rotate(-8deg);
  z-index: 0;
  pointer-events: none;
}

/* Ensure content stays above accent stripe */
.contact-section .contact-form-container > * {
  position: relative;
  z-index: 1;
}

.contact-section .contact-form-container:hover {
  transform: translateY(-4px);
  border-color: rgba(18,18,18,0.12);
  box-shadow:
    0 40px 110px rgba(18,18,18,0.14),
    0 16px 40px rgba(18,18,18,0.10),
    inset 0 1px 0 rgba(255,255,255,0.70);
}

.contact-section .form-header {
  margin-bottom: 18px;
  gap: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.contact-section .form-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(147,112,31,1) 0%, rgba(192,144,41,1) 55%, rgba(212,170,79,1) 100%);
  border: 1px solid rgba(192,144,41,0.55);
  color: #ffffff;
  font-size: 18px;
  box-shadow:
    0 14px 30px rgba(192,144,41,0.18),
    inset 0 1px 0 rgba(255,255,255,0.35);
}

.contact-section .form-header h2 {
  font-size: clamp(1.55rem, 2.2vw, 2rem);
  margin: 0;
  display: block;
  text-align: center;
  text-wrap: balance;
}

.contact-section .elegant-form .form-group {
  margin-bottom: 28px;
}

.contact-section .floating-label input,
.contact-section .floating-label textarea {
  border-radius: var(--ramix-radius-sm);
  border: 1px solid rgba(18,18,18,0.12);
  background: rgba(255,255,255,0.70);
  box-shadow: none;
  padding: 1.25rem 1.15rem;
  font-size: 1.08rem;
  transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.contact-section .floating-label input:hover,
.contact-section .floating-label textarea:hover {
  border-color: rgba(18,18,18,0.18);
  background: rgba(255,255,255,0.82);
}

.contact-section .floating-label textarea {
  min-height: 160px;
}

.contact-section .floating-label label {
  color: rgba(18,18,18,0.64);
}

.contact-section .floating-label input:focus,
.contact-section .floating-label textarea:focus,
.contact-section .floating-label input:not(:placeholder-shown),
.contact-section .floating-label textarea:not(:placeholder-shown) {
  border-color: rgba(192,144,41,0.55);
  background: rgba(255,255,255,0.92);
  box-shadow:
    0 0 0 4px rgba(192,144,41,0.18),
    0 10px 22px rgba(18,18,18,0.08);
}

.contact-section .floating-label input:focus + label,
.contact-section .floating-label textarea:focus + label,
.contact-section .floating-label input:not(:placeholder-shown) + label,
.contact-section .floating-label textarea:not(:placeholder-shown) + label {
  color: rgba(18,18,18,0.86);
}

.contact-section .input-focus-border {
  display: none;
}

/* Submit button: make it feel like a primary CTA */
.contact-section .btn.btn-gold {
  background: linear-gradient(135deg, rgba(147,112,31,1) 0%, rgba(192,144,41,1) 55%, rgba(212,170,79,1) 100%);
  color: #ffffff;
  border-color: rgba(192,144,41,0.65);
  min-height: 54px;
  font-size: 1.08rem;
  padding: 0 2.2rem;
}

.contact-section .btn.btn-gold:hover {
  filter: brightness(0.96) saturate(1.05);
  box-shadow: 0 14px 34px rgba(192,144,41,0.22);
}

.contact-section .btn-submit .btn-text,
.contact-section .btn-submit .btn-icon {
  color: #ffffff;
}

.contact-section .btn-submit {
  min-height: 50px;
}

/* Form submission message: more modern, consistent with the card */
.contact-section .form-message {
  border-radius: 12px;
  border: 1px solid rgba(18,18,18,0.10);
  background: rgba(255,255,255,0.78);
  box-shadow: 0 14px 34px rgba(18,18,18,0.10);
  margin-top: 2.2rem;
  margin-bottom: 1.2rem;
  padding: 1.1rem 1.4rem;
  font-size: 1.04rem;
}

.contact-section .form-message.success {
  border-color: rgba(76, 175, 80, 0.22);
  background: rgba(76, 175, 80, 0.08);
}

.contact-section .form-message.error {
  border-color: rgba(244, 67, 54, 0.22);
  background: rgba(244, 67, 54, 0.08);
}

@media (max-width: 480px) {
  .contact-section .contact-form-container {
    padding: 18px;
  }
  .contact-section .form-icon {
    width: 38px;
    height: 38px;
  }
}

@media (max-width: 980px) {
  .mini-about-grid {
    grid-template-columns: 1fr;
  }
  .mini-about-media {
    aspect-ratio: 21 / 9;
  }
}

.slideshow-nav button {
  background: rgba(255,255,255,0.84);
  border: 1px solid rgba(18,18,18,0.10);
  color: rgba(18,18,18,0.90);
  width: 42px;
  height: 42px;
  border-radius: 999px;
}

.slideshow-nav button:hover {
  background: rgba(255,255,255,0.96);
}

.slideshow-controls { opacity: 0.8; }

.slideshow-dot {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: rgba(255,255,255,0.36);
}

.slideshow-dot.active { background: rgba(255,255,255,0.92); }

/* About gallery layout (used on LV/EN About pages) */
.about-gallery {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: var(--ramix-gap);
  align-items: start;
}

.about-gallery .property-slideshow { height: clamp(360px, 42vw, 560px); }

.about-gallery-panel {
  background: rgba(255,255,255,0.82);
  border: 1px solid rgba(18,18,18,0.10);
  border-radius: var(--ramix-radius);
  padding: clamp(18px, 3vw, 34px);
}

.about-gallery-panel h2 { margin-bottom: 0.75rem; }

.about-gallery-panel .btn,
.about-gallery-panel .cta-button { width: 100%; text-align: center; }

@media (max-width: 992px) {
  .about-gallery { grid-template-columns: 1fr; }
  .about-gallery .property-slideshow { height: 360px; }
}

/* Footer: tighter spacing + cleaner grid */
footer {
  margin-top: clamp(56px, 7vw, 96px);
  padding: clamp(48px, 6vw, 72px) 0 0;
  background: #0f1115;
  color: rgba(255,255,255,0.84);
  border-top: 1px solid rgba(255,255,255,0.08);
}

footer a { color: rgba(255,255,255,0.80); }
footer a:hover { color: rgba(255,255,255,0.96); }

.footer-content {
  width: min(1240px, 92vw);
  margin: 0 auto;
  padding: 0 0 clamp(28px, 4vw, 44px);
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: clamp(16px, 3vw, 36px);
  align-items: start;
}

.footer-social {
  align-items: flex-start;
  justify-content: flex-start;
}

.social-icons {
  gap: 12px;
  margin-top: 0;
}

.social-icons a {
  width: 42px;
  height: 42px;
  background-color: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.10);
}

.social-icons a:hover {
  background-color: rgba(255,255,255,0.14);
  transform: translateY(-2px);
}

.footer-social h4,
.footer-links h4,
.footer-contact h4,
.footer-rekviziti h4 {
  color: rgba(255,255,255,0.94);
  font-size: 0.82rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 700;
  font-family: var(--font-primary);
  margin-bottom: 14px;
  padding-bottom: 10px;
}

.footer-social h4:after,
.footer-links h4:after,
.footer-contact h4:after,
.footer-rekviziti h4:after {
  background: rgba(255,255,255,0.16);
  height: 1px;
  width: 46px;
}

.footer-links ul li { margin-bottom: 0.55rem; }
.footer-links a {
  opacity: 0.85;
  text-underline-offset: 3px;
}
.footer-links a:hover { opacity: 1; text-decoration: underline; }

.footer-contact p,
.footer-rekviziti p {
  color: rgba(255,255,255,0.78);
  opacity: 1;
  margin-bottom: 0.55rem;
}

.footer-bottom {
  background: transparent;
  border-top: 1px solid rgba(255,255,255,0.08);
  margin-top: clamp(18px, 3vw, 34px);
  padding: 18px 0;
}

.footer-bottom p {
  width: min(1240px, 92vw);
  margin: 0 auto;
  color: rgba(255,255,255,0.70);
  font-size: 0.92rem;
}

@media (max-width: 1100px) {
  .footer-content {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 767px) {
  .footer-content {
    grid-template-columns: 1fr;
    text-align: left;
  }

  .footer-social,
  .footer-links,
  .footer-contact,
  .footer-rekviziti {
    align-items: flex-start;
    text-align: left;
  }

  .footer-social h4:after,
  .footer-links h4:after,
  .footer-contact h4:after,
  .footer-rekviziti h4:after {
    left: 0;
    transform: none;
  }

  .footer-bottom {
    padding-bottom: calc(18px + env(safe-area-inset-bottom));
  }
}