/* 純喫茶マーキー 2026 */
/* なめらかスクロールの部品の決まり（lenis.css をそのまま取り込み） */
html.lenis,
html.lenis body {
  height: auto;
}

.lenis:not(.lenis-autoToggle).lenis-stopped {
  overflow: clip;
}

.lenis [data-lenis-prevent],
.lenis [data-lenis-prevent-wheel],
.lenis [data-lenis-prevent-touch],
.lenis [data-lenis-prevent-vertical],
.lenis [data-lenis-prevent-horizontal] {
  overscroll-behavior: contain;
}

.lenis.lenis-smooth iframe {
  pointer-events: none;
}

.lenis.lenis-autoToggle {
  transition-property: overflow;
  transition-duration: 1ms;
  transition-behavior: allow-discrete;
}
.lenis.lenis-smooth .map iframe{pointer-events:auto}

:root{
  --green:#0e3b2c;--green-2:#154a38;--green-3:#1f5e47;
  --cream:#f4ecdf;--paper:#fbf7f0;--ink:#1d1611;--espresso:#241911;
  --cherry:#b3122e;--brass:#a8834d;--brass-text:#7f5f30;--muted:#5e5246;--line:rgba(29,22,17,.1);
  --serif:"Shippori Mincho B1","Hiragino Mincho ProN","Yu Mincho",serif;
  --en:"Fraunces","Shippori Mincho B1",serif;
  --sans:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",system-ui,sans-serif;
  --ease:cubic-bezier(.32,.72,0,1);
  --r:2rem;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.9 var(--sans);letter-spacing:.02em;overflow-x:clip}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
button{font:inherit;color:inherit}
h1,h2,h3,p,ol,ul,dl,dd,figure{margin:0}
ol,ul{padding:0;list-style:none}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--cherry);outline-offset:3px}

/* 紙の質感（固定の層） */
.grain{position:fixed;inset:0;z-index:60;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%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)'/%3E%3C/svg%3E")}

/* 見出しの段（4段） */
.hero-ttl{font:500 clamp(3.4rem,9.2vw,8.75rem)/1.04 var(--serif);letter-spacing:.04em}
.h2{font:500 clamp(2rem,4.2vw,3.5rem)/1.3 var(--serif);letter-spacing:.06em}
.h3{font:700 1.3rem/1.5 var(--serif);letter-spacing:.06em}
.tag{display:inline-flex;align-items:center;gap:.6em;margin-bottom:1.6rem;padding:.35rem .9rem;border-radius:999px;background:rgba(14,59,44,.07);color:var(--green);font:500 .72rem/1 var(--en);letter-spacing:.24em;text-transform:uppercase}
.tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--cherry)}
.tag-light{background:rgba(244,236,223,.1);color:var(--cream)}

.sec{padding:clamp(6rem,14vw,11rem) clamp(1rem,5vw,4.5rem)}

