:root{
      --bg:#fbf6ee;
      --card:#fffdf9;
      --accent:#d8c7b0;
      --accent-2:#cdb89f;
      --text:#3b332b;
      --muted:#70655a;
      --radius:14px;
      --max-width:1200px;

      
    }
    *{box-sizing:border-box}
    html,body{height:100%;margin:0;padding:0}
    body{
      font-family:'Noto Sans JP', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
      background:var(--bg);
      color:var(--text);
      line-height:1.65;
      -webkit-font-smoothing:antialiased;
      -moz-osx-font-smoothing:grayscale;
    }
    .container{max-width:var(--max-width);margin:0 auto;padding:28px}
    header{position:fixed;top:12px;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:12px 28px;color:#fff}
    .brand{display:flex;align-items:center;gap:12px}
    .logo{width:56px;height:56px;border-radius:10px;background:linear-gradient(180deg,var(--accent),var(--accent-2));display:flex;align-items:center;justify-content:center;font-family:'Playfair Display';font-weight:700;color:var(--card)}
    nav{display:flex;gap:18px}
    nav a{color:#fff;text-decoration:none;font-weight:600}

    /* HERO (full-screen, large image, overlay text) */
    .hero{position:relative;width:100%;height:100vh;overflow:hidden}
    .hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.06);animation:kenburns 20s ease-in-out infinite alternate}
    @keyframes kenburns{from{transform:scale(1.06) translateY(0)}to{transform:scale(1.12) translateY(-6px)}}
    .hero-overlay{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;height:100%;padding:80px 10vw;color:var(--card)}
    .hero-overlay h2{font-family:'Playfair Display';font-size:56px;margin:0 0 12px;text-shadow:0 10px 30px rgba(20,18,16,0.5)}
    .hero-overlay p{font-size:20px;max-width:680px;color:rgba(255,255,255,0.95);margin:0 0 18px}
    .cta{display:inline-block;background:rgba(255,255,255,0.95);color:var(--text);padding:12px 20px;border-radius:12px;text-decoration:none;font-weight:700}

    /* PROMO + BIG GALLERY with organic clipped images and centered heading */
    .promo-wrap{position:relative;width:100vw;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;background:linear-gradient(180deg, var(--bg), #fff);padding:60px 0 80px}
    .promo-inner{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:1fr 560px 1fr;align-items:center;gap:20px;padding:0 28px}

    .blob{width:100%;height:420px;border-radius:20px;overflow:hidden;box-shadow:0 18px 40px rgba(60,45,30,0.06);transform:translateY(0);animation:float 6s ease-in-out infinite}
    .blob.left{clip-path:polygon(10% 0%,100% 0%,92% 45%,100% 100%,8% 100%,0% 55%);}
    .blob.right{clip-path:polygon(0% 0%,90% 0%,100% 55%,92% 100%,0% 100%,8% 45%);}
    .blob img{width:100%;height:100%;object-fit:cover}
    @keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-8px)}100%{transform:translateY(0)}}

    /* Center heading (seasonal) */
    .promo-center{display:flex;flex-direction:column;align-items:center;text-align:center;padding:28px;background:transparent}
    .promo-center h2{font-family:'Playfair Display';font-size:28px;margin:0 0 10px;color:var(--text)}
    .promo-center .lead{color:var(--muted);max-width:520px;margin-bottom:20px}
    .ribbon{background:linear-gradient(90deg,#f6efe4,#fff);padding:10px 18px;border-radius:999px;border:1px solid rgba(60,45,30,0.04);font-weight:700;color:var(--text)}

    /* MENU area styled like attached image: central title, three-column menu list */
    .menu-full{width:100vw;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;padding:60px 0;background:linear-gradient(180deg,#fff,#fbf6ee)}
    .menu-inner{max-width:1200px;margin:0 auto;padding:0 28px}
    .menu-header{display:flex;flex-direction:column;align-items:center;margin-bottom:28px}
    .menu-header h3{font-family:'Playfair Display';font-size:22px;margin:0 0 8px}
    .menu-columns{display:grid;grid-template-columns:1fr 1fr 1fr;gap:28px;text-align:left}
    .menu-columns ul{list-style:none;padding:0;margin:0}
    .menu-columns li{padding:8px 0;border-bottom:1px dashed rgba(60,45,30,0.04);display:flex;justify-content:space-between;align-items:center}
    .menu-columns li .item{font-weight:700}
    .menu-columns li .price{color:var(--muted)}

    /* Enlarge gallery images elsewhere */
    .promo img, .menu-item img{height:220px}
    .menu-item img{border-radius:12px}



    
    /* Sections */
    section{margin:28px 0}
    footer{margin-top:36px;padding:24px 0;border-top:1px solid rgba(80,70,60,0.06);color:var(--muted)}
    .grid-2{display:grid;grid-template-columns:1fr 320px;gap:22px}
    .map{background:linear-gradient(180deg,var(--card),#fff);border-radius:12px;padding:14px}
    form{display:grid;gap:8px}
    input[type="text"], input[type="email"], textarea, select{
      width:100%;padding:10px;border:1px solid #eee;border-radius:8px;background:transparent;color:var(--text)
    }
    button{background:var(--accent);border:none;padding:10px 14px;border-radius:10px;font-weight:700;color:var(--card);cursor:pointer}
    /* Responsive */
    @media (max-width:900px){
      .hero{grid-template-columns:1fr;}
      .grid-2{grid-template-columns:1fr}
      nav{display:none}
      .brand h1{font-size:16px}
    }
  



    /* subtle entrance animations */
    .fade-in{opacity:0;transform:translateY(14px);animation:fadeUp 1s ease-out forwards}
    .fade-in.delay-1{animation-delay:.15s}
    .fade-in.delay-2{animation-delay:.3s}
    @keyframes fadeUp{to{opacity:1;transform:none}}

    footer{margin-top:60px;padding:24px 0;border-top:1px solid rgba(80,70,60,0.06);color:var(--muted)}

    @media (max-width:1100px){
      .promo-inner{grid-template-columns:1fr;}
      .blob{height:320px}
      .menu-columns{grid-template-columns:1fr 1fr}
      .hero-overlay h2{font-size:40px}
    }
    @media (max-width:700px){
      .menu-columns{grid-template-columns:1fr}
      .hero-overlay h2{font-size:28px}
    }