/* 物流DAO 無料相談フォーム — トップページと同じ配色・書体 */
:root{
  --deep:#08192a; --navy:#0b2233; --sea:#12314a; --grid:#1d3a50; --steel:#2b5876;
  --brand:#1b9fda; --fog:#e8eef2; --mist:#9fb4c4; --signal:#f2a33a; --ng:#ff8f7a;
  --serif:"Shippori Mincho B1","Hiragino Mincho ProN","Yu Mincho",serif;
  --sans:"Zen Kaku Gothic New","Hiragino Sans","Noto Sans JP",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-padding-top:80px;background:var(--deep)}
body{margin:0;background:radial-gradient(1200px 700px at 85% 0%,#143652 0%,var(--navy) 45%,var(--deep) 100%) no-repeat,var(--deep);color:var(--fog);font-family:var(--sans);font-size:15px;line-height:1.8}
[hidden]{display:none!important}
a{color:inherit}
h1,h2{margin:0;line-height:1.35;text-wrap:balance}
p{margin:0}
.in{max-width:920px;margin:0 auto;padding-inline:24px}
@media (max-width:600px){.in{padding-inline:16px}}
:focus-visible{outline:2px solid var(--signal);outline-offset:3px}
.coord{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;color:var(--signal);text-transform:uppercase}

/* header / footer */
.hd{position:sticky;top:0;z-index:10;background:rgba(8,25,42,.86);backdrop-filter:blur(8px);border-bottom:1px solid var(--grid)}
.hbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-block:12px;max-width:1180px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand .mark{width:44px;height:auto}
.brand b{display:block;font-family:var(--serif);font-size:18px;font-weight:800;letter-spacing:.04em;line-height:1.2}
.brand small{display:block;font-family:var(--mono);font-size:9.5px;color:var(--mist);letter-spacing:.12em}
.back{font-size:13px;color:#c9d6df;text-decoration:none}
.back:hover{color:#fff}
.ft{border-top:1px solid var(--grid);padding-block:28px;margin-top:64px;font-size:13px;color:var(--mist)}
.ft a{color:var(--fog)}
.ft .copy{font-family:var(--mono);font-size:11px;letter-spacing:.08em;margin-top:6px}

/* intro */
.page{padding-top:56px}
.intro{display:grid;gap:14px;margin-bottom:28px}
.intro h1{font-family:var(--serif);font-weight:800;font-size:clamp(30px,5vw,46px);color:#fff}
.intro>p{color:#c3d1db;max-width:44em}
.intro>p b{color:#fff}
.assure{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--grid)}
@media (max-width:720px){.assure{grid-template-columns:1fr}}
.assure li{padding:14px 16px;border-left:1px solid var(--grid);display:grid;gap:2px}
.assure li:first-child{border-left:0}
@media (max-width:720px){.assure li{border-left:0;border-top:1px solid var(--grid)}.assure li:first-child{border-top:0}}
.assure b{font-size:14px;display:flex;gap:8px;align-items:center}
.assure b::before{content:"";width:8px;height:8px;border-radius:50%;background:#7fd1a8;flex:none}
.assure span{font-size:12.5px;color:var(--mist);line-height:1.6}

/* steps */
.steps{list-style:none;margin:0 0 20px;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--grid)}
.steps li{padding:10px 14px;border-left:1px solid var(--grid);font-size:13.5px;color:var(--mist);display:flex;gap:10px;align-items:baseline}
.steps li:first-child{border-left:0}
.steps em{font-style:normal;font-family:var(--mono);font-size:12px}
.steps li[aria-current="step"]{background:rgba(242,163,58,.1);color:#fff;font-weight:700;box-shadow:inset 0 -2px 0 var(--signal)}
.steps li[aria-current="step"] em{color:var(--signal)}

/* card */
.card{background:linear-gradient(180deg,rgba(11,34,51,.92),rgba(8,25,42,.92));border:1px solid var(--grid);padding:28px}
@media (max-width:600px){.card{padding:20px 16px}}
.card h2{font-family:var(--serif);font-size:24px;color:#fff;margin-bottom:6px}
.legend-note{font-size:13px;color:var(--mist);margin-bottom:6px;display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.note{font-size:12.5px;color:var(--mist);line-height:1.7}
.note a{color:var(--fog)}

fieldset{border:0;margin:0;padding:22px 0 0;min-width:0}
fieldset+fieldset{margin-top:22px;border-top:1px dashed var(--steel)}
legend{font-family:var(--serif);font-size:18px;font-weight:800;color:#fff;padding:0;display:flex;gap:10px;align-items:baseline;float:left;width:100%;margin-bottom:14px}
legend+*{clear:both}
legend em{font-style:normal;font-family:var(--mono);font-size:12px;color:var(--signal);font-weight:400}

.grid{display:grid;gap:16px 20px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:640px){.g2{grid-template-columns:1fr}}
.field{display:grid;gap:6px;min-width:0;position:relative}
.field+.field,.grid+.field,.field+.grid{margin-top:16px}
.grid>.field{margin-top:0}
.field.sub{padding-left:16px;border-left:2px solid var(--grid);transition:border-color .2s,opacity .2s}
.field.sub.dim{opacity:.55}
.field.sub.hot{border-left-color:var(--signal)}
.lab{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px;font-weight:700}
.lab label,.lab .lbl{cursor:default}
.req,.opt{font-size:10.5px;font-weight:700;padding:1px 7px;border-radius:2px;letter-spacing:.04em;font-family:var(--sans)}
.req{background:var(--signal);color:var(--navy)}
.opt{border:1px solid var(--steel);color:var(--mist);font-weight:500}
.count{margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--mist);font-weight:400}
.count.over{color:var(--ng)}

input[type=text],input[type=email],input[type=tel],input[type=number],input[type=date],textarea{width:100%;background:rgba(8,25,42,.8);border:1px solid var(--steel);color:var(--fog);padding:11px 12px;font-family:var(--sans);font-size:15px;border-radius:2px;transition:border-color .15s,box-shadow .15s}
textarea{resize:vertical;min-height:150px;line-height:1.7}
input::placeholder,textarea::placeholder{color:#5f7a8e}
input:focus,textarea:focus{outline:none;border-color:var(--signal);box-shadow:0 0 0 3px rgba(242,163,58,.18)}
input[type=date]{max-width:240px}
.field.bad input,.field.bad textarea,.field.bad .radios{border-color:var(--ng)}
.err{font-size:12.5px;color:var(--ng);min-height:0}
.err:empty{display:none}

.radios{display:flex;gap:8px;flex-wrap:wrap;border:1px solid transparent;border-radius:2px}
.radios label{position:relative;cursor:pointer}
.radios input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.radios span{display:inline-block;min-width:88px;text-align:center;padding:9px 16px;border:1px solid var(--steel);border-radius:2px;font-size:14px;transition:all .15s}
.radios label:hover span{border-color:var(--fog)}
.radios input:checked+span{background:var(--signal);border-color:var(--signal);color:var(--navy);font-weight:700}
.radios input:focus-visible+span{outline:2px solid var(--signal);outline-offset:3px}

/* help button & popup */
.help,.help-inline{width:22px;height:22px;border-radius:50%;border:1px solid var(--steel);background:transparent;color:var(--mist);font-size:12px;font-weight:700;line-height:1;cursor:pointer;display:inline-grid;place-items:center;padding:0;font-family:var(--sans);flex:none}
.help:hover,.help[aria-expanded="true"],.help-inline:hover,.help-inline[aria-expanded="true"]{border-color:var(--signal);color:var(--navy);background:var(--signal)}
.tip{position:absolute;z-index:30;width:min(360px,calc(100vw - 32px));background:#0f2a40;border:1px solid var(--signal);box-shadow:0 18px 40px -12px rgba(0,0,0,.7);padding:14px 16px 14px;font-size:13px;line-height:1.75;color:#d6e1e9}
.tip::before{content:"";position:absolute;top:-7px;left:var(--arrow,20px);width:12px;height:12px;background:#0f2a40;border-left:1px solid var(--signal);border-top:1px solid var(--signal);transform:rotate(45deg)}
.tip.up::before{top:auto;bottom:-7px;transform:rotate(225deg)}
.tip>b:first-child{display:block;color:#fff;font-size:13.5px;margin-bottom:4px;padding-right:22px}
.tip b{color:#fff}
.tip p+p,.tip ul+p,.tip p+ul{margin-top:6px}
.tip ul{margin:0;padding-left:1.2em}
.tip .x{position:absolute;top:6px;right:8px;background:none;border:0;color:var(--mist);font-size:18px;cursor:pointer;line-height:1;padding:4px}
.tip .x:hover{color:#fff}

/* final */
.final{border-top:1px solid var(--steel)!important}
.agree{display:flex;gap:10px;align-items:center;font-size:14px;cursor:pointer}
.agree input{width:18px;height:18px;accent-color:var(--signal);flex:none}
.agree a{color:var(--signal)}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 26px;font-weight:700;font-size:15px;border-radius:2px;border:1px solid transparent;cursor:pointer;font-family:var(--sans);text-decoration:none}
.btn.primary{background:var(--signal);color:var(--navy)}
.btn.primary:hover{background:#ffb95a}
.btn.primary:disabled{opacity:.45;cursor:not-allowed}
.btn.ghost{border-color:#5d7c92;color:var(--fog);background:transparent}
.btn.ghost:hover{border-color:var(--fog)}
.form-err{margin-top:12px;color:var(--ng);font-size:13.5px}
.form-err:empty{display:none}

/* confirm */
.review{margin:18px 0 0;display:grid;grid-template-columns:minmax(150px,240px) minmax(0,1fr);border-top:1px solid var(--grid)}
.review dt,.review dd{margin:0;padding:11px 0;border-bottom:1px solid var(--grid);font-size:14px}
.review dt{color:var(--mist);font-size:13px;padding-right:16px}
.review dd{white-space:pre-wrap;overflow-wrap:anywhere}
.review dd.empty{color:#5f7a8e}
@media (max-width:600px){.review{grid-template-columns:1fr}.review dt{border-bottom:0;padding-bottom:0}.review dd{padding-top:2px}}
.verify{margin-top:22px;padding:16px;border:1px dashed var(--steel);display:grid;gap:10px}
#turnstile{min-height:65px}

/* done */
.done{display:grid;gap:12px;text-align:left}
.done h2{font-size:28px}
.receipt{font-family:var(--mono);font-size:20px;color:var(--signal);letter-spacing:.06em}

@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* privacy policy */
.policy .card h2{font-size:18px;margin:26px 0 8px}
.policy .card h2:first-child{margin-top:0}
.policy .card p,.policy .card li{color:#c3d1db;font-size:14.5px}
.policy .card ul{margin:6px 0 0;padding-left:1.3em}
.policy .card p+p{margin-top:8px}
.policy .card a{color:var(--signal)}

/* 特定商取引法表記 */
.legal{margin:0;display:grid;grid-template-columns:minmax(140px,220px) minmax(0,1fr);border-top:1px solid var(--grid)}
.legal dt,.legal dd{margin:0;padding:14px 0;border-bottom:1px solid var(--grid);font-size:14.5px;line-height:1.85}
.legal dt{color:var(--mist);font-weight:700;padding-right:16px}
.legal dd{color:#d6e1e9}
.legal dd b{color:#fff}
.legal dd small{color:var(--mist);font-size:12.5px}
.legal a{color:var(--signal)}
@media (max-width:600px){.legal{grid-template-columns:1fr}.legal dt{border-bottom:0;padding-bottom:0}.legal dd{padding-top:4px}}
/* 公開前に必ず書き換える箇所（未記入のまま公開しないこと） */
.todo{background:rgba(255,143,122,.15);outline:1px dashed var(--ng);color:var(--ng);padding:0 4px}
.policy .card small.sub{color:var(--mist);font-size:12.5px}
.policy .note.date{margin-top:24px}
