/* Revize 36 — Giriş: "Mimari Çizim".
   Kâğıt zemin ve ince ızgara belirir; yardımcı çizgiler ekranı boydan boya keser, ölçü notları düşülür.
   B ve D önce ince çizgiyle çizilir, sonra mürekkeple dolar; BLOOM®CO DESIGN yazılır.
   Ortaya dikiş çizgisi çekilir, fotoğraflar oradan iki yana açılır; harfler incelip kendi panellerine yerleşir.
   Ardından Mobilya / İç Mimari & Proje seçimi. Aynı oturumda ikinci gelişte kısa sürüm oynar. */

.ent{
  --L:min(60vw,600px);--H:calc(var(--L)*.66667);--half:50vh;--eh:100vh;
  --cream:#f3ede4;--ink:#141d23;--stage:#f4efe7;--logo:#2a201c;--ease:cubic-bezier(.22,1,.36,1);--door:cubic-bezier(.76,0,.24,1);--draw:cubic-bezier(.87,0,.13,1);
  --wm-s:.46;--wm-top:52px;
  /* logo kutusu (966 × 644 birimlik çizim alanı) */
  --lx:calc(50% - var(--L) * .4648);--ly:calc(50% - var(--L) * .28571);--u:calc(var(--L) / 966);
  position:relative;width:100%;height:100vh;overflow:hidden;isolation:isolate;
  background:var(--stage);color:var(--cream);font-family:'Bricolage Grotesque',sans-serif;
  -webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent
}
@supports (height:100svh){.ent{height:100svh;--half:50svh;--eh:100svh}}
@media (max-width:1000px){.ent{--wm-s:.52}}

/* ——— İki dünya ——— */
.ent-panels{position:absolute;inset:0;display:flex}
.ent-panel{position:relative;flex:1 1 0;min-width:0;min-height:0}
/* panellerin renkli zeminleri: fotoğraflar açılana kadar kâğıt zemin görünsün */
.ent .ent-panel{background:transparent!important}
.ent-i{box-shadow:inset 1px 0 0 rgba(243,237,228,.22)}
.ent-click{position:absolute;inset:0;cursor:pointer}
.ent-photo{position:absolute;inset:0;display:block;overflow:hidden}
.ent-f .ent-photo{clip-path:inset(0 0 0 100%);animation:ent36-open 1.25s var(--door) 3.6s forwards}
.ent-i .ent-photo{clip-path:inset(0 100% 0 0);animation:ent36-open 1.25s var(--door) 3.6s forwards}
.ent-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.03);transition:transform 2.6s var(--ease),filter 1.4s ease}
.ent-panel:hover .ent-photo img{transform:scale(1.09)}
.ent-scrim{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(9,13,16,.42) 0%,rgba(9,13,16,0) 26%,rgba(9,13,16,0) 42%,rgba(9,13,16,.82) 100%);animation:ent-fade 1s ease 4s both}
.ent-scrim::after{content:"";position:absolute;inset:0;background:rgba(9,13,16,.38);opacity:0;transition:opacity 1.2s ease}
.ent-panels:hover .ent-panel:not(:hover) .ent-scrim::after{opacity:1}
.ent-outline{position:absolute;left:50%;top:46%;height:74%;width:auto;max-width:none;pointer-events:none;
  transform:translate(-50%,-50%) translate(calc(var(--px,0) * -16px),calc(var(--py,0) * -12px));
  opacity:.2;transition:opacity 1.2s ease,transform 1.6s var(--ease);animation:ent-outline .5s ease 4.85s both}
.ent-panel:hover .ent-outline{opacity:.42}

