@charset "UTF-8";

/* Esték oldal — kerámia-stúdió katalógus kompozíció */

#estek-oldal {
  --estek-section-gap: var(--space-4xl);
  --estek-program-gap: var(--space-2xl);
  --estek-oval-radius: 50%;
  --estek-media-aspect: 4 / 5;
  --estek-media-aspect-square: 1 / 1;
}

/* Bevezető szekció */
.estek-bevezeto {
  padding-block: var(--space-4xl) var(--space-5xl);
  background-color: var(--color-chalk-ivory);
}

.estek-bevezeto__racs {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: var(--space-2xl);
  align-items: center;
  max-width: var(--container-editorial);
  margin-inline: auto;
  padding-inline: var(--page-padding-mobile);
}

.estek-bevezeto__szoveg {
  min-width: 0;
  max-width: 60%;
  justify-self: start;
}

.estek-bevezeto__szoveg h1 {
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1.1;
  letter-spacing: -0.01em;
  margin-block-end: var(--space-lg);
}

.estek-bevezeto__szoveg .lead {
  margin-block-end: var(--space-md);
}

.estek-bevezeto__szoveg p:not(.lead) {
  margin-block-end: var(--space-md);
}

.estek-bevezeto__lista {
  margin-block-start: var(--space-md);
  padding-inline-start: var(--space-lg);
  list-style-position: inside;
  color: var(--color-graphite);
}

.estek-bevezeto__lista li {
  margin-block-end: var(--space-xs);
}

.estek-bevezeto__lista li:last-child {
  margin-block-end: 0;
}

.estek-bevezeto__media {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  justify-self: end;
  align-self: center;
  transform: translateY(var(--space-lg));
}

.estek-bevezeto__media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: var(--estek-media-aspect);
  object-fit: cover;
  border-radius: var(--estek-oval-radius);
  background-color: var(--color-warm-clay);
}

/* Program szekciók */
.estek-program {
  padding-block: var(--estek-section-gap);
  background-color: var(--color-chalk-ivory);
}

.estek-program--kesoi {
  background-color: var(--color-warm-clay);
}

.estek-program--kaszino {
  background-color: var(--color-midnight-blue);
  color: var(--color-ivory-on-dark);
}

.estek-program--kaszino .overline,
.estek-program--kaszino .caption {
  color: var(--color-brushed-steel);
}

.estek-program--kaszino h2 {
  color: var(--color-ivory-on-dark);
}

.estek-program--kaszino .estek-program__szoveg p,
.estek-program--kaszino .estek-program__szoveg .lead {
  color: var(--color-ivory-on-dark);
}

.estek-program--kaszino .estek-program__reszletek dt {
  color: var(--color-brushed-steel);
}

.estek-program--kaszino .estek-program__reszletek dd {
  color: var(--color-ivory-on-dark);
}

.estek-program__racs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--estek-program-gap);
  align-items: center;
  max-width: var(--container-editorial);
  margin-inline: auto;
  padding-inline: var(--page-padding-mobile);
}

.estek-program__racs--forditott {
  direction: rtl;
}

.estek-program__racs--forditott > * {
  direction: ltr;
}

.estek-program__media {
  min-width: 0;
  width: 100%;
  max-width: 100%;
}

.estek-program__media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: var(--estek-media-aspect);
  object-fit: cover;
  border-radius: var(--estek-oval-radius);
  background-color: var(--color-warm-clay);
}

.estek-program--chef .estek-program__media img,
.estek-program--zeroproof .estek-program__media img,
.estek-program--kaszino .estek-program__media img,
.estek-program--kulonleges .estek-program__media img {
  aspect-ratio: var(--estek-media-aspect-square);
}

.estek-program--kaszino .estek-program__media img {
  background-color: var(--color-midnight-blue);
}

.estek-program__szoveg {
  min-width: 0;
  max-width: 50%;
  justify-self: start;
}

.estek-program__racs--forditott .estek-program__szoveg {
  justify-self: end;
}

.estek-program__szoveg h2 {
  font-size: clamp(1.625rem, 2.5vw, 2.25rem);
  line-height: 1.15;
  margin-block-end: var(--space-md);
}

.estek-program__szoveg .lead {
  margin-block-end: var(--space-md);
}

.estek-program__szoveg p:not(.lead) {
  margin-block-end: var(--space-md);
}

.estek-program__reszletek {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-lg);
  margin-block: var(--space-lg) var(--space-md);
}

.estek-program__reszletek > div {
  min-width: 0;
  flex: 1 1 10rem;
}

.estek-program__reszletek dt {
  font-size: var(--text-caption-size);
  font-weight: var(--font-weight-caption);
  letter-spacing: var(--text-caption-letter-spacing);
  text-transform: uppercase;
  color: var(--color-graphite);
  margin-block-end: var(--space-2xs);
}

