.reference-landing.reference-izometrik-sehir{isolation:isolate;min-height:100vh;font-synthesis:none} .reference-landing.reference-izometrik-sehir a{color:inherit;text-decoration:underline} .reference-landing.reference-izometrik-sehir button{border-radius:0} .reference-landing.reference-izometrik-sehir svg{height:auto} .reference-landing.reference-izometrik-sehir [hidden]{display:none!important}

/* ============ Tokens ============
   Gündüz: gök #DDEBFF, nane #BFE6D2, tereyağı #FFE8A3, leylak #D8CCF5, mürekkep #1D2345, pencere ışığı #FFB84D
   Gece: aynı şehir, ışıklar açık */
.reference-landing.reference-izometrik-sehir{
  --sky:#DDEBFF; --mint:#BFE6D2; --butter:#FFE8A3; --lilac:#D8CCF5; --ink:#1D2345; --glow:#FFB84D;
  --bg:#F3F6FC; --surface:#FFFFFF; --surface-2:#EAF0FA; --surface-3:#E0E8F6;
  --text:#1D2345; --muted:#4B5379; --line:#D3DBEC; --line-strong:#B9C4DC;
  --accent:#1D2345; --on-accent:#FFFFFF; --accent-hover:#2C3566;
  --focus:#2F54EB;
  --g-lilac:#D8CCF5; --g-butter:#FFE8A3; --g-mint:#BFE6D2; --g-sky:#C5DAF8;
  --e-lilac:#A994E3; --e-butter:#E6BF55; --e-mint:#7FC3A3; --e-sky:#8DB3E8;
  --t-lilac:#6B52C4; --t-butter:#8A6400; --t-mint:#1E7A58; --t-sky:#2A5DA8;
  --wall-a:#FFFFFF; --wall-b:#DCE4F3; --win-off:#C3D0E8; --road:#E4EBF6; --road-line:#FFFFFF;
  --slab-a:#C4D0E6; --slab-b:#AEBBD7; --plate:rgba(29,35,69,.07); --tree:#6FBF95; --tree-2:#4FA57B; --trunk:#8D6E57;
  --stage-top:#CFE2FF; --stage-bot:#EEF4FF; --star-o:0; --sun:#FFD27A;
  --walker-head:#F5D6BC;
  --shadow: 0 1px 0 rgba(29,35,69,.04), 0 12px 32px -18px rgba(29,35,69,.35);
  --radius:18px;
  color-scheme: light;
}
.reference-landing.reference-izometrik-sehir[data-theme="dark"]{
  --bg:#0D1230; --surface:#151C44; --surface-2:#1B2452; --surface-3:#222C60;
  --text:#E8ECFF; --muted:#A9B2DA; --line:#2A3570; --line-strong:#3A468A;
  --accent:#FFB84D; --on-accent:#1D2345; --accent-hover:#FFC874;
  --focus:#FFB84D;
  --g-lilac:#383169; --g-butter:#4A4127; --g-mint:#1D473D; --g-sky:#1E3461;
  --e-lilac:#5A4FA0; --e-butter:#7A6832; --e-mint:#2D6D5B; --e-sky:#2F4F8E;
  --t-lilac:#C9BCF7; --t-butter:#FFE08A; --t-mint:#A5E3C6; --t-sky:#B3D0FA;
  --wall-a:#2D3772; --wall-b:#222B5E; --win-off:#171D48; --road:#1A2152; --road-line:#2C3777;
  --slab-a:#131940; --slab-b:#0E1333; --plate:rgba(0,0,0,.18); --tree:#2E6B55; --tree-2:#245746; --trunk:#4C3B30;
  --stage-top:#070B24; --stage-bot:#1B2358; --star-o:1; --sun:#E9EDFF;
  --walker-head:#E6C4A6;
  --shadow: 0 1px 0 rgba(0,0,0,.2), 0 16px 40px -20px rgba(0,0,0,.7);
  color-scheme: dark;
}

/* ============ Base ============ */
.reference-landing.reference-izometrik-sehir *,.reference-landing.reference-izometrik-sehir *::before,.reference-landing.reference-izometrik-sehir *::after{box-sizing:border-box}
.reference-landing.reference-izometrik-sehir{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
.reference-landing.reference-izometrik-sehir{margin:0;background:var(--bg);color:var(--text);font-family:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;font-size:17px;line-height:1.55;overflow-x:clip;transition:background-color .5s ease,color .5s ease}
.reference-landing.reference-izometrik-sehir h1,.reference-landing.reference-izometrik-sehir h2,.reference-landing.reference-izometrik-sehir h3,.reference-landing.reference-izometrik-sehir h4{font-family:'Bricolage Grotesque','Figtree',sans-serif;line-height:1.08;letter-spacing:-.02em;margin:0;font-weight:700}
.reference-landing.reference-izometrik-sehir p{margin:0}
.reference-landing.reference-izometrik-sehir a{color:inherit}
.reference-landing.reference-izometrik-sehir img,.reference-landing.reference-izometrik-sehir svg{display:block;max-width:100%}
.reference-landing.reference-izometrik-sehir button{font:inherit;color:inherit;cursor:pointer}
.reference-landing.reference-izometrik-sehir :focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:6px}
.reference-landing.reference-izometrik-sehir .wrap{max-width:1220px;margin:0 auto;padding:0 28px}
.reference-landing.reference-izometrik-sehir .visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.reference-landing.reference-izometrik-sehir .skip{position:absolute;left:12px;top:-60px;background:var(--accent);color:var(--on-accent);padding:10px 16px;border-radius:10px;z-index:100;text-decoration:none;font-weight:600}
.reference-landing.reference-izometrik-sehir .skip:focus{top:12px}
.reference-landing.reference-izometrik-sehir section{position:relative}
.reference-landing.reference-izometrik-sehir .sec{padding:120px 0}
.reference-landing.reference-izometrik-sehir .sec-head{max-width:720px;margin-bottom:56px}
.reference-landing.reference-izometrik-sehir .sec-head h2{font-size:clamp(2rem,4.2vw,3.25rem)}
.reference-landing.reference-izometrik-sehir .sec-head p{margin-top:18px;color:var(--muted);font-size:1.12rem;max-width:620px}

