:root { --ink:#1d1c19; --paper:#f5f1e9; --rust:#9d3b26; --line:#d9d0c2; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Noto Serif JP", serif; font-size:16px; letter-spacing:.05em; }
a { color:inherit; text-decoration:none; }
.u-phrase { display:inline-block; }
.site-header { height:76px; width:100%; position:absolute; z-index:10; top:0; display:flex; align-items:center; padding:0 clamp(20px, 4vw, 64px); color:#fff; border-bottom:1px solid rgba(255,255,255,.25); transition:background-color .25s; }
.logo { font:600 29px/1 "Outfit", sans-serif; letter-spacing:.08em; margin-right:auto; }.logo span { color:#d68156; }
.desktop-nav { display:flex; align-items:center; gap:25px; margin-right:34px; }.nav-link { position:relative; font:500 11px/1 "Outfit",sans-serif; letter-spacing:.14em; }.nav-link::after { content:""; position:absolute; left:0; bottom:-7px; width:0; height:1px; background:currentColor; transition:width .3s ease; }.nav-link:hover::after { width:100%; }
.header-actions { display:flex; align-items:center; gap:20px; font-size:12px; }.tel-link { letter-spacing:.08em; }.reserve-link { padding:12px 18px; background:var(--rust); font-size:12px; transition:background-color .25s; }.reserve-link:hover { background:#762716; }
.hero { min-height:720px; height:100svh; position:relative; color:#fff; display:flex; align-items:center; overflow:hidden; }.hero__image { position:absolute; inset:-5%; background:url('/assets/images/dada-yakitori.jpg') center/cover; transform:scale(1.08); }.hero__shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(16,13,9,.76),rgba(16,13,9,.32) 55%,rgba(16,13,9,.14)); }.hero__content { position:relative; width:min(1200px,100% - 48px); margin:64px auto 0; }.hero__eyebrow,.hero__sub { font:500 11px/1.5 "Outfit",sans-serif; letter-spacing:.2em; }.hero__eyebrow { margin:0 0 22px; color:#e5b087; }.hero__title { margin:0; font-size:clamp(38px,5.3vw,70px); line-height:1.45; letter-spacing:.14em; font-weight:500; word-break:keep-all; text-wrap:balance; }.hero__sub { margin:24px 0 33px; color:rgba(255,255,255,.82); }.hero__cta { display:inline-flex; align-items:center; gap:30px; padding:15px 0; border-bottom:1px solid #e5b087; font-size:14px; }.hero__cta span { font-size:22px; transition:transform .3s; }.hero__cta:hover span { transform:translateX(6px); }.scroll-cue { position:absolute; bottom:27px; left:clamp(20px,4vw,64px); font:500 10px "Outfit",sans-serif; letter-spacing:.2em; display:flex; gap:11px; align-items:center; }.scroll-cue span { height:1px; width:40px; background:#fff; }
.section { padding:100px 24px; scroll-margin-top:76px; }.section-heading { text-align:center; }.section-heading__en { margin:0 0 10px; color:var(--rust); font:500 11px "Outfit",sans-serif; letter-spacing:.3em; }.section-heading__ja { margin:0; font-size:32px; line-height:1.4; letter-spacing:.16em; font-weight:500; word-break:keep-all; }.section-heading__line { height:2px; width:0; margin:18px auto 0; background:var(--rust); transition:width .8s cubic-bezier(.4,0,.2,1) .2s; }.is-visible .section-heading__line { width:40px; }.about { background:#fffdf8; }.about__grid,.access__grid { width:min(1000px,100%); margin:60px auto 0; display:grid; grid-template-columns:1fr 1fr; gap:clamp(36px,7vw,100px); align-items:center; }.about__image { margin:0; overflow:hidden; }.about__image img { display:block; width:100%; aspect-ratio:4/5; object-fit:cover; }.about__copy { max-width:39em; line-height:2.05; }.about__copy p { margin:0 0 24px; text-wrap:pretty; }.text-link,.outline-link { display:inline-flex; gap:16px; align-items:center; margin-top:12px; border-bottom:1px solid var(--rust); padding-bottom:8px; color:var(--rust); font-size:14px; }.text-link span { font-size:19px; }.menu { background:#eee7db; }.menu__lead { max-width:42em; margin:34px auto 46px; text-align:center; font-size:14px; line-height:1.9; }.menu__grid { max-width:1000px; margin:auto; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }.menu-card { padding:30px; background:#fffdf8; }.menu-card h3 { margin:0 0 20px; padding-bottom:12px; border-bottom:1px solid var(--ink); font-size:19px; letter-spacing:.1em; }.menu-card dl { margin:0; }.menu-card dl div { display:flex; justify-content:space-between; gap:16px; padding:10px 0; border-bottom:1px solid #e5ded2; font-size:14px; }.menu-card dt,.menu-card dd { margin:0; }.menu-card dd { white-space:nowrap; }.outline-link { display:flex; width:max-content; margin:42px auto 0; padding:14px 24px; border:1px solid var(--rust); color:var(--rust); }.gallery { background:var(--ink); color:#fff; }.section-heading--light .section-heading__en { color:#e5b087; }.section-heading--light .section-heading__line { background:#e5b087; }.gallery__grid { max-width:1100px; margin:60px auto 0; display:grid; grid-template-columns:1.1fr .9fr 1fr; grid-template-rows:220px 220px; gap:12px; }.gallery__grid figure { overflow:hidden; margin:0; }.gallery__grid figure:first-child { grid-row:span 2; }.gallery__grid figure:last-child { grid-column:span 2; }.gallery__grid img { width:100%; height:100%; display:block; object-fit:cover; transition:transform .4s; }.gallery__grid figure:hover img { transform:scale(1.04); }.gallery__instagram { width:max-content; margin:35px auto 0; display:flex; gap:16px; color:#e5b087; border-bottom:1px solid currentColor; padding-bottom:8px; font-size:14px; }.news { background:#f5f1e9; }.news__list { max-width:1000px; margin:60px auto 0; border-top:1px solid var(--line); }.news__item { min-height:77px; padding:18px 0; border-bottom:1px solid var(--line); display:grid; grid-template-columns:110px 115px 1fr 20px; align-items:center; gap:14px; transition:color .2s; }.news__item:hover { color:var(--rust); }.news__item time,.news__item span { font:500 11px "Outfit",sans-serif; letter-spacing:.08em; }.news__item span { padding:5px 8px; border:1px solid currentColor; text-align:center; }.news__item strong { font-size:14px; line-height:1.7; font-weight:500; }.news__item b { font:400 18px/1 "Outfit",sans-serif; }.store-info { margin:0; border-top:1px solid var(--line); }.store-info div { display:grid; grid-template-columns:105px 1fr; gap:18px; padding:16px 0; border-bottom:1px solid var(--line); }.store-info dt { font-size:13px; color:#625d54; }.store-info dd { margin:0; line-height:1.8; font-size:14px; }.store-info dd a { text-decoration:underline; text-underline-offset:4px; }.map { min-height:420px; }.map iframe { width:100%; height:100%; min-height:420px; border:0; filter:grayscale(1) contrast(.9); }.contact { padding:90px max(24px,calc((100% - 1000px)/2)); background:var(--rust); color:#fff; display:flex; justify-content:space-between; gap:40px; align-items:center; }.contact__eyebrow { margin:0 0 10px; color:#f6c6a8; font:500 11px "Outfit",sans-serif; letter-spacing:.3em; }.contact h2 { margin:0; font-size:clamp(28px,3vw,42px); font-weight:500; line-height:1.5; letter-spacing:.12em; word-break:keep-all; }.contact p:not(.contact__eyebrow) { font-size:14px; }.contact__actions { display:flex; flex-wrap:wrap; gap:12px; }.btn-primary,.btn-outline { min-height:50px; padding:14px 20px; display:inline-flex; align-items:center; justify-content:center; gap:15px; font-size:13px; letter-spacing:.08em; }.btn-primary { background:#fff; color:var(--rust); }.btn-outline { border:1px solid #fff; }.nav-toggle,.nav-mobile { display:none; } footer { padding:52px 24px 26px; background:#151412; color:#fff; text-align:center; } footer .logo { display:block; margin-bottom:22px; } footer p,footer a:not(.logo) { margin:10px auto; display:block; font-size:12px; line-height:1.8; color:#ddd4c7; } footer p:last-child { margin-top:35px; font:10px "Outfit",sans-serif; letter-spacing:.12em; }.to-top { width:46px; height:46px; position:fixed; right:20px; bottom:20px; display:grid; place-items:center; background:var(--ink); color:#fff; opacity:0; visibility:hidden; transition:.25s; z-index:5; }.to-top.is-visible { opacity:1; visibility:visible; }
#loading { position:fixed; inset:0; z-index:100; background:var(--ink); display:grid; place-items:center; color:#fff; transition:opacity .45s,visibility .45s; }#loading span { font:600 40px "Outfit",sans-serif; letter-spacing:.15em; }#loading.is-hidden { opacity:0; visibility:hidden; }.char { display:inline-block; opacity:0; transform:translateY(.4em); transition:opacity .5s ease-out,transform .5s ease-out; }.is-visible .char { opacity:1; transform:translateY(0); }[data-animate] { opacity:0; transform:translateY(16px); transition:opacity .6s ease-out,transform .6s ease-out; }[data-animate].is-visible { opacity:1; transform:translateY(0); }
@media (max-width:920px) { .site-header { height:64px; padding:0 20px; position:fixed; background:rgba(29,28,25,.88); backdrop-filter:blur(8px); }.desktop-nav,.tel-link { display:none; }.header-actions { margin-left:auto; order:2; }.reserve-link { padding:10px 13px; }.nav-toggle { display:inline-flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; width:48px; height:48px; margin-left:4px; border:0; background:transparent; color:#fff; position:relative; z-index:9001; order:3; }.nav-toggle::before,.nav-toggle::after,.nav-toggle span { content:""; display:block; width:22px; height:1px; background:currentColor; transition:transform .3s,opacity .2s; }.nav-mobile { position:fixed; inset:0; z-index:9000; background:#1d1c19; color:#fff; align-items:center; justify-content:center; flex-direction:column; opacity:0; visibility:hidden; transition:opacity .3s,visibility .3s; }.nav-mobile.is-open { display:flex; opacity:1; visibility:visible; }.nav-mobile a { min-height:48px; display:flex; align-items:center; font-size:18px; letter-spacing:.12em; }.nav-open .nav-toggle::before { transform:translateY(6px) rotate(45deg); }.nav-open .nav-toggle span { opacity:0; }.nav-open .nav-toggle::after { transform:translateY(-6px) rotate(-45deg); } }
@media (max-width:767px) { .hero { min-height:620px; }.hero__content { width:calc(100% - 40px); margin-top:38px; }.hero__title { font-size:39px; line-height:1.55; letter-spacing:.1em; }.hero__sub { margin-top:18px; font-size:9px; letter-spacing:.13em; }.section { padding:64px 20px; scroll-margin-top:64px; }.section-heading__ja { font-size:26px; }.about__grid,.access__grid { margin-top:42px; grid-template-columns:1fr; gap:30px; }.about__image { order:2; }.menu__lead { margin:30px auto 32px; text-align:left; font-size:13px; }.menu__grid { grid-template-columns:1fr; gap:10px; }.menu-card { padding:24px 20px; }.gallery__grid { margin-top:42px; grid-template-columns:1fr 1fr; grid-template-rows:170px 170px 150px; gap:7px; }.gallery__grid figure:first-child { grid-row:span 2; }.gallery__grid figure:last-child { grid-column:span 2; }.news__list { margin-top:42px; }.news__item { grid-template-columns:1fr 18px; gap:5px 10px; padding:17px 0; }.news__item time { grid-column:1; }.news__item span { grid-column:1; grid-row:1; justify-self:end; }.news__item strong { grid-column:1; grid-row:2; font-size:13px; }.news__item b { grid-column:2; grid-row:1 / span 2; }.map { min-height:300px; }.map iframe { min-height:300px; }.contact { padding:64px 20px; flex-direction:column; align-items:flex-start; gap:28px; }.contact h2 { font-size:29px; }.contact__actions { width:100%; flex-direction:column; }.btn-primary,.btn-outline { width:100%; }.scroll-cue { left:20px; } }
@media (min-width:768px) { .br-sp { display:none; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important; transition-delay:.01ms!important; }.char,[data-animate] { opacity:1; transform:none; }.section-heading__line { width:40px; } }
