:root {
  --future-bg: #f5f9ff;
  --future-panel: rgba(255, 255, 255, .9);
  --future-panel-2: #edf5ff;
  --future-text: #10213f;
  --future-muted: #60708d;
  --future-cyan: #19c7e6;
  --future-violet: #725ff7;
  --future-pink: #ff3f83;
  --future-line: rgba(74, 103, 165, .16);
  --future-glow: 0 24px 64px rgba(42, 70, 125, .13);
}

html { background: #f7fbff; }

body {
  color: var(--future-text);
  background:
    radial-gradient(circle at 6% 7%, rgba(80, 219, 245, .16), transparent 25%),
    radial-gradient(circle at 95% 18%, rgba(121, 104, 255, .11), transparent 23%),
    linear-gradient(180deg, #fbfdff 0%, #f5f9ff 54%, #ffffff 100%);
}

.site-header {
  height: 78px;
  color: var(--future-text);
  border-bottom: 1px solid rgba(72, 116, 187, .13);
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 12px 38px rgba(39, 73, 129, .08);
  backdrop-filter: blur(22px) saturate(160%);
}
.brand-division { border-left-color: rgba(114, 95, 247, .22); color: #485978; }
.site-header nav a {
  color: #435371;
  border-color: rgba(74, 103, 165, .12);
  border-radius: 999px;
  background: rgba(255, 255, 255, .7);
  box-shadow: inset 0 1px rgba(255, 255, 255, .9), 0 5px 16px rgba(55, 84, 142, .04);
}
.site-header nav a::after {
  right: 17px;
  bottom: 5px;
  left: 17px;
  background: linear-gradient(90deg, var(--future-cyan), var(--future-violet), var(--future-pink));
  box-shadow: 0 0 12px rgba(25, 199, 230, .32);
}
.site-header nav a:hover,
.site-header nav a.active {
  color: #152443;
  border-color: rgba(114, 95, 247, .25);
  background: linear-gradient(135deg, rgba(225, 250, 255, .94), rgba(247, 236, 255, .94));
  box-shadow: 0 9px 24px rgba(79, 77, 171, .1), inset 0 1px #fff;
}

.eyebrow { color: #5670a4; }
.hero {
  min-height: 850px;
  color: var(--future-text);
  background:
    radial-gradient(circle at 10% 18%, rgba(47, 211, 238, .18), transparent 29%),
    radial-gradient(circle at 84% 19%, rgba(129, 111, 255, .15), transparent 28%),
    radial-gradient(circle at 77% 88%, rgba(255, 63, 131, .12), transparent 29%),
    linear-gradient(145deg, #fbfdff 0%, #f2f9ff 52%, #fbf7ff 100%);
}
.hero::before {
  inset: 0;
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  background-image:
    linear-gradient(rgba(62, 166, 220, .09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(62, 166, 220, .09) 1px, transparent 1px);
  background-size: 54px 54px;
  box-shadow: none;
  opacity: .65;
  transform: perspective(900px) rotateX(58deg) scale(1.48) translateY(14%);
  transform-origin: center bottom;
  mask-image: linear-gradient(to bottom, transparent 10%, #000 54%, #000 100%);
}
.hero::after {
  right: -120px;
  bottom: -215px;
  width: 580px;
  height: 580px;
  border: 1px solid rgba(114, 95, 247, .16);
  background: radial-gradient(circle at 35% 30%, rgba(255, 255, 255, .96), rgba(90, 226, 247, .18) 30%, rgba(129, 111, 255, .13) 51%, rgba(255, 63, 131, .08) 65%, transparent 74%);
  box-shadow: inset 0 0 80px rgba(255, 255, 255, .5), 0 0 95px rgba(114, 95, 247, .09);
}
.hero-kicker {
  color: #355277;
  border-color: rgba(25, 199, 230, .23);
  background: rgba(255, 255, 255, .72);
  box-shadow: 0 10px 28px rgba(45, 101, 157, .09), inset 0 1px #fff;
}
.hero-kicker span { color: var(--future-violet); }
.hero h1 { color: #0d1d39; text-shadow: 0 12px 35px rgba(75, 95, 139, .09); }
.hero-title-accent {
  color: transparent;
  background: linear-gradient(90deg, #ff347b 0%, #ff5c9c 31%, #745ff5 65%, #0dbbdc 100%);
  -webkit-background-clip: text;
  background-clip: text;
  text-shadow: none;
  filter: drop-shadow(0 10px 20px rgba(114, 95, 247, .12));
}
.hero-description { color: #53637e; }
.hero-service-line { color: #62718d; }
.hero-service-line i { background: var(--future-cyan); box-shadow: 0 0 10px rgba(25, 199, 230, .48); }
.button { border-radius: 15px; }
.button.primary {
  background: linear-gradient(120deg, var(--future-pink), #b04ff1 58%, var(--future-violet));
  box-shadow: 0 16px 34px rgba(255, 63, 131, .2), 0 7px 22px rgba(114, 95, 247, .13);
}
.button.secondary {
  color: #243754;
  border-color: rgba(114, 95, 247, .2);
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 13px 30px rgba(50, 77, 133, .1), inset 0 1px #fff;
}
.button.secondary:hover { color: #142641; border-color: rgba(25, 199, 230, .4); background: #fff; }
.hero-partner-benefit {
  color: #14233f;
  border-color: rgba(72, 116, 187, .15);
  background: linear-gradient(120deg, rgba(255, 255, 255, .9), rgba(237, 249, 255, .88), rgba(251, 241, 255, .86));
  box-shadow: 0 18px 42px rgba(47, 76, 132, .1), inset 0 1px #fff;
}
.hero-partner-benefit:hover { border-color: rgba(25, 199, 230, .38); box-shadow: 0 23px 52px rgba(45, 98, 155, .14); }
.hero-partner-benefit > b { background: linear-gradient(145deg, var(--future-pink), var(--future-violet)); box-shadow: 0 9px 25px rgba(255, 63, 131, .22); }
.hero-partner-benefit small { color: #697995; }
.hero-partner-benefit strong { color: #14233f; }
.hero-partner-benefit em { color: #6c7c98; }
.hero-quick-proof { border-color: rgba(25, 199, 230, .14); background: rgba(218, 248, 255, .62); box-shadow: 0 17px 42px rgba(45, 93, 147, .09); }
.hero-quick-proof > div { background: rgba(255, 255, 255, .86); }
.hero-quick-proof strong { color: #0b9ebc; text-shadow: 0 0 18px rgba(25, 199, 230, .16); }
.hero-quick-proof span { color: #667692; }
.collage-glow { background: radial-gradient(circle, rgba(25, 199, 230, .28), rgba(114, 95, 247, .13) 40%, rgba(255, 63, 131, .08) 58%, transparent 73%); filter: blur(9px); }
.campaign-card {
  border: 1px solid rgba(25, 199, 230, .48);
  border-radius: 29px;
  background: #fff;
  box-shadow: 0 38px 85px rgba(45, 73, 129, .2), 0 0 38px rgba(25, 199, 230, .14), 0 0 60px rgba(114, 95, 247, .08);
  transform: perspective(1100px) rotateY(-6deg) rotateZ(1.2deg) translateY(-4px);
}

.features-section {
  background:
    radial-gradient(circle at 1% 14%, rgba(25, 199, 230, .1), transparent 23%),
    radial-gradient(circle at 98% 82%, rgba(114, 95, 247, .09), transparent 24%),
    linear-gradient(180deg, #fff, #f7fbff);
}
.section-intro h2,
.calculator-heading h2 { color: #10213f; }
.section-intro > p:last-child,
.calculator-heading > p:last-child { color: var(--future-muted); }
.feature-grid { gap: 18px; }
.feature-card,
.feature-card.feature-accent,
.feature-card.feature-dark {
  color: #14233f;
  border-color: rgba(72, 116, 187, .14);
  background: linear-gradient(152deg, rgba(255, 255, 255, .98), rgba(240, 249, 255, .92));
  box-shadow: 0 20px 52px rgba(51, 80, 136, .1), inset 0 1px #fff;
}
.feature-card:nth-child(3n + 2) { background: linear-gradient(152deg, rgba(255, 255, 255, .98), rgba(247, 242, 255, .92)); }
.feature-card:nth-child(3n) { background: linear-gradient(152deg, rgba(255, 255, 255, .98), rgba(234, 252, 255, .9)); }
.feature-card::before { height: 3px; opacity: 1; background: linear-gradient(90deg, var(--future-cyan), var(--future-violet), var(--future-pink)); }
.feature-card:hover,
.feature-card:focus-visible { border-color: rgba(25, 199, 230, .38); box-shadow: 0 30px 66px rgba(49, 80, 140, .16), 0 0 25px rgba(25, 199, 230, .09); transform: translateY(-9px) scale(1.01); }
.feature-index,
.feature-dark .feature-index { color: rgba(76, 102, 163, .29); font-size: 16px; }
.feature-icon,
.feature-icon.green,
.feature-icon.blue,
.feature-icon.orange {
  color: #fff;
  background: linear-gradient(135deg, #20c9e7, #6e66f5);
  box-shadow: 0 10px 24px rgba(71, 123, 210, .2), inset 0 1px rgba(255, 255, 255, .32);
}
.feature-card:nth-child(3n + 2) .feature-icon { background: linear-gradient(135deg, #ff4b88, #a859ef); }
.feature-card:nth-child(3n) .feature-icon { background: linear-gradient(135deg, #10b9d7, #49dca8); }
.service-category,
.feature-dark .service-category { color: #596f9a; }
.feature-card h3,
.feature-dark h3 { color: #11213e; }
.feature-card > p,
.feature-dark > p { color: #65748e; }
.service-list li,
.feature-dark .service-list li { color: #52627f; border: 1px solid rgba(72, 116, 187, .08); background: rgba(240, 246, 255, .82); }
.service-list li.service-key { color: #fff; border-color: transparent; background: linear-gradient(135deg, var(--future-pink), var(--future-violet)); box-shadow: 0 7px 18px rgba(184, 68, 183, .15); }
.feature-more,
.feature-dark .feature-more { color: #51678f; border-top-color: rgba(74, 103, 165, .13); }
.feature-more b,
.feature-dark .feature-more b { color: #fff; background: linear-gradient(135deg, var(--future-cyan), var(--future-violet)); box-shadow: 0 8px 18px rgba(65, 135, 206, .2); }
.audience-band {
  color: #14233f;
  border-color: rgba(114, 95, 247, .16);
  background: linear-gradient(115deg, #eefcff 0%, #f2f3ff 47%, #fff0f7 100%);
  box-shadow: 0 27px 64px rgba(58, 76, 134, .12), inset 0 1px #fff;
}
.audience-band::after { background: radial-gradient(circle, rgba(25, 199, 230, .28), transparent 66%); }
.audience-copy > span { color: #705cf0; }
.audience-copy h2 { color: #12223f; }
.audience-copy p { color: #5f6f8b; }
.audience-button { color: #fff; border-color: transparent; background: linear-gradient(120deg, var(--future-pink), var(--future-violet)); box-shadow: 0 13px 30px rgba(150, 70, 196, .19); }

.calculator-section {
  background:
    linear-gradient(rgba(55, 161, 215, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(55, 161, 215, .055) 1px, transparent 1px),
    radial-gradient(circle at 3% 17%, rgba(25, 199, 230, .13), transparent 24%),
    radial-gradient(circle at 94% 58%, rgba(255, 63, 131, .08), transparent 25%),
    #f5faff;
  background-size: 44px 44px, 44px 44px, auto, auto, auto;
}
.calculator-shell,
.results,
.postpaid-calculator,
.utility-panel {
  border-color: rgba(72, 116, 187, .14);
  background: rgba(255, 255, 255, .91);
  box-shadow: var(--future-glow), inset 0 1px #fff;
  backdrop-filter: blur(15px);
}
.calc-basis { color: #fff; background: linear-gradient(145deg, #675cf1 0%, #905cec 49%, #ff4d8d 100%); box-shadow: 0 18px 38px rgba(114, 95, 247, .2); }
.calc-basis span { color: #d9fbff; }
.calc-basis small { color: rgba(255, 255, 255, .82); }
.input-area { background: linear-gradient(145deg, rgba(242, 248, 255, .92), rgba(249, 247, 255, .84)); }
.field-heading label { color: #1d2f4c; }
.field-heading > span { color: #71809a; }
.money-input,
.fee-select-wrap select {
  color: #132440;
  border-color: rgba(72, 116, 187, .18);
  background: rgba(255, 255, 255, .94);
  box-shadow: inset 0 1px #fff, 0 7px 18px rgba(54, 83, 138, .05);
}
.money-input input { color: #132440; }
.money-input > span { color: #73819b; }
.money-input:focus-within,
.fee-select-wrap select:focus { border-color: var(--future-cyan); box-shadow: 0 0 0 4px rgba(25, 199, 230, .1), 0 9px 22px rgba(57, 110, 165, .08); }
.fee-select-wrap select { color-scheme: light; }
.fee-block output,
.fee-select-wrap::after { color: #0aa8c6; }
.presets button,
.postpaid-presets button { color: #536582; border-color: rgba(72, 116, 187, .16); background: rgba(255, 255, 255, .82); }
.presets button.selected,
.postpaid-presets button.selected { color: #fff; border-color: transparent; background: linear-gradient(120deg, var(--future-cyan), var(--future-violet)); box-shadow: 0 9px 21px rgba(73, 115, 207, .18); }
.result-heading h3,
.postpaid-heading h3 { color: #12223f; }
.winner-badge { color: #087d6c; background: rgba(30, 207, 163, .1); border: 1px solid rgba(30, 185, 152, .17); }
.method-card,
.postpaid-controls,
.postpaid-period-picker {
  color: #14233f;
  border-color: rgba(72, 116, 187, .14);
  background: linear-gradient(150deg, rgba(255, 255, 255, .98), rgba(241, 247, 255, .92));
  box-shadow: 0 15px 38px rgba(44, 76, 134, .08), inset 0 1px #fff;
}
.cash-card { border-top-color: #ff9c55; }
.card-card { border-top-color: var(--future-cyan); }
.method-title h4 { color: #14233f; }
.method-title p,
.primary-metric span,
.detail-list dt,
.postpaid-heading > p,
.postpaid-period-heading span,
.postpaid-note,
.tax-note { color: #6d7c96; }
.primary-metric,
.visual-compare { background: rgba(239, 246, 255, .82); }
.primary-metric strong,
.detail-list .net dt,
.detail-list .net dd,
.call-heading h4,
.call-result > strong,
.postpaid-period-heading strong,
.postpaid-comparison strong { color: #132440; }
.detail-list > div { border-bottom-color: rgba(72, 116, 187, .12); }
.detail-list dd { color: #354866; }
.call-comparison { border-color: rgba(25, 199, 230, .17); background: linear-gradient(135deg, rgba(228, 250, 255, .82), rgba(243, 241, 255, .82)); }
.call-kicker,
.call-result > span,
.call-result small,
.bar-row > span { color: #6c7b96; }
.call-difference { color: #fff; background: linear-gradient(120deg, var(--future-cyan), var(--future-violet)); }
.call-result { border-color: rgba(72, 116, 187, .13); background: rgba(255, 255, 255, .87); }
.bar-row > strong { color: #263a59; }
.bar-track { background: rgba(72, 116, 187, .12); }
.card-bar { background: linear-gradient(90deg, var(--future-cyan), #65d7ff, var(--future-violet)); }
.cash-bar { background: linear-gradient(90deg, #ffad5e, #ff4f8c); }
.summary-strip { border-color: rgba(72, 116, 187, .13); background: rgba(246, 249, 255, .82); }
.summary-strip > div + div { border-color: rgba(72, 116, 187, .13); }
.summary-strip span { color: #77859d; }
.summary-strip strong { color: #152642; }
.postpaid-calculator::after { background: radial-gradient(circle, rgba(25, 199, 230, .2), rgba(114, 95, 247, .09) 44%, transparent 69%); }
.postpaid-controls > label { color: #243654; }
.postpaid-terms span { color: #167a69; border-color: rgba(30, 185, 152, .15); background: rgba(31, 205, 161, .09); }
.postpaid-terms .term-highlight { color: #fff; border-color: transparent; background: linear-gradient(135deg, var(--future-pink), var(--future-violet)); }
.postpaid-result { color: #152542; border-color: rgba(25, 199, 230, .23); background: linear-gradient(145deg, #eefcff, #f3f2ff 54%, #fff1f7); box-shadow: 0 22px 52px rgba(52, 83, 139, .12), inset 0 1px #fff; }
.postpaid-result > span { color: #0b9fbc; }
.postpaid-result > strong { color: #132440; }
.postpaid-result-meta span { color: #657590; background: rgba(255, 255, 255, .7); }
.postpaid-result-meta b { color: #1b2d4a; }
.postpaid-tax-badge { color: #217766; border-color: rgba(25, 199, 230, .18); background: rgba(255, 255, 255, .58); }
.postpaid-tax-badge span { color: #fff; background: linear-gradient(135deg, var(--future-cyan), var(--future-violet)); }
.postpaid-comparison button { color: #1b2c49; border-color: rgba(72, 116, 187, .14); background: rgba(255, 255, 255, .82); }
.postpaid-comparison button.selected { border-color: rgba(25, 199, 230, .35); background: linear-gradient(135deg, rgba(224, 250, 255, .9), rgba(240, 237, 255, .9)); box-shadow: 0 12px 28px rgba(61, 92, 151, .1), 0 0 20px rgba(25, 199, 230, .07); }
.postpaid-comparison span { color: #72819a; }

.utility-summary,
.remote-support-panel .utility-summary {
  background: linear-gradient(120deg, rgba(255, 255, 255, .98), rgba(235, 250, 255, .94), rgba(248, 240, 255, .93));
}
.utility-summary::before,
.remote-support-panel .utility-summary::before { background: linear-gradient(var(--future-cyan), var(--future-violet), var(--future-pink)); }
.utility-summary-copy h2 { color: #132440; }
.utility-summary-copy > p:last-child { color: #657590; }
.summary-click-hint,
.remote-support-panel .summary-click-hint { color: #fff; background: linear-gradient(120deg, var(--future-pink), var(--future-violet)); box-shadow: 0 7px 17px rgba(179, 70, 185, .16); }
.utility-toggle,
.remote-support-panel .utility-toggle { color: #273957; border-color: rgba(72, 116, 187, .16); background: rgba(255, 255, 255, .8); box-shadow: 0 9px 23px rgba(51, 83, 141, .08); }
.utility-toggle i,
.remote-support-panel .utility-toggle i { color: #fff; background: linear-gradient(135deg, var(--future-cyan), var(--future-violet)); }
.utility-content { background: linear-gradient(180deg, #f9fcff, #f3f8ff); }
.download-card,
.download-android,
.install-guide,
.manual-videos,
.remote-steps li {
  color: #14233f;
  border-color: rgba(72, 116, 187, .14);
  background: rgba(255, 255, 255, .88);
  box-shadow: 0 15px 36px rgba(45, 76, 132, .08), inset 0 1px #fff;
}
.download-windows,
.remote-support-copy { color: #fff; background: linear-gradient(145deg, #4d6ee9, #765ced 54%, #e94f91); box-shadow: 0 19px 45px rgba(98, 86, 216, .18); }
.download-windows h3,
.remote-support-copy h3 { color: #fff; }
.download-android h3 { color: #14233f; }
.download-android .platform-label,
.download-android > p,
.manual-video-heading p,
.remote-steps p { color: #687791; }
.download-android .download-specs li { color: #52627f; background: rgba(240, 246, 255, .82); }
.manual-video-heading h3,
.remote-steps strong { color: #14233f; }
.install-guide ol { border-color: rgba(72, 116, 187, .12); background: rgba(72, 116, 187, .12); }
.install-guide li { background: #fff; }
.install-guide li strong { color: #14233f; }
.install-guide li p { color: #6c7b95; }
.manual-video-button { color: #667590; border-color: rgba(72, 116, 187, .14); background: rgba(255, 255, 255, .8); }
.manual-video-button strong { color: #203452; }
.manual-video-button.active { border-color: rgba(25, 199, 230, .36); color: #147f95; background: linear-gradient(135deg, rgba(225, 250, 255, .9), rgba(241, 239, 255, .9)); }
.remote-contact-bar { border-color: rgba(25, 199, 230, .18); background: linear-gradient(120deg, rgba(223, 250, 255, .76), rgba(243, 240, 255, .72)); }
.remote-contact-bar > span { color: #213653; }
.download-support { background: linear-gradient(110deg, #6f63e8, #c34ee2 54%, #ff4b88); }

.contact-section {
  color: #14233f;
  border-color: rgba(72, 116, 187, .15);
  background:
    radial-gradient(circle at 7% 12%, rgba(25, 199, 230, .16), transparent 27%),
    radial-gradient(circle at 92% 88%, rgba(255, 63, 131, .1), transparent 27%),
    linear-gradient(135deg, #eefaff 0%, #f5f3ff 56%, #fff5fa 100%);
  box-shadow: 0 31px 74px rgba(47, 75, 132, .13), inset 0 1px #fff;
}
.contact-section::before { background: radial-gradient(circle, rgba(25, 199, 230, .22), transparent 68%); }
.contact-copy h2 { color: #11213e; }
.contact-description { color: #5f6f8b; }
.contact-partner-benefit { color: #14233f; border-color: rgba(72, 116, 187, .14); background: rgba(255, 255, 255, .7); box-shadow: 0 14px 34px rgba(49, 79, 137, .08); }
.contact-partner-benefit span { color: #6f5bea; }
.contact-partner-benefit small { color: #6b7a94; }
.contact-channels a { color: #19304e; border-color: rgba(72, 116, 187, .14); background: rgba(255, 255, 255, .78); box-shadow: 0 9px 23px rgba(51, 83, 141, .07); }
.contact-channels span { color: #6a7891; }
.contact-channels .kakao-contact { color: #161300; border-color: #fee500; background: #fee500; }
.contact-channels .kakao-contact span { color: #5d5400; }
.contact-hours { color: #d52b68; }
.contact-note { color: #5e6e89; border-color: rgba(72, 116, 187, .13); background: rgba(255, 255, 255, .65); }
.contact-note strong { color: #223552; }
.contact-form-card { color: #14233f; border-color: rgba(255, 255, 255, .9); background: rgba(255, 255, 255, .92); box-shadow: 0 28px 64px rgba(49, 78, 135, .15), inset 0 1px #fff; }
.inquiry-submit { background: linear-gradient(120deg, var(--future-pink), var(--future-violet)); box-shadow: 0 13px 30px rgba(138, 73, 209, .21); }

.feature-dialog-panel { color: #14233f; border-color: rgba(72, 116, 187, .16); background: linear-gradient(150deg, #ffffff, #f2f8ff 55%, #fbf3ff); box-shadow: 0 31px 78px rgba(36, 57, 104, .22); }
.feature-dialog-panel h2 { color: #12223f; }
.feature-dialog-description { color: #667590; }
.feature-dialog li { color: #354766; border-color: rgba(72, 116, 187, .12); background: rgba(255, 255, 255, .72); }
.feature-dialog li::before { color: #0aaac8; }
.feature-dialog-category { color: #fff; background: linear-gradient(120deg, var(--future-cyan), var(--future-violet)); }
.feature-dialog-actions a { background: linear-gradient(120deg, var(--future-pink), var(--future-violet)); }
.feature-dialog-actions button { color: #304361; border-color: rgba(72, 116, 187, .15); background: rgba(255, 255, 255, .76); }
.feature-dialog-close { color: #334764; background: rgba(234, 241, 251, .9); }

footer { color: #687791; border-top: 1px solid rgba(72, 116, 187, .12); background: #f5f9ff; }
footer strong { color: #263a58; }
footer a { color: #0a9eba; }

@media (max-width: 760px) {
  .site-header { height: 112px; background: rgba(255, 255, 255, .92); }
  .site-header nav a { color: #4f607d; border-color: rgba(72, 116, 187, .13); background: rgba(255, 255, 255, .8); box-shadow: 0 5px 15px rgba(48, 79, 136, .06); }
  .site-header nav a:hover,
  .site-header nav a.active { color: #172945; background: linear-gradient(135deg, rgba(226, 250, 255, .94), rgba(244, 239, 255, .94)); }
  .hero { padding-top: 150px; }
  .campaign-card { border-width: 1px; transform: perspective(900px) rotateY(-3deg) rotateZ(.7deg); }
  .feature-card,
  .feature-card.feature-wide { min-height: 310px; }
  .calculator-section { padding-top: 78px; }
  .contact-section { padding: 34px 18px; }
}

@media (prefers-reduced-motion: no-preference) {
  .campaign-card { animation: future-float 6s ease-in-out infinite; }
  .hero-partner-benefit > b { animation: future-pulse 3.2s ease-in-out infinite; }
}

@keyframes future-float {
  0%, 100% { transform: perspective(1100px) rotateY(-6deg) rotateZ(1.2deg) translateY(-4px); }
  50% { transform: perspective(1100px) rotateY(-4deg) rotateZ(.5deg) translateY(-13px); }
}

@keyframes future-pulse {
  0%, 100% { box-shadow: 0 9px 24px rgba(255, 63, 131, .2); }
  50% { box-shadow: 0 10px 33px rgba(25, 199, 230, .29); }
}

/* Bright AI control-deck layout */
body { overflow-x: hidden; }

.site-header {
  height: auto;
  padding: 12px 22px;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.header-shell {
  width: min(100%, 1440px);
  min-height: 68px;
  display: flex;
  align-items: center;
  gap: 24px;
  margin: 0 auto;
  padding: 6px 9px 6px 18px;
  border: 1px solid rgba(74, 103, 165, .13);
  border-radius: 22px;
  background: rgba(255, 255, 255, .9);
  box-shadow: 0 15px 40px rgba(48, 76, 129, .1), inset 0 1px #fff;
  backdrop-filter: blur(24px) saturate(160%);
}
.site-header nav { min-width: 0; gap: 4px; }
.site-header nav a {
  min-height: 42px;
  padding: 0 12px;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  font-size: 13px;
}
.site-header nav a:hover,
.site-header nav a.active { transform: none; }

.hero {
  min-height: auto;
  display: block;
  padding: 114px 24px 36px;
  overflow: visible;
  background:
    radial-gradient(circle at 4% 12%, rgba(25, 199, 230, .13), transparent 22%),
    radial-gradient(circle at 96% 18%, rgba(114, 95, 247, .12), transparent 24%),
    #f4f8ff;
}
.hero::before {
  top: 0;
  right: 0;
  bottom: auto;
  left: 0;
  width: 100%;
  height: 560px;
  border: 0;
  border-radius: 0;
  opacity: .5;
  background-image:
    linear-gradient(rgba(52, 158, 210, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(52, 158, 210, .07) 1px, transparent 1px);
  background-size: 46px 46px;
  box-shadow: none;
  mask-image: linear-gradient(to bottom, #000, transparent 88%);
  transform: none;
}
.hero::after {
  z-index: -1;
  right: 5%;
  bottom: -40px;
  width: 440px;
  height: 440px;
  border: 0;
  background: radial-gradient(circle, rgba(124, 105, 248, .15), rgba(25, 199, 230, .08) 42%, transparent 70%);
  filter: blur(8px);
}
.hero-shell {
  position: relative;
  isolation: isolate;
  width: min(100%, 1440px);
  display: grid;
  grid-template-columns: minmax(0, 1.06fr) minmax(470px, .94fr);
  grid-template-areas:
    "copy visual"
    "proof proof";
  gap: 34px 46px;
  margin: 0 auto;
  padding: 64px 66px 26px;
  overflow: hidden;
  border: 1px solid rgba(78, 108, 169, .14);
  border-radius: 42px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .94), rgba(238, 248, 255, .92) 58%, rgba(250, 244, 255, .94));
  box-shadow: 0 35px 90px rgba(43, 72, 126, .14), inset 0 1px #fff;
}
.hero-shell::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -150px;
  left: 43%;
  width: 520px;
  height: 520px;
  border: 1px solid rgba(25, 199, 230, .13);
  border-radius: 50%;
  box-shadow: 0 0 0 42px rgba(25, 199, 230, .025), 0 0 0 88px rgba(114, 95, 247, .025);
}
.hero-copy { grid-area: copy; align-self: center; padding: 8px 0 28px; }
.hero-sequence {
  display: grid;
  grid-template-columns: auto 68px auto;
  align-items: center;
  gap: 10px;
  width: fit-content;
  margin-bottom: 25px;
  color: #74829a;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .12em;
}
.hero-sequence span { color: #705cf0; font-size: 13px; }
.hero-sequence i { height: 1px; background: linear-gradient(90deg, #725ff7, #19c7e6); }
.hero-kicker { margin-bottom: 19px; }
.hero h1 {
  max-width: 660px;
  font-size: clamp(36px, 3.1vw, 48px);
  line-height: 1.08;
  letter-spacing: -.07em;
}
.hero h1 em {
  color: transparent;
  background: linear-gradient(90deg, #ff347b, #ad4eea 52%, #0bbad9);
  background-clip: text;
  -webkit-background-clip: text;
  font-style: normal;
}
.hero-description { max-width: 620px; margin-top: 25px; font-size: 17px; line-height: 1.75; }
.hero-service-line { margin-top: 22px; }
.hero-actions { margin-top: 31px; }
.hero-partner-benefit {
  width: 100%;
  max-width: 590px;
  margin-top: 17px;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.hero-partner-benefit em {
  display: flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
}
.hero-partner-benefit em b {
  color: #725ff7;
  font-size: 15px;
  line-height: 1;
}

.hero-collage {
  grid-area: visual;
  display: block;
  width: 100%;
  padding: 0;
}
.hero-console {
  position: relative;
  width: 100%;
  padding: 12px;
  border: 1px solid rgba(63, 100, 166, .16);
  border-radius: 30px;
  background: rgba(255, 255, 255, .72);
  box-shadow: 0 28px 70px rgba(44, 76, 135, .15), inset 0 1px #fff;
  backdrop-filter: blur(16px);
}
.hero-console-head {
  min-height: 47px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 0 10px 0 12px;
  color: #536582;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
}
.hero-console-head span { display: inline-flex; align-items: center; gap: 8px; }
.hero-console-head i { width: 8px; height: 8px; border-radius: 50%; background: #31d49b; box-shadow: 0 0 0 5px rgba(49, 212, 155, .12); }
.hero-console-head b { color: #705cf0; }
.hero-console-body { display: grid; grid-template-columns: minmax(0, 1fr) 142px; gap: 12px; }
.campaign-card {
  width: 100%;
  border: 0;
  border-radius: 21px;
  box-shadow: 0 18px 42px rgba(46, 72, 124, .17);
  transform: none;
}
.campaign-ai { aspect-ratio: 1462 / 1076; background: #0a111d; }
.hero-console .campaign-card img {
  position: static;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.console-brand-mark {
  position: absolute;
  z-index: 4;
  display: block;
  overflow: hidden;
  pointer-events: none;
  text-rendering: geometricPrecision;
}
.console-brand-mark text {
  fill: #f5f8ff;
  font-family: Pretendard, "Noto Sans KR", "Apple SD Gothic Neo", sans-serif;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -1px;
}
.console-brand-top {
  top: 12.05%;
  left: 28.55%;
  width: 6.9%;
  height: 3.75%;
}
.console-brand-top text { font-size: 17px; }
.console-brand-order-one,
.console-brand-order-two,
.console-brand-order-three {
  width: 6.25%;
  height: 4.1%;
  border-radius: 999px 4px 4px 999px;
}
.console-brand-order-one { top: 38.75%; left: 39.75%; }
.console-brand-order-two { top: 53.4%; left: 39.75%; }
.console-brand-order-three { top: 82.45%; left: 43.95%; }
.console-brand-bottom {
  top: 86.95%;
  left: 1.05%;
  width: 6.2%;
  height: 4%;
}
.console-brand-bottom text { font-size: 18px; }
.hero-platform-network {
  position: relative;
  margin-top: 14px;
  padding: 15px;
  overflow: hidden;
  border: 1px solid rgba(25, 199, 230, .26);
  border-radius: 22px;
  color: #fff;
  background:
    radial-gradient(circle at 90% 15%, rgba(114, 95, 247, .26), transparent 34%),
    linear-gradient(145deg, #07111f, #080d1b 58%, #130d25);
  box-shadow: 0 18px 44px rgba(44, 70, 125, .17), inset 0 1px rgba(255, 255, 255, .07);
}
.hero-platform-network::after {
  content: "";
  position: absolute;
  right: -40px;
  bottom: -65px;
  width: 170px;
  height: 120px;
  border-radius: 50%;
  background: rgba(25, 199, 230, .13);
  filter: blur(32px);
  pointer-events: none;
}
.hero-platform-network-head {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 4px 16px;
  padding: 1px 6px 8px;
}
.hero-platform-network-head span {
  grid-column: 1 / -1;
  color: #53d8ef;
  font-size: 9px;
  font-weight: 950;
  letter-spacing: .14em;
}
.hero-platform-network-head strong {
  color: #f4f8ff;
  font-size: 17px;
  line-height: 1.38;
  letter-spacing: -.025em;
}
.hero-platform-network-head small {
  padding-bottom: 2px;
  color: #9eacc3;
  font-size: 10px;
  font-weight: 750;
  white-space: nowrap;
}
.platform-hint-mobile { display: none; }
.hero-platform-logo-shell {
  position: relative;
  z-index: 1;
  padding: 0 39px;
}
.hero-platform-logo-viewport {
  position: relative;
  height: 60px;
  overflow-x: auto;
  overflow-y: hidden;
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: 13px;
  background: #03060d;
  scrollbar-width: none;
  overscroll-behavior-inline: contain;
  scroll-behavior: smooth;
}
.hero-platform-logo-viewport::-webkit-scrollbar { display: none; }
.hero-platform-logo-viewport:focus-visible { outline: 2px solid #53d8ef; outline-offset: 2px; }
.hero-platform-logo-viewport img {
  display: block;
  width: 800px;
  max-width: none;
  height: auto;
  transform: translateY(-38px);
  user-select: none;
}
.hero-platform-logo-arrow {
  position: absolute;
  top: 50%;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 32px;
  height: 48px;
  padding: 0 0 3px;
  border: 1px solid rgba(83, 216, 239, .38);
  border-radius: 12px;
  color: #fff;
  background: linear-gradient(145deg, rgba(25, 199, 230, .88), rgba(114, 95, 247, .92));
  box-shadow: 0 8px 24px rgba(42, 126, 199, .28), inset 0 1px rgba(255, 255, 255, .25);
  font: 900 29px/1 system-ui, sans-serif;
  cursor: pointer;
  transform: translateY(-50%);
  transition: transform .2s ease, opacity .2s ease, box-shadow .2s ease;
}
.hero-platform-logo-arrow.is-prev { left: 0; }
.hero-platform-logo-arrow.is-next { right: 0; }
.hero-platform-logo-arrow:hover:not(:disabled) {
  box-shadow: 0 10px 28px rgba(77, 105, 232, .42), inset 0 1px rgba(255, 255, 255, .28);
  transform: translateY(-50%) scale(1.06);
}
.hero-platform-logo-arrow:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.hero-platform-logo-arrow:disabled { opacity: .24; cursor: default; box-shadow: none; }
.hero-flow { display: grid; grid-template-rows: repeat(3, 1fr); gap: 10px; }
.hero-flow > div {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 0;
  padding: 15px 13px;
  overflow: hidden;
  border: 1px solid rgba(72, 116, 187, .13);
  border-radius: 17px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .98), rgba(236, 248, 255, .9));
  box-shadow: 0 10px 25px rgba(50, 81, 139, .08);
}
.hero-flow > div:nth-child(2) { background: linear-gradient(145deg, #fff, #f4efff); }
.hero-flow > div:nth-child(3) { background: linear-gradient(145deg, #fff, #fff0f6); }
.hero-flow span { position: absolute; top: 9px; right: 11px; color: rgba(91, 105, 150, .25); font-size: 10px; font-weight: 950; }
.hero-flow strong { color: #1d3150; font-size: 14px; }
.hero-flow small { margin-top: 5px; color: #7b89a0; font-size: 9px; font-weight: 850; letter-spacing: .06em; }

.hero-quick-proof {
  grid-area: proof;
  grid-template-columns: 1fr 1fr 1fr 2.1fr;
  gap: 0;
  margin: 0 -40px;
  border: 0;
  border-top: 1px solid rgba(72, 116, 187, .13);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.hero-quick-proof > div {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 2px 11px;
  padding: 19px 27px;
  border-right: 1px solid rgba(72, 116, 187, .12);
  background: transparent;
}
.hero-quick-proof > div:last-child { border-right: 0; }
.hero-quick-proof span { grid-column: 1 / -1; margin: 0; color: #8a96aa; font-size: 9px; letter-spacing: .11em; }
.hero-quick-proof strong { color: #172a49; font-size: 23px; }
.hero-quick-proof small { color: #6a7a95; font-size: 12px; font-weight: 750; }
.hero-quick-proof .proof-message { grid-template-columns: 1fr; }
.hero-quick-proof .proof-message strong { font-size: 16px; line-height: 1.45; }

.b2b-dialog {
  width: min(94vw, 1080px);
  max-height: min(92vh, 920px);
  overflow-y: auto;
  border-radius: 29px;
}
.b2b-dialog-panel { padding: 44px; }
.b2b-dialog h2 {
  max-width: 800px;
  margin-top: 18px;
  font-size: clamp(34px, 4vw, 50px);
  line-height: 1.12;
}
.b2b-dialog .feature-dialog-description { max-width: 850px; font-size: 17px; }
.b2b-dialog-section {
  margin-top: 28px;
  padding: 27px;
  border: 1px solid rgba(72, 116, 187, .13);
  border-radius: 22px;
  background: rgba(255, 255, 255, .62);
  box-shadow: inset 0 1px #fff;
}
.b2b-dialog-section-head span {
  color: #705cf0;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .14em;
}
.b2b-dialog-section-head h3 {
  margin: 7px 0 0;
  color: #172a49;
  font-size: 24px;
  line-height: 1.3;
  letter-spacing: -.035em;
}
.b2b-dialog-section-head p {
  margin: 8px 0 0;
  color: #687793;
  font-size: 14px;
  line-height: 1.65;
  word-break: keep-all;
}
.b2b-flow-list {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 13px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}
.b2b-dialog .b2b-flow-list li {
  position: relative;
  min-height: 156px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 49px 14px 16px;
  border: 1px solid rgba(72, 116, 187, .14);
  border-radius: 17px;
  color: #314563;
  background: linear-gradient(145deg, #fff, #edf7ff);
  box-shadow: 0 11px 25px rgba(44, 78, 135, .08);
}
.b2b-dialog .b2b-flow-list li::before { content: none; }
.b2b-dialog .b2b-flow-list li:not(:last-child)::after {
  content: "›";
  position: absolute;
  z-index: 2;
  top: 50%;
  right: -12px;
  color: #11b7d4;
  font-size: 24px;
  font-weight: 950;
  line-height: 1;
  transform: translateY(-50%);
}
.b2b-flow-list li:nth-child(2) { background: linear-gradient(145deg, #fff, #edfffc); }
.b2b-dialog .b2b-flow-list .b2b-flow-core {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(145deg, #705cf0, #a94ce8 56%, #ff3f83);
  box-shadow: 0 17px 35px rgba(112, 92, 240, .22);
}
.b2b-flow-number {
  position: absolute;
  top: 14px;
  left: 14px;
  display: grid;
  place-items: center;
  width: 29px;
  height: 29px;
  border-radius: 10px;
  color: #fff;
  background: linear-gradient(145deg, #19c7e6, #725ff7);
  font-size: 10px;
  font-weight: 950;
}
.b2b-flow-core .b2b-flow-number { color: #5d42d8; background: #fff; }
.b2b-flow-list li > b {
  margin-bottom: auto;
  color: #0aa8c5;
  font-size: 10px;
  letter-spacing: .08em;
}
.b2b-flow-core > b { color: #dffaff !important; }
.b2b-flow-list li > strong {
  color: #19304f;
  font-size: 15px;
  line-height: 1.35;
  letter-spacing: -.025em;
  word-break: keep-all;
}
.b2b-flow-core > strong { color: #fff !important; }
.b2b-flow-list li > small {
  margin-top: 7px;
  color: #6e7d95;
  font-size: 12px;
  line-height: 1.45;
  word-break: keep-all;
}
.b2b-flow-core > small { color: rgba(255, 255, 255, .8) !important; }
.b2b-operation-points {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}
.b2b-operation-points > div {
  padding: 15px;
  border: 1px solid rgba(72, 116, 187, .11);
  border-radius: 14px;
  background: rgba(246, 250, 255, .84);
}
.b2b-operation-points strong,
.b2b-operation-points span { display: block; }
.b2b-operation-points strong { color: #725ff7; font-size: 13px; }
.b2b-operation-points span { margin-top: 5px; color: #697993; font-size: 12px; line-height: 1.5; word-break: keep-all; }
.b2b-benefit-section { background: linear-gradient(145deg, rgba(238, 250, 255, .84), rgba(250, 242, 255, .78)); }
.b2b-benefit-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 11px;
  margin-top: 19px;
}
.b2b-benefit-grid article {
  position: relative;
  min-height: 132px;
  padding: 19px 16px 16px;
  border: 1px solid rgba(72, 116, 187, .13);
  border-radius: 16px;
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 10px 24px rgba(45, 76, 128, .07);
}
.b2b-benefit-grid article > span {
  color: #14a9c5;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .08em;
}
.b2b-benefit-grid article > strong {
  display: block;
  margin-top: 7px;
  color: #1a2f4e;
  font-size: 15px;
  line-height: 1.4;
  word-break: keep-all;
}
.b2b-benefit-grid article > p {
  margin: 7px 0 0;
  color: #6a7992;
  font-size: 12px;
  line-height: 1.55;
  word-break: keep-all;
}
.b2b-dialog-note { margin: 15px 2px 0; color: #78869d; font-size: 12px; line-height: 1.6; word-break: keep-all; }
.b2b-dialog-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
  margin-top: 18px;
  padding: 17px 20px;
  border: 1px solid rgba(255, 63, 131, .17);
  border-radius: 16px;
  color: #52627e;
  background: linear-gradient(120deg, rgba(255, 238, 246, .92), rgba(238, 249, 255, .9));
  font-size: 14px;
  line-height: 1.55;
}
.b2b-dialog-summary strong { color: #ea3979; }
.b2b-dialog-actions { margin-top: 22px; }

.features-section { max-width: 1440px; padding: 120px 34px 118px; }
.section-intro {
  grid-template-columns: minmax(0, 1fr) minmax(360px, 460px);
  align-items: center;
  gap: 70px;
  padding: 0 22px;
}
.section-intro-title .eyebrow { margin-bottom: 14px; }
.section-intro h2 { font-size: clamp(42px, 5vw, 68px); line-height: 1.08; }
.section-intro-note {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: end;
  gap: 0 13px;
  padding: 23px 25px;
  border-left: 3px solid transparent;
  border-image: linear-gradient(#19c7e6, #725ff7, #ff3f83) 1;
  background: linear-gradient(90deg, rgba(237, 249, 255, .8), transparent);
}
.section-intro-note strong { color: #162945; font-size: 44px; line-height: .9; }
.section-intro-note span { color: #725ff7; font-size: 10px; font-weight: 950; letter-spacing: .12em; }
.section-intro-note p { grid-column: 1 / -1; margin: 15px 0 0; color: #62718d; font-size: 16px; line-height: 1.7; letter-spacing: -.025em; }

.amount-block .field-heading {
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 3px;
}
.amount-block .field-heading label,
.amount-block .field-heading > span {
  max-width: none;
  white-space: nowrap;
  text-align: left;
}

.footer-address-line b {
  color: #172a49;
  font-weight: 950;
}
.footer-address-line i { color: rgba(23, 42, 73, .28); }

.feature-grid { grid-auto-flow: dense; gap: 18px; margin-top: 55px; }
.feature-card,
.feature-card.feature-wide {
  grid-column: span 4;
  min-height: 330px;
  padding: 30px 28px 24px;
  border-radius: 26px;
}
.feature-card[data-feature="delivery"] { grid-column: span 5; min-height: 380px; }
.feature-card[data-feature="review"] { grid-column: span 3; }
.feature-card[data-feature="sales"] { grid-column: span 4; }
.feature-card[data-feature="postpaid"] { grid-column: span 7; min-height: 380px; }
.feature-card[data-feature="delivery-payment"] { grid-column: span 5; }
.feature-card[data-feature="operating-payment"],
.feature-card[data-feature="card-sales"],
.feature-card[data-feature="history"] { grid-column: span 4; }
.feature-card[data-feature="liquor"],
.feature-card[data-feature="app-management"] { grid-column: span 6; }
.feature-card.feature-primary {
  background:
    radial-gradient(circle at 96% 8%, rgba(25, 199, 230, .2), transparent 31%),
    linear-gradient(145deg, #f7fdff, #e9f8ff);
}
.feature-card.feature-finance {
  background:
    radial-gradient(circle at 92% 12%, rgba(255, 63, 131, .15), transparent 30%),
    linear-gradient(145deg, #fffafd, #f4f0ff);
}
.feature-card.feature-platform {
  background:
    radial-gradient(circle at 94% 10%, rgba(114, 95, 247, .14), transparent 29%),
    linear-gradient(145deg, #f9f8ff, #edf4ff);
}
.feature-primary h3,
.feature-finance h3,
.feature-platform h3 { font-size: 29px; }
.feature-card .feature-icon { width: 49px; height: 49px; border-radius: 16px; }
.feature-card h3 { margin-top: 11px; font-size: 22px; }
.feature-card > p { max-width: 620px; font-size: 16px; line-height: 1.65; }
.service-list { margin-top: 20px; }
.feature-more { margin-top: auto; font-size: 14px; }

.audience-band {
  grid-template-columns: 100px minmax(0, 1fr) auto;
  gap: 25px;
  margin-top: 24px;
  padding: 28px 30px;
  border-radius: 26px;
}
.audience-band::before {
  content: "AI";
  display: grid;
  place-items: center;
  width: 100px;
  height: 100px;
  border-radius: 22px;
  color: #fff;
  background: linear-gradient(145deg, #18bedc, #725ff7 55%, #ff3f83);
  box-shadow: 0 16px 32px rgba(102, 91, 226, .22);
  font-size: 30px;
  font-weight: 950;
}
.audience-copy h3 { margin: 7px 0 0; color: #14233f; font-size: clamp(24px, 3vw, 35px); line-height: 1.3; }

.calculator-section { padding: 120px 24px 108px; }
.calculator-heading {
  width: min(100%, 1380px);
  grid-template-columns: minmax(0, 1fr) minmax(360px, .85fr);
  gap: 80px;
  margin: 0 auto;
  padding: 0 18px;
}
.calculator-heading h2 { font-size: clamp(42px, 5vw, 67px); line-height: 1.08; }
.calculator-heading > p:last-child { padding: 20px 0 20px 24px; border-left: 2px solid rgba(25, 199, 230, .35); }
.delivery-calculator-workspace {
  width: min(100%, 1380px);
  display: grid;
  grid-template-columns: 355px minmax(0, 1fr);
  align-items: start;
  gap: 18px;
  margin: 50px auto 0;
}
.calculator-shell {
  position: sticky;
  top: 104px;
  grid-template-columns: 1fr;
  margin: 0;
  border-radius: 29px;
}
.calc-basis { min-height: 160px; padding: 30px; }
.calc-basis strong { font-size: 28px; }
.input-area { grid-template-columns: 1fr; align-items: stretch; gap: 25px; padding: 29px 25px 30px; }
.delivery-fee-block { grid-column: auto; }
.results { margin: 0; padding: 34px 32px 27px; border-radius: 29px; }
.result-heading { align-items: center; }
.comparison-grid { margin-top: 23px; }
.method-card { border-radius: 19px; }
.comparison-insights {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(245px, .92fr);
  grid-template-rows: auto 1fr;
  gap: 13px;
  margin-top: 17px;
}
.comparison-insights .call-comparison { grid-row: 1 / 3; margin: 0; }
.comparison-insights .visual-compare { margin: 0; }
.comparison-insights .summary-strip { grid-template-columns: 1fr; margin: 0; }
.comparison-insights .summary-strip > div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 10px 13px; }
.comparison-insights .summary-strip > div + div { border-top: 1px solid var(--future-line); border-left: 0; }
.comparison-insights .summary-strip span { margin: 0; }
.tax-note { margin-top: 15px; }

.postpaid-calculator {
  width: min(100%, 1380px);
  display: grid;
  grid-template-columns: 330px minmax(0, 1fr);
  margin: 105px auto 0;
  padding: 0;
  border-radius: 34px;
}
.postpaid-calculator::after { top: auto; right: -90px; bottom: -140px; }
.postpaid-heading {
  grid-column: 1;
  grid-row: 1 / 4;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 26px;
  padding: 46px 35px;
  color: #fff;
  background: linear-gradient(155deg, #3ba9e5 0%, #6866ee 46%, #a450e7 73%, #ee4c8e 100%);
}
.postpaid-heading .eyebrow { color: rgba(255, 255, 255, .78); }
.postpaid-heading h3 { color: #fff; font-size: 31px; }
.postpaid-heading h3 span { display: inline-block; white-space: nowrap; }
.postpaid-heading > p { color: rgba(255, 255, 255, .82); font-size: 15px; }
.postpaid-layout { grid-column: 2; grid-template-columns: 1.08fr .92fr; gap: 16px; margin: 0; padding: 35px 35px 18px; }
.postpaid-controls,
.postpaid-result { padding: 25px; border-radius: 20px; }
.postpaid-period-picker { grid-column: 2; margin: 0 35px 17px; }
.postpaid-note { grid-column: 2; margin: 0 37px 29px; }

.utility-hub {
  width: min(100%, 1380px);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 18px;
  margin: 90px auto 0;
}
.utility-hub .utility-panel { margin: 0; border-radius: 29px; }
.utility-hub .utility-panel:not([open]) { height: 260px; }
.utility-hub .utility-panel:not([open]) .utility-summary { height: 100%; min-height: 0; }
.utility-hub .utility-panel[open] { grid-column: 1 / -1; }
.utility-hub .utility-summary { min-height: 235px; grid-template-columns: 1fr; align-content: space-between; gap: 24px; padding: 32px; }
.utility-hub .utility-panel[open] .utility-summary { min-height: auto; grid-template-columns: 1fr auto; }
.utility-hub .utility-toggle { width: 100%; }
.utility-hub .utility-panel[open] .utility-toggle { width: auto; }
.utility-hub .utility-summary-copy h2 { font-size: clamp(28px, 3.2vw, 40px); }

.contact-zone {
  padding: 110px 24px;
  background:
    linear-gradient(rgba(55, 161, 215, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(55, 161, 215, .045) 1px, transparent 1px),
    linear-gradient(180deg, #fff, #f3f8ff);
  background-size: 52px 52px, 52px 52px, auto;
}
.contact-section {
  width: min(100%, 1380px);
  grid-template-columns: minmax(0, .9fr) minmax(560px, 1.1fr);
  gap: 62px;
  margin: 0 auto;
  padding: 60px;
  border-radius: 40px;
}
.contact-copy h2 { font-size: clamp(43px, 5vw, 66px); }
.contact-partner-benefit,
.contact-description { max-width: 500px; }
.contact-form-card { border-radius: 27px; }

footer {
  grid-template-columns: minmax(0, 1fr) auto;
  padding-top: 38px;
  padding-bottom: 38px;
}

@media (max-width: 1180px) {
  .header-shell { display: grid; grid-template-columns: auto minmax(0, 1fr); }
  .site-header nav { overflow-x: auto; scrollbar-width: none; }
  .site-header nav::-webkit-scrollbar { display: none; }
  .site-header nav a { flex: 0 0 auto; }
  .hero-shell { grid-template-columns: minmax(0, 1.05fr) minmax(430px, .95fr); padding: 50px 42px 24px; }
  .hero h1 { font-size: clamp(35px, 3.15vw, 43px); }
  .hero-console-body { grid-template-columns: 1fr; }
  .hero-flow { grid-template-columns: repeat(3, 1fr); grid-template-rows: auto; }
  .hero-flow > div { min-height: 86px; }
  .delivery-calculator-workspace { grid-template-columns: 315px minmax(0, 1fr); }
  .comparison-insights { grid-template-columns: 1fr; }
  .comparison-insights .call-comparison { grid-row: auto; }
  .contact-section { grid-template-columns: minmax(0, .85fr) minmax(470px, 1.15fr); padding: 45px; }
}

@media (min-width: 761px) and (max-width: 1100px) {
  .hero-shell {
    grid-template-columns: 1fr;
    grid-template-areas: "copy" "visual" "proof";
    gap: 34px;
  }
  .hero-copy { max-width: none; }
  .hero h1 { max-width: 760px; font-size: clamp(43px, 6vw, 59px); }
  .hero-console-body { grid-template-columns: minmax(0, 1fr) 150px; }
  .hero-flow { grid-template-columns: 1fr; grid-template-rows: repeat(3, 1fr); }
}

@media (max-width: 980px) {
  .hero-shell {
    grid-template-columns: 1fr;
    grid-template-areas: "copy" "visual" "proof";
    gap: 34px;
  }
  .hero-copy { max-width: none; }
  .hero-collage { max-width: none; }
  .hero h1 { font-size: clamp(45px, 7vw, 64px); }
  .hero-console-body { grid-template-columns: minmax(0, 1fr) 150px; }
  .hero-flow { grid-template-columns: 1fr; grid-template-rows: repeat(3, 1fr); }
  .hero-quick-proof { grid-template-columns: repeat(3, 1fr); }
  .hero-quick-proof .proof-message { grid-column: 1 / -1; border-top: 1px solid rgba(72, 116, 187, .12); }
  .b2b-flow-list {
    grid-template-columns: repeat(5, 150px);
    overflow-x: auto;
    padding: 0 2px 8px;
    scrollbar-width: thin;
  }
  .b2b-operation-points,
  .b2b-benefit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .section-intro { grid-template-columns: 1fr; gap: 35px; }
  .calculator-heading {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 28px;
  }
  .calculator-heading > * { min-width: 0; }
  .calculator-heading h2 {
    word-break: keep-all;
    overflow-wrap: normal;
  }
  .calculator-heading > p:last-child { max-width: none; }
  .feature-grid { grid-template-columns: repeat(12, 1fr); }
  .feature-card,
  .feature-card.feature-wide,
  .feature-card[data-feature] { grid-column: span 6; min-height: 350px; }
  .feature-card[data-feature="postpaid"] { grid-column: span 12; }
  .delivery-calculator-workspace { grid-template-columns: 1fr; }
  .calculator-shell { position: static; grid-template-columns: 240px 1fr; }
  .input-area { grid-template-columns: repeat(2, 1fr); }
  .amount-block { grid-column: 1 / -1; }
  .postpaid-calculator { grid-template-columns: 1fr; }
  .postpaid-heading { grid-column: 1; grid-row: auto; padding: 42px 35px; }
  .postpaid-layout,
  .postpaid-period-picker,
  .postpaid-note { grid-column: 1; }
  .postpaid-layout { padding-top: 25px; }
  .utility-hub { grid-template-columns: 1fr; }
  .utility-hub .utility-panel[open] { grid-column: auto; }
  .utility-hub .utility-panel[open] .utility-summary { grid-template-columns: 1fr; }
  .utility-hub .utility-panel[open] .utility-toggle { width: 100%; }
  .contact-section { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  html { scroll-padding-top: 126px; }
  .site-header { height: auto; padding: 8px 10px; }
  .header-shell { display: block; padding: 4px 8px 8px; border-radius: 18px; }
  .brand { height: 52px; padding-left: 6px; }
  .brand-logo { width: 57px; height: 47px; }
  .brand-division { font-size: 12px; }
  .site-header nav { width: auto; margin: 0; padding: 0 2px; }
  .site-header nav a { min-height: 34px; padding: 0 11px; font-size: 12px; }
  .hero { padding: 116px 10px 22px; }
  .hero-shell { gap: 28px; padding: 34px 18px 18px; border-radius: 27px; }
  .hero-sequence { margin-bottom: 18px; }
  .hero-kicker { margin-bottom: 16px; font-size: 11px; }
  .hero h1 { font-size: clamp(30px, 9.2vw, 45px); line-height: 1.12; }
  .hero-title-line { white-space: normal; }
  .hero-description { margin-top: 20px; font-size: 16px; }
  .hero-actions { grid-template-columns: 1fr; }
  .hero-partner-benefit { grid-template-columns: 48px 1fr; padding: 13px; }
  .hero-partner-benefit > b { width: 48px; height: 48px; }
  .hero-console { padding: 8px; border-radius: 22px; }
  .hero-console-head { min-height: 42px; font-size: 9px; }
  .hero-console-body { grid-template-columns: 1fr; }
  .hero-flow { grid-template-columns: repeat(3, 1fr); grid-template-rows: auto; }
  .hero-flow > div { min-height: 82px; padding: 12px 9px; }
  .hero-flow strong { font-size: 12px; }
  .hero-flow small { font-size: 8px; }
  .hero-platform-network { margin-top: 11px; padding: 12px; border-radius: 19px; }
  .hero-platform-network-head { gap: 4px 10px; padding: 1px 3px 8px; }
  .hero-platform-network-head strong { font-size: 15px; }
  .hero-platform-network-head small { font-size: 9px; }
  .platform-hint-desktop { display: none; }
  .platform-hint-mobile { display: inline; }
  .hero-platform-logo-shell { padding: 0; }
  .hero-platform-logo-arrow { display: none; }
  .hero-quick-proof { grid-template-columns: 1fr 1fr; margin: 0; border: 1px solid rgba(72, 116, 187, .12); border-radius: 17px; }
  .hero-quick-proof > div { display: grid; padding: 15px; }
  .hero-quick-proof > div:nth-child(2) { border-right: 0; }
  .hero-quick-proof > div:nth-child(3),
  .hero-quick-proof .proof-message { border-top: 1px solid rgba(72, 116, 187, .12); }
  .hero-quick-proof .proof-message { grid-column: 2; }
  .hero-quick-proof .proof-message strong { font-size: 13px; }
  .features-section { padding: 82px 14px; }
  .section-intro { padding: 0 6px; gap: 25px; }
  .section-intro h2 { font-size: 38px; }
  .section-intro-note { padding: 20px; }
  .feature-grid { grid-template-columns: 1fr; margin-top: 32px; }
  .feature-card,
  .feature-card.feature-wide,
  .feature-card[data-feature] { grid-column: auto; min-height: 320px; padding: 25px 22px 21px; border-radius: 22px; }
  .feature-card[data-feature="delivery"],
  .feature-card[data-feature="postpaid"] { min-height: 350px; }
  .feature-card > p { font-size: 15px; }
  .b2b-dialog {
    width: calc(100vw - 14px);
    max-height: calc(100dvh - 14px);
    border-radius: 23px;
  }
  .b2b-dialog-panel { padding: 31px 16px 20px; border-radius: 23px; }
  .b2b-dialog h2 { margin-right: 34px; font-size: 30px; }
  .b2b-dialog .feature-dialog-description { font-size: 15px; }
  .b2b-dialog-section { margin-top: 20px; padding: 18px 14px; border-radius: 18px; }
  .b2b-dialog-section-head h3 { font-size: 21px; }
  .b2b-flow-list {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    overflow: visible;
    padding: 0;
  }
  .b2b-dialog .b2b-flow-list li {
    min-height: 106px;
    padding: 18px 14px 16px 58px;
  }
  .b2b-dialog .b2b-flow-list li:not(:last-child)::after {
    content: "↓";
    top: auto;
    right: auto;
    bottom: -14px;
    left: 25px;
    font-size: 17px;
    transform: none;
  }
  .b2b-flow-number { top: 17px; left: 14px; }
  .b2b-flow-list li > b { margin-bottom: 16px; }
  .b2b-operation-points,
  .b2b-benefit-grid { grid-template-columns: 1fr; }
  .b2b-benefit-grid article { min-height: auto; }
  .audience-band { grid-template-columns: 64px 1fr; padding: 21px 18px; }
  .audience-band::before { width: 64px; height: 64px; border-radius: 17px; font-size: 21px; }
  .audience-button { grid-column: 1 / -1; }
  .calculator-section { padding: 82px 10px 72px; }
  .calculator-heading { gap: 20px; padding: 0 8px; }
  .calculator-heading h2 { font-size: 38px; }
  .calculator-heading > p:last-child { padding: 0; border-left: 0; }
  .delivery-calculator-workspace { margin-top: 31px; }
  .calculator-shell { grid-template-columns: 1fr; border-radius: 23px; }
  .calc-basis { min-height: auto; }
  .input-area { grid-template-columns: 1fr; }
  .amount-block { grid-column: auto; }
  .results { padding: 27px 14px 22px; border-radius: 23px; }
  .comparison-insights { grid-template-columns: 1fr; }
  .postpaid-calculator { margin-top: 70px; border-radius: 25px; }
  .postpaid-heading { padding: 32px 22px; }
  .postpaid-heading h3 { font-size: 32px; }
  .postpaid-layout { grid-template-columns: 1fr; padding: 18px 12px 13px; }
  .postpaid-period-picker { margin: 0 12px 13px; }
  .postpaid-note { margin: 0 14px 24px; }
  .utility-hub { margin-top: 62px; }
  .utility-hub .utility-panel:not([open]) { height: 250px; }
  .utility-hub .utility-summary { min-height: auto; padding: 26px 20px; }
  .utility-hub .utility-panel:not([open]) .utility-summary { height: 100%; min-height: 0; }
  .contact-zone { padding: 72px 10px; }
  .contact-section { gap: 30px; padding: 34px 18px; border-radius: 27px; }
  .contact-copy h2 { font-size: 38px; }
}

@media (max-width: 390px) {
  .hero h1 { font-size: clamp(28px, 8.8vw, 36px); }
  .hero-flow { grid-template-columns: 1fr; }
  .hero-quick-proof { grid-template-columns: 1fr; }
  .hero-quick-proof > div,
  .hero-quick-proof > div:nth-child(2),
  .hero-quick-proof .proof-message { grid-column: 1; border-right: 0; border-top: 1px solid rgba(72, 116, 187, .12); }
  .hero-quick-proof > div:first-child { border-top: 0; }
  .section-intro h2,
  .calculator-heading h2 { font-size: 34px; }
}

@media (prefers-reduced-motion: no-preference) {
  .campaign-card { animation: none; }
  .hero-console { animation: console-float 7s ease-in-out infinite; }
  .hero-flow > div:nth-child(2) { animation: flow-breathe 4.5s ease-in-out infinite; }
}

@keyframes console-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

@keyframes flow-breathe {
  0%, 100% { box-shadow: 0 10px 25px rgba(50, 81, 139, .08); }
  50% { box-shadow: 0 13px 32px rgba(114, 95, 247, .2); }
}