/* 二重の枠 */
.bezel{padding:.45rem;border-radius:var(--r);background:rgba(29,22,17,.04);box-shadow:inset 0 0 0 1px rgba(29,22,17,.06)}
.bezel-core{overflow:hidden;border-radius:calc(var(--r) - .45rem);background:#fff;box-shadow:inset 0 1px 1px rgba(255,255,255,.7),0 30px 60px -30px rgba(36,25,17,.18)}
.bezel-dark{background:rgba(244,236,223,.05);box-shadow:inset 0 0 0 1px rgba(244,236,223,.1)}
.bezel-dark .bezel-core{background:var(--green-2);box-shadow:inset 0 1px 1px rgba(255,255,255,.08)}

/* ボタン（文字は真ん中 矢印は右端） */
.pill{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:15rem;min-height:3.5rem;padding:.5rem 3.75rem .5rem 1.75rem;border:0;border-radius:999px;font:700 .95rem/1.4 var(--sans);letter-spacing:.08em;text-decoration:none;cursor:pointer;transition:transform .5s var(--ease),background .5s var(--ease)}
.pill-txt{display:block;width:100%;text-align:center}
.pill-ico{position:absolute;right:.4rem;top:50%;display:grid;place-items:center;width:2.7rem;height:2.7rem;border-radius:50%;transform:translateY(-50%);transition:transform .6s var(--ease)}
.pill:hover .pill-ico{transform:translate(3px,calc(-50% - 1px)) scale(1.05)}
.pill:active{transform:scale(.98)}
.pill-light{background:var(--cream);color:var(--green)}
.pill-light .pill-ico{background:var(--green);color:var(--cream)}
.pill-cream{background:var(--cream);color:var(--green)}
.pill-cream .pill-ico{background:var(--cherry);color:#fff}
.pill-dark{background:var(--green);color:var(--cream)}
.pill-dark .pill-ico{background:var(--cream);color:var(--green)}
.pill-dark:disabled{background:#9aa59f;cursor:not-allowed}
.pill-wide{width:100%}

/* 浮いたナビ */
.nav{position:fixed;top:1rem;left:50%;z-index:40;display:flex;align-items:center;gap:.25rem;padding:.4rem .4rem .4rem 1rem;border-radius:999px;background:rgba(251,247,240,.94);box-shadow:0 0 0 1px rgba(29,22,17,.06),0 18px 40px -18px rgba(36,25,17,.35);transform:translateX(-50%);transition:transform .6s var(--ease)}
.nav.hide{transform:translate(-50%,-140%)}
.nav-logo{display:flex;align-items:center;gap:.6rem;margin-right:.75rem;text-decoration:none}
.nav-mark{display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:var(--green);color:var(--cream);font:italic 500 1.05rem/1 var(--en)}
.nav-name{font:700 .95rem/1 var(--serif);letter-spacing:.12em;white-space:nowrap}
.nav-links{display:flex;align-items:center}
.nav-link{display:flex;align-items:center;gap:.35rem;padding:.65rem 1rem;border:0;border-radius:999px;background:none;font:500 .88rem/1 var(--sans);letter-spacing:.08em;text-decoration:none;cursor:pointer;transition:background .4s var(--ease)}
.nav-link:hover,.has-mega.open .nav-link{background:rgba(14,59,44,.07)}
.caret{width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .4s var(--ease)}
.has-mega.open .caret{transform:translateY(1px) rotate(225deg)}
.nav-cart{display:flex;align-items:center;gap:.6rem;margin-left:.5rem;padding:.55rem .55rem .55rem 1.1rem;border:0;border-radius:999px;background:var(--green);color:var(--cream);font:700 .85rem/1 var(--sans);letter-spacing:.08em;cursor:pointer;transition:transform .5s var(--ease)}
.nav-cart:active{transform:scale(.97)}
.nav-cart-count{display:grid;place-items:center;min-width:1.7rem;height:1.7rem;padding:0 .4rem;border-radius:999px;background:var(--cream);color:var(--green);font:500 .8rem/1 var(--en)}
.nav-cart-count.bump{animation:bump .6s var(--ease)}
@keyframes bump{40%{transform:scale(1.35)}}
.burger{display:none}

/* マウスを載せると出るメニュー */
.has-mega{position:relative}
.mega{position:absolute;top:calc(100% + 1rem);left:50%;width:min(780px,calc(100vw - 2rem));padding:.45rem;border-radius:var(--r);background:rgba(251,247,240,.97);box-shadow:0 0 0 1px rgba(29,22,17,.06),0 40px 80px -30px rgba(36,25,17,.4);opacity:0;visibility:hidden;transform:translate(-50%,-8px);transition:opacity .45s var(--ease),transform .55s var(--ease),visibility .45s}
.mega::before{content:"";position:absolute;inset:-1rem 0 auto;height:1rem}
.has-mega.open .mega{opacity:1;visibility:visible;transform:translate(-50%,0)}
.mega-inner{display:grid;grid-template-columns:repeat(3,1fr);gap:.45rem}
.mega-col{display:block;padding:.5rem .5rem 1.1rem;border-radius:calc(var(--r) - .45rem);background:#fff;text-decoration:none;opacity:0;transform:translateY(10px);transition:opacity .5s var(--ease),transform .6s var(--ease),background .3s}
.has-mega.open .mega-col{opacity:1;transform:none}
.has-mega.open .mega-col:nth-child(2){transition-delay:.06s}
.has-mega.open .mega-col:nth-child(3){transition-delay:.12s}
.mega-pic{display:block;overflow:hidden;aspect-ratio:4/3;margin-bottom:.9rem;border-radius:1.2rem}
.mega-pic img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.mega-col:hover .mega-pic img{transform:scale(1.06)}
.mega-kicker{display:block;padding:0 .6rem;color:var(--brass-text);font:500 .66rem/1.6 var(--en);letter-spacing:.24em}
.mega-ttl{display:block;padding:0 .6rem;font:700 1.15rem/1.6 var(--serif);letter-spacing:.1em}
.mega-list{display:block;padding:.3rem .6rem 0;color:var(--muted);font-size:.82rem;line-height:1.9}

/* スマホの全画面メニュー */
.sheet{position:fixed;inset:0;z-index:35;display:flex;align-items:center;padding:6rem 2rem 3rem;background:var(--green)}
.sheet nav{display:flex;flex-direction:column;gap:.5rem}
.sheet a{overflow:hidden;color:var(--cream);font:500 2.2rem/1.5 var(--serif);letter-spacing:.08em;text-decoration:none;opacity:0;transform:translateY(2.5rem);transition:opacity .6s var(--ease),transform .8s var(--ease)}
.sheet.on a{opacity:1;transform:none}
.sheet.on a:nth-child(2){transition-delay:.05s}.sheet.on a:nth-child(3){transition-delay:.1s}.sheet.on a:nth-child(4){transition-delay:.15s}.sheet.on a:nth-child(5){transition-delay:.2s}

/* 最初の画面 */
.hero{position:relative;height:200vh}
.hero-stage{position:sticky;top:0;height:100vh;height:100dvh;overflow:hidden;background:var(--paper)}
.hero-media{position:absolute;inset:0;overflow:hidden;will-change:clip-path}
.hero-media img{width:100%;height:100%;object-fit:cover;transform-origin:60% 40%}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(18,12,8,.82) 0%,rgba(18,12,8,.45) 45%,rgba(18,12,8,.05) 75%)}
.hero-copy{position:absolute;left:clamp(1.25rem,6vw,6rem);bottom:clamp(4.5rem,12vh,9rem);z-index:2;color:var(--cream)}
.eyebrow{display:flex;gap:1.5rem;margin-bottom:1.5rem;font:italic 300 1.05rem/1 var(--en);letter-spacing:.14em}
.eyebrow span+span::before{content:"";display:inline-block;width:2.5rem;height:1px;margin:0 1.5rem 0 0;background:currentColor;vertical-align:middle;opacity:.6}
.hero-ttl .line{display:block;overflow:hidden;padding-bottom:.06em}
.hero-ttl .line>span{display:inline-block;animation:rise 1.1s var(--ease) both}
.hero-ttl .line:nth-child(2)>span{animation-delay:.1s}
@keyframes rise{from{transform:translateY(105%)}}
.eyebrow,.hero-lead,.hero-copy .pill{animation:fadeup 1s var(--ease) both}
.eyebrow{animation-delay:.25s}.hero-lead{animation-delay:.35s}.hero-copy .pill{animation-delay:.45s}
@keyframes fadeup{from{opacity:0;transform:translateY(18px)}}
.hero-lead{margin:1.8rem 0 2.4rem;color:rgba(244,236,223,.85);font:500 1.05rem/2 var(--serif);letter-spacing:.12em}
.hero-scroll{position:absolute;right:clamp(1.25rem,4vw,3rem);bottom:2.5rem;z-index:2;color:var(--cream);font:italic 300 .8rem/1 var(--en);letter-spacing:.3em;writing-mode:vertical-rl}
.hero-scroll::after{content:"";display:block;width:1px;height:4.5rem;margin:1rem auto 0;background:linear-gradient(var(--cream),transparent);animation:drip 2.4s var(--ease) infinite}
@keyframes drip{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* 流れる文字 */
.ticker{overflow:hidden;padding:1.6rem 0;background:var(--green);color:var(--cream)}
.ticker-track{display:flex;align-items:center;gap:2.5rem;width:max-content;white-space:nowrap;will-change:transform}
.ticker span{font:italic 300 clamp(2.4rem,6vw,5.5rem)/1 var(--en);letter-spacing:.02em}
.ticker span:nth-of-type(3n+2){font:500 clamp(2rem,5vw,4.6rem)/1 var(--serif);letter-spacing:.08em}
.ticker i{color:var(--brass);font-style:normal;font-size:clamp(1.2rem,2.4vw,2rem)}

/* 物語 */
.story{max-width:1320px;margin:0 auto}
.statement{max-width:22em;font:500 clamp(1.7rem,3.6vw,3.1rem)/1.7 var(--serif);letter-spacing:.06em}
.statement .w{transition:opacity .2s}
.statement.armed .w{opacity:.14}
.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,6rem);align-items:center;margin-top:clamp(4rem,9vw,8rem)}
.story-pic .bezel-core img{width:100%;aspect-ratio:4/5;object-fit:cover}
.story-text .h2{margin-bottom:1.5rem}
.story-text>p{max-width:30em;color:var(--muted)}
.facts{display:grid;grid-template-columns:repeat(3,1fr);margin-top:3rem;border-top:1px solid var(--line)}
.facts div{padding:1.4rem 0 0}
.facts dt{color:var(--muted);font-size:.78rem;letter-spacing:.14em}
.facts dd{font:300 clamp(2rem,3.4vw,3rem)/1.2 var(--en)}

/* 看板メニュー */
.signature{position:relative;background:var(--cream)}
.sig-pin{display:flex;align-items:center;gap:clamp(2rem,4vw,4rem);height:100vh;height:100dvh;padding:0 clamp(1rem,5vw,4.5rem);overflow:hidden}
.sig-head{position:relative;z-index:2;flex:none;align-self:stretch;display:flex;flex-direction:column;justify-content:center;width:clamp(18rem,28vw,25rem);background:var(--cream);box-shadow:2.5rem 0 2.5rem var(--cream)}
.sig-head .tag{align-self:flex-start}
.sig-head .h2{margin-bottom:1rem}
.sig-note{color:var(--muted);font-family:var(--serif);letter-spacing:.1em}
.sig-track{display:flex;gap:1.5rem;will-change:transform}
.card{flex:none;width:clamp(19rem,27vw,25rem)}
.card-pic{overflow:hidden;aspect-ratio:4/3.2}
.card-pic img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.card:hover .card-pic img{transform:scale(1.05)}
.card-body{padding:1.4rem 1.5rem 1.5rem}
.card-no{color:var(--brass-text);font:italic 300 .95rem/1 var(--en);letter-spacing:.2em}
.card .h3{margin:.6rem 0 .3rem}
.card-body>p:not(.card-no){color:var(--muted);font-size:.88rem}
.card-foot{display:flex;align-items:center;justify-content:space-between;margin-top:1.3rem;padding-top:1.1rem;border-top:1px solid var(--line)}
.price{font:400 1.5rem/1 var(--en)}
.add{display:inline-flex;align-items:center;gap:.6rem;padding:.55rem .55rem .55rem 1rem;border:0;border-radius:999px;background:var(--green);color:var(--cream);font:700 .78rem/1 var(--sans);letter-spacing:.06em;cursor:pointer;transition:transform .5s var(--ease),background .4s var(--ease)}
.add span{display:grid;place-items:center;width:1.6rem;height:1.6rem;border-radius:50%;background:var(--cream);color:var(--green);font-size:1rem;transition:transform .6s var(--ease)}
.add:hover span{transform:rotate(90deg)}
.add:active{transform:scale(.96)}
.add.added{background:var(--cherry)}

/* 店内 */
.interior{position:relative;height:120vh;overflow:hidden;background:var(--espresso)}
.interior-media{position:absolute;inset:-12% 0;will-change:transform}
.interior-media img{width:100%;height:100%;object-fit:cover}
.interior::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(18,12,8,.25),rgba(18,12,8,.7))}
.interior-copy{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--cream);font:500 clamp(2.2rem,6vw,5.5rem)/1.45 var(--serif);letter-spacing:.14em;text-align:center}
.interior-copy span{display:block}

