:root{font-family:Inter,Arial,sans-serif;--blue:#1353dd}
/* Original 1440 × 880 composition, with independently anchored decorative edges. */
.hero-surface{--art-width:clamp(1200px,100vw,1600px);height:880px;background:#e8eefc}
.hero-surface:after{width:120%;left:-10%;height:100px;bottom:-63px;border-radius:50% 50% 0 0/70% 70% 0 0}
.hero-surface .site-header{height:96px;width:80.5556%;max-width:1680px}
.hero-surface .brand img{width:96px;height:29px}
.hero-surface .header-actions{gap:12px}
.hero-surface .header-actions .button{font-family:inherit;font-size:16px;line-height:20px;min-height:48px;padding:14px 24px;border-radius:5px;font-weight:500}
.hero-surface .header-actions .login{padding-inline:22px}
.hero-surface .hero-copy{padding-top:12px}
.hero-surface .breadcrumb{font-size:14px;line-height:20px;margin:0 0 24px;gap:10px}
.hero-surface h1{font-size:44px;line-height:1.05;font-weight:600;letter-spacing:-1.1px;margin:0 0 24px}
.hero-surface .title-second{gap:8px;align-items:center;color:#242424}
.toggle-image{display:inline-block;flex:none;width:70px;height:42px;object-fit:contain}
.hero-surface .hero-description{font-size:18px;line-height:22px;letter-spacing:-.15px;color:#52545e;max-width:620px}
.hero-surface .hero-description strong{font-weight:500}
.hero-surface .hero-actions{margin-top:30px;gap:12px}
.hero-surface .hero-actions .button{min-height:48px;padding:13px 24px;font-size:16px;line-height:22px;letter-spacing:-.15px;font-weight:500}
.hero-surface .cta-caption{position:absolute;bottom:-27px;left:0;right:0;margin:0;font-size:11px;line-height:16px;color:#838b9b}
.hero-surface .hero-decoration{position:absolute;width:var(--art-width);height:calc(var(--art-width)*980/1604);bottom:0;top:auto;opacity:1;clip-path:none;background-color:transparent;background-image:url('./assets/hero-background.png');background-size:100% 100%;background-position:0 0;background-repeat:no-repeat;mask-composite:intersect}
.hero-surface .decoration-left{left:0;right:auto;mask-image:linear-gradient(to right,#000 28%,transparent 50%),linear-gradient(to bottom,transparent,#000 18%)}
.hero-surface .decoration-right{left:auto;right:0;mask-image:linear-gradient(to left,#000 28%,transparent 50%),linear-gradient(to bottom,transparent,#000 18%)}
.hero-surface .document-stage{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:min(75%,1280px);max-width:none;height:445px;min-height:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:start}
.hero-surface .document-card{padding:20px;margin-top:108px;min-height:335px;border-radius:12px 12px 0 0;box-shadow:none;opacity:1}
.hero-surface .main-document{margin-top:0;min-height:445px;padding-bottom:35px}
.hero-surface .doc-tag{display:flex;align-items:center;gap:9px;padding:10px 14px;font-size:14px;line-height:20px;margin-bottom:17px}
.hero-surface .document-card h2{font-family:inherit;font-size:20px;line-height:25px;font-weight:600;letter-spacing:-.35px;margin:0 0 8px}
.hero-surface .document-card p{font-size:15px;line-height:20px;letter-spacing:-.1px;color:#666872}
.hero-surface .doc-checks{font-size:14px;line-height:20px;margin:14px 0 0}
.hero-surface .doc-checks li{margin:8px 0;gap:9px}
.hero-surface .doc-checks li:before{content:'';width:18px;height:18px;background:#eef4ff url('./assets/slidy-check.svg') center/12px 12px no-repeat}
.hero-surface .paper-heading{text-align:left;padding:0 0 17px}
.hero-surface .paper-heading p{font-size:15px;line-height:20px}
.hero-surface .paper-contents{border:1px solid #e4eeeb;background:linear-gradient(135deg,#f2fbf8,#eff8f4);padding:14px 16px 8px;border-radius:5px}
.hero-surface .paper-contents h3{font-size:11px;line-height:16px;font-weight:500;color:#59726b;margin:0 0 12px}
.hero-surface .paper-contents>div{font-size:11px;line-height:16px;color:#63766f;margin:9px 0}
.hero-surface .main-document .sample-caption{font-size:11px;line-height:16px;color:#999;text-align:center;margin:10px 0 0}
.hero-surface .doc-action{display:none}
.hero-surface .main-document .doc-action{margin-top:14px}
.hero-surface .price{font-size:44px;line-height:48px;font-weight:600;margin-top:10px;letter-spacing:-1.5px;color:#ed4f81}
.hero-surface .document-card .price-caption{font-size:13px;line-height:18px;margin-top:2px}
.hero-surface .material-card .doc-action{margin-top:26px}
.doc-facts{margin:15px 0 0;font-size:13px;line-height:22px;color:#666872}
.doc-facts>div{display:flex;align-items:center;justify-content:space-between;gap:12px}
.doc-facts dt,.doc-facts dd{margin:0}.doc-facts dd{font-weight:500;color:#292a30}
@media(max-width:540px){.hero-surface .topic-card,.hero-surface .material-card{visibility:hidden}.hero-surface .floating-label,.hero-surface .editor-toolbar{display:none}}
.hero-surface .floating-label{font-size:13px;line-height:18px;padding:11px 15px}
.hero-surface .green-label{left:13.5%;top:55px;transform:none}
.hero-surface .pink-label{right:-16px;top:267px;transform:none}
.editor-toolbar{position:absolute;left:calc(66.6667% + 7px);top:56px;height:40px;padding:9px 14px;display:flex;align-items:center;gap:17px;background:white;border-radius:5px;font-family:Georgia,serif;font-size:15px;line-height:20px;color:#202124}
.editor-toolbar b{color:var(--blue)}
@media(min-width:1800px){.hero-surface .document-stage{width:1280px}}
@media(min-width:761px) and (max-width:1199px){.hero-surface{height:850px}.hero-surface .document-stage{width:84%;height:416px}.hero-surface .document-card{padding:16px;min-height:308px}.hero-surface .main-document{min-height:416px}.hero-surface .document-card h2{font-size:17px;line-height:23px}.hero-surface .document-card p{font-size:13px;line-height:18px}.hero-surface .doc-tag{font-size:12px;padding:9px 10px}.hero-surface .doc-checks{font-size:12px;line-height:18px}.hero-surface .paper-contents{padding:12px}.hero-surface .paper-contents>div{font-size:10px;margin:11px 0}.hero-surface .paper-contents h3{font-size:11px;margin-bottom:12px}.hero-surface .floating-label{font-size:11px;padding:9px 12px}.hero-surface .pink-label{top:218px;right:-25px}.editor-toolbar{gap:12px;font-size:13px;height:36px}.hero-surface .doc-action{font-size:11px}.hero-surface .sample-caption{font-size:10px}}
@media(max-width:760px){.hero-surface{--art-width:1000px;height:805px}.hero-surface .site-header{width:calc(100% - 40px);height:80px}.hero-surface .brand img{width:88px;height:27px}.hero-surface .header-actions .button{font-size:12px;padding:10px 14px;min-height:40px;line-height:20px}.hero-surface .hero-copy{padding-top:14px}.hero-surface .breadcrumb{font-size:12px;line-height:18px;margin-bottom:23px}.hero-surface h1{font-size:40px;line-height:1.08;letter-spacing:-1px;margin-bottom:20px}.toggle-image{width:62px;height:37px}.hero-surface .hero-description{font-size:16px;line-height:22px;max-width:480px}.hero-surface .hero-actions{margin-top:25px;gap:10px}.hero-surface .hero-actions .button{font-size:13px;min-height:46px;padding:12px 17px}.hero-surface .cta-caption{bottom:-25px;font-size:10px}.hero-surface .document-stage{width:710px;height:380px;grid-template-columns:210px 270px 210px;gap:10px}.hero-surface .document-card{padding:15px;margin-top:83px;min-height:300px}.hero-surface .main-document{margin-top:0;min-height:380px}.hero-surface .document-card h2{font-size:16px;line-height:22px;letter-spacing:-.3px}.hero-surface .document-card p{font-size:12px;line-height:17px}.hero-surface .doc-tag{font-size:11px;line-height:18px;padding:8px 10px;margin-bottom:14px}.hero-surface .paper-heading{padding-bottom:14px}.hero-surface .paper-contents{padding:12px}.hero-surface .paper-contents h3{font-size:11px;margin-bottom:13px}.hero-surface .paper-contents>div{font-size:10px;line-height:14px;margin:10px 0}.hero-surface .sample-caption{font-size:9px;line-height:14px;margin-top:9px}.hero-surface .doc-action{font-size:10px;line-height:16px;margin-top:15px}.hero-surface .doc-checks{font-size:11px;line-height:18px}.hero-surface .floating-label{font-size:10px;padding:8px 10px;line-height:16px}.hero-surface .green-label{left:66px;top:37px}.hero-surface .pink-label{right:-4px;top:187px}.editor-toolbar{left:500px;top:39px;height:31px;font-size:12px;gap:11px;padding:7px 10px}.hero-surface .price{font-size:36px;line-height:42px}.hero-surface .document-card .price-caption{font-size:11px}.hero-surface:after{height:65px;bottom:-42px}}
@media(max-width:540px){.hero-surface{--art-width:800px;height:818px}.hero-surface .site-header{height:70px;width:calc(100% - 36px)}.hero-surface .brand img{width:83px;height:25px}.hero-surface .header-actions .login{min-height:40px;padding:10px 17px;font-size:13px}.hero-surface .hero-copy{padding-top:12px}.hero-surface .breadcrumb{font-size:11px;line-height:17px;margin-bottom:24px}.hero-surface h1{font-size:36px;line-height:1.09;letter-spacing:-.9px;margin-bottom:19px}.toggle-image{width:57px;height:35px}.hero-surface .hero-description{font-size:14px;line-height:20px;max-width:335px}.hero-surface .hero-actions{margin-top:23px;gap:8px;max-width:335px;flex-direction:column}.hero-surface .hero-actions .button{font-size:13px;min-height:46px;width:100%;padding:12px 14px}.hero-surface .hero-actions .button-white{min-height:42px;padding-block:10px}.hero-surface .cta-caption{bottom:-24px;font-size:10px}.hero-surface .document-stage{height:380px}.hero-surface .green-label{left:67px;top:40px}.hero-surface .decoration-left{left:-14px}.hero-surface .decoration-right{right:-14px}.hero-surface .topic-card,.hero-surface .material-card{opacity:1}.hero-surface .document-card:hover{transform:none}}