.contact-page { background:#06113f; }
.contact-page .contact-header { border-color:rgba(255,255,255,.12); color:#fff; }
.contact-page .contact-header .gnb { color:#fff; }
.contact-page .contact-header .header__contact { background:#fff; color:#071133; }
.contact-page .contact-header .menu-button i { background:#fff; }
@media(max-width:900px) {
  .contact-page .contact-header .header__logo img { content:url('../images/ione_logo_B.png'); }
  .contact-page .contact-header .menu-button i,
  .contact-page .contact-header .menu-button::before { background:#555; }
}
.contact-main { min-height:100vh; padding:180px 0 130px; color:#fff; background:radial-gradient(circle at 88% 12%,rgba(38,174,255,.18),transparent 34%),radial-gradient(circle at 10% 75%,rgba(82,71,255,.12),transparent 34%),#06113f; }
.contact-layout { display:grid; grid-template-columns:minmax(0,.82fr) minmax(560px,1.18fr); gap:clamp(70px,7vw,130px); align-items:start; }
.contact-intro { position:sticky; top:150px; padding-top:10px; }
.contact-eyebrow { margin-bottom:26px; color:#39bfff; font-size:15px; font-weight:700; letter-spacing:.08em; }
.contact-intro h1 { font-size:clamp(42px,3.7vw,62px); line-height:1.24; font-weight:200; letter-spacing:-.045em; }
.contact-title-line { display:block; font-size:clamp(32px,2.7vw,46px); white-space:nowrap; }
.contact-intro h1 strong { font-weight:700; }
.contact-lead { margin-top:30px; color:rgba(255,255,255,.64); font-size:17px; line-height:1.75; }
.contact-info { display:grid; gap:17px; margin-top:54px; padding-top:32px; border-top:1px solid rgba(255,255,255,.12); }
.contact-info div { display:grid; grid-template-columns:72px 1fr; gap:16px; font-size:15px; line-height:1.6; }
.contact-info dt { color:rgba(255,255,255,.42); font-weight:600; }
.contact-info dd { color:rgba(255,255,255,.9); }
.contact-form { display:grid; gap:28px; padding:46px; border:1px solid rgba(255,255,255,.13); border-radius:28px; background:rgba(255,255,255,.055); backdrop-filter:blur(10px); }
.contact-form__head { display:flex; align-items:center; justify-content:space-between; margin-bottom:4px; padding-bottom:24px; border-bottom:1px solid rgba(255,255,255,.12); }
.contact-form__head p { font-size:28px; font-weight:700; }
.contact-form__head span { color:rgba(255,255,255,.48); font-size:13px; }
.contact-form em { color:#42c5ff; font-style:normal; }
.contact-form__row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.contact-field { display:grid; gap:10px; min-width:0; }
.contact-field--wide { min-inline-size:0; margin:0; padding:0; border:0; }
.contact-field > span,.contact-field legend { color:rgba(255,255,255,.9); font-size:16px; font-weight:600; }
.contact-field legend small { margin-left:7px; color:rgba(255,255,255,.45); font-size:13px; font-weight:400; }
.contact-field input,.contact-field select,.contact-field textarea { width:100%; border:1px solid rgba(255,255,255,.16); border-radius:10px; background:rgba(255,255,255,.075); color:#fff; font:inherit; outline:none; transition:border-color .2s,background .2s; }
.contact-field input,.contact-field select { height:54px; padding:0 16px; }
.contact-field textarea { resize:vertical; min-height:150px; padding:16px; line-height:1.6; }
.contact-field input:focus,.contact-field select:focus,.contact-field textarea:focus { border-color:#39bfff; background:rgba(255,255,255,.1); }
.contact-field input::placeholder { color:rgba(255,255,255,.25); }
.contact-field select option { color:#111; }
.contact-field .contact-select--native { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.custom-select { position:relative; width:100%; }
.custom-select__trigger { position:relative; width:100%; height:54px; padding:0 48px 0 16px; border:1px solid rgba(91,205,255,.9); border-radius:10px; color:#fff; background:rgba(255,255,255,.075); font:inherit; text-align:left; cursor:pointer; transition:border-color .2s,background .2s; }
.custom-select__trigger::after { content:""; position:absolute; top:50%; right:20px; width:8px; height:8px; border-right:2px solid #fff; border-bottom:2px solid #fff; transform:translateY(-70%) rotate(45deg); transition:transform .2s; }
.custom-select.is-open .custom-select__trigger { border-color:#39bfff; border-radius:10px 10px 0 0; background:rgba(255,255,255,.11); }
.custom-select.is-open .custom-select__trigger::after { transform:translateY(-20%) rotate(225deg); }
.custom-select__list { position:absolute; top:calc(100% - 1px); right:0; left:0; z-index:20; padding:7px; overflow:hidden; border:1px solid #39bfff; border-top:0; border-radius:0 0 10px 10px; background:#17245a; box-shadow:0 16px 30px rgba(0,0,0,.28); opacity:0; visibility:hidden; transform:translateY(-4px); transition:opacity .18s,transform .18s,visibility .18s; }
.custom-select.is-open .custom-select__list { opacity:1; visibility:visible; transform:translateY(0); }
.custom-select__option { width:100%; min-height:40px; padding:8px 12px; border-radius:7px; color:rgba(255,255,255,.86); background:transparent; font:inherit; text-align:left; cursor:pointer; }
.custom-select__option:hover,.custom-select__option:focus-visible { color:#fff; background:rgba(47,181,255,.22); outline:0; }
.contact-help { margin-top:-3px; color:rgba(255,255,255,.42); font-size:12px; line-height:1.5; }
.contact-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:12px; }
.contact-options label { position:relative; cursor:pointer; }
.contact-options input { position:absolute; opacity:0; pointer-events:none; }
.contact-options label > span { display:flex; min-height:90px; padding:17px; flex-direction:column; justify-content:center; border:1px solid rgba(255,255,255,.14); border-radius:12px; background:rgba(255,255,255,.05); transition:.2s; }
.contact-options label > span::after { content:""; position:absolute; top:12px; right:12px; width:20px; height:20px; border:1px solid rgba(255,255,255,.28); border-radius:7px; background:rgba(255,255,255,.06); transition:.2s; }
.contact-options strong { padding-right:26px; font-size:15px; }
.contact-options small { margin-top:6px; color:rgba(255,255,255,.48); font-size:12px; line-height:1.4; }
.contact-options input:checked + span { border-color:#38bfff; background:rgba(36,154,255,.16); box-shadow:inset 0 0 0 1px #38bfff; }
.contact-options input:checked + span::after { border-color:#38bfff; background:#38bfff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='9' viewBox='0 0 12 9'%3E%3Cpath d='m1 4 3 3 7-6' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px auto no-repeat; }
.contact-options input:focus-visible + span { outline:2px solid #fff; outline-offset:2px; }
.contact-agree input { appearance:none; width:21px; height:21px; margin:0; flex:0 0 auto; border:1px solid rgba(255,255,255,.3); border-radius:7px; background:rgba(255,255,255,.07); cursor:pointer; transition:.2s; }
.contact-agree input:checked { border-color:#38bfff; background:#38bfff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='9' viewBox='0 0 12 9'%3E%3Cpath d='m1 4 3 3 7-6' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px auto no-repeat; }
.contact-agree input:focus-visible { outline:2px solid #fff; outline-offset:2px; }
.contact-form__bottom { display:flex; align-items:center; justify-content:space-between; gap:22px; margin-top:2px; }
.contact-agree { display:flex; align-items:center; gap:10px; color:rgba(255,255,255,.64); font-size:13px; cursor:pointer; }
.contact-agree input { width:17px; height:17px; accent-color:#2ebcff; }
.contact-form__bottom button { display:inline-flex; min-width:170px; height:56px; padding:0 24px; align-items:center; justify-content:center; gap:14px; border-radius:999px; background:#fff; color:#071133; font-size:15px; font-weight:700; transition:.25s; }
.contact-form__bottom button:hover,.contact-form__bottom button:focus-visible { background:#2ebcff; color:#fff; }
.contact-form__bottom button:disabled { opacity:.6; cursor:not-allowed; }
.contact-loading { position:fixed; inset:0; z-index:999; display:none; flex-direction:column; align-items:center; justify-content:center; gap:18px; background:rgba(6,17,63,.82); backdrop-filter:blur(4px); color:#fff; }
.contact-loading.is-active { display:flex; }
.contact-loading__spinner { width:48px; height:48px; border:3px solid rgba(255,255,255,.2); border-top-color:#2ebcff; border-radius:50%; animation:contactLoadingSpin .8s linear infinite; }
.contact-loading p { font-size:15px; font-weight:600; letter-spacing:-.01em; }
@keyframes contactLoadingSpin { to { transform:rotate(360deg); } }
.contact-page .footer { border-top:1px solid rgba(255,255,255,.09); }
@media(max-width:1000px) { .contact-layout { grid-template-columns:1fr; } .contact-intro { position:static; } .contact-main { padding-top:145px; } }
@media(max-width:600px) { .contact-main { padding:115px 0 80px; } .contact-intro h1 { font-size:36px; } .contact-title-line { font-size:29px; } .contact-lead br { display:none; } .contact-form { padding:27px 20px; border-radius:20px; } .contact-form__row { grid-template-columns:1fr; } .contact-options { grid-template-columns:1fr 1fr; } .contact-form__bottom { align-items:stretch; flex-direction:column; } .contact-form__bottom button { width:100%; } }
.thanks-main { min-height:760px; display:grid; place-items:center; padding:160px 0 110px; color:#fff; text-align:center; background:radial-gradient(circle at 50% 35%,rgba(42,183,255,.18),transparent 34%),#06113f; }
.thanks-content { display:flex; flex-direction:column; align-items:center; }
.thanks-icon { display:grid; place-items:center; width:92px; height:92px; margin-bottom:28px; border-radius:50%; background:rgba(43,188,255,.14); color:#43c5ff; animation:thanksPop .6s cubic-bezier(.34,1.56,.64,1) both; }
.thanks-icon svg { width:54px; height:54px; stroke:currentColor; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.thanks-icon path { stroke-dasharray:32; stroke-dashoffset:32; animation:thanksDraw .55s ease .45s forwards; }
.thanks-eyebrow { color:#43c5ff; font-size:14px; font-weight:700; letter-spacing:.12em; }
.thanks-content h1 { margin-top:14px; font-size:clamp(38px,4vw,58px); line-height:1.2; letter-spacing:-.04em; }
.thanks-content > p:not(.thanks-eyebrow) { margin-top:24px; color:rgba(255,255,255,.64); font-size:17px; line-height:1.7; }
.thanks-actions { display:flex; gap:12px; margin-top:42px; }
.thanks-actions a { display:inline-flex; min-width:185px; height:56px; padding:0 24px; align-items:center; justify-content:center; gap:12px; border:1px solid rgba(255,255,255,.25); border-radius:999px; color:#fff; font-size:14px; font-weight:600; }
.thanks-actions a:first-child { border-color:#fff; background:#fff; color:#071133; }
.thanks-actions a:hover { border-color:#2ebcff; background:#2ebcff; color:#fff; }
@keyframes thanksPop { from { opacity:0; transform:scale(.5); } to { opacity:1; transform:scale(1); } }
@keyframes thanksDraw { to { stroke-dashoffset:0; } }
@media(max-width:600px) { .thanks-main { min-height:650px; padding-top:120px; } .thanks-actions { width:100%; flex-direction:column; } .thanks-actions a { width:100%; } }