/* 年表 */
.history{max-width:1320px;margin:0 auto}
.history-lead{max-width:34em;margin-top:1.5rem;color:var(--muted);font-family:var(--serif);letter-spacing:.08em}
.timeline{position:relative;margin-top:clamp(3.5rem,7vw,6rem);padding-left:clamp(1.5rem,4vw,3rem)}
.timeline::before,.timeline::after{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--line)}
.timeline::after{background:var(--cherry);transform:scaleY(var(--p,0));transform-origin:top}
.tl-item{display:grid;grid-template-columns:minmax(9rem,18rem) 1fr;gap:clamp(1rem,4vw,4rem);padding:clamp(2rem,4vw,3.2rem) 0;border-bottom:1px solid var(--line)}
.tl-year{font:300 clamp(3rem,7vw,6rem)/1 var(--en);letter-spacing:-.01em;color:rgba(29,22,17,.5);transition:color .8s var(--ease)}
.tl-item.on .tl-year{color:var(--ink)}
.tl-item.is-now .tl-year{color:var(--cherry)}
.tl-body .h3{margin-bottom:.5rem}
.tl-body p{max-width:32em;color:var(--muted)}
.tl-link{display:inline-flex;align-items:center;gap:.6rem;margin-top:1rem;padding:.5rem .5rem .5rem 1.1rem;border-radius:999px;background:rgba(14,59,44,.07);color:var(--green);font:700 .82rem/1 var(--sans);letter-spacing:.06em;text-decoration:none;transition:background .4s var(--ease)}
.tl-link span{display:grid;place-items:center;width:1.7rem;height:1.7rem;border-radius:50%;background:var(--green);color:var(--cream);transition:transform .6s var(--ease)}
.tl-link:hover span{transform:translate(2px,-2px)}

