/* ============================================================
   shindan-unmei — 診断LP（スピ市場フレーム→製品収束）
   b2-unmei の朝陽×生成り×金トーンを継承。診断UIを追加。
   R-001: keep-all + wbr
============================================================ */
:root{
  --sumi:#2a2320; --kinari:#faf6ef; --shiro:#fffefb;
  --gold:#b98d4f; --gold-deep:#9a7238; --asahi:#e8b98a;
  --accent:#8a6d3b; --line:#e6ddd0;
}
*{margin:0;padding:0;box-sizing:border-box}
[hidden]{display:none!important}   /* display:flex 等が hidden 属性を上書きするのを防ぐ */
html{scroll-behavior:smooth}
body{
  font-family:"Zen Kaku Gothic New",sans-serif;color:var(--sumi);background:var(--shiro);
  line-height:2.0;letter-spacing:.04em;word-break:keep-all;line-break:strict;overflow-wrap:anywhere;
}
img{max-width:100%;display:block}
a{color:inherit}
.page{max-width:560px;margin:0 auto;background:var(--shiro)}

.pr-bar{display:flex;align-items:center;gap:8px;padding:8px 16px;font-size:11px;color:#8f8578;background:var(--kinari);border-bottom:1px solid var(--line)}
.pr-bar .tag{border:1px solid #c4b8a4;border-radius:3px;padding:0 5px;font-weight:700}
.pr-bar .brand{margin-left:auto;display:flex;align-items:center;gap:4px;font-weight:700;color:var(--sumi)}
.pr-bar .brand img{width:16px;height:16px}

/* ---- イントロ（診断の入口） ---- */
.intro{position:relative;text-align:center;padding:70px 24px 56px;overflow:hidden;
  background:radial-gradient(90% 55% at 50% -8%, #f7e2c8 0%, rgba(247,226,200,0) 70%), linear-gradient(180deg,#fdf8f0,var(--shiro) 85%);}
.intro__halo{position:absolute;top:-140px;left:50%;transform:translateX(-50%);width:320px;height:320px;border-radius:50%;
  background:radial-gradient(circle, rgba(232,185,138,.5) 0%, rgba(232,185,138,0) 70%);animation:halo 6s ease-in-out infinite alternate;pointer-events:none}
@keyframes halo{from{opacity:.6;transform:translateX(-50%) scale(1)}to{opacity:1;transform:translateX(-50%) scale(1.12)}}
.intro__eyebrow{font-family:"Cormorant Garamond",serif;font-style:italic;letter-spacing:.34em;font-size:12px;color:var(--gold-deep);margin-bottom:20px}
.intro__title{font-family:"Zen Old Mincho",serif;font-weight:900;font-size:clamp(30px,8.5vw,44px);line-height:1.5;animation:rise .9s ease both}
.intro__title .em{background:linear-gradient(transparent 68%, rgba(232,185,138,.55) 68%)}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.intro__lead{margin-top:22px;font-size:14.5px;color:#5c5245}
.intro__note{margin-top:12px;font-size:10.5px;color:#9a8f7e}
.intro__meta{margin-top:10px;font-size:11px;color:#9a8f7e}

/* ---- CTA（共通） ---- */
.cta{display:flex;align-items:center;justify-content:center;gap:8px;
  background:linear-gradient(135deg,#a9834a,var(--accent));color:#fff;text-decoration:none;
  font-weight:700;font-size:16.5px;border:none;border-radius:2px;padding:17px 20px;width:100%;cursor:pointer;
  box-shadow:0 14px 26px -12px rgba(138,109,59,.5);transition:transform .15s ease;
  font-family:"Zen Kaku Gothic New",sans-serif;letter-spacing:.06em;margin-top:26px}
.cta:active{transform:scale(.98)}
.cta .arr{font-weight:400}
.cta-micro{font-size:11px;color:#9a8f7e;margin-top:8px;text-align:center}

/* ---- 診断（チャット会話形式） ---- */
.quiz{padding:26px 16px 40px;min-height:70vh}
.quiz__bar{height:4px;background:var(--line);border-radius:99px;overflow:hidden;max-width:528px;margin:0 auto}
.quiz__fill{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--asahi),var(--gold));transition:width .4s ease}
.quiz__count{font-family:"Cormorant Garamond",serif;font-size:13px;color:var(--gold-deep);text-align:center;margin:10px 0 18px;letter-spacing:.2em}

/* 会話ログ */
.chat-log{display:flex;flex-direction:column;gap:14px;max-width:528px;margin:0 auto}
.msg{display:flex;gap:8px;align-items:flex-end;max-width:88%;animation:msg-in .35s ease both}
@keyframes msg-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.msg--bot{align-self:flex-start}
.msg--user{align-self:flex-end;flex-direction:row-reverse;margin-left:auto}
.msg__avatar{flex:none;width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--asahi),var(--gold));
  display:flex;align-items:center;justify-content:center;font-size:14px;box-shadow:0 4px 10px -4px rgba(138,109,59,.5)}
.msg__bubble{border-radius:16px;padding:13px 16px;font-size:14.5px;line-height:1.7;word-break:keep-all;line-break:strict;overflow-wrap:anywhere}
.msg--bot .msg__bubble{background:#fff;border:1px solid var(--line);border-bottom-left-radius:4px;color:var(--sumi)}
.msg--user .msg__bubble{background:linear-gradient(135deg,#a9834a,var(--accent));color:#fff;border-bottom-right-radius:4px}
.msg--bot .msg__name{display:block;font-size:10.5px;color:var(--gold-deep);margin:0 0 3px 2px;letter-spacing:.05em}

/* 結果吹き出し（会話ログの続きとして幅広に表示） */
.msg--result{max-width:100%;width:100%}
.msg__bubble--result{width:100%}

/* タイピングインジケーター */
.msg--typing .msg__bubble{padding:14px 18px;display:flex;gap:4px;align-items:center}
.msg--typing .dot{width:6px;height:6px;border-radius:50%;background:#c4b8a4;animation:typing 1.1s ease-in-out infinite}
.msg--typing .dot:nth-child(2){animation-delay:.15s}
.msg--typing .dot:nth-child(3){animation-delay:.3s}
@keyframes typing{0%,60%,100%{opacity:.35;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}

/* 選択肢（チップ） */
.q-chips{max-width:528px;margin:14px auto 0;display:flex;flex-direction:column;gap:9px}
.opt{width:100%;text-align:left;background:#fff;border:1.5px solid var(--gold);border-radius:20px;
  padding:13px 18px;font-size:14.5px;line-height:1.6;cursor:pointer;color:var(--gold-deep);
  font-family:"Zen Kaku Gothic New",sans-serif;font-weight:700;transition:background-color .15s,color .15s,transform .15s,box-shadow .15s;
  word-break:keep-all;line-break:strict;overflow-wrap:anywhere}
.opt:hover{background:linear-gradient(135deg,#a9834a,var(--accent));color:#fff;box-shadow:0 8px 18px -12px rgba(138,109,59,.4)}
.opt:active{transform:scale(.98)}
.opt[disabled]{opacity:.4;pointer-events:none}

/* ---- 結果（会話ログの続きとして表示） ---- */
.result{padding:0}
.result__eyebrow{font-family:"Cormorant Garamond",serif;font-style:italic;letter-spacing:.3em;font-size:11px;color:var(--gold-deep);margin-bottom:4px;display:block}
.result__type{font-family:"Zen Old Mincho",serif;font-weight:900;font-size:clamp(19px,5.4vw,24px);line-height:1.5;margin:2px 0 8px}
.result__img{margin:10px -16px}
.result__img img{width:100%;border-radius:10px}
.result__desc{font-size:14.5px;color:#5c5245;text-align:left}
.result__advice{margin-top:10px;border-left:3px solid var(--gold);border-radius:4px;padding:12px 14px;background:var(--kinari);text-align:left}
.result__advice-h{font-family:"Zen Old Mincho",serif;font-weight:700;font-size:13.5px;color:var(--gold-deep);margin-bottom:4px}
.result__advice p{font-size:13.5px}
.result__bridge{font-size:14.5px;text-align:left}
.result__bridge b{color:var(--gold-deep)}
.scroll-cue{margin:18px auto 0;font-size:22px;color:var(--gold);text-align:center;animation:bob 1.6s ease-in-out infinite;max-width:528px}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}

/* ---- ブロック共通 ---- */
.block{padding:48px 24px}
.block--product{background:var(--shiro);border-top:1px solid var(--line)}
.lead-label{display:inline-block;font-size:11px;letter-spacing:.3em;color:var(--gold-deep);border-bottom:1px solid var(--gold);padding-bottom:3px;margin-bottom:16px;font-weight:700}
.head{font-family:"Zen Old Mincho",serif;font-weight:700;font-size:clamp(22px,6vw,30px);line-height:1.7;margin-bottom:18px}
p+p{margin-top:12px}

.product-shot{margin:24px auto;max-width:280px;text-align:center}
.product-shot figcaption{font-size:11px;color:#9a8f7e;margin-top:8px}
.badges{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.badges span{font-size:12px;border:1px solid var(--gold);color:var(--gold-deep);border-radius:2px;padding:4px 12px}
.badges .fill{background:var(--sumi);border-color:var(--sumi);color:#fff}
.steps{display:flex;gap:12px;margin:18px 0}
.st{flex:1;text-align:center}
.st img{border-radius:4px}
.st .lab{display:block;font-size:12px;margin-top:8px;line-height:1.6}
.st .lab b{display:block;font-family:"Zen Old Mincho",serif;color:var(--gold-deep);font-size:15px}
.note-s{font-size:11px;color:#9a8f7e;margin-top:10px}
figure{margin:18px 0}

/* ---- オファー ---- */
.offer{background:linear-gradient(180deg,var(--shiro),#f6eee0)}
.price-card{background:#fff;border:1px solid var(--gold);border-radius:4px;padding:24px 18px;position:relative;margin-top:10px}
.ribbon{position:absolute;top:-14px;left:16px;background:var(--sumi);color:#fff;font-size:12px;font-weight:700;padding:4px 14px;letter-spacing:.08em}
.pname{font-weight:700;margin-top:4px}
.pname .off{font-size:11px;background:var(--kinari);color:var(--gold-deep);border-radius:2px;padding:2px 6px;margin-left:8px}
.price-row{margin:10px 0}
.was{font-size:13px;color:#9a8f7e}
.now{font-family:"Zen Old Mincho",serif;font-size:52px;font-weight:900;line-height:1.1;color:var(--gold-deep)}
.now .yen{font-size:.5em}
.now .tax{font-size:13px;color:#9a8f7e;font-family:"Zen Kaku Gothic New",sans-serif;font-weight:400}
.perday{font-size:13px}
.mk{background:linear-gradient(transparent 64%, rgba(232,185,138,.5) 64%);font-weight:700}
.terms{background:var(--kinari);border-radius:4px;padding:12px 14px;font-size:11.5px;line-height:1.9;margin-top:10px}
.terms .h{display:block;font-weight:700;margin-bottom:4px}
.normal-buy{margin-top:12px;display:grid;gap:8px}
.linkbtn{display:block;width:100%;background:#fff;border:1px solid var(--line);border-radius:2px;padding:12px;font-size:13px;color:#7a6f5f;text-align:center;cursor:pointer;font-family:"Zen Kaku Gothic New",sans-serif}

/* ---- LINE友だち追加CTA ---- */
.line-cta{display:flex;align-items:center;justify-content:center;gap:8px;
  background:#06C755;color:#fff;text-decoration:none;
  font-weight:700;font-size:16.5px;border:none;border-radius:2px;padding:17px 20px;width:100%;cursor:pointer;
  box-shadow:0 14px 26px -12px rgba(6,199,85,.45);transition:transform .15s ease;
  font-family:"Zen Kaku Gothic New",sans-serif;letter-spacing:.06em;margin-top:26px}
.line-cta:active{transform:scale(.98)}
.line-cta .arr{font-weight:400}
.line-cta .icon{width:20px;height:20px;flex-shrink:0}
.line-note{font-size:11px;color:#9a8f7e;margin-top:8px;text-align:center}
.sticky .line-cta{width:auto;padding:12px 20px;font-size:14px;margin-top:0}

.notes{margin-top:20px;padding:14px;background:var(--kinari);border-radius:4px;font-size:10.5px;color:#a49a89;line-height:1.8}
.notes p+p{margin-top:8px}
.footer{padding:26px 24px 120px;text-align:center;font-size:11px;color:#9a8f7e}
.footer .b{font-weight:700;color:var(--sumi)}
.footer .lk{margin-top:6px}
.footer .cp{margin-top:6px;font-family:"Cormorant Garamond",serif}

/* ---- 追従CTA ---- */
.sticky{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;align-items:center;gap:10px;
  background:rgba(255,254,251,.94);backdrop-filter:blur(8px);border-top:1px solid var(--line);padding:10px 14px;max-width:560px;margin:0 auto}
.sticky .info{flex:1;line-height:1.4}
.sticky .info b{font-size:14px;color:var(--gold-deep)}
.sticky .info small{display:block;font-size:10px;color:#9a8f7e}
.sticky .cta{width:auto;padding:12px 20px;font-size:14px;margin-top:0}

@media (min-width:768px){
  .page{max-width:640px;box-shadow:0 0 60px rgba(90,70,40,.08)}
  .intro{padding:90px 48px 64px}
  .block{padding:56px 48px}
  .quiz{padding:30px 48px 48px}
  .result__img{margin:10px -48px}
  .sticky{max-width:640px}
}

/* ============================================================
   enq-hinoki 追加分（アンケートLP・テモナ一体型フォーム）
============================================================ */

/* FV: アンケート宣言の箇条書き（何問・何分・答えるメリット） */
.intro__points{list-style:none;margin:18px auto 0;max-width:320px;text-align:left;
  background:rgba(255,255,255,.7);border:1px solid var(--line);border-radius:6px;padding:14px 18px}
.intro__points li{font-size:13.5px;line-height:2.0;padding-left:1.4em;position:relative}
.intro__points li::before{content:"✓";position:absolute;left:0;color:var(--gold-deep);font-weight:700}
.intro__points b{color:var(--gold-deep)}

/* 複数選択（Q3）: 選択中チップ */
.opt.is-selected{background:linear-gradient(135deg,#a9834a,var(--accent));color:#fff;
  box-shadow:0 8px 18px -12px rgba(138,109,59,.5)}
.opt.is-selected::after{content:" ✓";font-weight:400}

/* 複数選択の決定ボタン */
.opt-confirm{margin-top:14px}
.opt-confirm[disabled]{opacity:.45;pointer-events:none}

/* 結果: 気になっていたポイント（Q3のエコー） */
.result__tags{margin-top:12px;text-align:left}
.result__tags-h{font-size:11.5px;color:var(--gold-deep);font-weight:700;margin-bottom:6px}
.result__tags-row{display:flex;flex-wrap:wrap;gap:6px}
.result__tags-row span{font-size:11.5px;border:1px solid var(--gold);color:var(--gold-deep);
  border-radius:99px;padding:3px 10px;background:#fff}

/* 結果: タイプ別モニターの声（悩み別・年齢別） */
.voice{margin-top:16px;display:flex;flex-direction:column;gap:10px;text-align:left}
.vcard{background:#fff;border:1px solid var(--line);border-radius:6px;padding:12px 14px}
.vcard .top{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.vcard .av{flex:none;width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,var(--asahi),var(--gold));
  color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;font-family:"Zen Kaku Gothic New",sans-serif}
.vcard .nm{font-size:12px;line-height:1.4;color:var(--sumi)}
.vcard .nm span{font-size:10.5px;color:#9a8f7e;font-weight:400}
.vcard .stars{margin-left:auto;font-size:11px;color:var(--gold)}
.vcard .tx{font-size:12.5px;line-height:1.8;color:#5c5245}
.disc{font-size:10px;color:#9a8f7e;margin-top:6px}

/* オファー: 信頼チップ列 */
.trust-row{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:12px}
.trust-row span{font-size:11.5px;border:1px solid var(--line);color:#7a6f5f;border-radius:2px;
  padding:4px 10px;background:var(--kinari)}

/* フォーム直前のリード（遷移ゼロ・入力補助の予告） */
.form-lead{margin:22px 0 8px;text-align:center}
.form-lead__h{font-family:"Zen Old Mincho",serif;font-weight:700;font-size:16.5px;color:var(--sumi)}
.form-lead__s{font-size:12px;color:#7a6f5f;margin-top:6px;line-height:1.9}

/* テモナ一体型フォームの器 */
.uk-loading{text-align:center;padding:18px 0}
#ukokkei-landing-page-container{margin-top:10px}
#ukokkei-landing-page-container img{display:inline-block}

/* 追従CTA: 本LPは購入フォームへのページ内誘導 */
.sticky .cta{width:auto;padding:12px 20px;font-size:14px;margin-top:0;text-decoration:none}

/* オペレーター（女性）アイコン：Botアバターを画像化（🌿から差し替え・2026-07-13） */
.msg__avatar{background:none!important;overflow:hidden;padding:0}
.msg__avatar img{width:100%;height:100%;object-fit:cover;display:block}

/* A案：テモナ一体型フォーム(enq-hinoki-a)を通常表示するための装飾（構造・属性は変えず装飾のみ） */
#ukokkei-landing-page-container{max-width:400px;margin:10px auto 0}
#ukokkei-landing-page-container .form-control,
#ukokkei-landing-page-container input[type="text"],
#ukokkei-landing-page-container input[type="tel"],
#ukokkei-landing-page-container input[type="email"],
#ukokkei-landing-page-container input[type="password"],
#ukokkei-landing-page-container select{
  width:100%;border:1.5px solid var(--gold);border-radius:10px;padding:13px 14px;
  font-size:16px;font-family:"Zen Kaku Gothic New",sans-serif;color:var(--sumi);background:#fff;box-sizing:border-box}
#ukokkei-landing-page-container [class*="-input-wrapper"],
#ukokkei-landing-page-container [class*="-lp-field"],
#ukokkei-landing-page-container [class*="-lp-input"],
#ukokkei-landing-page-container [class*="-lp-part"]{display:block!important;width:100%!important;max-width:100%;box-sizing:border-box}
#ukokkei-landing-page-container .form-group{margin:0 auto 10px;max-width:400px}
#ukokkei-landing-page-invalid-fields-notice-box{display:none!important}
#ukokkei-landing-page-container .submit-button{
  display:flex;align-items:center;justify-content:center;gap:8px;width:100%;
  background:linear-gradient(135deg,#a9834a,var(--accent));color:#fff;font-weight:700;font-size:16.5px;
  border:none;border-radius:2px;padding:17px 20px;margin:8px 0 0;cursor:pointer;
  box-shadow:0 14px 26px -12px rgba(138,109,59,.5);font-family:"Zen Kaku Gothic New",sans-serif}
