/* v5: client feedback round, 2026-10-11 (Juhász István's comments on v4 + his email).
   Loaded last on every page. Brings back the warm stone colours of the client's previous site
   (cream, sand, bronze, olive-brown) in the sections he called too grey or too black. */
:root {
  --v5-cream: #f4efe8;
  --v5-sand: #eae3dc;
  --v5-bronze: #9e7c58;
  --v5-bronze-ink: #7a5c3c;
  --v5-olive: #73735c;
  --v5-brown: #3a2f26;
  --v5-ease: cubic-bezier(.22, .8, .24, 1);
}

/* ---------- 23ff5d0e + 2f494e1c: filter labels looked blurred (shadow on dark text) ---------- */
.filter-buttons button, .filter-buttons button * { text-shadow: none !important; }

/* ---------- 4290f041: bigger hero type on the inner pages ---------- */
.new-page .story-hero h1 { font-size: clamp(2.5rem, 4.1vw, 3.5rem) !important; max-width: 20ch; }
.new-page .story-hero .story-hero-copy > p { font-size: 1.32rem; line-height: 1.65; max-width: 660px; }
.new-page .story-hero .section-subtitle { font-size: .95rem; }
@media (max-width: 760px) {
  .new-page .story-hero h1 { font-size: 2.35rem !important; }
  .new-page .story-hero .story-hero-copy > p { font-size: 1.12rem; }
}

/* ---------- 9e4f2517, decba82c, 6b7e98da: process steps as moving tiles that grow on hover ---------- */
.new-page .process-rail { gap: 20px; align-items: stretch; }
.new-page .process-rail li,
.new-page.rolunk .process-rail li {
  position: relative; border: 0; border-top: 3px solid var(--v5-bronze); border-radius: 12px; padding: 26px 22px 24px;
  background: linear-gradient(rgba(255, 252, 247, .86), rgba(255, 252, 247, .86)), url('assets/decor/v5-stone-terra.webp') center / cover;
  box-shadow: 0 10px 26px -14px rgba(58, 47, 38, .45);
  transition: transform .45s var(--v5-ease), box-shadow .45s var(--v5-ease), border-color .3s;
  animation: v5-float 7s ease-in-out infinite; will-change: transform;
}
.new-page .process-rail li:nth-child(2) { animation-delay: -1.4s; }
.new-page .process-rail li:nth-child(3) { animation-delay: -2.8s; }
.new-page .process-rail li:nth-child(4) { animation-delay: -4.2s; }
.new-page .process-rail li:nth-child(5) { animation-delay: -5.6s; }
.new-page .process-rail li:hover {
  transform: scale(1.07); z-index: 2; border-top-color: var(--brand, #E90117); animation-play-state: paused;
  box-shadow: 0 26px 48px -18px rgba(58, 47, 38, .6);
}
.new-page .process-rail li > span { margin-bottom: 16px; }
.new-page .process-rail p { color: #4a4039; }
@keyframes v5-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -6px; } }
@media (max-width: 900px) {
  .new-page .process-rail { gap: 14px; }
  .new-page .process-rail li { padding: 20px 18px; }
  .new-page .process-rail li:hover { transform: scale(1.02); }
}