.ent-copy{position:absolute;left:clamp(24px,4.2vw,72px);right:clamp(24px,4.2vw,72px);bottom:clamp(30px,7vh,84px);pointer-events:none}
.ent-idx{display:inline-flex;align-items:center;gap:12px;font:400 20px/1 'Pixelify Sans',sans-serif;letter-spacing:.06em;opacity:.85;animation:ent-rise .8s var(--ease) 4.25s both}
.ent-idx::after{content:"";width:40px;height:1px;background:currentColor;opacity:.6;transition:width .9s var(--ease)}
.ent-panel:hover .ent-idx::after{width:72px}
.ent-title{margin:14px 0 16px;padding-bottom:.1em;overflow:hidden;font:800 clamp(48px,5.6vw,104px)/.92 'Bricolage Grotesque',sans-serif;letter-spacing:-.045em;color:var(--cream);text-transform:none;text-wrap:balance;max-width:11ch}
.ent-title span{display:block;animation:ent-title 1s var(--ease) 4.3s both}
.ent-desc{margin:0 0 26px;max-width:34ch;font-size:clamp(14px,1.05vw,17px);line-height:1.5;opacity:.88;animation:ent-rise .8s var(--ease) 4.4s both}
.ent-go{pointer-events:auto;display:inline-flex;align-items:center;gap:16px;padding:7px 7px 7px 22px;border-radius:999px;border:1px solid rgba(243,237,228,.55);
  background:rgba(20,29,35,.22);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--cream);cursor:pointer;
  font:700 12.5px/1 'Bricolage Grotesque',sans-serif;letter-spacing:.16em;text-transform:uppercase;
  transition:background .5s var(--ease),color .5s var(--ease),border-color .5s;animation:ent-rise .8s var(--ease) 4.5s both}
.ent-go i{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--cream);color:var(--ink);transition:transform .6s var(--ease),background .5s,color .5s}
.ent-panel:hover .ent-go,.ent-go:focus-visible{background:var(--cream);color:var(--ink);border-color:var(--cream)}
.ent-panel:hover .ent-go i,.ent-go:focus-visible i{background:var(--ink);color:var(--cream);transform:rotate(-45deg)}
.ent-go:focus-visible{outline:2px solid var(--cream);outline-offset:4px}

/* ——— Çizim katmanı ——— */
.ent-draw{position:absolute;inset:0;z-index:5;cursor:pointer;animation:ent-gone .01s linear 5.2s forwards}
.ent-grid{position:absolute;inset:0;opacity:0;animation:ent36-grid 1.2s ease-out 0s forwards,ent36-out .8s ease 3.35s forwards;
  background:repeating-linear-gradient(0deg,rgba(42,32,28,.055) 0 1px,transparent 1px 32px),repeating-linear-gradient(90deg,rgba(42,32,28,.055) 0 1px,transparent 1px 32px)}
.ent-ln{position:absolute;display:block;background:var(--logo);opacity:.9}
.ent-ln.h{left:0;right:0;height:1px;transform:scaleX(0);transform-origin:0 50%;animation:ent36-x 1.1s var(--draw) var(--d) forwards,ent36-out .5s ease 3.1s forwards}
.ent-ln.v{top:0;bottom:0;width:1px;transform:scaleY(0);transform-origin:50% 0;animation:ent36-y 1.1s var(--draw) var(--d) forwards,ent36-out .5s ease 3.1s forwards}
.ent-ln.r{transform-origin:100% 50%}.ent-ln.v.r{transform-origin:50% 100%}
.ent-ln.h1{top:var(--ly);--d:.1s}.ent-ln.h2{top:calc(var(--ly) + var(--u) * 204);--d:.17s}
.ent-ln.h3{top:calc(var(--ly) + var(--u) * 354);--d:.24s}.ent-ln.h4{top:calc(var(--ly) + var(--u) * 552);--d:.31s}
.ent-ln.v1{left:var(--lx);--d:.38s}.ent-ln.v2{left:calc(var(--lx) + var(--u) * 418);--d:.45s}
.ent-ln.v3{left:calc(var(--lx) + var(--u) * 480);--d:.52s}.ent-ln.v4{left:calc(var(--lx) + var(--u) * 966);--d:.59s}
/* ortadaki dikiş: fotoğraflar buradan açılır */
.ent-seam{position:absolute;top:0;bottom:0;left:50%;width:1px;background:var(--logo);transform:scaleY(0);transform-origin:50% 0;
  animation:ent36-y .5s var(--ease) 3.25s forwards,ent36-out .4s ease 4.9s forwards}
