@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600&display=swap');

:root {
  --ink: #071014;
  --ink-soft: #101c22;
  --paper: #f2eee5;
  --cyan: #43e1dc;
  --cyan-deep: #149f9b;
  --gold: #d5ad68;
  --white: #fff;
  --muted: #8b969b;
  --line: rgba(255,255,255,.14);
  --sans: "Noto Sans JP", sans-serif;
  --serif: "Noto Serif JP", serif;
  --display: "Noto Serif JP", serif;
  --latin: "Bodoni Moda", serif;
  --condensed: "Oswald", "Noto Sans JP", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: clip; }
body { margin: 0; overflow-x: clip; background: var(--ink); color: var(--white); font-family: var(--sans); line-height: 1.8; letter-spacing: .035em; }
body::after { content: ""; position: fixed; z-index: 999; inset: 0; pointer-events: none; opacity: .22; background: repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0,rgba(255,255,255,.035) 1px,transparent 1px,transparent 4px); mix-blend-mode: soft-light; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }

.site-header { position: fixed; z-index: 100; inset: 0 0 auto; height: 84px; display: flex; align-items: center; justify-content: space-between; padding: 0 clamp(20px,5vw,72px); background: linear-gradient(180deg,rgba(4,9,13,.96),rgba(7,16,20,.78)); backdrop-filter: blur(14px); border-bottom: 1px solid rgba(67,225,220,.22); }
.brand { display: flex; align-items: center; gap: 12px; }
.brand-mark { width: 43px; height: 43px; display: grid; place-items: center; border: 1px solid var(--cyan); border-radius: 50%; color: var(--cyan); font-size: 23px; box-shadow: 0 0 8px rgba(67,225,220,.45),0 0 25px rgba(67,225,220,.12); animation: logo-current 9s infinite; }
.brand-type strong { display: block; font: 600 21px/1 var(--serif); letter-spacing: .12em; }
.brand-type small { display: block; margin-top: 7px; color: var(--gold); font: 600 8px/1 var(--latin); letter-spacing: .25em; }
.site-nav { display: flex; align-items: center; gap: clamp(18px,2.5vw,34px); font-family: var(--condensed); font-size: 11px; letter-spacing: .12em; }
.site-nav a { color: rgba(255,255,255,.7); }
.site-nav a:hover,.site-nav a[aria-current="page"] { color: var(--cyan); }
.site-nav .nav-cta { padding: 10px 15px; border: 1px solid var(--cyan); color: var(--cyan); }
.menu-button { display: none; border: 0; background: none; color: #fff; }

.page-main { padding-top: 84px; }
.shell { width: min(1180px, calc(100% - 44px)); margin: 0 auto; }
.eyebrow { margin: 0 0 17px; color: var(--gold); font: 500 12px/1.4 var(--condensed); letter-spacing: .32em; }
.display-title { margin: 0; font: 500 clamp(42px,6.4vw,92px)/1.3 var(--display); letter-spacing: .055em; }
.display-title em { color: var(--cyan); font-style: normal; }
.section-title { margin: 0; font: 500 clamp(31px,4vw,54px)/1.5 var(--display); letter-spacing: .07em; }
.lead { color: rgba(255,255,255,.62); font: 500 13px/2.1 var(--serif); }
.section { padding: clamp(80px,10vw,145px) 0; }

.home-hero { min-height: calc(100svh - 84px); display: grid; grid-template-columns: .92fr 1.08fr; position: relative; overflow: hidden; padding: 18px; background: radial-gradient(circle at 72% 35%,rgba(35,25,91,.35),transparent 38%),#050b10; }
.home-hero::before { content: ""; position: absolute; z-index: 4; inset: 15px; border: 1px solid rgba(67,225,220,.88); border-radius: 28px; box-shadow: inset 0 0 16px rgba(67,225,220,.28),0 0 12px rgba(67,225,220,.3); pointer-events: none; animation: frame-current 8.5s infinite; }
.home-hero::after { content: "♞"; position: absolute; right: 17%; top: 50%; transform: translate(50%,-50%); color: rgba(255,255,255,.035); text-shadow: 0 0 30px rgba(67,225,220,.16); font: 34vw/1 serif; pointer-events: none; }
.hero-copy { align-self: center; padding: 95px clamp(28px,7vw,110px); position: relative; z-index: 5; }
.hero-copy>.eyebrow { display: inline-flex; padding: 14px 24px; margin-bottom: 30px; border: 1px solid rgba(67,225,220,.82); border-radius: 8px; color: #f3ffff; background: rgba(2,9,13,.48); box-shadow: 0 0 8px rgba(67,225,220,.35),inset 0 0 10px rgba(67,225,220,.12); text-shadow: 0 0 8px rgba(255,255,255,.7); animation: label-flicker 11s infinite; }
.hero-copy .lead { max-width: 610px; margin: 30px 0 36px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.button { min-height: 54px; min-width: 220px; display: inline-flex; align-items: center; justify-content: space-between; gap: 24px; padding: 12px 19px; border: 1px solid rgba(255,255,255,.3); border-radius: 4px; font-family: var(--condensed); font-size: 12px; font-weight: 500; letter-spacing: .08em; transition: .25s; }
.button:hover { transform: translateY(-2px); border-color: var(--cyan); box-shadow: 0 0 18px rgba(67,225,220,.12); }
.button-primary { background: var(--cyan); border-color: var(--cyan); color: var(--ink); box-shadow: 0 0 15px rgba(67,225,220,.28); }
.hero-vertical { position: absolute; right: 44px; top: 90px; z-index: 6; height: 300px; margin: 0; padding: 14px 10px; writing-mode: vertical-rl; border-inline: 1px solid rgba(67,225,220,.35); color: rgba(255,255,255,.72); font: 500 13px/1.8 var(--display); letter-spacing: .16em; text-shadow: 0 0 12px rgba(67,225,220,.3); }
.hero-vertical b { color: var(--cyan); font-weight: 500; }

.photo-slot { min-height: 320px; position: relative; display: grid; place-items: center; overflow: hidden; border: 1px solid rgba(67,225,220,.45); border-radius: 18px; color: var(--cyan); background: radial-gradient(circle at 50% 40%,rgba(45,34,103,.28),transparent 52%),linear-gradient(145deg,#0c151c,#050a0e); box-shadow: inset 0 0 28px rgba(67,225,220,.045); }
.photo-slot::before,.photo-slot::after { content: ""; position: absolute; inset: 18px; pointer-events: none; }
.photo-slot::before { border: 1px solid rgba(255,255,255,.09); border-radius: 10px; }
.photo-slot::after { background: repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0,rgba(255,255,255,.025) 1px,transparent 1px,transparent 4px); animation: scan-drift 8s linear infinite; }
.slot-label { position: relative; z-index: 2; text-align: center; padding: 20px; }
.slot-label strong { display: inline-block; padding: 13px 18px; border: 1px solid rgba(67,225,220,.6); border-radius: 7px; font: 500 clamp(18px,2.4vw,31px)/1 var(--condensed); letter-spacing: .22em; text-shadow: 0 0 8px rgba(255,255,255,.55); box-shadow: 0 0 8px rgba(67,225,220,.25); }
.slot-label span { display: block; margin-top: 13px; color: rgba(255,255,255,.56); font-size: 10px; letter-spacing: .08em; }
.hero-photo-slot { min-height: 100%; z-index: 2; border: 0; border-radius: 0 25px 25px 0; background: radial-gradient(circle at 50% 35%,rgba(67,225,220,.11),transparent 24%),radial-gradient(circle at 50% 50%,rgba(52,35,106,.45),transparent 60%),#070d13; box-shadow: none; }

.photo-frame { min-height: 340px; margin: 0; position: relative; overflow: hidden; border: 1px solid rgba(67,225,220,.5); border-radius: 18px; background: #050a0e; box-shadow: 0 0 25px rgba(67,225,220,.08); }
.photo-frame::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg,transparent 55%,rgba(3,8,10,.72)),repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0,rgba(255,255,255,.018) 1px,transparent 1px,transparent 4px); }
.photo-frame img { width: 100%; height: 100%; min-height: inherit; display: block; object-fit: cover; transition: transform 1s cubic-bezier(.22,1,.36,1),filter .5s; }
.photo-frame:hover img { transform: scale(1.025); filter: saturate(1.06); }
.photo-frame figcaption { position: absolute; z-index: 2; right: 18px; bottom: 14px; color: var(--cyan); font: 500 10px/1 var(--condensed); letter-spacing: .22em; text-shadow: 0 0 8px rgba(67,225,220,.7); }
.photo-frame.portrait { min-height: 560px; }
.hero-photo-frame { min-height: 100%; z-index: 2; border: 0; border-radius: 0 25px 25px 0; }
.hero-photo-frame img { filter: brightness(.68) saturate(.86); }
.hero-photo-frame::before { content: ""; position: absolute; z-index: 1; inset: 0; background: linear-gradient(90deg,#050b10 0,rgba(5,11,16,.58) 18%,transparent 55%),linear-gradient(0deg,rgba(5,11,16,.42),transparent 45%); pointer-events: none; }

.insta-facts { border-block: 1px solid rgba(213,173,104,.3); background: linear-gradient(90deg,#071014,#102326 52%,#071014); }
.facts-row { min-height: 112px; display: grid; grid-template-columns: repeat(4,1fr) auto; align-items: stretch; }
.facts-row p { margin: 0; padding: 24px 20px; display: flex; flex-direction: column; justify-content: center; border-left: 1px solid rgba(255,255,255,.1); }
.facts-row p span { color: var(--cyan); font: 500 9px/1 var(--condensed); letter-spacing: .2em; }
.facts-row p strong { margin-top: 10px; font: 500 13px/1.5 var(--serif); }
.facts-row>a { min-width: 180px; display: flex; align-items: center; justify-content: center; gap: 16px; padding: 20px; border-inline: 1px solid rgba(67,225,220,.3); color: var(--cyan); font: 500 12px var(--condensed); letter-spacing: .12em; }

.paper { color: #fff; background: radial-gradient(circle at 85% 20%,rgba(67,225,220,.07),transparent 32%),linear-gradient(135deg,#0d1113,#15110c 58%,#090d0f); border-block: 1px solid rgba(213,173,104,.22); }
.paper .lead,.paper .copy-block p { color: rgba(255,255,255,.62); }
.paper .fill-item { border-color: rgba(213,173,104,.2)!important; }
.paper .fill-item:nth-child(even) { border-left-color: rgba(213,173,104,.2)!important; }
.paper .menu-box { border-color: rgba(213,173,104,.36); background: rgba(255,255,255,.025); }
.paper .menu-box p { color: rgba(255,255,255,.58); }
.page-map { display: grid; grid-template-columns: repeat(2,1fr); gap: 13px; margin-top: 55px; padding: 15px; border: 1px solid rgba(20,159,155,.48); border-radius: 25px; box-shadow: 0 0 25px rgba(20,159,155,.08); background: rgba(7,16,20,.045); }
.page-card { min-height: 245px; padding: 34px; position: relative; display: flex; flex-direction: column; justify-content: space-between; color: #fff; background: linear-gradient(145deg,#111b25,#0a1118); border: 1px solid rgba(67,225,220,.24); border-radius: 12px; transition: transform .3s,border-color .3s,box-shadow .3s; }
.page-card:hover { transform: translateY(-4px); border-color: rgba(67,225,220,.75); box-shadow: 0 0 20px rgba(67,225,220,.12); }
.page-card span { color: var(--cyan); font: 500 15px var(--condensed); letter-spacing: .2em; text-shadow: 0 0 8px rgba(67,225,220,.35); }
.page-card h3 { margin: 20px 0 8px; font: 500 25px var(--display); }
.page-card p { margin: 0; color: rgba(255,255,255,.55); font-size: 11px; }
.page-card b { align-self: flex-end; color: var(--gold); font-size: 18px; }

.quick-system { display: grid; grid-template-columns: .75fr 1.25fr; gap: clamp(40px,8vw,100px); align-items: center; }
.price-board { padding: clamp(25px,4vw,45px); border: 1px solid rgba(67,225,220,.62); border-radius: 18px; background: linear-gradient(145deg,rgba(18,26,47,.96),rgba(5,10,13,.98)); box-shadow: inset 0 0 20px rgba(67,225,220,.05),0 0 18px rgba(67,225,220,.09); }
.price-board header { display: flex; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid rgba(213,173,104,.25); color: var(--cyan); font-size: 10px; }
.price-row { display: flex; justify-content: space-between; align-items: end; gap: 20px; padding: 22px 0; border-bottom: 1px solid rgba(255,255,255,.1); }
.price-row b { font: 500 18px var(--latin); }
.price-row strong { color: var(--gold); font: 600 clamp(36px,4vw,53px)/1 var(--latin); }
.price-row small { color: #fff; font: 500 11px var(--sans); }

.fill-sheet { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 45px; border-top: 1px solid rgba(255,255,255,.14); }
.fill-item { padding: 22px 0; border-bottom: 1px solid rgba(255,255,255,.14); }
.fill-item:nth-child(odd) { padding-right: 30px; }
.fill-item:nth-child(even) { padding-left: 30px; border-left: 1px solid rgba(255,255,255,.14); }
.fill-item dt { color: var(--cyan); font-size: 9px; letter-spacing: .18em; }
.fill-item dd { margin: 8px 0 0; font: 500 15px var(--serif); }
.blank { display: inline-block; min-width: 170px; padding: 1px 6px 3px; color: var(--gold); border-bottom: 1px dashed var(--gold); font-family: var(--sans); }
.placeholder-note { display: inline-block; margin-top: 10px; padding: 4px 8px; border: 1px solid rgba(213,173,104,.35); color: #9a8258; font-size: 8px; letter-spacing: .08em; }

.sub-hero { position: relative; padding: clamp(115px,12vw,165px) 0 95px; border-bottom: 1px solid var(--line); background: radial-gradient(circle at 78% 30%,rgba(48,32,108,.42),transparent 36%),var(--ink); overflow: hidden; }
.sub-hero::before { content: ""; position: absolute; inset: 18px; border: 1px solid rgba(67,225,220,.72); border-radius: 25px; box-shadow: inset 0 0 15px rgba(67,225,220,.2),0 0 10px rgba(67,225,220,.18); pointer-events: none; animation: frame-current 8.5s infinite; }
.sub-hero::after { content: "RIN"; position: absolute; right: 3vw; bottom: -3vw; color: rgba(255,255,255,.025); font: 600 23vw/1 var(--latin); pointer-events: none; }
.sub-hero .shell { position: relative; z-index: 2; }
.breadcrumb { margin: 0 0 35px; color: rgba(255,255,255,.45); font-size: 9px; letter-spacing: .18em; }
.breadcrumb a { color: var(--cyan); }
.sub-hero p:last-child { max-width: 650px; margin-top: 28px; }
.content-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(35px,7vw,90px); align-items: start; }
.copy-block h2 { margin: 0 0 25px; font: 600 clamp(30px,4vw,52px)/1.5 var(--display); }
.copy-block p { color: rgba(255,255,255,.62); font: 500 13px/2.2 var(--serif); }
.vertical-copy { height: 340px; margin: 0 auto; padding: 20px; writing-mode: vertical-rl; border-inline: 1px solid rgba(20,159,155,.4); font: 500 17px/2 var(--display); letter-spacing: .14em; }
.vertical-copy.compact { height: 280px; margin: 36px 0 0 auto; color: rgba(255,255,255,.78); }

.recommend-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 13px; margin-top: 48px; }
.recommend-grid { padding: 14px; border: 1px solid rgba(67,225,220,.42); border-radius: 22px; background: rgba(8,18,25,.04); }
.recommend-card { min-height: 175px; display: grid; grid-template-columns: 52px 1fr; gap: 18px; padding: 30px; background: linear-gradient(145deg,#121b2a,#0a1219); border: 1px solid rgba(67,225,220,.22); border-radius: 10px; }
.recommend-card>span { color: var(--cyan); font: 500 31px/1 var(--condensed); text-shadow: 0 0 8px rgba(67,225,220,.45); }
.recommend-card h3 { margin: 0 0 10px; font: 500 17px var(--display); }
.recommend-card p { margin: 0; color: rgba(255,255,255,.55); font-size: 11px; }

.photo-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 15px; }
.photo-grid .photo-slot:first-child { grid-column: 1/-1; min-height: 480px; }
.photo-grid .photo-slot { min-height: 330px; }
.real-gallery .photo-frame:first-child { grid-column: 1/-1; min-height: 560px; }
.real-gallery .photo-frame { min-height: 410px; }
.real-gallery .photo-frame.portrait { min-height: 650px; }

.official-note { margin-top: 30px; padding: 20px 22px; display: grid; gap: 7px; border: 1px solid rgba(67,225,220,.46); border-radius: 10px; background: rgba(67,225,220,.045); box-shadow: inset 0 0 14px rgba(67,225,220,.04); }
.official-note span { color: var(--cyan); font: 500 9px/1 var(--condensed); letter-spacing: .22em; }
.official-note strong { color: #fff; font: 500 18px var(--display); }
.official-note small { color: rgba(255,255,255,.55); }

.menu-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 14px; margin-top: 40px; }
.menu-box { padding: 28px; border: 1px solid rgba(213,173,104,.35); background: rgba(255,255,255,.025); }
.menu-box h3 { margin: 0 0 13px; color: var(--cyan); font: 600 17px var(--display); }
.menu-box p { margin: 0; color: rgba(255,255,255,.55); font-size: 11px; }

.site-footer { padding: 55px clamp(22px,6vw,80px) 28px; background: #04090b; display: grid; grid-template-columns: 1fr auto; gap: 30px; align-items: center; color: rgba(255,255,255,.55); }
.site-footer small { grid-column: 1/-1; padding-top: 24px; border-top: 1px solid var(--line); font-size: 8px; }
.footer-links { display: flex; flex-wrap: wrap; gap: 18px; font-size: 9px; }

.reveal-target { opacity: 0; transform: translateY(24px); transition: opacity .75s ease,transform .75s cubic-bezier(.22,1,.36,1); }
.reveal-target.is-visible { opacity: 1; transform: none; }

@keyframes frame-current {
  0%, 28%, 30%, 31%, 72%, 74%, 100% { opacity: 1; filter: brightness(1); }
  29%, 30.5%, 73% { opacity: .48; filter: brightness(.65); }
}
@keyframes label-flicker {
  0%, 52%, 54%, 55%, 84%, 86%, 100% { opacity: 1; }
  53%, 54.5%, 85% { opacity: .55; }
}
@keyframes logo-current {
  0%, 61%, 63%, 64%, 100% { opacity: 1; }
  62%, 63.5% { opacity: .45; }
}
@keyframes scan-drift { from { transform: translateY(0); } to { transform: translateY(8px); } }

@media (max-width: 820px) {
  .site-header { height: 70px; padding: 0 18px; backdrop-filter: none; }
  .page-main { padding-top: 70px; }
  .brand-mark { width: 37px; height: 37px; font-size: 19px; }
  .brand-type strong { font-size: 17px; }
  .menu-button { z-index: 2; width: 52px; height: 52px; display: grid; place-content: center; gap: 5px; padding: 7px; border: 1px solid rgba(255,255,255,.55); border-radius: 50%; }
  .menu-button span { width: 26px; height: 1px; background: currentColor; }
  .menu-button small { font-size: 6px; letter-spacing: .18em; }
  .site-nav { position: fixed; inset: auto; top: 0; left: 0; width: 100vw; height: 100dvh; overflow-y: auto; flex-direction: column; justify-content: center; align-items: flex-start; gap: 24px; padding: 90px 20vw 45px; background: rgba(7,16,20,.985); font: 500 18px var(--serif); transform: translateX(100%); transition: transform .3s; }
  .site-nav.open { transform: none; }
  .home-hero { grid-template-columns: 1fr; padding: 9px; }
  .home-hero::before { inset: 8px; border-radius: 20px; }
  .home-hero::after { right: -5%; top: 34%; font-size: 88vw; }
  .hero-copy { padding: 85px 68px 60px 22px; }
  .hero-copy>.eyebrow { padding: 11px 14px; font-size: 9px; letter-spacing: .24em; }
  .hero-copy .lead { font-size: 11px; }
  .hero-vertical { top: 55px; right: 10px; height: 230px; padding: 10px 7px; font-size: 10px; }
  .hero-photo-slot { min-height: 440px; border: 0; border-radius: 0 0 18px 18px; }
  .hero-photo-frame { min-height: 430px; border-radius: 0 0 18px 18px; }
  .facts-row { grid-template-columns: repeat(2,1fr); }
  .facts-row>a { grid-column: 1/-1; min-height: 68px; border-top: 1px solid rgba(67,225,220,.3); }
  .sub-hero::before { inset: 8px; border-radius: 18px; }
  .button { width: 100%; min-width: 0; }
  .page-map,.quick-system,.content-grid,.recommend-grid,.photo-grid,.menu-list { grid-template-columns: 1fr; }
  .page-card { min-height: 210px; }
  .photo-grid .photo-slot:first-child { grid-column: auto; min-height: 360px; }
  .photo-grid .photo-slot { min-height: 300px; }
  .real-gallery .photo-frame:first-child { grid-column: auto; min-height: 330px; }
  .real-gallery .photo-frame,.real-gallery .photo-frame.portrait,.photo-frame.portrait { min-height: 420px; }
  .fill-sheet { grid-template-columns: 1fr; }
  .fill-item:nth-child(odd),.fill-item:nth-child(even) { padding: 18px 0; border-left: 0; }
  .recommend-card { min-height: 0; grid-template-columns: 43px 1fr; padding: 23px 19px; }
  .site-footer { grid-template-columns: 1fr; }
  .site-footer small { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none!important; animation: none!important; } .reveal-target { opacity: 1; transform: none; } }

/* BAR RIN editorial redesign */
:root { --rin-black:#080a09; --rin-black-2:#10100d; --rin-gold:#c7a15b; --rin-gold-pale:#e8d3a2; --rin-teal:#35d5c9; --rin-cream:#eee6d7; }
body { background:var(--rin-black); }
body::after { opacity:.1; mix-blend-mode:overlay; }
.page-main--home { padding-top:0; }
.site-header--overlay { background:linear-gradient(180deg,rgba(4,6,6,.88),rgba(4,6,6,.12)); border:0; backdrop-filter:none; }
.brand-mark { border-color:rgba(199,161,91,.75); border-radius:50% 45% 50% 42%; color:var(--rin-gold-pale); font:500 18px/1 var(--serif); box-shadow:0 0 18px rgba(199,161,91,.12); animation:none; }
.site-nav .nav-cta { color:var(--rin-gold-pale); border-color:rgba(199,161,91,.65); }
.site-nav a:hover,.site-nav a[aria-current="page"] { color:var(--rin-teal); }

.rin-hero { min-height:100svh; position:relative; display:grid; place-items:center; overflow:hidden; isolation:isolate; background:#070908; }
.rin-hero__image { position:absolute; z-index:-4; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; animation:rin-breathe 18s ease-in-out infinite alternate; }
.rin-hero__shade { position:absolute; z-index:-3; inset:0; background:linear-gradient(180deg,rgba(5,7,7,.28),rgba(5,7,7,.12) 38%,rgba(5,7,7,.78)),radial-gradient(circle at 50% 42%,rgba(2,5,6,.05),rgba(2,5,6,.64) 82%); }
.rin-hero__frame { position:absolute; z-index:2; inset:18px; border:1px solid rgba(53,213,201,.72); border-radius:30px; box-shadow:inset 0 0 20px rgba(53,213,201,.12),0 0 12px rgba(53,213,201,.14); pointer-events:none; animation:rin-current 12s infinite; }
.rin-hero__center { position:relative; z-index:3; width:min(720px,70vw); text-align:center; padding-top:4vh; }
.rin-hero__label { width:max-content; margin:0 auto 34px; padding:13px 44px 15px; border:1px solid rgba(53,213,201,.78); border-radius:8px; color:#fff; background:rgba(4,8,8,.38); box-shadow:0 0 13px rgba(53,213,201,.22),inset 0 0 10px rgba(53,213,201,.08); font:500 clamp(13px,1.4vw,19px)/1 var(--condensed); letter-spacing:.38em; }
.rin-hero h1 { margin:0; display:flex; align-items:center; justify-content:center; gap:clamp(18px,3vw,42px); text-shadow:0 4px 24px rgba(0,0,0,.7); }
.rin-hero h1 span { color:var(--rin-gold-pale); font:500 clamp(38px,5vw,72px)/1 var(--latin); letter-spacing:.1em; }
.rin-hero h1 strong { color:#fff; font:400 clamp(100px,14vw,205px)/.82 var(--serif); text-shadow:0 0 22px rgba(53,213,201,.28),0 4px 24px #000; }
.rin-hero h1 small { align-self:flex-end; margin-bottom:10px; color:var(--rin-teal); font:500 clamp(14px,1.7vw,23px)/1 var(--condensed); letter-spacing:.4em; writing-mode:vertical-rl; }
.rin-hero__tagline { margin:35px auto 0; color:rgba(255,255,255,.82); font:400 clamp(12px,1.2vw,15px)/2.15 var(--serif); letter-spacing:.12em; }
.rin-hero__vertical { position:absolute; z-index:3; top:19%; height:330px; margin:0; writing-mode:vertical-rl; color:rgba(255,255,255,.78); font:400 13px/2 var(--serif); letter-spacing:.2em; }
.rin-hero__vertical::before { content:""; display:block; height:58px; margin-inline:auto 15px; border-right:1px solid var(--rin-gold); }
.rin-hero__vertical--left { left:clamp(38px,5vw,82px); }
.rin-hero__vertical--right { right:clamp(38px,5vw,82px); }
.rin-hero__vertical--right::first-line { color:var(--rin-teal); }
.rin-hero__bottom { position:absolute; z-index:3; inset:auto clamp(42px,6vw,90px) 36px; display:grid; grid-template-columns:1fr 1fr auto; align-items:end; gap:35px; }
.rin-hero__bottom p { margin:0; display:grid; gap:5px; }
.rin-hero__bottom span { color:var(--rin-gold); font:500 9px/1 var(--condensed); letter-spacing:.25em; }
.rin-hero__bottom b { color:rgba(255,255,255,.8); font:500 12px/1.4 var(--condensed); letter-spacing:.12em; }
.rin-hero__bottom>a { min-width:215px; display:flex; justify-content:space-between; padding:15px 18px; border-bottom:1px solid var(--rin-teal); color:#fff; font:500 12px var(--serif); }
.rin-scroll { position:absolute; z-index:3; left:50%; bottom:28px; display:grid; justify-items:center; gap:8px; color:rgba(255,255,255,.45); font:500 8px var(--condensed); letter-spacing:.22em; transform:translateX(-50%); }
.rin-scroll i { width:1px; height:38px; position:relative; overflow:hidden; background:rgba(255,255,255,.2); }
.rin-scroll i::after { content:""; position:absolute; inset:-100% 0 auto; height:100%; background:var(--rin-teal); animation:scroll-line 2.2s ease-in-out infinite; }

.section-kicker { margin:0 0 28px; color:var(--rin-gold); font:500 10px/1 var(--condensed); letter-spacing:.3em; }
.text-link { width:max-content; display:flex; align-items:center; gap:38px; margin-top:34px; padding-bottom:8px; border-bottom:1px solid rgba(199,161,91,.65); color:var(--rin-cream); font:500 12px var(--serif); letter-spacing:.08em; }
.text-link b { color:var(--rin-teal); }

.rin-concept { width:min(1320px,calc(100% - 60px)); margin:0 auto; padding:clamp(110px,13vw,190px) 0; display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(18px,2vw,32px); position:relative; }
.rin-concept::before { content:"馬"; position:absolute; right:-2vw; top:8%; color:rgba(199,161,91,.035); font:400 clamp(180px,30vw,470px)/1 var(--serif); pointer-events:none; }
.rin-concept__statement { grid-column:1/6; position:relative; z-index:2; }
.rin-concept__statement h2 { margin:0; font:400 clamp(42px,6vw,84px)/1.45 var(--serif); letter-spacing:.08em; }
.rin-concept__statement h2 em { color:var(--rin-teal); font-style:normal; }
.vertical-note { height:285px; margin:55px 0 0 auto; padding-inline:18px; writing-mode:vertical-rl; border-right:1px solid rgba(199,161,91,.55); color:rgba(255,255,255,.64); font:400 14px/2.1 var(--serif); letter-spacing:.16em; }
.rin-concept__visual { grid-column:7/13; min-height:620px; align-self:start; }
.rin-concept__copy { grid-column:2/7; margin-top:-95px; padding:50px 56px; position:relative; z-index:3; background:linear-gradient(135deg,rgba(20,19,15,.96),rgba(7,10,9,.98)); border-left:1px solid var(--rin-gold); }
.rin-concept__copy p { margin:0 0 20px; color:rgba(255,255,255,.68); font:400 13px/2.25 var(--serif); }
.rin-concept__horse { grid-column:8/12; min-height:510px; margin-top:70px; }
.story-image { position:relative; overflow:hidden; background:#0b0c0b; }
.story-image img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; transition:transform 1.4s cubic-bezier(.22,1,.36,1),filter .5s; }
.story-image:hover img { transform:scale(1.025); }
.story-image>span,.story-image figcaption { position:absolute; z-index:2; inset:auto 18px 16px auto; color:var(--rin-gold-pale); font:500 9px var(--condensed); letter-spacing:.2em; }
.story-image::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 58%,rgba(4,6,5,.7)); pointer-events:none; }

.rin-recommend { display:grid; grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr); background:var(--rin-cream); color:#171712; }
.rin-recommend__photo { min-height:860px; }
.rin-recommend__photo::after { background:linear-gradient(180deg,transparent 38%,rgba(3,5,4,.76)); }
.rin-recommend__photo p { position:absolute; z-index:2; left:clamp(28px,5vw,76px); bottom:clamp(45px,7vw,105px); margin:0; color:#fff; font:400 clamp(40px,5vw,75px)/1.45 var(--serif); letter-spacing:.08em; }
.rin-recommend__body { padding:clamp(75px,9vw,135px) clamp(35px,7vw,110px); position:relative; overflow:hidden; }
.rin-recommend__body>.section-kicker,.rin-recommend__body>.recommend-list { position:relative; z-index:2; }
.rin-recommend__body .section-kicker { color:#7b5c24; }
.recommend-list { margin:0; padding:0; list-style:none; border-top:1px solid rgba(23,23,18,.25); }
.recommend-list li { display:grid; grid-template-columns:54px 1fr; gap:28px; padding:28px 0 30px; border-bottom:1px solid rgba(23,23,18,.2); }
.recommend-list>li>span { color:#8b692d; font:500 18px/1 var(--condensed); }
.recommend-list h3 { margin:0 0 8px; font:500 clamp(17px,1.8vw,23px)/1.6 var(--serif); }
.recommend-list p { margin:0; color:#626057; font-size:11px; line-height:1.9; }

.rin-system { padding:clamp(105px,13vw,180px) max(30px,7vw); position:relative; overflow:hidden; background:radial-gradient(circle at 15% 20%,rgba(53,213,201,.08),transparent 30%),linear-gradient(135deg,#090b0a,#15110b); }
.rin-system::after { content:"稟"; position:absolute; right:-2vw; bottom:-10vw; color:rgba(199,161,91,.035); font:400 38vw/1 var(--serif); }
.rin-system__intro,.price-stage,.rin-system__facts,.rin-drinks { width:min(1120px,100%); margin-inline:auto; position:relative; z-index:2; }
.rin-system__intro { display:grid; grid-template-columns:1.15fr .85fr; gap:80px; align-items:end; }
.rin-system__intro h2 { margin:0; white-space:nowrap; font:400 clamp(40px,6vw,80px)/1.45 var(--serif); letter-spacing:.05em; }
.rin-system__intro h2 em { color:var(--rin-teal); font-style:normal; }
.rin-system__intro>p:last-child { color:rgba(255,255,255,.62); font:400 13px/2.2 var(--serif); }
.price-stage { margin-top:80px; border-block:1px solid rgba(199,161,91,.5); }
.price-stage__row { display:grid; grid-template-columns:1fr auto; align-items:end; padding:35px 0; border-bottom:1px solid rgba(255,255,255,.12); }
.price-stage__row span { color:rgba(255,255,255,.76); font:500 clamp(18px,2.2vw,29px) var(--condensed); letter-spacing:.12em; }
.price-stage__row strong { color:var(--rin-gold-pale); font:500 clamp(52px,8vw,112px)/.9 var(--latin); }
.price-stage__row small { color:var(--rin-teal); font-size:.35em; vertical-align:top; }
.price-stage>p { margin:0; padding:18px 0; color:rgba(255,255,255,.46); font:500 9px var(--condensed); letter-spacing:.22em; }
.rin-system__facts { margin-top:45px; display:grid; grid-template-columns:repeat(3,1fr) auto; border-top:1px solid rgba(255,255,255,.12); }
.rin-system__facts p { margin:0; padding:24px 24px 0 0; display:grid; gap:8px; }
.rin-system__facts span { color:var(--rin-gold); font:500 9px var(--condensed); letter-spacing:.18em; }
.rin-system__facts b { font:500 14px var(--serif); }
.rin-system__facts .text-link { align-self:end; }
.rin-drinks { margin-top:90px; padding-top:55px; display:grid; grid-template-columns:.72fr 1.28fr; gap:70px; border-top:1px solid rgba(199,161,91,.5); }
.rin-drinks__heading h3 { margin:0; font:400 clamp(31px,4vw,52px)/1.55 var(--serif); letter-spacing:.06em; }
.rin-drinks__heading>p:last-child { margin-top:22px; color:rgba(255,255,255,.5); font:400 12px/2 var(--serif); }
.rin-drinks__list { display:grid; grid-template-columns:repeat(2,1fr); }
.rin-drinks__list article { min-height:146px; padding:22px 24px; border-left:1px solid rgba(255,255,255,.12); border-bottom:1px solid rgba(255,255,255,.12); }
.rin-drinks__list article:nth-child(-n+2) { border-top:1px solid rgba(255,255,255,.12); }
.rin-drinks__list span { color:var(--rin-gold); font:500 9px var(--condensed); letter-spacing:.2em; }
.rin-drinks__list h4 { margin:13px 0 9px; color:var(--rin-teal); font:500 15px var(--condensed); letter-spacing:.14em; }
.rin-drinks__list p { margin:0; color:rgba(255,255,255,.66); font:400 11px/1.9 var(--serif); }

.rin-gallery-preview { padding:clamp(100px,12vw,170px) max(30px,5vw); background:#0b0c0b; }
.rin-gallery-preview>header { width:min(1220px,100%); margin:0 auto 65px; display:grid; grid-template-columns:1fr auto; align-items:end; }
.rin-gallery-preview>header .section-kicker { grid-column:1/-1; }
.rin-gallery-preview h2 { margin:0; font:400 clamp(48px,7vw,92px)/1 var(--serif); letter-spacing:.08em; }
.rin-gallery-preview>header .text-link { margin:0; }
.rin-gallery-preview__grid { width:min(1320px,100%); margin:auto; display:grid; grid-template-columns:1.35fr .65fr .72fr; grid-template-rows:310px 280px; gap:18px; }
.scene--wide { grid-row:1/-1; }
.scene--tall { grid-row:1/-1; }
.scene figcaption { inset:auto auto 17px 18px; }
.photo-placeholder { margin:0; min-height:230px; display:grid; place-items:center; position:relative; border:1px solid rgba(199,161,91,.38); background:repeating-linear-gradient(135deg,rgba(199,161,91,.025) 0,rgba(199,161,91,.025) 2px,transparent 2px,transparent 12px),#10110f; }
.photo-placeholder::before,.photo-placeholder::after { content:""; position:absolute; width:28px; height:28px; border-color:var(--rin-gold); opacity:.62; }
.photo-placeholder::before { left:13px; top:13px; border-left:1px solid;border-top:1px solid; }
.photo-placeholder::after { right:13px; bottom:13px; border-right:1px solid;border-bottom:1px solid; }
.photo-placeholder div { display:grid; justify-items:center; gap:14px; padding:28px; text-align:center; }
.photo-placeholder span { color:var(--rin-teal); font:500 10px var(--condensed); letter-spacing:.26em; }
.photo-placeholder strong { font:400 16px/1.8 var(--serif); }
.photo-placeholder small { color:rgba(255,255,255,.42); font-size:9px; }

.rin-contact { min-height:760px; position:relative; display:grid; grid-template-columns:minmax(360px,.82fr) minmax(520px,1.18fr); overflow:hidden; background:#080907; }
.rin-contact>img { grid-column:2; grid-row:1; width:100%; height:760px; object-fit:cover; object-position:center 50%; filter:saturate(.84); background:#080706; }
.rin-contact__shade { position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(90deg,#050706 0%,rgba(5,7,6,.96) 35%,rgba(5,7,6,.22) 68%,rgba(5,7,6,0) 100%); }
.rin-contact__content { grid-column:1; grid-row:1; width:min(560px,calc(100% - 64px)); margin:auto; position:relative; z-index:2; text-align:left; }
.rin-contact__content h2 { margin:0; font:400 clamp(52px,8vw,108px)/1.3 var(--serif); letter-spacing:.1em; }
.rin-contact__content>p:not(.section-kicker) { color:rgba(255,255,255,.68); font:400 13px/2 var(--serif); }
.rin-contact__content>a { width:min(520px,100%); margin:45px 0 0; display:flex; justify-content:space-between; padding:20px 24px; border:1px solid var(--rin-teal); color:#fff; background:rgba(5,10,9,.72); font:500 12px var(--serif); }
.rin-contact__content>a span { color:var(--rin-teal); font-family:var(--condensed); letter-spacing:.18em; }

@keyframes rin-breathe { from { transform:scale(1.01); filter:brightness(.78) saturate(.88); } to { transform:scale(1.055); filter:brightness(.88) saturate(.98); } }
@keyframes rin-current { 0%,45%,47%,48%,100%{opacity:1} 46%,47.5%{opacity:.58} }
@keyframes scroll-line { 0%{transform:translateY(0)} 100%{transform:translateY(200%)} }

@media (max-width:820px) {
  .site-header--overlay { background:linear-gradient(180deg,rgba(4,6,6,.9),transparent); }
  .page-main--home { padding-top:0; }
  .rin-hero { min-height:100svh; }
  .rin-hero__frame { inset:7px; border-radius:20px; }
  .rin-hero__image { object-position:61% center; }
  .rin-hero__shade { background:linear-gradient(180deg,rgba(4,6,5,.38),rgba(4,6,5,.2) 42%,rgba(4,6,5,.88)); }
  .rin-hero__center { width:84vw; padding-top:0; }
  .rin-hero__label { margin-bottom:25px; padding:11px 22px 12px; font-size:10px; }
  .rin-hero h1 { gap:13px; }
  .rin-hero h1 span { font-size:31px; }
  .rin-hero h1 strong { font-size:104px; }
  .rin-hero h1 small { font-size:11px; }
  .rin-hero__tagline { margin-top:27px; font-size:10px; line-height:2; }
  .rin-hero__vertical { top:14%; height:230px; font-size:9px; line-height:1.8; }
  .rin-hero__vertical--left { left:18px; }
  .rin-hero__vertical--right { right:18px; }
  .rin-hero__bottom { inset:auto 28px 36px; grid-template-columns:1fr 1fr; gap:17px; }
  .rin-hero__bottom>a { grid-column:1/-1; min-width:0; }
  .rin-scroll { display:none; }
  .rin-concept { width:calc(100% - 34px); padding:100px 0; grid-template-columns:1fr; gap:28px; }
  .rin-concept__statement,.rin-concept__visual,.rin-concept__copy,.rin-concept__horse { grid-column:auto; }
  .rin-concept__statement h2 { font-size:42px; }
  .vertical-note { height:235px; margin-top:38px; font-size:11px; }
  .rin-concept__visual { min-height:450px; }
  .rin-concept__copy { margin:-70px 16px 0; padding:34px 27px; }
  .rin-concept__horse { min-height:420px; margin:15px 0 0 58px; }
  .rin-recommend { grid-template-columns:1fr; }
  .rin-recommend__photo { min-height:560px; }
  .rin-recommend__body { padding:75px 26px; }
  .recommend-list li { grid-template-columns:40px 1fr; gap:14px; }
  .rin-system { padding:95px 24px; }
  .rin-system__intro { grid-template-columns:1fr; gap:25px; }
  .rin-system__intro h2 { font-size:36px; letter-spacing:.015em; }
  .price-stage { margin-top:55px; }
  .price-stage__row { padding:25px 0; }
  .price-stage__row span { font-size:14px; }
  .price-stage__row strong { font-size:48px; }
  .rin-system__facts { grid-template-columns:1fr; }
  .rin-system__facts p { padding:18px 0; border-bottom:1px solid rgba(255,255,255,.1); }
  .rin-system__facts .text-link { margin-top:25px; }
  .rin-drinks { margin-top:70px; padding-top:45px; grid-template-columns:1fr; gap:35px; }
  .rin-drinks__list { grid-template-columns:1fr; }
  .rin-drinks__list article,.rin-drinks__list article:nth-child(-n+2) { min-height:0; padding:20px 0; border-top:0; border-left:0; border-bottom:1px solid rgba(255,255,255,.12); }
  .rin-gallery-preview { padding:90px 17px; }
  .rin-gallery-preview>header { grid-template-columns:1fr; gap:25px; }
  .rin-gallery-preview>header .text-link { margin-top:0; }
  .rin-gallery-preview__grid { grid-template-columns:1fr; grid-template-rows:auto; }
  .scene--wide,.scene--tall { grid-row:auto; min-height:380px; }
  .scene--tall { margin-left:52px; min-height:470px; }
  .photo-placeholder { min-height:270px; }
  .photo-placeholder--small { margin-right:52px; }
  .rin-contact { min-height:0; grid-template-columns:1fr; }
  .rin-contact>img { grid-column:1; grid-row:1; width:100%; height:420px; object-fit:cover; object-position:center 50%; }
  .rin-contact__shade { display:none; }
  .rin-contact__content { grid-column:1; grid-row:2; width:100%; margin:0; padding:64px 24px 75px; text-align:center; }
  .rin-contact__content h2 { font-size:48px; }
  .rin-contact__content>a { margin:34px auto 0; }
}

@media (prefers-reduced-motion:reduce) { .rin-hero__image,.rin-hero__frame,.rin-scroll i::after { animation:none!important; } }