/* Buildora Grup — sıcak beyaz, kömür siyahı, adaçayı yeşili, çini mavisi */
:root{
  --paper:#FAF8F4;
  --paper-2:#EFEBE3;
  --char:#141414;
  --sage:#7D9A8C;
  --sage-d:#5F7C6E;
  --tile:#2D5DA8;
  --f:"Plus Jakarta Sans", system-ui, sans-serif;
  --pad:clamp(16px, 3vw, 44px);
  --gap:clamp(96px, 12vw, 190px);
  --body:clamp(17px, 1.15vw, 19px);
  --lede:clamp(19px, 1.45vw, 22px);
  --h2:clamp(32px, 4.2vw, 62px);
  --ease:cubic-bezier(.2,.75,.25,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--paper);color:var(--char);font-family:var(--f);font-size:var(--body);line-height:1.6;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
figure{margin:0}
h1,h2,h3{margin:0;font-weight:800;letter-spacing:-.04em;line-height:1;text-wrap:balance}
h2{font-size:var(--h2)}
h3{font-size:clamp(21px,1.8vw,26px);letter-spacing:-.02em}
p{margin:0}
a{color:inherit}
::selection{background:var(--sage);color:#fff}
:focus-visible{outline:3px solid var(--tile);outline-offset:3px}

.k{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;background:var(--char);color:var(--paper);font:700 16px/1 var(--f);text-decoration:none;transition:background-color .2s,transform .2s var(--ease)}
.k:hover{background:var(--sage-d)}
.k:active{transform:scale(.97)}
.k--l{background:var(--paper-2);color:var(--char)}
.k--l:hover{background:#e2dccf}

/* Üst */
.h{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:28px;padding:14px var(--pad);background:var(--paper)}
.h__name{font-weight:800;font-size:26px;letter-spacing:-.06em;text-decoration:none}
.h__name span{font-weight:500;color:var(--sage-d);margin-left:2px}
.h__nav{display:flex;gap:26px;margin-left:auto}
.h__nav a{text-decoration:none;font-weight:600;font-size:16px;padding:6px 0;position:relative}
.h__nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;background:var(--sage);transform:scaleX(0);transform-origin:right;transition:transform .3s var(--ease)}
.h__nav a:hover::after{transform:scaleX(1);transform-origin:left}
.h__k{min-height:44px}

/* İlk ekran: metin + iki fotoğraf */
.hero{display:grid;grid-template-columns:5fr 4fr 3fr;grid-template-rows:auto auto;gap:clamp(14px,2vw,28px);padding:clamp(20px,3vw,48px) var(--pad) 0;align-items:end}
.hero__t{grid-column:1;grid-row:1/3;align-self:center}
.hero h1{font-size:clamp(42px,5vw,86px);letter-spacing:-.055em;line-height:.95}
.hero__t p{font-size:var(--lede);line-height:1.55;margin-top:26px;max-width:30em}
.hero__k{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}
.hero__i1{grid-column:2;grid-row:1/3}
.hero__i1 img{width:100%;aspect-ratio:3/4;object-fit:cover;animation:f 2s var(--ease) both}
.hero__i2{grid-column:3;grid-row:2}
.hero__i2 img{width:100%;aspect-ratio:1/1;object-fit:cover;animation:f 2s .2s var(--ease) both}
@keyframes f{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* Zemin */
.floor{padding:var(--gap) var(--pad) 0}
.floor__grid{display:grid;grid-template-columns:repeat(3,1fr) 1.2fr;gap:14px;margin-top:44px;align-items:stretch}
.floor__item{background:var(--paper-2);padding:clamp(22px,2.4vw,34px);display:flex;flex-direction:column;justify-content:flex-end;min-height:280px}
.floor__item:nth-child(2){background:var(--sage);color:#fff}
.floor__item p{margin-top:10px}
.floor__img img{width:100%;height:100%;object-fit:cover}

/* Karo hesabı */
.tile{margin-top:var(--gap);background:var(--char);color:var(--paper);padding:var(--gap) var(--pad)}
.tile__head{display:grid;grid-template-columns:6fr 6fr;gap:clamp(20px,4vw,64px);align-items:end}
.tile__head p{font-size:var(--lede);line-height:1.55;color:#d9d5cc}
.tile__box{margin-top:48px;display:grid;gap:20px}
.tile__in{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.tile__in label{display:flex;flex-direction:column;gap:6px;font-size:15px;font-weight:600;min-width:0}
.tile__in input{font:700 20px/1.2 var(--f);color:var(--char);background:var(--paper);border:0;border-radius:0;padding:12px;min-height:54px;width:100%}
.tile__in input:focus{outline:3px solid var(--sage);outline-offset:0}
.lay{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.lay legend{width:100%;font-size:15px;font-weight:600;margin-bottom:8px;padding:0}
.lay input{position:absolute;opacity:0;pointer-events:none}
.lay span{display:inline-flex;align-items:center;min-height:48px;padding:0 18px;background:#262626;font-weight:600;cursor:pointer;transition:background-color .2s}
.lay label:hover span{background:#333}
.lay input:checked + span{background:var(--sage);color:#fff}
.lay input:focus-visible + span{outline:3px solid #fff;outline-offset:2px}
.tile__vis{display:grid;grid-template-columns:6fr 6fr;gap:clamp(16px,3vw,44px);align-items:center}
.tile__vis svg{width:100%;height:auto;display:block;background:#1d1d1d}
.tile__res{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.tile__res p{background:#1f1f1f;padding:16px 18px}
.tile__res span{display:block;font-size:15px;color:#bdb8ad}
.tile__res b{font-size:clamp(36px,4vw,64px);font-weight:800;letter-spacing:-.05em;line-height:1;margin-right:6px}
.tile__res .hi{background:var(--sage);color:#fff}
.tile__res .hi span{color:#eef3f0}

/* Tadilat */
.reno{display:grid;grid-template-columns:7fr 5fr;gap:clamp(24px,4vw,64px);padding:var(--gap) var(--pad) 0;align-items:start}
.reno__imgs{display:grid;grid-template-columns:3fr 2fr;gap:14px;align-items:end}
.reno__imgs img{width:100%;object-fit:cover}
.reno__imgs img:first-child{aspect-ratio:4/5}
.reno__imgs img:last-child{aspect-ratio:3/4}
.reno dl{margin:32px 0 0;display:grid;gap:4px}
.reno dl div{display:grid;grid-template-columns:140px 1fr;gap:16px;padding:16px 0;background:linear-gradient(var(--paper-2),var(--paper-2)) left bottom/100% 6px no-repeat}
.reno dt{font-weight:800;font-size:20px}
.reno dd{margin:0}

/* Adres */
.addr{display:grid;grid-template-columns:4fr 8fr;gap:clamp(24px,4vw,64px);padding:var(--gap) var(--pad) clamp(72px,8vw,128px);align-items:end}
.addr img{width:100%;aspect-ratio:3/4;object-fit:cover}
.addr address{font-style:normal;font-size:clamp(22px,2vw,30px);line-height:1.35;margin:24px 0 28px}

/* Son */
.f{background:var(--char);color:var(--paper);padding:clamp(40px,5vw,80px) var(--pad) 28px;overflow:hidden}
.f__name{font-weight:800;font-size:clamp(64px,21vw,400px);letter-spacing:-.08em;line-height:.8;color:var(--sage)}
.f__row{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:32px;font-weight:500}
.f__links{font-size:14px}

/* Hareket */
.bd [data-b]{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:calc(var(--t,0) * 70ms)}
.bd [data-b].on{opacity:1;transform:none}
#grid rect{transition:opacity .3s}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .bd [data-b]{opacity:1;transform:none;transition:none}
  .hero__i1 img,.hero__i2 img{animation:none}
}

@media (max-width:1080px){
  .h__nav{display:none}
  .h__k{margin-left:auto}
  .hero{grid-template-columns:1fr 1fr}
  .hero__t{grid-column:1/-1;grid-row:auto}
  .hero__i1,.hero__i2{grid-column:auto;grid-row:auto}
  .floor__grid{grid-template-columns:1fr 1fr}
  .tile__head,.tile__vis,.reno,.addr{grid-template-columns:1fr}
  .tile__in{grid-template-columns:repeat(3,1fr)}
  .addr figure{max-width:360px}
}
@media (max-width:640px){
  .h__k{min-height:40px;padding:0 14px;font-size:15px}
  .hero__k .k{flex:1 1 100%}
  .floor__grid{grid-template-columns:1fr}
  .floor__item{min-height:0}
  .tile__in{grid-template-columns:1fr 1fr}
  .tile__in label:last-child{grid-column:1/-1}
  .reno dl div{grid-template-columns:1fr;gap:4px}
  .f__row{flex-direction:column}
}