.ent-note{position:absolute;font:400 11px/1 'Pixelify Sans',sans-serif;letter-spacing:.12em;color:var(--logo);opacity:0;white-space:nowrap;
  animation:ent36-note .4s ease var(--d) forwards,ent36-out .3s ease 3.1s forwards}
.ent-note.n1{left:calc(var(--lx) + var(--u) * 966 + 10px);top:calc(var(--ly) - 18px);--d:.8s}
.ent-note.n2{left:calc(var(--lx) - 10px);top:calc(var(--ly) + var(--u) * 552 + 10px);transform:translateX(-100%);--d:.88s}
.ent-note.n3{left:calc(var(--lx) + var(--u) * 966);top:calc(var(--ly) + var(--u) * 552 + 10px);transform:translateX(-100%);--d:.96s}
.ent-note.n4{left:calc(var(--lx) + 4px);top:calc(var(--ly) + var(--u) * 204 + 6px);--d:1.04s}
.ent-note.n5{left:calc(var(--lx) + var(--u) * 808);top:calc(var(--ly) + var(--u) * 127);--d:1.12s}
.ent-note.n6{left:28px;bottom:40px;--d:1.2s}
/* harfler: mürekkep dolgusu (maske) + çizgi (JS ile eklenen SVG) */
.ent-fill{position:absolute;top:var(--ly);height:calc(var(--u) * 552);background:var(--logo);clip-path:inset(100% 0 0 0);
  -webkit-mask:var(--m) 0 0/100% 100% no-repeat;mask:var(--m) 0 0/100% 100% no-repeat;
  animation:ent36-ink 1.1s var(--door) var(--d) forwards,ent36-out .5s ease 3.6s forwards}
.ent-fill.b{--m:url('/static/brand/parts/b-letter-crop.svg');left:var(--lx);width:calc(var(--u) * 418);--d:1.85s}
.ent-fill.d{--m:url('/static/brand/parts/d-letter-crop.svg');left:calc(var(--lx) + var(--u) * 480);width:calc(var(--u) * 483);--d:1.93s}
.ent-let{position:absolute;overflow:visible;top:var(--ly);height:calc(var(--u) * 552)}
.ent-let path{fill:none;stroke:var(--logo);stroke-width:1.3;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1;
  animation:ent36-stroke 1.6s cubic-bezier(.45,0,.55,1) var(--d) forwards,ent36-cream .6s ease 3.7s forwards}
.ent-let.b{left:var(--lx);width:calc(var(--u) * 418);--d:.55s;animation:ent36-to-b 1.25s var(--door) 3.6s forwards,ent36-out .4s ease 4.85s forwards}
.ent-let.d{left:calc(var(--lx) + var(--u) * 480);width:calc(var(--u) * 483);--d:.67s;animation:ent36-to-d 1.25s var(--door) 3.6s forwards,ent36-out .4s ease 4.85s forwards}

/* ——— Yatay yazı: çizilir, sonra yukarı yerleşir ——— */
.ent-wm{position:absolute;z-index:7;left:var(--lx);top:var(--ly);width:var(--L);height:var(--H);margin:0;pointer-events:none;
  background:var(--logo);-webkit-mask:url('/static/brand/parts/wordmark.svg') 0 0/100% 100% no-repeat;mask:url('/static/brand/parts/wordmark.svg') 0 0/100% 100% no-repeat;
  transform-origin:53.26% 42.93%;clip-path:inset(0 100% 0 0);
  animation:ent36-wm .9s var(--door) 2.05s forwards,ent-wm-up 1.1s var(--door) 3.8s both,ent-wm-light .7s ease 4s both}
.ent-wm::before{content:"";position:absolute;inset:-40px;z-index:-1;background:radial-gradient(closest-side,rgba(9,13,16,.35),transparent);opacity:0;animation:ent-fade .8s ease 4.3s both}

