:root {
  --bg: #080609;
  --bg-soft: #100c12;
  --panel: rgba(25, 18, 27, 0.86);
  --panel-strong: #171019;
  --text: #fff8ed;
  --muted: #b9acb8;
  --red: #e54335;
  --red-bright: #ff5a48;
  --gold: #f1c16f;
  --line: rgba(255, 245, 230, 0.12);
  --shadow: 0 30px 90px rgba(0, 0, 0, 0.45);
  --radius: 26px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  background:
    radial-gradient(circle at 14% 8%, rgba(151, 28, 42, 0.13), transparent 30%),
    radial-gradient(circle at 82% 30%, rgba(221, 59, 42, 0.08), transparent 26%),
    var(--bg);
  color: var(--text);
  font-family: "DM Sans", sans-serif;
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
img { max-width: 100%; display: block; }

.ambient {
  position: fixed;
  width: 460px;
  height: 460px;
  border-radius: 50%;
  filter: blur(120px);
  pointer-events: none;
  opacity: 0.12;
  z-index: -1;
}
.ambient-one { background: var(--red); top: 8%; right: -240px; }
.ambient-two { background: #8d2040; bottom: 10%; left: -260px; }

.section-shell { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.section-spacing { padding-top: 120px; }

.site-header {
  width: min(1240px, calc(100% - 32px));
  height: 78px;
  margin: 18px auto 0;
  padding: 0 18px 0 22px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 30px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(8, 6, 9, 0.72);
  backdrop-filter: blur(18px);
  position: relative;
  z-index: 20;
}

.brand { display: inline-flex; align-items: center; gap: 12px; font-weight: 700; letter-spacing: -0.04em; font-size: 20px; }
.brand small { color: var(--gold); font-size: 12px; margin-left: 2px; letter-spacing: 0; }
.brand-light { font-weight: 400; }
.brand-mark {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, var(--red-bright), #9c1f2b);
  font-family: "Noto Serif JP", serif;
  box-shadow: 0 10px 25px rgba(229, 67, 53, 0.25);
}
.site-nav { display: flex; align-items: center; gap: 34px; color: var(--muted); font-size: 14px; }
.site-nav a:hover { color: var(--text); }
.header-cta { justify-self: end; padding: 13px 19px; border-radius: 12px; background: var(--text); color: #171016; font-weight: 700; font-size: 14px; }
.menu-toggle { display: none; }

.hero {
  min-height: 760px;
  padding-top: 92px;
  display: grid;
  grid-template-columns: 0.92fr 1.08fr;
  align-items: center;
  gap: 64px;
}
.eyebrow { display: flex; align-items: center; gap: 10px; color: var(--gold); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.18em; }
.eyebrow span { width: 28px; height: 1px; background: var(--gold); }
.hero h1, .section-heading h2, .vision-header h2, .asset-copy h2, .acquire-main h2, .faq-heading h2 {
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  line-height: 1.04;
  letter-spacing: -0.045em;
}
.hero h1 { font-size: clamp(48px, 6vw, 78px); margin: 22px 0 24px; max-width: 720px; }
.hero h1 em { font-style: normal; color: var(--red-bright); }
.hero-text { max-width: 610px; color: var(--muted); line-height: 1.8; font-size: 17px; }
.hero-actions, .acquire-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
.button { min-height: 52px; padding: 0 22px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; transition: transform .2s ease, border-color .2s ease, background .2s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: linear-gradient(135deg, var(--red-bright), #ba2533); color: white; box-shadow: 0 15px 35px rgba(226, 52, 48, 0.24); }
.button-ghost { border: 1px solid var(--line); color: var(--text); background: rgba(255,255,255,0.025); }
.button-ghost:hover { border-color: rgba(255,255,255,0.3); }
.trust-row { margin-top: 34px; display: flex; flex-wrap: wrap; gap: 8px; }
.trust-row span { padding: 8px 12px; border: 1px solid var(--line); border-radius: 999px; color: #d6cbd4; font-size: 12px; background: rgba(255,255,255,0.02); }

.hero-visual { position: relative; min-height: 610px; display: grid; place-items: center; }
.hero-visual::before {
  content: "";
  position: absolute;
  inset: 38px 24px 60px;
  border-radius: 48% 48% 24px 24px;
  background:
    linear-gradient(to bottom, rgba(8, 6, 9, 0.05), rgba(8, 6, 9, 0.84)),
    url("https://images.unsplash.com/photo-1533050487297-09b450131914?auto=format&fit=crop&w=1400&q=85") center/cover;
  border: 1px solid var(--line);
  filter: saturate(.75) brightness(.68);
}
.moon { position: absolute; width: 180px; height: 180px; border-radius: 50%; background: #f8e6c0; top: 22px; right: 50px; box-shadow: 0 0 80px rgba(241,193,111,.25); opacity: .9; }
.lantern { position: absolute; width: 72px; height: 96px; border-radius: 18px; background: linear-gradient(#ff7a60, #c52a34); border: 2px solid rgba(255,211,164,.55); display: grid; place-items: center; font-family: "Noto Serif JP", serif; font-size: 20px; z-index: 2; box-shadow: 0 0 35px rgba(229,67,53,.34); }
.lantern::before, .lantern::after { content:""; position:absolute; left: 14px; right: 14px; height: 7px; background:#211419; }
.lantern::before { top:-7px; }
.lantern::after { bottom:-7px; }
.lantern-left { left: 0; top: 112px; transform: rotate(-4deg); }
.lantern-right { right: 2px; top: 220px; transform: rotate(5deg) scale(.8); }
.hero-card { position: relative; z-index: 3; width: min(465px, 83%); margin-top: 78px; border: 1px solid rgba(255,255,255,.18); border-radius: 26px; background: rgba(15,10,16,.92); box-shadow: var(--shadow); overflow: hidden; transform: rotate(-1.2deg); }
.hero-card-image { height: 325px; background: linear-gradient(to top, rgba(13,8,14,.22), transparent), url("https://images.unsplash.com/photo-1579871494447-9811cf80d66c?auto=format&fit=crop&w=1200&q=88") center/cover; }
.hero-card-content { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; padding: 22px; }
.mini-label { display: block; color: var(--gold); text-transform: uppercase; font-size: 10px; letter-spacing: .18em; font-weight: 700; }
.hero-card-content h2 { font-family: "Noto Serif JP", serif; margin: 6px 0 0; font-size: 27px; }
.open-pill { padding: 8px 10px; background: rgba(48,136,91,.14); border: 1px solid rgba(82,199,134,.24); border-radius: 999px; color: #9fe2bb; font-size: 11px; white-space: nowrap; }
.open-pill i, .availability i { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #56d08e; margin-right: 6px; box-shadow: 0 0 12px #56d08e; }
.hero-menu-strip { padding: 14px 22px 20px; display:flex; flex-wrap:wrap; gap:8px; }
.hero-menu-strip span { font-size: 11px; padding: 7px 10px; border-radius: 999px; border: 1px solid var(--line); color: var(--muted); }
.floating-card { position:absolute; z-index:4; border:1px solid rgba(255,255,255,.17); background:rgba(19,13,20,.9); backdrop-filter: blur(14px); border-radius:16px; box-shadow:0 20px 55px rgba(0,0,0,.35); padding:14px 16px; }
.floating-card-top { top:110px; right:-10px; display:grid; grid-template-columns:auto 1fr; column-gap:10px; }
.floating-card-top small { grid-column:2; color:var(--muted); margin-top:2px; }
.floating-icon { grid-row:1 / span 2; width:38px; height:38px; border-radius:11px; display:grid; place-items:center; background:rgba(229,67,53,.13); color:var(--red-bright); font-family:"Noto Serif JP",serif; }
.floating-card-bottom { left:14px; bottom:74px; }
.rating { color:var(--gold); letter-spacing:2px; font-size:12px; margin-bottom:4px; }

.ticker { border-block: 1px solid var(--line); margin-top: 20px; overflow:hidden; background: rgba(255,255,255,.015); }
.ticker-track { width:max-content; display:flex; align-items:center; gap:28px; padding:17px 0; animation:ticker 24s linear infinite; color:#6f626d; font-size:11px; letter-spacing:.18em; font-weight:700; }
.ticker-track i { color:var(--red); font-size:8px; }
@keyframes ticker { to { transform: translateX(-50%); } }

.section-heading { max-width: 720px; }
.section-heading h2, .vision-header h2, .asset-copy h2, .acquire-main h2, .faq-heading h2 { font-size: clamp(38px, 5vw, 60px); margin:18px 0; }
.section-heading p, .vision-header p, .asset-copy p, .acquire-main p { color:var(--muted); line-height:1.8; }
.experience-grid { margin-top:50px; display:grid; grid-template-columns:1.25fr .75fr; grid-template-rows:repeat(2, 300px); gap:18px; }
.experience-card { position:relative; overflow:hidden; border-radius:var(--radius); border:1px solid var(--line); background:var(--panel-strong); }
.experience-large { grid-row:1 / span 2; }
.photo { position:absolute; inset:0; transition:transform .7s ease; }
.experience-card:hover .photo { transform:scale(1.04); }
.photo::after { content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(8,6,9,.96) 0%, rgba(8,6,9,.08) 64%); }
.photo-sushi { background:url("https://images.unsplash.com/photo-1563612116625-3012372fccce?auto=format&fit=crop&w=1200&q=86") center/cover; }
.photo-hibachi { background:url("https://images.unsplash.com/photo-1515003197210-e0cd71810b5f?auto=format&fit=crop&w=1000&q=86") center/cover; }
.photo-buffet { background:url("https://images.unsplash.com/photo-1547592180-85f173990554?auto=format&fit=crop&w=1000&q=86") center/cover; }
.experience-overlay { position:absolute; left:0; right:0; bottom:0; padding:28px; z-index:2; }
.experience-overlay span { color:var(--gold); text-transform:uppercase; letter-spacing:.16em; font-size:10px; font-weight:700; }
.experience-overlay h3 { font-family:"Noto Serif JP",serif; font-size:28px; margin:7px 0 0; }
.experience-overlay p { max-width:520px; color:#c8bdc5; line-height:1.65; font-size:14px; }

.vision { background: linear-gradient(180deg, transparent, rgba(40,19,32,.18), transparent); }
.vision-header { display:grid; grid-template-columns:1.1fr .9fr; align-items:end; gap:80px; }
.vision-header p { padding-bottom:10px; }
.browser-mockup { margin-top:55px; border:1px solid rgba(255,255,255,.16); background:#100b12; border-radius:26px; overflow:hidden; box-shadow:var(--shadow); }
.browser-bar { height:58px; padding:0 20px; display:grid; grid-template-columns:1fr minmax(260px, 420px) 1fr; align-items:center; gap:20px; border-bottom:1px solid var(--line); background:#171018; }
.browser-dots { display:flex; gap:7px; }
.browser-dots i { width:10px; height:10px; border-radius:50%; background:#584b55; }
.browser-dots i:first-child { background:#d4544b; }
.browser-dots i:nth-child(2) { background:#d3a24e; }
.browser-dots i:nth-child(3) { background:#4f9e6b; }
.address-bar { height:32px; display:grid; place-items:center; border-radius:9px; background:#0c090e; border:1px solid var(--line); color:#c7bbc4; font-size:12px; }
.secure-mark { justify-self:end; font-size:10px; color:#70cf97; }
.browser-body { background:linear-gradient(135deg,#130e15,#080609); }
.browser-nav { height:76px; padding:0 34px; display:flex; align-items:center; justify-content:space-between; gap:30px; border-bottom:1px solid var(--line); }
.browser-logo { font-weight:700; }
.browser-logo b { display:inline-grid; place-items:center; width:31px; height:31px; margin-right:8px; border-radius:8px; background:var(--red); font-family:"Noto Serif JP",serif; }
.browser-links { display:flex; gap:24px; color:var(--muted); font-size:12px; }
.browser-nav button { border:0; padding:11px 15px; border-radius:10px; background:var(--red); color:white; font-weight:700; font-size:11px; }
.browser-content { min-height:470px; display:grid; grid-template-columns:.95fr 1.05fr; align-items:center; gap:40px; padding:54px; }
.browser-copy h3 { font-family:"Noto Serif JP",serif; font-size:clamp(34px,4vw,58px); line-height:1.05; margin:14px 0 18px; letter-spacing:-.04em; }
.browser-copy p { color:var(--muted); line-height:1.7; }
.browser-buttons { display:flex; align-items:center; gap:22px; margin-top:26px; font-size:12px; }
.browser-buttons b { padding:12px 16px; border-radius:10px; background:var(--red); }
.browser-buttons span { color:var(--gold); }
.browser-food { min-height:350px; border-radius:50% 50% 24px 24px; border:1px solid var(--line); background:linear-gradient(to top, rgba(8,6,9,.35), transparent), url("https://images.unsplash.com/photo-1553621042-f6e147245754?auto=format&fit=crop&w=1200&q=88") center/cover; box-shadow:inset 0 0 80px rgba(0,0,0,.25); }
.browser-stats { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }
.browser-stats div { padding:22px 28px; display:flex; align-items:center; gap:12px; border-right:1px solid var(--line); }
.browser-stats div:last-child { border-right:0; }
.browser-stats strong { color:var(--red-bright); font-size:24px; }
.browser-stats span { color:var(--muted); font-size:12px; }
.use-case-grid { margin-top:22px; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.use-case { min-height:240px; padding:26px; border-radius:22px; border:1px solid var(--line); background:rgba(255,255,255,.018); }
.use-number { color:var(--red-bright); font-family:"Noto Serif JP",serif; font-size:13px; }
.use-case h3 { font-family:"Noto Serif JP",serif; font-size:23px; margin:42px 0 10px; }
.use-case p { color:var(--muted); line-height:1.7; font-size:14px; }

.asset-card { position:relative; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:80px; padding:64px; border-radius:32px; border:1px solid var(--line); overflow:hidden; background:linear-gradient(135deg, rgba(42,22,38,.9), rgba(14,10,16,.95)); }
.asset-card::before { content:""; position:absolute; width:420px; height:420px; right:-150px; top:-160px; border-radius:50%; background:rgba(229,67,53,.12); filter:blur(20px); }
.asset-copy { position:relative; z-index:2; }
.asset-copy h2 { font-size:clamp(36px,4.6vw,55px); }
.asset-copy ul { list-style:none; padding:0; margin:28px 0 0; display:grid; gap:12px; }
.asset-copy li { color:#d7cbd3; }
.asset-copy li i { font-style:normal; color:var(--gold); margin-right:9px; }
.asset-domain { position:relative; min-height:360px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; border-radius:26px; border:1px solid rgba(255,255,255,.14); background:rgba(7,5,8,.72); overflow:hidden; }
.asset-domain strong { font-family:"Noto Serif JP",serif; font-size:clamp(36px,5vw,64px); margin-top:12px; letter-spacing:-.05em; }
.asset-domain em { font-style:normal; color:var(--gold); font-size:22px; }
.domain-glow { position:absolute; width:260px; height:260px; border-radius:50%; background:rgba(229,67,53,.13); filter:blur(45px); }
.asset-domain > *:not(.domain-glow) { position:relative; z-index:2; }

.acquire-card { display:grid; grid-template-columns:1.25fr .75fr; border:1px solid rgba(255,255,255,.16); border-radius:32px; overflow:hidden; background:linear-gradient(140deg,#1b111a,#0d090f); box-shadow:var(--shadow); }
.acquire-main { padding:64px; }
.acquire-main h2 { max-width:720px; }
.acquire-main p strong { color:var(--text); }
.process-row { margin-top:42px; display:grid; grid-template-columns:auto 1fr auto 1fr auto; align-items:center; gap:18px; }
.process-row div { display:flex; align-items:center; gap:10px; }
.process-row div span { width:28px; height:28px; display:grid; place-items:center; border-radius:50%; background:rgba(229,67,53,.15); border:1px solid rgba(229,67,53,.3); color:var(--red-bright); font-size:11px; font-weight:700; }
.process-row p { color:#d7cbd3; font-size:11px; line-height:1.3; margin:0; }
.process-row > i { height:1px; background:var(--line); }
.acquire-side { padding:42px; display:flex; flex-direction:column; justify-content:center; background:rgba(255,255,255,.028); border-left:1px solid var(--line); }
.acquire-side h3 { font-family:"Noto Serif JP",serif; font-size:30px; margin:10px 0 35px; }
.price { padding:22px 0; border-block:1px solid var(--line); }
.price small { display:block; color:var(--muted); text-transform:uppercase; letter-spacing:.14em; font-size:9px; }
.price strong { display:block; font-size:44px; margin-top:5px; }
.availability { margin:22px 0; color:#ace0c0; font-size:12px; }
.acquire-side p { margin:0; color:var(--muted); font-size:13px; line-height:1.6; }
.acquire-side a { color:var(--gold); }

.faq { padding-bottom:120px; display:grid; grid-template-columns:.75fr 1.25fr; gap:90px; }
.faq-heading h2 { font-size:clamp(36px,4.4vw,54px); }
.faq-list { display:grid; gap:12px; }
details { border:1px solid var(--line); border-radius:16px; background:rgba(255,255,255,.018); padding:0 20px; }
summary { cursor:pointer; list-style:none; padding:21px 34px 21px 0; position:relative; font-weight:600; }
summary::-webkit-details-marker { display:none; }
summary::after { content:"+"; position:absolute; right:0; top:50%; transform:translateY(-50%); color:var(--red-bright); font-size:22px; }
details[open] summary::after { content:"−"; }
details p { margin:0 0 22px; color:var(--muted); line-height:1.7; font-size:14px; }

.site-footer { width:min(1240px,calc(100% - 32px)); margin:0 auto 18px; padding:34px; border:1px solid var(--line); border-radius:24px; display:grid; grid-template-columns:1fr 1.25fr 1fr; gap:30px; align-items:center; background:rgba(255,255,255,.018); }
.footer-brand { display:flex; align-items:center; gap:12px; }
.footer-brand strong, .footer-brand small { display:block; }
.footer-brand small { color:var(--muted); margin-top:4px; font-size:11px; }
.site-footer > p { color:#8f828d; line-height:1.6; font-size:11px; margin:0; }
.footer-links { justify-self:end; display:flex; gap:18px; color:var(--muted); font-size:12px; }
.footer-links a:hover { color:var(--text); }

.reveal { opacity:0; transform:translateY(22px); transition:opacity .8s ease, transform .8s ease; }
.reveal.is-visible { opacity:1; transform:none; }

@media (max-width: 980px) {
  .site-header { grid-template-columns:1fr auto; }
  .site-nav, .header-cta { display:none; }
  .menu-toggle { display:grid; gap:5px; width:42px; height:42px; place-content:center; border:1px solid var(--line); border-radius:12px; background:transparent; }
  .menu-toggle span { display:block; width:18px; height:1px; background:var(--text); }
  .site-nav.is-open { position:absolute; display:flex; flex-direction:column; align-items:stretch; top:86px; left:0; right:0; gap:0; padding:10px; border:1px solid var(--line); border-radius:16px; background:#120d13; box-shadow:var(--shadow); }
  .site-nav.is-open a { padding:14px; }
  .hero { grid-template-columns:1fr; padding-top:72px; gap:30px; }
  .hero-copy { text-align:center; }
  .hero-copy .eyebrow, .hero-actions, .trust-row { justify-content:center; }
  .hero-text { margin-inline:auto; }
  .hero-visual { min-height:620px; }
  .vision-header, .asset-card, .faq { grid-template-columns:1fr; gap:42px; }
  .browser-content { grid-template-columns:1fr; }
  .browser-food { min-height:300px; }
  .asset-card { padding:44px; }
  .acquire-card { grid-template-columns:1fr; }
  .acquire-side { border-left:0; border-top:1px solid var(--line); }
  .site-footer { grid-template-columns:1fr; text-align:center; }
  .footer-brand { justify-content:center; }
  .footer-links { justify-self:center; }
}

@media (max-width: 720px) {
  .section-shell { width:min(100% - 28px,1180px); }
  .section-spacing { padding-top:86px; }
  .site-header { width:calc(100% - 20px); margin-top:10px; height:68px; padding-inline:14px; }
  .brand { font-size:17px; }
  .brand-mark { width:34px; height:34px; }
  .hero { min-height:auto; padding-top:58px; }
  .hero h1 { font-size:46px; }
  .hero-visual { min-height:530px; }
  .hero-visual::before { inset:30px 8px 52px; }
  .moon { width:130px; height:130px; right:25px; }
  .hero-card { width:88%; margin-top:70px; }
  .hero-card-image { height:260px; }
  .lantern { width:54px; height:76px; font-size:16px; }
  .lantern-left { left:-6px; }
  .lantern-right { right:-8px; }
  .floating-card-top { right:-4px; top:92px; transform:scale(.86); transform-origin:right top; }
  .floating-card-bottom { left:-2px; bottom:68px; transform:scale(.9); transform-origin:left bottom; }
  .experience-grid { grid-template-columns:1fr; grid-template-rows:none; }
  .experience-card, .experience-large { min-height:390px; grid-row:auto; }
  .vision-header { gap:18px; }
  .browser-bar { grid-template-columns:auto 1fr; }
  .secure-mark { display:none; }
  .browser-nav { padding:0 18px; }
  .browser-links { display:none; }
  .browser-content { padding:38px 22px; }
  .browser-stats { grid-template-columns:1fr; }
  .browser-stats div { border-right:0; border-bottom:1px solid var(--line); }
  .browser-stats div:last-child { border-bottom:0; }
  .use-case-grid { grid-template-columns:1fr; }
  .use-case { min-height:210px; }
  .asset-card, .acquire-main, .acquire-side { padding:30px 24px; }
  .asset-domain { min-height:280px; }
  .process-row { grid-template-columns:1fr; }
  .process-row > i { display:none; }
  .process-row div { gap:12px; }
  .acquire-actions, .hero-actions { flex-direction:column; }
  .button { width:100%; }
  .faq { gap:24px; padding-bottom:88px; }
  .site-footer { width:calc(100% - 20px); padding:28px 20px; }
  .footer-links { flex-wrap:wrap; justify-content:center; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .reveal { opacity:1; transform:none; }
}