/* ═══════════════════════════════════════════
   JIEYO THEME — main.css v1.0
   Palette : #C0392B rouge · #1a2744 bleu · #f8f6f1 blanc
═══════════════════════════════════════════ */

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; cursor:none !important; }

:root {
  --rouge:    #C0392B;
  --rouge-v:  #e8453a;
  --bleu:     #1a2744;
  --bleu-v:   #243560;
  --blanc:    #f8f6f1;
  --blanc-p:  #ffffff;
  --gris:     #8a8780;
  --gris-cl:  #e2dfd7;
  --serif:    'Cormorant Garamond', Georgia, serif;
  --jp:       'Shippori Mincho', serif;
  --sans:     'DM Sans', sans-serif;
}

html { scroll-behavior: smooth; }
body { background: var(--blanc); color: var(--bleu); font-family: var(--sans); font-weight:300; overflow-x:hidden; }

img { max-width:100%; height:auto; display:block; }
a   { color:inherit; }

/* ── CURSOR ── */
#cursor {
  position:fixed; width:10px; height:10px;
  background:var(--rouge); border-radius:50%;
  pointer-events:none; z-index:9999;
  transform:translate(-50%,-50%);
  transition:width .2s,height .2s,background .2s;
}
#cursor.hover { width:36px; height:36px; background:transparent; border:1.5px solid var(--rouge); }

/* ── TOPBAR ── */
.topbar {
  position:fixed; top:0; left:0; right:0; z-index:200;
  height:68px; display:flex; align-items:center; justify-content:space-between;
  padding:0 48px; background:var(--blanc);
  border-bottom:1px solid transparent;
  transition:border-color .3s, box-shadow .3s;
  gap: 24px;
}
.topbar.stuck { border-color:var(--gris-cl); box-shadow:0 2px 24px rgba(26,39,68,.06); }

/* Logo */
.logo-wrap {
  display:flex; align-items:center; gap:10px;
  text-decoration:none; flex-shrink:0;
}
.logo-wrap .custom-logo-link {
  display:flex; align-items:center;
  line-height:0;
}
.logo-wrap .custom-logo-link img,
.logo-wrap .site-logo,
.logo-wrap img {
  width:38px !important; height:38px !important;
  border-radius:50% !important; object-fit:cover !important;
  display:block !important;
}
.logo-name {
  font-family:var(--serif); font-size:1.4rem;
  font-weight:600; color:var(--bleu); letter-spacing:.02em;
  white-space:nowrap;
}

/* Nav */
.main-nav { display:flex; align-items:center; gap:32px; }
.nav-links { display:flex; align-items:center; gap:32px; list-style:none; margin:0; padding:0; }
.nav-links li { margin:0; padding:0; }
.nav-links a {
  font-size:.72rem; letter-spacing:.13em; text-transform:uppercase;
  color:var(--bleu); text-decoration:none; position:relative;
  white-space:nowrap;
}
.nav-links a::after {
  content:''; position:absolute; bottom:-3px; left:0; right:0;
  height:1.5px; background:var(--rouge);
  transform:scaleX(0); transform-origin:left; transition:transform .3s;
}
.nav-links a:hover::after { transform:scaleX(1); }

/* Panier */
.nav-cart {
  position:relative; display:flex; align-items:center;
  color:var(--bleu); text-decoration:none; flex-shrink:0;
}
.cart-count {
  position:absolute; top:-8px; right:-10px;
  background:var(--rouge); color:#fff; border-radius:50%;
  width:18px; height:18px; font-size:.58rem; font-weight:500;
  display:flex; align-items:center; justify-content:center;
  line-height:1;
}

/* Bouton commander */
.nav-btn {
  background:var(--bleu); color:var(--blanc) !important;
  padding:10px 22px; font-size:.68rem; letter-spacing:.13em;
  text-transform:uppercase; text-decoration:none !important;
  transition:background .25s; white-space:nowrap; flex-shrink:0;
  display:inline-block;
}
.nav-btn:hover { background:var(--rouge); }

