:root{
  --ink:#181214;
  --paper:#f7f2eb;
  --soft:#eee3d8;
  --wine:#5a2134;
  --wine2:#421626;
  --gold:#c99a2d;
}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:var(--paper);color:var(--ink);font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;letter-spacing:.04em} img{max-width:100%;display:block} a{color:inherit;text-decoration:none}
.site-header{position:fixed;inset:0 0 auto 0;height:72px;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,4vw,56px);background:rgba(247,242,235,.76);backdrop-filter:blur(16px);border-bottom:1px solid rgba(24,18,20,.08)}
.brand{width:132px;height:42px;overflow:hidden;display:flex;align-items:center}.brand img{width:210px;max-width:none;transform:translate(-29px,-52px) scale(.7);transform-origin:left top}nav{display:flex;gap:clamp(14px,3vw,38px);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}nav a{opacity:.72}nav a:hover{opacity:1}
.panel{min-height:100svh;position:relative;padding:clamp(96px,12vw,150px) clamp(22px,6vw,92px);overflow:hidden}.section-number{position:absolute;top:100px;left:clamp(22px,6vw,92px);font-size:12px;font-weight:800;color:var(--gold);border:1px solid currentColor;border-radius:999px;padding:8px 12px}.eyebrow{font-size:12px;font-weight:900;letter-spacing:.26em;color:var(--gold);margin:0 0 22px}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(64px,16vw,210px);line-height:.82;letter-spacing:-.08em;margin:0 0 30px;font-weight:950}h2{font-size:clamp(42px,8vw,112px);line-height:1.02;letter-spacing:-.06em;margin-bottom:30px}h3{font-size:24px;margin-bottom:10px}.lead{font-size:clamp(22px,3.2vw,42px);font-weight:800;line-height:1.55}.copy{max-width:760px}.copy p:not(.eyebrow),.final p{font-size:clamp(16px,1.5vw,20px);line-height:2}.wide-copy{position:relative;z-index:2}.dark{background:var(--ink);color:var(--paper)}.burgundy{background:linear-gradient(135deg,var(--wine),var(--wine2));color:var(--paper)}
.hero{display:grid;grid-template-columns:1fr minmax(320px,560px);align-items:center;gap:6vw}.hero:before{content:"";position:absolute;width:64vw;height:64vw;border-radius:50%;right:-20vw;top:4vw;background:radial-gradient(circle,rgba(201,154,45,.22),transparent 65%)}.hero-card{position:relative;z-index:2;border-radius:36px;background:white;padding:18px;box-shadow:0 30px 80px rgba(61,30,12,.18);transform:rotate(1.5deg)}.hero-card img{border-radius:24px}.scroll-cue{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);font-size:10px;font-weight:900;letter-spacing:.22em;opacity:.5}.scroll-cue:after{content:"";display:block;width:1px;height:48px;background:currentColor;margin:12px auto 0;animation:scroll 1.6s infinite}@keyframes scroll{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}}
.concept,.flavors{display:grid;grid-template-columns:minmax(320px,1fr) minmax(360px,680px);gap:6vw;align-items:center}.image-frame,.lineup,.usage,.package{border-radius:32px;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.22);background:#fff}.image-frame{transform:rotate(-1deg)}.lineup{transform:rotate(1deg)}
.features{padding-bottom:70px}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:7vh;position:relative;z-index:2}.feature{background:rgba(255,255,255,.58);border:1px solid rgba(24,18,20,.08);border-radius:26px;padding:28px;min-height:220px;box-shadow:0 20px 50px rgba(61,30,12,.07)}.feature span{display:inline-flex;width:34px;height:34px;border-radius:50%;align-items:center;justify-content:center;background:var(--wine);color:#fff;font-size:12px;font-weight:900;margin-bottom:28px}.feature p{line-height:1.8;font-size:14px}.package{width:min(640px,78vw);margin:8vh auto 0;transform:rotate(-1.5deg)}
.scenes{display:grid;grid-template-columns:1fr minmax(320px,620px);gap:6vw;align-items:end}.scene-list{display:grid;gap:14px;position:relative;z-index:3}.scene{display:flex;justify-content:space-between;gap:20px;align-items:center;border-top:1px solid rgba(24,18,20,.18);padding:24px 0}.scene:last-child{border-bottom:1px solid rgba(24,18,20,.18)}.scene b{font-size:clamp(28px,5vw,70px);letter-spacing:-.05em}.scene span{font-weight:700;line-height:1.7}.usage{align-self:center;transform:rotate(1deg)}
.final{display:grid;place-items:center;text-align:center}.final-logo{width:min(440px,78vw);margin:0 auto 42px;filter:invert(1)}.final h2{font-size:clamp(46px,9vw,128px)}.button{display:inline-flex;margin-top:24px;border:1px solid currentColor;border-radius:999px;padding:16px 28px;font-size:12px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}.button:hover{background:var(--paper);color:var(--ink)}
.reveal{opacity:0;transform:translateY(32px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.8,.2,1)}.reveal.show{opacity:1;transform:translateY(0)}.delay{transition-delay:.18s}.sp{display:none}
@media(max-width:900px){.site-header{height:62px}.brand{width:108px}.brand img{transform:translate(-26px,-48px) scale(.58)}nav{display:none}.panel{padding:90px 22px}.hero,.concept,.flavors,.scenes{grid-template-columns:1fr;gap:36px}.hero-copy{padding-top:30px}h1{font-size:22vw}.lead{font-size:24px}.feature-grid{grid-template-columns:1fr}.scene{display:block}.scene b{display:block;margin-bottom:8px}.sp{display:block}.section-number{top:76px;left:22px}.hero-card,.image-frame,.lineup,.usage,.package{border-radius:22px}.final-logo{filter:invert(1)}}