/* モバイルオーダー */
.order{background:var(--green);color:var(--cream)}
.order-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,6rem);max-width:1320px;margin:0 auto;align-items:center}
.order-lead{margin:1.5rem 0 2.5rem;color:rgba(244,236,223,.78);font-family:var(--serif);letter-spacing:.08em}
.ways{display:grid;gap:1rem}
.ways .bezel-core{padding:1.6rem 1.8rem}
.way-no{color:var(--brass);font:italic 300 .95rem/1 var(--en);letter-spacing:.2em}
.ways .h3{margin:.5rem 0 .2rem;color:var(--cream)}
.ways p:not(.way-no){color:rgba(244,236,223,.72);font-size:.9rem}

/* アクセス */
.access{max-width:1320px;margin:0 auto}
.access-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,6rem);margin-top:clamp(3rem,6vw,5rem);align-items:center}
.info div{display:grid;grid-template-columns:7rem 1fr;padding:1.3rem 0;border-bottom:1px solid var(--line)}
.info dt{color:var(--muted);font-size:.82rem;letter-spacing:.14em}
.info small{color:var(--muted)}
.map .bezel-core{aspect-ratio:4/3}
.map iframe{display:block;width:100%;height:100%;border:0;filter:grayscale(.6) sepia(.15)}

