/* Peaches 'n' Cream — retro seaside parlour */
:root{
  --cream:#FFF6EC;
  --cream-deep:#FBEEDD;
  --peach:#F5A26B;
  --peach-soft:#FFD9B3;
  --strawberry:#E86A8A;
  --lake:#6FA8BE;
  --lake-deep:#4E8AA3;
  --ink:#3A3230;
  --choc:#5A3D2B;
  --white:#FFFFFF;
  --shadow:0 10px 30px rgba(90,61,43,.12);
  --radius:22px;
  --font-display:"Baloo 2","PingFang SC","Hiragino Sans GB","Microsoft YaHei",cursive;
  --font-body:"Nunito","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
}
html[lang="zh-CN"] body, html[lang="zh-CN"] h1, html[lang="zh-CN"] h2, html[lang="zh-CN"] h3{font-family:"Baloo 2","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",sans-serif;}
html[lang="ja"] body, html[lang="ja"] h1, html[lang="ja"] h2, html[lang="ja"] h3{font-family:"Baloo 2","Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP",sans-serif;}

*{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.65;overflow-x:hidden;}
img{max-width:100%;display:block;}
a{color:inherit;}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:1rem;
  padding:.7rem 1.4rem;background:rgba(255,246,236,.96);backdrop-filter:blur(8px);
  border-bottom:2px solid var(--peach-soft);}
.brand{display:flex;align-items:center;gap:.5rem;text-decoration:none;font-family:var(--font-display);
  font-weight:800;font-size:1.35rem;color:var(--choc);white-space:nowrap;}
.brand-mark{font-size:1.5rem;}
.brand-name em{font-style:normal;color:var(--strawberry);}
.nav-links{display:flex;align-items:center;gap:1.3rem;margin-left:auto;}
.nav-links a{text-decoration:none;font-weight:700;color:var(--choc);font-size:.98rem;}
.nav-links a:hover{color:var(--strawberry);}
.nav-call{border:2px solid var(--peach);border-radius:999px;padding:.3rem .9rem !important;}
.nav-call:hover{background:var(--peach);color:var(--white) !important;}
.nav-right{display:flex;align-items:center;gap:.7rem;margin-left:.4rem;}
.lang-switch{display:flex;gap:.25rem;background:var(--cream-deep);border-radius:999px;padding:.2rem;}
.lang-btn{border:0;background:transparent;border-radius:999px;padding:.28rem .6rem;
  font-family:var(--font-body);font-weight:700;font-size:.78rem;color:var(--choc);cursor:pointer;}
.lang-btn.active{background:var(--strawberry);color:var(--white);}
.hamburger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:.4rem;}
.hamburger span{display:block;width:24px;height:3px;border-radius:2px;background:var(--choc);}

/* awning stripes */
.awning{height:14px;background:repeating-linear-gradient(90deg,var(--peach) 0 44px,var(--cream) 44px 88px);
  border-top:2px solid rgba(90,61,43,.08);border-bottom:2px solid rgba(90,61,43,.08);}

/* ---------- hero ---------- */
.hero{position:relative;min-height:86vh;display:flex;align-items:flex-end;
  background:url('assets/pc-shopfront.jpg') center 30%/cover no-repeat;}
.hero::before{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(255,246,236,.05) 40%,rgba(58,50,48,.55) 100%);}
.hero-card{position:relative;z-index:1;background:var(--cream);border-radius:var(--radius) var(--radius) 0 0;
  margin:0 auto;width:min(1060px,94%);padding:2.4rem 2.6rem 2rem;box-shadow:var(--shadow);
  border:3px solid var(--white);}
.eyebrow{font-weight:800;letter-spacing:.14em;text-transform:uppercase;font-size:.78rem;color:var(--strawberry);margin-bottom:.6rem;}
html[lang="zh-CN"] .eyebrow, html[lang="ja"] .eyebrow{letter-spacing:.3em;}
.hero-card h1{font-family:var(--font-display);font-weight:800;font-size:clamp(2.6rem,6vw,4.4rem);
  line-height:1.05;color:var(--choc);margin-bottom:.8rem;}
