:root {
  --nav-yari: 620px; --nav-yazi: rgba(238, 226, 210, .75); --nav-vurgu: var(--altin);
  --nav-zemin: transparent; --nav-zemin-ust: transparent; --nav-cizgi: transparent; --nav-cizgi-ust: transparent;
  --nav-bulanik: none; --nav-bulanik-ust: none;
  --nav-cb-zemin: rgba(255, 255, 255, .12); --nav-cb-yazi: #fff; --nav-cb-cizgi: rgba(255, 255, 255, .2); --nav-cb-boy: 38px; --nav-cb-dolgu: 16px; --nav-cb-punto: 14px; --nav-hay: none;
  --menu-zemin: rgba(14, 31, 38, .97); --alt-yazi: rgba(238, 226, 210, .55); --alt-cizgi: transparent; --alt-zemin: var(--gece); --alt-bosluk: 24px;
}
/* Gökyüzünü geçince üst bar kâğıda döner (sayfa.js .kagitta koyar). */
.nav.kagitta { --nav-zemin-ust: rgba(246, 239, 228, .86); --nav-zemin: rgba(246, 239, 228, .86); --nav-bulanik-ust: blur(14px); --nav-bulanik: blur(14px); --nav-yazi: var(--soluk); --nav-cizgi-ust: var(--cizgi); --nav-cizgi: var(--cizgi); --nav-vurgu: var(--bronz); --nav-cb-zemin: var(--murekkep); --nav-cb-yazi: var(--kagit); --nav-cb-cizgi: transparent; --menu-zemin: rgba(246, 239, 228, .97); --menu-yazi: var(--murekkep); }
.nav.kagitta .m { color: var(--murekkep); }
.nav.kagitta .menu-dugme { color: var(--murekkep); }
/* Kodex Kur'an'ın kendi dünyası: uygulamanın app_colors.dart paleti */
:root{--gece:#0E1F26;--gece2:#162E34;--teal:#355E68;--teal2:#4E7C89;--altin:#D8C38B;--bronz:#7A5E28;--fildisi:#EEE2D2;--kagit:#F6EFE4;--kagit2:#FBF6ED;--kart:#FFFCF6;--murekkep:#26363A;--soluk:#596365;--cizgi:rgba(78,124,137,.2);--cizgi2:rgba(122,94,40,.35)}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--kagit);color:var(--murekkep);font-family:"Hanken Grotesk",sans-serif;-webkit-font-smoothing:antialiased;overflow-x:clip}
img{display:block;max-width:100%}a{color:inherit;text-decoration:none}
.serif{font-family:"Old Standard TT",serif}
.mono{font:500 12px/1 "IBM Plex Mono";letter-spacing:.14em;text-transform:none}
.kap{max-width:1180px;margin:0 auto;padding:0 24px}


/* ---------- GÖKYÜZÜ AÇILIŞI ---------- */
.gok{position:relative;min-height:100vh;color:var(--fildisi);overflow:hidden;display:flex;flex-direction:column}
.gok .foto{position:absolute;inset:0;background:url(/assets/kodex-kuran/bosphorus-night.jpg) center 62%/cover}
.gok .foto::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,31,38,.55) 0%,rgba(14,31,38,.15) 40%,rgba(14,31,38,.55) 75%,var(--gece) 100%)}
.ay{position:absolute;left:calc(50% + 330px);top:100px;width:120px;height:120px;margin-left:-60px;border-radius:50%;box-shadow:-22px 10px 0 0 #e8dcc0;transform:rotate(-20deg);filter:drop-shadow(0 0 40px rgba(232,220,192,.45));animation:ay 9s ease-in-out infinite}
@keyframes ay{50%{translate:0 -8px}}
.gok .ic{position:relative;z-index:2;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:200px 24px 40px}
.gok .ust{font:500 12px/1 "IBM Plex Mono";letter-spacing:.24em;color:var(--altin)}
.gok h1{font:400 clamp(64px,10vw,150px)/.95 "Abril Fatface",serif;letter-spacing:-.01em;margin-top:18px;color:#fff}
.gok .ayet{font:400 clamp(26px,3vw,38px)/1.6 "Noto Naskh Arabic",serif;direction:rtl;margin-top:22px;color:#f3ead8}
.gok .ayet-tr{font:400 italic 18px/1.4 "Old Standard TT",serif;color:rgba(238,226,210,.75);margin-top:6px}
.gok .ozet{font:400 19px/1.55 "Hanken Grotesk";color:rgba(238,226,210,.88);max-width:620px;margin-top:28px}
.gok .btns{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap;justify-content:center}
.dg{display:inline-flex;align-items:center;height:52px;padding:0 26px;border-radius:999px;font:600 16px/1 "Hanken Grotesk";transition:transform .2s}
.dg:hover{transform:translateY(-2px)}
.dg.altin{background:var(--altin);color:#2b2414}
.dg.cam{background:rgba(255,255,255,.1);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.25);backdrop-filter:blur(8px)}
.dg.murekkep{background:var(--murekkep);color:var(--kagit)}
.dg.cizgili{box-shadow:inset 0 0 0 1px var(--cizgi2);color:var(--murekkep)}
.durum{display:inline-flex;gap:8px;align-items:center;margin-top:26px;font:500 12px/1 "IBM Plex Mono";letter-spacing:.08em;color:rgba(238,226,210,.8)}
.durum i{width:7px;height:7px;border-radius:50%;background:var(--altin)}
/* günün akışı şeridi */
.akis{position:relative;z-index:2;max-width:980px;width:calc(100% - 48px);margin:0 auto 40px;padding:20px 26px;border-radius:22px;background:rgba(14,31,38,.55);backdrop-filter:blur(14px);box-shadow:inset 0 0 0 1px rgba(216,195,139,.25)}
.akis .bas{display:flex;justify-content:space-between;font:500 11px/1 "IBM Plex Mono";letter-spacing:.14em;color:rgba(238,226,210,.6)}
.akis .bas b{color:var(--altin);font-weight:500}
.akis .ray{position:relative;height:2px;background:rgba(238,226,210,.2);margin:18px 0 16px}
.akis .ray i{position:absolute;left:0;top:0;height:2px;background:var(--altin);width:var(--p,0%)}
.akis .ray em{position:absolute;top:-6px;width:14px;height:14px;border-radius:50%;background:var(--altin);left:calc(var(--p,0%) - 7px);box-shadow:0 0 16px var(--altin)}
.akis .vk{display:grid;grid-template-columns:repeat(6,1fr);text-align:center}
.akis .vk div{font:400 13px/1.2 "Hanken Grotesk";color:rgba(238,226,210,.65)}
.akis .vk b{display:block;font:500 17px/1.3 "Hanken Grotesk";color:#fff;margin-top:4px;font-variant-numeric:tabular-nums}
.akis .vk .simdi{color:var(--altin)}.akis .vk .simdi b{color:var(--altin)}

/* ---------- KÂĞIT DÜNYASI ---------- */
.kagit{background:var(--kagit);position:relative;padding-bottom:140px}
.kagit::before{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");pointer-events:none}
.bol{position:relative;padding:130px 0 0}
.bas-blok{text-align:center;max-width:760px;margin:0 auto 56px}
.bas-blok .mono{color:var(--bronz)}
.bas-blok h2{font:400 clamp(40px,5vw,66px)/1.05 "Old Standard TT",serif;margin-top:16px;color:var(--murekkep)}
.bas-blok h2 em{color:var(--bronz)}
.bas-blok p{font:400 19px/1.6 "Hanken Grotesk";color:var(--soluk);margin-top:18px}
.cift-cizgi{height:5px;border-top:1px solid var(--cizgi2);border-bottom:1px solid var(--cizgi2);max-width:180px;margin:22px auto 0}
.elmas{display:inline-block;width:9px;height:9px;background:var(--altin);transform:rotate(45deg);margin:0 10px}

/* takvim yaprağı künyesi */
.yaprak{position:relative;max-width:760px;margin:0 auto;background:var(--kart);border-radius:6px;box-shadow:0 30px 60px -30px rgba(38,54,58,.35),0 2px 0 rgba(38,54,58,.04);padding:34px 44px 36px}
.yaprak::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px;background:radial-gradient(circle at 6px 12px,transparent 5px,var(--kart) 5.5px) 0 0/22px 12px repeat-x}
.yaprak .ust{display:grid;grid-template-columns:1fr auto 1fr;align-items:start;font:400 14px/1.4 "Old Standard TT",serif;color:var(--soluk)}
.yaprak .ust b{display:block;font-weight:700;color:var(--murekkep)}
.yaprak .ust .orta{font:700 13px/1 "Old Standard TT";letter-spacing:.3em;color:var(--murekkep);padding-top:4px}
.yaprak .ust .sag{text-align:right}
.yaprak .dev{text-align:center;margin:18px 0 8px}
.yaprak .dev b{display:block;font:400 150px/.9 "Abril Fatface",serif;color:var(--bronz)}
.yaprak .dev span{display:block;font:700 22px/1 "Old Standard TT";letter-spacing:.4em;margin-top:12px}
.yaprak .dev em{display:block;font:400 italic 17px/1 "Old Standard TT";color:var(--soluk);margin-top:10px}
.yaprak table{width:100%;border-collapse:collapse;margin-top:26px;border-top:3px double var(--cizgi2)}
.yaprak th{font:500 11px/1 "IBM Plex Mono";letter-spacing:.12em;color:var(--soluk);text-align:left;padding:14px 0 10px}
.yaprak th:last-child,.yaprak td:last-child{text-align:right}
.yaprak td{padding:13px 0;border-top:1px solid var(--cizgi);font:400 19px/1.2 "Old Standard TT";color:var(--murekkep)}
.yaprak td:nth-child(2){font:400 15px/1.3 "Hanken Grotesk";color:var(--soluk)}
.yaprak td:last-child{font:700 22px/1 "Old Standard TT";font-variant-numeric:tabular-nums}
.yaprak .tik{font:500 24px/1 "Caveat",cursive;color:var(--teal)}
.yaprak .not{font:500 22px/1.2 "Caveat",cursive;color:var(--teal);text-align:center;margin-top:18px}

/* yapar / yapmaz */
.iki{display:grid;grid-template-columns:1fr 1fr;gap:0;max-width:980px;margin:0 auto;border-top:3px double var(--cizgi2);border-bottom:3px double var(--cizgi2)}
.iki>div{padding:30px 36px}
.iki>div+div{border-left:1px solid var(--cizgi2)}
.iki h3{font:700 13px/1 "Old Standard TT";letter-spacing:.3em;color:var(--bronz);margin-bottom:12px}
.iki li{list-style:none;font:400 17.5px/1.5 "Old Standard TT",serif;padding:11px 0 11px 34px;border-top:1px solid var(--cizgi);position:relative}
.iki li::before{position:absolute;left:0;top:6px;font:500 26px/1 "Caveat",cursive}
.iki .evet li::before{content:"✓";color:var(--teal)}
.iki .hayir li::before{content:"—";color:var(--bronz)}

/* dört sekme: kemerli pencereler */
.pencereler{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.pencere .kemer{position:relative;border-radius:999px 999px 18px 18px;padding:26px 16px 0;background:linear-gradient(180deg,var(--teal) 0%,var(--gece2) 100%);overflow:hidden;box-shadow:inset 0 0 0 1px rgba(216,195,139,.35)}
.pencere .kemer::before{content:"";position:absolute;inset:8px 8px 0;border-radius:999px 999px 12px 12px;border:1px solid rgba(216,195,139,.35);border-bottom:0;pointer-events:none}
.pencere .tel{position:relative;height:340px;border-radius:30px 30px 0 0;padding:7px 7px 0;background:#0a0a0a;box-shadow:0 -10px 40px rgba(0,0,0,.35);overflow:hidden}
.pencere .tel img{width:100%;border-radius:24px 24px 0 0}
.pencere small{display:block;margin-top:20px;font:500 11px/1 "IBM Plex Mono";letter-spacing:.14em;color:var(--bronz)}
.pencere h3{font:400 28px/1.1 "Old Standard TT",serif;margin:10px 0 10px}
.pencere p{font:400 15.5px/1.55 "Hanken Grotesk";color:var(--soluk)}

/* mushaf sayfası: kelime kelime */
.mushaf{position:relative;max-width:900px;margin:0 auto;background:var(--kart);padding:16px;border-radius:4px;box-shadow:0 30px 70px -30px rgba(38,54,58,.4)}
.mushaf .cer{border:2px solid var(--teal2);outline:1px solid var(--altin);outline-offset:-8px;padding:44px 50px 36px;position:relative;text-align:center;background:repeating-linear-gradient(90deg,transparent 0 14px,rgba(216,195,139,.07) 14px 15px)}
.mushaf .serlevha{display:inline-flex;align-items:center;gap:14px;font:500 22px/1 "Noto Naskh Arabic";color:var(--teal);padding:10px 34px;border:1px solid var(--teal2);border-radius:999px}
.mushaf .ar{font:400 clamp(34px,4.6vw,54px)/1.9 "Noto Naskh Arabic",serif;direction:rtl;margin-top:26px;color:var(--murekkep)}
.mushaf .ar span{padding:0 4px;border-radius:8px;transition:background .25s,color .25s}
.mushaf .ar span.on{background:rgba(216,195,139,.45);color:#3a2a08}
.mushaf .no{display:inline-grid;place-items:center;width:44px;height:44px;border:1.5px solid var(--altin);border-radius:50%;font:500 18px/1 "Noto Naskh Arabic";color:var(--bronz);vertical-align:middle;margin-right:10px}
.mushaf .ok{font:400 italic 21px/1.5 "Old Standard TT";color:var(--teal);margin-top:6px}
.mushaf .ok span{transition:color .25s}.mushaf .ok span.on{color:var(--bronz);text-decoration:underline;text-decoration-color:var(--altin);text-underline-offset:5px}
.mushaf .meal{font:400 19px/1.55 "Hanken Grotesk";color:var(--soluk);margin-top:12px}
.mushaf .oynat{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:26px;font:500 12px/1 "IBM Plex Mono";letter-spacing:.1em;color:var(--soluk)}
.mushaf .oynat button{all:unset;cursor:pointer;width:46px;height:46px;border-radius:50%;background:var(--murekkep);color:var(--kagit);display:grid;place-items:center;font-size:16px}
.mushaf .alt-sayfa{position:absolute;left:50%;bottom:-14px;transform:translateX(-50%);background:var(--kart);padding:5px 14px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--cizgi);font:500 12px/1 "IBM Plex Mono";color:var(--soluk)}
.okuma-alti{display:grid;grid-template-columns:repeat(3,1fr);gap:0;max-width:900px;margin:50px auto 0;border-top:1px solid var(--cizgi2)}
.okuma-alti div{padding:24px 24px 0 0}
.okuma-alti div+div{padding-left:24px;border-left:1px solid var(--cizgi2)}
.okuma-alti b{font:700 13px/1 "Old Standard TT";letter-spacing:.24em;color:var(--bronz)}
.okuma-alti p{font:400 16px/1.55 "Hanken Grotesk";color:var(--soluk);margin-top:10px}

/* gece bandı: vakitler */
.gece{position:relative;background:var(--gece);color:var(--fildisi);margin-top:0;padding:120px 0;overflow:hidden}
.gece::before{content:"";position:absolute;inset:0;background:url(/assets/kodex-kuran/bosphorus-dusk.jpg) center/cover;opacity:.18}
.gece .kap{position:relative;display:grid;grid-template-columns:330px 1fr;gap:70px;align-items:center}
.gece .tel{width:330px;aspect-ratio:390/844;border-radius:46px;padding:9px;background:#050505;box-shadow:0 40px 90px rgba(0,0,0,.5),0 0 0 1.5px #2b2b2e}
.gece .tel img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:38px}
.gece .mono{color:var(--altin)}
.gece h2{font:400 clamp(40px,4.6vw,62px)/1.05 "Old Standard TT",serif;margin:16px 0 18px}
.gece h2 em{color:var(--altin)}
.gece .giris{font:400 18.5px/1.6 "Hanken Grotesk";color:rgba(238,226,210,.75);max-width:560px}
.satirlar{margin-top:30px;border-top:1px solid rgba(216,195,139,.3)}
.satirlar div{display:grid;grid-template-columns:150px 1fr;gap:20px;padding:15px 0;border-bottom:1px solid rgba(216,195,139,.15)}
.satirlar b{font:400 19px/1.3 "Old Standard TT";color:var(--altin)}
.satirlar span{font:400 16px/1.55 "Hanken Grotesk";color:rgba(238,226,210,.85)}

/* rehber çizimleri */
.cizimler{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.cizim{background:var(--kart);border-radius:14px;padding:18px 18px 20px;box-shadow:0 20px 40px -28px rgba(38,54,58,.35);text-align:center;position:relative}
.cizim::after{content:"";position:absolute;right:0;bottom:0;width:26px;height:26px;background:linear-gradient(135deg,transparent 50%,#e7dcc6 50%);border-radius:0 0 14px 0}
.cizim img{height:230px;margin:0 auto;object-fit:contain}
.cizim small{display:block;font:500 11px/1 "IBM Plex Mono";letter-spacing:.12em;color:var(--soluk);margin-top:14px}
.cizim h4{font:700 20px/1.2 "Old Standard TT";margin-top:8px}
.rehber-not{max-width:760px;margin:30px auto 0;text-align:center;font:400 16px/1.6 "Hanken Grotesk";color:var(--soluk)}

/* hatim rafı */
.raf-alan{max-width:980px;margin:0 auto}
.raf{display:flex;gap:4px;align-items:flex-end;padding:22px 22px 0;background:linear-gradient(180deg,#4a2f1c,#3a2414);border-radius:14px 14px 0 0;height:190px}
.raf i{flex:1;height:var(--h,150px);border-radius:3px 3px 0 0;background:linear-gradient(90deg,#20444c,#2c5a63 40%,#1d3c43);position:relative;font:600 10px/1 "Old Standard TT";color:rgba(238,226,210,.7);display:flex;justify-content:center;padding-top:10px;font-style:normal;transition:transform .3s}
.raf i:hover{transform:translateY(-6px)}
.raf i.dolu{background:linear-gradient(90deg,#b99b55,#e3cd8f 40%,#a98b47);color:#3a2a08}
.raf i.simdi{background:linear-gradient(90deg,#9b3a2e,#c0503f 40%,#8a3226);color:#fff}
.raf-alt{height:16px;background:#2a1a0e;border-radius:0 0 8px 8px;box-shadow:0 20px 40px -20px rgba(0,0,0,.5)}
.raf-yazi{display:flex;justify-content:space-between;margin-top:14px;font:500 12px/1 "IBM Plex Mono";letter-spacing:.08em;color:var(--soluk)}
.uc{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:46px;border-top:3px double var(--cizgi2)}
.uc div{padding:26px 26px 0 0}.uc div+div{padding-left:26px;border-left:1px solid var(--cizgi2)}
.uc h4{font:400 26px/1.15 "Old Standard TT";margin:10px 0 8px}
.uc small{font:500 11px/1 "IBM Plex Mono";letter-spacing:.14em;color:var(--bronz)}
.uc p{font:400 16px/1.55 "Hanken Grotesk";color:var(--soluk)}

/* künye: kitabın arka sayfası */
.kunye{max-width:640px;margin:0 auto;text-align:center}
.kunye dl{margin-top:10px}
.kunye dt{font:500 11px/1 "IBM Plex Mono";letter-spacing:.16em;color:var(--bronz);margin-top:26px}
.kunye dd{font:400 21px/1.35 "Old Standard TT",serif;margin-top:8px}
.kunye dd small{display:block;font:400 italic 15px/1.4 "Old Standard TT";color:var(--soluk);margin-top:4px}
.veri{max-width:900px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.veri div{background:var(--kart);border-radius:14px;padding:22px;box-shadow:inset 0 0 0 1px var(--cizgi)}
.veri b{display:block;font:400 22px/1.15 "Old Standard TT";margin:10px 0 8px}
.veri small{font:500 11px/1 "IBM Plex Mono";letter-spacing:.12em}
.veri .iyi small{color:var(--teal)}.veri .net small{color:var(--bronz)}
.veri p{font:400 15px/1.5 "Hanken Grotesk";color:var(--soluk)}
.sss{max-width:820px;margin:0 auto}
.sss details{border-bottom:1px solid var(--cizgi2)}
.sss summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:24px 0;font:400 24px/1.3 "Old Standard TT",serif}
.sss summary::-webkit-details-marker{display:none}
.sss summary i{font-style:normal;color:var(--bronz);font-size:26px;transition:transform .3s;margin-left:20px}
.sss details[open] summary i{transform:rotate(45deg)}
.sss p{font:400 17.5px/1.6 "Hanken Grotesk";color:var(--soluk);padding:0 50px 24px 0}
.diger{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:980px;margin:0 auto}
.diger a{border-radius:16px;padding:24px;background:var(--murekkep);color:var(--fildisi);min-height:170px;display:flex;flex-direction:column;justify-content:space-between;transition:transform .3s}
.diger a:hover{transform:translateY(-5px)}
.diger small{font:500 11px/1 "IBM Plex Mono";letter-spacing:.12em;color:var(--altin)}
.diger h4{font:700 28px/1 "Hanken Grotesk";letter-spacing:-.03em;margin-top:12px}
.diger p{font:400 15px/1.5 "Hanken Grotesk";color:rgba(238,226,210,.7);margin-top:8px}
.son{position:relative;margin-top:150px;min-height:80vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;padding:0 24px;overflow:hidden}
.son::before{content:"";position:absolute;inset:0;background:url(/assets/kodex-kuran/bosphorus-dusk.jpg) center 70%/cover}
.son::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--kagit) 0%,rgba(14,31,38,.2) 30%,rgba(14,31,38,.65) 100%)}
.son>*{position:relative;z-index:1}
.son h2{font:400 clamp(56px,8vw,120px)/.95 "Abril Fatface",serif;text-shadow:0 10px 40px rgba(0,0,0,.4)}
.son p{font:400 20px/1.5 "Hanken Grotesk";margin:20px 0 28px;color:rgba(255,255,255,.9)}
.gozle.bekle{opacity:0;transform:translateY(30px)}.gozle.gor{transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
@media (max-width:980px){.ay{left:auto;right:30px;top:80px;width:70px;height:70px;margin:0;box-shadow:-14px 6px 0 0 #e8dcc0}.akis .vk div{font-size:11px}.akis .vk b{font-size:14px}.yaprak{padding:28px 20px}.yaprak .dev b{font-size:110px}.iki,.okuma-alti,.uc,.diger{grid-template-columns:1fr}.iki>div+div,.okuma-alti div+div,.uc div+div{border-left:0;padding-left:0;border-top:1px solid var(--cizgi2)}.pencereler,.cizimler,.veri{grid-template-columns:1fr 1fr}.gece .kap{grid-template-columns:1fr}.gece .tel{width:240px;margin:0 auto}.satirlar div{grid-template-columns:1fr;gap:4px}.mushaf .cer{padding:30px 16px}.raf{height:130px;gap:2px;padding:14px 10px 0}.raf i{font-size:0}}

/* maket seçici (yalnız maket) */
.maket-sec{display:flex;gap:6px;justify-content:center;align-items:center;flex-wrap:wrap;margin-bottom:34px;font:500 11px/1 "IBM Plex Mono";letter-spacing:.08em;color:var(--soluk)}
.maket-sec button{all:unset;cursor:pointer;padding:9px 14px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--cizgi2);color:var(--murekkep)}
.maket-sec button.on{background:var(--murekkep);color:var(--kagit);box-shadow:none}
.sk-yon{display:none}.sk-yon.on{display:block}
.tel-tam{position:relative;aspect-ratio:390/844;border-radius:42px;padding:8px;background:#0a0a0a;box-shadow:0 0 0 1.5px #2b2b2e,0 40px 80px -30px rgba(38,54,58,.55)}
.tel-tam img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:35px;transition:opacity .35s}
/* A */
.am{display:grid;grid-template-columns:330px 1fr;gap:80px;align-items:center;max-width:980px;margin:0 auto}
.am .tel-tam{width:330px}
.am-metinler{position:relative;min-height:230px}
.am-m{position:absolute;inset:0;opacity:0;transform:translateY(16px);transition:opacity .45s,transform .45s}
.am-m.on{opacity:1;transform:none}
.am-m small{font:500 11px/1 "IBM Plex Mono";letter-spacing:.14em;color:var(--bronz)}
.am-m h3{font:400 46px/1.05 "Old Standard TT",serif;margin:14px 0 14px}
.am-m p{font:400 18px/1.6 "Hanken Grotesk";color:var(--soluk);max-width:480px}
.cam-menu{position:relative;display:grid;grid-template-columns:repeat(4,1fr);margin-top:34px;max-width:440px;padding:6px;border-radius:999px;background:rgba(255,252,246,.65);backdrop-filter:blur(14px) saturate(1.6);box-shadow:inset 0 0 0 1px rgba(255,255,255,.8),0 14px 40px -16px rgba(38,54,58,.4)}
.cam-menu .kapsul{position:absolute;top:6px;bottom:6px;left:6px;width:calc((100% - 12px)/4);border-radius:999px;background:rgba(216,195,139,.35);box-shadow:inset 0 0 0 1px rgba(122,94,40,.25);transition:transform .5s cubic-bezier(.3,1.4,.5,1)}
.cam-menu button{all:unset;cursor:pointer;position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 0;font-size:18px;color:var(--soluk)}
.cam-menu button span{font:500 11.5px/1 "Hanken Grotesk"}
.cam-menu button.on{color:var(--bronz)}
.am-ipucu{font:500 11px/1 "IBM Plex Mono";letter-spacing:.08em;color:var(--soluk);margin-top:14px;opacity:.7}
/* B */
.tamlar{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.tamlar figcaption small,.gun-sira .saat{font:500 11px/1 "IBM Plex Mono";letter-spacing:.14em;color:var(--bronz)}
.tamlar figcaption{margin-top:22px}
.tamlar h3,.gun-sira h3{font:400 26px/1.1 "Old Standard TT",serif;margin:10px 0 8px}
.tamlar p,.gun-sira p{font:400 15.5px/1.5 "Hanken Grotesk";color:var(--soluk)}
.tamlar figure:nth-child(even){margin-top:60px}
/* C */
.gun{position:relative;padding-top:40px}
.gun-gok{position:absolute;left:-24px;right:-24px;top:0;height:300px;border-radius:24px;background:linear-gradient(90deg,#9cc3cc 0%,#e9d7b0 30%,#d99a62 62%,#2c3e55 82%,#0E1F26 100%)}
.gun-gok::after{content:"";position:absolute;inset:0;border-radius:24px;background:linear-gradient(180deg,transparent 40%,var(--kagit) 100%)}
.gun-sira{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.gun-sira figure{text-align:center}
.gun-sira .saat{display:inline-block;padding:7px 12px;border-radius:999px;background:rgba(255,252,246,.8);margin-bottom:18px}
.gun-sira figure:nth-child(4) .saat{background:rgba(14,31,38,.8);color:var(--altin)}
.gun-sira .tel-tam{margin-bottom:20px}
@media (max-width:980px){.am{grid-template-columns:1fr;gap:30px}.am .tel-tam{width:240px;margin:0 auto}.am-m h3{font-size:34px}.tamlar,.gun-sira{grid-template-columns:1fr 1fr}.tamlar figure:nth-child(even){margin-top:0}}
/* Maketteki hata: .bol'un yan dolgusu .kap'ınkini eziyordu; 1228 px altında içerik ekranın kenarına yapışıyordu. */
@media(max-width:1227px){.bol.kap{padding-left:24px;padding-right:24px}}