/*
 * Greft hesaplayici, [hermest_graft_calculator] ile yazi icinde (inc/graft-calculator.php).
 * ELLE YAZILDI: hgc.css uretilmis dosya (araclar/graft-calc/kapsa.mjs), bu kurallar ona
 * eklenmez. Yalnizca .hgc--gomulu altinda; ana sayfa ve hesaplayici sayfasi etkilenmez.
 *
 * Yazi sutunu ana sayfadan dar (masaustunde ~840-1000px, sagda kenar cubugu var). Tasarimin
 * lg: kirilimlari ekran genisligine bakiyor; burada sutun genisligine bakilsin diye
 * kapsayici sorgusu (container query) kullaniliyor.
 */

/* padding 1px: yazi govdesi overflow-x:auto, kartlarin 1px ring'ini (golge) sag kenarda kesiyordu. */
.hgc.hgc--gomulu {
	container-type: inline-size;
	margin: 2.5rem 0;
	padding-inline: 1px;
}

/* Ana sayfa bolumunun ust/alt boslugu ve kenar dolgusu yazi icinde gereksiz. */
.hgc.hgc--gomulu .hgc-bolum {
	margin: 0;
	padding: 0;
}

.hgc.hgc--gomulu .container-page {
	max-width: none;
	padding-inline: 0;
}

/* Basliksiz/girissiz kullanimda kutu yazinin hemen altinda baslasin. */
.hgc.hgc--gomulu .container-page > [data-graft-calc]:first-child {
	margin-top: 0;
}

/* Baslik yazinin kendi h2'lerinden buyuk olmasin (tasarimda md:text-5xl). */
.hgc.hgc--gomulu .hgc-baslik {
	font-size: 1.75rem;
	line-height: 1.15;
	margin: 0;
}

.hgc.hgc--gomulu .hgc-giris,
.hgc.hgc--gomulu .hgc-not {
	margin-bottom: 0;
}

/* Blog govdesindeki "figure img { width:100%; height:auto }" kurali WebGL'siz yedek fotografi bozmasin. */
.hgc.hgc--gomulu figure img {
	width: auto;
	height: 100%;
	border-radius: 0;
}

@container (min-width: 48rem) {
	.hgc.hgc--gomulu .hgc-baslik {
		font-size: 2.25rem;
	}
}

/*
 * Yazi sutununda (1440px ekranda bile ~1000px) iki kolon sikisiyor: sonuc karti uc satira
 * kiriliyor. Kafa ustte, secimler altta (tabletteki gibi).
 *
 * 3D alani DIKEY kalmali (hgc-scene-3.js): kamera kafanin epey altina bakiyor ve en/boy >= 1
 * olunca dikey aci 28 dereceye sabitleniyor, genis/alcak alanda kafanin ustu kadrajdan
 * cikiyor (4/3'te bile). Bu yuzden tuval tasarimin masaustu oraninda (~470x616, 0.78) ve
 * ortada; figur (arka plan, Front/Top, zoom) tam genislikte kalir.
 * 40rem+ ekranda: altinda tasarim zaten telefon oraninda (7/8, dikey).
 * Kenar cubugu olmayan genis bir sayfada (70rem+) tasarimin iki kolonu kalir.
 */
@media (min-width: 40rem) {
	@container (max-width: 70rem) {
		.hgc.hgc--gomulu [data-graft-calc] {
			grid-template-columns: minmax(0, 1fr);
		}

		.hgc.hgc--gomulu [data-head-3d] {
			width: min(100%, 26rem);
			height: 33rem;
			aspect-ratio: auto;
			margin-inline: auto;
		}
	}
}