:root{
    --ivory:#FBF6EC;
    --cream-card:#FFFDF9;
    --maroon:#6E1E2B;
    --maroon-dark:#4A121C;
    --gold:#C79A3C;
    --gold-light:#E9CD8E;
    --espresso:#2E1B12;
    --blush:#F3DCC7;
    --ink:#3A2419;
    --shadow: 0 20px 40px -20px rgba(74,18,28,0.25);
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--ivory);
    color:var(--ink);
    font-family:'Manrope', sans-serif;
    line-height:1.6;
    overflow-x:hidden;
  }
  h1,h2,h3,h4{
    font-family:'Fraunces', serif;
    color:var(--maroon-dark);
    font-weight:600;
    line-height:1.1;
  }
  a{color:inherit; text-decoration:none;}
  img{max-width:100%; display:block;}
  .eyebrow{
    font-family:'Manrope', sans-serif;
    font-weight:700;
    font-size:0.72rem;
    letter-spacing:0.22em;
    text-transform:uppercase;
    color:var(--maroon);
    display:flex;
    align-items:center;
    gap:10px;
  }
  .eyebrow::before{
    content:'';
    width:22px; height:1px;
    background:var(--gold);
  }
  .container{
    max-width:1180px;
    margin:0 auto;
    padding:0 32px;
  }
  section{padding:100px 0;}
  @media(max-width:640px){ section{padding:64px 0;} .container{padding:0 20px;} }

  /* ---------- reveal on scroll ---------- */
  .reveal{opacity:0; transform:translateY(28px); transition:opacity .8s ease, transform .8s ease;}
  .reveal.in{opacity:1; transform:translateY(0);}

  /* ---------- header ---------- */
  header{
    position:sticky; top:0; z-index:100;
    background:rgba(251,246,236,0.9);
    backdrop-filter:blur(10px);
    border-bottom:1px solid rgba(199,154,60,0.25);
    transition:box-shadow .3s ease;
  }
  header.scrolled{ box-shadow:0 4px 24px rgba(74,18,28,0.08); }
  .nav-wrap{
    max-width:1180px; margin:0 auto; padding:16px 32px;
    display:flex; align-items:center; justify-content:space-between;
  }
  .brand{ display:flex; align-items:center; gap:10px; }
  .brand-mark{ width:38px; height:38px; }
  .brand-name{ font-family:'Fraunces', serif; font-weight:700; font-size:1.25rem; color:var(--maroon-dark); letter-spacing:0.01em; }
  .brand-name span{ display:block; font-family:'Manrope',sans-serif; font-weight:600; font-size:0.6rem; letter-spacing:0.28em; color:var(--gold); text-transform:uppercase; margin-top:1px;}
  nav.links{ display:flex; gap:38px; }
  nav.links a{
    font-size:0.82rem; font-weight:600; letter-spacing:0.03em;
    color:var(--ink); position:relative; padding:4px 0;
  }
  nav.links a::after{
    content:''; position:absolute; left:0; bottom:0; width:0; height:1.5px;
    background:var(--gold); transition:width .3s ease;
  }
  nav.links a:hover::after{ width:100%; }
  .header-actions{ display:flex; align-items:center; gap:14px; }
  .icon-btn{
    width:38px; height:38px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    border:1px solid rgba(199,154,60,0.4);
    color:var(--maroon-dark);
    transition:all .25s ease;
  }
  .icon-btn:hover{ background:var(--maroon-dark); color:var(--gold-light); border-color:var(--maroon-dark); transform:translateY(-2px); }
  .btn-primary{
    background:var(--maroon-dark); color:var(--ivory);
    padding:12px 24px; border-radius:30px;
    font-size:0.82rem; font-weight:700; letter-spacing:0.02em;
    display:inline-flex; align-items:center; gap:8px;
    box-shadow:var(--shadow);
    transition:transform .25s ease, background .25s ease;
    border:1px solid var(--maroon-dark);
  }
  .btn-primary:hover{ transform:translateY(-3px); background:#3A0D16; }
  .btn-outline{
    padding:12px 24px; border-radius:30px;
    font-size:0.82rem; font-weight:700; letter-spacing:0.02em;
    display:inline-flex; align-items:center; gap:8px;
    border:1.5px solid var(--maroon-dark); color:var(--maroon-dark);
    transition:all .25s ease;
  }
  .btn-outline:hover{ background:var(--maroon-dark); color:var(--ivory); }
  .mobile-toggle{ display:none; }

  /* ---------- hero ---------- */
  .hero{
    position:relative;
    padding:88px 0 60px;
    overflow:hidden;
  }
  .hero-grid{
    display:grid; grid-template-columns:1.05fr 0.95fr; gap:60px; align-items:center;
  }
  .hero h1{
    font-size:clamp(2.6rem, 5vw, 4rem);
    margin:18px 0 22px;
    letter-spacing:-0.01em;
  }
  .hero h1 em{ font-style:italic; color:var(--maroon); font-weight:500; }
  .hero p.lead{
    font-size:1.05rem; color:#5b463c; max-width:460px; margin-bottom:32px;
  }
  .hero-cta{ display:flex; gap:16px; flex-wrap:wrap; margin-bottom:36px; }
  .hero-meta{
    display:flex; gap:28px; flex-wrap:wrap;
  }
  .hero-meta .item{ display:flex; align-items:center; gap:10px; }
  .hero-meta .item svg{ width:20px; height:20px; color:var(--gold); flex-shrink:0; }
  .hero-meta .item .label{ font-size:0.7rem; text-transform:uppercase; letter-spacing:0.1em; color:#8a6f5f; font-weight:700;}
  .hero-meta .item .val{ font-size:0.9rem; font-weight:700; color:var(--maroon-dark); }

  .hero-art{
    position:relative;
    display:flex; align-items:center; justify-content:center;
    height:480px;
  }
  .plate{
    position:absolute;
    border-radius:50%;
    background:var(--cream-card);
    box-shadow:0 30px 60px -20px rgba(74,18,28,0.3), inset 0 0 0 1px rgba(199,154,60,0.25);
  }
  .plate.p1{ width:340px; height:340px; }
  .plate.p2{ width:340px; height:340px; border:1px dashed rgba(199,154,60,0.5); background:transparent; box-shadow:none; animation:spin 40s linear infinite; }
  @keyframes spin{ to{ transform:rotate(360deg);} }
  .crown-hero{ width:150px; height:150px; position:relative; z-index:2; filter:drop-shadow(0 12px 20px rgba(74,18,28,0.25)); }
  .crumb{
    position:absolute; border-radius:50%; background:var(--gold-light); opacity:0.7;
  }
  .badge-float{
    position:absolute; top:14%; right:2%;
    background:var(--maroon-dark); color:var(--gold-light);
    padding:14px 18px; border-radius:16px;
    font-family:'Fraunces', serif; font-size:0.85rem; font-weight:600;
    box-shadow:var(--shadow);
    display:flex; flex-direction:column; align-items:center; text-align:center;
    animation:float 5s ease-in-out infinite;
  }
  .badge-float b{ font-size:1.5rem; display:block; color:var(--gold-light); }
  @keyframes float{ 0%,100%{transform:translateY(0);} 50%{transform:translateY(-12px);} }

  @media(max-width:900px){
    .hero-grid{ grid-template-columns:1fr; }
    .hero-art{ height:340px; order:-1; }
    nav.links, .header-actions .btn-primary{ display:none; }
  }

  /* ---------- section titles ---------- */
  .section-head{ max-width:600px; margin-bottom:56px; }
  .section-head h2{ font-size:clamp(2rem,3.2vw,2.7rem); margin-top:14px; }
  .section-head p{ color:#5b463c; margin-top:14px; font-size:1rem; }
  .center{ text-align:center; margin-left:auto; margin-right:auto; }
  .center .eyebrow{ justify-content:center; }
  .center .eyebrow::before{ display:none; }

  /* ---------- about ---------- */
  .about{ background:var(--maroon-dark); color:var(--blush); position:relative; }
  .about .container{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:70px; align-items:center; }
  .about h2{ color:var(--ivory); }
  .about .eyebrow{ color:var(--gold-light); }
  .about .eyebrow::before{ background:var(--gold-light); }
  .about p{ color:#E6CFC0; font-size:1.02rem; margin-top:20px; max-width:520px; }
  .about-quote{
    font-family:'Fraunces', serif; font-style:italic; font-size:1.6rem; color:var(--gold-light);
    border-left:2px solid var(--gold); padding-left:26px; line-height:1.4;
  }
  .stat-row{ display:flex; gap:44px; margin-top:36px; }
  .stat-row .n{ font-family:'Fraunces', serif; font-size:2.1rem; color:var(--gold-light); font-weight:600; }
  .stat-row .l{ font-size:0.72rem; text-transform:uppercase; letter-spacing:0.08em; color:#C9A98F; margin-top:4px;}
  @media(max-width:900px){ .about .container{ grid-template-columns:1fr; gap:40px; } }

  /* ---------- specialties ---------- */
  .cards{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
  @media(max-width:1000px){ .cards{ grid-template-columns:repeat(2,1fr);} }
  @media(max-width:560px){ .cards{ grid-template-columns:1fr;} }
  .card{
    background:var(--cream-card);
    border-radius:4px 4px 60px 4px;
    padding:38px 28px;
    box-shadow:0 14px 30px -18px rgba(74,18,28,0.2);
    border:1px solid rgba(199,154,60,0.2);
    transition:transform .35s ease, box-shadow .35s ease;
    position:relative;
  }
  .card:hover{ transform:translateY(-10px); box-shadow:0 24px 40px -18px rgba(74,18,28,0.3); }
  .card .ic{
    width:56px; height:56px; border-radius:50%;
    background:var(--blush); display:flex; align-items:center; justify-content:center;
    margin-bottom:22px;
  }
  .card .ic svg{ width:28px; height:28px; color:var(--maroon-dark); }
  .card h3{ font-size:1.2rem; margin-bottom:10px; }
  .card p{ font-size:0.9rem; color:#6b5548; }
  .card .tag{
    position:absolute; top:24px; right:24px; font-size:0.65rem; letter-spacing:0.1em;
    text-transform:uppercase; color:var(--gold); font-weight:800;
  }

  /* ---------- menu ---------- */
  .menu-section{ background:var(--blush); }
  .menu-cols{ display:grid; grid-template-columns:1fr 1fr; gap:60px; }
  @media(max-width:800px){ .menu-cols{ grid-template-columns:1fr; gap:40px; } }
  .menu-col h3{
    font-size:1rem; text-transform:uppercase; letter-spacing:0.12em;
    color:var(--maroon); margin-bottom:22px; display:flex; align-items:center; gap:12px;
  }
  .menu-col h3::after{ content:''; flex:1; height:1px; background:rgba(110,30,43,0.25); }
  .menu-item{
    display:flex; justify-content:space-between; align-items:center; gap:14px;
    padding:16px 0; border-bottom:1px dashed rgba(74,18,28,0.18);
  }
  .menu-item .left{ display:flex; align-items:center; gap:16px; }
  .menu-thumb{
    width:56px; height:56px; border-radius:12px; flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
    box-shadow:inset 0 0 0 1px rgba(74,18,28,0.1);
  }
  .menu-thumb svg{ width:26px; height:26px; }
  .menu-item .name{ font-family:'Fraunces', serif; font-weight:600; font-size:1.05rem; color:var(--maroon-dark); }
  .menu-item .desc{ font-size:0.82rem; color:#6b5548; margin-top:3px; }
  .menu-item .price{ font-family:'Fraunces', serif; font-weight:600; color:var(--maroon); white-space:nowrap; text-align:right; }
  .menu-item .price small{ display:block; font-family:'Manrope',sans-serif; font-weight:600; font-size:0.6rem; letter-spacing:0.06em; text-transform:uppercase; color:#a1806b; }
  .menu-note{ margin-top:34px; text-align:center; font-size:0.9rem; color:#6b5548; }
  .menu-note a{ color:var(--maroon-dark); font-weight:700; border-bottom:1.5px solid var(--gold); }
  .price-disclaimer{ text-align:center; font-size:0.72rem; color:#9c8267; margin-top:8px; letter-spacing:0.02em; }

  /* ---------- gallery ---------- */
  .gallery-grid{
    display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:130px; gap:16px;
  }
  @media(max-width:800px){ .gallery-grid{ grid-template-columns:repeat(2,1fr); } }
  .g-tile{
    border-radius:14px; position:relative; overflow:hidden;
    display:flex; align-items:flex-end; padding:16px;
    color:var(--ivory); font-family:'Fraunces', serif; font-weight:600; font-size:0.95rem;
    background-size:cover; background-position:center;
    transition:transform .4s ease;
  }
  .g-tile:hover{ transform:scale(1.03); }
  .g-tile::before{
    content:''; position:absolute; inset:0;
    background:linear-gradient(180deg, transparent 30%, rgba(30,15,10,0.88));
  }
  .g-tile .g-icon{
    position:absolute; top:16px; right:16px; z-index:1; opacity:0.85;
    width:30px; height:30px;
  }
  .g-tile .g-icon svg{ width:100%; height:100%; color:rgba(255,255,255,0.85); }
  .g-tile span{ position:relative; z-index:1; }
  .g-tile.tall{ grid-row:span 2; }
  .g1{ background-image:url('https://images.unsplash.com/photo-1702925614886-50ad13c88d3f?auto=format&fit=crop&w=800&q=80'); }
  .g2{ background-image:url('https://images.unsplash.com/photo-1571115177098-24ec42ed204d?auto=format&fit=crop&w=800&q=80'); }
  .g3{ background-image:url('https://images.unsplash.com/photo-1623334044303-241021148842?auto=format&fit=crop&w=800&q=80'); }
  .g4{ background-image:url('https://images.unsplash.com/photo-1600803907087-f56d462fd26b?auto=format&fit=crop&w=800&q=80'); }
  .g5{ background-image:url('https://images.unsplash.com/photo-1541167760496-1628856ab772?auto=format&fit=crop&w=800&q=80'); }
  .g6{ background-image:url('https://images.unsplash.com/photo-1534422298391-e4f8c172dddb?auto=format&fit=crop&w=800&q=80'); }
  .g7{ background-image:url('https://images.unsplash.com/photo-1643944471768-2d2eac3afb6d?auto=format&fit=crop&w=800&q=80'); }
  .g8{ background-image:url('https://images.unsplash.com/photo-1621303837174-89787a7d4729?auto=format&fit=crop&w=800&q=80'); }

  /* ---------- testimonials ---------- */
  .testi-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
  @media(max-width:900px){ .testi-row{ grid-template-columns:1fr; } }
  .testi{
    background:var(--cream-card); padding:32px; border-radius:16px;
    border:1px solid rgba(199,154,60,0.25); box-shadow:0 14px 30px -20px rgba(74,18,28,0.2);
  }
  .testi .stars{ color:var(--gold); font-size:0.9rem; letter-spacing:2px; margin-bottom:14px; }
  .testi p{ font-size:0.95rem; color:#5b463c; font-style:italic; }
  .testi .who{ margin-top:18px; font-weight:700; font-size:0.85rem; color:var(--maroon-dark); }

  /* ---------- contact ---------- */
  .contact{ background:var(--maroon-dark); color:var(--ivory); }
  .contact .eyebrow{ color:var(--gold-light); }
  .contact .eyebrow::before{ background:var(--gold-light); }
  .contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start; }
  @media(max-width:900px){ .contact-grid{ grid-template-columns:1fr; gap:40px; } }
  .contact h2{ color:var(--ivory); }
  .contact-list{ margin-top:30px; display:flex; flex-direction:column; gap:24px; }
  .contact-list .row{ display:flex; gap:16px; align-items:flex-start; }
  .contact-list .ic{
    width:44px; height:44px; border-radius:50%; background:rgba(233,205,142,0.12);
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
  }
  .contact-list .ic svg{ width:20px; height:20px; color:var(--gold-light); }
  .contact-list .t{ font-size:0.72rem; text-transform:uppercase; letter-spacing:0.1em; color:#C9A98F; }
  .contact-list .v{ font-size:1rem; font-weight:600; margin-top:2px; }
  .contact-list .v a:hover{ color:var(--gold-light); }
  .contact-cta{ display:flex; gap:14px; margin-top:34px; flex-wrap:wrap; }
  .map-wrap{
    border-radius:18px; overflow:hidden; border:1px solid rgba(233,205,142,0.3);
    box-shadow:0 30px 50px -20px rgba(0,0,0,0.5); height:420px;
  }
  .map-wrap iframe{ width:100%; height:100%; border:0; filter:saturate(0.85) contrast(1.05); }

  /* ---------- footer ---------- */
  footer{ background:var(--espresso); color:#C9A98F; padding:60px 0 26px; }
  .footer-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:50px; padding-bottom:40px; border-bottom:1px solid rgba(233,205,142,0.15); }
  @media(max-width:800px){ .footer-top{ grid-template-columns:1fr; gap:34px; } }
  .footer-brand{ display:flex; align-items:center; gap:10px; margin-bottom:14px; }
  .footer-brand .brand-name{ color:var(--ivory); }
  footer h4{ color:var(--ivory); font-size:0.78rem; text-transform:uppercase; letter-spacing:0.12em; margin-bottom:18px; font-family:'Manrope',sans-serif; font-weight:700;}
  footer ul{ list-style:none; display:flex; flex-direction:column; gap:12px; }
  footer ul li a{ font-size:0.9rem; transition:color .2s ease; }
  footer ul li a:hover{ color:var(--gold-light); }
  .footer-socials{ display:flex; gap:12px; margin-top:18px; }
  .bottom-bar{
    display:flex; justify-content:space-between; align-items:center; padding-top:26px;
    font-size:0.8rem; flex-wrap:wrap; gap:10px;
  }

  /* ---------- floating whatsapp ---------- */
  .wa-float{
    position:fixed; bottom:26px; right:26px; z-index:200;
    width:60px; height:60px; border-radius:50%;
    background:#25D366; display:flex; align-items:center; justify-content:center;
    box-shadow:0 14px 30px -10px rgba(0,0,0,0.4);
    animation:pulse 2.4s ease-in-out infinite;
  }
  .wa-float svg{ width:30px; height:30px; color:#fff; }
  @keyframes pulse{
    0%,100%{ box-shadow:0 14px 30px -10px rgba(37,211,102,0.6); }
    50%{ box-shadow:0 14px 30px -10px rgba(37,211,102,1), 0 0 0 10px rgba(37,211,102,0.15); }
  }

  ::selection{ background:var(--gold-light); color:var(--maroon-dark); }