/* ——— Dil ve geç ——— */
.ent-lang{position:absolute;z-index:8;top:max(30px,env(safe-area-inset-top));right:max(28px,env(safe-area-inset-right));display:flex;gap:2px;padding:4px;border-radius:999px;background:rgba(20,29,35,.3);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(243,237,228,.25);animation:ent-fade .6s ease 4.6s both}
.ent-lang button{all:unset;cursor:pointer;padding:7px 11px;border-radius:999px;font:700 11px/1 'Bricolage Grotesque',sans-serif;letter-spacing:.12em;color:var(--cream);opacity:.7;transition:background .3s,color .3s,opacity .3s}
.ent-lang button[aria-pressed="true"]{background:var(--cream);color:var(--ink);opacity:1}
.ent-lang button:focus-visible{outline:2px solid var(--cream);outline-offset:2px}
.ent-skip{all:unset;position:absolute;z-index:9;right:max(28px,env(safe-area-inset-right));bottom:max(26px,env(safe-area-inset-bottom));cursor:pointer;
  font:500 13px/1 'Pixelify Sans',sans-serif;letter-spacing:.1em;color:var(--logo);opacity:0;padding:10px 14px;border-radius:999px;border:1px solid rgba(42,32,28,.25);background:rgba(255,255,255,.35);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  animation:ent-skip-in .5s ease .6s forwards,ent-gone .3s ease 3.4s forwards}
.ent-skip:focus-visible{outline:2px solid var(--logo);outline-offset:3px}

/* ——— Hareketler ——— */
@keyframes ent-fade{from{opacity:0}to{opacity:1}}
@keyframes ent-gone{to{opacity:0;visibility:hidden;pointer-events:none}}
@keyframes ent-skip-in{to{opacity:.7}}
@keyframes ent-rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes ent-title{from{transform:translateY(108%)}to{transform:none}}
@keyframes ent-outline{from{opacity:0}to{opacity:.2}}
@keyframes ent-wm-up{to{transform:translate(calc(var(--L) * -.06781),calc(var(--wm-top) - var(--half))) scale(var(--wm-s))}}
@keyframes ent-wm-light{to{background-color:var(--cream)}}
@keyframes ent36-wm{to{clip-path:inset(0 0 0 0)}}
@keyframes ent36-open{to{clip-path:inset(0 0 0 0)}}
@keyframes ent36-grid{to{opacity:1}}
@keyframes ent36-out{to{opacity:0;visibility:hidden}}
@keyframes ent36-x{to{transform:scaleX(1)}}
@keyframes ent36-y{to{transform:scaleY(1)}}
@keyframes ent36-note{to{opacity:.75}}
@keyframes ent36-ink{to{clip-path:inset(0 0 0 0)}}
@keyframes ent36-stroke{to{stroke-dashoffset:0}}
@keyframes ent36-cream{to{stroke:var(--cream)}}
/* harfler kendi panelinin ortasına, sitedeki ince harf çizgisinin yerine gider */
@keyframes ent36-to-b{to{left:calc(25% - var(--eh) * .37 * 418 / 552);top:calc(46% - var(--eh) * .37);width:calc(var(--eh) * .74 * 418 / 552);height:calc(var(--eh) * .74);opacity:.22}}
@keyframes ent36-to-d{to{left:calc(75% - var(--eh) * .37 * 483 / 552);top:calc(46% - var(--eh) * .37);width:calc(var(--eh) * .74 * 483 / 552);height:calc(var(--eh) * .74);opacity:.22}}

/* ——— Aynı oturumda ikinci geliş: kısa sürüm (çizim atlanır, logo hazır gelir) ——— */
html.ent-quick .ent-grid,html.ent-quick .ent-ln,html.ent-quick .ent-note,html.ent-quick .ent-let,html.ent-quick .ent-skip{display:none}
html.ent-quick .ent-fill{clip-path:none;animation:ent36-out .4s ease .4s forwards}
html.ent-quick .ent-draw{animation-delay:1.6s}
html.ent-quick .ent-seam{animation:ent36-y .35s var(--ease) .1s forwards,ent36-out .4s ease 1.2s forwards}
html.ent-quick .ent-f .ent-photo,html.ent-quick .ent-i .ent-photo{animation-delay:.3s}
html.ent-quick .ent-wm{clip-path:none;animation:ent-wm-up .95s var(--door) .4s both,ent-wm-light .6s ease .65s both}
html.ent-quick .ent-scrim{animation-delay:.6s}
html.ent-quick .ent-idx{animation-delay:.95s}html.ent-quick .ent-title span{animation-delay:1s}
html.ent-quick .ent-desc{animation-delay:1.08s}html.ent-quick .ent-go{animation-delay:1.15s}
html.ent-quick .ent-outline{animation-delay:1.1s}html.ent-quick .ent-lang{animation-delay:1s}html.ent-quick .ent-wm::before{animation-delay:1s}

