/*
Theme Name: Tokyo Cooking Class
Theme URI: https://tokyo-cooking-class.com
Author: Tokyo Inbound Cooking
Description: An elegant WordPress theme for Tokyo inbound cooking classes - recipes, booking, vlog, shop.
Version: 1.0.1
License: GNU General Public License v2 or later
Text Domain: tokyo-cooking-class
Tags: food, cooking, travel, booking, japanese, elegant
*/

/* =============================================
   CSS CUSTOM PROPERTIES
   ============================================= */
:root {
  --color-cream:            #FAF6F1;
  --color-warm-white:       #FFF9F4;
  --color-terracotta:       #C96A3A;
  --color-terracotta-light: #E8895A;
  --color-terracotta-dark:  #A04F25;
  --color-sage:             #7A9178;
  --color-sage-light:       #A8BDA6;
  --color-sage-dark:        #4E6B4C;
  --color-charcoal:         #2C2C2C;
  --color-dark:             #1A1A1A;
  --color-muted:            #8A8070;
  --color-border:           #E5DED5;
  --color-gold:             #C9A84C;

  --font-display:  'Cormorant Garamond', 'Noto Serif JP', serif;
  --font-body:     'Libre Baskerville', 'Noto Serif JP', serif;
  --font-accent:   'Jost', sans-serif;

  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 2rem;
  --space-lg: 4rem;
  --space-xl: 5rem;

  --radius-sm:   4px;
  --radius-md:   12px;
  --radius-lg:   24px;
  --radius-full: 999px;

  --shadow-sm: 0 2px 12px rgba(44,44,44,0.07);
  --shadow-md: 0 8px 32px rgba(44,44,44,0.12);
  --shadow-lg: 0 20px 60px rgba(44,44,44,0.16);

  --transition: 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --max-width:  1280px;
}

/* =============================================
   RESET & BASE
   ============================================= */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; font-size: 16px; }

body {
  font-family: var(--font-body);
  color: var(--color-charcoal);
  background-color: var(--color-cream);
  line-height: 1.75;
  overflow-x: hidden;
}

img   { max-width: 100%; height: auto; display: block; }
a     { color: inherit; text-decoration: none; transition: color var(--transition); }
ul    { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }

/* =============================================
   TYPOGRAPHY
   ============================================= */
h1,h2,h3,h4,h5,h6 {
  font-family: var(--font-display);
  font-weight: 600;
  line-height: 1.2;
  color: var(--color-dark);
}

h1 { font-size: clamp(2.4rem, 5vw, 4.5rem); }
h2 { font-size: clamp(1.9rem, 3.5vw, 3rem); }
h3 { font-size: clamp(1.4rem, 2.5vw, 2rem); }
h4 { font-size: 1.2rem; }

p { margin-bottom: 1.5em; }
p:last-child { margin-bottom: 0; }

/* =============================================
   LAYOUT
   ============================================= */
.container {
  width: 100%;
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--space-md);
}
.container--narrow { max-width: 840px; }
.container--wide   { max-width: 1440px; }

.section    { padding: 4rem 0; }
.section--sm { padding: var(--space-lg) 0; }

.grid-2 { display: grid; grid-template-columns: repeat(2,1fr); gap: var(--space-md); }
.grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: var(--space-md); }
.grid-4 { display: grid; grid-template-columns: repeat(4,1fr); gap: var(--space-md); }

.flex-between { display:flex; align-items:center; justify-content:space-between; }
.flex-center  { display:flex; align-items:center; justify-content:center; }
.text-center  { text-align: center; }

/* Content + Sidebar layout */
.content-sidebar-wrap {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: var(--space-md);
  align-items: start;
}
.content-sidebar-wrap .sidebar { position: sticky; top: 100px; }

/* =============================================
   EYEBROW / SECTION LABELS
   ============================================= */
.eyebrow {
  font-family: var(--font-accent);
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--color-terracotta);
  display: block;
  margin-bottom: 0.75rem;
}

