/*
Theme Name: Best Kabab
Theme URI: https://bestkabab.ca
Author: Best Kabab
Description: Temiz, hafif, eklentisiz Best Kabab temasi (Edmonton, Middle Eastern Cuisine).
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: bestkabab
*/
:root{--bg:#12292a;--bg2:#0e2122;--line:rgba(196,147,106,.35);--copper:#c4936a;--text:#e9e5dc;--muted:#9fb0ab;--head:'Lora',Georgia,serif;--body:'Jost',system-ui,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--muted);font:400 16px/1.7 var(--body);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}a{color:var(--copper);text-decoration:none}a:hover{color:#fff}
h1,h2,h3{font-family:var(--head);color:#fff;font-weight:400;line-height:1.15;margin:0 0 .5em}
.wrap{width:min(1240px,100% - 40px);margin-inline:auto}
.skip{position:absolute;left:-999px}.skip:focus{left:10px;top:10px;background:#fff;color:#000;padding:8px;z-index:99}
/* top bar */
.topbar{border-bottom:1px solid var(--line);font-size:14px}
.topbar .wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;padding:14px 0}
.topbar b{color:#fff;font-weight:500}.topbar .r{text-align:right}.topbar .brand img{height:56px;width:auto}
.topbar span.d{color:var(--copper);margin:0 10px}
/* nav */
.nav{position:relative;z-index:5}
.nav ul{list-style:none;display:flex;justify-content:center;gap:42px;margin:0;padding:22px 0;flex-wrap:wrap}
.nav a{color:#fff;font-weight:500;font-size:15px}.nav a:hover,.nav .current-menu-item>a{color:var(--copper)}
.burger{display:none;background:none;border:1px solid var(--line);color:#fff;padding:8px 14px;margin:12px auto;cursor:pointer;font:inherit}
/* hero */
.hero{display:grid;grid-template-columns:1.15fr 1fr;min-height:640px}
.hero .img{background:#000 center/cover no-repeat}
.hero .txt{padding:70px 4vw;display:flex;flex-direction:column;justify-content:center}
.hero h1{font-size:clamp(46px,6vw,92px);margin:0}
.hero h1 .o{display:block;color:transparent;-webkit-text-stroke:1px var(--copper)}
.hero p{font-size:18px;margin:26px 0 36px}
.circle{display:inline-grid;place-items:center;width:120px;height:120px;border:1px solid var(--copper);border-radius:50%;color:var(--copper);text-align:center;font-size:14px;line-height:1.3;transition:.3s}
.circle:hover{background:var(--copper);color:var(--bg)}
.btn{display:inline-block;background:var(--copper);color:#1b1b1b;border:0;padding:15px 28px;font:500 14px var(--body);cursor:pointer;transition:.3s}.btn:hover{background:#fff;color:#000}
.btn.o{background:none;border:1px solid var(--copper);color:#fff}.btn.o:hover{background:var(--copper);color:#000}
/* booking */
.book{padding:46px 0}.book .wrap{display:grid;grid-template-columns:1fr 2fr;gap:30px;align-items:center}
.book h3{font-size:26px;margin:0}.book form{display:grid;grid-template-columns:repeat(5,1fr) auto;gap:10px}
.book input,.book select{width:100%;background:transparent;border:1px solid var(--line);color:#fff;padding:14px;font:inherit;font-size:14px;color-scheme:dark}
.book select option{background:var(--bg)}.hp{position:absolute;left:-9999px}
.notice{grid-column:1/-1;color:var(--copper)}
/* about */
.sec{padding:90px 0}.center{text-align:center}
.eyebrow{color:var(--copper);letter-spacing:.2em;text-transform:uppercase;font-size:13px;margin-bottom:14px}
.about{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:40px;align-items:center}
.about h2{font-size:clamp(34px,4vw,56px)}.about .tags{color:var(--copper);margin:18px 0}.about .tags i{font-style:normal;margin:0 12px;color:var(--muted)}
.frame{position:relative}.frame img{width:100%;aspect-ratio:4/3;object-fit:cover}
/* marquee */
.marq{border-block:1px solid var(--line);overflow:hidden;padding:6px 0}
.marq .row{display:flex;width:max-content;gap:64px;padding:16px 0;animation:m 40s linear infinite;font:400 clamp(30px,4.5vw,60px)/1.2 var(--head);color:#fff;text-transform:uppercase;white-space:nowrap}
.marq .row.rev{animation-direction:reverse;animation-duration:48s;border-top:1px solid rgba(255,255,255,.07)}
@keyframes m{to{transform:translateX(-50%)}}
/* restaurant */
.resto{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.resto h2{font-size:clamp(34px,4vw,56px)}
.resto .badge{position:absolute;left:-26px;bottom:34px;width:120px;height:120px;border-radius:50%;background:var(--bg2) center/70% no-repeat;border:1px solid var(--line)}
/* testimonials */
.tm{background:var(--bg2);text-align:center}.tm blockquote{margin:0 auto;max-width:760px;font:400 20px/1.6 var(--head);color:#fff}
.tm .slide{display:none}.tm .slide.on{display:block}.tm cite{display:block;margin-top:26px;font:500 15px var(--body);color:#fff}
.stars{color:var(--copper);letter-spacing:6px;margin-bottom:24px}
.dots{margin-top:28px}.dots button{width:10px;height:10px;border-radius:50%;border:1px solid var(--copper);background:none;margin:0 5px;cursor:pointer;padding:0}.dots button.on{background:var(--copper)}
/* big photo & insta */
.photo img{width:min(1240px,100% - 40px);margin:auto;aspect-ratio:16/5.2;object-fit:cover}
.insta{display:grid;grid-template-columns:1fr repeat(4,1fr)}.insta h2{display:grid;place-items:center;font-size:32px;margin:0;background:var(--bg2)}
.insta img{width:100%;aspect-ratio:1;object-fit:cover}
/* footer */
.foot{padding:70px 0 0}.foot .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));text-align:center;gap:0}
.foot .col{padding:10px 24px;border-left:1px solid var(--line)}.foot .col:first-child{border:0}
.foot h4{font:400 22px var(--head);color:#fff;margin:14px 0 18px}.foot .dm{color:var(--copper)}
.foot .col b{color:#fff;font-weight:500}.foot .hrs{color:var(--copper)}
.copy{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--copper);margin-top:60px;padding:22px 0;font-size:14px}
.copy a{color:#fff;margin-left:26px}
/* pages */
.page{padding:70px 0}.page .wrap{max-width:900px}.page h1{font-size:clamp(36px,5vw,64px);text-align:center;margin-bottom:40px}
.page .content h2,.page .content h3{margin-top:1.6em}.page .content p,.page .content li{font-size:17px}
.menu-list{columns:2;column-gap:60px;list-style:none;padding:0}.menu-list li{padding:12px 0;border-bottom:1px solid var(--line);color:#fff;font:400 22px var(--head);break-inside:avoid}
@media(max-width:900px){
.topbar .wrap{grid-template-columns:1fr;text-align:center}.topbar .r{text-align:center}.topbar .brand{order:-1}
.burger{display:block}.nav ul{display:none;flex-direction:column;align-items:center;gap:14px}.nav.open ul{display:flex}
.hero,.book .wrap,.about,.resto{grid-template-columns:1fr}.hero{min-height:0}.hero .img{min-height:340px}
.book form{grid-template-columns:1fr 1fr}.insta{grid-template-columns:1fr 1fr}.insta h2{grid-column:1/-1;padding:30px}
.foot .cols{grid-template-columns:1fr 1fr}.foot .col{border:0;padding:20px 10px}.menu-list{columns:1}
.resto h2{font-size:clamp(34px,4vw,56px)}
.resto .badge{left:10px}}
@media(prefers-reduced-motion:reduce){.marq .row{animation:none}}
