/* ====================================================
   COLUMBUS CAFE RESTAURANT — Design System
   Deep Coffee Brown / Gold / Cream / Forest Green
   ==================================================== */

:root{
  --coffee:#3B2416;
  --coffee-2:#2A1A0F;
  --gold:#D4A55A;
  --gold-light:#E8C98C;
  --cream:#F8F5F0;
  --cream-dim:#EFE9DF;
  --forest:#2F5D50;
  --forest-light:#3E7A68;
  --ink:#231408;
  --white:#FFFFFF;
  --shadow-soft: 0 10px 40px rgba(59,36,22,0.12);
  --shadow-deep: 0 25px 60px rgba(0,0,0,0.35);
  --radius: 18px;
  --radius-sm: 10px;
  --font-display: 'Fraunces', 'Playfair Display', serif;
  --font-body: 'Manrope', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  --ease: cubic-bezier(.22,1,.36,1);
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font-body);
  background:var(--cream);
  color:var(--ink);
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;}
button{font-family:inherit;cursor:pointer;border:none;background:none;}
.container{max-width:1280px;margin:0 auto;padding:0 6vw;}
section{position:relative;}

::selection{background:var(--gold);color:var(--coffee);}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important;}
}

/* ---------- Typography ---------- */
h1,h2,h3,h4{font-family:var(--font-display); font-weight:600; color:var(--coffee); letter-spacing:-0.01em;}
.eyebrow{
  font-family:var(--font-mono);
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:.72rem;
  color:var(--forest);
  display:flex; align-items:center; gap:.6em;
  margin-bottom:1.1rem;
  font-weight:600;
}
.eyebrow::before{content:"";width:28px;height:1px;background:var(--gold);display:inline-block;}
.section-title{
  font-size:clamp(2rem,4.2vw,3.4rem);
  line-height:1.05;
  margin-bottom:1rem;
}
.section-title em{color:var(--forest); font-style:italic;}
.section-lede{
  max-width:560px;
  color:#5b4a3c;
  font-size:1.05rem;
}
.section-head{margin-bottom:3rem;}
.section-head.center{text-align:center; margin-left:auto; margin-right:auto;}
.section-head.center .section-lede{margin-inline:auto;}
.section-head.center .eyebrow{justify-content:center;}
.section-head.center .eyebrow::before{display:none;}

.btn{
  display:inline-flex; align-items:center; gap:.55em;
  padding:.95rem 1.9rem;
  border-radius:100px;
  font-weight:700;
  font-size:.92rem;
  letter-spacing:.01em;
  transition:transform .45s var(--ease), box-shadow .45s var(--ease), background .3s;
  white-space:nowrap;
}
.btn-gold{background:var(--gold); color:var(--coffee-2);}
.btn-gold:hover{transform:translateY(-3px); box-shadow:0 14px 30px rgba(212,165,90,.45);}
.btn-outline{border:1.5px solid rgba(248,245,240,.55); color:var(--cream); backdrop-filter:blur(6px); background:rgba(248,245,240,.06);}
.btn-outline:hover{background:var(--cream); color:var(--coffee); transform:translateY(-3px);}
.btn-forest{background:var(--forest); color:var(--cream);}
.btn-forest:hover{transform:translateY(-3px); box-shadow:0 14px 30px rgba(47,93,80,.4);}
.btn-dark{background:var(--coffee); color:var(--cream);}
.btn-dark:hover{transform:translateY(-3px); box-shadow:0 14px 30px rgba(59,36,22,.35);}
.btn-sm{padding:.65rem 1.3rem; font-size:.8rem;}

/* ---------- Glassmorphism ---------- */
.glass{
  background:rgba(248,245,240,.08);
  border:1px solid rgba(248,245,240,.18);
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
}
.glass-light{
  background:rgba(255,255,255,.55);
  border:1px solid rgba(255,255,255,.6);
  backdrop-filter:blur(18px) saturate(160%);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
}