/* フッター */
.foot{overflow:hidden;padding:clamp(4rem,8vw,7rem) clamp(1rem,5vw,4.5rem) 2.5rem;background:var(--espresso);color:var(--cream)}
.foot-mark{font:italic 300 clamp(5rem,20vw,19rem)/.85 var(--en);letter-spacing:-.03em;color:rgba(244,236,223,.92)}
.foot-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 2rem;margin-top:3rem;padding-top:1.5rem;border-top:1px solid rgba(244,236,223,.15);font-size:.82rem}
.eras{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}
.eras span{margin-right:.6rem;color:rgba(244,236,223,.7)}
.eras a,.eras strong{padding:.35rem .9rem;border-radius:999px;font:500 .85rem/1 var(--en);text-decoration:none}
.eras a{box-shadow:inset 0 0 0 1px rgba(244,236,223,.25);transition:background .4s var(--ease)}
.eras a:hover{background:rgba(244,236,223,.1)}
.eras strong{background:var(--cream);color:var(--espresso)}
.foot-note,.copy{color:rgba(244,236,223,.7)}

/* カート */
.drawer-bg{position:fixed;inset:0;z-index:70;background:rgba(29,22,17,.5);opacity:0;transition:opacity .5s var(--ease)}
.drawer-bg.on{opacity:1}
.drawer{position:fixed;top:.6rem;right:.6rem;bottom:.6rem;z-index:71;display:flex;flex-direction:column;width:min(460px,calc(100% - 1.2rem));border-radius:1.6rem;background:var(--paper);box-shadow:0 40px 80px -20px rgba(18,12,8,.5);transform:translateX(calc(100% + 1rem));transition:transform .7s var(--ease)}
.drawer.on{transform:none}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:1.4rem 1.5rem 1rem}
.drawer-ttl{font:700 1.3rem/1.4 var(--serif);letter-spacing:.08em}
.drawer-x{position:relative;width:2.75rem;height:2.75rem;border:0;border-radius:50%;background:rgba(29,22,17,.06);cursor:pointer}
.drawer-x span{position:absolute;left:50%;top:50%;width:1rem;height:1.5px;background:var(--ink)}
.drawer-x span:first-child{transform:translate(-50%,-50%) rotate(45deg)}
.drawer-x span:last-child{transform:translate(-50%,-50%) rotate(-45deg)}
.drawer-body{flex:1;overflow-y:auto;padding:0 1.5rem 1.5rem;overscroll-behavior:contain}
.drawer-label{margin:1.4rem 0 .6rem;color:var(--muted);font-size:.75rem;letter-spacing:.16em}
.menu-list li{display:grid;grid-template-columns:3.6rem 1fr auto;gap:.9rem;align-items:center;padding:.6rem 0;border-bottom:1px solid var(--line)}
.menu-list img{width:3.6rem;height:3.6rem;border-radius:.9rem;object-fit:cover}
.m-name{font:700 .92rem/1.4 var(--serif);letter-spacing:.04em}
.m-price{color:var(--muted);font:400 .85rem/1.4 var(--en)}
.qty{display:flex;align-items:center;gap:.2rem;padding:.2rem;border-radius:999px;background:rgba(29,22,17,.05)}
.qty button{width:2.2rem;height:2.2rem;border:0;border-radius:50%;background:#fff;font-size:1.05rem;line-height:1;cursor:pointer;box-shadow:0 1px 2px rgba(29,22,17,.1)}
.qty output{min-width:1.6rem;font:500 .95rem/1 var(--en);text-align:center}
.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:.3rem;padding:.3rem;border-radius:999px;background:rgba(29,22,17,.06)}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg span{display:block;padding:.7rem .2rem;border-radius:999px;font:700 .82rem/1 var(--sans);text-align:center;cursor:pointer;transition:background .4s var(--ease),color .4s var(--ease)}
.seg input:checked+span{background:var(--green);color:var(--cream)}
.seg input:focus-visible+span{outline:2px solid var(--cherry);outline-offset:2px}
.field{display:block}
.field select{width:100%;padding:.85rem 1rem;border:0;border-radius:1rem;background:#fff;box-shadow:inset 0 0 0 1px var(--line);font:500 .95rem/1.4 var(--sans);color:var(--ink)}
.deliver-note{margin-top:1rem;padding:.9rem 1rem;border-radius:1rem;background:rgba(179,18,46,.07);color:#7a0e21;font-size:.82rem}
.drawer-foot{padding:1.1rem 1.5rem 1.4rem;border-top:1px solid var(--line)}
.total{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:1rem}
.total span{color:var(--muted);font-size:.85rem;letter-spacing:.14em}
.total strong{font:400 1.9rem/1 var(--en)}
.pay-note{margin-top:.7rem;color:var(--muted);font-size:.72rem;text-align:center}
.done{padding:2.5rem 0;text-align:center}
.done-mark{display:grid;place-items:center;width:4.5rem;height:4.5rem;margin:0 auto 1rem;border-radius:50%;background:var(--green);color:var(--cream);font-size:1.8rem}
.done-no{font:400 2.4rem/1.2 var(--en);letter-spacing:.06em}
.done-msg{margin-top:1.5rem;font:500 1rem/2 var(--serif);letter-spacing:.06em}
.done-sub{margin-top:1rem;color:var(--muted);font-size:.85rem}

/* 出てくる動き */
.reveal{opacity:0;transform:translateY(3rem);transition:opacity 1s var(--ease),transform 1.2s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* スマホ */
@media (max-width:900px){
  .nav{top:.6rem;width:calc(100% - 1.2rem);padding:.35rem .35rem .35rem .8rem}
  .nav-links,.nav-cart-txt{display:none}
  .nav-logo{margin-right:auto}
  .nav-cart{padding:.5rem .7rem}
  .burger{position:relative;display:block;width:2.75rem;height:2.75rem;margin-left:.3rem;border:0;border-radius:50%;background:rgba(14,59,44,.08);cursor:pointer}
  .burger span{position:absolute;left:50%;width:1.1rem;height:1.5px;background:var(--ink);transition:transform .5s var(--ease),top .5s var(--ease)}
  .burger span:first-child{top:calc(50% - 4px);transform:translateX(-50%)}
  .burger span:last-child{top:calc(50% + 3px);transform:translateX(-50%)}
  .burger[aria-expanded="true"] span:first-child{top:50%;transform:translateX(-50%) rotate(45deg)}
  .burger[aria-expanded="true"] span:last-child{top:50%;transform:translateX(-50%) rotate(-45deg)}
  .hero{height:160vh}
  .hero-media::after{background:linear-gradient(0deg,rgba(18,12,8,.85) 0%,rgba(18,12,8,.35) 60%,rgba(18,12,8,.1) 100%)}
  .hero-copy{right:1.25rem;bottom:4rem}
  .hero-scroll{display:none}
  .hero-media img{object-position:70% center}
  .story-grid,.order-grid,.access-grid{grid-template-columns:1fr}
  .sig-pin{display:block;height:auto;padding:6rem 0}
  .sig-head{width:auto;padding:0 1rem 2rem;box-shadow:none}
  .sig-head::before{display:none}
  .sig-track{overflow-x:auto;padding:0 1rem 1rem;scroll-snap-type:x mandatory;scrollbar-width:none}
  .sig-track::-webkit-scrollbar{display:none}
  .card{width:82vw;scroll-snap-align:center}
  .interior{height:80vh}
  .tl-item{grid-template-columns:1fr;gap:.6rem}
  .info div{grid-template-columns:5.5rem 1fr}
  .facts dd{font-size:2rem}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
  .statement .w{opacity:1}
  .hero{height:auto}
  .hero-stage{position:relative}
}
.sig-head .h2{white-space:nowrap}
.sig-head::before{content:"";position:absolute;top:0;bottom:0;right:100%;width:12vw;background:var(--cream)}
.h2,.statement{word-break:keep-all;overflow-wrap:anywhere}