:root {
  --navy: #071a31;
  --navy-2: #0b2442;
  --ink: #101828;
  --muted: #667085;
  --line: #e4e9ef;
  --soft: #f5f7fa;
  --white: #fff;
  --mint: #6de3bc;
  --green: #0ca979;
  --green-dark: #087554;
  --green-soft: #e8f8f2;
  --blue: #2e62e8;
  --blue-soft: #eaf0ff;
  --orange: #ed7626;
  --orange-soft: #fff2e8;
  --brand-red: #ef3651;
  --brand-red-dark: #cb233e;
  --brand-pink: #ff7c91;
  --shadow: 0 24px 70px rgba(7, 26, 49, .12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body {
  margin: 0;
  color: var(--ink);
  background: #fff;
  font-size: 16px;
  font-family: Pretendard, "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; }

.site-header {
  height: 72px;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 max(24px, calc((100vw - 1180px) / 2));
  color: var(--navy);
  border-bottom: 1px solid rgba(7,26,49,.08);
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(14px);
}
.brand { display: inline-flex; align-items: center; gap: 9px; color: inherit; text-decoration: none; }
.brand-logo { display: block; width: 73px; height: 60px; object-fit: contain; }
.brand-division { padding-left: 10px; border-left: 1px solid rgba(239,54,81,.2); color: #66515a; font-size: 15px; font-weight: 850; letter-spacing: -.025em; white-space: nowrap; }
.site-header nav { display: flex; align-items: center; gap: 7px; margin-left: auto; }
.site-header nav a { min-height: 40px; position: relative; display: inline-flex; align-items: center; justify-content: center; padding: 0 13px; border: 1px solid rgba(7,26,49,.1); border-radius: 11px; color: #526071; background: rgba(255,255,255,.82); text-decoration: none; white-space: nowrap; font-size: 14px; font-weight: 800; transition: color .2s, background .2s, border-color .2s, transform .2s, box-shadow .2s; }
.site-header nav a::after { content: ""; position: absolute; right: 13px; bottom: 6px; left: 13px; height: 2px; border-radius: 99px; background: var(--brand-red); transform: scaleX(0); transform-origin: center; transition: transform .2s ease; }
.site-header nav a:hover, .site-header nav a.active { color: var(--brand-red); border-color: rgba(239,54,81,.28); background: #fff4f7; box-shadow: 0 8px 20px rgba(239,54,81,.1); transform: translateY(-1px); }
.site-header nav a:hover::after, .site-header nav a.active::after { transform: scaleX(1); }
.site-header nav a:focus-visible { outline: 3px solid rgba(239,54,81,.2); outline-offset: 2px; }

.eyebrow { margin: 0 0 15px; color: var(--green-dark); font-size: 12px; font-weight: 900; letter-spacing: .13em; }
.hero {
  position: relative;
  isolation: isolate;
  min-height: 790px;
  display: grid;
  grid-template-columns: minmax(420px, .9fr) minmax(480px, 1.1fr);
  align-items: center;
  gap: 32px;
  padding: 112px max(24px, calc((100vw - 1180px) / 2)) 52px;
  overflow: hidden;
  color: var(--navy);
  background:
    radial-gradient(circle at 12% 95%, rgba(255,112,148,.28), transparent 34%),
    radial-gradient(circle at 83% 13%, rgba(255,144,170,.21), transparent 31%),
    linear-gradient(135deg, #fff 0%, #fff8fa 48%, #ffeef3 100%);
}
.hero::before { content: ""; position: absolute; z-index: -1; top: 105px; left: -90px; width: 310px; height: 310px; border: 1px solid rgba(239,54,81,.14); border-radius: 44% 56% 63% 37%; transform: rotate(24deg); box-shadow: inset 0 0 70px rgba(255,116,148,.09); }
.hero::after { content: ""; position: absolute; z-index: -1; right: -150px; bottom: -190px; width: 520px; height: 520px; border-radius: 50%; background: linear-gradient(145deg, rgba(255,255,255,.5), rgba(239,54,81,.1)); filter: blur(2px); }
.hero-copy { position: relative; z-index: 3; }
.hero-kicker { display: inline-flex; align-items: center; gap: 7px; margin: 0 0 21px; padding: 8px 13px; border: 1px solid rgba(239,54,81,.13); border-radius: 999px; color: var(--brand-red-dark); background: rgba(255,255,255,.78); font-size: 13px; font-weight: 850; }
.hero-kicker span { color: var(--brand-red); font-size: 12px; }
.hero h1 { max-width: 700px; margin: 0; color: #101318; font-size: clamp(35px, 3.35vw, 44px); line-height: 1.14; letter-spacing: -.06em; }
.hero-title-line { display: block; white-space: nowrap; }
.hero-title-accent { color: var(--brand-red); font-size: 1.22em; text-shadow: 0 12px 30px rgba(239,54,81,.13); }
.hero-description { max-width: 535px; margin: 23px 0 0; color: #667085; font-size: 16px; line-height: 1.78; word-break: keep-all; }
.hero-service-line { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin-top: 21px; color: #667386; font-size: 14px; font-weight: 800; }
.hero-service-line i { width: 3px; height: 3px; border-radius: 50%; background: #ff7994; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 51px; padding: 0 22px; border-radius: 13px; text-decoration: none; font-size: 14px; font-weight: 850; transition: transform .2s, box-shadow .2s, border-color .2s; }
.button.primary { color: #fff; background: linear-gradient(135deg, var(--brand-red), #ff6178); box-shadow: 0 13px 28px rgba(239,54,81,.22); }
.button.secondary { color: var(--navy); border: 1px solid #dfe4eb; background: rgba(255,255,255,.88); box-shadow: 0 10px 24px rgba(7,26,49,.07); }
.button:hover { transform: translateY(-3px); box-shadow: 0 17px 32px rgba(7,26,49,.13); }
.hero-partner-benefit { max-width: 555px; display: grid; grid-template-columns: 56px 1fr; align-items: center; gap: 15px; margin-top: 15px; padding: 15px 17px; border: 2px solid rgba(239,54,81,.26); border-radius: 16px; color: var(--navy); background: linear-gradient(120deg,rgba(255,255,255,.98),rgba(255,235,241,.95)); box-shadow: 0 16px 36px rgba(105,26,48,.12); text-decoration: none; transition: transform .2s,box-shadow .2s,border-color .2s; }
.hero-partner-benefit:hover { border-color: rgba(239,54,81,.38); box-shadow: 0 18px 34px rgba(105,26,48,.13); transform: translateY(-2px); }
.hero-partner-benefit > b { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 15px; color: #fff; background: linear-gradient(135deg,var(--brand-red),#ff738a); box-shadow: 0 10px 22px rgba(239,54,81,.26); font-size: 14px; letter-spacing: .04em; }
.hero-partner-benefit > span, .hero-partner-benefit small, .hero-partner-benefit strong, .hero-partner-benefit em { display: block; min-width: 0; }
.hero-partner-benefit small { color: #8b5965; font-size: 13px; font-weight: 850; }
.hero-partner-benefit strong { margin-top: 3px; font-size: 18px; font-weight: 900; letter-spacing: -.025em; }
.hero-partner-benefit em { margin-top: 4px; color: #657286; font-size: 13px; font-weight: 700; font-style: normal; }
.hero-partner-benefit:focus-visible { outline: 3px solid rgba(239,54,81,.22); outline-offset: 2px; }
.hero-quick-proof { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 27px; overflow: hidden; border: 1px solid rgba(7,26,49,.08); border-radius: 14px; background: rgba(7,26,49,.08); box-shadow: 0 14px 30px rgba(7,26,49,.04); }
.hero-quick-proof > div { padding: 13px 12px; background: rgba(255,255,255,.88); }
.hero-quick-proof strong, .hero-quick-proof span { display: block; }
.hero-quick-proof strong { color: var(--brand-red); font-size: 17px; }
.hero-quick-proof span { margin-top: 4px; color: #667386; font-size: 13px; font-weight: 700; }

.hero-collage { position: relative; min-width: 0; display: flex; align-items: center; justify-content: center; height: auto; padding: 35px 0 24px; }
.collage-glow { position: absolute; inset: 16% 0 7%; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.98) 0 43%, rgba(255,109,143,.15) 54%, transparent 72%); }
.campaign-card { position: relative; z-index: 2; overflow: hidden; width: min(100%, 560px); margin: 0; border: 7px solid rgba(255,255,255,.96); border-radius: 24px; background: #fff; box-shadow: 0 34px 80px rgba(94,20,40,.22), 0 10px 24px rgba(7,26,49,.1); transform: perspective(1100px) rotateY(-4deg) rotateZ(1deg); }
.campaign-card img { position: absolute; right: 0; bottom: 0; left: 0; display: block; width: 100%; height: auto; }
.campaign-ai { aspect-ratio: 491 / 410; }

.features-section { position: relative; max-width: 1180px; margin: 0 auto; padding: 105px 40px 110px; }
.section-intro { display: grid; grid-template-columns: 1.1fr .9fr; align-items: end; gap: 10px 70px; }
.section-intro .eyebrow { grid-column: 1 / -1; }
.section-intro h2, .calculator-heading h2 { margin: 0; color: var(--navy); font-size: clamp(32px, 4vw, 48px); line-height: 1.22; letter-spacing: -.05em; }
.section-intro > p:last-child { margin: 0; color: #5d6b7c; font-size: 16px; line-height: 1.75; word-break: keep-all; }
.feature-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 15px; margin-top: 43px; }
.feature-card { min-height: 360px; position: relative; overflow: hidden; grid-column: span 3; display: flex; flex-direction: column; padding: 25px 23px 21px; border: 1px solid var(--line); border-radius: 20px; background: linear-gradient(155deg,#fff 0%,#fff 72%,#f7f9fb 100%); box-shadow: 0 15px 38px rgba(7,26,49,.07); cursor: pointer; transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease; }
.feature-card::before { content: ""; position: absolute; top: 0; right: 0; left: 0; height: 4px; background: linear-gradient(90deg, var(--brand-red), #ff8ca0, var(--mint)); opacity: 0; transition: opacity .24s; }
.feature-card:hover, .feature-card:focus-visible { z-index: 2; border-color: rgba(239,54,81,.28); box-shadow: 0 26px 58px rgba(7,26,49,.14); transform: translateY(-7px); outline: none; }
.feature-card:hover::before, .feature-card:focus-visible::before { opacity: 1; }
.feature-card.feature-wide { grid-column: span 6; min-height: 300px; }
.feature-card.feature-dark { color: #fff; border-color: var(--navy); background: var(--navy); }
.feature-card.feature-accent { background: linear-gradient(155deg,#f9fffd,#effaf6); }
.feature-index { position: absolute; top: 20px; right: 20px; color: #aeb9c6; font-size: 13px; font-weight: 900; }
.feature-dark .feature-index { color: #52647b; }
.feature-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; color: var(--navy); background: var(--mint); font-size: 17px; font-weight: 900; }
.feature-icon.green { color: var(--green-dark); background: var(--green-soft); }
.feature-icon.blue { color: var(--blue); background: var(--blue-soft); }
.feature-icon.orange { color: #b94d0a; background: var(--orange-soft); }
.service-category { margin-top: 20px; color: var(--green-dark); font-size: 12px; font-weight: 850; letter-spacing: .03em; }
.feature-dark .service-category { color: var(--mint); }
.feature-card h3 { margin: 7px 0 10px; font-size: 20px; letter-spacing: -.025em; }
.feature-card h3.feature-title-nowrap { font-size: clamp(15px,1.45vw,18px); letter-spacing: -.08em; white-space: nowrap; }
.feature-card > p { margin: 0; color: #5d6b7c; font-size: 15px; line-height: 1.65; word-break: keep-all; }
.feature-dark > p { color: #a9b7c9; }
.feature-card > a { margin-top: auto; color: var(--green-dark); text-decoration: none; font-size: 14px; font-weight: 850; }
.feature-card > a span { margin-left: 5px; }
.service-list { display: flex; flex-wrap: wrap; gap: 5px; margin: auto 0 0; padding: 0; list-style: none; }
.service-list li { padding: 7px 9px; border-radius: 7px; color: #536174; background: #f2f5f7; font-size: 12px; font-weight: 750; }
.service-list li.service-key { color: #fff; background: linear-gradient(135deg,var(--brand-red),#ff7086); box-shadow: 0 6px 14px rgba(239,54,81,.16); font-weight: 900; }
.service-list-nowrap { flex-wrap: nowrap; gap: 4px; }
.service-list-nowrap li { flex: 0 0 auto; padding-right: 7px; padding-left: 7px; }
.feature-dark .service-list li { color: #c2cfdd; background: rgba(255,255,255,.07); }
.feature-more { display: flex; align-items: center; justify-content: space-between; margin-top: 16px; padding-top: 13px; border-top: 1px solid rgba(7,26,49,.08); color: var(--brand-red); font-size: 13px; font-weight: 900; }
.feature-more b { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 50%; color: #fff; background: var(--brand-red); font-size: 15px; }
.feature-dark .feature-more { border-color: rgba(255,255,255,.1); color: var(--mint); }
.feature-dark .feature-more b { color: var(--navy); background: var(--mint); }
.mini-orders { display: flex; align-items: center; gap: 5px; margin-top: auto; padding: 11px 10px; border: 1px solid rgba(255,255,255,.1); border-radius: 10px; color: #d4deea; background: rgba(255,255,255,.05); font-size: 12px; font-weight: 700; }
.mini-orders i { flex: 1; height: 1px; background: #53667e; }
.metric-pill { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding: 12px 13px; border-radius: 10px; color: #536174; background: var(--green-soft); font-size: 12px; }
.metric-pill strong { color: var(--green-dark); font-size: 13px; }
.review-bubble { margin-top: auto; padding: 12px 13px; border-radius: 10px; background: var(--blue-soft); }
.review-bubble span { color: #e89000; font-size: 12px; letter-spacing: .1em; }
.review-bubble p { margin: 5px 0 0; color: #526282; font-size: 12px; font-weight: 700; }
.audience-band { position: relative; overflow: hidden; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 30px; margin-top: 22px; padding: 34px 38px; border: 1px solid rgba(255,255,255,.08); border-radius: 22px; color: #fff; background: linear-gradient(125deg, var(--navy) 0%, #123a65 58%, #19406b 100%); box-shadow: 0 24px 55px rgba(7,26,49,.18); }
.audience-band::after { content: ""; position: absolute; right: 90px; bottom: -115px; width: 270px; height: 270px; border-radius: 50%; background: radial-gradient(circle,rgba(109,227,188,.27),transparent 66%); }
.audience-copy { position: relative; z-index: 1; }
.audience-copy > span { display: block; margin-bottom: 8px; color: var(--mint); font-size: 12px; font-weight: 900; letter-spacing: .1em; }
.audience-copy h3 { margin: 0; font-size: clamp(21px,2.5vw,30px); line-height: 1.35; letter-spacing: -.035em; }
.audience-button { position: relative; z-index: 1; min-width: 130px; min-height: 52px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.6); border-radius: 13px; color: var(--navy); background: var(--mint); box-shadow: 0 12px 26px rgba(0,0,0,.14); text-decoration: none; font-size: 15px; font-weight: 900; transition: transform .2s, box-shadow .2s; }
.audience-button:hover { transform: translateY(-3px); box-shadow: 0 17px 30px rgba(0,0,0,.2); }

.feature-dialog { width: min(92vw, 620px); max-height: min(86vh, 760px); padding: 0; border: 0; border-radius: 24px; color: var(--navy); background: transparent; box-shadow: 0 36px 90px rgba(7,26,49,.3); }
.feature-dialog::backdrop { background: rgba(3,15,31,.68); backdrop-filter: blur(7px); }
.feature-dialog-panel { position: relative; overflow: hidden; padding: 38px; border: 1px solid rgba(255,255,255,.6); border-radius: 24px; background: linear-gradient(150deg,#fff 0%,#fff9fb 58%,#f0f8f5 100%); }
.feature-dialog-panel::before { content: ""; position: absolute; top: 0; right: 0; left: 0; height: 6px; background: linear-gradient(90deg,var(--brand-red),#ff8aa0,var(--mint)); }
.feature-dialog-close { position: absolute; top: 18px; right: 18px; width: 38px; height: 38px; border: 1px solid #e1e6ed; border-radius: 50%; color: #536174; background: rgba(255,255,255,.9); font-size: 25px; line-height: 1; cursor: pointer; }
.feature-dialog-category { display: inline-flex; margin-right: 48px; padding: 6px 10px; border-radius: 999px; color: var(--brand-red-dark); background: #ffe9ee; font-size: 12px; font-weight: 900; }
.feature-dialog h2 { margin: 15px 48px 11px 0; font-size: clamp(27px,4vw,38px); line-height: 1.2; letter-spacing: -.045em; }
.feature-dialog-description { margin: 0; color: #5f6d7e; font-size: 16px; line-height: 1.75; word-break: keep-all; }
.feature-dialog ul { display: grid; gap: 9px; margin: 25px 0 0; padding: 0; list-style: none; }
.feature-dialog li { position: relative; padding: 13px 16px 13px 42px; border: 1px solid #e3e9ee; border-radius: 12px; color: #415066; background: rgba(255,255,255,.84); font-size: 15px; font-weight: 750; line-height: 1.5; }
.feature-dialog li::before { content: "✓"; position: absolute; top: 12px; left: 15px; color: var(--green); font-weight: 950; }
.feature-dialog-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 26px; }
.feature-dialog-actions a, .feature-dialog-actions button { min-height: 45px; display: inline-flex; align-items: center; justify-content: center; padding: 0 17px; border-radius: 11px; font-size: 14px; font-weight: 900; cursor: pointer; }
.feature-dialog-actions a { color: #fff; background: var(--brand-red); text-decoration: none; }
.feature-dialog-actions a[hidden] { display: none; }
.feature-dialog-actions button { border: 1px solid #dfe5ec; color: #536174; background: #fff; }

.postpaid-calculator { position: relative; overflow: hidden; margin-top: 22px; padding: 39px; border: 1px solid #dce7e2; border-radius: 24px; background: linear-gradient(145deg,#f1fbf7 0%,#fff 54%,#fff6f8 100%); box-shadow: 0 22px 60px rgba(7,26,49,.09); }
.postpaid-calculator::after { content: ""; position: absolute; top: -120px; right: -90px; width: 330px; height: 330px; border-radius: 50%; background: radial-gradient(circle,rgba(109,227,188,.28),transparent 68%); pointer-events: none; }
.postpaid-heading { position: relative; z-index: 1; display: grid; grid-template-columns: 1.05fr .95fr; align-items: end; gap: 45px; }
.postpaid-heading h3 { margin: 0; color: var(--navy); font-size: clamp(27px,3.3vw,39px); line-height: 1.22; letter-spacing: -.045em; }
.postpaid-heading > p { margin: 0; color: #5d6b7c; font-size: 15px; line-height: 1.75; word-break: keep-all; }
.postpaid-layout { position: relative; z-index: 1; display: grid; grid-template-columns: 1.08fr .92fr; gap: 15px; margin-top: 30px; }
.postpaid-controls, .postpaid-result { padding: 27px; border: 1px solid rgba(7,26,49,.09); border-radius: 18px; background: rgba(255,255,255,.92); box-shadow: 0 14px 34px rgba(7,26,49,.07); }
.postpaid-controls > label { display: block; margin-bottom: 10px; color: #344054; font-size: 14px; font-weight: 850; }
.postpaid-money input { font-size: 22px; }
.postpaid-presets { display: grid; grid-template-columns: repeat(4,1fr); gap: 6px; margin-top: 9px; }
.postpaid-presets button { min-height: 36px; padding: 0 5px; border: 1px solid #e1e7ec; border-radius: 8px; color: #5d6b7c; background: #f7f9fb; font-size: 12px; font-weight: 800; cursor: pointer; }
.postpaid-presets button.selected { color: var(--green-dark); border-color: rgba(12,169,121,.3); background: var(--green-soft); }
.postpaid-presets button:focus-visible, .postpaid-comparison button:focus-visible, .remote-download-button:focus-visible { outline: 3px solid rgba(12,169,121,.22); outline-offset: 2px; }
.postpaid-terms { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 22px; }
.postpaid-terms span { display: inline-flex; align-items: center; min-height: 34px; padding: 0 11px; border: 1px solid rgba(12,169,121,.2); border-radius: 999px; color: var(--green-dark); background: var(--green-soft); font-size: 12px; font-weight: 850; }
.postpaid-terms .term-highlight { color: #fff; border-color: var(--brand-red); background: linear-gradient(135deg,var(--brand-red),#ff7086); box-shadow: 0 7px 16px rgba(239,54,81,.17); font-weight: 950; }
.postpaid-result { display: flex; flex-direction: column; justify-content: center; color: #fff; border-color: var(--navy); background: linear-gradient(145deg,var(--navy),#123960); box-shadow: 0 20px 45px rgba(7,26,49,.2); }
.postpaid-result > span { color: var(--mint); font-size: 14px; font-weight: 850; }
.postpaid-result > strong { margin-top: 9px; font-size: clamp(34px,5vw,52px); letter-spacing: -.05em; }
.postpaid-result-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 22px; }
.postpaid-result-meta span { padding: 11px 12px; border: 1px solid rgba(255,255,255,.1); border-radius: 10px; color: #aebed1; background: rgba(255,255,255,.05); font-size: 12px; }
.postpaid-result-meta b { display: block; margin-top: 5px; color: #fff; font-size: 14px; }
.postpaid-tax-badge { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding: 10px 12px; border: 1px solid rgba(109,227,188,.22); border-radius: 10px; color: #d9fff2; background: rgba(109,227,188,.09); font-size: 13px; }
.postpaid-tax-badge span { display: grid; place-items: center; width: 21px; height: 21px; border-radius: 50%; color: var(--navy); background: var(--mint); font-size: 12px; font-weight: 950; }
.postpaid-result > small { margin-top: 14px; color: #aebed1; font-size: 12px; line-height: 1.55; }
.postpaid-period-picker { position: relative; z-index: 1; margin-top: 15px; padding: 18px; border: 1px solid #e0e7e4; border-radius: 17px; background: rgba(255,255,255,.76); }
.postpaid-period-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; }
.postpaid-period-heading strong { color: var(--navy); font-size: 15px; }
.postpaid-period-heading span { color: #718092; font-size: 12px; }
.postpaid-comparison { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; margin-top: 11px; }
.postpaid-comparison button { padding: 17px 18px; border: 1px solid #e0e7e4; border-radius: 14px; background: rgba(255,255,255,.88); text-align: left; cursor: pointer; transition: transform .2s,border-color .2s,box-shadow .2s; }
.postpaid-comparison button:hover { transform: translateY(-2px); border-color: rgba(12,169,121,.27); }
.postpaid-comparison button.selected { border-color: rgba(12,169,121,.36); background: #eaf9f3; box-shadow: 0 10px 24px rgba(12,169,121,.09); }
.postpaid-comparison span, .postpaid-comparison strong, .postpaid-comparison small { display: block; }
.postpaid-comparison span { color: #627083; font-size: 12px; font-weight: 800; }
.postpaid-comparison strong { margin-top: 6px; color: var(--navy); font-size: 21px; letter-spacing: -.03em; }
.postpaid-comparison small { margin-top: 3px; color: #8b96a6; font-size: 12px; }
.postpaid-note { position: relative; z-index: 1; margin: 13px 2px 0; color: #718092; font-size: 12px; line-height: 1.65; }

.download-section { color: var(--navy); background: linear-gradient(145deg, #fff7fa 0%, #fff 48%, #f4f8fb 100%); }
.utility-after-calculator { margin-top: 70px; padding: 0; border: 1px solid #e2e7ed; border-radius: 25px; }
.utility-panel { overflow: hidden; border: 1px solid #dde4eb; border-radius: 25px; background: #fff; box-shadow: 0 20px 55px rgba(7,26,49,.09); }
.utility-panel + .utility-panel { margin-top: 16px; }
.utility-summary { position: relative; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 28px; padding: 31px 36px; list-style: none; cursor: pointer; background: linear-gradient(130deg,#fff 0%,#fff7f9 58%,#eef8f5 100%); }
.utility-summary::-webkit-details-marker { display: none; }
.utility-summary::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 6px; background: linear-gradient(var(--brand-red),#ff8398); }
.utility-summary-copy .eyebrow { margin-bottom: 8px; }
.utility-summary-copy h2 { margin: 0; color: var(--navy); font-size: clamp(27px,3.6vw,40px); line-height: 1.2; letter-spacing: -.045em; }
.summary-click-hint { display: inline-flex; align-items: center; margin-left: 7px; padding: 5px 10px; border-radius: 999px; color: var(--brand-red); background: #ffe8ed; font-size: 15px; font-weight: 900; letter-spacing: 0; vertical-align: middle; transform: translateY(-3px); }
.utility-panel[open] .summary-click-hint { display: none; }
.utility-summary-copy > p:last-child { margin: 9px 0 0; color: #627083; font-size: 14px; line-height: 1.6; word-break: keep-all; }
.utility-toggle { min-width: 170px; display: inline-flex; align-items: center; justify-content: space-between; gap: 13px; padding: 13px 14px 13px 17px; border: 1px solid rgba(239,54,81,.25); border-radius: 12px; color: var(--brand-red); background: #fff; box-shadow: 0 10px 24px rgba(239,54,81,.09); font-size: 13px; font-weight: 900; }
.utility-toggle i { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 8px; color: #fff; background: var(--brand-red); font-style: normal; }
.utility-toggle i::before { content: "+"; font-size: 19px; line-height: 1; }
.utility-toggle .toggle-open { display: none; }
.utility-panel[open] .utility-toggle .toggle-closed { display: none; }
.utility-panel[open] .utility-toggle .toggle-open { display: inline; }
.utility-panel[open] .utility-toggle i::before { content: "−"; }
.utility-panel[open] .utility-summary { border-bottom: 1px solid #e2e8ee; }
.utility-content { padding: 35px 36px 38px; background: linear-gradient(180deg,#fff,#fbfcfe); }
.download-heading { display: grid; grid-template-columns: 1.1fr .9fr; align-items: end; gap: 60px; }
.download-heading h2 { margin: 0; font-size: clamp(32px, 4vw, 48px); line-height: 1.18; letter-spacing: -.05em; }
.download-heading > p { margin: 0; color: #5d6b7c; font-size: 16px; line-height: 1.75; word-break: keep-all; }
.download-grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: 15px; margin-top: 42px; }
.download-card { min-width: 0; display: flex; flex-direction: column; padding: 30px; border: 1px solid var(--line); border-radius: 22px; background: rgba(255,255,255,.94); box-shadow: 0 18px 50px rgba(7,26,49,.07); }
.download-windows { color: #fff; border-color: var(--navy); background: linear-gradient(145deg, var(--navy), #123860); box-shadow: 0 22px 55px rgba(7,26,49,.18); }
.download-card-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.platform-mark { display: grid; place-items: center; width: 53px; height: 53px; border-radius: 15px; color: var(--navy); background: var(--mint); font-size: 12px; font-weight: 950; letter-spacing: .02em; }
.android-mark { width: 78px; color: #fff; background: var(--green); font-size: 11px; white-space: nowrap; }
.download-badge { padding: 7px 10px; border: 1px solid rgba(109,227,188,.28); border-radius: 999px; color: var(--mint); background: rgba(109,227,188,.1); font-size: 12px; font-weight: 850; }
.mobile-badge { color: var(--green-dark); border-color: #ccefe2; background: var(--green-soft); }
.platform-label { margin-top: 25px; color: #9fb1c7; font-size: 13px; font-weight: 750; }
.download-android .platform-label { color: #748094; }
.download-card h3 { margin: 7px 0 10px; font-size: 27px; letter-spacing: -.035em; }
.download-card > p { min-height: 52px; margin: 0; color: #b9c5d4; font-size: 15px; line-height: 1.65; word-break: keep-all; }
.download-android > p { color: #5d6b7c; }
.download-specs { display: flex; flex-wrap: wrap; gap: 7px; margin: 22px 0 26px; padding: 0; list-style: none; }
.download-specs li { padding: 8px 10px; border-radius: 8px; color: #cfdae6; background: rgba(255,255,255,.07); font-size: 12px; font-weight: 700; }
.download-android .download-specs li { color: #58677a; background: #f2f5f8; }
.download-button { min-height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: auto; padding: 0 17px; border-radius: 12px; text-decoration: none; font-size: 15px; font-weight: 900; }
.primary-download { color: var(--navy); background: var(--mint); }
.android-download { color: #fff; background: var(--green); }
.download-button span { font-size: 18px; }
.install-guide { display: grid; grid-template-columns: .75fr 1.9fr; gap: 34px; margin-top: 15px; padding: 25px 28px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.88); }
.install-guide-title { display: flex; flex-direction: column; justify-content: center; }
.install-guide-title span { color: var(--brand-red); font-size: 12px; font-weight: 900; letter-spacing: .08em; }
.install-guide-title strong { margin-top: 8px; font-size: 17px; line-height: 1.45; word-break: keep-all; }
.install-guide ol { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin: 0; padding: 0; list-style: none; border: 1px solid var(--line); border-radius: 13px; overflow: hidden; background: var(--line); }
.install-guide li { min-width: 0; display: flex; gap: 11px; padding: 17px 15px; background: #fff; }
.install-guide li > span { flex: 0 0 auto; color: var(--brand-red); font-size: 12px; font-weight: 950; }
.install-guide li strong { display: block; color: #344054; font-size: 14px; }
.install-guide li p { margin: 5px 0 0; color: #748094; font-size: 12px; line-height: 1.55; word-break: keep-all; }
.manual-videos { display: grid; grid-template-columns: .72fr 1.78fr; gap: 30px; margin-top: 15px; padding: 28px; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,255,255,.92); box-shadow: 0 16px 45px rgba(7,26,49,.06); }
.manual-video-heading { display: flex; flex-direction: column; justify-content: center; }
.manual-video-heading > span { color: var(--brand-red); font-size: 12px; font-weight: 900; letter-spacing: .1em; }
.manual-video-heading h3 { margin: 9px 0 12px; color: var(--navy); font-size: 25px; line-height: 1.3; letter-spacing: -.035em; }
.manual-video-heading p { margin: 0; color: #687587; font-size: 14px; line-height: 1.65; word-break: keep-all; }
.manual-video-content { min-width: 0; display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(190px, .72fr); gap: 12px; }
.manual-player { position: relative; min-width: 0; overflow: hidden; border-radius: 15px; background: var(--navy); aspect-ratio: 16 / 9; box-shadow: 0 12px 30px rgba(7,26,49,.16); }
.manual-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.manual-video-list { display: grid; grid-template-rows: repeat(3, 1fr); gap: 8px; }
.manual-video-button { min-width: 0; display: grid; grid-template-columns: 31px 1fr; align-content: center; column-gap: 9px; padding: 12px; border: 1px solid #e1e7ee; border-radius: 12px; color: #667085; background: #f8fafc; text-align: left; cursor: pointer; transition: border-color .2s, background .2s, transform .2s; }
.manual-video-button:hover { border-color: rgba(239,54,81,.32); background: #fff7f9; transform: translateY(-1px); }
.manual-video-button > span { grid-row: 1 / 3; align-self: center; display: grid; place-items: center; width: 31px; height: 31px; border-radius: 9px; color: var(--brand-red); background: #ffe9ee; font-size: 11px; font-weight: 950; }
.manual-video-button strong { min-width: 0; color: #344054; font-size: 14px; line-height: 1.3; word-break: keep-all; }
.manual-video-button small { margin-top: 3px; font-size: 12px; line-height: 1.35; word-break: keep-all; }
.manual-video-button.active { border-color: var(--brand-red); color: #7d4050; background: #fff0f3; box-shadow: 0 7px 18px rgba(239,54,81,.1); }
.manual-video-button.active > span { color: #fff; background: var(--brand-red); }
.manual-video-button:focus-visible { outline: 3px solid rgba(239,54,81,.22); outline-offset: 2px; }
.download-support { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 15px; padding: 23px 28px; border-radius: 17px; color: #fff; background: linear-gradient(120deg, var(--brand-red-dark), var(--brand-red)); }
.download-support span, .download-support strong { display: block; }
.download-support span { color: #ffdbe2; font-size: 12px; font-weight: 800; }
.download-support strong { margin-top: 5px; font-size: 17px; }
.download-support-actions { display: flex; gap: 8px; }
.download-support-actions a { min-width: 102px; padding: 11px 14px; border: 1px solid rgba(255,255,255,.4); border-radius: 9px; color: #fff; text-align: center; text-decoration: none; font-size: 14px; font-weight: 850; }
.download-support-actions a:last-child { color: #181600; border-color: #fee500; background: #fee500; }
.utility-content > .download-grid:first-child { margin-top: 0; }
.remote-support-panel { color: var(--navy); }
.remote-support-panel .utility-summary { background: linear-gradient(130deg,#f4f8fc 0%,#fff 55%,#ecfaf5 100%); }
.remote-support-panel .utility-summary::before { background: linear-gradient(var(--green),var(--mint)); }
.remote-support-panel .summary-click-hint { color: var(--green-dark); background: var(--green-soft); }
.remote-support-panel .utility-toggle { color: var(--green-dark); border-color: rgba(12,169,121,.27); box-shadow: 0 10px 24px rgba(12,169,121,.08); }
.remote-support-panel .utility-toggle i { background: var(--green); }
.remote-support-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 18px; }
.remote-support-copy { padding: 30px; border-radius: 18px; color: #fff; background: linear-gradient(145deg,var(--navy),#123960); box-shadow: 0 20px 44px rgba(7,26,49,.17); }
.remote-badge { display: inline-flex; padding: 6px 9px; border: 1px solid rgba(109,227,188,.25); border-radius: 999px; color: var(--mint); background: rgba(109,227,188,.08); font-size: 11px; font-weight: 900; letter-spacing: .08em; }
.remote-support-copy h3 { margin: 16px 0 10px; font-size: 25px; line-height: 1.3; letter-spacing: -.035em; }
.remote-support-copy p { margin: 0; color: #b9c7d7; font-size: 14px; line-height: 1.7; word-break: keep-all; }
.remote-support-copy p strong { color: #fff; }
.remote-download-options { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 25px; }
.remote-download-button { min-height: 55px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 7px 12px; border-radius: 11px; color: var(--navy); background: var(--mint); text-align: center; text-decoration: none; font-size: 13px; font-weight: 900; line-height: 1.25; transition: transform .2s,box-shadow .2s; }
.remote-download-button:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(109,227,188,.18); }
.remote-download-button span { margin-bottom: 3px; color: #31564a; font-size: 10px; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.remote-download-android { color: #fff; background: var(--green); }
.remote-download-android span { color: #d8fff1; }
.remote-steps { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }
.remote-steps li { display: grid; grid-template-columns: 45px 1fr; align-items: center; gap: 15px; padding: 18px 20px; border: 1px solid #e1e7ed; border-radius: 15px; background: #fff; box-shadow: 0 10px 25px rgba(7,26,49,.05); }
.remote-steps li > span { display: grid; place-items: center; width: 45px; height: 45px; border-radius: 13px; color: var(--green-dark); background: var(--green-soft); font-size: 12px; font-weight: 950; }
.remote-steps strong { display: block; color: var(--navy); font-size: 15px; }
.remote-steps p { margin: 5px 0 0; color: #6b788a; font-size: 13px; line-height: 1.5; word-break: keep-all; }
.remote-contact-bar { display: flex; align-items: center; justify-content: space-between; gap: 25px; margin-top: 15px; padding: 19px 22px; border: 1px solid #dfe8e4; border-radius: 15px; background: #f0faf6; }
.remote-contact-bar > span { color: var(--green-dark); font-size: 14px; font-weight: 900; }
.remote-contact-bar > div { display: flex; gap: 7px; }
.remote-contact-bar a { min-width: 100px; padding: 10px 13px; border-radius: 9px; color: #fff; background: var(--green); text-align: center; text-decoration: none; font-size: 13px; font-weight: 850; }
.remote-contact-bar a:last-child { color: #181600; background: #fee500; }

.calculator-section { position: relative; padding: 104px max(24px, calc((100vw - 1180px) / 2)) 96px; background: linear-gradient(180deg,#f3f6f9 0%,#eef3f7 55%,#f5f7fa 100%); }
.calculator-heading { display: grid; grid-template-columns: 1.1fr .9fr; align-items: end; gap: 60px; }
.calculator-heading > p:last-child { margin: 0; color: #5d6b7c; font-size: 16px; line-height: 1.75; word-break: keep-all; }
.calculator-shell { overflow: hidden; display: grid; grid-template-columns: 270px 1fr; margin-top: 42px; border: 1px solid #dfe5ec; border-radius: 22px; background: #fff; box-shadow: 0 24px 62px rgba(7,26,49,.12); }
.calc-basis { display: flex; flex-direction: column; justify-content: center; padding: 28px; color: #fff; background: var(--navy); }
.calc-basis span, .calc-basis strong, .calc-basis small { display: block; }
.calc-basis span { color: var(--mint); font-size: 12px; font-weight: 850; letter-spacing: .06em; }
.calc-basis strong { margin-top: 8px; font-size: 20px; }
.calc-basis small { margin-top: 9px; color: #b6c3d3; font-size: 13px; line-height: 1.6; word-break: keep-all; }
.mode-tabs { display: grid; grid-template-rows: 1fr 1fr; padding: 12px; gap: 9px; background: var(--navy); }
.mode-tab { padding: 17px 18px; border: 1px solid rgba(255,255,255,.09); border-radius: 13px; color: #95a6bb; background: rgba(255,255,255,.04); text-align: left; cursor: pointer; }
.mode-tab span, .mode-tab small { display: block; }
.mode-tab span { margin-bottom: 5px; color: #fff; font-size: 15px; font-weight: 850; }
.mode-tab small { font-size: 13px; }
.mode-tab.active { border-color: var(--mint); background: var(--mint); color: #426259; }
.mode-tab.active span { color: var(--navy); }
.mode-tab:focus-visible, .presets button:focus-visible { outline: 3px solid rgba(46,98,232,.25); outline-offset: 2px; }
.input-area { display: grid; grid-template-columns: 1.15fr .85fr 1.05fr; align-items: end; gap: 20px; padding: 29px 30px; }
.field-heading { display: flex; align-items: center; justify-content: space-between; gap: 13px; min-height: 27px; margin-bottom: 9px; }
.field-heading label { color: #344054; font-size: 14px; font-weight: 850; }
.field-heading > span { color: #748094; font-size: 12px; text-align: right; }
.delivery-fee-block .field-heading label, .delivery-fee-block .field-heading > span { white-space: nowrap; }
.money-input { height: 58px; display: flex; align-items: center; padding: 0 15px 0 17px; border: 2px solid #dde3ea; border-radius: 12px; background: #fff; }
.money-input:focus-within { border-color: var(--blue); box-shadow: 0 0 0 4px rgba(46,98,232,.08); }
.money-input input { width: 100%; min-width: 0; border: 0; outline: 0; color: var(--navy); background: transparent; font-size: 24px; font-weight: 900; letter-spacing: -.035em; }
.money-input > span { color: #667085; font-size: 12px; font-weight: 800; white-space: nowrap; }
.money-input.compact input { font-size: 19px; }
.money-input.compact span { font-size: 12px; }
.presets { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; margin-top: 8px; }
.presets button { min-height: 34px; padding: 0 4px; border: 1px solid #e5e9ef; border-radius: 7px; color: #5f6c7e; background: #f8f9fb; font-size: 12px; font-weight: 750; cursor: pointer; }
.presets button.selected { color: var(--blue); border-color: rgba(46,98,232,.23); background: var(--blue-soft); }
.fee-block output { color: var(--blue); font-size: 18px; font-weight: 900; }
.fee-select-wrap { position: relative; }
.fee-select-wrap::after { content: "⌄"; position: absolute; top: 50%; right: 17px; color: var(--blue); font-size: 21px; font-weight: 900; line-height: 1; pointer-events: none; transform: translateY(-58%); }
.fee-select-wrap select { width: 100%; height: 58px; padding: 0 48px 0 17px; border: 2px solid #dde3ea; border-radius: 12px; outline: 0; color: var(--navy); background: #fff; appearance: none; cursor: pointer; font: inherit; font-size: 20px; font-weight: 900; }
.fee-select-wrap select:focus { border-color: var(--blue); box-shadow: 0 0 0 4px rgba(46,98,232,.08); }

.results { margin-top: 18px; padding: 39px 40px 35px; border: 1px solid #dfe5ec; border-radius: 22px; background: linear-gradient(155deg,#fff 0%,#fff 70%,#f8fbfc 100%); box-shadow: 0 24px 62px rgba(7,26,49,.1); }
.result-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; }
.result-heading h3 { margin: 0; color: var(--navy); font-size: clamp(24px, 3vw, 34px); letter-spacing: -.04em; }
.winner-badge { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-radius: 11px; color: var(--green-dark); background: var(--green-soft); }
.winner-badge span { font-size: 12px; font-weight: 700; }
.winner-badge strong { font-size: 15px; }
.comparison-grid { display: grid; grid-template-columns: 1fr 42px 1fr; align-items: stretch; margin-top: 27px; }
.method-card { padding: 25px; border: 1px solid var(--line); border-radius: 17px; background: #fff; box-shadow: 0 12px 30px rgba(7,26,49,.06); }
.cash-card { border-top: 3px solid var(--orange); }
.card-card { border-top: 3px solid var(--green); }
.versus { display: grid; place-items: center; color: #98a2b3; font-size: 10px; font-weight: 900; }
.method-title { display: flex; align-items: center; gap: 11px; }
.method-icon { display: grid; place-items: center; width: 41px; height: 41px; border-radius: 12px; font-size: 13px; font-weight: 900; }
.method-icon.cash { color: #b54b0f; background: var(--orange-soft); }
.method-icon.card { color: var(--green-dark); background: var(--green-soft); }
.method-title h4 { margin: 0 0 3px; font-size: 17px; }
.method-title p { margin: 0; color: #748094; font-size: 13px; }
.primary-metric { margin: 20px 0 16px; padding: 18px; border-radius: 13px; background: #f7f8fa; }
.primary-metric span, .primary-metric strong { display: block; }
.primary-metric span { margin-bottom: 6px; color: #5d6b7c; font-size: 13px; font-weight: 750; }
.primary-metric strong { color: var(--navy); font-size: clamp(25px, 3vw, 32px); letter-spacing: -.045em; }
.detail-list { margin: 0; }
.detail-list > div { display: flex; align-items: baseline; justify-content: space-between; gap: 15px; padding: 8px 2px; border-bottom: 1px dashed #e8ecf1; }
.detail-list > div:last-child { border: 0; }
.detail-list dt { color: #5d6b7c; font-size: 13px; }
.detail-list dd { margin: 0; color: #344054; font-size: 14px; font-weight: 800; }
.detail-list .credit dd { color: var(--green); }
.detail-list .net { padding-top: 12px; }
.detail-list .net dt, .detail-list .net dd { color: var(--navy); font-weight: 900; }
.call-comparison { margin-top: 18px; padding: 21px 22px; border: 1px solid #dce8e4; border-radius: 16px; background: linear-gradient(135deg, #f1faf7, #f9fbfc); }
.call-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; }
.call-kicker { display: block; margin-bottom: 4px; color: #64726b; font-size: 12px; font-weight: 700; }
.call-kicker strong { color: var(--green); }
.call-heading h4 { margin: 0; color: var(--navy); font-size: 16px; }
.call-difference { padding: 7px 11px; border-radius: 999px; color: var(--green-dark); background: #dcf4eb; font-size: 12px; font-weight: 900; }
.call-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 14px; }
.call-result { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 3px 15px; padding: 14px 16px; border: 1px solid rgba(7,26,49,.07); border-radius: 11px; background: rgba(255,255,255,.9); }
.call-result > span { color: #5d6b7c; font-size: 13px; font-weight: 800; }
.call-result > strong { grid-row: 1 / 3; grid-column: 2; color: var(--navy); font-size: 14px; }
.call-result > strong b { margin-right: 2px; font-size: 25px; }
.call-result small { color: #748094; font-size: 12px; }
.call-result small em { color: #667085; font-style: normal; font-weight: 800; }
.visual-compare { margin-top: 18px; padding: 20px 22px; border-radius: 14px; background: #f7f9fb; }
.bar-row { display: grid; grid-template-columns: 34px 1fr 82px; align-items: center; gap: 12px; }
.bar-row + .bar-row { margin-top: 10px; }
.bar-row > span { color: #5d6b7c; font-size: 12px; font-weight: 800; }
.bar-row > strong { color: #344054; font-size: 13px; text-align: right; }
.bar-track { overflow: hidden; height: 8px; border-radius: 99px; background: #e5e9ee; }
.bar { height: 100%; border-radius: inherit; transition: width .35s ease; }
.cash-bar { background: var(--orange); }
.card-bar { background: var(--green); }
.summary-strip { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 18px; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; }
.summary-strip > div { padding: 15px 17px; }
.summary-strip > div + div { border-left: 1px solid var(--line); }
.summary-strip span, .summary-strip strong { display: block; }
.summary-strip span { margin-bottom: 4px; color: #748094; font-size: 12px; font-weight: 700; }
.summary-strip strong { color: var(--navy); font-size: 14px; }
.tax-note { margin: 13px 2px 0; color: #748094; font-size: 12px; line-height: 1.6; }
.calculation-notes { margin-top: 18px; }
.formula-details, .assumptions { overflow: hidden; border: 1px solid var(--line); border-radius: 13px; background: #fff; }
.assumptions { margin-top: 9px; }
.formula-details summary, .assumptions summary { padding: 16px 19px; color: #344054; font-size: 11px; font-weight: 850; cursor: pointer; }
.formula-details-content { padding: 0 17px 17px; }
.formula-boxes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.formula-boxes article { position: relative; overflow: hidden; padding: 21px; border: 1px solid var(--line); border-radius: 13px; background: #fbfcfd; }
.formula-number { position: absolute; top: 10px; right: 15px; color: #e9edf2; font-size: 34px; font-weight: 900; }
.formula-boxes h4 { position: relative; margin: 0 0 13px; font-size: 13px; }
.formula-lines p { display: flex; justify-content: space-between; gap: 14px; margin: 0; padding: 8px 0; border-top: 1px dashed #e6ebf0; color: #667085; font-size: 9px; }
.formula-lines code { color: #344054; font-family: "SFMono-Regular", Consolas, monospace; font-size: 8px; font-weight: 700; text-align: right; }
.break-even { display: grid; grid-template-columns: 185px 1fr; align-items: center; gap: 22px; margin-top: 10px; padding: 18px 20px; border-radius: 13px; color: #fff; background: var(--navy); }
.break-even > div { display: flex; align-items: baseline; gap: 8px; }
.break-even-label { color: #aab7c8; font-size: 8px; font-weight: 700; }
.break-even strong { color: var(--mint); font-size: 23px; }
.break-even p { margin: 0; color: #c6d1df; font-size: 9px; line-height: 1.65; }
.assumptions ul { margin: -2px 0 17px; padding: 0 38px; color: #667085; font-size: 9px; line-height: 1.75; }
.disclaimer { margin: 11px 3px 0; color: #98a2b3; font-size: 8px; line-height: 1.65; }
.contact-section { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0,.82fr) minmax(0,1.18fr); gap: 44px; margin-top: 18px; padding: 48px; border: 1px solid #dfe5ec; border-radius: 26px; color: var(--navy); background: linear-gradient(135deg,#eaf0f7 0%,#fafbfd 52%,#eaf6f1 100%); box-shadow: 0 26px 70px rgba(7,26,49,.12); }
.contact-section::before { content: ""; position: absolute; top: -140px; left: -120px; width: 350px; height: 350px; border-radius: 50%; background: radial-gradient(circle,rgba(239,54,81,.16),transparent 68%); pointer-events: none; }
.contact-copy { align-self: center; }
.contact-copy h2 { margin: 0; font-size: clamp(35px,4.5vw,56px); line-height: 1.08; letter-spacing: -.055em; word-break: keep-all; }
.contact-description { max-width: 430px; margin: 22px 0 0; color: #637086; font-size: 16px; line-height: 1.75; word-break: keep-all; }
.contact-partner-benefit { max-width: 430px; display: block; margin-top: 18px; padding: 17px 18px; border: 1px solid rgba(239,54,81,.2); border-radius: 15px; color: var(--navy); background: linear-gradient(135deg,#fff 0%,#fff3f6 100%); box-shadow: 0 12px 28px rgba(7,26,49,.07); text-decoration: none; transition: transform .2s,box-shadow .2s,border-color .2s; }
.contact-partner-benefit:hover { border-color: rgba(239,54,81,.38); box-shadow: 0 18px 34px rgba(7,26,49,.11); transform: translateY(-2px); }
.contact-partner-benefit span, .contact-partner-benefit strong, .contact-partner-benefit small { display: block; }
.contact-partner-benefit span { color: var(--brand-red); font-size: 11px; font-weight: 950; letter-spacing: .1em; }
.contact-partner-benefit strong { margin-top: 7px; font-size: 17px; line-height: 1.45; letter-spacing: -.025em; }
.contact-partner-benefit small { margin-top: 5px; color: #6f7c8e; font-size: 13px; }
.contact-partner-benefit:focus-visible { outline: 3px solid rgba(239,54,81,.22); outline-offset: 2px; }
.contact-channels { display: grid; gap: 9px; margin-top: 28px; }
.contact-channels a { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 54px; padding: 0 17px; border: 1px solid #dce3eb; border-radius: 12px; color: var(--navy); background: rgba(255,255,255,.92); text-decoration: none; box-shadow: 0 9px 24px rgba(7,26,49,.06); transition: transform .2s,box-shadow .2s,border-color .2s; }
.contact-channels a:hover { border-color: rgba(239,54,81,.25); box-shadow: 0 14px 28px rgba(7,26,49,.1); transform: translateY(-2px); }
.contact-channels span { color: #7a8799; font-size: 13px; font-weight: 750; }
.contact-channels strong { min-width: 0; overflow-wrap: anywhere; font-size: 14px; text-align: right; }
.contact-channels .kakao-contact { border-color: #f2df1d; background: #fffbe2; }
.contact-hours { display: block; margin-top: 28px; color: var(--brand-red); font-size: 20px; letter-spacing: -.02em; }
.contact-note { width: fit-content; display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; margin-top: 9px; padding: 9px 12px; border: 1px solid rgba(7,26,49,.1); border-radius: 10px; color: #6f7c8e; background: rgba(255,255,255,.7); font-size: 14px; line-height: 1.5; }
.contact-note strong { color: #34445b; font-size: 14px; }
.contact-form-card { position: relative; padding: 34px; border: 1px solid #dce3eb; border-radius: 22px; background: linear-gradient(155deg,#fff,#fbfcfe); box-shadow: 0 24px 58px rgba(7,26,49,.13); }
.contact-form-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.contact-form-heading h3 { margin: 0; font-size: 23px; letter-spacing: -.035em; }
.contact-form-heading span { color: #98a2b3; font-size: 12px; font-weight: 750; }
.inquiry-form { display: grid; gap: 16px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.inquiry-form label { min-width: 0; display: grid; gap: 8px; color: #455268; font-size: 13px; font-weight: 850; }
.inquiry-form input:not([type="checkbox"]), .inquiry-form select, .inquiry-form textarea { width: 100%; min-width: 0; padding: 0 14px; border: 1px solid #dce3eb; border-radius: 11px; color: var(--navy); background: #fbfcfe; font: inherit; font-size: 15px; font-weight: 550; outline: none; transition: border-color .2s, box-shadow .2s, background .2s; }
.inquiry-form input:not([type="checkbox"]), .inquiry-form select { height: 50px; }
.inquiry-form textarea { min-height: 126px; padding-top: 14px; line-height: 1.55; resize: vertical; }
.inquiry-form input:focus, .inquiry-form select:focus, .inquiry-form textarea:focus { border-color: var(--brand-red); background: #fff; box-shadow: 0 0 0 4px rgba(239,54,81,.08); }
.inquiry-form input::placeholder, .inquiry-form textarea::placeholder { color: #9aa5b4; }
.consent-check { display: flex !important; grid-template-columns: auto 1fr; align-items: center; gap: 9px !important; cursor: pointer; }
.consent-check input { width: 18px; height: 18px; margin: 0; accent-color: var(--brand-red); }
.consent-check span { font-size: 13px; line-height: 1.45; }
.privacy-details { overflow: hidden; border-radius: 10px; color: #657286; background: #f4f6f9; }
.privacy-details summary { padding: 12px 14px; font-size: 12px; font-weight: 800; cursor: pointer; }
.privacy-details > div { padding: 0 14px 12px; }
.privacy-details p { margin: 5px 0; font-size: 12px; line-height: 1.55; }
.privacy-details strong { margin-right: 7px; color: #465469; }
.inquiry-submit { min-height: 54px; border: 0; border-radius: 11px; color: #fff; background: linear-gradient(120deg,var(--brand-red-dark),var(--brand-red)); box-shadow: 0 12px 24px rgba(239,54,81,.2); font-size: 16px; font-weight: 900; cursor: pointer; transition: transform .2s,box-shadow .2s,opacity .2s; }
.inquiry-submit:hover { transform: translateY(-1px); box-shadow: 0 15px 28px rgba(239,54,81,.25); }
.inquiry-submit:disabled { cursor: wait; opacity: .65; transform: none; }
.inquiry-status { min-height: 20px; margin: -4px 0 0; color: #667085; font-size: 13px; text-align: center; }
.inquiry-status.success { color: var(--green-dark); font-weight: 800; }
.inquiry-status.error { color: #c92a43; font-weight: 800; }
.form-honeypot, .inquiry-response-frame { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; }

footer { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: start; gap: 22px 30px; padding: 30px max(24px, calc((100vw - 1100px) / 2)); color: #8fa0b7; background: var(--navy); }
.footer-company { min-width: 0; display: grid; gap: 10px; }
.footer-heading { display: flex; align-items: baseline; gap: 13px; }
footer strong { color: #fff; font-size: 14px; }
footer span, footer a { font-size: 12px; }
footer a { color: var(--mint); text-decoration: none; font-weight: 800; }
.footer-app { align-self: start; margin-top: 1px; }
.footer-address-line { min-width: 0; display: flex; align-items: center; gap: 10px; margin: 0; overflow-x: auto; color: #aeb9c9; line-height: 1.6; white-space: nowrap; scrollbar-width: thin; }
.footer-address-line span { flex: 0 0 auto; margin: 0; }
.footer-address-line b { margin-right: 5px; color: #fff; font-size: 12px; }
.footer-address-line i { flex: 0 0 auto; color: rgba(255,255,255,.3); font-style: normal; }
.footer-legal { grid-column: 1 / -1; margin: 0; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.12); color: #9dabc0; font-size: 12px; line-height: 1.7; text-align: left; word-break: keep-all; }
.footer-legal strong { display: block; margin-bottom: 4px; color: #fff; font-size: 13px; }
.footer-legal span { display: block; margin: 0; }

@media (min-width: 761px) and (max-width: 1050px) {
  .brand { gap: 6px; }
  .brand-logo { width: 61px; height: 50px; }
  .brand-division { padding-left: 7px; font-size: 12px; }
  .site-header nav { min-width: 0; gap: 4px; overflow-x: auto; scrollbar-width: none; }
  .site-header nav::-webkit-scrollbar { display: none; }
  .site-header nav a { min-height: 38px; padding: 0 8px; font-size: 12px; }
}

@media (max-width: 980px) {
  .hero { grid-template-columns: 1fr; min-height: auto; padding-top: 116px; gap: 42px; }
  .hero-copy { max-width: 700px; }
  .hero-collage { width: min(100%, 700px); margin: 0 auto; }
  .campaign-card { width: min(100%, 590px); }
  .feature-grid { grid-template-columns: repeat(2, 1fr); }
  .feature-card, .feature-card.feature-wide { grid-column: span 1; min-height: 345px; }
  .feature-card h3.feature-title-nowrap { font-size: 20px; letter-spacing: -.045em; }
  .audience-band { grid-template-columns: 1fr auto; }
  .postpaid-layout { grid-template-columns: 1fr; }
  .install-guide { grid-template-columns: 1fr; gap: 17px; }
  .remote-support-grid { grid-template-columns: 1fr; }
  .contact-section { grid-template-columns: 1fr; gap: 30px; }
  .contact-description { max-width: 650px; }
  .calculator-shell { grid-template-columns: 1fr; }
  .calc-basis { padding: 20px 29px; }
  .mode-tabs { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
  .mode-tab { text-align: center; }
  .input-area { grid-template-columns: 1.2fr 1fr; }
  .delivery-fee-block { grid-column: 2; }
}

@media (max-width: 760px) {
  html { scroll-padding-top: 124px; }
  .site-header { height: 112px; flex-wrap: wrap; align-content: flex-start; padding: 0 18px; }
  .brand { height: 62px; }
  .brand-logo { width: 61px; height: 50px; }
  .brand-division { padding-left: 8px; font-size: 13px; }
  .site-header nav {
    order: 2;
    flex: 0 0 calc(100% + 36px);
    width: calc(100% + 36px);
    margin: 0 -18px;
    padding: 0 18px 11px;
    gap: 8px;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .site-header nav::-webkit-scrollbar { display: none; }
  .site-header nav a { flex: 0 0 auto; min-height: 36px; padding: 8px 12px; border-color: rgba(7,26,49,.11); border-radius: 999px; background: #fff; box-shadow: 0 4px 12px rgba(7,26,49,.06); font-size: 13px; }
  .site-header nav a::after { right: 12px; bottom: 4px; left: 12px; }
  .hero { padding: 145px 18px 58px; gap: 31px; }
  .hero h1 { font-size: clamp(20px, 5.65vw, 32px); }
  .hero-description { font-size: 16px; }
  .hero-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .hero-partner-benefit { max-width: none; }
  .button { padding: 0 10px; font-size: 14px; }
  .hero-quick-proof > div { padding: 12px 8px; }
  .hero-quick-proof strong { font-size: 15px; }
  .hero-quick-proof span { font-size: 12px; }
  .hero-collage { width: min(100%, 520px); height: auto; padding: 18px 0 2px; }
  .collage-glow { inset: 11% -4% 0; }
  .campaign-card { width: 100%; border-width: 5px; border-radius: 19px; }
  .campaign-card { transform: perspective(900px) rotateY(-2deg) rotateZ(.5deg); }
  .features-section { padding: 78px 18px; }
  .section-intro, .calculator-heading { grid-template-columns: 1fr; }
  .section-intro > p:last-child, .calculator-heading > p:last-child { margin-top: 9px; font-size: 15px; }
  .section-intro h2, .calculator-heading h2 { font-size: 34px; }
  .feature-grid { grid-template-columns: 1fr; margin-top: 30px; }
  .feature-card, .feature-card.feature-wide { min-height: 325px; }
  .postpaid-calculator { padding: 29px 16px; border-radius: 20px; }
  .postpaid-heading { grid-template-columns: 1fr; gap: 10px; }
  .postpaid-heading > p { font-size: 14px; }
  .postpaid-layout { margin-top: 23px; }
  .postpaid-controls, .postpaid-result { padding: 21px 17px; }
  .postpaid-presets { grid-template-columns: repeat(2,1fr); }
  .postpaid-result > strong { font-size: 38px; }
  .postpaid-period-heading { display: block; }
  .postpaid-period-heading span { display: block; margin-top: 4px; }
  .postpaid-comparison { grid-template-columns: 1fr; }
  .postpaid-comparison button { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 2px 10px; padding: 14px 16px; }
  .postpaid-comparison button strong { grid-row: 1 / 3; grid-column: 2; margin: 0; font-size: 18px; }
  .audience-band { grid-template-columns: 1fr; padding: 28px 22px; }
  .audience-button { width: 100%; }
  .download-section { padding: 0; }
  .utility-after-calculator { margin-top: 60px; padding: 0; }
  .utility-panel { border-radius: 20px; }
  .utility-summary { grid-template-columns: 1fr; gap: 19px; padding: 26px 20px 24px; }
  .utility-summary-copy h2 { font-size: 30px; }
  .utility-toggle { width: 100%; min-width: 0; }
  .utility-content { padding: 24px 13px 26px; }
  .download-heading { grid-template-columns: 1fr; gap: 10px; }
  .download-heading h2 { font-size: 34px; }
  .download-heading > p { font-size: 15px; }
  .download-grid { grid-template-columns: 1fr; margin-top: 30px; }
  .download-card { padding: 24px 20px; border-radius: 18px; }
  .download-card > p { min-height: auto; }
  .install-guide { padding: 21px 18px; }
  .install-guide ol { grid-template-columns: 1fr; }
  .manual-videos { grid-template-columns: 1fr; gap: 20px; padding: 22px 18px; }
  .manual-video-heading h3 { font-size: 23px; }
  .manual-video-content { grid-template-columns: 1fr; }
  .manual-video-list { grid-template-rows: none; grid-template-columns: 1fr; }
  .manual-video-button { min-height: 70px; }
  .download-support { display: block; padding: 21px 18px; }
  .download-support-actions { margin-top: 16px; }
  .download-support-actions a { flex: 1; }
  .remote-support-copy { padding: 25px 20px; }
  .remote-support-copy h3 { font-size: 22px; }
  .remote-download-options { grid-template-columns: 1fr; }
  .remote-steps li { padding: 15px 14px; }
  .remote-contact-bar { display: block; padding: 18px 15px; }
  .remote-contact-bar > div { margin-top: 13px; }
  .remote-contact-bar a { flex: 1; min-width: 0; }
  .calculator-section { padding: 76px 12px 64px; }
  .calculator-heading { padding: 0 6px; }
  .calculator-shell { margin-top: 31px; border-radius: 18px; }
  .mode-tabs { padding: 8px; gap: 7px; }
  .mode-tab { padding: 13px 8px; }
  .mode-tab span { font-size: 14px; }
  .input-area { grid-template-columns: 1fr; gap: 23px; padding: 23px 17px; }
  .delivery-fee-block { grid-column: auto; }
  .money-input { height: 57px; }
  .results { padding: 29px 14px 24px; border-radius: 18px; }
  .result-heading { display: block; }
  .winner-badge { justify-content: space-between; margin-top: 16px; }
  .comparison-grid { grid-template-columns: 1fr; gap: 10px; margin-top: 17px; }
  .versus { display: none; }
  .method-card { padding: 20px 17px; }
  .primary-metric strong { font-size: 29px; }
  .call-comparison { padding: 18px 13px; }
  .call-grid { grid-template-columns: 1fr; }
  .visual-compare { padding: 17px 13px; }
  .bar-row { grid-template-columns: 30px 1fr 72px; gap: 7px; }
  .summary-strip { grid-template-columns: 1fr; }
  .summary-strip > div { display: flex; justify-content: space-between; align-items: baseline; padding: 13px 14px; }
  .summary-strip > div + div { border-left: 0; border-top: 1px solid var(--line); }
  .summary-strip span { margin: 0; }
  .formula-details summary, .assumptions summary { padding: 15px 16px; }
  .formula-details-content { padding: 0 10px 10px; }
  .formula-boxes { grid-template-columns: 1fr; }
  .formula-boxes article { padding: 19px 16px; }
  .formula-lines p { display: block; line-height: 1.55; }
  .formula-lines code { display: block; margin-top: 3px; text-align: left; overflow-wrap: anywhere; }
  .break-even { grid-template-columns: 1fr; gap: 7px; padding: 17px; }
  .break-even > div { justify-content: space-between; }
  .assumptions ul { padding: 0 28px; }
  .contact-section { padding: 34px 18px; border-radius: 20px; }
  .contact-copy h2 { font-size: 36px; }
  .contact-partner-benefit { max-width: none; }
  .contact-form-card { padding: 25px 18px; border-radius: 18px; }
  .form-row { grid-template-columns: 1fr; }
  .contact-channels strong { font-size: 13px; }
  footer { display: block; padding: 28px 22px; text-align: center; }
  .footer-company { display: grid; gap: 10px; margin-bottom: 15px; }
  .footer-heading { display: flex; justify-content: center; gap: 8px 13px; }
  .footer-heading span { margin: 0; }
  .footer-address-line { display: grid; gap: 6px; overflow-x: visible; padding-bottom: 5px; text-align: left; white-space: normal; }
  .footer-address-line span { display: block; margin: 0; }
  .footer-address-line b { display: inline-block; min-width: 58px; margin-right: 5px; }
  .footer-address-line i { display: none; }
  .footer-app { display: inline-block; }
  .footer-legal { margin-top: 22px; padding-top: 18px; text-align: left; }
  .footer-legal span { margin-top: 0; }
  .feature-dialog-panel { padding: 33px 20px 24px; }
  .feature-dialog-description { font-size: 15px; }
  .feature-dialog-actions { flex-direction: column; }
  .feature-dialog-actions a, .feature-dialog-actions button { width: 100%; }
}

@media (max-width: 390px) {
  .brand-division { max-width: 190px; padding-left: 7px; font-size: 11.5px; line-height: 1.25; white-space: normal; }
  .feature-card h3.feature-title-nowrap { font-size: 18px; letter-spacing: -.06em; }
  .hero-kicker { font-size: 12px; }
  .hero-description { font-size: 15px; }
  .hero h1 { font-size: clamp(16px, 5.4vw, 22px); }
  .hero-service-line { gap: 7px; font-size: 13px; }
  .hero-actions { grid-template-columns: 1fr; }
  .hero-quick-proof { grid-template-columns: 1fr; }
  .hero-quick-proof > div { display: flex; align-items: baseline; justify-content: space-between; }
  .hero-quick-proof span { margin-top: 0; font-size: 12px; }
  .result-heading h3 { font-size: 25px; }
  .call-heading { align-items: center; }
}

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