/* Burger */
.nav-toggle {
  display:none; flex-direction:column; gap:5px;
  background:none; border:none; padding:6px; cursor:pointer !important;
  flex-shrink:0;
}
.nav-toggle span {
  display:block; width:24px; height:1.5px;
  background:var(--bleu); transition:.3s;
}
.nav-toggle.open span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
.nav-toggle.open span:nth-child(2) { opacity:0; }
.nav-toggle.open span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }

/* Mobile menu */
.mobile-menu {
  display:none; position:fixed;
  top:68px; left:0; right:0; bottom:0;
  background:var(--bleu); z-index:190;
  padding:48px 32px;
  flex-direction:column; align-items:flex-start;
  overflow-y:auto;
}
.mobile-menu.open { display:flex; }
.mobile-links { list-style:none; margin:0; padding:0; width:100%; }
.mobile-links li { border-bottom:1px solid rgba(255,255,255,.08); }
.mobile-links a {
  display:block; padding:20px 0;
  font-family:var(--serif); font-size:2rem; font-weight:300;
  color:var(--blanc); text-decoration:none;
  transition:color .2s;
}
.mobile-links a:hover { color:var(--rouge); }

/* ── HERO ── */
.hero {
  position:relative; min-height:100vh;
  background:var(--bleu);
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  overflow:hidden; padding-top:68px;
}
.hero::before {
  content:''; position:absolute; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events:none; z-index:1; opacity:.5;
}
.hero-glow {
  position:absolute; width:600px; height:600px; border-radius:50%;
  background:radial-gradient(circle, rgba(192,57,43,.18) 0%, transparent 70%);
  pointer-events:none; z-index:1;
  animation:glowPulse 4s ease-in-out infinite;
}
.hero-lines { position:absolute; inset:0; z-index:1; pointer-events:none; }
.hero-lines::before { content:''; position:absolute; left:50%; top:0; bottom:0; width:1px; background:rgba(255,255,255,.04); }
.hero-lines::after  { content:''; position:absolute; top:50%; left:0; right:0; height:1px; background:rgba(255,255,255,.04); }

/* Kanji flottants */
.kanji-float {
  position:absolute; font-family:var(--jp);
  color:rgba(255,255,255,.06); font-size:var(--size,8rem); font-weight:700;
  z-index:1; pointer-events:none; user-select:none; line-height:1;
  animation:floatAnim var(--dur,12s) var(--delay,0s) ease-in-out infinite;
}

/* Floats */
.floats { position:absolute; inset:0; z-index:2; pointer-events:none; }
.float  {
  position:absolute;
  animation:floatAnim var(--dur,8s) var(--delay,0s) ease-in-out infinite;
  opacity:var(--op,0.12); font-size:var(--size,2rem);
  user-select:none; will-change:transform;
}
.float-onigiri { opacity:var(--op,.12); }

/* Hero center */
.hero-center {
  position:relative; z-index:10;
  display:flex; flex-direction:column;
  align-items:center; text-align:center;
  padding:0 24px;
}
.hero-logo-wrap { position:relative; margin-bottom:40px; }
.hero-logo, .hero-logo-wrap img {
  width:140px; height:140px; border-radius:50%; object-fit:cover;
  border:3px solid rgba(192,57,43,.5);
  box-shadow:0 0 0 12px rgba(192,57,43,.08), 0 0 60px rgba(192,57,43,.2);
  animation:logoPulse 3s ease-in-out infinite;
}
/* Fix logo WordPress custom-logo */
.hero-logo-wrap .custom-logo-link img { width:140px; height:140px; border-radius:50%; }

