/* A warm, editorial storefront; ordering and category controls stay native. */
:root { --kof-red:#b91f2d; --kof-ink:#30271f; --kof-cream:#faf6ef; --kof-line:#e5dbcc; }
header .navbar .navbar-nav .nav-item .nav-link { border-radius:0 !important; position:relative; transition:color .2s,background .2s; }
header .navbar .navbar-nav .nav-item .nav-link.active-menu { background:#fff0e4 !important; color:#a72129 !important; }
header .navbar .navbar-nav .nav-item .nav-link:hover { color:#a72129 !important; }
header .navbar .header-btn2 { border-radius:0 !important; box-shadow:none !important; }
.kof-home { background:var(--kof-cream); color:var(--kof-ink); }
.kof-home section { padding-block:70px; }
.kof-home .kof-hero { position:relative; isolation:isolate; min-height:660px; padding:100px 0 72px; margin-top:120px; display:flex; align-items:center; color:#fff; overflow:hidden; }
.kof-hero-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.kof-hero::before { content:''; position:absolute; inset:0; background:linear-gradient(270deg,rgba(23,14,8,.9),rgba(23,14,8,.52) 55%,rgba(23,14,8,.12)); z-index:-1; }
.kof-eyebrow { display:block; font-family:'IBM Plex Sans Arabic',sans-serif; font-size:12px; letter-spacing:.5px; color:#a65e35; margin-bottom:18px; }
.kof-hero .kof-eyebrow { color:#f4c694; }
body .kof-home .kof-hero h1 { font-size:clamp(38px,5.1vw,72px) !important; line-height:1.4; color:#fff; margin:0 0 20px; }
.kof-hero h1 span { color:#ffd9b4; }
.kof-hero p { font-size:16px; line-height:2.05; color:#eee3d7; max-width:480px; margin-bottom:28px; }
.kof-actions { display:flex; gap:12px; flex-wrap:wrap; }
.kof-button { display:inline-flex; align-items:center; justify-content:space-between; gap:32px; padding:15px 24px; background:var(--kof-red); color:#fff !important; font-family:'IBM Plex Sans Arabic',sans-serif; font-size:14px; border:1px solid var(--kof-red); transition:background .2s,transform .2s; }
.kof-button:hover { background:#8f1723; transform:translateY(-2px); }
.kof-button-outline { background:transparent; border-color:#baa591; }
.kof-hero-note { display:flex; gap:24px; margin-top:48px; color:#d6c7b6; font-size:12px; }
.kof-hero-note span+span { border-right:1px solid #9d8570; padding-right:24px; }
.kof-scroll { position:absolute; left:5%; bottom:44px; color:#fff; font-size:12px; display:flex; gap:16px; align-items:center; }
.kof-section-heading { display:flex; justify-content:space-between; align-items:end; gap:24px; margin-bottom:32px; }
.kof-section-heading h2, .kof-place h2 { color:var(--kof-ink); position:relative; z-index:1; margin:0; }
.kof-section-heading p { max-width:390px; font-size:14px; line-height:1.9; color:#7d6b58; margin:0; }
.kof-section-heading .kof-eyebrow { margin-bottom:12px; }
.kof-stories { display:flex; gap:18px; min-height:620px; }
.kof-story { position:relative; flex:1; min-width:0; overflow:hidden; isolation:isolate; transition:flex .65s cubic-bezier(.22,.61,.36,1); background:#3e2416; }
.kof-story.is-open { flex:1.8; }
.kof-story > img { position:absolute; width:100%; height:100%; inset:0; object-fit:cover; object-position:center 60%; z-index:-2; transition:transform .8s; }
.kof-story.is-open > img { transform:scale(1.035); }
.kof-story.is-open > img { object-position:center 42%; }
.kof-story::after { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(22,11,6,.8),transparent 54%,rgba(22,11,6,.55)); }
.kof-story-copy { padding:28px; color:#fff; }
.kof-story-number { color:#e8b98a; font-size:12px; display:block; margin-bottom:16px; }
.kof-story h3 { margin:0 0 12px; font-size:24px; line-height:1.4; color:#fff; }
.kof-story h3 button { color:inherit; font:inherit; background:none; border:0; padding:0; text-align:right; }
.kof-story-sub { font-size:13px; color:#f1d5bc; line-height:1.8; margin:0; }
.kof-story-detail { font-size:13px; color:#fff1e4; line-height:1.9; max-width:36ch; margin:12px 0 0; }
.kof-story.is-open .kof-story-copy { position:relative; margin:18px; padding:20px; background:#fff4e6f5; }
.kof-story.is-open .kof-story-number { position:absolute; left:20px; top:20px; color:#a66635; }
.kof-story.is-open h3 { color:#5b3521; padding-left:25px; }
.kof-story.is-open .kof-story-sub { color:#8b4b2b; }
.kof-story.is-open .kof-story-detail { color:#69503c; max-width:none; }
.kof-story-link { position:absolute; bottom:26px; right:28px; left:28px; display:flex; justify-content:space-between; gap:16px; align-items:center; padding:12px 16px; background:#fff4e6; color:#442c1b; font-size:13px; }
.kof-story-link:hover { color:#a51c28; background:#fff; }
.kof-text-link { display:inline-flex; gap:30px; align-items:center; color:var(--kof-red); font-size:14px; border-bottom:1px solid #cca18d; padding-bottom:8px; }
.kof-categories { margin-bottom:28px; }
.category-swiper .swiper-slide { width:auto; }
body .category-swiper .category-btn { font-family:'IBM Plex Sans Arabic',sans-serif; border-radius:0 !important; padding:12px 23px; border:1px solid #e1d5c7; background:#fff; color:#635342; font-size:14px; transition:background .2s,color .2s; }
body .category-swiper .category-btn.active { background:#a9222d !important; color:#fff !important; border-color:#a9222d; box-shadow:none; }
body .category-swiper .category-btn:hover { border-color:#a9222d; }
.kof-product { height:100%; display:flex; flex-direction:column; background:#fff; border:1px solid #e8dfd4; text-align:right; overflow:hidden; transition:box-shadow .25s,transform .25s; }
.kof-product:hover { transform:translateY(-4px); box-shadow:0 12px 30px #5033200c; }
.kof-product-photo { position:relative; display:block; overflow:hidden; aspect-ratio:16/11; background:#f0e9df; }
.kof-product-photo > img { width:100%; height:100%; object-fit:cover; transition:transform .6s; }
.kof-product:hover .kof-product-photo > img { transform:scale(1.045); }
.kof-product-cal { position:absolute; bottom:12px; right:12px; padding:3px 8px; background:#fffdf4ed; color:#706251; font-size:10px; }
.kof-product-content { padding:22px; display:flex; flex-direction:column; flex:1; }
body .kof-product h3, body .kof-product h3 a { font-size:21px !important; line-height:1.5; color:#3e3024; margin:0 0 5px; }
.kof-product-portion { color:#9c6c48; font-size:12px; }
.kof-product-description { color:#877969; font-size:12px; line-height:1.9; margin:12px 0 20px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.kof-product-bottom { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:auto; padding-top:16px; border-top:1px solid #eee7de; }
.kof-product-price { display:flex; align-items:center; gap:5px; font-size:21px; color:#a3202a; font-family:'IBM Plex Sans Arabic',sans-serif; font-weight:600; }
.kof-product-price img { width:16px; height:18px; }
.kof-product-price del { color:#a49484; font-size:12px; font-weight:400; }
.kof-add { border:0; background:#f8eee2; color:#a3202a; min-height:42px; padding:9px 14px; font-size:12px; font-family:'IBM Plex Sans Arabic',sans-serif; cursor:pointer; }
.kof-add:hover { background:#a3202a; color:#fff; }
.kof-add:disabled { opacity:.55; cursor:wait; }
.kof-place { background:#f0e7d9; }
.kof-place-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:64px; align-items:center; }
.kof-place-grid > img { width:100%; min-height:440px; object-fit:cover; }
.kof-place h2 { margin-bottom:24px; }
.kof-place p { color:#7a6855; font-size:14px; line-height:2; }
.kof-branch { border-top:1px solid #d5c7b6; padding:20px 0; display:flex; justify-content:space-between; gap:20px; align-items:center; }
.kof-branch h3 { font-size:20px; margin:0 0 8px; }
.kof-branch p { font-size:12px; margin:0; }
.kof-branch > a { font-size:28px; color:#a3202a; }
.kof-order-banner { display:flex; justify-content:space-between; align-items:center; gap:24px; }
.kof-order-banner h2 { font-size:32px; margin-bottom:16px; }
.kof-order-banner p { color:#7a6855; font-size:14px; }
.kof-promotions .swiper { padding-bottom:28px; }
.kof-promotions .swiper-slide img { max-height:390px; object-fit:contain; }
.kof-home a:focus-visible,.kof-home button:focus-visible,.category-btn:focus-visible,.kof-add:focus-visible { outline:3px solid #e7a264; outline-offset:4px; }
.kof-home [id], .kof-menu-page [id] { scroll-margin-top:140px; }
.kof-menu-page { background:var(--kof-cream); }
.kof-menu-intro { margin-top:120px; padding:64px 0; background:#f0e7d9; border-bottom:1px solid #e3d7c7; }
.kof-menu-intro h1 { color:var(--kof-ink); margin:0 0 20px; }
.kof-menu-intro p { font-size:15px; color:#7a6855; margin:0; }
.kof-menu-catalogue { padding-block:48px 72px; }
.kof-menu-hint { color:#877969; font-size:13px; }
.kof-menu-tools { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:24px; }
.kof-menu-search { display:grid; gap:8px; width:min(100%,440px); font-family:'IBM Plex Sans Arabic',sans-serif; font-size:12px; color:#76604c; }
.kof-menu-search input { background:#fff; border:1px solid #ded1c1; border-radius:0; min-height:48px; margin:0; padding:12px 16px; font-family:inherit; font-size:14px; color:#4b3828; }
.kof-menu-search input:focus { outline:2px solid #bd6c42; outline-offset:2px; }
.kof-menu-empty { padding:32px 20px; border:1px solid #e3d7c7; background:#fff; text-align:center; }
@media(min-width:992px) { #products .product-card { width:33.333333%; } }
@media(max-width:991px) {
 .kof-home .kof-hero { margin-top:84px; min-height:560px; }
 .kof-menu-intro { margin-top:84px; }
 .kof-stories { gap:12px; min-height:560px; }
 .kof-story-copy { padding:20px; }
 .kof-story h3 { font-size:20px; }
 .kof-story-link { left:20px; right:20px; }
 .kof-place-grid { gap:30px; }
}
@media(max-width:767px) {
 .kof-home section { padding-block:44px; }
 .kof-home .kof-hero { margin-top:80px; min-height:580px; padding:64px 12px; }
 .kof-menu-intro { margin-top:80px; padding-block:42px; }
 .kof-menu-catalogue { padding-block:32px 48px; }
 .kof-menu-tools { align-items:start; flex-direction:column; gap:12px; }
 .kof-hero p { font-size:14px; max-width:95%; }
 .kof-hero-note { margin-top:32px; }
 .kof-scroll { display:none; }
 .kof-section-heading { align-items:start; flex-direction:column; gap:16px; }
 .kof-stories { flex-direction:column; gap:16px; }
 .kof-story { flex:none; min-height:500px; }
 .kof-story.is-open { flex:none; min-height:500px; }
 .kof-story > img { object-position:center 48%; }
 .kof-story-copy { max-width:90%; }
 .kof-story.is-open .kof-story-copy { max-width:none; margin:14px; padding:16px; }
 .kof-story h3 { font-size:24px; }
 .kof-place-grid { grid-template-columns:1fr; }
 .kof-place-grid > img { min-height:0; aspect-ratio:4/3; }
 .kof-order-banner { align-items:start; flex-direction:column; }
 .kof-product-content { padding:18px; }
 .kof-button { padding:13px 18px; gap:20px; }
}
@media(prefers-reduced-motion:reduce) { .kof-home *, .kof-product, .kof-product * { transition:none !important; animation:none !important; scroll-behavior:auto !important; } }