/* ——— Geç / az hareket: doğrudan son hal ——— */
html.ent-skipped .ent *,html.ent-skipped .ent *::before,html.ent-skipped .ent *::after,html.ent-skipped .ent-panels{animation-delay:0s!important;animation-duration:1ms!important;animation-iteration-count:1!important}
html.ent-skipped .ent-skip,html.ent-skipped .ent-draw{display:none}
@media (prefers-reduced-motion:reduce){
  .ent *,.ent *::before,.ent *::after,.ent-panels{animation-delay:0s!important;animation-duration:1ms!important;animation-iteration-count:1!important}
  .ent-skip,.ent-draw{display:none}
  .ent-photo img,.ent-outline{transition:none}
}

/* ——— Telefon: paneller üst-alt; dikiş yatay, fotoğraflar dikişten yukarı ve aşağı açılır ——— */
@media (max-width:760px){
  .ent{--L:82vw;--wm-s:.6;--wm-top:max(38px,calc(env(safe-area-inset-top) + 30px))}
  .ent-panels{flex-direction:column}
  .ent-panel{flex:1 1 0!important}
  .ent-i{box-shadow:inset 0 1px 0 rgba(243,237,228,.22)}
  .ent-f .ent-photo{clip-path:inset(100% 0 0 0)}
  .ent-i .ent-photo{clip-path:inset(0 0 100% 0)}
  .ent-seam{top:50%;bottom:auto;left:0;right:0;width:auto;height:1px;transform:scaleX(0);transform-origin:50% 50%;animation-name:ent36-x,ent36-out}
  html.ent-quick .ent-seam{animation-name:ent36-x,ent36-out}
  .ent-outline{display:none}
  .ent-let.b,.ent-let.d{animation:ent36-out .5s ease 3.6s forwards}
  .ent-note.n6{left:16px;bottom:96px}
  .ent-note.n1{left:calc(var(--lx) + var(--u) * 966);transform:translateX(-100%)}
  .ent-scrim{background:linear-gradient(180deg,rgba(9,13,16,.3) 0%,rgba(9,13,16,0) 30%,rgba(9,13,16,0) 40%,rgba(9,13,16,.8) 100%)}
  .ent-f .ent-scrim{background:linear-gradient(180deg,rgba(9,13,16,.45) 0%,rgba(9,13,16,0) 34%,rgba(9,13,16,0) 42%,rgba(9,13,16,.78) 100%)}
  .ent-copy{left:20px;right:20px;bottom:20px}
  .ent-idx{font-size:13px}.ent-idx::after{width:26px}
  .ent-title{margin:8px 0 6px;font-size:clamp(30px,9.4vw,44px);max-width:none}
  .ent-desc{font-size:13px;margin-bottom:14px;max-width:30ch}
  .ent-go{padding:5px 5px 5px 16px;gap:12px;font-size:11px}
  .ent-go i{width:32px;height:32px}
  .ent-lang{top:max(26px,calc(env(safe-area-inset-top) + 18px));right:16px}
  .ent-lang button{padding:6px 9px;font-size:10px}
  .ent-skip{right:16px;bottom:max(18px,env(safe-area-inset-bottom))}
}

/* Eski revizyonların telefonda gizlediği giriş görsellerini yeni ekranda geri aç */
.ent #chooser-furniture,.ent #chooser-interior{visibility:visible!important;display:block!important;filter:none}