/*
Theme Name: Lee Do
Theme URI: https://leedorestaurant.com
Author: Lee Do Restaurant
Author URI: https://leedorestaurant.com
Description: Custom theme for Lee Do — a three-generation Hock Chew (Fuzhou) restaurant in Singapore. Oriental-modern, maroon & cream. Staging build generated from the approved HTML prototype.
Version: 1.0.0
Requires at least: 5.9
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: leedo
*/

:root{
    --maroon:#7A1F2B; --maroon-2:#6C1824; --wine:#531420; --wine-deep:#3E0E17;
    --gold:#C9A24B; --gold-2:#B0872F; --gold-soft:#E6D09A;
    --ivory:#F7F1E4; --cream:#FCF8EF; --paper:#F1E5D0;
    --ink:#33261F; --ink-soft:#6E5D52;
    --line:rgba(122,31,43,.16);
    --shadow:0 22px 48px -26px rgba(83,20,32,.55);
    --maxw:1210px;
    --fd:'Cormorant Garamond',Georgia,'Times New Roman',serif;
    --fb:'Work Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    --fc:'Noto Serif SC','Cormorant Garamond',serif;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{font-family:var(--fb);color:var(--ink);background:var(--cream);line-height:1.72;-webkit-font-smoothing:antialiased;overflow-x:hidden}
  h1,h2,h3,h4{font-family:var(--fd);font-weight:600;line-height:1.1;letter-spacing:.008em;color:var(--maroon)}
  a{color:inherit;text-decoration:none}
  img{max-width:100%;display:block}
  section{scroll-margin-top:118px}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 26px}

  /* ---------- Reusable bits ---------- */
  .eyebrow{font-family:var(--fb);font-weight:600;text-transform:uppercase;letter-spacing:.26em;font-size:.72rem;color:var(--gold-2)}
  .eyebrow .cn{font-family:var(--fc);letter-spacing:.14em;color:var(--maroon);margin-right:.55em;font-size:.9rem;font-weight:600}
  .rule{display:flex;align-items:center;justify-content:center;gap:14px;margin:16px 0 4px}
  .rule.left{justify-content:flex-start}
  .rule span{height:1px;width:64px;background:linear-gradient(90deg,transparent,var(--gold))}
  .rule.left span:last-child,.rule span:last-child{background:linear-gradient(90deg,var(--gold),transparent)}
  .rule svg{flex:0 0 auto}
  .btn{display:inline-flex;align-items:center;gap:.6em;font-family:var(--fb);font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:.76rem;padding:15px 32px;border-radius:2px;border:1.5px solid transparent;cursor:pointer;transition:.25s ease;white-space:nowrap}
  .btn-gold{background:var(--gold);color:var(--wine);border-color:var(--gold)}
  .btn-gold:hover{background:var(--gold-2);border-color:var(--gold-2);transform:translateY(-2px)}
  .btn-maroon{background:var(--maroon);color:var(--cream);border-color:var(--maroon)}
  .btn-maroon:hover{background:var(--wine);border-color:var(--wine);transform:translateY(-2px)}
  .btn-ghost{background:transparent;color:var(--cream);border-color:rgba(230,208,154,.6)}
  .btn-ghost:hover{border-color:var(--gold);color:var(--gold-soft)}
  .btn-outline{background:transparent;color:var(--maroon);border-color:var(--maroon)}
  .btn-outline:hover{background:var(--maroon);color:var(--cream)}
  .center{text-align:center}
  .sec{padding:clamp(60px,8.5vw,116px) 0}

  /* reveal animation */
  .js .reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s ease}
  .js .reveal.in{opacity:1;transform:none}
  @media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none;transition:none}}

  /* ---------- Utility top bar ---------- */
  .util{background:var(--wine-deep);color:var(--gold-soft);font-size:.76rem;letter-spacing:.04em}
  .util .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;height:38px}
  .util .u-item{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
  .util a{color:var(--gold-soft)}
  .util a:hover{color:#fff}
  .util svg{width:14px;height:14px;stroke:var(--gold);fill:none;stroke-width:1.6}
  @media (max-width:820px){.util{display:none}}

  /* ---------- Header ---------- */
  header.nav{position:sticky;top:0;z-index:60;background:var(--ivory);border-bottom:1px solid var(--line);transition:box-shadow .3s,padding .3s}
  header.nav.scrolled{box-shadow:0 10px 30px -18px rgba(83,20,32,.5)}
  .nav .wrap{display:flex;align-items:center;justify-content:space-between;height:84px;transition:height .3s}
  header.nav.scrolled .wrap{height:70px}
  .brand{display:flex;align-items:center;gap:12px}
  .brand img{height:58px;width:auto;transition:height .3s}
  header.nav.scrolled .brand img{height:48px}
  .brand .bt{font-family:var(--fd);font-weight:700;font-size:1.34rem;color:var(--maroon);line-height:1;letter-spacing:.06em}
  .brand .bt small{display:block;font-family:var(--fb);font-weight:500;font-size:.58rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-2);margin-top:4px}
  @media(max-width:520px){.brand .bt{display:none}}
  nav.menu{display:flex;align-items:center;gap:20px}
  nav.menu .btn{padding:12px 22px;font-size:.72rem}
  nav.menu .btn-outline{border-width:1.5px}
  nav.menu a.link{font-family:var(--fb);font-weight:500;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);position:relative;padding:4px 0}
  nav.menu a.link::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:1.5px;background:var(--gold);transition:width .25s}
  nav.menu a.link:hover{color:var(--maroon)}
  nav.menu a.link:hover::after{width:100%}
  .burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
  .burger span{width:26px;height:2px;background:var(--maroon);transition:.3s}
  @media(max-width:1024px){
    nav.menu .link{display:none}
    nav.menu .nav-order{display:none}
    .burger{display:flex}
  }
  /* mobile drawer */
  .drawer{position:fixed;inset:0 0 0 auto;width:min(84vw,340px);background:var(--maroon);color:var(--cream);transform:translateX(100%);transition:transform .35s ease;z-index:80;padding:26px 28px;display:flex;flex-direction:column;gap:6px;box-shadow:var(--shadow)}
  .drawer.open{transform:none}
  .drawer .close{align-self:flex-end;background:none;border:0;color:var(--gold-soft);font-size:1.8rem;cursor:pointer;line-height:1}
  .drawer a{font-family:var(--fd);font-size:1.32rem;color:var(--cream);padding:11px 0;border-bottom:1px solid rgba(230,208,154,.16)}
  .drawer a:hover{color:var(--gold-soft)}
  .drawer .btn{margin-top:16px;justify-content:center}
  .scrim{position:fixed;inset:0;background:rgba(62,14,23,.55);opacity:0;visibility:hidden;transition:.35s;z-index:70}
  .scrim.open{opacity:1;visibility:visible}

  /* ---------- Hero ---------- */
  .hero{position:relative;min-height:90vh;display:flex;align-items:center;color:var(--cream);text-align:center;overflow:hidden}
  .hero-bg{position:absolute;inset:0;background:url('assets/hero-cold-crab.jpg') center/cover no-repeat;transform:scale(1.06)}
  .hero-veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(83,20,32,.78),rgba(62,14,23,.72) 55%,rgba(62,14,23,.9))}
