/* Brand stories, locations, and intrinsic-width menu navigation. */
.kof-category-scroll { overflow-x:auto; margin-bottom:28px; padding:3px 2px 10px; scrollbar-width:thin; scrollbar-color:#b91f2d #eee4d7; }
.kof-category-tabs { display:flex; flex-wrap:wrap; align-items:stretch; gap:10px; }
body .kof-category-tabs .category-btn { width:auto !important; height:auto !important; min-width:100px; min-height:48px; flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; padding:11px 22px; border:1px solid #d9cbbb; border-radius:0 !important; background:#fff; color:#6a5140; font-family:'IBM Plex Sans Arabic',sans-serif; font-size:15px; font-weight:400; line-height:1.5; white-space:nowrap; box-shadow:none; }
body .kof-category-tabs .category-btn:hover { border-color:#aa2630; background:#fff0e5; }
body .kof-category-tabs .category-btn.active { color:#fff; background:#a9222d; border-color:#a9222d; }
.kof-category-tabs button:focus-visible { outline:2px solid #bd6c42; outline-offset:2px; }
.kof-home .kof-numbers { display:grid; grid-template-columns:1.25fr repeat(3,1fr); align-items:center; gap:30px; padding-block:52px; border-bottom:1px solid #e4d7c7; }
.kof-numbers-intro h2 { position:relative; color:#3b2b20; margin-bottom:18px; }
.kof-source-link { color:#8c7562; font-family:'IBM Plex Sans Arabic',sans-serif; font-size:11px; border-bottom:1px solid #d7c2af; padding-bottom:4px; }
.kof-number { text-align:center; padding:16px 12px; border-inline-start:1px solid #e4d7c7; }
.kof-number-value { display:flex; justify-content:center; align-items:baseline; font:500 clamp(42px,4.4vw,66px)/1.3 'IBM Plex Sans Arabic',sans-serif; letter-spacing:-2px; color:#af2d2b; }
.kof-number-value > span+span { font-size:.57em; margin-left:4px; letter-spacing:-1px; }
.kof-number-rule { display:block; width:24px; height:2px; background:#dba473; margin:18px auto; }
.kof-number p { color:#705b49; font-size:13px; margin:0; }
.kof-home .kof-heritage-wrap { padding-block:24px 70px; }
.kof-heritage { display:grid; grid-template-columns:1fr 1.05fr; align-items:center; gap:20px; padding:54px 46px 0; background:#342121; color:#fff8eb; position:relative; overflow:hidden; }
.kof-heritage-copy { padding-bottom:54px; position:relative; z-index:1; }
.kof-heritage .kof-eyebrow { color:#dda773; }
body .kof-heritage h2 { font-size:clamp(26px,2.7vw,38px); line-height:1.6; color:#fff8eb; margin:0 0 22px; }
.kof-heritage h2 span { color:#f1b37e; }
.kof-heritage-copy > p { font-size:14px; line-height:2; color:#decdc1; max-width:47ch; }
.kof-heritage-points { list-style:none; margin:24px 0 30px; padding:0; }
.kof-heritage-points li { font-family:'IBM Plex Sans Arabic',sans-serif; font-size:13px; margin:12px 0; }
.kof-heritage-points li span { color:#f1b37e; padding-inline-end:10px; }
.kof-heritage .kof-button { background:var(--kof-red); border-color:var(--kof-red); color:#fff !important; }
.kof-heritage .kof-button:hover { background:#951824; border-color:#951824; }
.kof-heritage-visual { position:relative; align-self:end; min-width:0; padding-top:48px; }
.kof-heritage-visual > img { width:112%; max-width:112%; margin-inline-start:-6%; display:block; position:relative; z-index:1; }
.kof-note { position:absolute; z-index:2; display:flex; align-items:center; gap:10px; padding:14px 16px; background:#fff7eb; color:#57372c; border-bottom:3px solid #d99d71; box-shadow:0 9px 24px #150c0c20; max-width:240px; animation:kof-note-float 6s ease-in-out infinite; }
.kof-note-right { right:-14px; top:18px; }
.kof-note-left { left:-20px; bottom:36px; animation-delay:-3s; }
.kof-note strong { display:block; font-size:14px; margin-bottom:4px; }
.kof-note div > span { display:block; font-family:'IBM Plex Sans Arabic',sans-serif; font-size:10px; color:#94705a; }
.kof-note-icon { font-size:27px; color:#af3034; }
@keyframes kof-note-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-8px); } }
.kof-locations { background:#eee5d8; }
.kof-branch-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.kof-location { min-width:0; background:#fffaf2; border:1px solid #dfd0bd; display:flex; flex-direction:column; }
.kof-location-photo { display:block; position:relative; aspect-ratio:4/3; overflow:hidden; }
.kof-location-photo img { width:100%; height:100%; object-fit:cover; object-position:center; display:block; transition:transform .6s; }
.kof-location[data-location="manama"] .kof-location-photo img { object-position:center bottom; }
.kof-location:hover .kof-location-photo img { transform:scale(1.04); }
.kof-location-year { position:absolute; top:16px; right:16px; padding:6px 10px; font:12px 'IBM Plex Sans Arabic',sans-serif; color:#fff; background:#382b23d9; }
.kof-location-arrow { position:absolute; left:16px; bottom:16px; width:38px; height:38px; display:grid; place-items:center; background:#fff8ed; color:#a5252b; font-size:23px; transition:background .2s; }
.kof-location-photo:hover .kof-location-arrow { background:#f0bd91; }
.kof-location-body { padding:26px; flex:1; display:flex; flex-direction:column; }
.kof-location-body .kof-eyebrow { font-size:10px; margin-bottom:12px; }
.kof-location h3 { color:#482e22; font-size:25px; margin:0 0 16px; }
.kof-location p { color:#826956; font-size:13px; line-height:1.95; margin-bottom:22px; }
.kof-location-address { display:flex; align-items:center; gap:10px; padding-block:16px; border-top:1px solid #e7dac9; font:12px/1.8 'IBM Plex Sans Arabic',sans-serif; color:#6b4c37; margin-top:auto; }
.kof-location-address i { flex-shrink:0; color:#b34a39; font-size:17px; }
.kof-location .kof-text-link { align-self:flex-start; font-size:12px; }
.kof-branches-catalogue { padding-block:48px 72px; }
.kof-visit-note { text-align:center; font-size:12px; margin:30px 0 0; color:#8b7460; }
.kof-delivery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.kof-delivery-card { display:flex; flex-direction:column; border:1px solid #e2d5c6; padding:30px; background:#fff; transition:transform .2s,border-color .2s; }
.kof-delivery-card:hover { transform:translateY(-4px); border-color:#ba9479; }
.kof-delivery-top { display:flex; justify-content:space-between; align-items:start; margin-bottom:28px; }
.kof-delivery-top img { width:72px; height:72px; object-fit:contain; }
.kof-delivery-top > span { font:13px 'IBM Plex Sans Arabic',sans-serif; color:#bfa28d; }
.kof-delivery-card h3 { font-size:25px; color:#493125; margin-bottom:16px; }
.kof-delivery-card p { color:#8a6e59; font-size:13px; line-height:1.9; margin-bottom:24px; }
.kof-delivery-card .kof-text-link { margin-top:auto; align-self:flex-start; }
@media (max-width:991px) {
 .kof-home .kof-numbers { grid-template-columns:repeat(3,1fr); gap:16px; }
 .kof-numbers-intro { grid-column:1/-1; text-align:center; }
 .kof-numbers-intro h2 br { display:none; }
 .kof-number:nth-child(2) { border-inline-start:0; }
 .kof-heritage { grid-template-columns:1fr; padding:40px 32px 0; }
 .kof-heritage-copy { padding-bottom:16px; }
 .kof-heritage-copy > p { max-width:none; }
 .kof-heritage-visual { width:min(100%,600px); margin-inline:auto; }
 .kof-heritage-visual > img { width:100%; max-width:100%; margin-inline-start:0; }
 .kof-branch-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .kof-delivery-card { padding:22px; }
}
@media (max-width:767px) {
 .kof-category-tabs { flex-wrap:nowrap; width:max-content; min-width:100%; gap:8px; }
 body .kof-category-tabs .category-btn { min-width:96px; font-size:14px; padding-inline:18px; }
 .kof-home .kof-numbers { gap:8px; padding-block:36px; }
 .kof-number { padding:14px 4px; }
 .kof-number-value { font-size:38px; letter-spacing:-1px; }
 .kof-number p { font-size:10px; }
 .kof-home .kof-heritage-wrap { padding-block:0 44px; }
 .kof-heritage { padding:30px 22px 0; gap:8px; }
 .kof-heritage-copy > p { font-size:13px; }
 .kof-heritage-visual { padding-top:60px; }
 .kof-note { padding:10px 12px; gap:8px; max-width:200px; }
 .kof-note strong { font-size:12px; }
 .kof-note div > span { font-size:9px; }
 .kof-note-right { right:0; top:4px; }
 .kof-note-left { left:-10px; bottom:14px; }
 .kof-note-icon { font-size:21px; }
 .kof-branch-grid,.kof-delivery-grid { grid-template-columns:1fr; gap:20px; }
 .kof-location-body { padding:22px; }
 .kof-branches-catalogue { padding-block:32px 48px; }
 .kof-delivery-top { margin-bottom:18px; }
}
@media (prefers-reduced-motion:reduce) { .kof-note,.kof-location-photo img,.kof-delivery-card { animation:none !important; transition:none !important; } }
/* Light brand mesh, with an editorial intro and a touch-friendly branch rail. */
.kof-branch-showcase { position:relative; isolation:isolate; padding:90px 0; margin-top:70px; background:#fcfaf7; overflow:hidden; }
.kof-branch-showcase::before { content:''; position:absolute; z-index:-2; inset:-45px; background:url('../images/home/branches-mesh.jpg') center/cover; filter:blur(28px) saturate(.45); opacity:.55; }
.kof-branch-showcase::after { content:''; position:absolute; z-index:-1; inset:0; background:linear-gradient(110deg,rgba(255,247,236,.78),rgba(255,236,220,.7) 55%,rgba(255,250,246,.85)); }
.kof-showcase-layout { display:grid; grid-template-columns:minmax(240px, .7fr) minmax(0,2fr); gap:40px; align-items:center; }
.kof-showcase-intro h2 { font:500 clamp(30px,3.4vw,48px)/1.6 'lyon02',serif; color:var(--kof-ink); margin:20px 0; }
.kof-showcase-intro h2 span { color:var(--kof-red); }
.kof-showcase-intro p { color:#77675c; font-size:15px; line-height:2; margin-bottom:25px; }
.kof-showcase-window { min-width:0; }
.kof-branch-track { --branch-card-width: min(82%,380px); display:flex; gap:24px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scrollbar-width:none; padding:12px 0 20px; }
.kof-branch-track::-webkit-scrollbar { display:none; }
.kof-branch-track::after { content:''; flex:0 0 max(0px,calc(100% - var(--branch-card-width) - 24px)); }
.kof-branch-track .kof-location { flex:0 0 var(--branch-card-width); min-width:0; scroll-snap-align:start; background:#fff; box-shadow:0 12px 30px #7b30200a; }
.kof-branch-track .kof-location-photo { aspect-ratio:1.5; }
.kof-branch-track .kof-location-body { padding:24px; }
.kof-branch-track .kof-location-body h3 { font-size:24px; }
@media(min-width:1200px) { .kof-branch-track { --branch-card-width:calc((100% - 48px)/2.5); } .kof-branch-track .kof-location-body { padding:22px 18px; } .kof-branch-track .kof-location-body h3 { font-size:22px; } }
.kof-carousel-controls { display:flex; align-items:center; gap:15px; margin-top:30px; }
.kof-carousel-controls > button { width:46px; height:46px; display:grid; place-items:center; border:1px solid #e9d7cd; background:#fff; color:var(--kof-red); }
.kof-carousel-controls > button:disabled { opacity:.35; cursor:default; }
.kof-carousel-controls [data-carousel-prev] svg { transform:rotate(180deg); }
.kof-carousel-dots { display:flex; gap:9px; }
.kof-carousel-dots button { border:0; padding:0; width:8px; height:8px; background:#dfc8bc; transition:width .2s; }
.kof-carousel-dots button[aria-current=true] { background:var(--kof-red); width:26px; }
.kof-branch-showcase :is(button,a,[tabindex]):focus-visible { outline:2px solid var(--kof-red); outline-offset:4px; }
.kof-customer-reviews { padding-block:80px; }
.kof-reviews-track { --review-width:calc((100% - 48px)/3); display:flex; gap:24px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scrollbar-width:none; padding:12px 0; }
.kof-reviews-track::-webkit-scrollbar { display:none; }
.kof-reviews-track::after { content:''; flex:0 0 max(0px,calc(100% - var(--review-width) - 24px)); }
.kof-reviews-track .kof-review { flex:0 0 var(--review-width); min-width:0; scroll-snap-align:start; }
.kof-review-disclosure { color:#766459; font:12px/1.8 'IBM Plex Sans Arabic',sans-serif; margin-bottom:20px; max-width:880px; }
.kof-review-top { display:flex; align-items:start; justify-content:space-between; }
.kof-review-sample { font:10px/1.6 'IBM Plex Sans Arabic',sans-serif; color:#8c786c; padding:5px 8px; background:#faf5ee; }
.kof-review-rating { display:flex; gap:4px; color:#b88122; margin-top:14px; }
.kof-review-rating svg { width:17px; height:17px; fill:currentColor; stroke:currentColor; stroke-width:1.5; }
.kof-review-rating svg.is-empty { fill:none; color:#d6c3a7; }
.kof-review-avatar { width:58px; height:58px; flex:none; display:grid; place-items:center; background:#fff0e4; color:#c21f26; }
.kof-review-avatar svg { width:27px; height:27px; }
.kof-review-person { display:flex; flex-direction:column; gap:4px; }
.kof-review-person strong { font-weight:500; }
.kof-review-person small { font:10px/1.5 'IBM Plex Sans Arabic',sans-serif; color:#8c786c; }
.kof-review-platform { margin-inline-start:auto; display:grid; place-items:center; width:32px; height:32px; font-size:21px; color:#3e332c; }
.kof-review-platform[data-platform=google] { color:#4285f4; }
.kof-review-platform[data-platform=instagram] { color:#c13584; }
.kof-review-platform[data-platform=snapchat] { background:#fffc00; color:#151515; }
.kof-review-platform[data-platform=facebook-f] { color:#1877f2; }
.kof-review-controls { justify-content:center; margin-top:24px; }
.kof-review-socials { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:12px; margin-top:24px; color:#766459; font-size:13px; }
.kof-review-socials a { display:grid; place-items:center; width:36px; height:36px; color:#c21f26; background:#fff0e4; font-size:18px; }
.kof-customer-reviews :is(button,[tabindex]):focus-visible { outline:2px solid #c21f26; outline-offset:4px; }
.kof-review { margin:0; padding:28px; background:#fff; border:1px solid var(--kof-line); display:flex; flex-direction:column; }
.kof-review-quote { font:64px/1 Georgia,serif; color:#c21f26; height:50px; }
.kof-review blockquote { font-size:17px; line-height:2; color:var(--kof-ink); padding:0; border:0; margin:20px 0 28px; flex:1; }
.kof-review figcaption { display:flex; align-items:center; gap:12px; padding-top:20px; border-top:1px solid var(--kof-line); font-size:14px; }
.kof-review-initial { display:grid; place-items:center; width:40px; height:40px; background:#fff0e4; color:var(--kof-red); }
@media(max-width:1199px) { .kof-reviews-track { --review-width:calc((100% - 24px)/2); } }
@media(max-width:991px) { .kof-showcase-layout { grid-template-columns:1fr; gap:25px; } .kof-branch-showcase { padding:45px 0; } .kof-showcase-intro { max-width:600px; } }
@media(max-width:575px) { .kof-reviews-track { --review-width:90%; gap:16px; } .kof-review { padding:22px; } .kof-review-controls { gap:12px; } .kof-carousel-dots { gap:7px; } .kof-review-controls > button { width:38px; height:38px; } }
@media(prefers-reduced-motion:reduce) { .kof-carousel-dots button { transition:none; } }

@media(min-width:992px) { #fixedbutton { bottom:22px !important; } }