.hero-overline { font-size:.65rem; letter-spacing:.25em; text-transform:uppercase; color:var(--rouge); margin-bottom:24px; opacity:0; animation:fadeUp .7s .3s forwards; }
.hero-title {
  font-family:var(--serif); font-size:clamp(3.8rem,7vw,8rem);
  font-weight:300; color:var(--blanc-p); line-height:.9;
  letter-spacing:-.02em; margin-bottom:16px;
  opacity:0; animation:fadeUp .9s .5s forwards;
}
.hero-title em { font-style:italic; color:var(--rouge); }
.hero-jp-title { font-family:var(--jp); font-size:1rem; color:rgba(255,255,255,.3); letter-spacing:.3em; margin-bottom:32px; opacity:0; animation:fadeUp .7s .7s forwards; }
.hero-desc     { font-size:.9rem; line-height:1.85; color:rgba(255,255,255,.55); max-width:420px; margin-bottom:52px; opacity:0; animation:fadeUp .7s .9s forwards; }
.hero-actions  { display:flex; gap:20px; align-items:center; opacity:0; animation:fadeUp .7s 1.1s forwards; flex-wrap:wrap; justify-content:center; }

.hero-scroll {
  position:absolute; bottom:36px; left:50%; transform:translateX(-50%);
  z-index:10; display:flex; flex-direction:column; align-items:center; gap:8px;
  opacity:0; animation:fadeUp .6s 1.6s forwards;
}
.hero-scroll span { font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.3); }
.scroll-line { width:1px; height:40px; background:linear-gradient(to bottom, rgba(192,57,43,.8), transparent); animation:scrollLine 2s ease-in-out infinite; }

/* ── BOUTONS GLOBAUX ── */
.btn-rouge {
  background:var(--rouge); color:var(--blanc-p);
  padding:15px 38px; font-size:.72rem; letter-spacing:.14em;
  text-transform:uppercase; text-decoration:none;
  transition:background .25s, transform .2s; display:inline-block;
}
.btn-rouge:hover { background:var(--rouge-v); transform:translateY(-2px); }

.btn-outline {
  border:1px solid rgba(255,255,255,.2); color:rgba(255,255,255,.7);
  padding:15px 32px; font-size:.72rem; letter-spacing:.14em;
  text-transform:uppercase; text-decoration:none;
  transition:border-color .25s, color .25s; display:inline-flex; align-items:center; gap:8px;
}
.btn-outline:hover { border-color:rgba(255,255,255,.6); color:var(--blanc-p); }

/* ── MARQUEE ── */
.marquee-bar { background:var(--bleu); border-top:1px solid rgba(255,255,255,.06); padding:16px 0; overflow:hidden; }
.marquee-track { display:flex; animation:marquee 28s linear infinite; white-space:nowrap; }
.m-item { font-family:var(--serif); font-style:italic; font-size:1rem; color:rgba(255,255,255,.35); padding:0 40px; }
.m-dot  { color:var(--rouge); }

