/* =========================================
VL24 QUOTE HERO — SAME AS CONTACT
========================================= */

/* =========================
SECTION BASE
========================= */

.hero.quote-hero{
  background:#f6f7f8;
  padding:120px 0;
  margin-top:-60px;
  position:relative;
  z-index:5;
}

.quote-hero .hero-overlay{
  display:none;
}

/* =========================
LAYOUT
========================= */

.quote-hero .contact-hero-layout{
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:80px;
  align-items:start;
}

@media(max-width:900px){
  .quote-hero .contact-hero-layout{
    grid-template-columns:1fr;
    gap:50px;
  }
}

/* =========================
TITLE
========================= */

.quote-hero .hero-title{
  color:#111;
  margin-bottom:20px;
  line-height:.95;
  letter-spacing:-0.05em;
}

/* =========================
INFO CARDS
========================= */

.quote-hero .contact-info-cards{
  margin-top:40px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}

@media(max-width:900px){
.quote-hero .contact-info-cards{grid-template-columns:1fr;}
}

.quote-hero .contact-info-card{
  display:flex;
  gap:16px;
  padding:22px;
  border-radius:24px;
  background:#fff;
  box-shadow:0 15px 40px rgba(0,0,0,.06);
  transition:.3s ease;
}

.quote-hero .contact-info-card:hover{
  transform:translateY(-3px);
  box-shadow:0 25px 60px rgba(0,0,0,.08);
}

.quote-hero .contact-info-icon{
  width:46px;
  height:46px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#f3f4f6;
}

.quote-hero .contact-info-label{
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#777;
}

.quote-hero .contact-info-value{
  font-size:18px;
  font-weight:600;
  color:#111;
}

.quote-hero .contact-info-sub{
  font-size:14px;
  color:#666;
}

/* =========================
FORM CARD
========================= */

.quote-hero .contact-form-card{
  background:#fff;
  border-radius:32px;
  padding:36px;
  border:1px solid rgba(0,0,0,.05);
  box-shadow:0 30px 90px rgba(0,0,0,.08);
}

.quote-hero .contact-form-header{
  color:#555;
  font-size:18px;
  margin-bottom:28px;
}

/* =========================
FORM INPUTS
========================= */

.quote-hero .contact-form input,
.quote-hero .contact-form textarea,
.quote-hero .contact-form select{

  width:100%;
  padding:16px;
  border-radius:14px;
  border:1px solid transparent;
  background:#f3f4f6;
  color:#111;
  font-weight:600;
}

.quote-hero .contact-form input::placeholder,
.quote-hero .contact-form textarea::placeholder{
  color:#999;
}

.quote-hero .contact-form input:focus,
.quote-hero .contact-form textarea:focus,
.quote-hero .contact-form select:focus{
  background:#fff;
  border:1px solid var(--brand-primary);
  box-shadow:0 0 0 4px rgba(212,225,87,.18);
  outline:none;
}

/* =========================
FORM GRID
========================= */

.quote-hero .contact-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}

@media(max-width:900px){
.quote-hero .contact-grid{grid-template-columns:1fr;}
}

/* =========================
TEXTAREA
========================= */

.quote-hero .contact-form textarea{
  min-height:160px;
  margin:20px 0;
}

/* =========================
UPLOAD
========================= */

.quote-hero .file-upload{
  margin-bottom:20px;
}

.quote-hero .file-label{
  display:flex;
  gap:10px;
  align-items:center;
  cursor:pointer;
  font-weight:600;
}

/* =========================
BUTTON
========================= */

.quote-hero .btn-cta{
  width:100%;
  min-height:56px;
}

/* =====================================
QUOTE HERO — BOTTOM RADIUS + FOOTER OVERLAP
===================================== */

.hero.quote-hero{

  border-radius:60px 60px 60px 60px; /* alumised nurgad */

  margin-bottom:-100px; /* liigub footerile peale */
  position:relative;
  z-index:5;

  overflow:hidden; /* lõikab bg õigesti */
}

/* footer jääb peale */
.site-footer{
  position:relative;
  z-index:10;
}

/* =====================================
QUOTE HERO — FORCE CONTENT INSIDE SECTION
(overrides hero base/cinematic absolute rules)
===================================== */

/* 1) hero ei ole fixed-height/overflow bug */
.hero.quote-hero{
  min-height:auto !important;
  height:auto !important;
}

/* 2) hero-content tagasi normaalsesse flow'sse */
.hero.quote-hero .hero-content{
  position:relative !important;
  inset:auto !important;   /* nullib top/right/bottom/left */
  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  left:auto !important;

  transform:none !important;
  padding:0 !important;    /* võtame core padding maha */
  margin:0 !important;
  z-index:2;
}

/* 3) PÄRIS spacing: layout algab sektsiooni sees */
.hero.quote-hero .contact-hero-layout{
  margin-top:0 !important;
  padding-top: calc(var(--header-h, 80px) - 190px) !important; 
  padding-bottom: 70px !important;
}

/* =====================================
QUOTE HERO — MICRO MOVE UP
===================================== */

.hero.quote-hero .contact-hero-layout{
  transform:translateY(-20px); /* muuda -10px kuni -40px */
}

/* =================================
QUOTE HERO — SAME H2 AS GALLERY
================================= */

.quote-hero h2,
.quote-hero .hero-title{

  font-family:"Outfit",sans-serif;
  font-weight:600;

  font-size:clamp(36px,4vw,56px) !important;
  line-height:1.1;
  letter-spacing:-0.02em;

  margin:0 0 16px;

  background:linear-gradient(
    90deg,
    #111 0%,
    #111 3%,
    #2a3a12 5%,
    var(--brand-primary) 50%,
    #2a3a12 70%,
    #111 90%
  );

  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;

  animation:none !important;
}

/* =================================
VL24 FILE UPLOAD — GLOBAL STYLE
================================= */

.vl24-file input{
  display:none;
}

.vl24-file-btn{

  display:flex;
  align-items:center;
  gap:12px;

  margin-bottom:30px;
  padding:18px 20px;

  border-radius:16px;

  background:#f3f4f6;
  border:1px dashed rgba(0,0,0,.12);

  cursor:pointer;
  transition:.25s;

  font-weight:600;
}

.vl24-file-btn:hover{
  background:#fff;
  border-color:var(--brand-primary);
}

.vl24-file-icon{
  font-size:18px;
}

/* =========================================
QUOTE — FIX BOTTOM GAP (TABLET + MOBILE)
transform creates fake empty space -> use margin instead
========================================= */

@media (max-width:1024px){

  /* 1) ära kasuta transformi (tekitab tühja ala alla) */
  .hero.quote-hero .contact-hero-layout{
    transform:none !important;

    /* 2) päris nihutus üles (mõjub layoutile) */
    margin-top:-10px !important;  /* muuda -10px kuni -40px */

    /* 3) vähem tühja ruumi alla */
    padding-bottom:20px !important; /* 0–20px */
  }

  /* kui tahad veel vähem “tausta õhku” sektsiooni all */
  .hero.quote-hero{
    padding-bottom:40px !important; /* enne 120px */
  }
}

/* MOVE QUOTE CONTENT HIGHER — REAL FIX */
.hero.quote-hero{
  padding-top:120px !important; /* enne 120px */
}

/* MOVE QUOTE CONTENT HIGHER — MOBILE + TABLET ONLY */
@media (max-width:1024px){

  .hero.quote-hero{
    padding-top:50px !important; /* muuda väärtust */
  }

}