.hero-card h1 .hl{color:var(--strawberry);}
.lede{font-size:1.12rem;max-width:34rem;color:var(--ink);margin-bottom:1.4rem;}
.hero-ctas{display:flex;gap:.8rem;flex-wrap:wrap;margin-bottom:1.1rem;}
.btn{display:inline-block;text-decoration:none;font-weight:800;border-radius:999px;padding:.75rem 1.6rem;transition:transform .15s ease;}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--strawberry);color:var(--white);box-shadow:0 6px 18px rgba(232,106,138,.4);}
.btn-ghost{border:2.5px solid var(--lake);color:var(--lake-deep);}
.hero-badge{font-weight:700;color:var(--choc);}
.stars{color:#F0A13A;letter-spacing:.1em;}

/* ---------- sections ---------- */
.section{padding:4.5rem 1.4rem;}
.wrap{max-width:1060px;margin:0 auto;}
.section h2{font-family:var(--font-display);font-weight:800;font-size:clamp(1.9rem,4vw,2.7rem);color:var(--choc);margin-bottom:.6rem;}
.section-lede{max-width:36rem;margin-bottom:2.2rem;font-size:1.05rem;}

/* flavours */
.flavours{background:var(--white);}
.flavour-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;}
.flavour-card{position:relative;background:var(--cream);border-radius:var(--radius);padding:1.5rem;
  box-shadow:var(--shadow);border:2px solid transparent;display:flex;flex-direction:column;gap:.35rem;}
.flavour-card h3{font-family:var(--font-display);font-size:1.25rem;color:var(--choc);}
.flavour-card p{font-size:.95rem;}
.flavour-photo{border-radius:14px;overflow:hidden;margin:-1.5rem -1.5rem .8rem;}
.flavour-photo img{width:100%;height:220px;object-fit:cover;}
.flavour-card.signature{border-color:var(--peach);background:linear-gradient(180deg,#FFF6EC,#FFE9D2);}
.tag{position:absolute;top:1rem;right:1rem;background:var(--choc);color:var(--cream);
  font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  border-radius:999px;padding:.25rem .7rem;}
.flavours-more{margin-top:1.6rem;text-align:center;font-weight:700;color:var(--lake-deep);}

/* afternoon tea */
.tea{background:linear-gradient(180deg,var(--cream) 0%,var(--peach-soft) 130%);}
.tea-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:center;}
.tea-photo img{border-radius:var(--radius);box-shadow:var(--shadow);border:6px solid var(--white);}
.tea-price{margin-top:1rem;font-family:var(--font-display);font-size:1.3rem;font-weight:700;color:var(--strawberry);}

/* reviews */
.reviews{background:var(--white);}
.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;}
.review-card{background:var(--cream);border-radius:var(--radius);padding:1.6rem;box-shadow:var(--shadow);
  display:flex;flex-direction:column;gap:.9rem;border-top:6px solid var(--peach);}
.review-card:nth-child(2){border-top-color:var(--strawberry);}
.review-card:nth-child(3){border-top-color:var(--lake);}
.review-card blockquote{font-size:1.02rem;}
.review-card figcaption{font-weight:700;color:var(--lake-deep);font-size:.9rem;margin-top:auto;}

/* visit */
.visit-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:2.5rem;align-items:center;}
.visit-list{display:grid;gap:.9rem;margin:1.2rem 0;}
.visit-list>div{display:grid;grid-template-columns:110px 1fr;gap:.8rem;align-items:baseline;}
.visit-list dt{font-weight:800;color:var(--strawberry);font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;}
.visit-list dd a{color:var(--lake-deep);font-weight:700;}
.visit-note{font-weight:700;}
.visit-cash{display:inline-block;margin-top:.6rem;background:var(--cream-deep);border-radius:999px;
  padding:.3rem .9rem;font-size:.88rem;font-weight:700;color:var(--choc);}
.visit-photo img{border-radius:var(--radius);box-shadow:var(--shadow);border:6px solid var(--white);}

/* footer */
.site-footer{background:var(--choc);color:var(--cream);text-align:center;padding:2.6rem 1.4rem;}
.footer-brand{font-family:var(--font-display);font-weight:800;font-size:1.6rem;margin-bottom:.3rem;}
.footer-brand em{font-style:normal;color:var(--peach);}
.footer-fine{margin-top:.8rem;font-size:.82rem;opacity:.65;}

/* ---------- responsive ---------- */
@media (max-width:1024px){
  .nav-links{position:fixed;inset:0 0 0 auto;width:min(300px,80vw);flex-direction:column;align-items:flex-start;
    background:var(--cream);padding:5rem 2rem;gap:1.4rem;transform:translateX(100%);transition:transform .3s ease;
    box-shadow:-10px 0 30px rgba(0,0,0,.15);margin-left:0;z-index:60;}
  .nav-links.open{transform:none;}
  .hamburger{display:flex;z-index:70;}
  .flavour-grid,.review-grid{grid-template-columns:repeat(2,1fr);}
  .tea-grid,.visit-grid{grid-template-columns:1fr;}
}
@media (max-width:640px){
  .flavour-grid,.review-grid{grid-template-columns:1fr;}
  .hero-card{padding:1.8rem 1.4rem 1.5rem;}
  .section{padding:3.2rem 1.1rem;}
  .visit-list>div{grid-template-columns:90px 1fr;}
  .brand-name{font-size:1.1rem;}
  .lang-btn{padding:.28rem .45rem;font-size:.72rem;}
}