/* Buttons */
.reference-landing.reference-izometrik-sehir .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 22px;border-radius:14px;font-weight:600;font-size:1rem;text-decoration:none;border:1.5px solid transparent;transition:transform .15s ease,background-color .2s ease,border-color .2s ease,box-shadow .2s ease;white-space:nowrap}
.reference-landing.reference-izometrik-sehir .btn-primary{background:var(--accent);color:var(--on-accent);box-shadow:0 4px 0 color-mix(in srgb,var(--accent) 55%,#000)}
.reference-landing.reference-izometrik-sehir .btn-primary:hover{background:var(--accent-hover)}
.reference-landing.reference-izometrik-sehir .btn-primary:active{transform:translateY(3px);box-shadow:0 1px 0 color-mix(in srgb,var(--accent) 55%,#000)}
.reference-landing.reference-izometrik-sehir .btn-ghost{border-color:var(--line-strong);background:transparent}
.reference-landing.reference-izometrik-sehir .btn-ghost:hover{background:var(--surface-2)}
.reference-landing.reference-izometrik-sehir .btn-sm{min-height:40px;padding:0 16px;border-radius:12px;font-size:.95rem}
.reference-landing.reference-izometrik-sehir .btn .play{width:22px;height:22px;border-radius:50%;background:var(--surface-3);display:grid;place-items:center}

/* ============ Nav ============ */
.reference-landing.reference-izometrik-sehir .nav{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid color-mix(in srgb,var(--line) 60%,transparent);transition:background-color .5s}
.reference-landing.reference-izometrik-sehir .nav-in{display:flex;align-items:center;gap:28px;height:72px}
.reference-landing.reference-izometrik-sehir .brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:'Bricolage Grotesque';font-weight:700;font-size:1.3rem;letter-spacing:-.02em}
.reference-landing.reference-izometrik-sehir .brand svg{width:32px;height:32px}
.reference-landing.reference-izometrik-sehir .nav-links{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.reference-landing.reference-izometrik-sehir .nav-links a{display:block;padding:8px 12px;border-radius:10px;text-decoration:none;color:var(--muted);font-weight:500}
.reference-landing.reference-izometrik-sehir .nav-links a:hover{color:var(--text);background:var(--surface-2)}
.reference-landing.reference-izometrik-sehir .nav-actions{margin-left:auto;display:flex;align-items:center;gap:10px}
.reference-landing.reference-izometrik-sehir .theme-btn{width:44px;height:44px;border-radius:12px;border:1.5px solid var(--line-strong);background:var(--surface);display:grid;place-items:center}
.reference-landing.reference-izometrik-sehir .theme-btn svg{width:20px;height:20px}
.reference-landing.reference-izometrik-sehir .theme-btn .i-moon{display:none}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .theme-btn .i-sun{display:none}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .theme-btn .i-moon{display:block}
.reference-landing.reference-izometrik-sehir .login{text-decoration:none;font-weight:600;padding:8px 10px;border-radius:10px}
.reference-landing.reference-izometrik-sehir .login:hover{background:var(--surface-2)}
.reference-landing.reference-izometrik-sehir .menu-btn{display:none;width:44px;height:44px;border-radius:12px;border:1.5px solid var(--line-strong);background:var(--surface);place-items:center}
.reference-landing.reference-izometrik-sehir .mobile-menu{display:none}
@media (max-width:980px){
  .reference-landing.reference-izometrik-sehir .nav-links,.reference-landing.reference-izometrik-sehir .login{display:none}
  .reference-landing.reference-izometrik-sehir .menu-btn{display:grid}
  .reference-landing.reference-izometrik-sehir .mobile-menu[data-open="true"]{display:block;position:absolute;left:0;right:0;top:72px;background:var(--bg);border-bottom:1px solid var(--line);padding:12px 16px 20px}
  .reference-landing.reference-izometrik-sehir .mobile-menu ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
  .reference-landing.reference-izometrik-sehir .mobile-menu a{display:block;padding:12px;border-radius:10px;text-decoration:none;font-weight:600}
  .reference-landing.reference-izometrik-sehir .mobile-menu a:hover{background:var(--surface-2)}
}
@media (max-width:520px){ .reference-landing.reference-izometrik-sehir .nav-actions .btn-primary{display:none} }

/* ============ Hero ============ */
.reference-landing.reference-izometrik-sehir .hero{padding:64px 0 40px}
.reference-landing.reference-izometrik-sehir .hero-top{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:48px;align-items:end;margin-bottom:40px}
.reference-landing.reference-izometrik-sehir .hero h1{font-size:clamp(2.5rem,6.2vw,5rem);font-weight:700;letter-spacing:-.022em;max-width:12ch}
.reference-landing.reference-izometrik-sehir .hero-lead{font-size:1.18rem;color:var(--muted);max-width:520px}
.reference-landing.reference-izometrik-sehir .hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.reference-landing.reference-izometrik-sehir .hero-note{margin-top:14px;font-size:.92rem;color:var(--muted)}
@media (max-width:900px){.reference-landing.reference-izometrik-sehir .hero-top{grid-template-columns:1fr;gap:20px}}

.reference-landing.reference-izometrik-sehir .stage{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 380px;border-radius:28px;overflow:hidden;border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow)}
.reference-landing.reference-izometrik-sehir .city-wrap{position:relative;min-height:420px;background:linear-gradient(180deg,var(--stage-top),var(--stage-bot));transition:background .8s ease;overflow:hidden}
.reference-landing.reference-izometrik-sehir .city-wrap::before{content:"";position:absolute;inset:0;opacity:var(--star-o);transition:opacity 1s ease;pointer-events:none;
  background-image:
   radial-gradient(1.4px 1.4px at 8% 12%,#fff 60%,transparent 61%),radial-gradient(1px 1px at 17% 28%,#fff 60%,transparent 61%),
   radial-gradient(1.2px 1.2px at 29% 8%,#fff 60%,transparent 61%),radial-gradient(1px 1px at 41% 19%,#fff 60%,transparent 61%),
   radial-gradient(1.6px 1.6px at 58% 6%,#fff 60%,transparent 61%),radial-gradient(1px 1px at 66% 22%,#fff 60%,transparent 61%),
   radial-gradient(1.3px 1.3px at 79% 11%,#fff 60%,transparent 61%),radial-gradient(1px 1px at 91% 26%,#fff 60%,transparent 61%),
   radial-gradient(1px 1px at 12% 40%,#fff 60%,transparent 61%),radial-gradient(1.2px 1.2px at 94% 44%,#fff 60%,transparent 61%),
   radial-gradient(1px 1px at 50% 33%,#fff 60%,transparent 61%),radial-gradient(1px 1px at 3% 60%,#fff 60%,transparent 61%)}
.reference-landing.reference-izometrik-sehir .orb{position:absolute;top:28px;right:34px;width:54px;height:54px;border-radius:50%;background:var(--sun);box-shadow:0 0 0 10px color-mix(in srgb,var(--sun) 25%,transparent),0 0 60px 10px color-mix(in srgb,var(--sun) 40%,transparent);transition:background .8s,box-shadow .8s}
.reference-landing.reference-izometrik-sehir .orb::after{content:"";position:absolute;width:44px;height:44px;border-radius:50%;top:-6px;left:16px;background:var(--stage-top);transform:scale(0);transition:transform .8s ease}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .orb::after{transform:scale(1)}
.reference-landing.reference-izometrik-sehir .cloud{position:absolute;height:18px;border-radius:20px;background:#fff;opacity:.75;transition:opacity .8s}
.reference-landing.reference-izometrik-sehir .cloud::before,.reference-landing.reference-izometrik-sehir .cloud::after{content:"";position:absolute;background:#fff;border-radius:50%}
.reference-landing.reference-izometrik-sehir .cloud::before{width:26px;height:26px;left:12px;top:-12px}
.reference-landing.reference-izometrik-sehir .cloud::after{width:18px;height:18px;left:32px;top:-7px}
.reference-landing.reference-izometrik-sehir .c1{width:70px;top:60px;left:8%}.reference-landing.reference-izometrik-sehir .c2{width:54px;top:110px;left:70%}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .cloud{opacity:0}
.reference-landing.reference-izometrik-sehir #city{position:relative;width:100%;height:auto;display:block;touch-action:manipulation}
.reference-landing.reference-izometrik-sehir .daynight{position:absolute;left:16px;top:16px;z-index:3;display:flex;padding:4px;border-radius:14px;background:color-mix(in srgb,var(--surface) 85%,transparent);border:1px solid var(--line);backdrop-filter:blur(8px)}
.reference-landing.reference-izometrik-sehir .daynight button{display:flex;align-items:center;gap:6px;border:0;background:transparent;padding:8px 12px;border-radius:10px;font-weight:600;font-size:.9rem;color:var(--muted)}
.reference-landing.reference-izometrik-sehir .daynight button[aria-pressed="true"]{background:var(--accent);color:var(--on-accent)}
.reference-landing.reference-izometrik-sehir .daynight svg{width:16px;height:16px}
.reference-landing.reference-izometrik-sehir .city-hint{position:absolute;left:16px;bottom:14px;right:16px;z-index:2;font-size:.85rem;color:var(--muted);pointer-events:none}
.reference-landing.reference-izometrik-sehir .city-hint span{background:color-mix(in srgb,var(--surface) 80%,transparent);padding:6px 10px;border-radius:10px;backdrop-filter:blur(6px)}

/* city svg parts */
.reference-landing.reference-izometrik-sehir .road{fill:var(--road);transition:fill .8s}
.reference-landing.reference-izometrik-sehir .slab-a{fill:var(--slab-a);transition:fill .8s}.reference-landing.reference-izometrik-sehir .slab-b{fill:var(--slab-b);transition:fill .8s}
.reference-landing.reference-izometrik-sehir .lane{stroke:var(--road-line);stroke-width:2;stroke-dasharray:8 8;fill:none}
.reference-landing.reference-izometrik-sehir .track{stroke:var(--line-strong);stroke-width:1.4;fill:none}
.reference-landing.reference-izometrik-sehir .district{cursor:pointer;outline:none}
.reference-landing.reference-izometrik-sehir .district .ground{transition:fill .8s,stroke .2s;stroke:transparent;stroke-width:0}
.reference-landing.reference-izometrik-sehir .d-lilac .ground{fill:var(--g-lilac)}.reference-landing.reference-izometrik-sehir .d-butter .ground{fill:var(--g-butter)}.reference-landing.reference-izometrik-sehir .d-mint .ground{fill:var(--g-mint)}.reference-landing.reference-izometrik-sehir .d-sky .ground{fill:var(--g-sky)}
.reference-landing.reference-izometrik-sehir .d-lilac .curb-a,.reference-landing.reference-izometrik-sehir .d-lilac .curb-b{fill:var(--e-lilac)}.reference-landing.reference-izometrik-sehir .d-butter .curb-a,.reference-landing.reference-izometrik-sehir .d-butter .curb-b{fill:var(--e-butter)}
.reference-landing.reference-izometrik-sehir .d-mint .curb-a,.reference-landing.reference-izometrik-sehir .d-mint .curb-b{fill:var(--e-mint)}.reference-landing.reference-izometrik-sehir .d-sky .curb-a,.reference-landing.reference-izometrik-sehir .d-sky .curb-b{fill:var(--e-sky)}
.reference-landing.reference-izometrik-sehir .curb-b{filter:brightness(.9)}
.reference-landing.reference-izometrik-sehir .plate{fill:var(--plate)}
.reference-landing.reference-izometrik-sehir .district:hover .ground{stroke:var(--ink);stroke-width:1.5;stroke-opacity:.35}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .district:hover .ground{stroke:#fff}
.reference-landing.reference-izometrik-sehir .district:focus-visible .ground{stroke:var(--focus);stroke-width:4;stroke-opacity:1}
.reference-landing.reference-izometrik-sehir .bld{cursor:pointer}
.reference-landing.reference-izometrik-sehir .face-a{fill:var(--wall-a);transition:fill .8s}
.reference-landing.reference-izometrik-sehir .face-b{fill:var(--wall-b);transition:fill .8s}
.reference-landing.reference-izometrik-sehir .bld .top{transition:fill .8s}
.reference-landing.reference-izometrik-sehir .d-lilac .top{fill:var(--e-lilac)}.reference-landing.reference-izometrik-sehir .d-butter .top{fill:var(--e-butter)}.reference-landing.reference-izometrik-sehir .d-mint .top{fill:var(--e-mint)}.reference-landing.reference-izometrik-sehir .d-sky .top{fill:var(--e-sky)}
.reference-landing.reference-izometrik-sehir .top-in{fill:rgba(0,0,0,.08)}
.reference-landing.reference-izometrik-sehir .win{fill:var(--win-off);transition:fill .45s ease}
.reference-landing.reference-izometrik-sehir .win.on{fill:var(--glow)}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .win.on{fill:#FFC259}
.reference-landing.reference-izometrik-sehir .bld.hl .face-a,.reference-landing.reference-izometrik-sehir .bld.hl .face-b{stroke:var(--glow);stroke-width:1.2}
.reference-landing.reference-izometrik-sehir .floor{animation:rise .42s cubic-bezier(.2,.9,.25,1.15) both;transform-box:fill-box}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.reference-landing.reference-izometrik-sehir .tree .canopy{fill:var(--tree);transition:fill .8s}.reference-landing.reference-izometrik-sehir .tree .canopy-2{fill:var(--tree-2);transition:fill .8s}.reference-landing.reference-izometrik-sehir .tree .trunk{stroke:var(--trunk);stroke-width:2}
.reference-landing.reference-izometrik-sehir .tree{animation:pop .5s ease both;transform-box:fill-box;transform-origin:50% 100%}
@keyframes pop{from{transform:scale(0)}to{transform:scale(1)}}
.reference-landing.reference-izometrik-sehir .walker .body{stroke:rgba(0,0,0,.15);stroke-width:.6}
.reference-landing.reference-izometrik-sehir .walker .head{fill:var(--walker-head)}
.reference-landing.reference-izometrik-sehir .walker .shadow{fill:rgba(29,35,69,.18)}
.reference-landing.reference-izometrik-sehir .tram .t-a{fill:#FF9A3D}.reference-landing.reference-izometrik-sehir .tram .t-b{fill:#E7702A}.reference-landing.reference-izometrik-sehir .tram .t-top{fill:#FFC766}.reference-landing.reference-izometrik-sehir .tram .t-win{fill:#FFF3D6}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .tram .t-win{fill:#FFE39A}
.reference-landing.reference-izometrik-sehir .city-label rect{fill:var(--surface);stroke:var(--line);transition:fill .8s}
.reference-landing.reference-izometrik-sehir .city-label text{font-family:'Figtree';font-weight:700;font-size:13px;fill:var(--text)}
.reference-landing.reference-izometrik-sehir .city-label .dot{stroke:none}
.reference-landing.reference-izometrik-sehir .city.zoomed .dim{opacity:.28;transition:opacity .5s}
.reference-landing.reference-izometrik-sehir .city .district,.reference-landing.reference-izometrik-sehir .city .bld,.reference-landing.reference-izometrik-sehir .city .tree{transition:opacity .5s}
.reference-landing.reference-izometrik-sehir .ping{fill:none;stroke:var(--glow);stroke-width:2.5;transform-box:fill-box;transform-origin:center;animation:ping 1s ease-out forwards}
@keyframes ping{from{transform:scale(.15);opacity:1}to{transform:scale(1);opacity:0}}
.reference-landing.reference-izometrik-sehir .pin path{fill:var(--accent)}
.reference-landing.reference-izometrik-sehir .pin circle{fill:var(--on-accent)}
.reference-landing.reference-izometrik-sehir .walker,.reference-landing.reference-izometrik-sehir .tram,.reference-landing.reference-izometrik-sehir .city-label,.reference-landing.reference-izometrik-sehir .pin,.reference-landing.reference-izometrik-sehir .ping{pointer-events:none}
.reference-landing.reference-izometrik-sehir .pin{animation:drop .4s ease-out both}
@keyframes drop{from{transform:translateY(-14px);opacity:0}to{transform:none;opacity:1}}

/* Panel */
.reference-landing.reference-izometrik-sehir .panel{border-left:1px solid var(--line);background:var(--surface);display:flex;flex-direction:column;min-height:0;max-height:640px;transition:background .5s}
.reference-landing.reference-izometrik-sehir .pn-scroll{padding:22px 22px 18px;overflow:auto;flex:1}
.reference-landing.reference-izometrik-sehir .pn-title{font-size:1.45rem}
.reference-landing.reference-izometrik-sehir .pn-title:focus{outline:none}
.reference-landing.reference-izometrik-sehir .pn-sub{color:var(--muted);font-size:.95rem;margin-top:6px}
.reference-landing.reference-izometrik-sehir .pn-districts{list-style:none;margin:18px 0 22px;padding:0;display:grid;gap:8px}
.reference-landing.reference-izometrik-sehir .pn-districts button{width:100%;display:flex;align-items:center;gap:12px;text-align:left;border:1px solid var(--line);background:var(--surface-2);padding:12px 14px;border-radius:14px;font-weight:600;transition:border-color .2s,transform .15s}
.reference-landing.reference-izometrik-sehir .pn-districts button:hover{border-color:var(--line-strong);transform:translateX(2px)}
.reference-landing.reference-izometrik-sehir .pn-districts small{margin-left:auto;font-weight:500;color:var(--muted);font-size:.85rem}
.reference-landing.reference-izometrik-sehir .sw{width:18px;height:11px;flex:none;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.reference-landing.reference-izometrik-sehir .sw.lilac{background:var(--e-lilac)}.reference-landing.reference-izometrik-sehir .sw.butter{background:var(--e-butter)}.reference-landing.reference-izometrik-sehir .sw.mint{background:var(--e-mint)}.reference-landing.reference-izometrik-sehir .sw.sky{background:var(--e-sky)}
.reference-landing.reference-izometrik-sehir .legend{display:grid;grid-template-columns:auto 1fr;gap:8px 14px;margin:0;font-size:.92rem;padding-top:18px;border-top:1px dashed var(--line)}
.reference-landing.reference-izometrik-sehir .legend dt{font-weight:700}
.reference-landing.reference-izometrik-sehir .legend dd{margin:0;color:var(--muted)}
.reference-landing.reference-izometrik-sehir .pn-back{display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;padding:6px 8px;margin:-6px 0 10px -8px;border-radius:8px;font-weight:600;color:var(--muted);font-size:.92rem}
.reference-landing.reference-izometrik-sehir .pn-back:hover{color:var(--text);background:var(--surface-2)}
.reference-landing.reference-izometrik-sehir .crumb{font-size:.82rem;color:var(--muted);margin:10px 0 14px;display:flex;flex-wrap:wrap;gap:4px}
.reference-landing.reference-izometrik-sehir .crumb b{color:var(--text);font-weight:600}
.reference-landing.reference-izometrik-sehir .folders{display:grid;gap:10px;margin-bottom:16px}
.reference-landing.reference-izometrik-sehir .folder-name{display:flex;align-items:center;gap:6px;font-size:.8rem;font-weight:600;color:var(--muted);margin-bottom:6px}
.reference-landing.reference-izometrik-sehir .folder-name svg{width:14px;height:14px}
.reference-landing.reference-izometrik-sehir .chips{display:flex;flex-wrap:wrap;gap:6px}
.reference-landing.reference-izometrik-sehir .chip{border:1px solid var(--line);background:var(--surface);padding:6px 10px;border-radius:10px;font-size:.86rem;font-weight:600;display:inline-flex;align-items:center;gap:6px}
.reference-landing.reference-izometrik-sehir .chip[aria-pressed="true"]{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.reference-landing.reference-izometrik-sehir .chip .bars{display:inline-flex;gap:1.5px;align-items:flex-end}
.reference-landing.reference-izometrik-sehir .chip .bars i{display:block;width:3px;background:currentColor;opacity:.55;border-radius:1px}
.reference-landing.reference-izometrik-sehir .seg{display:inline-flex;border:1px solid var(--line);border-radius:11px;padding:3px;background:var(--surface-2);margin-bottom:12px}
.reference-landing.reference-izometrik-sehir .seg button{border:0;background:transparent;padding:6px 12px;border-radius:8px;font-size:.86rem;font-weight:600;color:var(--muted)}
.reference-landing.reference-izometrik-sehir .seg button[aria-pressed="true"]{background:var(--surface);color:var(--text);box-shadow:0 1px 2px rgba(0,0,0,.12)}
.reference-landing.reference-izometrik-sehir .tasks{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.reference-landing.reference-izometrik-sehir .task{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:10px 12px;border-top:1px solid var(--line);font-size:.92rem}
.reference-landing.reference-izometrik-sehir .task:first-child{border-top:0}
.reference-landing.reference-izometrik-sehir .chk{width:24px;height:24px;border-radius:7px;border:1.8px solid var(--line-strong);background:var(--surface);display:grid;place-items:center;padding:0;transition:background .2s,border-color .2s}
.reference-landing.reference-izometrik-sehir .chk svg{width:14px;height:14px;opacity:0;transform:scale(.4);transition:opacity .2s,transform .25s cubic-bezier(.2,.9,.3,1.4)}
.reference-landing.reference-izometrik-sehir .chk[aria-pressed="true"]{background:var(--glow);border-color:var(--glow)}
.reference-landing.reference-izometrik-sehir .chk[aria-pressed="true"] svg{opacity:1;transform:none}
.reference-landing.reference-izometrik-sehir .chk.doing{border-color:#5B7BE0;background:linear-gradient(90deg,color-mix(in srgb,#5B7BE0 30%,transparent) 50%,transparent 50%)}
.reference-landing.reference-izometrik-sehir .task .t-title{min-width:0}
.reference-landing.reference-izometrik-sehir .task .t-title span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.reference-landing.reference-izometrik-sehir .task.done .t-title span{color:var(--muted);text-decoration:line-through;text-decoration-color:var(--line-strong)}
.reference-landing.reference-izometrik-sehir .task .t-meta{display:flex;gap:8px;align-items:center;font-size:.78rem;color:var(--muted);margin-top:2px}
.reference-landing.reference-izometrik-sehir .flag{display:inline-block;width:8px;height:8px;border-radius:2px}
.reference-landing.reference-izometrik-sehir .p-acil{background:#E5484D}.reference-landing.reference-izometrik-sehir .p-yüksek{background:#F08C00}.reference-landing.reference-izometrik-sehir .p-normal{background:#5B7BE0}.reference-landing.reference-izometrik-sehir .p-düşük{background:#8C93B0}
.reference-landing.reference-izometrik-sehir .av{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:.66rem;font-weight:700;flex:none;border:2px solid var(--surface)}
.reference-landing.reference-izometrik-sehir .more{padding:10px 12px;font-size:.84rem;color:var(--muted);border-top:1px solid var(--line);background:var(--surface-2)}
.reference-landing.reference-izometrik-sehir .board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.reference-landing.reference-izometrik-sehir .col{background:var(--surface-2);border-radius:12px;padding:8px;min-height:120px}
.reference-landing.reference-izometrik-sehir .col h4{font-family:'Figtree';font-size:.76rem;font-weight:700;color:var(--muted);letter-spacing:0;margin:2px 2px 8px;display:flex;justify-content:space-between}
.reference-landing.reference-izometrik-sehir .card{background:var(--surface);border:1px solid var(--line);border-radius:9px;padding:7px 8px;font-size:.78rem;font-weight:600;margin-bottom:6px;line-height:1.3}
.reference-landing.reference-izometrik-sehir .card .c-foot{display:flex;justify-content:space-between;align-items:center;margin-top:6px}
.reference-landing.reference-izometrik-sehir .card .av{width:18px;height:18px;font-size:.55rem;border-width:0}
.reference-landing.reference-izometrik-sehir .card .lit{width:10px;height:10px;border-radius:2px;background:var(--glow);box-shadow:0 0 8px var(--glow)}
.reference-landing.reference-izometrik-sehir .pn-foot{border-top:1px solid var(--line);padding:14px 22px;background:var(--surface-2);font-size:.88rem}
.reference-landing.reference-izometrik-sehir .meter{height:8px;border-radius:6px;background:var(--surface-3);overflow:hidden;margin-top:8px;display:flex}
.reference-landing.reference-izometrik-sehir .meter i{display:block;height:100%;background:var(--glow);transition:width .5s ease}
.reference-landing.reference-izometrik-sehir .presence{display:flex;align-items:center;gap:8px;margin-top:10px;color:var(--muted);font-size:.84rem}
.reference-landing.reference-izometrik-sehir .stack{display:flex}
.reference-landing.reference-izometrik-sehir .stack .av{margin-left:-7px}.reference-landing.reference-izometrik-sehir .stack .av:first-child{margin-left:0}
.reference-landing.reference-izometrik-sehir .live{width:8px;height:8px;border-radius:50%;background:#2FB57C;box-shadow:0 0 0 3px color-mix(in srgb,#2FB57C 30%,transparent)}
@media (max-width:1020px){
  .reference-landing.reference-izometrik-sehir .stage{grid-template-columns:1fr}
  .reference-landing.reference-izometrik-sehir .panel{border-left:0;border-top:1px solid var(--line);max-height:none}
}

/* ============ Plan (hierarchy) ============ */
.reference-landing.reference-izometrik-sehir .plan{padding:72px 0 24px}
.reference-landing.reference-izometrik-sehir .plan-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,2fr);gap:48px;align-items:center}
.reference-landing.reference-izometrik-sehir .plan h2{font-size:clamp(1.7rem,3vw,2.4rem)}
.reference-landing.reference-izometrik-sehir .plan p.lead{color:var(--muted);margin-top:14px}
.reference-landing.reference-izometrik-sehir .levels{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;position:relative}
.reference-landing.reference-izometrik-sehir .levels li{position:relative;text-align:center;padding:0 6px}
.reference-landing.reference-izometrik-sehir .levels li+li::before{content:"";position:absolute;left:-14px;top:52px;width:28px;border-top:2px dotted var(--line-strong)}
.reference-landing.reference-izometrik-sehir .levels svg{height:96px;width:auto;margin:0 auto 12px}
.reference-landing.reference-izometrik-sehir .levels b{display:block;font-family:'Bricolage Grotesque';font-size:1.05rem}
.reference-landing.reference-izometrik-sehir .levels span{display:block;font-size:.88rem;color:var(--muted);margin-top:2px}
@media (max-width:900px){.reference-landing.reference-izometrik-sehir .plan-grid{grid-template-columns:1fr}.reference-landing.reference-izometrik-sehir .levels{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:28px}.reference-landing.reference-izometrik-sehir .levels li:nth-child(4)::before{display:none}}
@media (max-width:480px){.reference-landing.reference-izometrik-sehir .levels{grid-template-columns:repeat(2,minmax(0,1fr))}.reference-landing.reference-izometrik-sehir .levels li::before{display:none}.reference-landing.reference-izometrik-sehir .levels svg{height:76px}}
.reference-landing.reference-izometrik-sehir .iso .ia{fill:var(--wall-a)}.reference-landing.reference-izometrik-sehir .iso .ib{fill:var(--wall-b)}.reference-landing.reference-izometrik-sehir .iso .iw{fill:var(--win-off)}.reference-landing.reference-izometrik-sehir .iso .iw.on{fill:var(--glow)}
.reference-landing.reference-izometrik-sehir .iso polygon{transition:fill .8s}

/* ============ Views (app mockup) ============ */
.reference-landing.reference-izometrik-sehir .app{display:grid;grid-template-columns:236px minmax(0,1fr);border:1px solid var(--line);border-radius:22px;background:var(--surface);overflow:hidden;box-shadow:var(--shadow);min-height:560px}
.reference-landing.reference-izometrik-sehir .app-side{background:var(--surface-2);border-right:1px solid var(--line);padding:16px 12px;font-size:.9rem}
.reference-landing.reference-izometrik-sehir .ws{display:flex;align-items:center;gap:10px;padding:6px 8px 14px;border-bottom:1px solid var(--line);margin-bottom:10px}
.reference-landing.reference-izometrik-sehir .ws-logo{width:30px;height:30px;border-radius:9px;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:700;font-size:.8rem}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .ws-logo{background:var(--glow);color:var(--ink)}
.reference-landing.reference-izometrik-sehir .ws b{display:block;font-size:.92rem}.reference-landing.reference-izometrik-sehir .ws small{color:var(--muted);font-size:.76rem}
.reference-landing.reference-izometrik-sehir .side-list{list-style:none;margin:0;padding:0}
.reference-landing.reference-izometrik-sehir .side-list li{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;color:var(--muted);font-weight:500}
.reference-landing.reference-izometrik-sehir .side-list li.on{background:var(--surface);color:var(--text);font-weight:600;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.reference-landing.reference-izometrik-sehir .side-list svg{width:16px;height:16px;flex:none}
.reference-landing.reference-izometrik-sehir .side-list .badge{margin-left:auto;background:var(--accent);color:var(--on-accent);font-size:.7rem;font-weight:700;padding:1px 7px;border-radius:10px}
.reference-landing.reference-izometrik-sehir .side-h{font-size:.74rem;font-weight:700;color:var(--muted);margin:14px 8px 6px}
.reference-landing.reference-izometrik-sehir .side-list .ind1{padding-left:22px}.reference-landing.reference-izometrik-sehir .side-list .ind2{padding-left:38px}
.reference-landing.reference-izometrik-sehir .app-main{min-width:0;display:flex;flex-direction:column}
.reference-landing.reference-izometrik-sehir .app-head{display:flex;align-items:center;gap:16px;padding:16px 20px 0;flex-wrap:wrap}
.reference-landing.reference-izometrik-sehir .app-head .crumb{margin:0 0 2px}
.reference-landing.reference-izometrik-sehir .app-head h3{font-size:1.4rem}
.reference-landing.reference-izometrik-sehir .app-head .presence{margin:0 0 0 auto}
.reference-landing.reference-izometrik-sehir .vtabs{display:flex;gap:2px;padding:12px 16px 0;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.reference-landing.reference-izometrik-sehir .vtabs button{border:0;background:transparent;padding:10px 12px;font-weight:600;color:var(--muted);border-bottom:2.5px solid transparent;margin-bottom:-1px;display:flex;align-items:center;gap:7px;white-space:nowrap;border-radius:8px 8px 0 0}
.reference-landing.reference-izometrik-sehir .vtabs button svg{width:16px;height:16px}
.reference-landing.reference-izometrik-sehir .vtabs button[aria-selected="true"]{color:var(--text);border-bottom-color:var(--accent)}
.reference-landing.reference-izometrik-sehir .vtabs button:hover{background:var(--surface-2)}
.reference-landing.reference-izometrik-sehir .vpanel{padding:18px 20px 22px;flex:1;min-width:0}
.reference-landing.reference-izometrik-sehir .vpanel[hidden]{display:none}
.reference-landing.reference-izometrik-sehir .toolbar{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.reference-landing.reference-izometrik-sehir .tb{border:1px solid var(--line);border-radius:9px;padding:5px 10px;font-size:.82rem;font-weight:600;color:var(--muted);background:var(--surface)}
.reference-landing.reference-izometrik-sehir .tb.primary{margin-left:auto;background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.reference-landing.reference-izometrik-sehir .table-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:14px}
.reference-landing.reference-izometrik-sehir table.tt{width:100%;border-collapse:collapse;font-size:.88rem;min-width:640px}
.reference-landing.reference-izometrik-sehir .tt th{text-align:left;font-weight:600;color:var(--muted);font-size:.78rem;padding:9px 12px;background:var(--surface-2);border-bottom:1px solid var(--line)}
.reference-landing.reference-izometrik-sehir .tt td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.reference-landing.reference-izometrik-sehir .tt tr.grp td{background:var(--surface);font-weight:700;font-size:.8rem;padding-top:14px}
.reference-landing.reference-izometrik-sehir .tt tr:last-child td{border-bottom:0}
.reference-landing.reference-izometrik-sehir .pill{display:inline-flex;align-items:center;gap:6px;font-size:.76rem;font-weight:700;padding:3px 9px;border-radius:20px}
.reference-landing.reference-izometrik-sehir .st-t{background:var(--surface-3);color:var(--muted)}
.reference-landing.reference-izometrik-sehir .st-d{background:color-mix(in srgb,#5B7BE0 18%,transparent);color:#3E5FC8}
.reference-landing.reference-izometrik-sehir .st-r{background:color-mix(in srgb,#B06AE0 18%,transparent);color:#8A45BD}
.reference-landing.reference-izometrik-sehir .st-x{background:color-mix(in srgb,var(--glow) 28%,transparent);color:#8A5300}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .st-d{color:#A8BCFF}.reference-landing.reference-izometrik-sehir [data-theme="dark"] .st-r{color:#DDB5F7}.reference-landing.reference-izometrik-sehir [data-theme="dark"] .st-x{color:#FFD18A}
.reference-landing.reference-izometrik-sehir .sub{font-size:.75rem;color:var(--muted);margin-left:6px;font-weight:600}
.reference-landing.reference-izometrik-sehir .cf{font-size:.78rem;padding:2px 8px;border-radius:6px;background:var(--surface-2);border:1px solid var(--line);font-weight:600}
.reference-landing.reference-izometrik-sehir .kanban{display:grid;grid-template-columns:repeat(4,minmax(200px,1fr));gap:12px;overflow-x:auto;padding-bottom:4px}
.reference-landing.reference-izometrik-sehir .kcol{background:var(--surface-2);border-radius:14px;padding:10px}
.reference-landing.reference-izometrik-sehir .kcol h4{font-family:'Figtree';font-size:.84rem;display:flex;align-items:center;gap:8px;margin:2px 4px 10px;letter-spacing:0}
.reference-landing.reference-izometrik-sehir .kcol h4 small{margin-left:auto;color:var(--muted)}
.reference-landing.reference-izometrik-sehir .kcard{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:8px;font-size:.86rem}
.reference-landing.reference-izometrik-sehir .kcard b{display:block;font-weight:600;margin-bottom:8px}
.reference-landing.reference-izometrik-sehir .kcard .kfoot{display:flex;align-items:center;gap:8px;font-size:.75rem;color:var(--muted)}
.reference-landing.reference-izometrik-sehir .kcard .kfoot .av{width:22px;height:22px;margin-left:auto;border:0}
.reference-landing.reference-izometrik-sehir .kcard .tag{font-size:.7rem;font-weight:700;padding:2px 7px;border-radius:6px}
.reference-landing.reference-izometrik-sehir .tag.l{background:var(--g-lilac);color:var(--t-lilac)}.reference-landing.reference-izometrik-sehir .tag.b{background:var(--g-butter);color:var(--t-butter)}.reference-landing.reference-izometrik-sehir .tag.m{background:var(--g-mint);color:var(--t-mint)}.reference-landing.reference-izometrik-sehir .tag.s{background:var(--g-sky);color:var(--t-sky)}
.reference-landing.reference-izometrik-sehir .wb{border:1px solid var(--line);border-radius:14px;background-color:var(--surface);background-image:radial-gradient(var(--line) 1.2px,transparent 1.3px);background-size:22px 22px;overflow:hidden}
.reference-landing.reference-izometrik-sehir .wb svg{width:100%;height:auto}
.reference-landing.reference-izometrik-sehir .wb .note-t{font-family:'Figtree';font-size:13px;font-weight:600;fill:#1D2345}
.reference-landing.reference-izometrik-sehir .wb .conn{stroke:var(--muted);stroke-width:1.6;fill:none}
.reference-landing.reference-izometrik-sehir .wb .cur-t{font-family:'Figtree';font-size:11px;font-weight:700;fill:#fff}
.reference-landing.reference-izometrik-sehir .wb .frame-t{font-family:'Bricolage Grotesque';font-size:15px;font-weight:700;fill:var(--text)}
.reference-landing.reference-izometrik-sehir .dash{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.reference-landing.reference-izometrik-sehir .wdg{border:1px solid var(--line);border-radius:14px;padding:14px;background:var(--surface)}
.reference-landing.reference-izometrik-sehir .wdg h4{font-family:'Figtree';font-size:.82rem;color:var(--muted);font-weight:600;letter-spacing:0;margin-bottom:8px}
.reference-landing.reference-izometrik-sehir .wdg .big{font-family:'Bricolage Grotesque';font-size:2rem;font-weight:700}
.reference-landing.reference-izometrik-sehir .wdg .delta{font-size:.8rem;color:#1E8A5B;font-weight:600}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .wdg .delta{color:#7EE0B0}
.reference-landing.reference-izometrik-sehir .w2{grid-column:span 2}.reference-landing.reference-izometrik-sehir .w3{grid-column:span 3}.reference-landing.reference-izometrik-sehir .w4{grid-column:span 4}
.reference-landing.reference-izometrik-sehir .wbars{display:grid;gap:9px}
.reference-landing.reference-izometrik-sehir .wbar{display:grid;grid-template-columns:90px 1fr 34px;gap:10px;align-items:center;font-size:.82rem}
.reference-landing.reference-izometrik-sehir .wbar .tr{height:10px;background:var(--surface-2);border-radius:6px;overflow:hidden}
.reference-landing.reference-izometrik-sehir .wbar .tr i{display:block;height:100%;border-radius:6px}
@media (max-width:860px){
  .reference-landing.reference-izometrik-sehir .app{grid-template-columns:1fr}
  .reference-landing.reference-izometrik-sehir .app-side{display:none}
  .reference-landing.reference-izometrik-sehir .dash{grid-template-columns:repeat(2,minmax(0,1fr))}
  .reference-landing.reference-izometrik-sehir .w2,.reference-landing.reference-izometrik-sehir .w3,.reference-landing.reference-izometrik-sehir .w4{grid-column:span 2}
  .reference-landing.reference-izometrik-sehir .w1{grid-column:span 1}
}

/* ============ Infrastructure tiles ============ */
.reference-landing.reference-izometrik-sehir .infra{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:22px 20px}
.reference-landing.reference-izometrik-sehir .tile{--tbg:var(--g-sky);--tedge:var(--e-sky);background:var(--tbg);border-radius:22px;padding:24px;box-shadow:0 8px 0 var(--tedge);display:flex;flex-direction:column;gap:16px;transition:background .8s,box-shadow .8s;min-width:0}
.reference-landing.reference-izometrik-sehir .tile.lilac{--tbg:var(--g-lilac);--tedge:var(--e-lilac)}.reference-landing.reference-izometrik-sehir .tile.butter{--tbg:var(--g-butter);--tedge:var(--e-butter)}.reference-landing.reference-izometrik-sehir .tile.mint{--tbg:var(--g-mint);--tedge:var(--e-mint)}
.reference-landing.reference-izometrik-sehir .tile-head{display:flex;gap:14px;align-items:flex-start}
.reference-landing.reference-izometrik-sehir .tile-head svg{width:64px;height:56px;flex:none}
.reference-landing.reference-izometrik-sehir .tile h3{font-size:1.35rem}
.reference-landing.reference-izometrik-sehir .tile .meta{font-size:.92rem;font-weight:600;opacity:.8;margin-top:2px}
.reference-landing.reference-izometrik-sehir .tile p.desc{font-size:.97rem}
.reference-landing.reference-izometrik-sehir .span-7{grid-column:span 7}.reference-landing.reference-izometrik-sehir .span-5{grid-column:span 5}.reference-landing.reference-izometrik-sehir .span-4{grid-column:span 4}.reference-landing.reference-izometrik-sehir .span-6{grid-column:span 6}.reference-landing.reference-izometrik-sehir .span-8{grid-column:span 8}
@media (max-width:980px){.reference-landing.reference-izometrik-sehir .span-7,.reference-landing.reference-izometrik-sehir .span-5,.reference-landing.reference-izometrik-sehir .span-4,.reference-landing.reference-izometrik-sehir .span-6,.reference-landing.reference-izometrik-sehir .span-8{grid-column:span 12}}
.reference-landing.reference-izometrik-sehir .mock{background:var(--surface);border-radius:14px;border:1px solid color-mix(in srgb,var(--tedge) 60%,transparent);padding:14px;font-size:.86rem;margin-top:auto}
.reference-landing.reference-izometrik-sehir .rule{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center}
.reference-landing.reference-izometrik-sehir .rule-step{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:10px;background:var(--surface-2);font-weight:600}
.reference-landing.reference-izometrik-sehir .rule-step small{display:block;font-weight:500;color:var(--muted);font-size:.74rem}
.reference-landing.reference-izometrik-sehir .rule-k{font-size:.72rem;font-weight:700;color:var(--muted);width:66px}
.reference-landing.reference-izometrik-sehir .tram-line{position:relative;height:34px;margin:14px 0 6px}
.reference-landing.reference-izometrik-sehir .tram-line .rail{position:absolute;left:0;right:0;top:22px;border-top:2px solid var(--line-strong)}
.reference-landing.reference-izometrik-sehir .tram-line .stop{position:absolute;top:15px;width:14px;height:14px;border-radius:50%;background:var(--surface);border:2.5px solid var(--ink)}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .tram-line .stop{border-color:var(--text)}
.reference-landing.reference-izometrik-sehir .tram-line .stop span{position:absolute;top:18px;left:50%;transform:translateX(-50%);font-size:.7rem;white-space:nowrap;color:var(--muted);font-weight:600}
.reference-landing.reference-izometrik-sehir .tram-car{position:absolute;top:5px;left:0;width:44px;height:18px;border-radius:6px 6px 3px 3px;background:#FF9A3D;box-shadow:inset 0 -4px 0 #E7702A;animation:tram 9s ease-in-out infinite}
.reference-landing.reference-izometrik-sehir .tram-car::before{content:"";position:absolute;left:6px;right:6px;top:4px;height:6px;border-radius:2px;background:repeating-linear-gradient(90deg,#FFF3D6 0 8px,transparent 8px 11px)}
@keyframes tram{0%,12%{left:0}40%,55%{left:calc(50% - 22px)}85%,100%{left:calc(100% - 44px)}}
.reference-landing.reference-izometrik-sehir .usage{display:flex;justify-content:space-between;font-size:.8rem;color:var(--muted);margin-top:22px}
.reference-landing.reference-izometrik-sehir .logrow{display:flex;gap:10px;align-items:center;padding:7px 0;border-top:1px solid var(--line);font-size:.8rem}
.reference-landing.reference-izometrik-sehir .logrow:first-of-type{border-top:0}
.reference-landing.reference-izometrik-sehir .logrow time{margin-left:auto;color:var(--muted);font-variant-numeric:tabular-nums}
.reference-landing.reference-izometrik-sehir .okdot{width:8px;height:8px;border-radius:50%;background:#2FB57C;flex:none}
.reference-landing.reference-izometrik-sehir .chat{display:grid;grid-template-columns:120px 1fr;gap:12px}
.reference-landing.reference-izometrik-sehir .chan{list-style:none;margin:0;padding:0;font-size:.8rem}
.reference-landing.reference-izometrik-sehir .chan li{padding:5px 8px;border-radius:7px;color:var(--muted);font-weight:500;display:flex;gap:6px;align-items:center}
.reference-landing.reference-izometrik-sehir .chan li.on{background:var(--surface-2);color:var(--text);font-weight:700}
.reference-landing.reference-izometrik-sehir .chan .lock{width:11px;height:11px}
.reference-landing.reference-izometrik-sehir .msg{display:grid;grid-template-columns:auto 1fr;gap:8px;margin-bottom:10px}
.reference-landing.reference-izometrik-sehir .msg .av{width:26px;height:26px;border:0}
.reference-landing.reference-izometrik-sehir .msg b{font-size:.8rem}.reference-landing.reference-izometrik-sehir .msg time{font-size:.72rem;color:var(--muted);margin-left:6px}
.reference-landing.reference-izometrik-sehir .msg p{font-size:.84rem}
.reference-landing.reference-izometrik-sehir .mention{background:color-mix(in srgb,#5B7BE0 18%,transparent);color:#3E5FC8;border-radius:5px;padding:0 4px;font-weight:600}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .mention{color:#B7C7FF}
.reference-landing.reference-izometrik-sehir .thread{font-size:.76rem;font-weight:700;color:#3E5FC8;margin-top:4px;display:flex;gap:6px;align-items:center}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .thread{color:#B7C7FF}
.reference-landing.reference-izometrik-sehir .sched{display:flex;align-items:center;gap:8px;border:1px dashed var(--line-strong);border-radius:10px;padding:7px 10px;font-size:.78rem;color:var(--muted)}
.reference-landing.reference-izometrik-sehir .doc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:12px}
.reference-landing.reference-izometrik-sehir .tree-l{list-style:none;margin:0;padding:0;font-size:.8rem}
.reference-landing.reference-izometrik-sehir .tree-l li{padding:4px 6px;border-radius:6px;display:flex;align-items:center;gap:6px}
.reference-landing.reference-izometrik-sehir .tree-l li.on{background:var(--surface-2);font-weight:700}
.reference-landing.reference-izometrik-sehir .tree-l .i1{padding-left:18px}.reference-landing.reference-izometrik-sehir .tree-l .i2{padding-left:32px}
.reference-landing.reference-izometrik-sehir .perm{border:1px solid var(--line);border-radius:10px;padding:10px;font-size:.78rem}
.reference-landing.reference-izometrik-sehir .perm-row{display:flex;align-items:center;gap:8px;padding:5px 0}
.reference-landing.reference-izometrik-sehir .perm-row .av{width:22px;height:22px;border:0}
.reference-landing.reference-izometrik-sehir .perm-row select{margin-left:auto;font:inherit;font-size:.74rem;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--text);padding:2px 4px}
.reference-landing.reference-izometrik-sehir .form-b{display:grid;gap:8px}
.reference-landing.reference-izometrik-sehir .fld{border:1px solid var(--line);border-radius:9px;padding:7px 10px;background:var(--surface-2)}
.reference-landing.reference-izometrik-sehir .fld label{display:block;font-size:.72rem;font-weight:700;color:var(--muted)}
.reference-landing.reference-izometrik-sehir .fld .ph{height:8px;border-radius:4px;background:var(--surface-3);margin-top:6px;width:70%}
.reference-landing.reference-izometrik-sehir .link-row{display:flex;align-items:center;gap:8px;font-size:.78rem;border-radius:9px;padding:7px 10px;background:var(--surface-2);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.reference-landing.reference-izometrik-sehir .link-row button{margin-left:auto;border:1px solid var(--line);background:var(--surface);border-radius:7px;padding:3px 8px;font-size:.72rem;font-family:'Figtree';font-weight:700}
.reference-landing.reference-izometrik-sehir .subs{width:100%;border-collapse:collapse;font-size:.76rem;margin-top:8px}
.reference-landing.reference-izometrik-sehir .subs th{text-align:left;color:var(--muted);font-weight:600;padding:5px 4px;border-bottom:1px solid var(--line)}
.reference-landing.reference-izometrik-sehir .subs td{padding:6px 4px;border-bottom:1px solid var(--line)}
.reference-landing.reference-izometrik-sehir .occ{display:grid;gap:10px}
.reference-landing.reference-izometrik-sehir .occ-row{display:grid;grid-template-columns:auto 84px 1fr auto;gap:10px;align-items:center;font-size:.8rem}
.reference-landing.reference-izometrik-sehir .occ-row .av{border:0;width:26px;height:26px}
.reference-landing.reference-izometrik-sehir .floors{display:flex;gap:3px}
.reference-landing.reference-izometrik-sehir .floors i{width:12px;height:16px;border-radius:2px;background:var(--win-off)}
.reference-landing.reference-izometrik-sehir .floors i.on{background:var(--glow)}
.reference-landing.reference-izometrik-sehir .floors i.over{background:#E5484D}
.reference-landing.reference-izometrik-sehir .occ-row em{font-style:normal;color:var(--muted);font-variant-numeric:tabular-nums}
.reference-landing.reference-izometrik-sehir .ib-row{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:start;padding:9px 0;border-top:1px solid var(--line);font-size:.8rem}
.reference-landing.reference-izometrik-sehir .ib-row:first-child{border-top:0}
.reference-landing.reference-izometrik-sehir .ib-row .av{width:26px;height:26px;border:0}
.reference-landing.reference-izometrik-sehir .ib-row time{color:var(--muted);font-size:.72rem}
.reference-landing.reference-izometrik-sehir .ib-row.unread b::after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#E5484D;margin-left:6px;vertical-align:middle}
.reference-landing.reference-izometrik-sehir .pass{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;border:2px dashed var(--line-strong);border-radius:14px;padding:14px;position:relative}
.reference-landing.reference-izometrik-sehir .pass .qr{width:64px;height:64px;border-radius:8px;background:
  conic-gradient(from 90deg at 30% 30%,var(--text) 25%,transparent 0) 0 0/16px 16px,var(--surface-2)}
.reference-landing.reference-izometrik-sehir .pass b{display:block;font-size:.95rem}
.reference-landing.reference-izometrik-sehir .pass ul{list-style:none;margin:6px 0 0;padding:0;font-size:.78rem;color:var(--muted)}
.reference-landing.reference-izometrik-sehir .pass li{display:flex;gap:6px;align-items:center}
.reference-landing.reference-izometrik-sehir .pass li svg{width:12px;height:12px}
.reference-landing.reference-izometrik-sehir .minis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:40px}
.reference-landing.reference-izometrik-sehir .mini{padding:18px 4px;border-top:2px solid var(--line)}
.reference-landing.reference-izometrik-sehir .mini h3{font-size:1.1rem;margin-bottom:6px}
.reference-landing.reference-izometrik-sehir .mini p{color:var(--muted);font-size:.95rem}
@media (max-width:760px){.reference-landing.reference-izometrik-sehir .minis{grid-template-columns:1fr}.reference-landing.reference-izometrik-sehir .chat,.reference-landing.reference-izometrik-sehir .doc{grid-template-columns:1fr}}

/* ============ Devices ============ */
.reference-landing.reference-izometrik-sehir .devices{display:grid;grid-template-columns:auto minmax(0,1fr);gap:56px;align-items:start}
.reference-landing.reference-izometrik-sehir .phone-col{display:flex;flex-direction:column;align-items:center;gap:16px}
.reference-landing.reference-izometrik-sehir .phone{width:290px;height:590px;border-radius:44px;background:#141935;padding:11px;box-shadow:var(--shadow),inset 0 0 0 2px #2A3163;position:relative}
.reference-landing.reference-izometrik-sehir .phone-scr{width:100%;height:100%;border-radius:34px;background:var(--bg);overflow:hidden;position:relative;display:flex;flex-direction:column;font-size:.82rem}
.reference-landing.reference-izometrik-sehir .p-status{display:flex;justify-content:space-between;padding:12px 22px 6px;font-size:.72rem;font-weight:700}
.reference-landing.reference-izometrik-sehir .p-notch{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:84px;height:22px;border-radius:14px;background:#141935}
.reference-landing.reference-izometrik-sehir .p-off{margin:4px 12px 0;padding:8px 10px;border-radius:10px;background:#FFE3B3;color:#6A3F00;font-weight:600;font-size:.74rem;display:flex;gap:8px;align-items:center;transform-origin:top;transition:all .3s ease;max-height:60px}
.reference-landing.reference-izometrik-sehir .p-off[hidden]{display:flex;max-height:0;padding-top:0;padding-bottom:0;margin-top:0;opacity:0;overflow:hidden}
.reference-landing.reference-izometrik-sehir .p-body{padding:10px 16px;flex:1;overflow:hidden}
.reference-landing.reference-izometrik-sehir .p-body h4{font-size:1.2rem;margin:4px 0 2px}
.reference-landing.reference-izometrik-sehir .p-body .hi{color:var(--muted);font-size:.78rem}
.reference-landing.reference-izometrik-sehir .p-sec{font-weight:700;font-size:.74rem;color:var(--muted);margin:14px 0 6px}
.reference-landing.reference-izometrik-sehir .p-task{display:flex;align-items:center;gap:8px;padding:9px 10px;background:var(--surface);border:1px solid var(--line);border-radius:12px;margin-bottom:6px;font-weight:600}
.reference-landing.reference-izometrik-sehir .p-task i{width:16px;height:16px;border-radius:5px;border:1.6px solid var(--line-strong);flex:none}
.reference-landing.reference-izometrik-sehir .p-task i.on{background:var(--glow);border-color:var(--glow)}
.reference-landing.reference-izometrik-sehir .p-task small{margin-left:auto;color:var(--muted);font-weight:500}
.reference-landing.reference-izometrik-sehir .p-chat{display:flex;gap:8px;align-items:center;padding:6px 0}
.reference-landing.reference-izometrik-sehir .p-chat .av{width:28px;height:28px;border:0}
.reference-landing.reference-izometrik-sehir .p-chat span{color:var(--muted);font-size:.74rem;display:block}
.reference-landing.reference-izometrik-sehir .p-tabs{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);background:var(--surface);padding:8px 4px 16px;position:relative}
.reference-landing.reference-izometrik-sehir .p-tabs div{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:.66rem;font-weight:600;color:var(--muted)}
.reference-landing.reference-izometrik-sehir .p-tabs div.on{color:var(--text)}
.reference-landing.reference-izometrik-sehir .p-tabs svg{width:20px;height:20px}
.reference-landing.reference-izometrik-sehir .fab{position:absolute;right:16px;bottom:78px;width:52px;height:52px;border-radius:17px;border:0;background:var(--accent);color:var(--on-accent);display:grid;place-items:center;box-shadow:0 8px 20px -6px rgba(0,0,0,.45);transition:transform .25s cubic-bezier(.2,.9,.3,1.3);z-index:3}
.reference-landing.reference-izometrik-sehir .fab svg{width:22px;height:22px;transition:transform .25s}
.reference-landing.reference-izometrik-sehir .fab[aria-expanded="true"] svg{transform:rotate(45deg)}
.reference-landing.reference-izometrik-sehir .quick{position:absolute;right:16px;bottom:140px;display:grid;gap:8px;z-index:3;transition:opacity .2s,transform .2s}
.reference-landing.reference-izometrik-sehir .quick[hidden]{display:grid;opacity:0;transform:translateY(8px);pointer-events:none;visibility:hidden}
.reference-landing.reference-izometrik-sehir .quick span{display:flex;align-items:center;gap:8px;justify-content:flex-end;background:var(--surface);border:1px solid var(--line);padding:8px 12px;border-radius:12px;font-weight:600;font-size:.78rem;box-shadow:var(--shadow)}
.reference-landing.reference-izometrik-sehir .dev-side{display:grid;gap:28px;min-width:0}
.reference-landing.reference-izometrik-sehir .tablet{border-radius:28px;background:#141935;padding:12px;box-shadow:var(--shadow)}
.reference-landing.reference-izometrik-sehir .tablet-scr{border-radius:18px;background:var(--bg);overflow:hidden;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr);min-height:330px;font-size:.82rem}
.reference-landing.reference-izometrik-sehir .t-list{border-right:1px solid var(--line);padding:14px;background:var(--surface-2)}
.reference-landing.reference-izometrik-sehir .t-list h5,.reference-landing.reference-izometrik-sehir .t-det h5{font-family:'Bricolage Grotesque';font-size:1rem;margin:0 0 10px}
.reference-landing.reference-izometrik-sehir .t-item{padding:8px 10px;border-radius:10px;margin-bottom:4px;display:flex;justify-content:space-between;gap:8px;font-weight:600}
.reference-landing.reference-izometrik-sehir .t-item.on{background:var(--surface);box-shadow:0 1px 3px rgba(0,0,0,.1)}
.reference-landing.reference-izometrik-sehir .t-item small{color:var(--muted);font-weight:500;white-space:nowrap}
.reference-landing.reference-izometrik-sehir .t-det{padding:16px}
.reference-landing.reference-izometrik-sehir .t-fields{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:.78rem;margin:10px 0 14px}
.reference-landing.reference-izometrik-sehir .t-fields dt{color:var(--muted)}.reference-landing.reference-izometrik-sehir .t-fields dd{margin:0;font-weight:600}
.reference-landing.reference-izometrik-sehir .subtask{display:flex;gap:8px;align-items:center;padding:4px 0;font-size:.8rem}
.reference-landing.reference-izometrik-sehir .subtask i{width:14px;height:14px;border-radius:4px;border:1.5px solid var(--line-strong)}
.reference-landing.reference-izometrik-sehir .subtask i.on{background:var(--glow);border-color:var(--glow)}
.reference-landing.reference-izometrik-sehir .desk{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:center}
.reference-landing.reference-izometrik-sehir .win-mock{border-radius:14px;border:1px solid var(--line);background:var(--surface);overflow:hidden;box-shadow:var(--shadow)}
.reference-landing.reference-izometrik-sehir .win-bar{display:flex;gap:6px;padding:10px 12px;background:var(--surface-2);border-bottom:1px solid var(--line)}
.reference-landing.reference-izometrik-sehir .win-bar i{width:10px;height:10px;border-radius:50%;background:var(--line-strong)}
.reference-landing.reference-izometrik-sehir .win-body{padding:22px;text-align:center}
.reference-landing.reference-izometrik-sehir .win-body b{display:block;font-family:'Bricolage Grotesque';font-size:1.1rem;margin:10px 0 4px}
.reference-landing.reference-izometrik-sehir .win-body p{font-size:.85rem;color:var(--muted)}
.reference-landing.reference-izometrik-sehir .win-body .fake-btn{display:inline-block;margin-top:14px;padding:8px 14px;border-radius:10px;background:var(--accent);color:var(--on-accent);font-weight:700;font-size:.85rem}
.reference-landing.reference-izometrik-sehir .steps{list-style:none;margin:16px 0 0;padding:0;counter-reset:s;display:grid;gap:12px}
.reference-landing.reference-izometrik-sehir .steps li{counter-increment:s;display:grid;grid-template-columns:32px 1fr;gap:12px;align-items:start}
.reference-landing.reference-izometrik-sehir .steps li::before{content:counter(s);width:32px;height:32px;border-radius:10px;background:var(--surface-2);border:1px solid var(--line);display:grid;place-items:center;font-weight:700;font-family:'Bricolage Grotesque'}
.reference-landing.reference-izometrik-sehir .dev-copy h3{font-size:1.4rem;margin-bottom:8px}
.reference-landing.reference-izometrik-sehir .dev-copy p{color:var(--muted)}
.reference-landing.reference-izometrik-sehir .toggle-line{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
@media (max-width:980px){.reference-landing.reference-izometrik-sehir .devices{grid-template-columns:1fr}.reference-landing.reference-izometrik-sehir .desk{grid-template-columns:1fr}}
@media (max-width:560px){.reference-landing.reference-izometrik-sehir .tablet-scr{grid-template-columns:1fr}.reference-landing.reference-izometrik-sehir .t-list{border-right:0;border-bottom:1px solid var(--line)}.reference-landing.reference-izometrik-sehir .phone{width:270px;height:560px}}

/* ============ Security ============ */
.reference-landing.reference-izometrik-sehir .sec-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:56px;align-items:start}
.reference-landing.reference-izometrik-sehir .vault{border-radius:24px;overflow:hidden;border:1px solid var(--line);background:var(--surface)}
.reference-landing.reference-izometrik-sehir .vault svg{width:100%;height:auto}
.reference-landing.reference-izometrik-sehir .vault text{font-family:'Figtree';font-weight:700}
.reference-landing.reference-izometrik-sehir .v-sky{fill:var(--sky)}.reference-landing.reference-izometrik-sehir [data-theme="dark"] .v-sky{fill:#101640}
.reference-landing.reference-izometrik-sehir .v-soil1{fill:#C9B8A4}.reference-landing.reference-izometrik-sehir .v-soil2{fill:#B39F88}.reference-landing.reference-izometrik-sehir .v-soil3{fill:#9C876F}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .v-soil1{fill:#2E2A3A}.reference-landing.reference-izometrik-sehir [data-theme="dark"] .v-soil2{fill:#26222F}.reference-landing.reference-izometrik-sehir [data-theme="dark"] .v-soil3{fill:#1E1B26}
.reference-landing.reference-izometrik-sehir .v-room{fill:var(--surface);stroke:var(--ink);stroke-width:2}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .v-room{stroke:#8A93C8}
.reference-landing.reference-izometrik-sehir .v-t{fill:var(--text);font-size:13px}
.reference-landing.reference-izometrik-sehir .v-s{fill:var(--muted);font-size:11px;font-weight:600}
.reference-landing.reference-izometrik-sehir .v-door{fill:var(--surface-2);stroke:var(--ink);stroke-width:2}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .v-door{stroke:#8A93C8}
.reference-landing.reference-izometrik-sehir .v-wall{fill:var(--wall-a);stroke:var(--ink);stroke-width:1.5}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .v-wall{stroke:#5A64A0}
.reference-landing.reference-izometrik-sehir .v-win{fill:var(--glow)}
.reference-landing.reference-izometrik-sehir .v-fence{stroke:var(--ink);stroke-width:2;stroke-dasharray:3 4}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .v-fence{stroke:#8A93C8}
.reference-landing.reference-izometrik-sehir .v-pipe{stroke:var(--glow);stroke-width:3;fill:none;stroke-dasharray:6 6;animation:flow 1.6s linear infinite}
@keyframes flow{to{stroke-dashoffset:-24}}
.reference-landing.reference-izometrik-sehir .trust{list-style:none;margin:0;padding:0;display:grid;gap:22px}
.reference-landing.reference-izometrik-sehir .trust li{display:grid;grid-template-columns:44px 1fr;gap:16px}
.reference-landing.reference-izometrik-sehir .trust .ic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--surface-2);border:1px solid var(--line)}
.reference-landing.reference-izometrik-sehir .trust .ic svg{width:22px;height:22px}
.reference-landing.reference-izometrik-sehir .trust h3{font-size:1.1rem;margin-bottom:4px}
.reference-landing.reference-izometrik-sehir .trust p{color:var(--muted);font-size:.96rem}
.reference-landing.reference-izometrik-sehir .a11y{margin-top:48px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;padding:28px;border-radius:24px;background:var(--surface-2);border:1px solid var(--line)}
.reference-landing.reference-izometrik-sehir .a11y h3{font-size:1.35rem;margin-bottom:6px}
.reference-landing.reference-izometrik-sehir .a11y p{color:var(--muted)}
.reference-landing.reference-izometrik-sehir .ctrl{margin-top:18px}
.reference-landing.reference-izometrik-sehir .ctrl label,.reference-landing.reference-izometrik-sehir .ctrl legend{display:block;font-weight:700;font-size:.9rem;margin-bottom:8px;padding:0}
.reference-landing.reference-izometrik-sehir .ctrl fieldset{border:0;margin:0;padding:0}
.reference-landing.reference-izometrik-sehir .ctrl input[type=range]{width:100%;accent-color:var(--accent)}
.reference-landing.reference-izometrik-sehir .radios{display:inline-flex;border:1px solid var(--line);border-radius:12px;padding:3px;background:var(--surface)}
.reference-landing.reference-izometrik-sehir .radios label{margin:0;font-weight:600;font-size:.88rem;padding:7px 14px;border-radius:9px;cursor:pointer;color:var(--muted)}
.reference-landing.reference-izometrik-sehir .radios input{position:absolute;opacity:0;width:1px;height:1px}
.reference-landing.reference-izometrik-sehir .radios input:checked+span{color:var(--text)}
.reference-landing.reference-izometrik-sehir .radios label:has(input:checked){background:var(--surface-2);box-shadow:inset 0 0 0 1.5px var(--line-strong);color:var(--text)}
.reference-landing.reference-izometrik-sehir .radios label:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:2px}
.reference-landing.reference-izometrik-sehir .demo{--fs:15px;--pad:12px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:6px 0;font-size:var(--fs);align-self:center}
.reference-landing.reference-izometrik-sehir .demo div{display:flex;align-items:center;gap:10px;padding:var(--pad) 16px;border-top:1px solid var(--line);transition:padding .2s}
.reference-landing.reference-izometrik-sehir .demo div:first-child{border-top:0}
.reference-landing.reference-izometrik-sehir .demo i{width:1.1em;height:1.1em;border-radius:5px;border:1.6px solid var(--line-strong);flex:none}
.reference-landing.reference-izometrik-sehir .demo i.on{background:var(--glow);border-color:var(--glow)}
.reference-landing.reference-izometrik-sehir .demo small{margin-left:auto;color:var(--muted);font-size:.85em}
@media (max-width:980px){.reference-landing.reference-izometrik-sehir .sec-grid,.reference-landing.reference-izometrik-sehir .a11y{grid-template-columns:1fr}}
@media (max-width:560px){.reference-landing.reference-izometrik-sehir .a11y{padding:20px}}

/* ============ Pricing ============ */
.reference-landing.reference-izometrik-sehir .billing{display:inline-flex;border:1px solid var(--line);border-radius:14px;padding:4px;background:var(--surface);margin-bottom:36px}
.reference-landing.reference-izometrik-sehir .billing button{border:0;background:transparent;padding:9px 16px;border-radius:10px;font-weight:600;color:var(--muted)}
.reference-landing.reference-izometrik-sehir .billing button[aria-pressed="true"]{background:var(--accent);color:var(--on-accent)}
.reference-landing.reference-izometrik-sehir .billing em{font-style:normal;font-size:.78rem;margin-left:6px;opacity:.85}
.reference-landing.reference-izometrik-sehir .plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
.reference-landing.reference-izometrik-sehir .plan-c{border:1px solid var(--line);border-radius:24px;padding:28px;background:var(--surface);display:flex;flex-direction:column}
.reference-landing.reference-izometrik-sehir .plan-c.feat{background:var(--ink);color:#fff;border-color:var(--ink)}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .plan-c.feat{background:#252F6B;border-color:var(--glow)}
.reference-landing.reference-izometrik-sehir .plan-c .p-ico{height:78px;width:auto;margin-bottom:14px;align-self:flex-start}
.reference-landing.reference-izometrik-sehir .plan-c h3{font-size:1.5rem}
.reference-landing.reference-izometrik-sehir .plan-c .for{color:var(--muted);font-size:.95rem;margin-top:4px;min-height:3em}
.reference-landing.reference-izometrik-sehir .plan-c.feat .for{color:#C9CFEE}
.reference-landing.reference-izometrik-sehir .price{display:flex;align-items:baseline;gap:6px;margin:18px 0 4px}
.reference-landing.reference-izometrik-sehir .price b{font-family:'Bricolage Grotesque';font-size:2.6rem;letter-spacing:-.03em}
.reference-landing.reference-izometrik-sehir .price span{font-size:.9rem;color:var(--muted)}
.reference-landing.reference-izometrik-sehir .plan-c.feat .price span,.reference-landing.reference-izometrik-sehir .plan-c.feat .per{color:#C9CFEE}
.reference-landing.reference-izometrik-sehir .per{font-size:.84rem;color:var(--muted);min-height:1.4em}
.reference-landing.reference-izometrik-sehir .plan-c ul{list-style:none;margin:20px 0 26px;padding:0;display:grid;gap:10px;font-size:.95rem}
.reference-landing.reference-izometrik-sehir .plan-c li{display:grid;grid-template-columns:18px 1fr;gap:10px}
.reference-landing.reference-izometrik-sehir .plan-c li svg{width:18px;height:18px;margin-top:2px;color:var(--t-mint)}
.reference-landing.reference-izometrik-sehir .plan-c.feat li svg{color:var(--glow)}
.reference-landing.reference-izometrik-sehir .plan-c .btn{margin-top:auto;width:100%}
.reference-landing.reference-izometrik-sehir .plan-c.feat .btn-primary{background:var(--glow);color:var(--ink);box-shadow:0 4px 0 #C98423}
.reference-landing.reference-izometrik-sehir .plan-c.feat .btn-primary:hover{background:#FFC874}
.reference-landing.reference-izometrik-sehir .plan-note{margin-top:22px;color:var(--muted);font-size:.9rem}
@media (max-width:900px){.reference-landing.reference-izometrik-sehir .plans{grid-template-columns:1fr}}

/* ============ Proof ============ */
.reference-landing.reference-izometrik-sehir .quotes{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:20px}
.reference-landing.reference-izometrik-sehir .q{border-radius:24px;padding:30px;background:var(--surface);border:1px solid var(--line);display:flex;flex-direction:column;gap:22px;margin:0}
.reference-landing.reference-izometrik-sehir .q blockquote{margin:0;font-size:1.08rem}
.reference-landing.reference-izometrik-sehir .q.big{grid-row:span 2;background:var(--g-mint);border-color:transparent}
.reference-landing.reference-izometrik-sehir .q.big blockquote{font-family:'Bricolage Grotesque';font-size:clamp(1.35rem,2.4vw,1.85rem);line-height:1.28;letter-spacing:-.015em;font-weight:600}
.reference-landing.reference-izometrik-sehir .q figcaption{display:flex;gap:12px;align-items:center;margin-top:auto;font-size:.92rem}
.reference-landing.reference-izometrik-sehir .q figcaption .av{width:40px;height:40px;font-size:.8rem;border:0}
.reference-landing.reference-izometrik-sehir .q figcaption div span{display:block;color:var(--muted);font-size:.85rem}
.reference-landing.reference-izometrik-sehir .q.big figcaption div span{color:inherit;opacity:.78}
.reference-landing.reference-izometrik-sehir .q .miniCity{width:180px;height:auto;align-self:flex-end}
.reference-landing.reference-izometrik-sehir .logos{display:flex;flex-wrap:wrap;gap:12px 36px;margin-top:48px;align-items:center;color:var(--muted)}
.reference-landing.reference-izometrik-sehir .logos span{font-family:'Bricolage Grotesque';font-weight:700;font-size:1.15rem;letter-spacing:-.01em;display:flex;align-items:center;gap:8px}
.reference-landing.reference-izometrik-sehir .logos svg{width:20px;height:20px}
@media (max-width:860px){.reference-landing.reference-izometrik-sehir .quotes{grid-template-columns:1fr}.reference-landing.reference-izometrik-sehir .q.big{grid-row:auto}}

/* ============ Final CTA ============ */
.reference-landing.reference-izometrik-sehir .final{margin:40px 0 0;background:var(--ink);color:#fff;border-radius:32px;overflow:hidden;position:relative;padding:80px 48px 0;text-align:center}
.reference-landing.reference-izometrik-sehir [data-theme="dark"] .final{background:#070B24;border:1px solid var(--line)}
.reference-landing.reference-izometrik-sehir .final h2{font-size:clamp(2.2rem,5vw,3.8rem);max-width:14ch;margin:0 auto}
.reference-landing.reference-izometrik-sehir .final p{color:#C9CFEE;margin:18px auto 0;max-width:520px;font-size:1.1rem}
.reference-landing.reference-izometrik-sehir .final .hero-cta{justify-content:center}
.reference-landing.reference-izometrik-sehir .final .btn-primary{background:var(--glow);color:var(--ink);box-shadow:0 4px 0 #C98423}
.reference-landing.reference-izometrik-sehir .final .btn-primary:hover{background:#FFC874}
.reference-landing.reference-izometrik-sehir .final .btn-ghost{border-color:rgba(255,255,255,.35);color:#fff}
.reference-landing.reference-izometrik-sehir .final .btn-ghost:hover{background:rgba(255,255,255,.08)}
.reference-landing.reference-izometrik-sehir .skyline{margin-top:56px;width:100%;height:auto}
.reference-landing.reference-izometrik-sehir .skyline .ia{fill:#2A3468}.reference-landing.reference-izometrik-sehir .skyline .ib{fill:#222A58}.reference-landing.reference-izometrik-sehir .skyline .it{fill:#38437F}
.reference-landing.reference-izometrik-sehir .skyline .iw{fill:#1A2150;transition:fill .35s ease}
.reference-landing.reference-izometrik-sehir .skyline.lit .iw.k{fill:var(--glow)}
@media (max-width:560px){.reference-landing.reference-izometrik-sehir .final{padding:56px 20px 0;border-radius:24px}}

/* ============ Footer ============ */
.reference-landing.reference-izometrik-sehir footer{padding:72px 0 40px;font-size:.95rem}
.reference-landing.reference-izometrik-sehir .foot{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(4,minmax(0,1fr));gap:32px}
.reference-landing.reference-izometrik-sehir .foot h3{font-family:'Figtree';font-size:.9rem;font-weight:700;letter-spacing:0;margin-bottom:12px}
.reference-landing.reference-izometrik-sehir .foot ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.reference-landing.reference-izometrik-sehir .foot a{color:var(--muted);text-decoration:none}
.reference-landing.reference-izometrik-sehir .foot a:hover{color:var(--text);text-decoration:underline}
.reference-landing.reference-izometrik-sehir .foot p{color:var(--muted);margin-top:12px;max-width:300px}
.reference-landing.reference-izometrik-sehir .foot-bot{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;margin-top:56px;padding-top:24px;border-top:1px solid var(--line);color:var(--muted);font-size:.88rem}
@media (max-width:900px){.reference-landing.reference-izometrik-sehir .foot{grid-template-columns:repeat(2,minmax(0,1fr))}.reference-landing.reference-izometrik-sehir .foot>div:first-child{grid-column:1/-1}}

/* ============ Small screens ============ */
@media (max-width:600px){
  .reference-landing.reference-izometrik-sehir .wrap{padding:0 16px}
  .reference-landing.reference-izometrik-sehir .sec{padding:84px 0}
  .reference-landing.reference-izometrik-sehir .hero{padding-top:40px}
  .reference-landing.reference-izometrik-sehir .stage{border-radius:20px}
  .reference-landing.reference-izometrik-sehir .city-wrap{min-height:300px}
  .reference-landing.reference-izometrik-sehir .daynight button span{display:none}
  .reference-landing.reference-izometrik-sehir .city-hint{display:none}
  .reference-landing.reference-izometrik-sehir .pn-scroll{padding:18px 16px}
  .reference-landing.reference-izometrik-sehir .pn-foot{padding:14px 16px}
  .reference-landing.reference-izometrik-sehir .tile{padding:18px}
  .reference-landing.reference-izometrik-sehir .plan-c,.reference-landing.reference-izometrik-sehir .q{padding:22px}
  .reference-landing.reference-izometrik-sehir .board{grid-template-columns:1fr}
  .reference-landing.reference-izometrik-sehir .col{min-height:0}
  .reference-landing.reference-izometrik-sehir .hero-cta .btn{flex:1 1 auto}
}
@media (prefers-reduced-motion: reduce){
  .reference-landing.reference-izometrik-sehir{scroll-behavior:auto}
  .reference-landing.reference-izometrik-sehir *,.reference-landing.reference-izometrik-sehir *::before,.reference-landing.reference-izometrik-sehir *::after{animation-duration:.001ms!important;animation-delay:0s!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .reference-landing.reference-izometrik-sehir .tram-car{left:calc(50% - 22px)}
}