/* ────────────────────────────────────
   RESET
──────────────────────────────────── */
button {font-family:inherit;cursor:pointer;}
input,select,textarea {font-family:inherit;}
.gnbon5 {font-weight:bold;color:#3730A3!important;position:relative;}
.gnbon5::after {content:"";border-bottom:2px solid #3730A3;display:block;width:100%;margin-top:5px;position:absolute;left:0;}

/* ────────────────────────────────────
   PROGRESS BAR
──────────────────────────────────── */
#prog {position:fixed;top:0;left:0;height:2px;background:#4F46E5;z-index:9999;width:0;transition:width .08s linear;pointer-events:none;}

/* ────────────────────────────────────
   GNB
──────────────────────────────────── */
.gnb-logo {background:url(/images/pointweb_logo_c.svg) no-repeat;width:160px;height:35px;background-size:contain;}

/* ────────────────────────────────────
   PAGE / CONTACT FORM
──────────────────────────────────── */
.page {margin:0 auto;padding:160px 0;display:grid;grid-template-columns:360px minmax(0,1fr);gap:150px;align-items:start;word-break:keep-all;}
.left {position:sticky;top:100px;display:flex;flex-direction:column;gap:0;align-self:start;}
.right {position:relative;min-width:0;}
.kicker {font-size:16px;font-weight:700;color:#4F46E5;margin-bottom:14px;}
.main-h1 {font-size:clamp(32px,2.5vw,48px);font-weight:700;color:#0F172A;margin-bottom:15px;line-height:1.25;letter-spacing:-0.03em;}
.main-h1 em {color:#4F46E5;font-style:normal;}
.main-desc {font-size:18px;color:#64748B;line-height:1.6;margin-bottom:12px;}
.main-desc strong {color:#0F172A;font-weight:600;}
.main-reassure {display:block;font-size:17px;font-weight:600;color:#4F46E5;margin-bottom:30px;}
.trust-box {background:#EEF2FF;border:1px solid #C7D2FE;border-radius:14px;padding:20px 22px;margin-bottom:28px;}
.trust-box-title {font-size:18px;font-weight:700;color:#4F46E5;margin-bottom:15px;}
.trust-list {display:flex;flex-direction:column;gap:8px;}
.trust-item { align-items:center;gap:10px;font-size:16px;color:#3730A3;}
.trust-dot {width:6px;height:6px;border-radius:50%;background:#4F46E5;flex-shrink:0;}
.trust-item strong {color:#0F172A;font-weight:600;}
.contact-list {display:flex;gap:20px;flex-wrap:wrap;}
.contact-card {flex:1;display:flex;align-items:center;gap:14px;padding:20px 22px;background:#f5f5f5;border-radius:10px;border:0;}
.contact-card:hover {background:#EEF2FF;}
.cc-icon {font-size:22px;line-height:1;}
.cc-label {font-size:15px;color:#666;margin-bottom:8px;}
.cc-val {font-size:18px;font-weight:700;color:#0F172A;}
.cc-val a {color:#0F172A;text-decoration:none;}
.cc-val a:hover {color:#4F46E5;}
.form-card {width:100%;min-width:0;border-radius:20px;padding:0;}
.chip-label {display:block;font-size:16px;font-weight:500;color:#475569;margin-bottom:10px;}
.chip-wrap {display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px;}
.chip {padding:12px 20px;border:1.5px solid #E2E8F0;border-radius:10px;font-size:17px;color:#64748B;cursor:pointer;transition:all .15s;background:#fff;user-select:none;width:calc(20% - 7px);text-align:center;font-weight:500;line-height:1.35;}
.chip:hover {border-color:#4F46E5;color:#4F46E5;}
.chip.on {background:#EEF2FF;border-color:#4F46E5;color:#4F46E5;font-weight:500;}
.f-group {margin-bottom:40px;}
.f-label {display:block;font-size:18px;font-weight:500;color:#475569;margin-bottom:15px;}
.req {color:#f87171;}
.opt {font-size:13px;color:#94A3B8;font-weight:400;}
.f-input {width:100%;border:1.5px solid #d1d5db;border-radius:12px;padding:18px;font-size:17px;font-family:inherit;color:#0F172A;background:#fff;transition:border-color .15s,box-shadow .15s;outline:none;line-height:1.5;margin-bottom:20px;-webkit-appearance:none;appearance:none;}
.f-input:focus {border-color:#4F46E5;box-shadow:0 0 0 3px rgba(79,70,229,.08);outline:none;}
.f-input::placeholder {color:#CBD5E1;}
.f-input.error {border-color:#f87171;}
select.f-input {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%2394A3B8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;background-size:16px;padding-right:44px;cursor:pointer;}
textarea.f-input {resize:vertical;min-height:110px;line-height:1.7;}
.f-row {display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:0;}
.f-row .f-group {margin-bottom:40px;}
.f-drop {border:1.5px dashed #4F46E5;border-radius:12px;padding:28px 20px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s;background:#EEF2FF;}
.f-drop:hover,.f-drop.drag {border-color:#4F46E5;background:#e9edfd;}
.f-drop.disabled {opacity:.45;pointer-events:none;}
.f-drop input[type="file"] {display:none;}
.f-drop-icon {font-size:24px;margin-bottom:8px;}
.f-drop-txt {font-size:15px;color:#64748B;font-weight:500;margin-bottom:4px;line-height:1.6;}
.f-drop-txt strong {color:#4F46E5;font-weight:500;}
.f-drop-ext {font-size:13px;color:#94A3B8;margin-top:4px;}
.f-file-list {margin-top:10px;display:flex;flex-direction:column;gap:5px;}
.f-file-item {display:flex;align-items:center;justify-content:space-between;background:#F1F5F9;border-radius:6px;padding:8px 14px;font-size:15px;color:#475569;}
.f-file-del {background:none;border:none;color:#64748B;cursor:pointer;font-size:16px;padding:0 4px;}
.f-file-del:hover {color:#E24B4A;}
.form-card > div[style*="display:flex"] {display:flex!important;align-items:center!important;gap:10px!important;margin-bottom:28px!important;}
.form-card > div[style*="display:flex"] input[type="checkbox"] {width:20px!important;height:20px!important;margin-top:0!important;accent-color:#4F46E5!important;cursor:pointer!important;flex-shrink:0!important;}
.form-card > div[style*="display:flex"] label {font-size:16px!important;color:#475569!important;cursor:pointer!important;line-height:1.6!important;}
.form-card > div[style*="display:flex"] button {color:#4F46E5!important;text-decoration:underline!important;background:none!important;border:none!important;font-size:16px!important;padding:0!important;font-family:inherit!important;font-weight:500!important;}
.f-submit {width:100%;background:#4F46E5;color:#fff;border:none;border-radius:12px;padding:20px;font-size:18px;font-weight:700;cursor:pointer;transition:background .15s,transform .15s,box-shadow .15s;font-family:inherit;box-shadow:0 4px 18px rgba(79,70,229,.25);margin-top:0;}
.f-submit:hover:not(:disabled) {background:#3730A3;transform:translateY(-2px);box-shadow:0 8px 28px rgba(79,70,229,.35);}
.f-submit:disabled {background:#CBD5E1;cursor:default;transform:none;box-shadow:none;}
.form-success-msg {font-size:13px;color:#2e7d32;text-align:center;margin-top:12px;}
.f-success {display:none;text-align:center;padding:100px 20px;background:#EEF2FF;border-radius:20px;border:1.5px solid #4F46E5;margin-top:20px;}
.f-success.show {display:block;}
.f-success-icon {font-size:44px;margin-bottom:16px;}
.f-success-title {font-size:22px;font-weight:700;color:#3730A3;margin-bottom:8px;}
.f-success-desc {font-size:16px;color:#475569;line-height:1.9;}

/* ────────────────────────────────────
   FAQ
──────────────────────────────────── */
.faq-wrap {margin:0 auto;padding:140px 0;word-break:keep-all;background:#f5f7ff;}
.sec-kicker {font-size:15px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#4F46E5;margin-bottom:16px;}
.sec-h2 {font-size:clamp(32px,4vw,52px);font-weight:700;letter-spacing:-.03em;line-height:1.15;color:#0F172A;margin-bottom:36px;}
.faq-grid {margin-top:40px;display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.faq-card {background:#fff;border-radius:14px;padding:22px 24px;transition:border-color .2s,background .2s;}
.faq-card:hover {border-color:#4F46E5;background:#F5F3FF;}
.faq-q {font-size:20px;font-weight:700;color:#0F172A;margin-bottom:8px;line-height:1.45;}
.faq-a {font-size:17px;color:#64748B;line-height:1.75;letter-spacing:-0.5px;position:relative;padding-left:26px;}
.faq-q:before {content:"Q";margin-right:10px;color:#4F46E5;font-weight:800;}
.faq-a:before {content:"A";position:absolute;left:0;top:0;margin-right:10px;color:#EF4444;font-weight:800;}

/* ────────────────────────────────────
   FOOTER
──────────────────────────────────── */
.footer {background:#0F172A;padding:36px 48px;}
.ft-inner {max-width:1080px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;}
.ft-links {display:flex;gap:20px;flex-wrap:wrap;}
.ft-links a {font-size:14px;color:rgba(255,255,255,.35);transition:color .2s;}
.ft-links a:hover {color:rgba(255,255,255,.7);}
.ft-copy {font-size:15px;color:rgba(255,255,255,.2);line-height:1.6;}

/* ────────────────────────────────────
   MOBILE DRAWER
──────────────────────────────────── */
.gnb-ham {display:none;flex-direction:column;justify-content:center;align-items:center;width:44px;height:44px;cursor:pointer;background:none;border:none;padding:0;gap:5px;z-index:1100;flex-shrink:0;}
.gnb-ham span {display:block;width:22px;height:2px;background:#0F172A;border-radius:2px;transition:all .3s cubic-bezier(.4,0,.2,1);}
.gnb-ham.open span:nth-child(1) {transform:translateY(7px) rotate(45deg);}
.gnb-ham.open span:nth-child(2) {opacity:0;transform:scaleX(0);}
.gnb-ham.open span:nth-child(3) {transform:translateY(-7px) rotate(-45deg);}
.mob-drawer {position:fixed;inset:0;z-index:1050;pointer-events:none;}
.mob-overlay {position:absolute;inset:0;background:rgba(15,23,42,.45);opacity:0;transition:opacity .3s ease;}
.mob-panel {position:absolute;top:0;right:0;width:min(320px,85vw);height:100%;background:#fff;transform:translateX(100%);transition:transform .35s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;padding:0;box-shadow:-4px 0 24px rgba(0,0,0,.08);}
.mob-drawer.open {pointer-events:auto;}
.mob-drawer.open .mob-overlay {opacity:1;}
.mob-drawer.open .mob-panel {transform:translateX(0);}
.mob-panel-head {display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid #F1F5F9;}
.mob-panel-logo {font-size:20px;font-weight:800;color:#0F172A;text-decoration:none;}
.mob-panel-close {width:36px;height:36px;border:none;background:#F8FAFC;border-radius:50%;cursor:pointer;font-size:18px;color:#64748B;display:flex;align-items:center;justify-content:center;}
.mob-nav {display:flex;flex-direction:column;padding:16px 0;flex:1;}
.mob-nav a {font-size:17px;font-weight:600;color:#0F172A;padding:14px 24px;text-decoration:none;border-bottom:1px solid #F8FAFC;transition:background .15s;}
.mob-nav a:hover {background:#F8FAFC;color:#4F46E5;}
.mob-panel-foot {padding:20px 24px;}
.mob-cta {display:block;text-align:center;background:#4F46E5;color:#fff;font-size:16px;font-weight:700;padding:15px;border-radius:14px;text-decoration:none;}
.mob-tel {text-align:center;font-size:15px;color:#94A3B8;margin-top:12px;}

/* ────────────────────────────────────
   COMMON
──────────────────────────────────── */
.hero-h1,.sec-h2,.cta-h2,.card-title {word-break:keep-all;}

/* ────────────────────────────────────
   1480
──────────────────────────────────── */
@media(max-width:1480px){
  .page {padding:140px 20px 100px;}
}

/* ────────────────────────────────────
   1280
──────────────────────────────────── */
@media(max-width:1280px){
  .page {grid-template-columns:1fr;gap:32px;padding:100px 20px 80px; display: block;}
  .left {position:static;text-align:center;}
  .main-desc br {display:none;}
  .main-reassure br {display:none;}
  .trust-box {text-align:left;}
  .contact-list {max-width:700px;margin:0 auto 24px;}
  .right {width:100%;}
  .form-card {max-width:900px;margin:0 auto;}
}

/* ────────────────────────────────────
   1024
──────────────────────────────────── */
@media(min-width:768px) and (max-width:1024px){
  .hero-inner,.hero-content {padding:0 32px;}
  .trust,.portfolio-prev,.reviews,.process,.faq-cta,.why,.industry {padding:72px 40px;}
  .trust-grid {grid-template-columns:repeat(2,1fr);}
  .pf-grid {grid-template-columns:repeat(2,1fr);}
  .review-grid {grid-template-columns:1fr;}
  .industry-grid {grid-template-columns:repeat(2,1fr);}
  .why-grid {grid-template-columns:1fr 1fr;}
  .hero-stats {width:90%;}
  .inn,.container {padding:0 32px;}
  .cta-form {padding:28px 24px;}
}

/* ────────────────────────────────────
   960
──────────────────────────────────── */
@media(max-width:960px){
  .right {margin-top:40px;position:static;order:-1;margin-bottom:48px;}
  .form-card {padding:28px 0;}
  .faq-wrap {padding:100px 20px;}
  .footer {padding:28px 20px;}
  .ft-inner {flex-direction:column;align-items:flex-start;}
}

/* ────────────────────────────────────
   768 / 767
──────────────────────────────────── */
@media(max-width:768px){
  .page { padding: 100px 20px;}
  .main-h1 {font-size:34px;}
  .main-desc {font-size:16px;word-break:keep-all;}
  .main-reassure {font-size:16px;}
  .trust-box {padding:18px;}
  .trust-box-title {font-size:17px;}
  .trust-item {font-size:15px;line-height:1.55;}
  .contact-list {flex-direction:column;margin:0;}
  .contact-card {padding:16px;text-align:left;}
  .form-card {padding:24px 0;border-radius:18px;}
  .chip-wrap {gap:8px;}
  .chip {width:calc(33.333% - 6px);font-size:16px;padding:12px 5px;}
  .f-row {grid-template-columns:1fr;gap:0;}
  .f-row .f-group {margin-bottom:15px;}
  .f-group {margin-bottom:15px;}
  .f-label {font-size:16px;}
  .f-input {font-size:16px;padding:16px;}
  .f-drop {padding:24px 16px;}
  .form-card > div[style*="display:flex"] {align-items:flex-start!important;margin-bottom:24px!important;}
  .f-submit {padding:18px;font-size:17px;}
}

@media(max-width:767px){
  .gnb-menu,.gnb-tel {display:none;}
  .gnb-ham {display:flex;}
  .faq-grid {grid-template-columns:1fr;}
  .faq-q {font-size:16px;}
  .faq-a {font-size:15px;}
}

/* ────────────────────────────────────
   480
──────────────────────────────────── */
@media(max-width:480px){
  .page {padding:120px 20px 60px ;}
  .chip {width:calc(50% - 4px);font-size:15px;}
  .contact-card {align-items:flex-start;}
  .cc-val {font-size:16px;}
  .gnb-logo {font-size:18px;}
  .mob-panel {width:min(300px,90vw);}
  .hero-h1,.cta-h2 {font-size:clamp(32px,9vw,52px);}
  .cf-row {grid-template-columns:1fr!important;}
  .cf-input {font-size:16px;}
  .btn-pw,.cf-btn,.mob-cta {min-height:44px;}
}

/* ────────────────────────────────────
   iOS Safari
──────────────────────────────────── */
@supports (height:100svh){
  .hero,.hero-section,section.hero {min-height:100svh!important;}
}