/* ── SECTION OFFRE ── */
.s-offre { display:grid; grid-template-columns:1fr 1fr; min-height:85vh; }
.offre-txt { padding:100px 72px 100px 56px; display:flex; flex-direction:column; justify-content:center; background:var(--blanc); }
.eyebrow { font-size:.62rem; letter-spacing:.22em; text-transform:uppercase; color:var(--rouge); margin-bottom:20px; }
.s-title { font-family:var(--serif); font-size:clamp(2.5rem,4vw,4.8rem); font-weight:300; line-height:1.02; letter-spacing:-.02em; margin-bottom:40px; color:var(--bleu); }
.s-title em { font-style:italic; color:var(--rouge); }
.offre-list { list-style:none; margin-bottom:52px; }
.offre-list li { display:flex; align-items:baseline; gap:16px; padding:15px 0; border-bottom:1px solid var(--gris-cl); font-size:.88rem; color:#4a5568; }
.offre-list li::before { content:'—'; color:var(--rouge); font-size:.65rem; flex-shrink:0; }
.offre-img { position:relative; overflow:hidden; background:var(--bleu); min-height:500px; }
.offre-img img { width:100%; height:100%; object-fit:cover; opacity:.75; transition:transform .8s; position:absolute; inset:0; }
.offre-img:hover img { transform:scale(1.04); }
.offre-label { position:absolute; bottom:0; left:0; right:0; background:linear-gradient(to top,rgba(26,39,68,.85),transparent); padding:40px 28px 28px; color:rgba(255,255,255,.8); font-size:.65rem; letter-spacing:.18em; text-transform:uppercase; }

/* ── BOUTIQUE ── */
.s-boutique { background:var(--bleu); padding:120px 56px; position:relative; overflow:hidden; }
.s-boutique::before { content:'日本'; position:absolute; right:-40px; top:50%; transform:translateY(-50%); font-family:var(--jp); font-size:28rem; font-weight:700; color:rgba(255,255,255,.025); line-height:1; pointer-events:none; user-select:none; }
.boutique-head { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:64px; padding-bottom:32px; border-bottom:1px solid rgba(255,255,255,.08); }
.boutique-h-title { font-family:var(--serif); font-size:clamp(3rem,5.5vw,6.5rem); font-weight:300; line-height:.92; color:var(--blanc-p); }
.boutique-h-title em { font-style:italic; color:var(--rouge); }
.boutique-h-sub { font-size:.72rem; letter-spacing:.15em; text-transform:uppercase; color:rgba(255,255,255,.3); max-width:200px; text-align:right; line-height:1.9; }

.prod-grid { display:grid; grid-template-columns:2fr 1fr 1fr; grid-template-rows:1fr 1fr; gap:3px; margin-bottom:56px; min-height:560px; }
.prod-card { position:relative; overflow:hidden; background:#111827; }
.prod-card.big { grid-row:span 2; }
.prod-img { width:100%; height:100%; min-height:200px; object-fit:cover; filter:saturate(.65) brightness(.85); transition:filter .5s, transform .7s; display:block; }
.prod-card:hover .prod-img { filter:saturate(1) brightness(.95); transform:scale(1.04); }
.prod-overlay { position:absolute; inset:0; background:linear-gradient(160deg,transparent 40%,rgba(26,39,68,.92) 100%); display:flex; flex-direction:column; justify-content:flex-end; padding:24px; }
.prod-cat  { font-size:.58rem; letter-spacing:.2em; text-transform:uppercase; color:var(--rouge); margin-bottom:6px; }
.prod-name { font-family:var(--serif); font-size:1.2rem; color:var(--blanc-p); margin-bottom:4px; }
.prod-price { font-size:.82rem; color:rgba(255,255,255,.45); margin-bottom:16px; }
.prod-add {
  display:inline-flex; align-items:center; gap:8px;
  background:var(--rouge); color:var(--blanc-p); border:none;
  padding:9px 18px; font-size:.62rem; letter-spacing:.12em;
  text-transform:uppercase; width:fit-content;
  opacity:0; transform:translateY(8px);
  transition:opacity .3s, transform .3s, background .2s;
  font-family:var(--sans);
}
.prod-card:hover .prod-add { opacity:1; transform:translateY(0); }
.prod-add:hover { background:var(--blanc-p); color:var(--bleu); }

.boutique-cta { text-align:center; }
.btn-voir-tout {
  display:inline-flex; align-items:center; gap:12px;
  border:1px solid rgba(255,255,255,.15); color:rgba(255,255,255,.7);
  padding:18px 52px; font-size:.72rem; letter-spacing:.16em;
  text-transform:uppercase; text-decoration:none;
  transition:border-color .25s, background .25s, color .25s;
}
.btn-voir-tout:hover { border-color:var(--rouge); background:var(--rouge); color:var(--blanc-p); }

/* ── CONCEPT ── */
.s-concept { display:grid; grid-template-columns:50% 50%; min-height:90vh; }
.concept-vis { position:relative; overflow:hidden; background:var(--bleu); }
.concept-vis img { width:100%; height:100%; object-fit:cover; opacity:.6; }
.concept-vis-overlay { position:absolute; inset:0; background:linear-gradient(to right,rgba(26,39,68,.5),transparent); }
.concept-kanji { position:absolute; bottom:40px; left:32px; font-family:var(--jp); font-size:5rem; font-weight:700; color:rgba(255,255,255,.12); line-height:1; writing-mode:vertical-rl; letter-spacing:.1em; }
.concept-txt { padding:100px 72px 100px 64px; background:var(--blanc-p); display:flex; flex-direction:column; justify-content:center; }
.concept-quote { font-family:var(--serif); font-size:clamp(1.7rem,2.8vw,3rem); font-weight:300; line-height:1.3; color:var(--bleu); margin-bottom:36px; padding-left:24px; border-left:3px solid var(--rouge); }
.concept-body  { font-size:.88rem; line-height:1.95; color:#5a6478; max-width:400px; margin-bottom:52px; }
.concept-stats { display:flex; gap:48px; }
.stat-n { font-family:var(--serif); font-size:3.2rem; font-weight:300; line-height:1; color:var(--rouge); }
.stat-l { font-size:.6rem; letter-spacing:.15em; text-transform:uppercase; color:var(--gris); margin-top:4px; }

/* ── CONTACT ── */
.s-contact { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--gris-cl); }
.contact-l { padding:100px 56px; background:var(--bleu); color:var(--blanc-p); }
.contact-l .eyebrow { color:rgba(255,255,255,.4); }
.c-title { font-family:var(--serif); font-size:3.5rem; font-weight:300; line-height:.95; margin-bottom:60px; color:var(--blanc-p); }
.c-row   { display:flex; align-items:flex-start; gap:20px; margin-bottom:32px; }
.c-icon  { width:42px; height:42px; border:1px solid rgba(255,255,255,.12); display:flex; align-items:center; justify-content:center; font-size:.95rem; flex-shrink:0; }
.c-label { font-size:.6rem; letter-spacing:.15em; text-transform:uppercase; color:rgba(255,255,255,.35); margin-bottom:5px; }
.c-val   { font-size:.9rem; line-height:1.65; color:rgba(255,255,255,.8); }
.c-tel   { font-size:1.4rem; font-family:var(--serif); font-weight:400; color:var(--blanc-p); }
.contact-r { padding:100px 56px; background:var(--blanc); display:flex; flex-direction:column; justify-content:center; }
.h-title { font-family:var(--serif); font-size:2.2rem; font-weight:300; color:var(--bleu); margin-bottom:40px; line-height:1.1; }
.h-row   { display:flex; justify-content:space-between; align-items:center; padding:13px 0; border-bottom:1px solid var(--gris-cl); font-size:.85rem; }
.h-jour  { color:var(--gris); }
.h-heure { font-weight:500; color:var(--bleu); }
.open-badge { display:inline-flex; align-items:center; gap:6px; margin-top:28px; background:#edf7ed; color:#2d6a2f; padding:10px 18px; font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; }
.open-dot   { width:6px; height:6px; border-radius:50%; background:#4caf50; animation:blink 1.4s infinite; }

/* ── FOOTER ── */
.site-footer { background:var(--bleu); border-top:1px solid rgba(255,255,255,.06); padding:72px 56px 40px; }
.ft-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:56px; margin-bottom:56px; padding-bottom:48px; border-bottom:1px solid rgba(255,255,255,.07); }
.ft-brand img, .ft-brand .custom-logo-link img, .ft-logo { width:44px; height:44px; border-radius:50%; margin-bottom:20px; object-fit:cover; }
.ft-brand p { font-size:.82rem; line-height:1.85; color:rgba(255,255,255,.35); max-width:260px; }
.ft-socials { display:flex; gap:16px; margin-top:20px; }
.ft-socials a { color:rgba(255,255,255,.3); transition:color .2s; }
.ft-socials a:hover { color:var(--blanc-p); }
.ft-col h4, .ft-col-title { font-size:.6rem; letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.25); margin-bottom:24px; }
.ft-col a  { display:block; font-size:.82rem; color:rgba(255,255,255,.45); text-decoration:none; margin-bottom:12px; transition:color .2s; }
.ft-col a:hover { color:var(--blanc-p); }
.ft-col ul { list-style:none; }
.ft-col li { font-size:.82rem; color:rgba(255,255,255,.45); margin-bottom:10px; display:flex; gap:8px; align-items:baseline; }
.ft-col li::before { content:'·'; color:var(--rouge); }
.ft-bot { display:flex; justify-content:space-between; align-items:center; }
.ft-legal { font-size:.68rem; color:rgba(255,255,255,.2); max-width:500px; line-height:1.7; }
.ft-pay   { display:flex; gap:10px; }
.ft-pay span { border:1px solid rgba(255,255,255,.1); padding:6px 12px; font-size:.6rem; letter-spacing:.1em; color:rgba(255,255,255,.3); }

/* ── REVEAL ANIMATIONS ── */
.reveal { opacity:0; transform:translateY(28px); transition:opacity .8s ease, transform .8s ease; }
.reveal.on { opacity:1; transform:translateY(0); }

/* ── KEYFRAMES ── */
@keyframes glowPulse  { 0%,100%{transform:scale(1);opacity:.7} 50%{transform:scale(1.15);opacity:1} }
@keyframes logoPulse  { 0%,100%{box-shadow:0 0 0 12px rgba(192,57,43,.08),0 0 60px rgba(192,57,43,.2)} 50%{box-shadow:0 0 0 20px rgba(192,57,43,.04),0 0 80px rgba(192,57,43,.35)} }
@keyframes floatAnim  { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-16px) rotate(3deg)} }
@keyframes fadeUp     { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:translateY(0)} }
@keyframes marquee    { from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes scrollLine { 0%{transform:scaleY(0);transform-origin:top} 50%{transform:scaleY(1);transform-origin:top} 51%{transform:scaleY(1);transform-origin:bottom} 100%{transform:scaleY(0);transform-origin:bottom} }
@keyframes blink      { 0%,100%{opacity:1} 50%{opacity:.3} }

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  .topbar { padding:0 24px; }
  .s-offre,.s-concept,.s-contact { grid-template-columns:1fr; }
  .offre-img { min-height:50vh; }
  .prod-grid { grid-template-columns:1fr 1fr; grid-template-rows:auto; }
  .prod-card.big { grid-row:span 1; }
  .ft-grid { grid-template-columns:1fr 1fr; gap:32px; }
  .concept-vis { min-height:50vh; }
}
@media(max-width:768px){
  /* Nav mobile */
  .nav-links { display:none !important; }
  .nav-btn   { display:none !important; }
  .nav-toggle { display:flex !important; }
  .topbar { padding:0 20px; }

  /* Hero */
  .hero-logo, .hero-logo-wrap img,
  .hero-logo-wrap .custom-logo-link img { width:90px !important; height:90px !important; }
  .hero-title { font-size:clamp(2.2rem,9vw,3.5rem); }
  .hero-desc  { font-size:.85rem; }
  .hero-actions { flex-direction:column; gap:12px; width:100%; }
  .btn-rouge, .btn-outline { width:100%; text-align:center; justify-content:center; }

  /* Sections */
  .s-boutique { padding:80px 20px; }
  .boutique-head { flex-direction:column; align-items:flex-start; gap:12px; }
  .boutique-h-sub { text-align:left; max-width:100%; }
  .prod-grid { grid-template-columns:1fr 1fr; min-height:auto; }
  .prod-card.big { grid-row:span 1; }

  .offre-txt  { padding:64px 20px; }
  .concept-txt { padding:64px 20px; }
  .contact-l, .contact-r { padding:64px 20px; }
  .concept-stats { gap:28px; }
  .stat-n { font-size:2.4rem; }

  /* Footer */
  .site-footer { padding:56px 20px 32px; }
  .ft-grid { grid-template-columns:1fr; gap:32px; }
  .ft-bot  { flex-direction:column; gap:20px; text-align:center; }
  .ft-pay  { justify-content:center; }

  /* Marquee */
  .m-item { padding:0 24px; font-size:.9rem; }
}
@media(max-width:480px){
  .prod-grid { grid-template-columns:1fr; }
  .hero-title { font-size:clamp(2rem,10vw,3rem); }
  .s-boutique::before { display:none; }
}
