/* Moa's organizing story: a dark opening, tactile files, then a clear structure. */
body[data-page="landing"] {
  --forest: #183f32;
  --bright-lime: #d3ef8b;
  --hero-muted: #c5d5c6;
}
.masthead, .hero-shell { background: var(--forest); color: var(--paper); }
.masthead .site-header { height: 94px; border-color: #ffffff25; }
.masthead .brand { font-size: 35px; }
.masthead .brand img { background: var(--paper); border-radius: 9px; }
.masthead .brand-dot { color: var(--bright-lime); }
.masthead .nav-cta { border-color: #c5d5c66b; border-radius: 30px; padding-inline: 21px; }
.masthead .nav-cta:hover { background: var(--bright-lime); color: var(--forest); text-decoration: none; }
.hero-shell { overflow: clip; }
.hero-shell .hero {
  display: grid;
  grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr);
  grid-template-rows: auto 1fr;
  gap: 32px 54px;
  padding-block: 58px 68px;
  align-items: start;
}
.hero-copy { display: contents; }
.hero-intro { grid-column: 1; grid-row: 1; padding-top: 10px; }
.hero-shell .product-demo { grid-column: 2; grid-row: 1 / 3; align-self: center; }
.hero-shell .hero .eyebrow { color: var(--bright-lime); font-size: 11px; letter-spacing: 1.6px; margin-bottom: 26px; }
.hero-shell .status-dot { width: 7px; height: 7px; background: var(--bright-lime); box-shadow: none; }
.hero-shell h1, html[lang="ko"] .hero-shell h1 {
  font-size: clamp(62px,5.5vw,82px);
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -.06em;
}
.hero-shell h1 em, html[lang="ko"] .hero-shell h1 em {
  font-family: inherit; font-weight: inherit; font-style: normal; color: var(--bright-lime);
}
html[lang="ko"] .hero-shell h1 { font-size: clamp(54px,4.9vw,72px); line-height: 1.15; }
.hero-shell .hero-description { max-width: 460px; color: var(--hero-muted); font-size: 16px; line-height: 1.85; margin-top: 25px; }
.hero-shell .hero-assurances { margin-top: 22px; gap: 12px 22px; font-size: 12px; }
.hero-shell .hero-assurances a { text-decoration-color: #ffffff55; }
.hero-shell .hero-assurances a::before { color: var(--bright-lime); }
.hero-shell .download-section { grid-column: 1; grid-row: 2; margin-top: 0; width: 100%; max-width: 510px; scroll-margin-top: 35px; }
.hero-shell .download-label { font-size: 13px; font-weight: 650; line-height: 1.6; margin-bottom: 14px; }
.hero-shell .download-button { min-height: 60px; min-width: 270px; padding: 18px 25px; border-radius: 12px; background: var(--bright-lime); color: var(--forest); font-size: 16px; font-weight: 750; gap: 35px; }
.hero-shell .download-button:hover { background: #e0f6b1; }
.hero-shell .download-button svg { flex-shrink: 0; }
.hero-shell .download-meta { margin-top: 18px; color: var(--hero-muted); font-size: 12px; line-height: 1.7; }
.hero-shell .download-note { margin-top: 6px; color: var(--hero-muted); font-size: 11px; line-height: 1.7; }
body[data-page="landing"] .promise-strip {
  width: 100%; padding: 22px 24px; background: var(--bright-lime);
  color: var(--forest); border: 0; gap: 44px; font-size: 13px; font-weight: 650;
}
body[data-page="landing"] .promise-strip .strip-mark { color: var(--forest); }
body[data-page="landing"] main > .product-section { padding-block: 90px 0; }
body[data-page="landing"] .section-heading h2,
body[data-page="landing"] .safety-heading h2 { font-weight: 700; letter-spacing: -.05em; }
body[data-page="landing"] .section-heading h2 em { font-family: inherit; font-weight: inherit; font-style: normal; color: #567348; }
body[data-page="landing"] .order-demo {
  margin-top: 38px; padding: 30px 35px; border: 1px solid #ccd5c0;
  background: #e8eddf; border-radius: 16px; gap: 26px 30px;
}
body[data-page="landing"] .order-demo > div:first-child p { font-size: 18px; font-weight: 600; margin-top: 10px; }
body[data-page="landing"] .demo-controls { border-color: #bac7af; background: var(--paper); }
body[data-page="landing"] .demo-controls button { padding-inline: 17px; }
body[data-page="landing"] .demo-path {
  font-size: clamp(16px,2vw,24px)!important; font-weight: 600; letter-spacing: -.5px;
  min-height: 68px; gap: 17px; margin-top: 0;
}
body[data-page="landing"] .mini-folder { width: 30px; height: 23px; flex-shrink: 0; border-width: 2px; border-radius: 3px; }
body[data-page="landing"] .mini-folder::before { left: -2px; top: -8px; width: 14px; height: 7px; border-width: 2px; }
body[data-page="landing"] .product-peek { margin-top: 10px; }
body[data-page="landing"] .steps-section { display: block; padding-block: 80px; }
body[data-page="landing"] .steps-section .section-heading { max-width: 680px; }
body[data-page="landing"] .steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 40px; margin-top: 45px; max-width: none; }
body[data-page="landing"] .steps li { display: block; padding: 0 0 26px; border-bottom: 1px solid #b9c6ac; }
body[data-page="landing"] .step-number { width: auto; height: auto; display: block; border: 0; border-radius: 0; font-size: 60px; line-height: 1; letter-spacing: -4px; font-weight: 750; color: #8da47a; margin-bottom: 24px; }
body[data-page="landing"] .steps h3 { font-size: 21px; font-weight: 650; }
body[data-page="landing"] .steps p { font-size: 14px; }
body[data-page="landing"] .safety-section { padding: 42px; background: #e8eddf; border-radius: 20px; }
body[data-page="landing"] .safety-heading { margin-bottom: 34px; }
body[data-page="landing"] .safety-heading h2 { width: 57%; }
body[data-page="landing"] .safety-grid { gap: 50px; }
body[data-page="landing"] .safety-symbol { background: var(--forest); color: var(--bright-lime); width: 46px; height: 46px; border-radius: 12px; }
body[data-page="landing"] .safety-grid .copy-assurance { background: var(--paper); }
body[data-page="landing"] .privacy-boundaries { border-color: #c2cdb8; }
body[data-page="landing"] .faq-section { padding-block: 80px; }
body[data-page="landing"] .closing { padding: 56px 35px; background: var(--bright-lime); border-radius: 20px; }
body[data-page="landing"] .closing h2 { font-size: clamp(40px,4vw,58px); font-weight: 750; letter-spacing: -.05em; }
body[data-page="landing"] .closing-asterisk { display: none; }
body[data-page="landing"] .closing .button { border-radius: 28px; font-size: 14px; padding: 18px 28px; }
body[data-page="landing"] .site-footer { padding-block: 36px; }
@media (max-width:1100px) {
  .hero-shell .hero { gap: 30px; }
  .hero-shell h1 { font-size: 70px; }
  html[lang="ko"] .hero-shell h1 { font-size: 58px; }
  .hero-shell .hero-description { font-size: 15px; }
}
@media (max-width:760px) {
  .masthead .site-header { height: 82px; }
  .masthead .brand { font-size: 31px; }
  .hero-shell .hero { grid-template-columns: minmax(0,1fr); grid-template-rows: auto auto auto; gap: 30px; padding-block: 33px 38px; }
  .hero-intro { grid-column: 1; grid-row: 1; padding-top: 0; }
  .hero-shell .product-demo { grid-column: 1; grid-row: 2; }
  .hero-shell .download-section { grid-column: 1; grid-row: 3; max-width: none; }
  .hero-shell .download-button { width: 100%; min-width: 0; }
  .hero-shell .hero .eyebrow { font-size: 10px; margin-bottom: 20px; }
  .hero-shell h1 { font-size: clamp(58px,10vw,75px); }
  html[lang="ko"] .hero-shell h1 { font-size: clamp(43px,8.5vw,62px); line-height: 1.14; }
  .hero-shell .hero-description { margin-top: 20px; font-size: 14px; max-width: 500px; line-height: 1.75; }
  .hero-shell .hero-assurances { font-size: 11px; gap: 12px 18px; margin-top: 18px; }
  body[data-page="landing"] .promise-strip { gap: 10px 18px; padding: 20px; font-size: 11px; }
  body[data-page="landing"] main > .product-section { padding-block: 54px 0; }
  body[data-page="landing"] .order-demo { padding: 24px 20px; margin-top: 25px; gap: 20px; }
  body[data-page="landing"] .demo-path { font-size: 16px!important; min-height: 45px; gap: 12px; }
  body[data-page="landing"] .steps-section { padding-block: 54px; }
  body[data-page="landing"] .steps { grid-template-columns: 1fr; gap: 26px; margin-top: 30px; }
  body[data-page="landing"] .steps li { display: grid; grid-template-columns: 52px 1fr; gap: 20px; }
  body[data-page="landing"] .step-number { font-size: 40px; letter-spacing: -3px; margin-bottom: 0; }
  body[data-page="landing"] .steps h3 { font-size: 19px; }
  body[data-page="landing"] .safety-section { padding: 29px 24px; }
  body[data-page="landing"] .safety-heading h2 { width: 100%; }
  body[data-page="landing"] .safety-grid { gap: 30px; }
  body[data-page="landing"] .safety-grid h3 { font-size: 22px; }
  body[data-page="landing"] .faq-section { padding-block: 54px; }
  body[data-page="landing"] .closing { padding: 40px 24px; }
}
@media (max-width:380px) {
  html[lang="ko"] .hero-shell h1 { font-size: 40px; }
  body[data-page="landing"] .promise-strip { gap: 9px; }
  body[data-page="landing"] .order-demo { padding: 20px 16px; }
  body[data-page="landing"] .demo-controls button { padding-inline: 10px; font-size: 11px; }
  body[data-page="landing"] .demo-path { font-size: 14px!important; }
  body[data-page="landing"] .safety-section { padding-inline: 20px; }
}