.estek-program__reszletek dd {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--text-h4-size);
  font-weight: var(--font-weight-heading-h4);
  color: var(--color-dark-chocolate);
}

.estek-program--kaszino .estek-program__reszletek dd {
  color: var(--color-ivory-on-dark);
}

.estek-program__szoveg .caption {
  margin-block-start: var(--space-sm);
}

/* Gyakori kérdések */
.estek-gyik {
  padding-block: var(--estek-section-gap);
  background-color: var(--color-chalk-ivory);
}

.estek-gyik__fejlec {
  max-width: var(--container-text);
  margin-inline: auto;
  padding-inline: var(--page-padding-mobile);
  margin-block-end: var(--space-2xl);
}

.estek-gyik__fejlec h2 {
  margin-block-end: var(--space-md);
}

.estek-gyik__fejlec .lead {
  max-width: 70%;
  margin-block-end: 0;
}

.estek-gyik__racs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-xl) var(--space-2xl);
  max-width: var(--container-text);
  margin-inline: auto;
  padding-inline: var(--page-padding-mobile);
}

.estek-gyik__elem {
  min-width: 0;
  padding-block-end: var(--space-lg);
  border-block-end: 1px solid var(--border-color-lighter);
}

.estek-gyik__elem h3 {
  font-size: var(--text-h4-size);
  font-weight: var(--font-weight-heading-h4);
  line-height: var(--text-h4-line-height);
  margin-block-end: var(--space-sm);
}

.estek-gyik__elem p {
  margin-block-end: 0;
  color: var(--color-graphite);
}

/* Foglalás és kapcsolat */
.estek-foglalas {
  padding-block: var(--space-5xl);
  background-color: var(--color-dark-chocolate);
  color: var(--color-ivory-on-dark);
}

.estek-foglalas__tartalom {
  max-width: 50%;
  margin-inline: auto;
  padding-inline: var(--page-padding-mobile);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-lg);
}

.estek-foglalas__tartalom h2 {
  color: var(--color-ivory-on-dark);
  margin-block-end: 0;
}

.estek-foglalas__tartalom .lead {
  color: var(--color-ivory-on-dark);
  margin-block-end: 0;
}

.estek-foglalas__tartalom p:not(.lead) {
  color: var(--color-ivory-on-dark);
  margin-block-end: 0;
}

.estek-foglalas__gombok {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-lg);
  margin-block-start: var(--space-md);
}

.estek-foglalas__gombok .btn {
  min-width: 12rem;
}

/* Reszponzív szabályok */
@media (min-width: 48rem) {
  .estek-bevezeto__racs,
  .estek-program__racs,
  .estek-gyik__racs,
  .estek-foglalas__tartalom {
    padding-inline: var(--page-padding-tablet);
  }

  .estek-bevezeto__szoveg {
    max-width: 60%;
  }
}

@media (min-width: 64rem) {
  .estek-bevezeto__racs,
  .estek-program__racs,
  .estek-gyik__racs,
  .estek-foglalas__tartalom {
    padding-inline: var(--page-padding-desktop);
  }
}

@media (max-width: 63.999rem) {
  .estek-bevezeto__racs {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-xl);
  }

  .estek-bevezeto__szoveg {
    max-width: 100%;
    justify-self: start;
  }

  .estek-bevezeto__media {
    width: 100%;
    max-width: 28rem;
    justify-self: center;
    transform: none;
  }

  .estek-program__racs {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-xl);
  }

  .estek-program__racs--forditott {
    direction: ltr;
  }

  .estek-program__szoveg {
    max-width: 100%;
    justify-self: start;
  }

  .estek-program__media {
    max-width: 28rem;
    justify-self: center;
  }

  .estek-gyik__fejlec .lead {
    max-width: 100%;
  }

  .estek-gyik__racs {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-lg);
  }

  .estek-foglalas__tartalom {
    max-width: 80%;
  }
}

@media (max-width: 47.999rem) {
  #estek-oldal {
    --estek-section-gap: var(--space-3xl);
    --estek-program-gap: var(--space-xl);
  }

  .estek-bevezeto {
    padding-block: var(--space-3xl) var(--space-4xl);
  }

  .estek-bevezeto__szoveg h1 {
    font-size: 2rem;
  }

  .estek-bevezeto__media {
    max-width: 100%;
  }

  .estek-program__media {
    max-width: 100%;
  }

  .estek-program__reszletek {
    flex-direction: column;
    gap: var(--space-md);
  }

  .estek-program__reszletek > div {
    flex: 1 1 auto;
  }

  .estek-foglalas__tartalom {
    max-width: 100%;
    padding-inline: var(--page-padding-mobile);
  }

  .estek-foglalas__gombok {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .estek-foglalas__gombok .btn {
    width: 100%;
    min-width: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .estek-bevezeto__media {
    transform: none;
  }
}