:root{--wine:#721724;--brown:#845b25;--blue:#23697a;--gold:#b68a35;--cream:#fbf7ec;--gray:#d8d8d8}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--gray)}
body{margin:0;background:var(--gray);color:var(--brown);font-family:"Yu Mincho","Hiragino Mincho ProN","Noto Serif JP",serif}
img{display:block;max-width:100%}
.lp{width:min(100%,1440px);margin:auto;overflow:hidden;background:var(--cream);box-shadow:0 0 32px #4b27301c}
.panel{position:relative;width:100%;aspect-ratio:1440/var(--pc-h);overflow:hidden}
.panel__bg,.panel__bg img{position:absolute;inset:0;width:100%;height:100%}
.panel__bg img{object-fit:fill}
.layer{position:absolute;z-index:1}
.layer img,.layer picture{width:100%;height:auto}
.only-sp{display:none}
.prose{font-size:clamp(12px,1.04vw,15px);font-weight:600;letter-spacing:.075em;line-height:1.8}
.prose p{margin:0 0 1.6em}
.cta{display:block;transition:filter .2s ease,transform .2s ease}
.cta:hover{filter:brightness(1.06);transform:translateY(-2px)}
.cta:focus-visible{outline:4px solid #fff;outline-offset:4px;border-radius:999px;box-shadow:0 0 0 7px var(--wine)}

/* Hero */
.hero__tagline{left:22.5%;top:14.4%;width:54.9%}
.hero__portraits{position:absolute;z-index:1;left:21.1%;top:28.7%;width:57.8%;display:flex;gap:.55%}
.hero__portraits img{width:32.7%}
.hero__title{left:34.2%;top:65.7%;width:31.6%}
.hero__cta{left:40.6%;top:74.8%;width:19.8%}

/* Movie */
.movie__message{left:36%;top:1.5%;width:27.6%}
.movie__frame{left:29.7%;top:25.3%;width:40.5%;z-index:2;pointer-events:none}
.movie__video{left:31.8%;top:28.4%;width:36.4%;height:36.6%;border:0;background:#000}
.movie__quote{left:27.5%;top:70%;width:45%}

/* Concept */
.concept__box{left:24.7%;top:7%;width:50.6%}
.concept__title{left:30.8%;top:76%;width:38.4%}

/* Experience */
.experience__photo{left:16.8%;width:22.7%}
.experience__photo--makeup{top:18%}
.experience__photo--dress{left:25.5%;top:47%;width:22.7%}
.experience__copy{left:54.4%;top:13.2%;width:31%;color:#8b5d22}
.experience__copy h2{margin:0 0 .9em;color:var(--wine);font-size:clamp(22px,2.3vw,34px);font-weight:500;line-height:1.55;letter-spacing:.06em}
.experience__cta{left:40.6%;top:77.5%;width:19.8%}

/* Story */
.story__portrait{left:36.5%;top:12%;width:27.1%}
.story__copy{top:39%;width:26%;color:#8b611f}
.story__copy--left{left:12.4%}
.story__copy--right{left:67%;top:27%;width:24%}
.story__declaration{color:#311814;font-size:clamp(17px,1.6vw,23px);line-height:1.65!important}

/* Flow */
.flow__title{left:30.9%;top:8%;width:38.3%}
.flow__steps{left:18.65%;top:28%;width:62.7%}

/* Day */
.day__title{left:29.15%;top:6.5%;width:41.7%}
.day__portrait{top:24%;width:31.8%}
.day__portrait--before{left:7.8%}
.day__portrait--after{right:6.7%}
.day__copy{left:37.5%;top:38%;width:25%;text-align:center;color:#1e6377;font-size:clamp(14px,1.35vw,20px);font-weight:700;letter-spacing:.08em;line-height:1.8}
.day__copy p{margin:0}
.day__copy span{display:block;width:18px;height:18px;margin:15px auto;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(45deg)}

/* Voices */
.voices__title{left:38.9%;top:7.5%;width:22.2%}
.voice{display:flex;align-items:center;gap:3%;color:#855d24;font-size:clamp(12px,1.15vw,17px);font-weight:600;letter-spacing:.07em;line-height:1.8}
.voice img{flex:0 0 auto;width:34%}
.voice p{margin:0}
.voice small{font-size:.9em}
.voice--one{left:15.5%;top:27%;width:34%}
.voice--two{left:50.5%;top:48%;width:35%}
.voice--two{flex-direction:row-reverse}

/* Profile */
.profile__portrait{left:7%;top:0;width:24.2%}
.profile__copy{left:40%;top:10.5%;width:48%;color:#87611f;font-size:clamp(11px,.98vw,14px);line-height:1.75}
.profile__copy p{margin-bottom:1.25em}
.profile__lead{color:#3b1816;font-size:clamp(16px,1.45vw,21px);font-weight:700;line-height:1.7!important}

/* Price */
.price__title{left:42.3%;top:6.25%;width:15.35%}
.price__card{left:26.5%;top:20%;width:46.9%}
.price__option{left:27.1%;top:80%;width:45.8%}

/* FAQ */
.faq{position:relative;padding:95px clamp(28px,11.3vw,163px) 105px;border:3px solid #d4b05c;background:radial-gradient(circle at 20% 20%,#caaa5f10 0 1px,transparent 2px),linear-gradient(115deg,#fff8,transparent 40%,#d7b66b12),#fcf9ef;background-size:26px 26px,auto,auto}
.faq__title{display:block;width:min(536px,54%);margin:0 auto 52px}
.faq__list{max-width:1080px;margin:auto;border:1px solid #c99d48;background:#ffffffc9}
.faq details{border-bottom:1px solid #c99d48}
.faq details:last-child{border-bottom:0}
.faq summary{position:relative;padding:22px 65px 22px 82px;color:#8d5d1f;cursor:pointer;font-size:clamp(14px,1.25vw,18px);font-weight:700;letter-spacing:.06em;line-height:1.7;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary:before{content:"Q.";position:absolute;left:28px;top:14px;color:var(--gold);font:italic 30px Georgia,serif}
.faq summary:after{content:"＋";position:absolute;right:26px;top:50%;translate:0 -50%;color:var(--gold);font-size:20px}
.faq details[open] summary:after{content:"−"}
.faq details p{position:relative;margin:0;padding:0 60px 26px 82px;color:#875d25;font-size:clamp(13px,1.08vw,16px);font-weight:600;letter-spacing:.055em;line-height:1.9}
.faq details p:before{content:"A.";position:absolute;left:28px;top:-7px;color:var(--gold);font:italic 30px Georgia,serif}

/* Final */
.final__portrait{left:14.2%;top:17.8%;width:18.9%}
.final__copy{left:42.5%;top:24%;width:46%;text-align:center;color:#331b16}
.final__copy h2{margin:0 0 .8em;font-size:clamp(28px,3.1vw,45px);font-weight:500;letter-spacing:.12em;line-height:1.52}
.final__copy p{margin:0;font-size:clamp(12px,1.05vw,15px);font-weight:600;letter-spacing:.07em;line-height:1.9}
.final__cta{left:54.2%;top:60%;width:19.8%}

.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

@media(max-width:767px){
  .lp{width:min(100%,430px)}
  .panel{aspect-ratio:375/var(--sp-h)}
  .only-pc{display:none!important}.only-sp{display:block}
  .prose{font-size:clamp(11px,3.15vw,14px);line-height:1.75;letter-spacing:.045em}

  .hero__tagline{left:9%;top:7.4%;width:82%}
  .hero__portrait{left:17.3%;top:35.6%;width:65.3%}
  .hero__title{left:7.5%;top:69.1%;width:85%}
  .hero__cta{left:20.5%;top:78.6%;width:59.2%}

  .movie__message-text{left:0;top:4%;width:100%;display:block;text-align:center;color:#e68bad;font:italic clamp(32px,11vw,48px) "Snell Roundhand","Brush Script MT",cursive}
  .movie__frame{left:5.3%;top:27%;width:89.3%}
  .movie__video{left:10.1%;top:29.5%;width:80%;height:24.9%}
  .movie__quote{left:18.7%;top:59%;width:62.4%}

  .concept__box{left:7.5%;top:4%;width:85%}
  .concept__title{left:3%;top:77%;width:94%}

  .experience__photo{top:5%;width:45.8%}
  .experience__photo--makeup{left:13.5%}
  .experience__photo--dress{left:40.8%;top:13.2%;width:45.8%}
  .experience__copy{left:7%;top:27.5%;width:86%;font-size:clamp(13px,3.6vw,14px);line-height:1.85;letter-spacing:.035em}
  .experience__copy h2{margin-bottom:1.3em;font-size:22px;line-height:1.4;text-align:center}
  .experience__copy p{margin-bottom:20px}
  .experience__cta{left:20.5%;top:86.3%;width:59.2%}

  .story__portrait{left:26.5%;top:66%;width:47%}
  .story__copy{left:9%;top:11.5%;width:82%;font-size:clamp(10px,2.8vw,12px);line-height:1.7}
  .story__copy--right{top:28.5%}
  .story__copy p{margin-bottom:1.1em}
  .story__declaration{font-size:clamp(16px,4.7vw,20px);text-align:center;line-height:1.55!important}

  .flow__title{left:12%;top:6%;width:76%}
  .flow__steps{left:12.5%;top:22%;width:75%}

  .day__title{left:16.8%;top:6%;width:66.4%}
  .day__portrait{width:48%}
  .day__portrait--before{left:12%;top:36%}
  .day__portrait--after{right:8%;top:63%}
  .day__copy{left:10%;top:20%;width:80%;font-size:clamp(10px,2.8vw,12px);line-height:1.6}
  .day__copy span{width:11px;height:11px;margin:8px auto}

  .voices__title{left:19%;top:5%;width:62%}
  .voice{display:block;width:66%;font-size:clamp(10px,2.85vw,12px);line-height:1.65}
  .voice img{width:60%;margin:0 auto 20px}
  .voice--one{left:17%;top:14.5%}
  .voice--two{left:17%;top:52.5%}

  .profile__portrait{left:0;top:0;width:100%}
  .profile__copy{left:8%;top:22.7%;width:84%;font-size:clamp(13px,3.6vw,14px);line-height:1.85;letter-spacing:.04em}
  .profile__copy p{margin-bottom:20px}
  .profile__lead{font-size:18px;line-height:1.65!important}

  .price__title{left:27.7%;top:8.15%;width:45.1%}
  .price__card{left:.3%;top:20.5%;width:99.5%}
  .price__option{left:4.8%;top:64.7%;width:90.4%}

  .faq{padding:54px 14px 65px;border-width:2px}
  .faq__title{width:80%;margin-bottom:30px}
  .faq summary{padding:18px 40px 18px 48px;font-size:13px;line-height:1.6}
  .faq summary:before{left:14px;top:12px;font-size:23px}
  .faq summary:after{right:13px;font-size:17px}
  .faq details p{padding:0 17px 22px 48px;font-size:12px;line-height:1.8}
  .faq details p:before{left:14px;top:-5px;font-size:23px}

  .final__portrait{left:18.4%;top:5.7%;width:63.5%}
  .final__copy{left:9%;top:44%;width:82%}
  .final__copy h2{margin-bottom:.35em;font-size:24px;line-height:1.21;letter-spacing:.07em}
  .final__copy p{font-size:12px;line-height:2.1;letter-spacing:.035em}
  .final__cta{left:22.9%;top:76.5%;width:54.4%}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.cta{transition:none}}