/* MARIJJI 活動開始受付 (/marijji/start/) — Quiet Luxury brand styling.
   Dedicated, self-contained stylesheet (not regenerated by integrate_phase2_theme.py).
   Scoped under .marijji-start so it never affects the top page or Personal Report. */

.marijji-start{
  --white:#ffffff; --ivory:#faf7f2; --paper:#f4efe7; --ink:#26363a; --ink-2:#1f2c2f;
  --ink-soft:#5f6f6d; --muted:#93a09e; --line:#e7e0d4; --gold:#a7935f; --gold-soft:#c9bd9e;
  --rose:#efe4dc; --green-deep:#3f5f52;
  background:var(--white); color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Noto Sans JP","Segoe UI",Meiryo,sans-serif;
  line-height:1.85; -webkit-font-smoothing:antialiased;
}
.marijji-start *{box-sizing:border-box}
.marijji-start img{max-width:100%;height:auto}

.ms-wrap{max-width:680px;margin:0 auto;padding:0 24px}
.ms-eyebrow{display:block;color:var(--gold);font-size:11px;font-weight:600;letter-spacing:.4em;text-indent:.4em;margin:0 0 18px}
.marijji-start h1,.marijji-start h2,.marijji-start h3{font-weight:700;color:var(--ink);letter-spacing:.01em}

/* ── Header ─────────────────────────────────────────────── */
.ms-head{border-bottom:1px solid var(--line)}
.ms-head .ms-wrap{display:flex;align-items:center;height:64px}
.ms-logo{font-family:"Cormorant Garamond",serif;font-size:22px;font-weight:600;letter-spacing:.22em;color:var(--ink);text-decoration:none}

/* ── Hero ───────────────────────────────────────────────── */
.ms-hero{background:var(--ivory);padding:clamp(56px,9vw,96px) 0 clamp(44px,7vw,72px)}
.ms-hero h1{font-size:clamp(28px,6.4vw,42px);line-height:1.28;margin:0 0 22px}
.ms-hero__lead{color:var(--ink-soft);font-size:15px;line-height:1.95;margin:0}
.ms-note{margin:26px 0 0;padding:16px 18px;background:var(--white);border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:6px}
.ms-note strong{display:block;color:var(--ink);font-size:14.5px}
.ms-note span{display:block;color:var(--ink-soft);font-size:13px;line-height:1.8;margin:6px 0 0}

