:root{--blue:#246bd1;--blue-dark:#1d5fc6;--ink:#172033;--muted:#526071;--pale:#edf4fd;--line:#d8e0eb;--paper:#fff;--radius:18px;color-scheme:light;font-family:"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;line-height:1.65;word-break:keep-all;overflow-wrap:break-word}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a,summary{-webkit-tap-highlight-color:transparent}button{color:inherit}img{display:block;max-width:100%;height:auto}h1,h2,h3,h4,p,figure{margin:0}h1,h2,h3{font-weight:600;letter-spacing:-.055em}h1,h2{line-height:1.2}h3{line-height:1.45}p{color:var(--muted)}[hidden]{display:none!important}:focus-visible{outline:3px solid var(--blue-dark);outline-offset:5px}section[id]{scroll-margin-top:20px}.page-width{width:min(1280px,calc(100% - 112px));margin-inline:auto}.section{padding-block:116px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:.11em;color:var(--blue-dark);margin-bottom:26px}h2{font-size:clamp(32px,3.5vw,52px)}.skip-link{position:fixed;top:10px;left:10px;z-index:10;transform:translateY(-180%);background:#fff;padding:10px 18px;border:2px solid var(--blue)}.skip-link:focus{transform:none}.site-header{background:#fff;border-bottom:1px solid #edf0f4;position:sticky;top:0;z-index:5}.nav-shell{min-height:88px;width:min(1280px,calc(100% - 112px));margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{display:inline-flex;align-items:center;flex:none;min-height:44px}.brand-text{font:600 26px/1.2 system-ui,sans-serif;letter-spacing:-.035em;color:var(--blue-dark)}.brand img{width:min(190px,var(--logo-natural-width,190px));height:auto;object-fit:contain;max-width:100%;background:none;box-shadow:none;filter:none}.site-header nav{display:flex;align-items:center;gap:30px;font-size:14px}.site-header nav>a:not(.button){display:flex;align-items:center;min-height:44px}.site-header nav>a:hover,.text-link:hover{color:var(--blue-dark)}.button{display:inline-flex;align-items:center;justify-content:center;gap:26px;min-height:56px;padding:14px 26px;background:var(--blue);color:#fff;border:1px solid var(--blue);border-radius:6px;font-size:15px;font-weight:600;text-align:center;transition:background .15s ease}.button:hover{background:var(--blue-dark);color:#fff}.button-small{min-height:44px;padding:10px 18px;gap:22px;font-size:14px}.text-link{display:inline-flex;align-items:center;gap:15px;min-height:44px;font-size:14px;font-weight:600;text-underline-offset:5px}.text-link:hover{text-decoration:underline}.menu-toggle{display:none;background:transparent;border:1px solid var(--line);border-radius:6px;min-width:72px;min-height:44px;align-items:center;justify-content:center;gap:10px;font-size:14px}.menu-icon{width:16px;height:10px;border-top:1px solid;border-bottom:1px solid}.hero{padding-top:64px}.hero-heading{display:grid;grid-template-columns:1.05fr 1fr;column-gap:70px;align-items:end;margin-bottom:44px}.hero-heading .eyebrow{grid-column:1/-1;margin-bottom:20px;letter-spacing:.025em;font-size:14px}.hero h1{font-size:clamp(48px,5.1vw,76px);line-height:1.17}.hero h1 span{color:var(--blue-dark)}.hero-intro{padding-bottom:6px}.hero-intro>p{font-size:18px;line-height:1.8}.hero-actions{display:flex;align-items:center;gap:25px;flex-wrap:wrap;margin-top:25px}.hero-media{position:relative;overflow:hidden;border-radius:var(--radius);background:#e6eff5;aspect-ratio:1440/760}.hero-media>img,.hero-media>video{width:100%;height:100%;object-fit:cover;object-position:center}.hero-media figcaption{position:absolute;inset:auto 28px 26px;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:17px;color:#243b51}.media-note{font-size:11px;background:#eef5f9;padding:5px 10px;border-radius:4px}.hero-footnote{text-align:center;font-size:12px;margin-top:21px;color:#596778}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:60px}.section-heading>p{max-width:450px;flex:1;font-size:17px;line-height:1.9}.section-heading h2{flex:1}.service-intro{padding-bottom:108px}.demo-section{background:var(--pale)}.demo-section .section-heading{margin-bottom:64px}.demo-section .section-heading>p{max-width:400px}.demo-layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:76px;align-items:center}.demo-steps{display:flex;flex-direction:column;gap:8px}.demo-step{width:100%;display:flex;text-align:left;align-items:flex-start;gap:20px;padding:26px 8px;border:0;border-bottom:1px solid #cbd8e9;background:transparent}.step-number{font-size:12px;font-weight:700;color:#4f6480;padding-top:7px}.demo-step strong{display:block;font-size:23px;font-weight:600;letter-spacing:-.035em}.demo-step span span{display:block;font-size:14px;color:var(--muted);margin-top:8px}.step-arrow{margin-left:auto;font-size:21px}.demo-step.is-active strong,.demo-step.is-active .step-number,.demo-step.is-active .step-arrow{color:var(--blue-dark)}.demo-step.is-active{border-bottom-color:var(--blue-dark)}.demo-window{min-width:0;background:#fff;border:1px solid #cbd8e9;border-radius:12px;overflow:hidden}.window-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 26px;background:#f7f9fc;border-bottom:1px solid var(--line);font-size:12px;font-weight:600}.example-label{color:#365d89;padding:2px 7px;background:#e8f2ff;border-radius:3px;white-space:nowrap}.demo-panel{padding:29px 32px;min-height:500px}.panel-kicker{font-size:12px;color:var(--blue-dark);margin-bottom:9px}.demo-panel h3{font-size:26px;margin-bottom:24px}.demo-field{border:1px solid var(--line);border-radius:5px;padding:11px 14px;margin-bottom:14px}.field-label{display:block;color:#344154;font-size:12px;font-weight:700;margin-bottom:7px}.demo-field p{font-size:14px;line-height:1.8}.demo-next{margin-top:7px;min-height:48px;font-size:14px}.review-content{background:#f6f9fd;border-radius:6px;padding:20px}.review-content h4,.patient-guide h4{font-size:15px;font-weight:600;margin-bottom:8px}.review-content p,.patient-guide p{font-size:14px;line-height:1.9}.review-content h4:not(:first-of-type),.patient-guide h4:not(:first-of-type){margin-top:22px}.review-note{font-size:12px;line-height:1.9;margin-block:20px}.patient-guide{display:flex;gap:20px;padding-top:6px}.guide-line{width:3px;border-radius:4px;background:#bcd3f4;flex:none}.replay{border:0;padding:0;background:transparent;color:var(--blue-dark)}.demo-caption{font-size:12px;text-align:right;margin-top:20px}.benefits>h2{margin-bottom:65px}.benefit-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:45px}.benefit-grid article{border-top:1px solid #bac9dd;padding-top:22px}.benefit-number{font-size:12px;color:var(--blue-dark);display:block;margin-bottom:28px}.benefit-grid h3{font-size:29px;margin-bottom:23px}.benefit-grid p{font-size:15px;line-height:1.9;max-width:320px}.start-section{background:#edf4fd;padding-block:94px}.start-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:80px;align-items:center}.start-layout h2{font-size:clamp(32px,3.2vw,47px);margin-bottom:26px}.start-layout>div>p:not(.eyebrow){max-width:460px;font-size:16px;line-height:1.9;margin-bottom:24px}.start-guide article{display:flex;gap:23px;padding-block:22px;border-bottom:1px solid #cedaeb}.start-guide article>span{font-size:12px;color:var(--blue-dark);padding-top:4px}.start-guide h3{font-size:19px;margin-bottom:5px}.start-guide article p{font-size:14px}.installation-note{font-size:12px;margin-top:21px}.faq-section{display:grid;grid-template-columns:.7fr 1.3fr;gap:90px}.faq-section h2{margin-bottom:25px}.faq-list details{border-bottom:1px solid var(--line)}.faq-list details:first-child{border-top:1px solid var(--line)}.faq-list summary{display:flex;justify-content:space-between;align-items:center;gap:24px;cursor:pointer;list-style:none;min-height:78px;padding:21px 4px;font-size:17px;font-weight:500}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary span{font:300 26px/1 system-ui;flex:none}.faq-list details[open] summary span{transform:rotate(45deg)}.faq-list details[open] summary{color:var(--blue-dark)}.faq-list details p{padding:0 40px 26px 4px;font-size:15px;line-height:1.9}.contact-section{border-radius:var(--radius);background:#eef4fa;padding:56px 60px;display:flex;align-items:center;justify-content:space-between;gap:40px;margin-bottom:96px}.contact-section .eyebrow{margin-bottom:17px}.contact-section h2{font-size:clamp(28px,3vw,42px);margin-bottom:18px}.contact-section p{font-size:16px;line-height:1.8}.contact-guidance{font-size:14px!important}.site-footer{padding-bottom:30px}.footer-top{display:flex;align-items:center;gap:40px;padding-bottom:35px}.footer-top p{font-size:14px}.footer-top>a:last-child{margin-left:auto}.footer-bottom{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;padding-top:22px;color:#596778;font-size:12px}
@media(min-width:1600px){.hero h1{font-size:76px}}
@media(max-width:1100px){.page-width,.nav-shell{width:calc(100% - 64px)}.site-header nav{gap:22px}.hero-heading{gap:32px}.hero h1{font-size:60px}.hero-intro>p{font-size:16px}.hero-actions{gap:12px}.hero-actions .text-link{font-size:13px}.demo-layout{gap:40px;grid-template-columns:.85fr 1.15fr}.section-heading{gap:40px}.benefit-grid{gap:30px}.benefit-grid h3{font-size:25px}.start-layout{gap:45px}.faq-section{gap:45px}}
@media(max-width:800px){html{scroll-padding-top:85px}.page-width,.nav-shell{width:calc(100% - 48px)}.nav-shell{min-height:76px;flex-wrap:wrap;gap:0;padding-block:12px}.brand-text{font-size:24px}.brand img{width:min(158px,var(--logo-natural-width,158px))}.menu-toggle:not([hidden]){display:flex}.site-header nav{width:100%;flex-wrap:wrap;justify-content:flex-start;gap:8px 24px;padding-block:12px 2px}.site-header nav .button{margin-left:auto}.site-header nav.is-collapsed{display:none}.section{padding-block:82px}.hero{padding-top:42px}.hero-heading{grid-template-columns:1fr;gap:0;margin-bottom:30px}.hero-heading .eyebrow{margin-bottom:17px}.hero h1{font-size:clamp(44px,7.4vw,66px)}.hero-intro{margin-top:25px}.hero-intro>p{font-size:17px}.hero-actions{gap:24px;margin-top:20px}.hero-media{aspect-ratio:5/3}.hero-media figcaption{inset:auto 20px 19px;font-size:14px}.hero-footnote{font-size:11px;max-width:500px;margin-inline:auto}.section-heading{flex-direction:column;align-items:flex-start;gap:24px}.section-heading>p{max-width:570px;font-size:16px}.demo-section .section-heading{margin-bottom:36px}.demo-layout{grid-template-columns:1fr;gap:26px}.demo-steps{flex-direction:row;gap:15px}.demo-step{flex:1;gap:8px;padding:15px 0;align-items:center}.demo-step strong{font-size:16px}.demo-step span span,.step-arrow{display:none}.step-number{padding:0;font-size:11px}.demo-panel{min-height:460px;padding:28px}.demo-caption{text-align:left}.benefits>h2{margin-bottom:44px}.benefit-grid{gap:24px}.benefit-grid h3{font-size:22px}.benefit-grid p{font-size:14px}.start-section{padding-block:75px}.start-layout{grid-template-columns:1fr;gap:24px}.start-guide{max-width:590px}.faq-section{grid-template-columns:1fr;gap:30px}.faq-section h2 br{display:none}.faq-list summary{font-size:16px}.contact-section{padding:40px 32px;margin-bottom:70px}.contact-section p{font-size:14px}.footer-top{gap:20px;flex-wrap:wrap}.footer-top p{font-size:12px}}
@media(max-width:520px){.page-width,.nav-shell{width:calc(100% - 36px)}.nav-shell{min-height:70px}.brand{min-height:44px}.brand img{width:min(140px,var(--logo-natural-width,140px))}.brand-text{font-size:23px}.site-header nav{gap:8px 20px}.site-header nav>a:not(.button){font-size:13px}.site-header nav .button{margin-left:0}.hero{padding-top:34px}.hero h1{font-size:clamp(40px,10.9vw,55px);letter-spacing:-.065em}.hero-heading .eyebrow{font-size:12px}.hero-intro>p{font-size:15px}.hero-actions{gap:9px 18px;align-items:flex-start;flex-direction:column}.hero-actions .button{min-height:52px;padding:13px 22px}.hero-actions .text-link{min-height:44px}.hero-media{aspect-ratio:5/4;border-radius:12px}.hero-media>img{object-position:50% 50%}.hero-media figcaption{inset:auto 17px 17px;display:block;font-size:12px}.hero-media .media-note{display:inline-block;margin-top:8px;font-size:10px}.hero-footnote{font-size:11px;line-height:1.8;padding-inline:4px}.section{padding-block:68px}.eyebrow{font-size:10px;margin-bottom:19px}h2{font-size:32px;line-height:1.28}.section-heading>p{font-size:15px}.demo-layout{gap:20px}.demo-steps{gap:12px}.demo-step{display:block;padding:12px 0}.step-number{display:block;margin-bottom:8px}.demo-step strong{font-size:14px;letter-spacing:-.035em}.window-bar{padding:14px 17px;font-size:11px}.demo-panel{padding:23px 18px;min-height:520px}.demo-panel h3{font-size:23px}.demo-field{padding:10px 12px}.demo-field p,.review-content p,.patient-guide p{font-size:13px}.demo-next{padding:12px 17px;font-size:13px;gap:15px}.review-content{padding:17px}.demo-caption{font-size:11px}.patient-guide{gap:13px}.benefit-grid{grid-template-columns:1fr;gap:34px}.benefits>h2{margin-bottom:35px}.benefit-grid article{padding-top:18px}.benefit-number{margin-bottom:18px}.benefit-grid h3{font-size:27px;margin-bottom:16px}.benefit-grid h3 br{display:none}.benefit-grid p{max-width:none;font-size:15px}.start-section{padding-block:62px}.start-layout h2{font-size:32px}.start-layout>div>p:not(.eyebrow){font-size:15px}.start-guide h3{font-size:18px}.start-guide article p{font-size:13px}.faq-list summary{font-size:15px;min-height:76px;padding-block:20px;gap:18px}.faq-list details p{font-size:14px;padding-right:12px}.contact-section{padding:35px 24px;flex-direction:column;align-items:flex-start;gap:25px;border-radius:12px;margin-bottom:58px}.contact-section h2{font-size:29px}.contact-section .eyebrow{font-size:10px}.contact-section .button{min-height:52px}.footer-top{gap:15px;padding-bottom:27px}.footer-top p{width:100%;order:3}.footer-top>a:last-child{font-size:12px}.footer-bottom{font-size:11px;flex-direction:column;gap:9px}.desktop-break{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* Second preview: clear Korean type hierarchy and an input → generation → review demo. */
:root {
  --type-hero: clamp(48px, 4.6vw, 66px);
  --type-section: clamp(34px, 3.2vw, 46px);
  --type-step: 22px;
  --type-body: 17px;
  --type-note: 13px;
}
.hero h1 { font-size: var(--type-hero); line-height: 1.18; letter-spacing: -.045em; }
h2, .start-layout h2, .contact-section h2 { font-size: var(--type-section); line-height: 1.28; letter-spacing: -.045em; }
.hero-intro > p { font-size: 18px; line-height: 1.8; }
.section-copy { flex: 1; max-width: 450px; }
.section-copy p + p { margin-top: 14px; }
.section-heading > p, .section-copy p, .start-layout > div > p:not(.eyebrow), .contact-section p {
  font-size: var(--type-body); line-height: 1.85; max-width: 32em;
}
.benefit-grid p, .start-guide article p, .faq-list details p { font-size: 16px; line-height: 1.85; }
.benefit-grid h3 { font-size: 28px; line-height: 1.4; font-weight: 600; }
.start-guide h3 { font-size: 20px; font-weight: 600; }
.faq-list details p + p { padding-top: 0; margin-top: -12px; }
.eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .09em; }
.hero-footnote, .review-note, .installation-note, .demo-caption, .panel-kicker, .field-label, .benefit-number, .footer-bottom {
  font-size: var(--type-note); line-height: 1.75;
}
.demo-layout { align-items: start; gap: 64px; }
.demo-explanation { padding-top: 48px; min-width: 0; }
.demo-step { position: relative; min-height: 118px; padding: 24px 4px; }
.demo-step strong { font-size: var(--type-step); line-height: 1.45; letter-spacing: -.035em; }
.demo-step span span { font-size: 16px; line-height: 1.8; max-width: 24em; margin-top: 9px; }
.step-number { font-size: 13px; padding-top: 6px; }
.demo-current-description { display: none; }
.demo-panel { padding: 30px 32px; min-height: 608px; animation: demo-appear .28s ease-out; }
.demo-panel h3 { font-size: 26px; line-height: 1.4; margin-bottom: 23px; }
.demo-field { padding: 12px 15px; margin-bottom: 16px; }
.demo-field p, .generation-part p, .review-content p { font-size: 16px; line-height: 1.8; }
.generation-content { padding: 20px; border-left: 3px solid #bcd3f4; background: #f6f9fd; border-radius: 0 6px 6px 0; }
.generation-part + .generation-part { margin-top: 20px; }
.generation-part h4, .review-content h4 { font-size: 17px; font-weight: 600; margin-bottom: 7px; line-height: 1.5; }
.review-content h4:not(:first-of-type) { margin-top: 20px; }
.demo-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.demo-control { min-height: 44px; padding: 9px 16px; border: 1px solid #bac9dd; border-radius: 5px; background: transparent; font-size: 14px; font-weight: 600; }
.demo-control:hover:not(:disabled) { border-color: var(--blue-dark); color: var(--blue-dark); }
.demo-control:disabled { cursor: default; color: var(--muted); }
#demo-play-state { color: var(--muted); font-size: var(--type-note); }
.demo-caption { text-align: left; margin-top: 12px; }
.motion-note { font-size: var(--type-note); margin-top: 12px; max-width: 40em; }
[data-playing="true"] .demo-step.is-active::after { content: ""; position: absolute; inset: auto 0 -1px; height: 2px; background: var(--blue-dark); transform-origin: left; animation: demo-progress var(--step-duration) linear; }
[data-playing="true"] #demo-generation .generation-part { animation: demo-appear .5s ease-out both; }
[data-playing="true"] #demo-generation .generation-part:nth-child(2) { animation-delay: .25s; }
[data-playing="true"] #demo-generation .generation-part:nth-child(3) { animation-delay: .5s; }
@keyframes demo-appear { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@keyframes demo-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (max-width: 1100px) {
  .demo-layout { gap: 36px; }
  .demo-step strong { font-size: 21px; }
  .demo-step span span { font-size: 15px; }
}
@media (max-width: 800px) {
  :root { --type-hero: clamp(44px, 6.6vw, 56px); --type-section: 36px; --type-body: 16px; }
  .demo-layout { gap: 24px; }
  .demo-explanation { padding-top: 0; }
  .demo-step { min-height: 92px; padding-block: 16px; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 0; }
  .step-number { display: block; padding: 0; margin-bottom: 9px; }
  .demo-step strong { font-size: 18px; line-height: 1.5; }
  .demo-current-description { display: block; font-size: 16px; line-height: 1.8; margin-top: 18px; }
  .demo-panel { padding: 28px; }
  .benefit-grid h3 { font-size: 23px; }
  .hero-intro > p { font-size: 17px; }
}
@media (max-width: 520px) {
  :root { --type-hero: clamp(40px, 10.6vw, 46px); --type-section: 30px; --type-body: 16px; --type-note: 12px; }
  .hero h1 { letter-spacing: -.045em; }
  .hero-intro > p { font-size: 16px; line-height: 1.8; }
  .section-heading { gap: 22px; }
  .section-copy { max-width: 100%; }
  .demo-steps { gap: 14px; }
  .demo-step { min-height: 100px; padding-block: 13px; }
  .demo-step strong { font-size: 16px; }
  .step-number { font-size: 12px; }
  .demo-current-description { font-size: 15px; }
  .demo-panel { padding: 24px 19px; min-height: 646px; }
  .demo-panel h3 { font-size: 22px; line-height: 1.45; margin-bottom: 22px; }
  .demo-field p, .generation-part p, .review-content p { font-size: 15px; line-height: 1.85; }
  .demo-field { padding: 11px 12px; }
  .generation-content, .review-content { padding: 17px 15px; }
  .generation-part h4, .review-content h4 { font-size: 16px; }
  .demo-next { font-size: 14px; min-height: 48px; }
  .demo-controls { gap: 10px; margin-top: 22px; }
  #demo-play-state { margin-left: 2px; }
  .benefit-grid h3 { font-size: 25px; }
  .benefit-grid p, .start-guide article p, .faq-list details p { font-size: 16px; }
  .start-guide h3 { font-size: 19px; }
  .faq-list summary { font-size: 16px; line-height: 1.65; }
  .eyebrow, .hero-heading .eyebrow, .contact-section .eyebrow { font-size: 12px; }
  .hero-footnote { padding-inline: 0; }
  .footer-top p { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .demo-panel, .generation-part, .demo-step::after { animation: none !important; transform: none; opacity: 1; }
}

/* Shared content edges; full-width backgrounds stay outside this container. */
.page-width { width: 100%; max-width: 1320px; padding-inline: 60px; margin-inline: auto; }
.section { padding-block: 60px 100px; }
.service-intro { padding-block: 72px 84px; }
.service-intro .section-heading { margin-bottom: 0; }
.demo-section .section { padding-block: 64px 88px; }
.benefits { padding-block: 64px 92px; }
.benefits .page-width > h2 { margin-bottom: 44px; }
.start-section { padding-block: 64px 88px; }
.faq-section-wrapper { padding-block: 64px 88px; }
.section-copy { max-width: 32em; }
.section-heading > p, .section-copy p, .start-layout > div > p:not(.eyebrow) { max-width: 32em; }
.contact-section { display: block; padding: 0; margin-bottom: 0; border-radius: 0; }
.contact-layout { display: flex; align-items: center; justify-content: space-between; gap: 40px; padding-block: 56px 64px; }
.site-footer { padding-block: 44px 28px; }

/* The film and copy form one scene directly below the white header. */
.hero { position: relative; isolation: isolate; display: flex; align-items: flex-end; aspect-ratio: 16 / 9; padding: 0; margin: 0; overflow: hidden; background: #14253b; }
.hero .hero-media { position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; margin: 0; border: 0; border-radius: 0; background: transparent; }
.hero-media > img, .hero-media > video { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero::after { content: ""; position: absolute; z-index: 1; inset: 50% 0 0; pointer-events: none; background: linear-gradient(transparent, rgba(20, 37, 59, .32) 38%, rgba(20, 37, 59, .86)); }
.hero-copy { position: relative; z-index: 2; width: 100%; padding: 0 60px clamp(42px, 4.5vw, 72px); text-align: center; color: #f9fafc; }
.hero h1 { max-width: 1100px; margin-inline: auto; color: inherit; font-size: clamp(40px, 4vw, 58px); font-weight: 500; letter-spacing: -.045em; line-height: 1.22; }
.hero h1 span { color: inherit; white-space: nowrap; }
.hero .hero-connection { color: inherit; font-size: clamp(26px, 2.3vw, 34px); font-weight: 400; line-height: 1.5; letter-spacing: -.03em; margin-top: 18px; }
.hero .hero-signature { color: inherit; font-size: clamp(20px, 1.7vw, 24px); font-weight: 500; line-height: 1.5; letter-spacing: .04em; margin-top: 22px; }
@media (max-width: 991px) {
  .section-heading { flex-direction: column; align-items: flex-start; gap: 28px; }
  .demo-layout, .start-layout, .faq-section { grid-template-columns: 1fr; gap: 32px; }
  .demo-explanation { padding-top: 0; }
  .demo-steps { flex-direction: row; gap: 20px; }
  .demo-step { flex: 1; min-height: 0; padding-block: 18px; }
  .demo-step strong { font-size: 18px; }
  .demo-step span span, .step-arrow { display: none; }
  .benefit-grid { grid-template-columns: 1fr; gap: 36px; }
  .benefit-grid h3 br, .faq-section h2 br { display: initial; }
  .benefit-grid p { max-width: 32em; }
  .hero { display: block; aspect-ratio: auto; }
  .hero .hero-media { height: auto; aspect-ratio: 16 / 9; bottom: auto; }
  .hero-copy { padding: calc(56.25vw - 10px) 60px 44px; }
  .hero::after { top: calc(56.25vw - 64px); background: linear-gradient(transparent, #14253b 64px); }
  .hero h1 { font-size: clamp(32px, 4.6vw, 42px); }
  .hero .hero-connection { font-size: 26px; }
  .hero .hero-signature { font-size: 20px; }
}
@media (max-width: 767px) {
  .page-width { padding-inline: 24px; }
  .section, .service-intro, .demo-section .section, .benefits, .start-section, .faq-section-wrapper { padding-block: 56px 64px; }
  .section-heading { gap: 24px; }
  .benefits .page-width > h2 { margin-bottom: 32px; }
  .demo-step strong { font-size: 16px; }
  .contact-layout { padding-block: 48px 56px; flex-direction: column; align-items: flex-start; gap: 28px; }
  .hero-copy { padding: calc(56.25vw - 6px) 24px 38px; }
  .hero h1 { font-size: clamp(30px, 8.2vw, 40px); line-height: 1.28; letter-spacing: -.04em; }
  .hero h1 span { display: block; }
  .hero .hero-connection { font-size: 22px; line-height: 1.5; margin-top: 16px; }
  .hero .hero-signature { font-size: 18px; margin-top: 20px; }
}