.divider {
  width: 48px; height: 2px;
  background: var(--color-terracotta);
  margin: 1rem 0 1.5rem;
}
.divider--center { margin: 1rem auto 1.5rem; }

/* =============================================
   BUTTONS
   ============================================= */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--font-accent);
  font-size: 0.82rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 1rem 2.25rem;
  border-radius: var(--radius-full);
  transition: all var(--transition);
  white-space: nowrap;
}

.btn--primary  { background: var(--color-terracotta); color: #fff; }
.btn--primary:hover { background: var(--color-terracotta-dark); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(201,106,58,.35); color:#fff; }

.btn--outline  { border: 2px solid var(--color-terracotta); color: var(--color-terracotta); }
.btn--outline:hover { background: var(--color-terracotta); color: #fff; transform: translateY(-2px); }

.btn--white    { background: #fff; color: var(--color-terracotta); }
.btn--white:hover  { background: var(--color-cream); transform: translateY(-2px); box-shadow: var(--shadow-md); }

.btn--sage     { background: var(--color-sage); color: #fff; }
.btn--sage:hover   { background: var(--color-sage-dark); transform: translateY(-2px); }

/* =============================================
   CARDS
   ============================================= */
.card {
  background: #fff;
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: transform var(--transition), box-shadow var(--transition);
}
.card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }

.card__image { position:relative; overflow:hidden; aspect-ratio: 4/3; }
.card__image img { width:100%; height:100%; object-fit:cover; transition: transform 0.6s ease; }
.card:hover .card__image img { transform: scale(1.05); }

.card__body   { padding: 1.5rem; }
.card__tag    { font-family:var(--font-accent); font-size:0.7rem; font-weight:600; letter-spacing:.15em; text-transform:uppercase; color:var(--color-terracotta); margin-bottom:0.5rem; }
.card__title  { font-size:1.15rem; margin-bottom:0.5rem; }
.card__excerpt { font-size:0.9rem; color:var(--color-muted); line-height:1.6; }
.card__meta   { font-family:var(--font-accent); font-size:0.75rem; color:var(--color-muted); margin-top:1rem; display:flex; gap:1rem; }

/* =============================================
   TAGS / BADGES
   ============================================= */
.tag {
  display: inline-block;
  font-family: var(--font-accent);
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 0.3rem 0.85rem;
  border-radius: var(--radius-full);
  background: var(--color-border);
  color: var(--color-charcoal);
  transition: all var(--transition);
}
.tag:hover            { background: var(--color-terracotta); color:#fff; }
.tag--terracotta      { background: rgba(201,106,58,.12); color: var(--color-terracotta); }
.tag--sage            { background: rgba(122,145,120,.15); color: var(--color-sage-dark); }

/* =============================================
   FORMS
   ============================================= */
.form-group { margin-bottom: 1.5rem; }
.form-label {
  display: block;
  font-family: var(--font-accent);
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-charcoal);
  margin-bottom: 0.5rem;
}
.form-control {
  width: 100%;
  padding: 0.875rem 1.25rem;
  border: 2px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: 0.95rem;
  color: var(--color-charcoal);
  background: #fff;
  transition: border-color var(--transition);
  -webkit-appearance: none;
}
.form-control:focus { outline:none; border-color: var(--color-terracotta); }
textarea.form-control { min-height:120px; resize:vertical; }

/* =============================================
   BREADCRUMB
   ============================================= */
.breadcrumb {
  font-family: var(--font-accent);
  font-size: 0.78rem;
  color: var(--color-muted);
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  padding: var(--space-sm) 0;
}
.breadcrumb a:hover { color: var(--color-terracotta); }
.breadcrumb__sep    { opacity: 0.4; }

/* =============================================
   PAGINATION
   ============================================= */
.pagination {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  margin-top: var(--space-lg);
}
.pagination a,
.pagination span {
  display: flex; align-items:center; justify-content:center;
  width: 44px; height: 44px;
  border-radius: var(--radius-sm);
  font-family: var(--font-accent);
  font-size: 0.9rem;
  border: 2px solid var(--color-border);
  transition: all var(--transition);
}
.pagination a:hover { border-color:var(--color-terracotta); color:var(--color-terracotta); }
.pagination .current { background:var(--color-terracotta); color:#fff; border-color:var(--color-terracotta); }

/* =============================================
   ANIMATION
   ============================================= */
.fade-up { opacity: 1; transform: none; }
.fade-up.visible { opacity:1; transform:none; }

/* =============================================
   RESPONSIVE
   ============================================= */
@media (max-width:1024px) {
  .grid-4 { grid-template-columns: repeat(2,1fr); }
  .content-sidebar-wrap { grid-template-columns: 1fr; }
  .content-sidebar-wrap .sidebar { position: static; }
}
@media (max-width:768px) {
  :root { --space-lg:3rem; --space-xl:5rem; }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .container { padding: 0 1rem; }
}
@media (max-width:480px) {
  :root { --space-xl: 4rem; }
}

/* =============================================
   HEADER STYLES
   ============================================= */
.site-header {
  position: fixed; top:0; left:0; right:0; z-index:1000;
  height: 80px;
  background: rgba(250,246,241,0.96);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid transparent;
  transition: all 0.3s ease;
}
.site-header.scrolled { height:66px; border-bottom-color:var(--color-border); box-shadow:var(--shadow-sm); }
.site-header.hidden { transform:translateY(-100%); }
.site-header .container { height:100%; }

.header-inner {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  height: 100%;
  gap: 24px;
}

/* Logo */
.header-logo { text-decoration:none; flex-shrink:0; line-height:1; }
.header-logo__text { display:flex; flex-direction:column; gap:2px; }
.header-logo__en { font-family:var(--font-accent); font-size:0.58rem; font-weight:500; letter-spacing:0.3em; text-transform:uppercase; color:var(--color-terracotta); }
.header-logo__main { font-family:var(--font-display); font-size:1.3rem; font-weight:600; color:var(--color-dark); white-space:nowrap; }
.header-logo__jp { font-size:0.6rem; color:var(--color-muted); letter-spacing:0.08em; }

/* Nav */
.site-nav { flex:1; display:flex; justify-content:center; }
.nav__list { display:flex !important; align-items:center; list-style:none; margin:0; padding:0; flex-direction:row !important; }
.nav__item { position:relative; }
.nav__link {
  display:flex; align-items:center; gap:4px;
  padding:8px 13px;
  font-family:var(--font-accent); font-size:0.8rem; font-weight:500; letter-spacing:0.06em;
  color:var(--color-charcoal); text-decoration:none; white-space:nowrap;
  transition:color 0.2s;
}
.nav__link:hover, .nav__item.current-menu-item > .nav__link { color:var(--color-terracotta); }
.nav__link .icon svg { width:11px; height:11px; }

/* Dropdown */
.nav__dropdown {
  position:absolute; top:calc(100% + 4px); left:50%;
  transform:translateX(-50%) translateY(-6px);
  min-width:190px; background:#fff;
  border-radius:12px; box-shadow:var(--shadow-md);
  border:1px solid var(--color-border);
  padding:6px 0; list-style:none; margin:0;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity 0.2s, transform 0.2s, visibility 0.2s;
}
.nav__item.has-dropdown:hover .nav__dropdown { opacity:1; visibility:visible; pointer-events:auto; transform:translateX(-50%) translateY(0); }
.nav__dropdown-item { list-style:none; }
.nav__dropdown-item .nav__link { padding:9px 18px; font-size:0.78rem; }
.nav__dropdown-item .nav__link:hover { background:#fdf5ed; }

/* Header Actions */
.header-actions { display:flex; align-items:center; gap:8px; flex-shrink:0; }

/* Lang Switcher */
.lang-switcher { position:relative; }
.lang-switcher__toggle {
  display:flex; align-items:center; gap:3px;
  background:none; border:1px solid var(--color-border); border-radius:6px;
  padding:5px 9px;
  font-family:var(--font-accent); font-size:0.7rem; font-weight:600; letter-spacing:0.1em;
  color:var(--color-charcoal); cursor:pointer; transition:border-color 0.2s,color 0.2s;
}
.lang-switcher__toggle:hover { border-color:var(--color-terracotta); color:var(--color-terracotta); }
.lang-switcher__toggle .icon svg { width:11px; height:11px; }
.lang-switcher__dropdown {
  position:absolute; top:calc(100% + 6px); right:0;
  background:#fff; border-radius:10px; box-shadow:var(--shadow-md);
  border:1px solid var(--color-border); padding:6px 0;
  list-style:none; margin:0; min-width:90px;
  opacity:0; visibility:hidden; transform:translateY(-4px);
  transition:all 0.2s;
}
.lang-switcher:hover .lang-switcher__dropdown { opacity:1; visibility:visible; transform:translateY(0); }
.lang-switcher__dropdown li a { display:block; padding:8px 14px; font-size:0.78rem; color:var(--color-charcoal); text-decoration:none; }
.lang-switcher__dropdown li a:hover { color:var(--color-terracotta); background:#fdf5ed; }

/* Search */
.header-search-btn { display:flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:50%; background:transparent; border:none; color:var(--color-charcoal); cursor:pointer; transition:color 0.2s,background 0.2s; }
.header-search-btn:hover { color:var(--color-terracotta); background:var(--color-cream); }
.header-search-btn .icon svg { width:17px; height:17px; }

/* CTA */
.header-cta { padding:9px 20px !important; font-size:0.78rem !important; text-transform:uppercase; letter-spacing:0.1em; }

/* Search Bar */
.header-search-bar { position:absolute; top:100%; left:0; right:0; background:#fff; border-top:1px solid var(--color-border); box-shadow:var(--shadow-md); padding:18px 0; transform:translateY(-8px); opacity:0; visibility:hidden; transition:all 0.25s; }
.header-search-bar.is-open { transform:translateY(0); opacity:1; visibility:visible; }
.search-form { display:flex; align-items:center; border:1.5px solid var(--color-border); border-radius:var(--radius-full); overflow:hidden; background:var(--color-cream); }
.search-form__input { flex:1; padding:11px 18px; border:none; background:transparent; font-size:0.9rem; color:var(--color-dark); outline:none; }
.search-form__submit { background:var(--color-terracotta); border:none; color:#fff; padding:11px 18px; cursor:pointer; display:flex; align-items:center; transition:background 0.2s; }
.search-form__submit:hover { background:var(--color-terracotta-dark); }
.search-form__submit .icon svg { width:16px; height:16px; }
.search-form__close { background:none; border:none; color:#aaa; padding:11px 14px; cursor:pointer; display:flex; align-items:center; }
.search-form__close:hover { color:var(--color-dark); }
.search-form__close .icon svg { width:14px; height:14px; }

/* Hamburger */
.hamburger { display:none; flex-direction:column; justify-content:center; gap:5px; width:40px; height:40px; background:none; border:none; cursor:pointer; padding:8px; }
.hamburger__line { display:block; width:22px; height:2px; background:var(--color-dark); border-radius:2px; transition:all 0.3s; transform-origin:center; }
.hamburger.is-active .hamburger__line:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.hamburger.is-active .hamburger__line:nth-child(2) { opacity:0; }
.hamburger.is-active .hamburger__line:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* Mobile Nav */
.mobile-nav-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.45); z-index:1099; opacity:0; visibility:hidden; transition:all 0.3s; }
.mobile-nav-overlay.is-active { opacity:1; visibility:visible; }
.mobile-nav { position:fixed; top:0; right:0; width:300px; height:100vh; background:#fff; z-index:1100; transform:translateX(100%); transition:transform 0.35s cubic-bezier(0.4,0,0.2,1); display:flex; flex-direction:column; overflow-y:auto; }
.mobile-nav.is-open { transform:translateX(0); }
.mobile-nav__header { display:flex; align-items:center; justify-content:space-between; padding:20px 24px; border-bottom:1px solid var(--color-border); }
.mobile-nav__logo { font-family:var(--font-display); font-size:1.15rem; font-weight:600; color:var(--color-dark); text-decoration:none; }
.mobile-nav__close { background:none; border:none; color:var(--color-dark); cursor:pointer; padding:4px; display:flex; align-items:center; }
.mobile-nav__close .icon svg { width:20px; height:20px; }
.mobile-nav__list { list-style:none !important; padding:12px 0; margin:0; flex:1; }
.mobile-nav__item { border-bottom:1px solid #f5efe8; list-style:none; }
.mobile-nav__link { display:block; padding:14px 24px; font-family:var(--font-accent); font-size:0.9rem; font-weight:500; color:var(--color-dark); text-decoration:none; transition:color 0.2s,background 0.2s; }
.mobile-nav__link:hover { color:var(--color-terracotta); background:#fdf8f4; }
.mobile-nav__footer { padding:22px 24px; border-top:1px solid var(--color-border); }
.mobile-nav__langs { display:flex; gap:14px; justify-content:center; margin-top:14px; }
.mobile-nav__langs a { font-size:0.75rem; color:#999; text-decoration:none; font-family:var(--font-accent); letter-spacing:0.1em; transition:color 0.2s; }
.mobile-nav__langs a:hover { color:var(--color-terracotta); }

body { padding-top:80px; }

/* Announcement */
.announcement-bar { background:var(--color-terracotta); color:#fff; text-align:center; padding:9px 20px; font-family:var(--font-accent); font-size:0.78rem; position:relative; z-index:1001; }
.announcement-bar .container { display:flex; align-items:center; justify-content:center; gap:10px; }
.announcement-bar__text { margin:0; }
.announcement-bar__close { background:none; border:none; color:#fff; cursor:pointer; padding:0; display:flex; align-items:center; opacity:0.75; }
.announcement-bar__close .icon svg { width:13px; height:13px; }

@media (max-width:1100px) {
  .site-nav, .lang-switcher, .header-cta { display:none !important; }
  .hamburger { display:flex !important; }
}
@media (max-width:640px) {
  .container { padding:0 1rem; }
}

/* =============================================
   HERO SECTION
   ============================================= */
.hero { position:relative; min-height:80vh; display:flex; align-items:center; overflow:hidden; background: #1a1209; }
.hero__media { position:absolute; inset:0; }
.hero__image, .hero__video { width:100%; height:100%; object-fit:cover; }
.hero__overlay { position:absolute; inset:0; background:linear-gradient(135deg, rgba(26,26,10,0.55) 0%, rgba(201,106,58,0.2) 100%); }
.hero .container { position:relative; z-index:1; }
.hero__content { max-width:640px; padding:40px 0; }
.hero__eyebrow { display:block; font-family:var(--font-accent); font-size:0.72rem; font-weight:500; letter-spacing:0.25em; text-transform:uppercase; color:rgba(255,255,255,0.8); margin-bottom:1rem; }
.hero__title { font-family:var(--font-display); font-size:clamp(2.6rem,5vw,4.2rem); font-weight:600; color:#fff !important; line-height:1.15; margin-bottom:1.25rem; }
.hero__subtitle { font-size:1rem; color:rgba(255,255,255,0.82); line-height:1.8; margin-bottom:2.5rem; max-width:480px; }
.hero__actions { display:flex; align-items:center; gap:1rem; flex-wrap:wrap; }
.hero__stats { display:flex; gap:2.5rem; margin-top:3rem; flex-wrap:wrap; }
.hero__stat-num { font-family:var(--font-display); font-size:1.8rem; font-weight:600; color:#fff; display:block; }
.hero__stat-label { font-family:var(--font-accent); font-size:0.68rem; letter-spacing:0.15em; text-transform:uppercase; color:rgba(255,255,255,0.6); display:block; }
.hero__scroll { position:absolute; bottom:2rem; left:50%; transform:translateX(-50%); font-family:var(--font-accent); font-size:0.65rem; letter-spacing:0.25em; text-transform:uppercase; color:rgba(255,255,255,0.6); display:flex; flex-direction:column; align-items:center; gap:8px; }
.hero__scroll::after { content:''; width:1px; height:40px; background:rgba(255,255,255,0.4); }

/* =============================================
   ICON
   ============================================= */
.icon { display:inline-flex; align-items:center; justify-content:center; }
.icon svg { width:1em; height:1em; vertical-align:middle; }

/* =============================================
   FOOTER STYLES
   ============================================= */

/* Newsletter Strip */
.footer-newsletter {
  background: var(--color-dark);
  padding: 4rem 0;
}
.footer-newsletter__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: center;
}
.footer-newsletter__text .eyebrow { color: var(--color-terracotta); }
.footer-newsletter__text h3 { font-family: var(--font-display); font-size: 1.6rem; color: #fff; margin: 0.5rem 0 0.75rem; }
.footer-newsletter__text p { color: rgba(255,255,255,0.6); font-size: 0.9rem; margin:0; }
.footer-newsletter__field { display: flex; border-radius: var(--radius-full); overflow: hidden; border: 1.5px solid rgba(255,255,255,0.2); }
.footer-newsletter__input { flex:1; padding:13px 20px; background:transparent; border:none; color:#fff; font-size:0.9rem; outline:none; }
.footer-newsletter__input::placeholder { color:rgba(255,255,255,0.4); }
.footer-newsletter__field .btn { border-radius:0; padding:13px 24px; flex-shrink:0; font-size:0.78rem; }
.footer-newsletter__note { font-size:0.75rem; color:rgba(255,255,255,0.4); margin-top:10px; }

/* Footer Main */
.footer-main { background: #1a1209; padding: 5rem 0 3rem; }
.footer-grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr;
  gap: 3rem;
}

/* Footer Brand */
.footer-logo { display:inline-block; text-decoration:none; margin-bottom:1.25rem; }
.footer-logo__text { display:flex; flex-direction:column; gap:2px; }
.footer-logo__en { font-family:var(--font-accent); font-size:0.58rem; font-weight:500; letter-spacing:0.3em; text-transform:uppercase; color:var(--color-terracotta); }
.footer-logo__main { font-family:var(--font-display); font-size:1.3rem; font-weight:600; color:#fff; }
.footer-brand__desc { font-size:0.85rem; color:rgba(255,255,255,0.55); line-height:1.75; margin-bottom:1.5rem; }

/* Social Links */
.footer-social { display:flex; gap:10px; margin-bottom:1.5rem; }
.footer-social__link {
  display:flex; align-items:center; justify-content:center;
  width:36px; height:36px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,0.2);
  color:rgba(255,255,255,0.65);
  text-decoration:none;
  font-size:0.75rem;
  transition:all 0.2s;
}
.footer-social__link:hover { background:var(--color-terracotta); border-color:var(--color-terracotta); color:#fff; }

/* Address */
.footer-address {
  display:flex; align-items:flex-start; gap:8px;
  font-style:normal; font-size:0.82rem;
  color:rgba(255,255,255,0.5);
  line-height:1.6;
}
.footer-address .icon { color:var(--color-terracotta); margin-top:2px; flex-shrink:0; }
.footer-address .icon svg { width:14px; height:14px; }

/* Widget Areas */
.footer-widget__title {
  font-family: var(--font-accent);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.9);
  margin-bottom: 1.25rem;
}
.footer-widget__list { list-style:none !important; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; }
.footer-widget__list li { list-style:none; }
.footer-widget__list a { font-size:0.85rem; color:rgba(255,255,255,0.5); text-decoration:none; transition:color 0.2s; }
.footer-widget__list a:hover { color:var(--color-terracotta); }

/* Hours */
.footer-hours { list-style:none !important; padding:0; margin:0 0 1rem; display:flex; flex-direction:column; gap:8px; }
.footer-hours li { display:flex; justify-content:space-between; font-size:0.82rem; }
.footer-hours__day { color:rgba(255,255,255,0.5); }
.footer-hours__time { color:rgba(255,255,255,0.8); font-weight:500; }
.footer-contact-info { margin:6px 0 0; }
.footer-contact-info a { font-size:0.82rem; color:rgba(255,255,255,0.5); text-decoration:none; transition:color 0.2s; }
.footer-contact-info a:hover { color:var(--color-terracotta); }

/* Footer Bottom */
.footer-bottom { background: #110d07; padding:1.5rem 0; }
.footer-bottom__inner { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; }
.footer-bottom__copy { font-size:0.75rem; color:rgba(255,255,255,0.3); margin:0; }
.footer-bottom__copy a { color:rgba(255,255,255,0.3); text-decoration:none; }
.footer-bottom__copy a:hover { color:var(--color-terracotta); }
.footer-bottom__list { display:flex !important; gap:20px; list-style:none !important; padding:0; margin:0; }
.footer-bottom__list li { list-style:none; }
.footer-bottom__list a { font-size:0.72rem; color:rgba(255,255,255,0.3); text-decoration:none; letter-spacing:0.05em; transition:color 0.2s; }
.footer-bottom__list a:hover { color:var(--color-terracotta); }
.footer-bottom__lang { display:flex; align-items:center; gap:8px; font-size:0.72rem; color:rgba(255,255,255,0.3); }
.footer-bottom__lang a { color:rgba(255,255,255,0.3); text-decoration:none; transition:color 0.2s; }
.footer-bottom__lang a:hover { color:var(--color-terracotta); }

/* Sakura deco */
.footer-sakura { line-height:0; }
.footer-sakura svg { width:100%; display:block; }

/* Scroll Top */
.scroll-top {
  position:fixed; bottom:2rem; right:2rem;
  width:46px; height:46px;
  border-radius:50%;
  background:var(--color-terracotta);
  color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 16px rgba(201,106,58,0.4);
  cursor:pointer; border:none;
  opacity:0; visibility:hidden; transform:translateY(10px);
  transition:all 0.3s;
  z-index:900;
}
.scroll-top.visible { opacity:1; visibility:visible; transform:translateY(0); }
.scroll-top:hover { background:var(--color-terracotta-dark); transform:translateY(-3px); }
.scroll-top svg { width:18px; height:18px; }

/* Responsive Footer */
@media (max-width: 1024px) {
  .footer-newsletter__inner { grid-template-columns:1fr; gap:2rem; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap:2rem; }
}
@media (max-width: 640px) {
  .footer-grid { grid-template-columns: 1fr; }
  .footer-bottom__inner { flex-direction:column; text-align:center; }
  .footer-bottom__list { justify-content:center; flex-wrap:wrap; }
}

/* フッター下余白修正 */
.site-footer { margin-bottom: 0; }
.site-wrapper { display: flex; flex-direction: column; min-height: 100vh; }
.site-main { flex: 1; }
body { margin: 0; padding-bottom: 0; }
.footer-sakura { margin-bottom: -2px; }

/* html/body背景をフッター底色に合わせる */
html { background: #110d07; }

/* ヒーロー確実表示 */
.hero__content { position:relative; z-index:2; }
.hero__eyebrow, .hero__subtitle, .hero__stat-label { color:rgba(255,255,255,0.8) !important; }
.hero__stat-num { color:#fff !important; }
.hero .container { position:relative; z-index:2; padding-top:3rem; padding-bottom:3rem; }
.hero__overlay { background:linear-gradient(135deg, rgba(10,8,5,0.75) 0%, rgba(100,50,20,0.4) 100%); z-index:1; }
.hero__media img { display:block; }

/* セクション間の余白詰め */
.classes-section, .recipes-section, .vlog-section, .reviews-section, .location-section, .shop-preview-section {
    padding: 4rem 0;
}
.features-section { padding: 4rem 0; }