/* ---------- Header / Nav ---------- */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  display:flex; align-items:center; justify-content:space-between;
  padding:1.1rem 6vw;
  transition:background .4s var(--ease), padding .4s var(--ease), box-shadow .4s;
}
.site-header.scrolled{
  background:rgba(248,245,240,.85);
  backdrop-filter:blur(14px);
  box-shadow:0 6px 24px rgba(59,36,22,.08);
  padding:.7rem 6vw;
}
.brand{display:flex; align-items:center; gap:.7rem;}
.brand img{height:52px; width:52px; border-radius:50%; transition:height .4s;}
.site-header.scrolled .brand img{height:42px; width:42px;}
.brand-text{display:flex; flex-direction:column; line-height:1.05;}
.brand-text .name{font-family:var(--font-display); font-weight:700; font-size:1.15rem; color:var(--cream);}
.site-header.scrolled .brand-text .name{color:var(--coffee);}
.brand-text .tag{font-size:.62rem; letter-spacing:.06em; color:var(--gold-light); font-family:var(--font-mono);}
.site-header.scrolled .brand-text .tag{color:var(--forest);}

.main-nav{display:flex; align-items:center; gap:2.1rem;}
.main-nav a{
  font-size:.88rem; font-weight:600; color:var(--cream);
  position:relative; padding:.3rem 0;
  transition:color .3s;
}
.site-header.scrolled .main-nav a{color:var(--coffee);}
.main-nav a::after{
  content:""; position:absolute; left:0; bottom:-2px; height:2px; width:0%;
  background:var(--gold); transition:width .35s var(--ease);
}
.main-nav a:hover::after, .main-nav a.active::after{width:100%;}
.main-nav a.active{color:var(--gold-light);}
.site-header.scrolled .main-nav a.active{color:var(--forest);}

.nav-actions{display:flex; align-items:center; gap:1rem;}
.lang-switch{
  display:flex; gap:.3rem; font-family:var(--font-mono); font-size:.72rem; color:var(--cream);
}
.site-header.scrolled .lang-switch{color:var(--coffee);}
.lang-switch button{padding:.2rem .5rem; border-radius:6px; opacity:.55;}
.lang-switch button.active{opacity:1; background:rgba(212,165,90,.25); font-weight:700;}

.burger{display:none; flex-direction:column; gap:5px; width:26px;}
.burger span{height:2px; background:var(--cream); border-radius:2px; transition:.3s;}
.site-header.scrolled .burger span{background:var(--coffee);}

.mobile-menu{
  position:fixed; inset:0; background:var(--coffee); z-index:1100;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1.8rem;
  transform:translateY(-100%); transition:transform .5s var(--ease); 
}
.mobile-menu.open{transform:translateY(0);}
.mobile-menu a{font-family:var(--font-display); font-size:1.6rem; color:var(--cream);}
.mobile-menu .close-x{position:absolute; top:1.6rem; right:6vw; font-size:1.8rem; color:var(--gold);}