/* ── このフォームでできること ───────────────────────────── */
.ms-can{padding:clamp(48px,7vw,72px) 0}
.ms-can h2{font-size:19px;margin:0 0 26px}
.ms-can__list{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.ms-can__list li{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;background:var(--ivory);border:1px solid var(--line);border-radius:8px;font-size:14.5px;color:var(--ink)}
.ms-can__list li::before{content:counter(msc);counter-increment:msc;font-family:"Cormorant Garamond",serif;font-size:20px;font-weight:600;color:var(--gold);line-height:1.4;flex:0 0 auto}
.ms-can__list{counter-reset:msc}

/* ── 活動開始までに準備するもの ──────────────────────────── */
.ms-prep{padding:clamp(6px,1.5vw,14px) 0 clamp(40px,6vw,60px)}
.ms-prep h2{font-size:19px;margin:0 0 12px}
.ms-prep__intro{color:var(--ink-soft);font-size:14px;line-height:1.9;margin:0 0 22px}
.ms-prep__list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.ms-prep__list li{padding:16px 18px;background:var(--ivory);border:1px solid var(--line);border-radius:8px}
.ms-prep__list b{display:block;font-size:14.5px;color:var(--ink);font-weight:600;margin:0 0 6px}
.ms-prep__list span{display:block;font-size:13px;color:var(--ink-soft);line-height:1.8}
.ms-prep__list span.sub{color:var(--muted);font-size:12px;margin:4px 0 0}
.ms-prep__link{display:inline-block;white-space:nowrap;color:var(--green-deep);font-size:12.5px;font-weight:700;text-decoration:none;border-bottom:1px solid var(--gold-soft);padding-bottom:1px;margin:10px 0 0}
.ms-prep__link:hover{color:var(--ink)}
.ms-prep__profile{color:var(--ink-soft);font-size:13px;line-height:1.85;margin:18px 0 0}
.ms-prep__note{color:var(--ink-soft);font-size:13px;line-height:1.85;margin:12px 0 0}

/* ── Form ───────────────────────────────────────────────── */
.ms-form-sec{padding:clamp(8px,2vw,16px) 0 clamp(56px,8vw,88px)}
.ms-form-sec h2{font-size:20px;margin:0 0 10px}
.ms-form-sec__sub{color:var(--ink-soft);font-size:13.5px;margin:0 0 30px}
.ms-form{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:clamp(22px,4vw,34px)}

/* WPForms reset → brand form. Keep function, restyle presentation only. */
.marijji-start .wpforms-container{margin:0}
.marijji-start .wpforms-form .wpforms-field{padding:0 0 22px}
/* Container-scoped (0,3,x) so these beat WPForms' own div.wpforms-container-full rules. */
.marijji-start .wpforms-container-full .wpforms-field-label{display:block;font-size:14.5px;font-weight:600;color:var(--ink);margin:0 0 8px;line-height:1.6}
.marijji-start .wpforms-container-full .wpforms-required-label{color:var(--gold);font-weight:600;font-size:12px;margin-left:6px}
.marijji-start .wpforms-container-full .wpforms-field-description{color:var(--muted);font-size:12.5px;line-height:1.7;margin:8px 0 0}
.marijji-start .wpforms-field input[type=text],
.marijji-start .wpforms-field input[type=email],
.marijji-start .wpforms-field input[type=tel],
.marijji-start .wpforms-field input[type=url],
.marijji-start .wpforms-field input[type=number],
.marijji-start .wpforms-field select,
.marijji-start .wpforms-field textarea{
  width:100%;background:var(--white);color:var(--ink);
  border:1px solid var(--line);border-radius:8px;
  padding:13px 14px;font:inherit;font-size:15px;line-height:1.6;
  transition:border-color .18s,box-shadow .18s;-webkit-appearance:none;appearance:none;
}
.marijji-start .wpforms-field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%235f6f6d' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px}
.marijji-start .wpforms-field textarea{min-height:120px;resize:vertical}
.marijji-start .wpforms-field input:focus,
.marijji-start .wpforms-field select:focus,
.marijji-start .wpforms-field textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(167,147,95,.15)}
.marijji-start .wpforms-field input::placeholder,
.marijji-start .wpforms-field textarea::placeholder{color:var(--muted)}

/* Radios / checkboxes (連絡方法, 個人情報同意) */
.marijji-start .wpforms-field-radio ul,
.marijji-start .wpforms-field-checkbox ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.marijji-start .wpforms-field-radio li,
.marijji-start .wpforms-field-checkbox li{display:flex;align-items:flex-start;gap:10px;margin:0}
.marijji-start .wpforms-field-radio input,
.marijji-start .wpforms-field-checkbox input{width:18px;height:18px;margin:3px 0 0;flex:0 0 auto;accent-color:var(--green-deep)}
.marijji-start .wpforms-field-radio label,
.marijji-start .wpforms-field-checkbox label{font-size:14px;color:var(--ink);line-height:1.7;margin:0}

