:root{
    --teal-950:#0F2626;
    --teal-900:#153434;
    --teal-800:#1E4646;
    --foam:#EDEAE0;
    --foam-dim:#C9C4B4;
    --amber:#C9812F;
    --amber-bright:#E6A34D;
    --moss:#63805F;
    --line:rgba(237,234,224,0.14);
    --radius:2px;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--teal-950);
    color:var(--foam);
    font-family:'Space Grotesk', sans-serif;
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,.display{
    font-family:'Fraunces', serif;
    font-weight:600;
    letter-spacing:-0.01em;
  }
  a{color:inherit;text-decoration:none;}
  img{max-width:100%;display:block;}
  .wrap{max-width:1120px;margin:0 auto;padding:0 28px;}

  /* subtle river current texture */
  .current-bg{
    position:fixed; inset:0; z-index:-1; pointer-events:none;
    background:
      radial-gradient(ellipse 900px 500px at 15% -10%, rgba(230,163,77,0.08), transparent 60%),
      radial-gradient(ellipse 700px 500px at 100% 20%, rgba(99,128,95,0.10), transparent 55%),
      var(--teal-950);
  }

  /* ===== NAV ===== */
  header{
    position:sticky; top:0; z-index:50;
    background:rgba(15,38,38,0.88);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
  }
  nav{
    display:flex; align-items:center; justify-content:space-between;
    padding:18px 0;
  }
  .logo{
    font-family:'Fraunces', serif;
    font-size:22px; font-weight:700;
    display:flex; align-items:baseline; gap:8px;
  }
  .logo .mark{color:var(--amber-bright); font-style:italic;}
  .nav-links{display:flex; gap:32px; font-size:14px; letter-spacing:0.02em;}
  .nav-links a{opacity:0.82; transition:opacity 0.2s;}
  .nav-links a:hover{opacity:1;}
  .nav-cta{
    background:var(--amber); color:var(--teal-950);
    padding:10px 20px; border-radius:var(--radius);
    font-weight:600; font-size:14px;
    border:1px solid var(--amber);
    transition:background 0.2s, transform 0.15s;
  }
  .nav-cta:hover{background:var(--amber-bright); transform:translateY(-1px);}
  .menu-toggle{display:none; background:none; border:none; color:var(--foam); font-size:26px; cursor:pointer;}

  @media (max-width:820px){
    .nav-links{
      position:absolute; top:100%; left:0; right:0;
      background:var(--teal-900); flex-direction:column; gap:0;
      border-bottom:1px solid var(--line);
      max-height:0; overflow:hidden; transition:max-height 0.3s ease;
    }
    .nav-links.open{max-height:320px;}
    .nav-links a{padding:16px 28px; border-bottom:1px solid var(--line); width:100%;}
    .menu-toggle{display:block;}
    .nav-cta{display:none;}
  }

  /* ===== HERO ===== */
  .hero{
    padding:110px 0 90px;
    position:relative;
    overflow:hidden;
  }
  .hero-grid{
    display:grid; grid-template-columns:1.1fr 0.9fr; gap:60px; align-items:center;
  }
  .eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    font-size:13px; letter-spacing:0.14em; text-transform:uppercase;
    color:var(--amber-bright); margin-bottom:22px;
  }
  .eyebrow::before{content:''; width:26px; height:1px; background:var(--amber-bright);}
  .hero h1{
    font-size:clamp(38px, 5.4vw, 68px);
    line-height:1.02;
    margin-bottom:26px;
  }
  .hero h1 em{color:var(--amber-bright); font-style:italic;}
  .hero p.lead{
    font-size:18px; color:var(--foam-dim); max-width:46ch; margin-bottom:36px;
  }
  .hero-actions{display:flex; gap:16px; flex-wrap:wrap;}
  .btn-primary{
    background:var(--amber); color:var(--teal-950); padding:15px 28px;
    font-weight:600; border-radius:var(--radius); border:1px solid var(--amber);
    transition:background 0.2s, transform 0.15s;
  }
  .btn-primary:hover{background:var(--amber-bright); transform:translateY(-1px);}
  .btn-ghost{
    padding:15px 28px; border:1px solid var(--line); border-radius:var(--radius);
    color:var(--foam); transition:border-color 0.2s, background 0.2s;
  }
  .btn-ghost:hover{border-color:var(--foam-dim); background:rgba(237,234,224,0.04);}

  /* tide panel — the signature element */
  .tide-panel{
    background:var(--teal-900);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:30px;
  }
  .tide-panel h3{font-size:14px; text-transform:uppercase; letter-spacing:0.1em; color:var(--foam-dim); font-family:'Space Grotesk',sans-serif; font-weight:600; margin-bottom:20px;}
  .tide-row{
    display:flex; align-items:center; justify-content:space-between;
    padding:13px 0; border-bottom:1px solid var(--line);
    font-size:15px;
  }
  .tide-row:last-child{border-bottom:none;}
  .tide-row .status{
    font-size:12px; padding:4px 10px; border-radius:20px; letter-spacing:0.03em;
  }
  .status.open{background:rgba(99,128,95,0.25); color:#9CC496;}
  .status.closed{background:rgba(237,234,224,0.08); color:var(--foam-dim);}
  .tide-note{margin-top:18px; font-size:13px; color:var(--foam-dim); line-height:1.5;}

  /* ===== SECTION HEADERS ===== */
  .section{padding:90px 0;}
  .section-head{
    display:flex; justify-content:space-between; align-items:flex-end;
    gap:24px; margin-bottom:52px; flex-wrap:wrap;
    border-bottom:1px solid var(--line); padding-bottom:24px;
  }
  .section-head h2{font-size:clamp(30px,3.6vw,42px);}
  .section-head p{color:var(--foam-dim); max-width:38ch; font-size:15px;}

  /* ===== MENU ===== */
  .menu-tabs{display:flex; gap:10px; margin-bottom:40px; flex-wrap:wrap;}
  .menu-tab{
    padding:9px 18px; border:1px solid var(--line); border-radius:20px;
    font-size:13px; letter-spacing:0.03em; color:var(--foam-dim);
    cursor:pointer; background:none; transition:all 0.2s; font-family:inherit;
  }
  .menu-tab.active, .menu-tab:hover{border-color:var(--amber-bright); color:var(--amber-bright);}

  .menu-category{display:none;}
  .menu-category.active{display:block;}
  .menu-list{display:grid; grid-template-columns:1fr 1fr; gap:0 48px;}
  .menu-item{
    display:flex; align-items:flex-start; justify-content:space-between; gap:16px;
    padding:22px 0; border-bottom:1px solid var(--line);
  }
  .menu-item-photo{
    flex:none; width:64px; height:64px; border-radius:var(--radius);
    background:var(--teal-900); border:1px solid var(--line);
    display:flex; align-items:center; justify-content:center; overflow:hidden;
  }
  .menu-item-photo img{width:100%; height:100%; object-fit:cover;}
  .menu-item-photo svg{width:28px; height:28px; color:var(--amber-bright); opacity:0.85;}
  .menu-item-body{flex:1; min-width:0;}
  .menu-item-name{font-family:'Fraunces',serif; font-weight:600; font-size:18px; margin-bottom:6px;}
  .menu-item-desc{font-size:14px; color:var(--foam-dim); max-width:34ch;}
  .menu-item-price{font-family:'Fraunces',serif; font-weight:600; font-size:17px; color:var(--amber-bright); white-space:nowrap; flex:none;}
  @media (max-width:720px){.menu-list{grid-template-columns:1fr;}}

  /* ===== ABOUT / STRIP ===== */
  .strip{
    background:var(--teal-900); border-top:1px solid var(--line); border-bottom:1px solid var(--line);
    padding:70px 0;
  }
  .strip-grid{display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center;}
  .strip h2{font-size:clamp(26px,3vw,34px); margin-bottom:20px;}
  .strip p{color:var(--foam-dim); margin-bottom:16px; max-width:48ch;}
  .stat-row{display:flex; gap:40px; margin-top:28px;}
  .stat b{display:block; font-family:'Fraunces',serif; font-size:30px; color:var(--amber-bright);}
  .stat span{font-size:13px; color:var(--foam-dim);}
  @media (max-width:820px){.strip-grid{grid-template-columns:1fr;}}

  .river-line{
    width:100%; height:60px;
  }

  /* ===== ORDER STEPS ===== */
  .steps{display:grid; grid-template-columns:repeat(3,1fr); gap:32px;}
  .step{border-top:1px solid var(--line); padding-top:20px;}
  .step .num{font-family:'Fraunces',serif; font-size:14px; color:var(--amber-bright); margin-bottom:14px; display:block;}
  .step h3{font-size:19px; margin-bottom:10px;}
  .step p{font-size:14px; color:var(--foam-dim);}
  @media (max-width:720px){.steps{grid-template-columns:1fr;}}

  /* ===== LOCATIONS ===== */
  .locations{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
  .loc-card{
    background:var(--teal-900); border:1px solid var(--line); border-radius:var(--radius);
    padding:26px;
  }
  .loc-card h3{font-size:19px; margin-bottom:10px;}
  .loc-card p{font-size:14px; color:var(--foam-dim); margin-bottom:4px;}
  .loc-card .tag{
    display:inline-block; margin-top:14px; font-size:12px; color:var(--moss);
    border:1px solid rgba(99,128,95,0.4); padding:4px 10px; border-radius:20px;
  }
  @media (max-width:820px){.locations{grid-template-columns:1fr;}}

  /* ===== FOOTER ===== */
  footer{border-top:1px solid var(--line); padding:56px 0 40px;}
  .footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; margin-bottom:40px;}
  footer h4{font-size:13px; text-transform:uppercase; letter-spacing:0.08em; color:var(--foam-dim); margin-bottom:16px;}
  footer a, footer p{font-size:14px; color:var(--foam-dim);}
  footer .flinks{display:flex; flex-direction:column; gap:10px;}
  footer .flinks a:hover{color:var(--amber-bright);}
  .footer-bottom{
    border-top:1px solid var(--line); padding-top:24px;
    display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
    font-size:13px; color:var(--foam-dim);
  }
  @media (max-width:720px){.footer-grid{grid-template-columns:1fr; gap:28px;}}

  /* ===== SOCIAL ===== */
  .social{
    background:var(--teal-900); border-top:1px solid var(--line); border-bottom:1px solid var(--line);
    padding:70px 0;
  }
  .social-head{
    display:flex; justify-content:space-between; align-items:flex-end;
    gap:24px; margin-bottom:40px; flex-wrap:wrap;
  }
  .social-head h2{font-size:clamp(28px,3.2vw,36px);}
  .social-head p{color:var(--foam-dim); max-width:38ch; font-size:15px;}
  .social-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
  .social-card{
    display:flex; flex-direction:column; gap:16px;
    background:var(--teal-950); border:1px solid var(--line); border-radius:var(--radius);
    padding:24px; transition:border-color 0.2s, transform 0.15s;
  }
  .social-card:hover{border-color:var(--amber-bright); transform:translateY(-2px);}
  .social-card .icon{
    width:38px; height:38px; display:flex; align-items:center; justify-content:center;
    border:1px solid var(--line); border-radius:50%; color:var(--amber-bright);
  }
  .social-card .icon svg{width:18px; height:18px;}
  .social-card .handle{font-family:'Fraunces',serif; font-weight:600; font-size:17px;}
  .social-card .platform{font-size:12px; letter-spacing:0.06em; text-transform:uppercase; color:var(--foam-dim);}
  @media (max-width:820px){.social-grid{grid-template-columns:1fr 1fr;}}
  @media (max-width:520px){.social-grid{grid-template-columns:1fr;}}

  ::selection{background:var(--amber); color:var(--teal-950);}
  :focus-visible{outline:2px solid var(--amber-bright); outline-offset:2px;}
  @media (prefers-reduced-motion: reduce){*{transition:none !important; scroll-behavior:auto !important;}}
