:root{--paper:#faf7ee;--ink:#384634;--accent:#b56d37;--line:#dcdcca;--serif:'Noto Serif JP',serif;--sans:'Noto Sans JP',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:75px}body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.9 var(--sans)}h1,h2,h3,p{margin:0}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid var(--accent);outline-offset:5px}img{display:block;width:100%;object-fit:cover}.demo-bar{background:var(--ink);color:var(--paper);padding:9px 5%;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:10px}.demo-bar a{white-space:nowrap;border-bottom:1px solid #ffffff60}.example-header{height:105px;display:flex;justify-content:space-between;align-items:center;padding:0 7%}.shop-logo{font:500 28px var(--serif);letter-spacing:.08em}.shop-logo small{font:8px var(--sans);letter-spacing:.18em;display:block;margin-top:5px}.example-header nav{display:flex;gap:30px;font-size:11px}.example-header nav a:hover{color:var(--accent)}.kicker{font:10px var(--sans);letter-spacing:.22em}.example-hero{display:grid;grid-template-columns:1fr 1.2fr;position:relative;margin:5px 5% 0;min-height:590px}.hero-copy{padding:70px 7% 65px 5%;align-self:center}.hero-copy h1{font:500 clamp(35px,4.5vw,62px)/1.65 var(--serif);letter-spacing:.06em;margin:25px 0}.hero-copy>p:not(.kicker){font-size:12px;line-height:2.3}.example-hero>.hero-picture{min-width:0;position:relative}.hero-picture img{height:100%;max-height:680px;border-radius:48% 48% 3px 3px}.hero-picture .image-label{position:absolute;bottom:20px;left:25px;font:9px var(--sans);letter-spacing:.1em;background:#faf7eedd;padding:7px 14px}.round-link{display:inline-flex;align-items:center;justify-content:space-between;gap:55px;border-bottom:1px solid var(--ink);padding:10px 0;margin-top:30px;font-size:12px}.round-link span{font-size:20px}.hero-caption{text-align:center;font:10px var(--sans);letter-spacing:.3em;padding:37px 5%;border-bottom:1px solid var(--line)}.story{padding:100px 8%;display:grid;grid-template-columns:.9fr 1fr;gap:9%;align-items:center;max-width:1300px;margin:auto}.story h2{font:500 32px/1.9 var(--serif);margin-top:20px}.story>div>p:not(.kicker){font-size:13px;line-height:2.4;margin-top:20px}.story-note{color:var(--accent);font:500 16px/2 var(--serif)!important}.story-image{aspect-ratio:1.2;object-position:center;border-radius:4px}.menu-section{padding:80px 8%;background:#eeedde}.section-title{text-align:center;margin-bottom:38px}.section-title h2{font:500 32px/1.8 var(--serif);margin-top:15px}.section-title>p:last-child:not(.kicker){font-size:12px;margin-top:12px}.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);max-width:1100px;margin:auto;gap:25px}.menu-item{padding:30px;background:var(--paper);border:1px solid var(--line);border-radius:3px;position:relative}.menu-num{font:12px Georgia;opacity:.65}.menu-item h3{font:500 23px/1.7 var(--serif);margin:20px 0 12px}.menu-item p{font-size:12px;line-height:2.1;min-height:50px}.menu-price{display:block;border-top:1px solid var(--line);padding-top:18px;margin-top:22px;font:23px Georgia}.menu-price small{font:10px var(--sans);margin-left:7px}.flavor-dot{width:48px;height:48px;border-radius:50%;position:absolute;top:26px;right:28px;background:#e9b45e;box-shadow:inset -7px -5px 12px #986c1f12}.menu-item:nth-child(2) .flavor-dot{background:#e6dcc1}.menu-item:nth-child(3) .flavor-dot{background:#a3ae82}.gift-section{display:grid;grid-template-columns:1fr 1fr;gap:7%;align-items:center;padding:90px 8%;max-width:1300px;margin:auto}.gift-section h2{font:500 31px/1.9 var(--serif);margin:18px 0}.gift-section p:not(.kicker){font-size:12px;line-height:2.3}.gift-visual{background:#e9dfc6;border-radius:5px;padding:30px}.gift-visual img{aspect-ratio:1.4;border-radius:3px}.access{padding:80px 8%;background:#edece2}.access-inner{display:grid;grid-template-columns:1fr 1.3fr;gap:10%;max-width:1050px;margin:auto}.access h2{font:500 30px var(--serif);margin:17px 0}.access p{font-size:12px}.access dl{margin:0}.access dl>div{display:grid;grid-template-columns:100px 1fr;border-bottom:1px solid #ced0bd;padding:15px 0;font-size:12px}.access dt{font-weight:500}.access dd{margin:0}.demo-bottom{text-align:center;padding:60px 6%;background:var(--ink);color:var(--paper)}.demo-bottom h2{font:500 24px/1.8 var(--serif)}.demo-bottom p{font-size:11px;max-width:650px;margin:17px auto;opacity:.85;line-height:2}.demo-button{display:inline-flex;gap:35px;align-items:center;background:var(--paper);color:var(--ink);padding:15px 25px;font-size:12px;border-radius:3px;margin-top:6px}.example-footer{padding:24px 6%;display:flex;justify-content:space-between;font-size:9px;gap:15px}.example-footer a{border-bottom:1px solid var(--ink)}.cafe{--paper:#f2ebdd;--ink:#3e322b;--accent:#956844;--line:#d7cbb7}.cafe .example-header{height:95px}.cafe .shop-logo{font-size:25px;letter-spacing:.16em}.cafe .example-hero{margin:0;min-height:650px;display:block;color:#fff9e9}.cafe .hero-picture{position:absolute;inset:0;z-index:0}.cafe .hero-picture img{border-radius:0;height:100%;max-height:none;object-position:55% 56%}.cafe .hero-picture:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#211c16d9 0%,#211c1666 55%,#211c1610 100%)}.cafe .hero-copy{position:relative;z-index:1;padding:80px 9%;max-width:650px}.cafe .hero-copy h1{font-size:54px;line-height:1.7}.cafe .round-link{border-color:#fff9e9}.cafe .hero-caption{background:#493a2e;color:#e3d5bd;border:0}.cafe .menu-section{background:#e6dece}.cafe .menu-item{background:transparent;border:0;border-top:1px solid #b8a88e;padding:24px 0}.cafe .menu-item h3{font-size:23px}.cafe .flavor-dot{display:none}.cafe .menu-item p{min-height:75px}.cafe .story-image{border-radius:50% 50% 0 0;aspect-ratio:.95;object-position:75%}.cafe .access{background:#e7decc}.shokudo{--paper:#fbfaf4;--ink:#243e49;--accent:#a44732;--line:#d2d8d6}.shokudo .example-header{border-bottom:1px solid var(--line);height:99px}.shokudo .shop-logo{font-size:30px;letter-spacing:.16em}.shokudo .shop-logo:before{content:'食';display:inline-flex;align-items:center;justify-content:center;border:2px solid var(--accent);color:var(--accent);width:40px;height:40px;margin-right:12px;transform:rotate(-6deg);font-size:23px;letter-spacing:0}.shokudo .shop-logo small{margin-left:57px}.shokudo .example-hero{grid-template-columns:.8fr 1.3fr;margin:35px 5% 0;min-height:550px;gap:25px}.shokudo .hero-copy{padding:30px 2%}.shokudo .hero-copy h1{font-size:56px;line-height:1.75}.shokudo .hero-picture img{border-radius:3px;max-height:620px}.shokudo .hero-caption{color:var(--accent);font-weight:600}.shokudo .story{grid-template-columns:1fr 1fr}.shokudo .story-image{aspect-ratio:1.1}.shokudo .menu-section{background:#e8eee9}.shokudo .menu-item{border-top:3px solid var(--ink);border-radius:0}.shokudo .flavor-dot{display:none}.shokudo .access{background:#e8eee9}.shokudo .demo-bottom{background:#243e49}.shokudo .menu-price{color:var(--accent)}
@media(max-width:800px){.example-header{height:90px;padding:0 5%}.example-header nav{gap:16px;font-size:10px}.shop-logo{font-size:24px}.example-hero{min-height:470px}.hero-copy{padding:35px 5%}.hero-copy h1{font-size:36px}.hero-copy>p:not(.kicker){font-size:11px}.story{padding:65px 6%;gap:6%}.story h2{font-size:26px}.story>div>p:not(.kicker){font-size:11px}.menu-section{padding:60px 6%}.menu-grid{gap:16px}.menu-item{padding:23px 18px}.menu-item h3{font-size:19px}.menu-item p{font-size:11px}.flavor-dot{width:32px;height:32px;right:20px;top:23px}.gift-section{padding:65px 6%}.gift-section h2{font-size:25px}.access{padding:60px 6%}.access-inner{gap:6%}.cafe .example-hero{min-height:600px}.cafe .hero-copy h1{font-size:47px}.shokudo .hero-copy h1{font-size:42px}.shokudo .example-hero{min-height:490px}.shokudo .shop-logo{font-size:25px}.shokudo .shop-logo:before{width:33px;height:33px;font-size:20px}}
@media(max-width:600px){html{scroll-padding-top:20px}.demo-bar{font-size:8px;padding:8px 5%;line-height:1.7;align-items:center}.demo-bar>span{max-width:65%}.example-header,.cafe .example-header,.shokudo .example-header{height:88px;padding:12px 5%;gap:12px}.shop-logo,.cafe .shop-logo{font-size:22px;white-space:nowrap}.shop-logo small{font-size:6px}.example-header nav{gap:12px;font-size:9px;flex-wrap:wrap;justify-content:flex-end;max-width:160px}.example-hero{display:flex;flex-direction:column;min-height:0;margin:0 6%;gap:20px}.hero-copy{padding:28px 0 0}.hero-copy h1{font-size:40px;margin:18px 0;line-height:1.65}.hero-copy>p:not(.kicker){font-size:11px}.kicker{font-size:8px}.round-link{font-size:11px;margin-top:16px;gap:35px}.hero-picture img{height:340px;max-height:none;border-radius:45% 45% 3px 3px}.hero-caption{font-size:8px;letter-spacing:.15em;padding:27px 5%}.story{padding:55px 6%;grid-template-columns:1fr;gap:25px}.story h2{font-size:27px}.story>div>p:not(.kicker){font-size:12px}.story-image{max-height:320px;aspect-ratio:1.2}.menu-section{padding:50px 6%}.section-title h2{font-size:27px}.section-title>p:last-child:not(.kicker){font-size:11px}.menu-grid{grid-template-columns:1fr;gap:15px}.menu-item{padding:23px}.menu-item h3{font-size:22px;margin:13px 0 8px}.menu-item p{min-height:0;font-size:12px}.menu-price{margin-top:16px;padding-top:13px;font-size:23px}.flavor-dot{width:42px;height:42px;right:25px;top:22px}.gift-section{padding:50px 6%;grid-template-columns:1fr;gap:26px}.gift-section h2{font-size:27px}.gift-visual{padding:20px}.access{padding:50px 6%}.access-inner{grid-template-columns:1fr;gap:20px}.access h2{font-size:27px}.access dl>div{grid-template-columns:82px 1fr;font-size:11px}.demo-bottom{padding:45px 6%}.demo-bottom h2{font-size:22px}.demo-bottom p{font-size:10px}.demo-button{font-size:11px;gap:25px}.example-footer{font-size:8px;flex-wrap:wrap}.cafe .example-hero{min-height:560px}.cafe .hero-picture img{height:100%;object-position:68% center}.cafe .hero-picture:after{background:linear-gradient(90deg,#211c16d9,#211c1633)}.cafe .hero-copy{padding:58px 7%}.cafe .hero-copy h1{font-size:41px}.cafe .story-image{border-radius:45% 45% 0 0;aspect-ratio:1.1}.cafe .menu-item p{min-height:0}.shokudo .shop-logo{font-size:22px}.shokudo .shop-logo:before{width:28px;height:28px;font-size:17px;margin-right:7px}.shokudo .shop-logo small{margin-left:38px;font-size:6px}.shokudo .example-hero{display:flex;min-height:0;gap:24px;margin:25px 6% 0}.shokudo .hero-copy{padding:5px 0}.shokudo .hero-copy h1{font-size:42px}.shokudo .hero-picture img{height:330px}.shokudo .story{grid-template-columns:1fr}}
.cafe .hero-copy{max-width:800px}.shokudo .hero-copy h1{font-size:clamp(32px,3.4vw,48px)}
@media(max-width:800px) and (min-width:601px){.shokudo .hero-copy h1{font-size:30px}}
@media(max-width:600px){.cafe .hero-copy h1{font-size:clamp(29px,9.4vw,40px)}.shokudo .hero-copy h1{font-size:clamp(28px,8.8vw,38px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Focus the gelato crop on the cup, rather than the empty wall. */
.gelato .hero-picture img,.gelato .story-image,.gelato .gift-visual img{object-position:center bottom}
.gelato .hero-picture{overflow:hidden;border-radius:48% 48% 3px 3px}
.gelato .hero-picture img{height:100%;max-height:590px;object-fit:cover}
@media(max-width:600px){.gelato .hero-picture img{height:340px}}

/* User-specified gelato palette. */
.gelato{--paper:#FFF7C9;--pink:#F7C4D4;--blue:#C0E4F2;--ink:#343b50;--accent:#70516b;--line:#b6b3a7}
.gelato .demo-bar{background:var(--blue);color:var(--ink)}
.gelato .demo-bar a{border-color:var(--ink)}
.gelato .example-header{border-bottom:1px solid #343b5020}
.gelato .hero-caption{background:var(--blue);border:0}
.gelato .menu-section{background:var(--pink)}
.gelato .menu-item{background:var(--paper);border-color:#343b5030}
.gelato .menu-item:nth-child(2){background:var(--blue)}
.gelato .menu-item:nth-child(3){background:#fffaf0}
.gelato .flavor-dot{background:var(--pink);box-shadow:inset -7px -5px 12px #70516b12}
.gelato .menu-item:nth-child(2) .flavor-dot{background:var(--paper)}
.gelato .menu-item:nth-child(3) .flavor-dot{background:var(--blue)}
.gelato .gift-visual{background:var(--pink)}
.gelato .access{background:var(--blue)}
.gelato .access dl>div{border-color:#343b5030}
.gelato .demo-bottom{background:var(--pink);color:var(--ink)}
.gelato .demo-button{background:var(--ink);color:var(--paper)}
.gelato .example-footer{background:var(--paper)}