/* Validation messages: keep visible, restrained tone */
.marijji-start .wpforms-error{color:#b4432f;font-size:12.5px;margin:6px 0 0}
.marijji-start .wpforms-field input.wpforms-error,
.marijji-start .wpforms-field textarea.wpforms-error,
.marijji-start .wpforms-field select.wpforms-error{border-color:#d08c7f;box-shadow:0 0 0 3px rgba(180,67,47,.10)}

/* Submit → deep green, brand, no blue.
   !important + container scope required: WPForms Lite sets the button color via
   an ID-level CSS variable and a `:not(:hover):not(:active)` rule at (0,5,2). */
.marijji-start .wpforms-submit-container{margin:6px 0 0;text-align:center}
.marijji-start div.wpforms-container-full button.wpforms-submit,
.marijji-start div.wpforms-container-full input.wpforms-submit,
.marijji-start .wpforms-submit-container input[type=submit],
.marijji-start .wpforms-submit{
  display:inline-flex !important;align-items:center;justify-content:center;
  width:100% !important;background:var(--green-deep) !important;color:#fff !important;
  border:0 !important;border-radius:9px !important;
  font:inherit !important;font-weight:700 !important;font-size:15.5px !important;letter-spacing:.04em !important;
  padding:16px 28px !important;cursor:pointer;transition:filter .18s;box-shadow:0 8px 22px -14px rgba(63,95,82,.9);
}
.marijji-start div.wpforms-container-full button.wpforms-submit:hover,
.marijji-start .wpforms-submit:hover{filter:brightness(1.1)}
.marijji-start .wpforms-submit:disabled{opacity:.6;cursor:default}

/* Success confirmation */
.marijji-start .wpforms-confirmation-container-full{background:var(--ivory);border:1px solid var(--line);border-left:3px solid var(--green-deep);border-radius:8px;padding:18px 20px;color:var(--ink);font-size:14.5px;line-height:1.85}

/* LINE help (shown only when LINE chosen; markup preserved for marijji-new.js) */
.ms-line-help{margin:20px 0 0;padding:16px 18px;background:var(--ivory);border:1px solid var(--line);border-radius:8px}
.ms-line-help strong{display:block;color:var(--ink);font-size:14px}
.ms-line-help p{color:var(--ink-soft);font-size:13px;line-height:1.8;margin:6px 0 12px}
.ms-textlink{display:inline-flex;align-items:center;gap:6px;color:var(--green-deep);font-size:13.5px;font-weight:700;text-decoration:none;border-bottom:1px solid var(--gold-soft);padding-bottom:2px}
.ms-textlink:hover{color:var(--ink)}

/* ── 送信後の流れ (timeline) ─────────────────────────────── */
.ms-flow{background:var(--ivory);padding:clamp(52px,8vw,84px) 0}
.ms-flow h2{font-size:20px;margin:0 0 30px}
.ms-flow__list{list-style:none;margin:0;padding:0;counter-reset:msf}
.ms-flow__list li{position:relative;display:flex;gap:18px;padding:0 0 22px 0}
.ms-flow__list li:not(:last-child)::after{content:"";position:absolute;left:17px;top:38px;bottom:2px;width:1px;background:var(--line)}
.ms-flow__num{flex:0 0 auto;width:36px;height:36px;border-radius:50%;background:var(--white);border:1px solid var(--gold-soft);color:var(--gold);font-family:"Cormorant Garamond",serif;font-size:17px;font-weight:600;display:flex;align-items:center;justify-content:center;line-height:1;position:relative;z-index:1}
.ms-flow__num::before{content:"0" counter(msf);counter-increment:msf}
.ms-flow__body{padding-top:6px}
.ms-flow__body b{display:block;font-size:15px;color:var(--ink);font-weight:600}
.ms-flow__body span{display:block;color:var(--ink-soft);font-size:13px;line-height:1.75;margin:4px 0 0}

/* ── Secondary consult (subordinate to form) ─────────────── */
.ms-consult{padding:clamp(44px,7vw,72px) 0}
.ms-consult__card{background:var(--white);border:1px solid var(--line);border-radius:10px;padding:clamp(22px,4vw,30px);text-align:center}
.ms-consult__card h2{font-size:16.5px;margin:0 0 10px}
.ms-consult__card p{color:var(--ink-soft);font-size:13.5px;line-height:1.85;margin:0 0 18px}
.ms-btn-outline{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:transparent;color:var(--green-deep);border:1px solid var(--green-deep);border-radius:9px;font:inherit;font-weight:700;font-size:14px;letter-spacing:.03em;padding:13px 26px;text-decoration:none;transition:.18s}
.ms-btn-outline:hover{background:var(--green-deep);color:#fff}

/* ── Footer ─────────────────────────────────────────────── */
.ms-foot{border-top:1px solid var(--line);padding:34px 0 44px}
.ms-foot__legal{display:flex;flex-wrap:wrap;gap:10px 22px;justify-content:center;margin:0 0 16px}
.ms-foot__legal a{color:var(--ink-soft);font-size:12.5px;text-decoration:none}
.ms-foot__legal a:hover{color:var(--ink)}
.ms-foot__copy{text-align:center;color:var(--muted);font-size:12px;margin:0}

@media (max-width:600px){
  .ms-wrap{padding:0 18px}
  .ms-hero{padding:44px 0 36px}
  .ms-form{padding:20px 16px}
  .marijji-start .wpforms-submit{width:100%}
}

/* 2026-10-17 form-first: the form starts in the first screen (no explanatory sections above it) */
.ms-hero.ms-hero--compact{padding:28px 0 14px}
.ms-hero--compact h1{margin:0 0 10px}
.ms-hero--compact .ms-hero__lead{font-size:15px;line-height:1.8}
.ms-hero__safe{margin:8px 0 0;color:var(--ink-soft);font-size:13px;line-height:1.7}
.ms-hero--compact + .ms-form-sec{padding-top:8px}
.ms-form-sec__doc{margin:18px 0 0;color:var(--ink-soft);font-size:13.5px;line-height:1.8}
