:root{--paper:#f6efe5;--brown:#5a3d2b;--ink:#3f2d22;--muted:#796657;--line:#d9c8b6;--serif:'Yu Mincho','Hiragino Mincho ProN',Georgia,serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif;font-size:14px;line-height:1.9}a{color:inherit;text-decoration:none}button{font:inherit}a,button,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid #9b7844;outline-offset:6px}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:400}h2{font:36px/1.75 var(--serif);letter-spacing:.07em}.header{height:100px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;background:var(--paper);border-bottom:1px solid var(--line);position:relative;z-index:20}.brand{font:27px/1 Georgia,serif;letter-spacing:-1px;display:inline-flex;flex-direction:column}.brand span{font:9px/1.5 sans-serif;letter-spacing:5px;text-align:center;margin-top:10px}.header nav{display:flex;gap:32px;align-items:center;font-size:12px}.nav-cta{background:var(--brown);color:#fff;padding:13px 23px}.nav-cta span{padding-left:27px}.menu-toggle{display:none}.hero{position:relative;max-width:1600px;margin:auto;display:grid;grid-template-columns:1.03fr 1fr;padding:44px 5% 0;gap:2.5%}.hero-copy{padding:62px 0 55px}.eyebrow,.section-label{font:10px/1.6 Arial,sans-serif;letter-spacing:2.1px}.hero .eyebrow{margin-bottom:28px}.hero h1{font:clamp(32px,3.8vw,59px)/1.75 var(--serif);letter-spacing:.07em;white-space:nowrap}.soft{color:#927457}.hero-description{margin:25px 0 32px;line-height:2.2;font-size:14px;letter-spacing:.08em}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:36px;background:var(--brown);color:#fff;padding:19px 26px;font-size:12px;transition:background .2s,transform .2s}.button:hover{background:#79553b;transform:translateY(-2px)}.micro{font-size:10px;color:var(--muted);margin-top:12px;letter-spacing:.07em}.placeholder{background:#e5d6c4;position:relative;overflow:hidden}.placeholder-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px;color:#927b63;letter-spacing:1.5px;font:9px/1.8 sans-serif}.placeholder-label small{font-size:10px;letter-spacing:.1em}.image-mark{font:24px/1 Georgia,serif;opacity:.6;margin-bottom:6px}.hero-media{min-height:520px;border-radius:48% 48% 0 0;background:#dfceb9}.hero-caption{position:absolute;bottom:49px;left:38px;font:italic 32px/1.4 Georgia,serif;color:#927457}.media-index{position:absolute;bottom:19px;right:22px;font:8px Arial;letter-spacing:1.5px;color:#8a7056}.hero-bottom{grid-column:1/-1;display:flex;justify-content:space-between;padding:24px 0 31px;font-size:10px;letter-spacing:.1em}.hero-bottom a{font:9px Arial;letter-spacing:1.7px}.hero-bottom a span{margin-left:30px}.intro-strip{display:flex;justify-content:space-between;align-items:center;background:#e9dccb;padding:24px 5%;font-size:11px}.intro-strip>span{font:9px Georgia;letter-spacing:1.5px}.intro-strip i{font-style:normal;margin:0 25px;color:#b59c82}.section{padding:100px 8%;max-width:1600px;margin:auto}.section-label{color:#896849;margin-bottom:35px}.concept-grid{display:grid;grid-template-columns:1fr 1fr;gap:12%}.concept .eyebrow{font-size:12px;letter-spacing:.1em;margin-bottom:22px}.concept h2{font-size:43px}.concept-text{padding-top:8px}.concept-text p{margin-bottom:20px;line-height:2.25;font-size:13px}.text-link{display:flex;max-width:280px;justify-content:space-between;border-bottom:1px solid #b69a7c;padding:16px 0;font-size:12px;margin-top:14px}.features{background:#eee2d3}.section-top{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:48px}.section-top .section-label{margin-bottom:18px}.section-top>p{font-size:12px;line-height:2.1;color:var(--muted);padding-bottom:8px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}.feature-photo{aspect-ratio:1.25}.tone-2{background:#e0cbb5}.tone-3{background:#dcc9b6}.photo-number{position:absolute;bottom:10px;left:18px;font:italic 35px Georgia;color:#fff}.feature-grid .eyebrow{margin:26px 0 14px;color:#896849;font-size:9px}.feature-grid h3{font:23px/1.7 var(--serif);margin-bottom:16px}.feature-grid article>p:last-child{font-size:12px;color:#79624e;line-height:2.1}.space-section{display:grid;grid-template-columns:1fr 1fr;margin:100px 0;align-items:center;gap:8%}.space-photo{height:420px;background:#e3d0bc}.space-copy{padding-right:8%}.space-copy .eyebrow{margin-bottom:25px}.space-copy h2{font-size:30px}.space-copy>p:not(.eyebrow){font-size:12px;line-height:2.2;margin:22px 0}.plans{padding-top:15px}.plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.plan{position:relative;border:1px solid var(--line);padding:30px 25px;text-align:center}.plan .eyebrow{font-size:9px;color:#896849}.plan h3{font:24px var(--serif);margin:12px 0}.model{font:10px Arial;letter-spacing:1.5px;color:var(--muted)}.featured{border-color:#a07b53;background:#efe0ce}.plan-badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--brown);color:#fff;font-size:10px;padding:3px 20px;white-space:nowrap}.product-photo{height:135px;margin:24px 0;background:transparent;border:1px dashed #cdb69d}.price{font:32px/1.5 Georgia,serif;white-space:nowrap}.price small{font:11px sans-serif;margin-right:8px}.price span{font:10px sans-serif;margin-left:4px}.plan-description{font-size:11px;line-height:1.9;margin:17px 0 26px;color:var(--muted)}.plan-link{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:19px;font-size:11px}.plan-note{font-size:10px;color:var(--muted);margin:20px 0 35px}.blend-note{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:28px 0;display:flex;justify-content:space-between;gap:25px;align-items:center}.blend-note h3{font:20px var(--serif);margin:9px 0 12px}.blend-note p{font-size:11px;color:var(--muted)}.blend-note strong{font:28px/1.8 Georgia;color:var(--ink)}.blend-note strong span{font:10px sans-serif}.flow{background:#e9dccb;display:grid;grid-template-columns:1fr 1.2fr;gap:10%}.flow h2{font-size:30px}.flow>div>p:last-child{margin-top:22px;font-size:12px;color:var(--muted)}.flow ol{list-style:none;margin:0;padding:0}.flow li{display:flex;gap:25px;padding:25px 0;border-bottom:1px solid #d3bea5}.flow li:first-child{padding-top:0}.flow li>span{font:italic 24px Georgia;color:#a3825f}.flow h3{font:19px var(--serif);margin-bottom:14px}.flow li p{font-size:12px;color:var(--muted);line-height:2}.faq{display:grid;grid-template-columns:1fr 1.7fr;gap:8%}.faq h2{font-size:29px}.faq .section-label{margin-bottom:20px}.faq details{border-bottom:1px solid var(--line)}.faq summary{display:flex;align-items:center;gap:20px;list-style:none;cursor:pointer;padding:24px 0;font-size:12px}.faq summary::-webkit-details-marker{display:none}.faq summary>span{font:18px Georgia;color:#997653}.faq summary b{margin-left:auto;font-weight:400}.faq details[open] summary b{transform:rotate(45deg)}.faq details>p{font-size:12px;color:var(--muted);padding:0 15px 25px 35px;line-height:2}.contact{text-align:center;background:var(--brown);color:#fff6e9;padding:80px 20px}.contact .eyebrow{color:#d8bfa1;margin-bottom:24px}.contact h2{font-size:35px}.contact>p:not(.eyebrow){font-size:12px;margin-top:20px;line-height:2}.button.light{background:#f5e8d5;color:var(--brown);margin:30px 0 22px}.button.light:hover{background:#e6ceb0}.phone{display:block;width:fit-content;margin:auto;font:25px/1.4 Georgia;letter-spacing:2px}.contact p.contact-hours{font-size:10px;color:#dfc8ac;margin-top:7px}footer{padding:45px 5%;display:flex;gap:35px;align-items:center}footer p{font:12px var(--serif)}footer>a:not(.brand){margin-left:auto;font-size:11px}footer small{font-size:9px;color:var(--muted)}.skip{position:fixed;top:-100px;left:20px;z-index:100;background:#fff;padding:10px}.skip:focus{top:10px}@media(min-width:1600px){.space-section{max-width:1600px;margin:100px auto}}@media(max-width:1000px){.header nav{gap:20px}.hero{padding-top:30px}.hero-copy{padding:40px 0}.hero h1{font-size:39px}.hero-media{min-height:470px}.hero .button{padding:17px;gap:15px;font-size:11px}.section{padding:75px 6%}.intro-strip>span:last-child{display:none}.feature-grid{gap:20px}.price{font-size:27px}.plan{padding:28px 15px}.flow{gap:6%}footer{flex-wrap:wrap}footer small{width:100%;text-align:right}.plans{padding-top:0}}@media(max-width:700px){html{scroll-padding-top:80px}.header{height:80px;padding:0 6%}.brand{font-size:24px}.brand span{font-size:8px;margin-top:7px}.menu-toggle{display:block;background:none;border:0;font:10px Arial;letter-spacing:1px;padding:15px 0 15px 15px;color:var(--brown)}.menu-toggle span{margin-left:10px;font-size:17px}.header nav{display:none;position:absolute;top:80px;left:0;right:0;padding:25px 6%;background:var(--paper);border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:20px}.header nav.open{display:flex}.nav-cta{display:flex;justify-content:space-between}.hero{display:flex;flex-direction:column;padding:0 6%}.hero-copy{padding:38px 0 30px}.hero .eyebrow{font-size:9px;margin-bottom:19px}.hero h1{font-size:clamp(30px,8vw,48px);line-height:1.65}.hero-description{font-size:12px;margin:20px 0 25px}.hero .button{font-size:11px;gap:23px;padding:18px 20px}.micro{font-size:9px}.hero-media{min-height:330px;border-radius:46% 46% 0 0;margin-left:15%;width:85%}.hero-caption{font-size:27px;left:25px;bottom:34px}.hero-bottom{padding:20px 0;font-size:9px}.hero-bottom a{font-size:7px;letter-spacing:1px}.hero-bottom a span{margin-left:10px}.intro-strip{padding:22px 6%;display:block}.intro-strip>span{font-size:8px}.intro-strip p{font-size:10px;margin-top:9px}.intro-strip i{margin:0 8px}.section{padding:65px 7%}.section-label{font-size:9px;margin-bottom:25px}.concept-grid{grid-template-columns:1fr;gap:30px}.concept h2{font-size:33px}.concept-text p{font-size:12px}.section-top{display:block;margin-bottom:30px}h2{font-size:29px}.section-top>p{margin-top:20px;font-size:11px}.feature-grid{grid-template-columns:1fr;gap:40px}.feature-photo{aspect-ratio:1.45}.feature-grid h3{font-size:24px}.feature-grid .eyebrow{margin-top:20px}.space-section{display:flex;flex-direction:column;gap:32px;margin:60px 0}.space-photo{width:93%;margin-right:auto;height:280px}.space-copy{padding:0 7%;width:100%}.space-copy h2{font-size:27px}.plan-grid{grid-template-columns:1fr;gap:28px}.plan{padding:30px}.product-photo{height:140px}.price{font-size:36px}.plan-description{font-size:12px}.plan-link{font-size:12px}.blend-note{display:block}.blend-note>p{margin-top:20px}.blend-note h3{font-size:18px;line-height:1.6}.flow{display:block}.flow ol{margin-top:35px}.flow h2{font-size:29px}.flow li{gap:20px}.faq{display:block}.faq-list{margin-top:22px}.faq summary{gap:12px;font-size:11px}.contact{padding:65px 6%}.contact h2{font-size:27px}.contact .button{font-size:10px;gap:20px;padding:18px}.contact .eyebrow{font-size:9px}footer{padding:35px 7%;gap:22px}footer p{font-size:10px}footer>a:not(.brand){margin-left:0}footer small{width:auto;margin-left:auto;font-size:8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* ===== 帯のシーンリンク ===== */
.scene-links a{border-bottom:1px solid transparent;transition:border-color .2s}
.scene-links a:hover{border-bottom-color:currentColor}

/* ===== 02 利用シーン ===== */
.scenes{background:#eee2d3}
.scene-tabs{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:48px}
html:not(.js) .scene-tabs{display:none}
.scene-tab{position:relative;display:flex;flex-direction:column;gap:6px;align-items:flex-start;text-align:left;background:#eee2d3;border:0;padding:20px 16px 18px;cursor:pointer;color:var(--muted);transition:background .2s,color .2s}
.scene-tab:hover{background:#e4d2bc}
.scene-tab .tab-en{font:8px/1.4 Arial,sans-serif;letter-spacing:1.5px}
.scene-tab .tab-ja{font:15px/1.5 var(--serif);letter-spacing:.06em;color:var(--ink)}
.scene-tab::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--brown);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.scene-tab[aria-selected="true"]{background:var(--paper);color:var(--brown)}
.scene-tab[aria-selected="true"]::after{transform:scaleX(1)}
.scene-tab:focus-visible{outline-offset:-4px}
.scene-panel{display:grid;grid-template-columns:1fr 1fr;gap:6%;align-items:start}
html:not(.js) .scene-panel+.scene-panel{margin-top:70px}
.scene-panel[hidden]{display:none}
.js .scene-panel:not([hidden]){animation:sceneIn .45s ease}
@keyframes sceneIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.scene-panel:focus-visible{outline:2px solid #9b7844;outline-offset:8px}
.scene-photo{aspect-ratio:1.25}
.scene-body .eyebrow{color:#896849;margin-bottom:16px}
.scene-body h3{font:27px/1.7 var(--serif);letter-spacing:.05em;margin-bottom:20px}
.scene-lead{font-size:13px;line-height:2.2;margin-bottom:28px}
.scene-meta{margin:0;border-top:1px solid var(--line)}
.scene-meta>div{display:grid;grid-template-columns:110px 1fr;gap:16px;padding:15px 0;border-bottom:1px solid var(--line);font-size:12px;line-height:1.9}
.scene-meta dt{font-size:10px;letter-spacing:.1em;color:#896849;padding-top:2px}
.scene-meta dd{margin:0}
.scene-places{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:2px 20px}
.scent-tags span{display:inline-block;border:1px solid #cbb295;border-radius:99px;padding:1px 12px;margin:0 6px 4px 0;font-size:11px;background:var(--paper)}
.scene-note{font-size:11px;color:var(--muted);margin-top:16px;line-height:2}
.scene-body .text-link{margin-top:22px}

/* 共通の3つのこだわり */
.commitments{margin-top:80px;padding-top:44px;border-top:1px solid var(--line)}
.commitments>h3{font:20px/1.7 var(--serif);letter-spacing:.06em;margin-bottom:30px}
.commit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.commit-grid .eyebrow{color:#896849;font-size:9px;margin-bottom:10px}
.commit-grid h4{font:17px/1.7 var(--serif);font-weight:400;margin:0 0 10px}
.commit-grid p:last-child{font-size:12px;color:#79624e;line-height:2.1}

@media(max-width:1000px){
  .scene-tabs{grid-template-columns:repeat(3,1fr)}
  .scene-panel{gap:5%}
  .scene-body h3{font-size:23px}
  .commit-grid{gap:24px}
}
@media(max-width:700px){
  .intro-strip .scene-links{line-height:2.2}
  .scene-tabs{grid-template-columns:repeat(2,1fr);margin-bottom:32px}
  .scene-tab{padding:14px 14px 13px}
  .scene-tab .tab-ja{font-size:14px}
  .scene-panel{display:flex;flex-direction:column;gap:28px}
  .scene-photo{width:100%;aspect-ratio:1.45}
  .scene-body h3{font-size:22px}
  .scene-lead{font-size:12px}
  .scene-meta>div{grid-template-columns:1fr;gap:4px}
  .commitments{margin-top:60px;padding-top:36px}
  .commitments>h3{font-size:18px}
  .commit-grid{grid-template-columns:1fr;gap:28px}
}
@media(prefers-reduced-motion:reduce){.js .scene-panel:not([hidden]){animation:none}}

/* ===== 1枚の写真を全面に見せるファーストビュー ===== */
.hero-stage {
  --hero-photo-position: center center;
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  min-height: 620px;
  min-height: max(620px, calc(100svh - 100px));
  padding: 90px 8% 105px;
  overflow: hidden;
  background: #69503c;
  color: #fff8ee;
}
.hero-stage-media { position: absolute; inset: 0; z-index: -2; background: #96785b; }
.hero-stage-image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: var(--hero-photo-position); }
.hero-stage-image[hidden] { display: none; }
.hero-stage::after {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(90deg, rgba(30,17,8,.65), rgba(30,17,8,.3) 55%, rgba(30,17,8,.12));
}
.hero-stage-placeholder { position: absolute; right: 10%; top: 45%; display: flex; flex-direction: column; align-items: center; gap: 12px; color: #f5e6d1; }
.hero-stage-placeholder>span { font: 30px Georgia,serif; }
.hero-stage-placeholder small { font-size: 10px; letter-spacing: .15em; }
.hero-stage-media.has-photo .hero-stage-placeholder { display: none; }
.hero-stage-content { width: 100%; max-width: 820px; }
.hero-stage-content .eyebrow { margin-bottom: 28px; letter-spacing: .25em; }
.hero-stage h1 { font: clamp(38px, 4.6vw, 72px)/1.6 var(--serif); letter-spacing: .1em; text-shadow: 0 2px 22px rgba(0,0,0,.15); }
.hero-stage-description { margin: 26px 0 32px; font-size: 14px; line-height: 2.2; letter-spacing: .1em; }
.hero-stage .button { background: #fff2df; color: #513721; border: 1px solid #fff2df; }
.hero-stage .button:hover { background: #e9d3b5; }
.hero-stage-note { margin-top: 15px; font-size: 10px; letter-spacing: .07em; }
.hero-stage-bottom { position: absolute; left: 8%; right: 8%; bottom: 30px; display: flex; align-items: center; justify-content: space-between; gap: 20px; font: 9px/1.6 Arial,sans-serif; letter-spacing: .16em; }
.hero-stage-bottom a { display: flex; align-items: center; gap: 24px; padding: 8px 0; }
.hero-stage-bottom a span { font-size: 20px; }
@media(max-width: 1000px) {
  .hero-stage { padding-left: 6%; padding-right: 6%; }
  .hero-stage-placeholder { right: 5%; top: 20%; }
  .hero-stage-bottom { left: 6%; right: 6%; }
}
@media(max-width: 700px) {
  .hero-stage { min-height: max(640px, calc(100svh - 80px)); padding: 115px 7% 95px; align-items: center; }
  .hero-stage::after { background: linear-gradient(90deg, rgba(30,17,8,.65), rgba(30,17,8,.35)); }
  .hero-stage-placeholder { top: 30px; right: 7%; gap: 5px; }
  .hero-stage-placeholder>span { font-size: 22px; }
  .hero-stage-placeholder small { font-size: 8px; }
  .hero-stage-content .eyebrow { font-size: 9px; margin-bottom: 22px; }
  .hero-stage h1 { font-size: clamp(30px, 8.6vw, 52px); letter-spacing: .06em; }
  .hero-stage-description { font-size: 12px; letter-spacing: .02em; margin: 25px 0 28px; }
  .hero-stage .button { padding: 17px 16px; gap: 16px; font-size: 11px; max-width: 100%; }
  .hero-stage-note { font-size: 9px; max-width: 290px; }
  .hero-stage-bottom { left: 7%; right: 7%; bottom: 20px; font-size: 7px; letter-spacing: .1em; }
  .hero-stage-bottom a { gap: 10px; }
}

/* 余香：写真の温かみを引き継ぐブラウンのブランド表現 */
.brand { font-family: var(--serif); letter-spacing: .12em; }
.brand span { letter-spacing: .3em; }
.header { background: #f0e3d2; }
footer { background: #e6d5c0; }
.hero-stage { --hero-photo-position: center center; }
@media(max-width:700px) {
  .hero-stage { --hero-photo-position: 78% center; }
}

/* 読みやすい文字サイズとお問い合わせ */
body { font-size: 17px; }
.header nav { font-size: 15px; gap: 24px; }
.brand { font-size: 33px; }
.brand span { font-size: 12px; }
h2, .space-copy h2, .flow h2, .faq h2, .contact h2 { font-size: clamp(32px, 3.3vw, 46px); }
.eyebrow, .section-label, .scene-body .eyebrow, .plan .eyebrow, .commit-grid .eyebrow { font-size: 13px; }
.hero-stage h1 { font-size: clamp(48px, 6vw, 88px); }
.hero-stage-description { font-size: 19px; }
.concept-text p, .section-top>p, .scene-lead, .scene-meta>div, .space-copy>p:not(.eyebrow), .plan-description, .blend-note p, .flow>div>p:last-child, .flow li p, .faq summary, .faq details>p, .contact>p:not(.eyebrow), .commit-grid p:last-child { font-size: 17px; }
.scene-meta dt, .scent-tags span, .scene-note, .plan-note, .plan-badge, .model, .price small, .price span, .blend-note strong span, footer>a:not(.brand), footer p, footer small { font-size: 14px; }
.scene-tab .tab-ja { font-size: 18px; }
.scene-tab .tab-en { font-size: 11px; letter-spacing: 1px; }
.scene-body h3, .plan h3, .flow h3, .blend-note h3 { font-size: 26px; }
.commitments>h3 { font-size: 27px; }
.commit-grid h4 { font-size: 22px; }
.text-link, .plan-link, .button { font-size: 16px; }
.text-link { max-width: 360px; gap: 16px; }
.price { font-size: 36px; }
.contact-direct { display: flex; flex-direction: column; align-items: center; gap: 12px; margin: 32px 0 42px; }
.contact-direct .phone { font-size: 34px; }
.contact-email { font-size: 18px; text-decoration: underline; text-underline-offset: 5px; overflow-wrap: anywhere; }
.contact-form-card { max-width: 900px; margin: 0 auto; padding: 44px; background: var(--paper); color: var(--ink); text-align: left; }
.contact-form-card h3 { font: 30px/1.5 var(--serif); margin-bottom: 24px; }
.form-intro, .form-delivery-note { font-size: 15px; margin-bottom: 26px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; }
.contact-form-card label { display: block; font-size: 17px; margin-bottom: 24px; }
.contact-form-card label>span, .form-intro>span { font-size: 12px; background: #e7d4bd; color: #593b26; padding: 3px 7px; margin-left: 6px; }
.contact-form-card input, .contact-form-card select, .contact-form-card textarea { display: block; width: 100%; min-width: 0; margin-top: 9px; padding: 13px 15px; background: #fffdf9; border: 1px solid #bca58c; border-radius: 3px; color: var(--ink); font: inherit; font-size: 17px; }
.contact-form-card textarea { resize: vertical; }
.contact-form-card input:focus-visible, .contact-form-card select:focus-visible, .contact-form-card textarea:focus-visible { outline: 2px solid #79553b; outline-offset: 2px; }
.form-submit { border: 0; cursor: pointer; }
#form-status { margin-top: 20px; font-size: 15px; }
#google-form-frame { width: 100%; height: 1150px; border: 0; background: #fff; }
#google-form-container[hidden], #contact-form[hidden] { display: none; }
#google-form-link { text-decoration: underline; }
@media(max-width:1000px) {
  .header nav { font-size: 14px; gap: 15px; }
  .plan { padding-left: 14px; padding-right: 14px; }
  .price { font-size: 30px; }
  .price span { font-size: 12px; }
  .scene-tabs { grid-template-columns: repeat(3,1fr); }
}
@media(max-width:700px) {
  .brand { font-size: 28px; }
  .header nav { font-size: 17px; }
  .menu-toggle { font-size: 13px; }
  .hero-stage-description { font-size: 17px; }
  .hero-stage-description br { display: none; }
  .hero-stage h1 { font-size: clamp(42px, 11vw, 64px); }
  .concept h2 { font-size: 36px; }
  .scene-tabs { grid-template-columns: repeat(2,1fr); }
  .scene-tab .tab-ja { font-size: 17px; }
  .scene-body h3 { font-size: 27px; }
  .price { font-size: 40px; }
  .faq summary { gap: 10px; }
  .faq summary b { flex-shrink: 0; }
  .contact { padding: 60px 5%; }
  .contact h2 { font-size: 29px; }
  .contact-form-card { padding: 28px 20px; }
  .contact-form-card h3 { font-size: 26px; }
  .form-grid { grid-template-columns: 1fr; }
  .contact-direct .phone { font-size: 30px; }
  .contact-email { font-size: 16px; }
  footer { align-items: flex-start; }
  footer small { font-size: 13px; }
}

/* 料金一覧と無料トライアル */
.price-group { margin-top: 60px; }
.price-group>h3, .blend-price h3 { font: 30px/1.7 var(--serif); margin-bottom: 12px; }
.price-group>p { margin-bottom: 26px; }
.price-group h4 { font: 24px/1.6 var(--serif); margin: 0 0 12px; }
.oil-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.capacity { font-size: 15px; padding: 14px 0; border-block: 1px solid var(--line); margin-bottom: 22px; }
.capacity strong { display: block; font-size: 21px; font-weight: 400; }
.fee-label { font-size: 15px; margin-top: 14px; }
.fee-amount { font: 40px/1.5 Georgia,serif; }
.fee-amount span { font: 17px sans-serif; padding-left: 5px; }
.fee-tax { font-size: 16px; margin-bottom: 22px; }
.rental-zero { background: #e9dccb; padding: 12px; margin-bottom: 20px; }
.rental-zero strong { font-size: 27px; margin-left: 10px; }
.blend-price { display: grid; grid-template-columns: 1.4fr 1fr; align-items: center; gap: 40px; padding: 35px; background: #e9dccb; }
.blend-price .product-photo { max-width: 350px; }
.hero-trial { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; width: fit-content; max-width: 100%; background: #f6e1ba; color: #513721; padding: 18px 24px; margin-bottom: 30px; border-left: 4px solid #b18342; }
.hero-trial strong { font-size: clamp(22px,2.3vw,34px); }
.hero-trial>span { font-size: 15px; }
.trial-banner { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 50px 8%; background: #e8c998; color: #48301e; }
.trial-banner h2 { font-size: 35px; margin: 8px 0; }
.trial-banner h2 strong { font-size: 64px; font-weight: 400; }
.trial-banner h2 span { display: inline-block; margin-left: 16px; padding: 0 15px; background: #5a3d2b; color: #fff6e9; }
.trial-banner .button { flex-shrink: 0; }
.contact .contact-trial { display: inline-block; background: #f6e1ba; color: #513721; font-size: clamp(22px,3vw,36px)!important; padding: 12px 25px; margin: 0 0 30px!important; }
@media(max-width:1000px) { .trial-banner { flex-direction: column; text-align: center; } .fee-amount { font-size: 34px; } }
@media(max-width:700px) {
  .oil-grid, .blend-price { grid-template-columns: 1fr; }
  .blend-price { padding: 25px; gap: 15px; }
  .hero-trial { padding: 14px; gap: 5px 12px; margin-bottom: 25px; }
  .hero-trial>span:last-child { width: 100%; }
  .trial-banner { padding: 35px 7%; }
  .trial-banner h2 { font-size: 24px; }
  .trial-banner h2 strong { font-size: 42px; }
  .trial-banner h2 span { margin-left: 8px; padding: 0 8px; }
  .trial-banner p { font-size: 16px; }
  .price-group>h3, .blend-price h3 { font-size: 27px; }
}

/* 全体の文字サイズと数字の高さを統一 */
:root {
  --body-size: 19px;
  --note-size: 16px;
  --number-font: Arial, 'Helvetica Neue', 'Hiragino Kaku Gothic ProN', sans-serif;
}
body { font-size: var(--body-size); }
.concept-text p, .section-top>p, .scene-lead, .scene-meta>div,
.space-copy>p:not(.eyebrow), .plan-description, .blend-note p,
.flow>div>p:last-child, .flow li p, .faq summary, .faq details>p,
.contact>p:not(.eyebrow), .commit-grid p:last-child,
.contact-form-card label, .contact-form-card input,
.contact-form-card select, .contact-form-card textarea,
.trial-banner p { font-size: var(--body-size); }
.scene-meta dt, .scent-tags span, .scene-note, .plan-note, .plan-badge,
.model, .capacity, .fee-label, .fee-tax, .form-intro, .form-delivery-note,
#form-status, footer>a:not(.brand), footer p, footer small {
  font-size: var(--note-size);
}
.eyebrow, .section-label, .scene-body .eyebrow, .plan .eyebrow,
.commit-grid .eyebrow { font-size: 15px; }
.header nav { font-size: 17px; }
.brand { font-size: 36px; }
.brand span { font-size: 14px; }
.hero-stage-description { font-size: 22px; }
.hero-stage h1 { font-size: clamp(52px, 6.5vw, 96px); }
h2, .concept h2, .space-copy h2, .flow h2, .faq h2, .contact h2 {
  font-size: clamp(36px, 3.6vw, 50px);
}
.scene-body h3, .plan h3, .flow h3, .blend-note h3,
.price-group h4 { font-size: 29px; }
.price-group>h3, .blend-price h3, .contact-form-card h3,
.commitments>h3 { font-size: 34px; }
.commit-grid h4 { font-size: 25px; }
.scene-tab .tab-ja { font-size: 20px; }
.scene-tab .tab-en { font-size: 13px; }
.text-link, .plan-link, .button { font-size: 18px; }
/* ライニング数字で上下位置を、等幅数字で桁幅を揃える。 */
.fee-amount, .price, .capacity strong, .price-group h4,
.rental-zero strong, .blend-note strong, .contact-direct .phone {
  font-family: var(--number-font);
  font-variant-numeric: lining-nums tabular-nums;
  font-feature-settings: 'lnum' 1, 'tnum' 1;
  font-style: normal;
}
.fee-amount, .price {
  font-size: 46px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0;
  white-space: nowrap;
}
.fee-amount span, .price span { font: 20px/1.5 var(--number-font); vertical-align: baseline; }
.capacity strong { font-size: 25px; }
.contact-email { font-size: 20px; }
.plan, .scene-body, .blend-price>div { min-width: 0; }
@media(min-width:701px) and (max-width:1100px) {
  .plan-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .header nav { gap: 12px; font-size: 15px; }
  .nav-cta { padding: 13px 15px; }
  .nav-cta span { padding-left: 12px; }
}
@media(max-width:700px) {
  :root { --body-size: 18px; }
  .brand { font-size: 32px; }
  .header nav { font-size: 18px; }
  .menu-toggle { font-size: 15px; }
  .hero-stage h1 { font-size: clamp(46px,12vw,72px); }
  .hero-stage-description { font-size: 20px; }
  h2, .concept h2, .space-copy h2, .flow h2, .faq h2, .contact h2 { font-size: 34px; }
  .scene-body h3, .plan h3, .flow h3, .blend-note h3, .price-group h4 { font-size: 28px; }
  .price-group>h3, .blend-price h3, .contact-form-card h3, .commitments>h3 { font-size: 29px; }
  .scene-tab .tab-ja { font-size: 19px; }
  .scene-tab .tab-en { font-size: 12px; }
  .fee-amount, .price { font-size: 42px; }
  .contact-email { font-size: 18px; }
  .contact-form-card { padding: 28px 16px; }
  .contact-form-card .button { padding: 18px 14px; gap: 10px; }
}

/* 余香：琥珀の光、紙の質感、香りの曲線を重ねた背景 */
body {
  background-color: #f6efe5;
  background-image:
    radial-gradient(ellipse at 0% 15%, rgba(195,151,91,.13), transparent 48%),
    radial-gradient(ellipse at 100% 65%, rgba(167,117,67,.11), transparent 45%),
    repeating-linear-gradient(100deg, rgba(112,79,45,.018) 0 1px, transparent 1px 5px);
}
.header {
  background: linear-gradient(110deg, #f5eadd, #e8d6bf 75%, #f0e0cb);
  border-bottom-color: #cbb18e;
  box-shadow: 0 4px 24px rgba(57,33,15,.06);
}
.concept, .scenes, .flow, .faq, .contact, .trial-banner {
  position: relative;
  isolation: isolate;
}
.concept::before, .faq::before {
  content: ''; position: absolute; z-index: -1; pointer-events: none;
  width: min(44vw, 560px); aspect-ratio: 1; border-radius: 50%;
  right: 3%; top: 8%;
  background: radial-gradient(circle, rgba(200,153,85,.15), rgba(222,188,140,.04) 55%, transparent 72%);
}
.concept::after {
  content: ''; position: absolute; z-index: -1; pointer-events: none;
  inset: 12% 4% 12% 56%; border: 1px solid rgba(153,116,72,.13);
  border-radius: 50% 50% 4px 4px;
  transform: rotate(8deg);
}
.scenes {
  background:
    radial-gradient(ellipse at 95% 5%, rgba(255,248,227,.75), transparent 50%),
    linear-gradient(135deg, #e9d8c2, #f1e7d9 55%, #e0c7a7);
  border-block: 1px solid rgba(151,115,69,.2);
}
.scene-tabs { background: #d4b998; border-color: #d4b998; border-radius: 8px; overflow: hidden; }
.scene-tab { background: rgba(253,247,236,.4); }
.scene-tab:hover { background: #f8edda; }
.scene-tab[aria-selected="true"] { background: #fff8eb; }
.scene-photo, .space-photo { border-radius: 5px 5px 60px 5px; box-shadow: 0 20px 45px -30px rgba(69,43,19,.35); }
.space-section { background: linear-gradient(100deg, transparent 35%, rgba(235,215,186,.38), transparent); }
.plan {
  background: linear-gradient(145deg, rgba(255,253,247,.94), rgba(247,236,220,.92));
  border: 1px solid #ddc8ab;
  border-radius: 12px;
  box-shadow: 0 12px 32px -18px rgba(79,46,18,.23), inset 0 1px 0 #fffaf0;
}
.product-photo {
  background:
    radial-gradient(ellipse at 50% 30%, rgba(255,252,242,.7), transparent 70%),
    linear-gradient(135deg, #ecdfce, #e5d0b4);
  border-color: #ccb18e;
  border-radius: 7px;
}
.price-group>h3::before {
  content: ''; display: inline-block; width: 30px; height: 1px;
  margin-right: 16px; vertical-align: middle; background: #a87940;
}
.blend-price {
  border: 1px solid #cfb38c; border-radius: 12px;
  background: radial-gradient(ellipse at 90% 10%, #f8ecd5, transparent 65%), linear-gradient(125deg, #e3ccaa, #f1e2ca);
  box-shadow: 0 14px 38px -24px rgba(79,46,18,.23);
}
.flow {
  background:
    repeating-linear-gradient(115deg, transparent 0 85px, rgba(255,247,226,.23) 86px 87px, transparent 88px 170px),
    linear-gradient(120deg, #e4d0b5, #f3e6d2 60%, #e3c9a6);
  border-block: 1px solid #d5bfa1;
}
.flow li { border-bottom-color: rgba(128,87,43,.24); }
.faq-list { background: rgba(255,250,241,.57); border: 1px solid #e0cfb7; padding: 8px 28px; border-radius: 12px; }
.faq details:last-child { border-bottom: 0; }
.trial-banner {
  background:
    radial-gradient(ellipse at 20% 0%, rgba(255,246,211,.7), transparent 60%),
    linear-gradient(115deg, #d7b17a, #f0d9ad 48%, #d2a66e);
  border-block: 1px solid #c8a171;
  box-shadow: inset 0 1px 0 rgba(255,249,226,.6);
}
.contact {
  background:
    radial-gradient(ellipse at 0% 0%, rgba(194,142,73,.3), transparent 50%),
    radial-gradient(ellipse at 100% 70%, rgba(176,117,52,.2), transparent 55%),
    repeating-linear-gradient(115deg, transparent 0 119px, rgba(240,211,166,.035) 120px 121px, transparent 122px 240px),
    linear-gradient(140deg, #4b3020, #312118 65%, #513824);
}
.contact-form-card {
  background: linear-gradient(135deg, #fff8ee, #f2e6d4);
  border: 1px solid #c9a77d; border-radius: 14px;
  box-shadow: 0 25px 65px rgba(18,9,3,.24), inset 0 1px 0 #fffaf2;
}
.contact .contact-trial { background: linear-gradient(100deg, #ebc58c, #ffebbf, #e8c28c); border: 1px solid #e7c28b; }
.button, .nav-cta { border-radius: 4px; box-shadow: 0 5px 14px rgba(61,36,17,.12); }
footer { background: linear-gradient(110deg, #e5cfb2, #f0e0c9, #e0c5a2); border-top: 1px solid #c5a77f; }
@media(max-width:700px) {
  .concept::after { inset: 10% 5% 12% 20%; }
  .faq-list { padding: 6px 16px; }
  .scene-photo, .space-photo { border-bottom-right-radius: 35px; }
}

/* 木・香り・ディフューザーの写真を淡く重ねる背景。
   提供写真をそのまま使い、CSSのみで濃度と見せる位置を調整。 */
.concept {
  background-image:
    linear-gradient(90deg, rgba(246,239,229,.98) 0%, rgba(246,239,229,.93) 45%, rgba(246,239,229,.84) 100%),
    url('images/hero.png?v=2');
  background-size: cover;
  background-position: center, right center;
  background-repeat: no-repeat;
}
.concept::after { border-color: rgba(153,116,72,.09); }
.scenes {
  background-image:
    linear-gradient(110deg, rgba(241,231,217,.95), rgba(241,231,217,.91) 60%, rgba(241,231,217,.84)),
    url('images/hero.png?v=2');
  background-size: cover;
  background-position: center, 85% center;
  background-repeat: no-repeat;
}
.plans {
  background-image:
    linear-gradient(180deg, rgba(246,239,229,.92), rgba(246,239,229,.95) 42%, rgba(246,239,229,.89)),
    url('images/hero.png?v=2');
  background-size: cover, auto 1100px;
  background-position: center, right top;
  background-repeat: no-repeat;
}
.faq {
  background-image:
    linear-gradient(90deg, rgba(246,239,229,.84), rgba(246,239,229,.94) 48%, rgba(246,239,229,.98)),
    url('images/hero.png?v=2');
  background-size: cover;
  background-position: center, right center;
  background-repeat: no-repeat;
}
.faq-list { background: rgba(255,250,241,.86); }
.contact {
  background-image:
    linear-gradient(125deg, rgba(57,36,23,.92), rgba(41,27,19,.90) 60%, rgba(63,42,27,.86)),
    url('images/hero.png?v=2');
  background-size: cover;
  background-position: center, 80% center;
  background-repeat: no-repeat;
}
@media(max-width:700px) {
  .concept {
    background-image: linear-gradient(90deg, rgba(246,239,229,.96), rgba(246,239,229,.87)), url('images/hero.png?v=2');
    background-position: center, 88% center;
  }
  .scenes { background-position: center, 85% center; }
  .plans { background-size: cover, auto 850px; background-position: center, 86% top; }
  .faq { background-position: center, 88% center; }
}

/* セクション番号・英語ラベルの視認性 */
.section-label { font-size: clamp(26px, 2.8vw, 38px); line-height: 1.5; letter-spacing: .12em; margin-bottom: 32px; }
.section-top .section-label, .faq .section-label { margin-bottom: 28px; }
@media(max-width:700px) {
  .section-label { font-size: 26px; letter-spacing: .08em; }
}

/* 利用シーンの写真 */
.scene-photo { position: relative; overflow: hidden; }
.scene-photo img { display: block; width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; object-position: center; }

/* 利用シーン写真：全景を大きく表示し、端の商品も切らない */
.scene-panel {
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  gap: 4%;
}
.scene-photo {
  width: 100%;
  aspect-ratio: auto;
  border-radius: 5px;
}
.scene-photo img {
  position: static;
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}
@media(max-width:1100px) {
  .scene-panel { grid-template-columns: minmax(0, 1fr); gap: 32px; }
}
@media(max-width:700px) {
  .scene-photo { aspect-ratio: auto; border-radius: 5px; }
}

/* 参考ページの構成：コンセプト → 3つの特徴 → 3つの補足 → 導入 */
.reference-concept { text-align: center; background: linear-gradient(150deg,#f8f1e7,#efe0cb); }
.reference-concept h2 { font-size: clamp(30px,3.1vw,46px); line-height: 1.8; }
.reference-intro { max-width: 850px; margin: 30px auto 50px; font-size: 19px; line-height: 2.2; }
.concept-photo-pair { display: grid; grid-template-columns: 1.2fr 1fr; gap: 35px; align-items: center; }
.concept-photo-pair .reference-photo:last-child { margin-top: 70px; }
.reference-photo { position: relative; min-width: 0; aspect-ratio: 4/3; background: #e8dbc9; border: 1px dashed #bfa485; display: grid; place-items: center; }
.reference-photo>span { display: flex; flex-direction: column; gap: 12px; text-align: center; color: #8b735a; font-size: 30px; padding: 20px; }
.reference-photo small { font-size: 15px; }
.reference-photo:has(img) { aspect-ratio: auto; border: 0; }
.reference-photo img { display: block; width: 100%; height: auto; }
.reference-features { background: #faf4eb; }
.reference-feature { display: grid; grid-template-columns: 1fr 1fr; gap: 7%; align-items: center; margin-top: 75px; }
.reference-feature:nth-of-type(even) .reference-photo { order: 2; }
.reference-feature:nth-of-type(even)>div:last-child { order: 1; }
.feature-number { color: #9b754b; font: 24px/1.5 Arial,sans-serif; letter-spacing: .12em; margin-bottom: 22px; }
.reference-feature h3 { font: 32px/1.8 var(--serif); margin-bottom: 24px; }
.reference-feature>div>p:last-child { font-size: 19px; line-height: 2.1; }
.reference-benefits { background: linear-gradient(140deg,#e9d8be,#f3e9da); }
.reference-benefit-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px; }
.reference-benefit-grid h3 { font: 27px/1.7 var(--serif); margin: 25px 0 20px; }
.reference-benefit-grid article>p { font-size: 18px; line-height: 2; }
@media(max-width:900px) {
 .reference-feature { grid-template-columns: 1fr; gap: 30px; }
 .reference-feature:nth-of-type(even) .reference-photo, .reference-feature:nth-of-type(even)>div:last-child { order: initial; }
 .reference-benefit-grid { grid-template-columns: 1fr; gap: 50px; }
}
@media(max-width:700px) {
 .reference-concept h2 { font-size: 28px; }
 .reference-intro { font-size: 18px; text-align: left; }
 .reference-intro br { display: none; }
 .concept-photo-pair { grid-template-columns: 1fr; gap: 24px; }
 .concept-photo-pair .reference-photo:last-child { margin-top: 0; }
 .reference-feature { margin-top: 50px; }
 .reference-feature h3 { font-size: 28px; }
 .reference-feature>div>p:last-child { font-size: 18px; }
}

/* コンセプトの写真は1枚を全景で表示 */
.concept-photo-single { max-width: 1100px; margin: 45px auto 0; }
.concept-photo-single img { display: block; width: 100%; height: auto; border-radius: 6px; box-shadow: 0 18px 45px -25px rgba(69,43,19,.3); }

.reference-benefit-grid article>p+p { margin-top: 18px; }

/* ナビゲーションの無料トライアルCTA */
.header .nav-trial {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  padding: 16px 26px;
  border-radius: 999px;
  background: #b64626;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  white-space: nowrap;
  box-shadow: 0 5px 18px rgba(137,48,23,.2);
  transition: background .2s;
}
.header .nav-trial:hover { background: #96371c; }
.header .nav-trial span { padding-left: 0; }
@media(min-width:701px) and (max-width:1100px) {
  .header { padding-inline: 3%; }
  .header nav { gap: 12px; font-size: 14px; }
  .header .nav-trial { font-size: 16px; padding: 14px 18px; gap: 8px; }
}
@media(max-width:700px) {
  .header .nav-trial { width: 100%; font-size: 18px; padding: 16px 20px; }
}

/* トップの新しいコピーを画面幅に合わせて表示 */
.hero-stage h1 { font-size: clamp(40px, 5.2vw, 78px); letter-spacing: .06em; }
@media(max-width:700px) {
  .hero-stage h1 { font-size: clamp(28px, 7.6vw, 48px); letter-spacing: .02em; }
  .hero-stage-description br { display: initial; }
}

/* ナビゲーションと同じ名称・順番のセクション */
.products { background: linear-gradient(130deg,#f8efe2,#e9d7bd); }
.products .plan-grid { margin-top: 40px; }
.products .plan-link { margin-top: 25px; }
.concern-intro { font-size: var(--body-size); line-height: 2; }
.header nav { gap: 18px; font-size: 16px; }
@media(min-width:1101px) and (max-width:1350px) {
 .header { padding-inline: 3%; }
 .header nav { gap: 12px; font-size: 14px; }
 .header .nav-trial { padding: 14px 18px; font-size: 16px; }
}
@media(max-width:1100px) {
 .header { height: 80px; }
 .menu-toggle { display: block; background: none; border: 0; color: var(--ink); padding: 15px; font-size: 15px; }
 .header nav { display: none; position: absolute; top: 80px; left: 0; right: 0; padding: 25px 6%; background: var(--paper); border-bottom: 1px solid var(--line); flex-direction: column; align-items: stretch; gap: 20px; font-size: 18px; }
 .header nav.open { display: flex; }
 .header .nav-trial { width: 100%; }
}

/* セクションの左揃えを統一 */
.reference-concept { text-align: left; }
.reference-intro { margin-left: 0; margin-right: 0; }
@media(min-width:1101px) {
 .header { padding-inline: 2.5%; }
 .header nav { gap: 12px; font-size: 14px; }
 .header .nav-trial { font-size: 16px; padding: 14px 18px; }
}

/* 私たちの想い：写真を使わず、3つの文章をゆったり読ませる */
.reference-concept #concept-title {
  font: 400 clamp(26px, 2.8vw, 38px)/1.5 Arial, 'Hiragino Kaku Gothic ProN', sans-serif;
  letter-spacing: .12em;
  margin-bottom: 48px;
}
.philosophy-stories { max-width: 1120px; }
.philosophy-story {
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr);
  gap: 40px;
  padding: 45px 0;
  border-top: 1px solid #d4bea0;
  text-align: left;
}
.philosophy-story h3 { font: 32px/1.8 var(--serif); color: #896849; }
.philosophy-copy { font-size: var(--body-size); line-height: 2.2; }
.philosophy-copy p+p { margin-top: 26px; }
@media(max-width:900px) {
  .philosophy-story { grid-template-columns: 1fr; gap: 22px; }
}
@media(max-width:700px) {
  .reference-concept #concept-title { font-size: 26px; letter-spacing: .08em; }
  .philosophy-story { padding: 32px 0; }
  .philosophy-story h3 { font-size: 29px; }
  .philosophy-copy br { display: none; }
}

/* ナビゲーションを等間隔で配置。狭い画面では詰めずにメニュー表示。 */
@media(min-width:1351px) {
  .header { gap: 40px; padding-inline: 3%; }
  .header .brand { flex-shrink: 0; }
  .header nav { flex: 1; display: flex; justify-content: space-evenly; gap: 24px; font-size: 15px; }
  .header nav>a { white-space: nowrap; }
  .header .nav-trial { margin-left: 8px; }
}
@media(min-width:1101px) and (max-width:1350px) {
  .header { height: 80px; }
  .menu-toggle { display: block; background: none; border: 0; color: var(--ink); padding: 15px; font-size: 15px; }
  .header nav { display: none; position: absolute; top: 80px; left: 0; right: 0; padding: 28px 6%; background: var(--paper); border-bottom: 1px solid var(--line); flex-direction: column; align-items: stretch; gap: 24px; font-size: 18px; }
  .header nav.open { display: flex; }
  .header .nav-trial { width: 100%; }
}
@media(max-width:1100px) { .header nav { gap: 24px; } }
/* 文意の区切りで改行し、語句の途中での折り返しを避ける */
.thought-line { display: block; }
.thought-phrase { display: inline-block; max-width: 100%; word-break: normal; overflow-wrap: anywhere; }

/* ナビゲーションは中程度の間隔、想いの文章は右端まで活用 */
@media(min-width:1351px) {
  .header nav { flex: 0 1 auto; justify-content: flex-end; gap: 22px; }
  .header .nav-trial { margin-left: 0; }
}
.philosophy-stories { max-width: none; }
.philosophy-story { grid-template-columns: 150px minmax(0, 1fr); gap: 30px; }
@media(max-width:900px) {
  .philosophy-story { grid-template-columns: 1fr; gap: 22px; }
}


/* 「余裕」の後の余白をコンパクトに */
.reference-concept { padding-bottom: 45px; }
.philosophy-story:last-child { padding-bottom: 10px; }
@media(max-width:700px) {
  .reference-concept { padding-bottom: 30px; }
  .philosophy-story:last-child { padding-bottom: 5px; }
}

/* お悩み事：問いかけ・チェックリストから解決策へ */
.concerns-section { background: #faf4eb; }
.concerns-dark { position: relative; padding: 70px 8% 90px; color: #fff8ed; background: radial-gradient(ellipse at top left, #705440, transparent 65%), linear-gradient(135deg,#483326,#241a14); }
.concerns-dark::after { content: ''; position: absolute; top: calc(100% - 1px); left: 0; right: 0; height: 38px; background: #241a14; clip-path: polygon(0 0,100% 0,50% 100%); }
.concerns-inner { max-width: 1250px; margin: auto; }
.concerns-dark .section-label { color: #dcc09b; }
.concerns-dark h2 { text-align: center; font-family: 'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif; font-weight: 700; font-size: clamp(28px,3.1vw,46px); line-height: 1.9; letter-spacing: .02em; }
.concerns-title-line { display: block; }
.concerns-dark mark { color: #5f3c21; background: #f8e5c4; padding: .07em .22em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.concerns-list { list-style: none; padding: 0; margin: 45px auto 0; max-width: 1100px; }
.concerns-list li { position: relative; padding-left: 44px; margin-top: 25px; font-size: clamp(19px,1.75vw,25px); font-weight: 600; line-height: 1.9; }
.concerns-list li::before { content: ''; position: absolute; left: 0; top: .38em; width: 23px; height: 23px; border: 3px solid #bba58c; }
.concerns-list strong { font-weight: 700; text-decoration: underline; text-decoration-color: #cba16a; text-decoration-thickness: 5px; text-underline-offset: 6px; }
.concerns-solution { max-width: 1500px; margin: auto; padding: 95px 8% 85px; background: radial-gradient(ellipse at 90% 0%,rgba(207,167,108,.14),transparent 65%); }
.concerns-solution>h2 { text-align: center; font-size: clamp(29px,3vw,43px); line-height: 1.85; margin-bottom: 50px; }
.concerns-solution>h2 strong { color: #805831; font-weight: 600; border-bottom: 3px solid #bb935e; }
.solution-grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: 6%; align-items: start; }
.solution-copy p { font-size: var(--body-size); line-height: 2.2; }
.solution-copy p+p { margin-top: 28px; }
.solution-copy strong { font-weight: 600; background: #e7d3b5; padding: 2px 0; }
.solution-cards { display: grid; gap: 18px; }
.solution-cards article { display: grid; grid-template-columns: 38% 1fr; align-items: center; background: #eee1ce; border: 1px solid #ddc6a7; }
.solution-cards img { width: 100%; height: auto; display: block; }
.solution-cards article>div { padding: 16px; }
.solution-cards article p { font-size: 12px; letter-spacing: .06em; color: #80613f; margin-bottom: 7px; }
.solution-cards h3 { font-size: 21px; line-height: 1.7; font-weight: 600; }
@media(max-width:1000px) { .solution-grid { grid-template-columns: 1fr; gap: 35px; } }
@media(max-width:700px) {
 .concerns-dark { padding: 55px 7% 60px; }
 .concerns-dark h2 { font-size: 27px; }
 .concerns-list { margin-top: 30px; }
 .concerns-list li { padding-left: 31px; font-size: 18px; margin-top: 24px; }
 .concerns-list li::before { width: 17px; height: 17px; border-width: 2px; }
 .concerns-list strong { text-decoration-thickness: 3px; text-underline-offset: 4px; }
 .concerns-solution { padding: 75px 7% 60px; }
 .concerns-solution>h2 { font-size: 29px; }
 .solution-cards article { grid-template-columns: 1fr; }
 .solution-cards article>div { padding: 20px; }
 .solution-cards h3 { font-size: 23px; }
}

/* お悩み事：淡い写真背景とブラウンの文字 */
.concerns-dark {
  color: #493627;
  background-color: #eee2d0;
  background-image:
    linear-gradient(110deg, rgba(249,242,230,.94), rgba(244,233,214,.90) 55%, rgba(237,220,194,.87)),
    url('images/AdobeStock_566155285.jpeg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.concerns-dark::after { background: #eee0c9; }
.concerns-dark .section-label { color: #896849; }
.concerns-dark mark { color: #684728; background: rgba(255,252,244,.9); }
.concerns-list li::before { border-color: #aa8a63; }
.concerns-list strong { text-decoration-color: #c5a473; }

/* 01は白、02は淡いベージュで穏やかに区切る */
.reference-concept { background: #fff; }

/* 解決策は白背景、想いのキーフレーズに淡い金色のハイライト */
.concerns-section { background: #fff; }
.concerns-solution { background: #fff; }
.philosophy-highlight {
  color: inherit;
  background: linear-gradient(transparent 52%, #f2dfb8 52%, #f2dfb8 94%, transparent 94%);
  font-weight: 600;
  padding: 0 .06em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

/* 製品は白、ユースケースは温かみのあるグレージュ */
.products { background: #fff; }
.scenes {
  background: linear-gradient(130deg, #eae7e1, #f0ede7 55%, #e3ded5);
  border-block-color: #d4cdc1;
}
.scene-tabs { background: #d5cec2; border-color: #d5cec2; }
.scene-tab { background: #e7e2d9; }
.scene-tab:hover { background: #f4efe7; }
.scene-tab[aria-selected="true"] { background: #fffaf2; }

/* ユースケース：黄みを添えた淡いキャメルベージュ */
.scenes {
  background: linear-gradient(130deg, #ead9b9, #f2e6cd 55%, #e5cfaa);
  border-block-color: #d5bc91;
}
.scene-tabs { background: #d7bd94; border-color: #d7bd94; }
.scene-tab { background: #ebdbbd; }
.scene-tab:hover { background: #f6eacf; }
.scene-tab[aria-selected="true"] { background: #fff8e8; }

/* 選択した利用シーンの写真を背景にも反映 */
.scenes {
  --scene-background: url('images/病院・診療所.png');
  background-color: #edddbf;
  background-image: linear-gradient(110deg, rgba(246,235,215,.94), rgba(243,228,202,.88) 55%, rgba(237,218,183,.85)), var(--scene-background);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* 初期費用とレンタルを続けて比較できる料金例 */
.price-subtitle { font-size: 24px; color: #896849; }
.price-example { margin-top: 45px; padding: 36px; background: #fffaf2; border: 1px solid #cdb18b; border-radius: 12px; }
.price-example>h3 { font: 30px/1.7 var(--serif); margin: 12px 0; }
.example-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; margin-top: 28px; }
.example-grid article { padding: 28px; background: #f2e6d3; border: 1px solid #ddc8ab; }
.price-example h4 { font-size: 23px; font-weight: 500; margin: 0 0 20px; }
.example-total { border-top: 1px solid #ccb28d; padding-top: 20px; margin-top: 24px; }
.example-total strong { font-family: var(--number-font); font-variant-numeric: lining-nums tabular-nums; font-size: 27px; }
.example-blend { margin-top: 28px; padding-top: 28px; border-top: 1px solid var(--line); }
.price-example .plan-note { margin-top: 24px; }
@media(max-width:700px) { .price-example { padding: 24px 18px; } .example-grid { grid-template-columns: 1fr; } .example-grid article { padding: 22px 16px; } .price-example>h3 { font-size: 26px; } }

/* 購入・レンタル・費用例を別のまとまりとして区切る */
.purchase-group, .rental-group {
  padding: 38px;
  border-radius: 14px;
  margin-top: 55px;
}
.purchase-group {
  background: #fff;
  border: 1px solid #d8c8b3;
  border-top: 5px solid #b29a7a;
  box-shadow: 0 10px 30px rgba(72,46,24,.04);
}
.rental-group {
  background: #ede0c5;
  border: 1px solid #cdb184;
  border-top: 5px solid #9a713d;
}
.purchase-group .plan { background: #faf7f1; box-shadow: none; }
.rental-group .plan { background: #fffaf0; box-shadow: none; }
.price-example {
  margin-top: 60px;
  padding: 38px;
  background: #e8e4de;
  border: 2px solid #958574;
  border-top: 5px solid #69523d;
  border-radius: 14px;
  box-shadow: 0 12px 28px rgba(72,46,24,.07);
}
.price-example .example-grid article { background: #fffdf9; border-color: #c9bca9; border-radius: 8px; }
.price-example .example-blend { border-top-color: #b5a590; }
@media(min-width:1101px) and (max-width:1250px) {
  .purchase-group .plan-grid, .rental-group .plan-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media(max-width:700px) {
  .purchase-group, .rental-group, .price-example { padding: 28px 16px; margin-top: 40px; }
}

.example-grid.example-rental-only { grid-template-columns: minmax(0,1fr); }

/* 余香の3つの要素 */
.solution-pillars { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 30px; align-items: start; }
.solution-pillars article { min-width: 0; }
.solution-pillars img { display: block; width: 100%; height: auto; border-radius: 5px; }
.solution-pillars article>div { padding-top: 25px; }
.solution-pillars h3 { font: 27px/1.7 var(--serif); margin-bottom: 20px; color: #684728; }
.solution-pillars p { font-size: var(--body-size); line-height: 2; }
@media(max-width:1000px) { .solution-pillars { grid-template-columns: 1fr; gap: 45px; } }

/* 3つの強み：同じ写真比率・番号付きカード */
.solution-pillars { align-items: stretch; gap: 24px; }
.solution-pillars .pillar-card {
  position: relative; padding: 20px;
  background: #fffdf9; border: 1px solid #d6bea0; border-radius: 10px;
  box-shadow: 0 10px 28px -20px rgba(83,51,24,.3);
}
.pillar-number {
  display: block; width: fit-content; margin-bottom: 16px;
  padding: 5px 13px; background: #705033; color: #fff8ed;
  font: 500 22px/1.4 var(--number-font);
  font-variant-numeric: lining-nums tabular-nums; border-radius: 3px;
}
.solution-pillars img {
  width: 100%; aspect-ratio: 16 / 9; height: auto;
  object-fit: cover; object-position: center; border-radius: 4px;
}
.solution-pillars article>div { padding-top: 24px; }
.solution-pillars h3 { min-height: 5.1em; margin-bottom: 20px; }
@media(max-width:1000px) {
  .solution-pillars h3 { min-height: 0; }
  .solution-pillars .pillar-card { padding: 22px; }
}

/* カード上部に番号とタイトルを横並び */
.solution-pillars article>.pillar-heading { display: flex; align-items: flex-start; gap: 14px; padding-top: 0; margin-bottom: 22px; min-height: 138px; }
.pillar-heading .pillar-number { flex-shrink: 0; margin: 4px 0 0; }
.solution-pillars .pillar-heading h3 { min-height: 0; margin: 0; font-size: 25px; line-height: 1.7; }
.solution-pillars article>.pillar-copy { padding-top: 24px; }
/* 見出し下の余白：固定高さをやめ、subgridで最も長い見出しに合わせて写真位置を揃える */
.solution-pillars article>.pillar-heading { min-height: 0; }
@media(min-width:1001px) {
  .solution-pillars .pillar-card { display: grid; grid-row: span 3; grid-template-rows: subgrid; row-gap: 0; }
}

/* ユースケースの見出しと説明を縦に配置 */
.scenes .section-top { display: block; }
.scenes .section-top>p { margin-top: 22px; padding-bottom: 0; }
#scenes-title { white-space: nowrap; font-size: clamp(19px, 3.3vw, 46px); letter-spacing: .02em; }
@media(max-width:700px) { #scenes-title { font-size: clamp(18px, 4.65vw, 32px); } }

/* セクション見出しを横一行で使える幅に広げる */
.plans .section-top { display: block; }
.plans .section-top>p { margin-top: 22px; padding-bottom: 0; }
.flow { grid-template-columns: minmax(0,1fr); gap: 40px; }
.flow ol { max-width: 950px; width: 100%; }
.products h2, .plans h2, .flow h2, .contact h2 { font-size: clamp(28px, 2.8vw, 42px); letter-spacing: .02em; }

.footer-company { margin-left: auto; font-size: 16px; }

/* ユースケース：お悩み・空間イメージ・香料（写真枠） */
.scene-block { border-top: 1px solid var(--line); padding: 18px 0 20px; }
.scene-block:last-of-type { border-bottom: 1px solid var(--line); }
.scene-block h4 { margin: 0 0 10px; font: 400 var(--note-size, 14px)/1.6 var(--serif); letter-spacing: .1em; color: #896849; }
.scene-needs { list-style: none; margin: 0; padding: 0; }
.scene-needs li { position: relative; padding-left: 1.2em; font-size: var(--body-size, 15px); line-height: 1.9; }
.scene-needs li + li { margin-top: 6px; }
.scene-needs li::before { content: "・"; position: absolute; left: 0; }
.scene-image-text { font: var(--body-size, 15px)/2 var(--serif); letter-spacing: .04em; }
.scent-photos { list-style: none; margin: 4px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.scent-photos p { margin-top: 8px; text-align: center; font-size: var(--note-size, 14px); letter-spacing: .06em; }
.scent-photo { position: relative; aspect-ratio: 1; border: 1px dashed #cdb69d; border-radius: 5px; background: rgba(255,250,242,.55); overflow: hidden; display: flex; align-items: center; justify-content: center; }
.scent-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.scent-photo-label { font: 11px/1 Arial, sans-serif; letter-spacing: 2px; color: #a88e72; }
.scent-photo:has(img) .scent-photo-label { display: none; }
.scene-block .scene-note { margin-top: 14px; }
@media(max-width:700px) {
  .scent-photos { gap: 10px; }
  .scene-image-text br { display: none; }
}

/* 改行は単語・文節の区切り（<wbr>）でのみ行い、語句の途中で折り返さない */
.phrase-wrap { word-break: keep-all; overflow-wrap: anywhere; }
.nowrap { white-space: nowrap; }
/* 製品カード：説明文が「空間に。」の手前で改行されるよう左右余白を調整、注記削除に伴い下余白を縮小 */
#products .plan { padding-left: 20px; padding-right: 20px; }
#products { padding-bottom: 60px; }
/* 各セクション見出し（番号ラベル）上の余白を「05 / 価格表」に合わせて統一 */
:root { --section-head-top: 40px; }
#concept, #scenes, #products, #plans, #flow, #faq, .concerns-dark { padding-top: var(--section-head-top); }
@media (max-width: 700px) { :root { --section-head-top: 65px; } }
/* メインコピー「空間に、香りという余白を。」は一行で表示 */
.hero-stage-content { max-width: none; }
.hero-stage h1 { white-space: nowrap; }
@media (max-width: 700px) { .hero-stage h1 { font-size: 6.2vw; } }
/* 特徴カード本文：カード幅に合わせて文字サイズを調整し、指定の位置で改行（入りきらない幅では通常の折り返し） */
.solution-pillars .pillar-copy { container-type: inline-size; }
.solution-pillars .pillar-copy p { font-size: clamp(13px, 4.1cqi, 19px); }
.copy-line { display: inline; }
@container (min-width: 318px) { .copy-line { display: block; } }
/* 特徴カード本文を大きく表示するため、カード幅を広げ、和文の字詰め（palt）を適用 */
.solution-pillars .pillar-copy p { font-feature-settings: "palt"; letter-spacing: 0; }
@media (min-width: 1001px) {
  .concerns-solution { padding-left: 4%; padding-right: 4%; }
  .solution-pillars .pillar-card { padding-left: 18px; padding-right: 18px; }
}
/* 製品写真（背景#f4f4f4の切り抜き写真を全体表示） */
.product-photo.has-photo { height: 240px; padding: 14px; background: #f4f4f4; border: 1px solid #e6dccf; display: flex; align-items: center; justify-content: center; }
.product-photo.has-photo img { width: 100%; height: 100%; object-fit: contain; }
/* 製品スペック */
.product-specs { margin: 0 0 22px; border-top: 1px solid var(--line); text-align: left; }
.product-specs>div { display: grid; grid-template-columns: 5.5em 1fr; gap: 10px; padding: 10px 2px; border-bottom: 1px solid var(--line); font-size: 16px; line-height: 1.6; }
.product-specs dt { color: var(--muted); font-size: 14px; padding-top: 1px; }
.product-specs dd { margin: 0; }
.product-specs dd small { display: block; font-size: 12px; color: var(--muted); }
/* 製品名：2行分の高さに揃えて写真位置を統一 */
#products .plan h3, .rental-group .plan h4 { line-height: 1.5; min-height: 3em; display: flex; align-items: center; justify-content: center; }
@media (max-width: 700px) { #products .plan h3, .rental-group .plan h4 { min-height: 0; } }
#products .plan { padding-bottom: 16px; }
/* オリジナルブレンドの写真 */
.blend-photo { max-width: 350px; margin-top: 22px; border-radius: 7px; overflow: hidden; aspect-ratio: 16 / 10; }
.blend-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* 費用イメージ：TTA_100の写真・噴霧範囲・内訳 */
.example-card { display: grid; grid-template-columns: minmax(0, 260px) minmax(0, 1fr); gap: 32px; align-items: center; }
.example-card .product-photo.has-photo { margin: 0; height: 260px; }
.example-range { display: flex; align-items: baseline; gap: 16px; font-size: 14px; color: var(--muted); padding-bottom: 14px; border-bottom: 1px solid #ccb28d; }
.example-range strong { font-size: 20px; font-weight: 400; color: var(--ink); }
.example-breakdown { margin: 0; }
.example-breakdown>div { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 16px; }
.example-breakdown dt { color: var(--ink); }
.example-breakdown dd { margin: 0; font-variant-numeric: tabular-nums; white-space: nowrap; }
.price-example .example-total { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; border-top: 0; margin-top: 0; padding-top: 18px; font-size: 16px; }
.price-example .example-total strong small { font-size: 14px; font-weight: 400; margin-left: 4px; }
@media (max-width: 700px) { .example-card { grid-template-columns: 1fr; gap: 20px; } .example-card .product-photo.has-photo { height: 220px; } }
/* 製品カード：設置場所イメージ */
.product-places { text-align: center; }
.product-places-label { font-size: 13px; letter-spacing: .08em; color: var(--muted); margin-bottom: 8px; }
.product-places-list { font-size: 15px; line-height: 1.9; word-break: keep-all; }
.place-item { white-space: nowrap; }
.place-sep { color: #b69a7c; }

/* ===== Mobile UX refinement 2026-09-22 ===== */
@media (max-width: 767px) {
  html, body { max-width: 100%; overflow-x: hidden; }
  body { font-size: 15px; line-height: 1.75; }
  .header { height: 72px; padding: 0 20px; position: sticky; top: 0; }
  .header nav { top: 72px; max-height: calc(100dvh - 72px); overflow-y: auto; padding: 24px 20px 30px; }
  .brand { font-size: 25px; }
  .brand span { font-size: 8px; }
  .section { padding: 64px 20px; }
  h2, .space-copy h2, .flow h2, .faq h2, .contact h2 { font-size: clamp(26px, 7.5vw, 34px); line-height: 1.55; }
  .section-label, .eyebrow { font-size: 10px; }

  .hero-stage { min-height: calc(100svh - 72px); padding: 72px 20px 64px; align-items: flex-end; }
  .hero-stage { --hero-photo-position: 70% center; }
  .hero-stage::after { background: linear-gradient(180deg, rgba(30,17,8,.08) 15%, rgba(30,17,8,.32) 52%, rgba(30,17,8,.78) 100%); }
  .hero-stage-content { max-width: 100%; }
  .hero-stage h1 { font-size: clamp(30px, 9.2vw, 42px); line-height: 1.45; letter-spacing: .05em; }
  .hero-stage-description { font-size: 14px; line-height: 1.9; margin-top: 18px; }

  .reference-concept .philosophy-stories { display: block; }
  .philosophy-story { padding: 38px 0; }
  .philosophy-story h3 { font-size: 25px; margin-bottom: 20px; }
  .philosophy-copy p { font-size: 15px; line-height: 2; }

  .concerns-inner, .concerns-solution { padding-left: 20px !important; padding-right: 20px !important; }
  .concerns-title-line { display: inline; }
  .concerns-list li { font-size: 15px; line-height: 1.8; }
  .solution-pillars { grid-template-columns: 1fr !important; gap: 28px !important; }
  .pillar-card img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
  .pillar-copy p, .copy-line { font-size: 14px; line-height: 1.85; }

  .section-top { display: block; margin-bottom: 28px; }
  .section-top > p { margin-top: 16px; padding: 0; font-size: 13px; line-height: 1.8; }
  .scene-tabs { display: flex; overflow-x: auto; grid-template-columns: none; gap: 8px; margin: 0 -20px 30px; padding: 0 20px 8px; background: transparent; border: 0; scrollbar-width: none; scroll-snap-type: x proximity; }
  .scene-tabs::-webkit-scrollbar { display: none; }
  .scene-tab { flex: 0 0 auto; min-width: 135px; border: 1px solid var(--line); padding: 12px 14px; scroll-snap-align: start; }
  .scene-tab .tab-ja { font-size: 14px; }
  .scene-panel { display: flex; flex-direction: column; gap: 24px; }
  .scene-photo { width: 100%; aspect-ratio: 4 / 3; overflow: hidden; }
  .scene-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .scene-body h3 { font-size: 25px; margin-bottom: 16px; }
  .scene-block { margin-top: 26px; }
  .scene-block h4 { font-size: 16px; line-height: 1.6; }
  .scene-needs { padding-left: 1.25em; }
  .scene-needs li, .scene-image-text { font-size: 14px; line-height: 1.85; }
  .scene-image-text br { display: none; }
  .scent-photos { gap: 10px !important; }
  .scent-photos li { min-width: 0; }
  .scent-photo { aspect-ratio: 1 / 1; }
  .scent-photo img { width: 100%; height: 100%; object-fit: cover; }
  .scent-photos p { font-size: 11px !important; line-height: 1.45; overflow-wrap: anywhere; }

  .product-grid, .plan-grid { grid-template-columns: 1fr !important; }
  .product-card, .plan { width: 100%; }
  .product-photo { height: auto; min-height: 180px; }
  .price { font-size: 31px; }

  .flow { grid-template-columns: 1fr; padding-left: 20px; padding-right: 20px; }
  .flow ol { margin-top: 32px; }
  .faq { grid-template-columns: 1fr; }
  .faq-list { margin-top: 24px; }
  .faq summary { font-size: 14px; line-height: 1.6; }

  .contact { padding: 64px 20px; }
  .contact-form-card { padding: 26px 18px; width: 100%; }
  .contact-form-card h3 { font-size: 24px; }
  .contact-form-card input, .contact-form-card select, .contact-form-card textarea, .contact-form-card button { width: 100%; max-width: 100%; font-size: 16px; }
  .contact-direct .phone { font-size: 25px; }
  .contact-email { font-size: 14px; }
  footer { padding: 32px 20px; align-items: flex-start; }
}

@media (max-width: 390px) {
  .section { padding-left: 16px; padding-right: 16px; }
  .hero-stage { padding-left: 16px; padding-right: 16px; }
  .hero-stage h1 { font-size: 29px; }
  .scene-tabs { margin-left: -16px; margin-right: -16px; padding-left: 16px; padding-right: 16px; }
  .scene-tab { min-width: 124px; }
  .scent-photos { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

/* ===== Mobile corrections: hero title + section number labels ===== */
@media (max-width: 767px) {
  /* 「01 / 余香の想い」と同じ視認性で全セクション番号を統一 */
  .section-label,
  .section-top .section-label,
  .concerns-dark .section-label,
  .faq .section-label {
    font-size: 26px;
    line-height: 1.5;
    letter-spacing: .08em;
  }
  /* eyebrow は小見出しなので従来サイズを維持 */
  .eyebrow,
  .scene-body .eyebrow,
  .plan .eyebrow,
  .commit-grid .eyebrow { font-size: 10px; }

  /* ファーストビューのコピーをスマホでも必ず1行に収める */
  .hero-stage h1 {
    white-space: nowrap;
    font-size: min(6vw, 25px);
    line-height: 1.45;
    letter-spacing: .02em;
  }
}
@media (max-width: 390px) {
  .hero-stage h1 { font-size: 5.9vw; }
}


/* ---------- PC表示の改行調整 ---------- */
@media (min-width: 701px) {
  .scene-tab .tab-ja-yoga {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.55;
  }
  .scene-tab .tab-ja-yoga > span {
    display: block;
    white-space: nowrap;
  }

  /* オリジナルブレンド見出しが「ブレ / ンド。」のように途中で割れないようにする */
  .blend-price > div:first-child h3 {
    max-width: 100%;
    overflow-wrap: normal;
    word-break: keep-all;
    line-break: strict;
  }
  .blend-price > div:first-child > p:not(.eyebrow) {
    overflow-wrap: normal;
    word-break: keep-all;
    line-break: strict;
  }
}

#form-status:not(:empty) {
  margin-top: 16px;
  padding: 14px 16px;
  border-radius: 8px;
  background: rgba(255,255,255,.55);
}
#contact-form button:disabled,
#contact-form [type="submit"]:disabled {
  opacity: .6;
  cursor: wait;
}