/* Le Sumo — feuille de style éditoriale */
:root{
  --ink:#171210;        /* presque noir, chaud */
  --ink2:#3a2e27;
  --paper:#efe7da;      /* crème washi */
  --paper2:#f6f0e6;
  --card:#fbf7ef;
  --red:#b22126;        /* rouge laque, désaturé */
  --red-dark:#7d1418;
  --gold:#b4884a;       /* or vieilli, pas brillant */
  --muted:#7c6f63;
  --line:#d9cdba;
  --line-dk:#c4b6a0;
  --maxw:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Poppins',system-ui,sans-serif;
  font-weight:300;
  color:var(--ink);
  background-color:var(--paper);
  /* grain washi très léger + dégradé chaud, pas un gradient flashy */
  background-image:
    radial-gradient(900px 600px at 100% -10%, rgba(178,33,38,.06), transparent 60%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E");
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:'Noto Serif JP',Georgia,serif;line-height:1.12;margin:0 0 .4em;font-weight:700}
a{color:var(--red);text-decoration:none;transition:color .2s}
a:hover{color:var(--red-dark)}
img{max-width:100%;display:block}
::selection{background:var(--red);color:#fff}

/* ---------- NAV ---------- */
.nav{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:1rem clamp(1.1rem,4vw,3rem);
  background:rgba(23,18,16,.94);
  backdrop-filter:blur(6px);
  border-bottom:1px solid rgba(180,136,74,.35);
}
.brand{display:flex;align-items:baseline;gap:.55rem;color:var(--paper)}
.brand:hover{color:#fff}
.brand-mark{font-family:'Noto Serif JP',serif;font-size:1.35rem;color:var(--red);font-weight:700}
.brand-name{font-family:'Noto Serif JP',serif;font-size:1.15rem;letter-spacing:.12em;text-transform:uppercase;font-weight:500}
.links{display:flex;align-items:center;gap:.2rem}
.links a{
  position:relative;color:#d8cdc0;padding:.45rem .9rem;
  font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;font-weight:400;
}
.links a::after{
  content:"";position:absolute;left:.9rem;right:.9rem;bottom:.25rem;height:1px;
  background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .28s ease;
}
.links a:hover{color:#fff}
.links a:hover::after,.links a.active::after{transform:scaleX(1)}
.links a.active{color:var(--gold)}
.links a.cta{
  margin-left:.6rem;color:#fff;border:1px solid var(--gold);padding:.5rem 1.1rem;
}
.links a.cta::after{display:none}
.links a.cta:hover{background:var(--gold);color:var(--ink)}
.navtoggle,.burger{display:none}

/* ---------- HERO ---------- */
.hero{
  position:relative;min-height:88vh;display:flex;align-items:flex-end;
  color:#f3e9da;overflow:hidden;
  background:
    linear-gradient(180deg,rgba(15,10,9,.2) 0%,rgba(15,10,9,.55) 55%,rgba(15,10,9,.92) 100%),
    radial-gradient(120% 90% at 80% 0%, #4a1d17 0%, #2a1813 45%, #140d0b 100%);
}
.hero-overlay{
  position:absolute;inset:0;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.06'/%3E%3C/svg%3E");
}
.hero::after{
  content:"相撲";position:absolute;right:3vw;top:50%;transform:translateY(-50%);
  writing-mode:vertical-rl;font-family:'Noto Serif JP',serif;font-weight:700;
  font-size:clamp(7rem,22vw,18rem);color:rgba(243,233,218,.05);letter-spacing:.05em;
  pointer-events:none;line-height:1;
}
.hero-inner{
  position:relative;z-index:2;width:100%;max-width:var(--maxw);
  margin:0 auto;padding:0 clamp(1.1rem,4vw,3rem) clamp(3rem,8vh,6rem);
}
.kicker{
  display:inline-block;font-size:.72rem;letter-spacing:.42em;text-transform:uppercase;
  color:var(--gold);margin:0 0 1.4rem;padding-left:.2em;
}
.kicker::before{content:"";display:inline-block;width:34px;height:1px;background:var(--gold);
  vertical-align:middle;margin-right:.9em}
.hero h1{
  font-size:clamp(3.4rem,11vw,8rem);margin:0;letter-spacing:-.02em;
  text-shadow:0 6px 40px rgba(0,0,0,.45);
}
.lead{
  max-width:46ch;font-size:clamp(1rem,2vw,1.25rem);color:#e4d6c2;
  margin:1.2rem 0 2.2rem;font-weight:300;
}
.hero-btns{display:flex;gap:1rem;flex-wrap:wrap}

/* ---------- BOUTONS (carrés, éditoriaux) ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.6em;
  padding:.9rem 1.7rem;font-weight:500;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;
  border:1px solid transparent;cursor:pointer;transition:.22s ease;
}
.btn-primary{background:var(--red);color:#fff}
.btn-primary:hover{background:var(--red-dark);color:#fff}
.btn-ghost{border-color:rgba(243,233,218,.45);color:#f3e9da;background:transparent}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold)}

/* ---------- SECTIONS ---------- */
.section{max-width:var(--maxw);margin:0 auto;padding:clamp(3.5rem,9vw,7rem) clamp(1.1rem,4vw,3rem)}

/* eyebrow réutilisable via h2 dans intro */
.intro{
  display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);gap:clamp(2rem,6vw,5rem);
  align-items:start;text-align:left;max-width:var(--maxw);
}
.intro h2{
  font-size:clamp(2rem,4.5vw,3.1rem);color:var(--ink);position:relative;padding-top:1.4rem;
}
.intro h2::before{
  content:"明 — Notre maison";position:absolute;top:0;left:0;
  font-family:'Poppins',sans-serif;font-weight:600;font-size:.72rem;letter-spacing:.34em;
  text-transform:uppercase;color:var(--red);
}
.intro-text{color:var(--ink2);font-size:1.12rem;font-weight:300;border-left:2px solid var(--gold);padding-left:1.6rem}

/* ---------- ATOUTS (liste hairline, pas de cartes flottantes) ---------- */
.atouts{padding-top:0}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0;
  border-top:1px solid var(--line-dk)}
.card{
  background:transparent;border:none;border-bottom:1px solid var(--line-dk);
  border-right:1px solid var(--line-dk);
  padding:2.4rem 1.8rem;text-align:left;transition:background .25s;position:relative;
}
.card:hover{background:var(--card)}
.cards .card:nth-child(odd){border-left:1px solid var(--line-dk)}
.card-icon{font-size:1.5rem;color:var(--red);margin-bottom:1.1rem}
.card h3{font-family:'Poppins',sans-serif;font-weight:600;font-size:1.02rem;letter-spacing:.02em;color:var(--ink);text-transform:uppercase}
.card h3{font-size:1.05rem}
.card p{color:var(--muted);margin:.3rem 0 0;font-size:.92rem}

/* ---------- BANDEAU ---------- */
.band{
  background:
    linear-gradient(rgba(20,13,11,.86),rgba(20,13,11,.86)),
    radial-gradient(120% 120% at 0% 0%, #4a1d17, #140d0b);
  color:#f3e9da;text-align:center;position:relative;
}
.band-inner{max-width:760px;margin:0 auto;padding:clamp(3.5rem,8vw,5.5rem) 1.5rem}
.band h2{font-size:clamp(1.9rem,4.5vw,3rem)}
.band p{color:#d9c9b4;margin:.6rem 0 2rem;font-weight:300}
.band .hero-btns{justify-content:center}

/* ---------- PAGEHEAD ---------- */
.pagehead{
  position:relative;padding:clamp(4rem,9vw,6rem) clamp(1.1rem,4vw,3rem) clamp(2rem,5vw,3rem);
  background:radial-gradient(120% 140% at 90% 0%, #3a1813, #140d0b);
  color:#f3e9da;overflow:hidden;
}
.pagehead::after{
  content:"献立";position:absolute;right:4vw;bottom:-2rem;font-family:'Noto Serif JP',serif;
  font-size:clamp(5rem,16vw,12rem);color:rgba(243,233,218,.05);font-weight:700;pointer-events:none;
}
.pagehead h1{font-size:clamp(2.6rem,7vw,4.5rem);margin:0;letter-spacing:-.01em;max-width:var(--maxw);margin-inline:auto}
.pagehead p{color:var(--gold);margin:.6rem auto 0;max-width:var(--maxw);font-size:.82rem;letter-spacing:.2em;text-transform:uppercase}

/* ---------- MENU ---------- */
.menu{display:block}
.menu-cat{margin-bottom:clamp(2.5rem,5vw,3.8rem)}
.menu-cat h2{
  display:flex;align-items:baseline;gap:1rem;color:var(--red-dark);
  font-family:'Beau Rivage',cursive;font-weight:400;font-size:clamp(2.6rem,5vw,3.6rem);
  line-height:1;margin-bottom:1.4rem;
}
.menu-cat h2::after{content:"";flex:1;height:1px;background:var(--line-dk);transform:translateY(-.4rem)}
.menu-list{list-style:none;margin:0;padding:0;display:grid;gap:1.3rem}
.mi-head{display:flex;align-items:baseline;gap:.6rem}
.mi-nom{font-family:'Beau Rivage',cursive;font-weight:400;color:var(--ink);font-size:1.9rem;line-height:1.1}
.mi-dots{flex:1;border-bottom:1px dotted var(--line-dk);transform:translateY(-7px)}
.mi-prix{font-family:'Noto Serif JP',serif;font-weight:700;color:var(--red);white-space:nowrap;font-size:1.02rem}
.mi-desc{margin:.2rem 0 0;color:var(--muted);font-size:.9rem;max-width:60ch}
.menu-note{margin-top:2.5rem;padding-top:1.2rem;border-top:1px solid var(--line);color:var(--muted);font-size:.82rem;font-style:italic}

/* ---------- CONTACT ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,4.5rem)}
.contact-info h2,.contact-form h2{
  color:var(--ink);font-size:1.3rem;margin-top:2.2rem;position:relative;padding-bottom:.6rem;
}
.contact-info h2::after,.contact-form h2::after{
  content:"";position:absolute;left:0;bottom:0;width:40px;height:2px;background:var(--red)}
.contact-info h2:first-child,.contact-form h2{margin-top:0}
.contact-info p{margin:.4rem 0 1.3rem;color:var(--ink2)}
.contact-info strong{font-family:'Poppins',sans-serif;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-weight:600}
.hours{width:100%;border-collapse:collapse;margin-top:.4rem}
.hours td{padding:.7rem 0;border-bottom:1px solid var(--line);font-size:.95rem}
.hours td:first-child{color:var(--ink2)}
.hours td:last-child{text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}
.hours tr:last-child td{border-bottom:none}
.hours tr.is-today td{color:var(--red-dark);font-weight:600}
.hours tr.is-today td:first-child{position:relative;padding-left:1rem}
.hours tr.is-today td:first-child::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:5px;height:5px;background:var(--red);border-radius:50%}

/* ---------- FORM ---------- */
form{display:grid;gap:1.2rem}
label{display:grid;gap:.4rem;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--muted)}
input,textarea{
  font-family:inherit;font-size:1rem;font-weight:300;padding:.8rem .95rem;
  border:1px solid var(--line-dk);background:var(--card);color:var(--ink);
  transition:border-color .2s;
}
input:focus,textarea:focus{outline:none;border-color:var(--red)}
.contact-form .btn{justify-self:start;margin-top:.4rem}
.alert{padding:1rem 1.2rem;margin-bottom:1.2rem;font-size:.92rem;border-left:3px solid}
.alert.ok{background:#eef4ea;color:#36622f;border-color:#5f8a4f}
.alert.ko{background:#f7eae9;color:#8e2420;border-color:var(--red)}

/* ---------- FOOTER ---------- */
.foot{background:var(--ink);color:#b3a596;padding:clamp(3rem,6vw,4rem) clamp(1.1rem,4vw,3rem) 1.6rem;
  border-top:3px solid var(--red)}
.foot-grid{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:2.2fr 1fr 1fr;gap:2.5rem}
.foot-brand{font-family:'Noto Serif JP',serif;font-size:1.5rem;color:#f3e9da;margin-bottom:.6rem;letter-spacing:.04em}
.foot h4{color:var(--gold);font-family:'Poppins',sans-serif;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;margin-bottom:.9rem;font-weight:600}
.foot p{margin:.3rem 0;font-size:.92rem;font-weight:300}
.foot a{color:#c5b8a8}
.foot a:hover{color:var(--gold)}
.foot-bottom{max-width:var(--maxw);margin:2.5rem auto 0;padding-top:1.4rem;border-top:1px solid #2e241d;
  font-size:.78rem;letter-spacing:.04em;color:#7d7064;text-align:left}

/* ---------- RESPONSIVE ---------- */
@media(max-width:860px){
  .intro{grid-template-columns:1fr;gap:1.4rem}
  .intro-text{padding-left:1.1rem}
  .contact-grid{grid-template-columns:1fr;gap:2.2rem}
  .foot-grid{grid-template-columns:1fr;gap:1.6rem}
  .cards .card,.cards .card:nth-child(odd){border-left:1px solid var(--line-dk)}
  .hero{align-items:flex-end;min-height:80vh}
  .burger{display:flex;align-items:center;justify-content:center;color:#f3e9da;font-size:1.2rem;cursor:pointer;width:42px;height:42px;border:1px solid rgba(243,233,218,.3)}
  .links{
    position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;
    background:rgba(23,18,16,.98);padding:.6rem;gap:.1rem;display:none;
    border-bottom:1px solid var(--gold);
  }
  .navtoggle:checked ~ .links{display:flex}
  .links a{padding:.8rem 1rem}
  .links a::after{display:none}
  .links a.cta{margin:.4rem 0 0;text-align:center}
}