/* ---------- Hero ---------- */
.hero{
  position:relative; min-height:100vh; display:flex; align-items:center;
  overflow:hidden; color:var(--cream); isolation:isolate;
}
.hero-media{position:absolute; inset:0; z-index:-2;}
.hero-media img, .hero-media video{width:100%; height:100%; object-fit:cover;}
.hero-media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(20,12,6,.55) 0%, rgba(20,12,6,.35) 35%, rgba(20,12,6,.85) 100%);
  z-index:-1;
}
.hero-content{position:relative; z-index:2; padding-top:6rem;}
.hero-eyebrow{
  font-family:var(--font-mono); letter-spacing:.25em; text-transform:uppercase;
  font-size:.75rem; color:var(--gold-light); margin-bottom:1.4rem;
  display:flex; align-items:center; gap:.7em;
}
.hero-eyebrow::before{content:"●"; color:var(--gold); font-size:.55em;}
.hero h1{
  font-size:clamp(2.6rem,7vw,5.6rem); color:var(--cream); line-height:1.02; max-width:14ch;
  text-shadow:0 4px 30px rgba(0,0,0,.3);
}
.hero h1 .accent{color:var(--gold-light); font-style:italic;}
.hero p.lede{
  margin-top:1.6rem; font-size:1.18rem; max-width:540px; color:#EFE6D8;
}
.hero-ctas{display:flex; gap:1rem; flex-wrap:wrap; margin-top:2.6rem;}
.hero-stats{
  display:flex; gap:2.6rem; margin-top:4rem; flex-wrap:wrap;
}
.hero-stats .stat strong{font-family:var(--font-display); font-size:2rem; color:var(--gold-light); display:block;}
.hero-stats .stat span{font-size:.78rem; color:#cdbfae; letter-spacing:.03em;}
.scroll-cue{
  position:absolute; bottom:2.2rem; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:.5rem;
  color:var(--cream); font-family:var(--font-mono); font-size:.65rem; letter-spacing:.2em;
  z-index:2;
}
.scroll-cue .line{width:1px; height:34px; background:linear-gradient(var(--gold),transparent); animation:scrollPulse 1.8s infinite;}
@keyframes scrollPulse{0%{opacity:.2;}50%{opacity:1;}100%{opacity:.2;}}

/* Page header (non-home) */
.page-hero{
  min-height:62vh; display:flex; align-items:center; position:relative; color:var(--cream); overflow:hidden;
}
.page-hero .hero-media::after{background:linear-gradient(180deg, rgba(20,12,6,.6), rgba(20,12,6,.82));}
.page-hero .container{position:relative; z-index:2; padding-top:5rem;}
.breadcrumb{font-family:var(--font-mono); font-size:.72rem; letter-spacing:.12em; color:var(--gold-light); margin-bottom:1rem;}
.breadcrumb a{color:#cdbfae;}
.page-hero h1{font-size:clamp(2.2rem,5.5vw,4rem); color:var(--cream);}
.page-hero p{margin-top:1rem; max-width:560px; color:#EFE6D8; font-size:1.05rem;}

/* ---------- Cards ---------- */
.card{
  background:var(--white); border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow-soft);
  transition:transform .5s var(--ease), box-shadow .5s var(--ease);
}
.card:hover{transform:translateY(-8px); box-shadow:0 30px 60px rgba(59,36,22,.2);}

/* ---------- About / stats ---------- */
.about-grid{
  display:grid; grid-template-columns:1.05fr .95fr; gap:4.5rem; align-items:center;
}
.about-photos{position:relative; aspect-ratio:1/1.05;}
.about-photos img{
  position:absolute; border-radius:var(--radius); box-shadow:var(--shadow-soft); object-fit:cover;
}
.about-photos .p1{width:72%; height:62%; top:0; left:0; z-index:2;}
.about-photos .p2{width:55%; height:48%; bottom:0; right:0; z-index:3; border:6px solid var(--cream);}
.about-photos .badge{
  position:absolute; bottom:8%; left:4%; z-index:4;
  background:var(--forest); color:var(--cream); padding:1.1rem 1.4rem; border-radius:var(--radius-sm);
  box-shadow:var(--shadow-soft); max-width:200px;
}
.about-photos .badge strong{font-family:var(--font-display); font-size:1.7rem; display:block; color:var(--gold-light);}
.about-photos .badge span{font-size:.78rem;}

.values-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; margin-top:3rem;}
.value-card{padding:1.8rem; border-radius:var(--radius); background:var(--cream-dim); border:1px solid rgba(59,36,22,.06);}
.value-card .ico{font-size:1.6rem; margin-bottom:.8rem; display:block;}
.value-card h4{font-size:1.05rem; margin-bottom:.5rem;}
.value-card p{font-size:.88rem; color:#5b4a3c;}

.stats-strip{
  background:var(--coffee); color:var(--cream); padding:3.5rem 0; margin-top:5rem; border-radius:var(--radius);
  display:grid; grid-template-columns:repeat(4,1fr);
}
.stats-strip .stat{text-align:center; border-right:1px solid rgba(248,245,240,.12); padding:0 1rem;}
.stats-strip .stat:last-child{border-right:none;}
.stats-strip .stat strong{font-family:var(--font-display); font-size:clamp(1.8rem,3vw,2.6rem); color:var(--gold-light); display:block;}
.stats-strip .stat span{font-size:.78rem; color:#cdbfae; letter-spacing:.02em;}

.timeline{margin-top:5rem; position:relative;}
.timeline::before{content:""; position:absolute; left:18px; top:0; bottom:0; width:1px; background:rgba(59,36,22,.15);}
.t-item{position:relative; padding-left:3.2rem; margin-bottom:2.4rem;}
.t-item::before{content:""; position:absolute; left:11px; top:4px; width:15px; height:15px; border-radius:50%; background:var(--gold); border:3px solid var(--cream);}
.t-item .yr{font-family:var(--font-mono); color:var(--forest); font-weight:700; font-size:.85rem;}
.t-item h4{margin:.3rem 0;}
.t-item p{color:#5b4a3c; font-size:.92rem; max-width:520px;}

/* ---------- Food / menu cards ---------- */
.tabs{display:flex; gap:.6rem; flex-wrap:wrap; margin-bottom:2.6rem;}
.tab-btn{
  padding:.6rem 1.3rem; border-radius:100px; font-size:.85rem; font-weight:700;
  background:var(--cream-dim); color:var(--coffee); border:1px solid rgba(59,36,22,.08);
  transition:.3s;
}
.tab-btn.active, .tab-btn:hover{background:var(--forest); color:var(--cream);}

.food-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.8rem;}
.food-card{position:relative;}
.food-card .img-wrap{position:relative; aspect-ratio:4/3; overflow:hidden; border-radius:var(--radius) var(--radius) 0 0;}
.food-card .img-wrap img{width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease);}
.food-card:hover .img-wrap img{transform:scale(1.08);}
.food-card .tag{
  position:absolute; top:.8rem; left:.8rem; background:var(--gold); color:var(--coffee-2);
  font-size:.65rem; font-weight:800; padding:.3rem .65rem; border-radius:100px; letter-spacing:.04em; z-index:2;
}
.food-card .tag.halal{background:var(--forest); color:var(--cream);}
.food-card .body{padding:1.3rem 1.4rem; background:var(--white); border-radius:0 0 var(--radius) var(--radius);}
.food-card .row{display:flex; justify-content:space-between; align-items:baseline; gap:.6rem;}
.food-card h4{font-size:1.08rem;}
.food-card .price{font-family:var(--font-mono); color:var(--forest); font-weight:700;}
.food-card p{font-size:.85rem; color:#5b4a3c; margin-top:.4rem;}
.food-card .meta{display:flex; gap:.5rem; margin-top:.8rem; flex-wrap:wrap;}
.food-card .meta span{font-size:.68rem; padding:.22rem .55rem; background:var(--cream-dim); border-radius:6px; color:#5b4a3c;}
.food-card .order-btn{
  margin-top:1rem; width:100%; text-align:center; padding:.6rem; border-radius:100px;
  background:var(--coffee); color:var(--cream); font-size:.8rem; font-weight:700; transition:.3s;
}
.food-card .order-btn:hover{background:var(--forest);}

/* Menu search/filter bar */
.menu-toolbar{
  display:flex; gap:1rem; flex-wrap:wrap; align-items:center; justify-content:space-between;
  margin-bottom:2.4rem; padding:1.1rem 1.4rem; background:var(--white); border-radius:var(--radius);
  box-shadow:var(--shadow-soft);
}
.search-box{display:flex; align-items:center; gap:.6rem; background:var(--cream-dim); border-radius:100px; padding:.6rem 1.1rem; flex:1; min-width:220px;}
.search-box input{background:none; border:none; outline:none; width:100%; font-family:var(--font-body); font-size:.9rem;}

/* QR card */
.qr-card{
  display:flex; align-items:center; gap:1.6rem; background:var(--forest); color:var(--cream);
  padding:2rem; border-radius:var(--radius); margin-top:3rem;
}
.qr-box{width:96px; height:96px; background:var(--cream); border-radius:12px; flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:2.2rem;}
.qr-card h4{color:var(--cream); margin-bottom:.3rem;}
.qr-card p{font-size:.88rem; color:#cfe3da;}

/* ---------- Catering / events ---------- */
.event-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:1.2rem;}
.event-pill{
  padding:1.6rem 1rem; text-align:center; background:var(--cream-dim); border-radius:var(--radius);
  transition:.4s var(--ease);
}
.event-pill:hover{background:var(--forest); color:var(--cream); transform:translateY(-6px);}
.event-pill .ico{font-size:1.8rem; display:block; margin-bottom:.6rem;}
.event-pill h4{font-size:.92rem;}
.event-pill:hover h4{color:var(--cream);}

.package-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.8rem; margin-top:3rem;}
.package{
  padding:2.2rem; border-radius:var(--radius); background:var(--white); box-shadow:var(--shadow-soft);
  border:2px solid transparent; position:relative;
}
.package.featured{border-color:var(--gold); transform:scale(1.03);}
.package .ribbon{position:absolute; top:-12px; right:1.6rem; background:var(--gold); color:var(--coffee-2); font-size:.68rem; font-weight:800; padding:.3rem .8rem; border-radius:100px;}
.package h3{font-size:1.3rem;}
.package .price{font-family:var(--font-mono); font-size:1.8rem; color:var(--forest); margin:.6rem 0 1.2rem;}
.package .price span{font-size:.85rem; color:#5b4a3c; font-family:var(--font-body);}
.package ul{margin:1.2rem 0; display:flex; flex-direction:column; gap:.6rem;}
.package ul li{font-size:.88rem; display:flex; gap:.6rem; align-items:flex-start; color:#4a3c30;}
.package ul li::before{content:"✓"; color:var(--forest); font-weight:800;}

/* Calculator */
.calc-box{
  background:var(--white); border-radius:var(--radius); box-shadow:var(--shadow-soft); padding:2.4rem; margin-top:3rem;
  display:grid; grid-template-columns:1fr 1fr; gap:2.5rem;
}
.calc-field{margin-bottom:1.2rem;}
.calc-field label{display:block; font-size:.82rem; font-weight:700; margin-bottom:.5rem; color:var(--coffee);}
.calc-field input[type=range]{width:100%; accent-color:var(--forest);}
.calc-field select{width:100%; padding:.7rem 1rem; border-radius:var(--radius-sm); border:1px solid rgba(59,36,22,.15); font-family:var(--font-body); background:var(--cream-dim);}
.calc-result{background:var(--coffee); color:var(--cream); border-radius:var(--radius); padding:2rem; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center;}
.calc-result .amount{font-family:var(--font-display); font-size:2.6rem; color:var(--gold-light); margin:.5rem 0;}
.calc-result p{font-size:.8rem; color:#cdbfae;}

/* ---------- Rooms ---------- */
.room-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.8rem;}
.room-card{background:var(--white); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-soft);}
.room-card .img-wrap{position:relative; aspect-ratio:5/4; overflow:hidden;}
.room-card .img-wrap img{width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease);}
.room-card:hover .img-wrap img{transform:scale(1.07);}
.room-card .price-tag{
  position:absolute; bottom:.8rem; left:.8rem; background:var(--cream); color:var(--coffee);
  padding:.5rem .9rem; border-radius:100px; font-family:var(--font-mono); font-weight:700; font-size:.85rem;
}
.room-card .body{padding:1.6rem;}
.room-amenities{display:flex; flex-wrap:wrap; gap:.5rem; margin:1rem 0;}
.room-amenities span{font-size:.7rem; background:var(--cream-dim); padding:.3rem .6rem; border-radius:6px; color:#5b4a3c;}

.compare-table{width:100%; border-collapse:collapse; margin-top:3rem; background:var(--white); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-soft);}
.compare-table th, .compare-table td{padding:1rem 1.3rem; text-align:left; font-size:.88rem; border-bottom:1px solid var(--cream-dim);}
.compare-table th{background:var(--coffee); color:var(--cream); font-family:var(--font-display); font-weight:600;}
.compare-table td:first-child{font-weight:700;}
.compare-table tr:last-child td{border-bottom:none;}
.compare-table .yes{color:var(--forest); font-weight:800;}

.calendar-mini{display:grid; grid-template-columns:repeat(7,1fr); gap:.4rem; max-width:380px; margin-top:1.5rem;}
.calendar-mini .d{aspect-ratio:1; display:flex; align-items:center; justify-content:center; border-radius:8px; font-size:.78rem; background:var(--cream-dim);}
.calendar-mini .d.busy{background:#e3c9c0; color:#7a3b2c;}
.calendar-mini .d.open{background:var(--forest); color:var(--cream); font-weight:700;}
.calendar-mini .d.lbl{background:none; color:#9b8a78; font-weight:700; font-size:.65rem;}

/* ---------- Gallery ---------- */
.gallery-filters{display:flex; gap:.6rem; flex-wrap:wrap; margin-bottom:2rem;}
.masonry{
  display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:10px; gap:1rem;
}
.masonry .g-item{border-radius:var(--radius-sm); overflow:hidden; position:relative; cursor:pointer;}
.masonry .g-item img{width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease);}
.masonry .g-item:hover img{transform:scale(1.1);}
.masonry .g-item::after{content:"";position:absolute; inset:0; background:linear-gradient(180deg, transparent 50%, rgba(20,12,6,.55)); opacity:0; transition:.4s;}
.masonry .g-item:hover::after{opacity:1;}
.masonry .g-item .cap{position:absolute; bottom:.7rem; left:.9rem; color:var(--cream); font-size:.8rem; font-weight:700; opacity:0; transform:translateY(8px); transition:.4s; z-index:2;}
.masonry .g-item:hover .cap{opacity:1; transform:translateY(0);}

.lightbox{
  position:fixed; inset:0; background:rgba(20,12,6,.92); z-index:2000; display:none;
  align-items:center; justify-content:center; padding:4vw;
}
.lightbox.open{display:flex;}
.lightbox img{max-height:88vh; max-width:88vw; border-radius:10px; box-shadow:var(--shadow-deep);}
.lightbox .lb-close{position:absolute; top:2rem; right:3rem; color:var(--cream); font-size:2rem; cursor:pointer;}
.lightbox .lb-nav{position:absolute; top:50%; transform:translateY(-50%); color:var(--cream); font-size:2.2rem; cursor:pointer; padding:1rem;}
.lightbox .lb-prev{left:1rem;} .lightbox .lb-next{right:1rem;}

/* ---------- Reviews ---------- */
.review-track{display:flex; gap:1.6rem; overflow-x:auto; padding-bottom:1rem; scroll-snap-type:x mandatory;}
.review-track::-webkit-scrollbar{height:6px;}
.review-track::-webkit-scrollbar-thumb{background:var(--gold); border-radius:10px;}
.review-card{
  min-width:340px; scroll-snap-align:start; background:var(--white); padding:2rem; border-radius:var(--radius);
  box-shadow:var(--shadow-soft);
}
.review-card .stars{color:var(--gold); margin-bottom:.8rem; letter-spacing:.1em;}
.review-card p{font-size:.95rem; color:#4a3c30; font-style:italic;}
.review-card .who{display:flex; align-items:center; gap:.8rem; margin-top:1.3rem;}
.review-card .avatar{width:42px; height:42px; border-radius:50%; background:var(--forest); color:var(--cream); display:flex; align-items:center; justify-content:center; font-weight:700;}
.review-card .who strong{font-size:.88rem; display:block;}
.review-card .who span{font-size:.72rem; color:#9b8a78;}

/* ---------- Locations ---------- */
.branch-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:2rem;}
.branch-card{border-radius:var(--radius); overflow:hidden; background:var(--white); box-shadow:var(--shadow-soft);}
.branch-card .img-wrap{aspect-ratio:16/9; overflow:hidden;}
.branch-card .img-wrap img{width:100%; height:100%; object-fit:cover;}
.branch-card .body{padding:1.8rem;}
.branch-card .row{display:flex; align-items:flex-start; gap:.7rem; margin:.7rem 0; font-size:.88rem; color:#4a3c30;}
.branch-card .actions{display:flex; gap:.7rem; margin-top:1.3rem; flex-wrap:wrap;}

/* ---------- Contact ---------- */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:3.5rem;}
.form-field{margin-bottom:1.2rem;}
.form-field label{display:block; font-size:.82rem; font-weight:700; margin-bottom:.5rem;}
.form-field input, .form-field textarea, .form-field select{
  width:100%; padding:.85rem 1.1rem; border-radius:var(--radius-sm); border:1px solid rgba(59,36,22,.15);
  background:var(--white); font-family:var(--font-body); font-size:.92rem; transition:border .3s;
}
.form-field input:focus, .form-field textarea:focus, .form-field select:focus{outline:2px solid var(--forest); border-color:var(--forest);}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:1.2rem;}
.contact-cards{display:flex; flex-direction:column; gap:1.2rem;}
.contact-card{display:flex; gap:1rem; align-items:flex-start; background:var(--white); padding:1.4rem; border-radius:var(--radius); box-shadow:var(--shadow-soft);}
.contact-card .ico{width:46px; height:46px; border-radius:50%; background:var(--forest); color:var(--cream); display:flex; align-items:center; justify-content:center; font-size:1.2rem; flex-shrink:0;}
.contact-card h4{font-size:1rem; margin-bottom:.2rem;}
.contact-card p{font-size:.85rem; color:#5b4a3c;}

/* Floating actions */
.float-actions{position:fixed; right:1.6rem; bottom:1.6rem; z-index:900; display:flex; flex-direction:column; gap:.8rem;}
.float-btn{
  width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:1.3rem; color:var(--cream); box-shadow:var(--shadow-soft); transition:transform .35s var(--ease);
  position:relative;
}
.float-btn:hover{transform:scale(1.12);}
.float-btn.wa{background:#2F5D50;}
.float-btn.call{background:var(--coffee);}
.float-btn.book{background:var(--gold); color:var(--coffee-2);}
.float-btn .ftip{
  position:absolute; right:62px; top:50%; transform:translateY(-50%); background:var(--coffee); color:var(--cream);
  padding:.4rem .8rem; border-radius:6px; font-size:.74rem; white-space:nowrap; opacity:0; pointer-events:none; transition:.3s;
}
.float-btn:hover .ftip{opacity:1;}

/* AI Concierge */
.concierge-toggle{
  position:fixed; left:1.6rem; bottom:1.6rem; z-index:900; background:var(--coffee); color:var(--cream);
  display:flex; align-items:center; gap:.7rem; padding:.8rem 1.3rem 0.8rem 0.8rem; border-radius:100px; box-shadow:var(--shadow-soft);
  transition:transform .3s;
}
.concierge-toggle:hover{transform:translateY(-3px);}
.concierge-toggle .dot{width:38px; height:38px; border-radius:50%; background:var(--gold); color:var(--coffee-2); display:flex; align-items:center; justify-content:center; font-weight:800;}
.concierge-toggle span{font-size:.82rem; font-weight:700;}

.concierge-panel{
  position:fixed; left:1.6rem; bottom:5.6rem; width:330px; max-height:460px; background:var(--white); border-radius:var(--radius);
  box-shadow:var(--shadow-deep); z-index:950; display:none; flex-direction:column; overflow:hidden;
}
.concierge-panel.open{display:flex;}
.concierge-head{background:var(--coffee); color:var(--cream); padding:1rem 1.3rem; display:flex; justify-content:space-between; align-items:center;}
.concierge-head h4{color:var(--cream); font-size:.95rem;}
.concierge-body{padding:1rem 1.2rem; flex:1; overflow-y:auto; display:flex; flex-direction:column; gap:.7rem; max-height:300px;}
.c-msg{font-size:.84rem; padding:.6rem .9rem; border-radius:12px; max-width:85%;}
.c-msg.bot{background:var(--cream-dim); align-self:flex-start;}
.c-msg.user{background:var(--forest); color:var(--cream); align-self:flex-end;}
.concierge-quick{display:flex; gap:.4rem; flex-wrap:wrap; padding:.7rem 1.2rem; border-top:1px solid var(--cream-dim);}
.concierge-quick button{font-size:.7rem; padding:.35rem .7rem; background:var(--cream-dim); border-radius:100px;}
.concierge-input{display:flex; border-top:1px solid var(--cream-dim);}
.concierge-input input{flex:1; border:none; padding:.8rem 1rem; font-size:.84rem; outline:none;}
.concierge-input button{padding:0 1.1rem; background:var(--forest); color:var(--cream); font-weight:700;}

/* Newsletter */
.newsletter{background:var(--forest); border-radius:var(--radius); padding:3rem; text-align:center; color:var(--cream); margin-top:5rem;}
.newsletter h3{color:var(--cream); font-size:1.6rem;}
.newsletter p{color:#cfe3da; max-width:480px; margin:.8rem auto 1.6rem;}
.newsletter form{display:flex; max-width:420px; margin:0 auto; gap:.7rem;}
.newsletter input{flex:1; padding:.85rem 1.2rem; border-radius:100px; border:none; font-family:var(--font-body);}

/* ---------- Footer ---------- */
.site-footer{background:var(--coffee-2); color:#cdbfae; padding:5rem 0 0; margin-top:6rem;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:2.5rem; padding-bottom:3rem; border-bottom:1px solid rgba(248,245,240,.1);}
.footer-brand .brand{margin-bottom:1rem;}
.footer-brand p{font-size:.88rem; max-width:280px; color:#b3a594;}
.footer-col h4{color:var(--cream); font-size:.95rem; margin-bottom:1.2rem; font-family:var(--font-display);}
.footer-col ul{display:flex; flex-direction:column; gap:.7rem;}
.footer-col a{font-size:.86rem; color:#b3a594; transition:.3s;}
.footer-col a:hover{color:var(--gold-light);}
.social-row{display:flex; gap:.8rem; margin-top:1.2rem;}
.social-row a{width:38px; height:38px; border-radius:50%; background:rgba(248,245,240,.08); display:flex; align-items:center; justify-content:center;}
.social-row a:hover{background:var(--gold); color:var(--coffee-2);}
.footer-bottom{display:flex; justify-content:space-between; align-items:center; padding:1.6rem 0; font-size:.78rem; flex-wrap:wrap; gap:.8rem;}
.footer-tagline{font-family:var(--font-display); font-style:italic; color:var(--gold-light); text-align:center; padding:1.5rem 0; font-size:1.05rem;}

/* ---------- Utility / reveal animation ---------- */
.reveal{opacity:0; transform:translateY(34px); transition:opacity .8s var(--ease), transform .8s var(--ease);}
.reveal.in{opacity:1; transform:translateY(0);}
.fade-in{animation:fadeIn 1s var(--ease) both;}
@keyframes fadeIn{from{opacity:0; transform:translateY(20px);} to{opacity:1; transform:translateY(0);}}

.pad-section{padding:7rem 0;}
.bg-cream-dim{background:var(--cream-dim);}
.bg-coffee{background:var(--coffee); color:var(--cream);}
.bg-coffee h2, .bg-coffee h3, .bg-coffee h4{color:var(--cream);}
.room-card h4{color:var(--coffee);}


/* ---------- Responsive ---------- */
@media (max-width:1080px){
  .about-grid{grid-template-columns:1fr; gap:3rem;}
  .food-grid, .room-grid{grid-template-columns:repeat(2,1fr);}
  .event-grid{grid-template-columns:repeat(3,1fr);}
  .package-grid{grid-template-columns:1fr; max-width:480px; margin-inline:auto;}
  .package.featured{transform:none;}
  .calc-box{grid-template-columns:1fr;}
  .branch-grid{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .stats-strip{grid-template-columns:repeat(2,1fr); row-gap:2rem;}
  .stats-strip .stat:nth-child(2){border-right:none;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .masonry{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:760px){
  .main-nav, .nav-actions .lang-switch{display:none;}
  .burger{display:flex;}
  .food-grid, .room-grid{grid-template-columns:1fr;}
  .event-grid{grid-template-columns:repeat(2,1fr);}
  .form-row{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr; text-align:left;}
  .hero-stats{gap:1.6rem;}
  .compare-table{font-size:.78rem;}
  .concierge-panel{width:90vw; left:5vw;}
}