.elementor-3483 .elementor-element.elementor-element-32c229a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3483 .elementor-element.elementor-element-50a332f{--display:flex;}.elementor-3483 .elementor-element.elementor-element-ce243b4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3483 .elementor-element.elementor-element-6fad7df{--display:grid;--e-con-grid-template-columns:repeat(3, 1fr);--e-con-grid-template-rows:repeat(2, 1fr);--gap:2rem 5rem;--row-gap:2rem;--column-gap:5rem;--grid-auto-flow:row;--justify-items:center;--align-items:center;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3483 .elementor-element.elementor-element-8b16838{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}html{height:100vh;margin:0;overflow:hidden;}body{height:100vh;overflow:auto;scroll-snap-type:y mandatory;}.elementor-section:not(.elementor-inner-section), .elementor-location-header, .elementor-location-footer, .page-header, .site-header, .elementor-add-section, .e-con:not(.e-child){scroll-snap-align:start;scroll-snap-stop:normal;}@media(max-width:1024px){.elementor-3483 .elementor-element.elementor-element-6fad7df{--e-con-grid-template-columns:repeat(2, 1fr);--grid-auto-flow:row;}.elementor-section:not(.elementor-inner-section), .elementor-location-header, .elementor-location-footer, .page-header, .site-header, .elementor-add-section, .e-con:not(.e-child){scroll-snap-align:start;scroll-snap-stop:normal;}}@media(max-width:767px){.elementor-3483 .elementor-element.elementor-element-6fad7df{--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(2, 1fr);--gap:5rem 0rem;--row-gap:5rem;--column-gap:0rem;--grid-auto-flow:row;}.elementor-3483 .elementor-element.elementor-element-b55be10 > .elementor-widget-container{margin:5rem 0rem 0rem 0rem;}.elementor-section:not(.elementor-inner-section), .elementor-location-header, .elementor-location-footer, .page-header, .site-header, .elementor-add-section, .e-con:not(.e-child){scroll-snap-align:center;scroll-snap-stop:normal;}body{scroll-padding:0.1rem;}}/* Start custom CSS */body {
  background:
    radial-gradient(circle at 20% 0%, #5b7bff11, transparent 55%),
    radial-gradient(circle at 80% 100%, #ffb23b11, transparent 55%),
    radial-gradient(circle at 50% 50%, #0f0b22, #050611 70%);
  align-items: center;
  justify-content: center;
  -webkit-font-smoothing: antialiased;
}

/* ===========================
   OTTOMAN CARD COMPONENT
   =========================== */

.ottoman-card {
  --ottoman-card-width: min(82vw, 360px);
  --ottoman-card-radius: 22px;
  --ottoman-card-shadow: 0 24px 70px rgba(0, 0, 0, 0.88);
  width: var(--ottoman-card-width);
}

.ottoman-card__inner {
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 4;
  border-radius: var(--ottoman-card-radius);
  overflow: visible; /* glow dışarı taşabilsin */
  box-shadow: var(--ottoman-card-shadow);
  cursor: pointer;
  /*background: #000;*/
  transition:
    transform 0.12s ease-out,
    box-shadow 0.12s ease-out;
}

/* İç katmanlar click almasın, :active her zaman inner’da kalsın */
.ottoman-card__frame,
.ottoman-card__bezel,
.ottoman-card__art,
.ottoman-card__title {
  pointer-events: none;
}

/* --- Slim Gold Frame --- */
.ottoman-card__frame {
  position: absolute;
  inset: 4px;
  border-radius: inherit;
  background:
    linear-gradient(#0000, #0000) padding-box,
    conic-gradient(
      from 200deg,
      #fff8df,
      #f1d27a,
      #d2a14b,
      #b08436,
      #e6c068,
      #fff8df
    ) border-box;
  border: 2px solid transparent;
  box-shadow:
    inset 0 0 4px rgba(0, 0, 0, 0.5),
    0 0 10px rgba(244, 213, 138, 0.3);
}

/* --- Inner Bezel --- */
.ottoman-card__bezel {
  position: absolute;
  inset: 9px;
  border-radius: calc(var(--ottoman-card-radius) - 7px);
  background: linear-gradient(140deg, #281a0e, #0b0912);
  box-shadow:
    inset 0 1px 4px rgba(255, 255, 255, 0.12),
    inset 0 -3px 8px rgba(0, 0, 0, 0.8);
}

/* --- Art / Image Layer ---
   Arka plan görseli HTML'de inline style ile veriliyor.
   Aynı CSS ile farklı kartlar rahatça kullanılır.
*/
.ottoman-card__art {
  position: absolute;
  inset: 12px;
  border-radius: calc(var(--ottoman-card-radius) - 11px);
  background-size: cover;
  background-position: center;
  filter: saturate(1.1) contrast(1.05);
}

/* Normal durumda sadece primary görünür */
.ottoman-card__art--primary {
  opacity: 1;
  transition: opacity 0.14s ease-out;
}

/* Alternatif görsel (opsiyonel) – default kapalı */
.ottoman-card__art--alternate {
  opacity: 0;
  transition: opacity 0.14s ease-out;
}

/* Click / press sırasında görsel değişimi */
.ottoman-card__inner:active .ottoman-card__art--primary {
  opacity: 0;
}

.ottoman-card__inner:active .ottoman-card__art--alternate {
  opacity: 1;
}

/* --- Title Bar --- */
.ottoman-card__title {
  position: absolute;
  left: 50%;
  bottom: 9%;
  transform: translateX(-50%);
  margin: 0;

  font-family: "Cinzel", serif;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  text-indent: 0.22em;
  font-weight: 700;
  font-size: clamp(1.2rem, 1.05rem + 1vw, 1.6rem);

  color: #fff6cf;
  text-align: center;

  padding: 0.25em 0.4em 0.55em;
  min-width: 70%;
  border-radius: 0;

  background: linear-gradient(to bottom, #3b2a15f0, #130e18f0);
  border-top: 1px solid rgba(255, 232, 180, 0.7);
  border-bottom: 2px solid rgba(229, 195, 112, 0.9);

  box-shadow:
    0 0 14px rgba(0, 0, 0, 0.9),
    0 0 22px rgba(255, 221, 140, 0.4);
  text-shadow:
    0 0 10px rgba(0, 0, 0, 0.95),
    0 0 20px rgba(244, 213, 138, 0.9);
}

/* Küçük elmas süsü */
.ottoman-card__title::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -0.35rem;
  transform: translateX(-50%) rotate(45deg);
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 2px;
  background: radial-gradient(circle at 30% 20%, #fffbe0, #e1b857 60%, #76501e 100%);
  box-shadow:
    0 0 6px rgba(255, 244, 200, 0.9),
    0 0 12px rgba(255, 210, 120, 0.65);
}

/* --- Click / Tap Glow (no JS) --- */
.ottoman-card__inner:active {
  transform: scale(0.97);
  box-shadow:
    0 0 0 2px rgba(255, 246, 210, 0.98),
    0 0 30px rgba(255, 230, 160, 0.9),
    0 0 70px rgba(255, 220, 150, 0.65),
    0 18px 50px rgba(0, 0, 0, 0.9);
}

.ottoman-card__inner:active .ottoman-card__frame {
  box-shadow:
    inset 0 0 4px rgba(0, 0, 0, 0.65),
    0 0 22px rgba(255, 240, 190, 0.95);
}

/* Hover'da ekstra animasyon yok; kart stabil kalsın */
@media (hover: hover) {
  .ottoman-card__inner:hover {
    transform: none;
    box-shadow: var(--ottoman-card-shadow);
  }
}

/* Font import (title için) */
@import url("https://fonts.googleapis.com/css2?family=Cinzel:wght@600;700&display=swap");/* End custom CSS */