/* ---------- 3e405869: consultation options as three photo tiles side by side ---------- */
.v5-consult-tiles { list-style: none; margin: 44px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.v5-ct {
  display: flex; flex-direction: column; overflow: hidden; border-radius: 14px; background: #fffdf9;
  box-shadow: 0 14px 34px -18px rgba(58, 47, 38, .5); border-bottom: 3px solid var(--v5-bronze);
  transition: transform .45s var(--v5-ease), box-shadow .45s var(--v5-ease), border-color .3s;
}
.v5-ct:hover { transform: translateY(-6px) scale(1.025); border-bottom-color: var(--brand, #E90117); box-shadow: 0 30px 54px -22px rgba(58, 47, 38, .62); }
.v5-ct-photo { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--v5-sand); }
.v5-ct-photo img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.2s var(--v5-ease); }
.v5-ct:hover .v5-ct-photo img { transform: scale(1.06); }
.v5-ct-no { position: absolute; left: 16px; top: 16px; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 10px;
  background: #111; color: #fff; font: 700 .95rem 'Montserrat', sans-serif; letter-spacing: .04em; }
.v5-ct-body { display: flex; flex-direction: column; gap: 10px; padding: 24px 24px 26px; flex: 1; }
.v5-ct-body h3 { margin: 0; font-size: 1.22rem; line-height: 1.25; }
.v5-ct-body p { margin: 0; font-size: .98rem; line-height: 1.6; color: #4a4039; }
.v5-ct-body .v5-ct-spec { color: #1c1917; font-weight: 600; }
.v5-ct-note { display: flex; gap: 8px; align-items: flex-start; font-size: .92rem !important; }
.v5-ct-note i { color: var(--brand, #E90117); font-size: 1.05rem; margin-top: 3px; flex-shrink: 0; }
.v5-ct-price { margin-top: auto; padding-top: 16px; border-top: 1px solid var(--v5-sand); display: grid; gap: 4px; }
.v5-ct-price strong { font: 700 1.6rem 'Montserrat', sans-serif; color: #111; }
.v5-ct-price strong small { display: inline-block; font-size: .5em; font-weight: 600; color: #6b5f55; }
.v5-ct-price > span { font-size: .88rem; color: #6b5f55; }
@media (max-width: 980px) { .v5-consult-tiles { grid-template-columns: 1fr; max-width: 560px; margin-inline: auto; } }

/* ---------- 113f48a8: "Mitől függ a kivitelezés ára?" was very grey, stone photo behind it ---------- */
#tanacsadas .hv4-factors {
  position: relative; isolation: isolate; overflow: hidden; border: 0 !important; border-radius: 16px; margin-top: 44px;
  background: linear-gradient(110deg, rgba(58, 47, 38, .86), rgba(115, 115, 92, .62)), url('assets/decor/v5-stone-brown.webp') center / cover !important;
}
#tanacsadas .hv4-factors > h3 { color: #fff !important; text-shadow: 0 2px 10px rgba(0, 0, 0, .5); }
#tanacsadas .hv4-factors > p { color: #f4efe8 !important; text-shadow: 0 1px 8px rgba(0, 0, 0, .5); }
#tanacsadas .hv4-factor-grid li { background: #fffdf9 !important; border: 0 !important; box-shadow: 0 8px 20px -12px rgba(0, 0, 0, .55); }
#tanacsadas .hv4-factor-grid .hv4-f-ico { background: var(--v5-bronze) !important; }

/* ---------- 38164dbe: "Így dolgozom" on a warm stone background instead of flat grey/white ---------- */
#folyamat.hv4-process {
  background: linear-gradient(rgba(244, 239, 232, .80), rgba(244, 239, 232, .88)), url('assets/decor/v5-stone-terra.webp') center / cover !important;
}
#folyamat .hv4-tl-step {
  background: #fffdf9; border-radius: 14px; padding: 26px 16px 24px; border-bottom: 3px solid var(--v5-bronze);
  box-shadow: 0 12px 28px -16px rgba(58, 47, 38, .5); transition: transform .45s var(--v5-ease), box-shadow .45s var(--v5-ease), border-color .3s;
}
#folyamat .hv4-tl-step:hover { transform: translateY(-6px) scale(1.04); border-bottom-color: var(--brand, #E90117); box-shadow: 0 26px 46px -20px rgba(58, 47, 38, .6); }
#folyamat .hv4-tl::before, #folyamat .hv4-tl::after { top: calc(26px + var(--node) / 2); }
#folyamat .hv4-tl-node { position: relative; z-index: 1; }
@media (max-width: 900px) {
  #folyamat .hv4-tl::before, #folyamat .hv4-tl::after { display: none; }
  #folyamat .hv4-tl-step { margin-bottom: 14px; padding: 18px; }
}

/* ---------- de0e7a3b + "sok a fekete": quote sections on a blurred photo with a warm brown tone ---------- */
.contact-section, .contact-section.hv3-contact, .contact-section.contact-photo {
  background: linear-gradient(105deg, rgba(46, 36, 28, .90) 0%, rgba(58, 47, 38, .78) 55%, rgba(90, 72, 52, .62) 100%),
              url('assets/decor/v5-contact-blur.webp') center / cover no-repeat !important;
}
.contact-section.decorated-section::before { opacity: .25; }

/* ---------- c02cd9d1: the four-fact band on the interior page was one more black block ---------- */
.material-band {
  background: linear-gradient(rgba(244, 239, 232, .90), rgba(234, 227, 220, .90)), url('assets/decor/v5-stone-terra.webp') center / cover !important;
  border-color: var(--v5-sand) !important; color: #1c1917 !important;
}
.material-band::before { display: none !important; }
.material-band .mat-item { border-left-color: var(--v5-bronze) !important; border-top-color: var(--v5-bronze) !important; }
.material-band .mat-item strong { color: #1c1917 !important; text-shadow: none !important; }
.material-band .mat-item p { color: #4a4039 !important; text-shadow: none !important; }

/* ---------- 943f9f71: the checklist texts started at different positions ---------- */
.rq-list li { display: grid !important; grid-template-columns: 28px minmax(0, 1fr); column-gap: 12px; row-gap: 2px; align-items: start; color: #e9e2d8 !important; }
.rq-list li > i { grid-row: 1 / span 2; margin-top: 3px; }
.rq-list li > strong { grid-column: 2; display: block; color: #fff; }
.rq-list li > .rq-text { grid-column: 2; display: block; }

/* ---------- 18fb4da4: a real photo in the first style card ---------- */
.style-card img.v5-photo { object-position: center 62%; }

/* ---------- email: kőfurnér sheet prices on the Árak page ---------- */
.v5-sheet-prices { background: linear-gradient(rgba(244, 239, 232, .90), rgba(244, 239, 232, .94)), url('assets/decor/v5-stone-terra.webp') center / cover; }
.v5-sp-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; margin-top: 36px; }
.v5-sp {
  display: flex; flex-direction: column; overflow: hidden; border-radius: 14px; background: #fffdf9; border-bottom: 3px solid var(--v5-bronze);
  box-shadow: 0 12px 28px -16px rgba(58, 47, 38, .5); transition: transform .45s var(--v5-ease), box-shadow .45s var(--v5-ease), border-color .3s;
  animation: v5-float 7s ease-in-out infinite;
}
.v5-sp:nth-child(2) { animation-delay: -1.4s; } .v5-sp:nth-child(3) { animation-delay: -2.8s; }
.v5-sp:nth-child(4) { animation-delay: -4.2s; } .v5-sp:nth-child(5) { animation-delay: -5.6s; }
.v5-sp:hover { transform: scale(1.06); z-index: 2; animation-play-state: paused; border-bottom-color: var(--brand, #E90117); box-shadow: 0 26px 46px -20px rgba(58, 47, 38, .6); }
.v5-sp img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.v5-sp-body { padding: 18px 18px 20px; display: grid; gap: 6px; }
.v5-sp-body h3 { margin: 0; font-size: 1.08rem; }
.v5-sp-net { margin: 4px 0 0; font: 700 1.35rem 'Montserrat', sans-serif; color: #111; white-space: nowrap; }
.v5-sp-net small { font-size: .52em; font-weight: 600; color: #6b5f55; }
.v5-sp-gross { margin: 0; font-size: .9rem; color: #4a4039; }
.v5-sp-foot { margin-top: 28px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.v5-sp-fact { background: #fffdf9; border-radius: 12px; padding: 20px 22px; border-left: 3px solid var(--v5-bronze); box-shadow: 0 8px 20px -14px rgba(58, 47, 38, .5); }
.v5-sp-fact h3 { margin: 0 0 6px; font-size: 1.02rem; display: flex; gap: 8px; align-items: center; }
.v5-sp-fact h3 i { color: var(--brand, #E90117); font-size: 1.25rem; flex-shrink: 0; }
.v5-sp-fact p { margin: 0; font-size: .95rem; color: #4a4039; }
@media (max-width: 1100px) { .v5-sp-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .v5-sp-grid, .v5-sp-foot { grid-template-columns: 1fr; } .v5-sp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 460px) { .v5-sp-grid { grid-template-columns: 1fr; } }

@media (prefers-reduced-motion: reduce) {
  .new-page .process-rail li, .v5-sp { animation: none !important; }
  .new-page .process-rail li, .v5-sp, .v5-ct, .v5-ct-photo img, #folyamat .hv4-tl-step { transition: none !important; }
}