/* Figma: 랜딩페이지 ver.1.0 designed · 386:538. Desktop reference: 1280px. */
@font-face { font-family: Pretendard; src: url('assets/pretendard.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
:root { --ink: #181d27; --dark: #0a1210; --muted: #626262; --brand: #8ccb38; --green: #5db548; --teal: #1e7a6a; --gradient: linear-gradient(90deg,#a6d84a,#5db548); --gutter: 32px; }
*,*::before,*::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; -webkit-text-size-adjust: 100%; }
body { margin: 0; color: var(--ink); background: #fff; font: 15px/1.65 Pretendard, -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', sans-serif; -webkit-font-smoothing: antialiased; word-break: keep-all; overflow-wrap: break-word; }
h1,h2,h3,h4,p,ul,ol,blockquote { margin: 0; }
ul,ol { list-style: none; padding: 0; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button,input,select,textarea { font: inherit; }
button,a,input,select,textarea,summary { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid var(--green); outline-offset: 5px; }
.container { width: 100%; max-width: 1240px; margin-inline: auto; padding-inline: var(--gutter); }
.skip-link { position: fixed; left: 16px; top: -80px; padding: 12px 24px; background: white; z-index: 100; }
.skip-link:focus { top: 12px; }
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 51px; padding: 12px 23px; border: 1px solid transparent; border-radius: 12px; font-size: 15px; line-height: 25px; font-weight: 700; cursor: pointer; transition: filter .2s,background .2s,transform .2s; }
.btn:hover { filter: brightness(.96); }
.btn:active { transform: translateY(1px); }
.btn--primary { background: var(--gradient); color: #0a1210; border-color: #a4d16e; }
.btn--outline { color: var(--teal); border-color: #83bfaa; background: rgba(255,255,255,.6); }
.btn--outline:hover { background: #e9f5e9; }
.btn--block { display: flex; width: 100%; }
.btn:disabled { opacity: .6; cursor: wait; }
.header { position: absolute; top: 0; left: 0; width: 100%; z-index: 20; background: white; }
.header__inner { height: 71px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.header .logo { flex: 0 0 100px; min-width: 0; transform: translateY(2px); }
.header .logo img { width: 120px; max-width: none; height: auto; }
.nav { display: flex; align-items: center; gap: 28px; font-size: 14px; }
.nav a:hover { color: var(--teal); }
.header__inner > .btn { transform: translateY(4px); }
.nav-toggle { display: none; width: 44px; height: 44px; padding: 10px; flex-direction: column; justify-content: center; gap: 5px; border: 0; background: none; cursor: pointer; }
.nav-toggle span { display: block; height: 2px; background: var(--ink); }
.mobile-nav { display: none; }
[hidden] { display: none !important; }
.hero { height: 876px; padding-top: 289px; position: relative; color: #f6f4f4; text-align: center; background: var(--dark); }
.hero::before { content: ''; position: absolute; inset: 71px 0 0; background: url('assets/hero-background.webp') center / cover no-repeat; }
.hero__inner { position: relative; z-index: 1; }
.hero h1 { font-size: 60px; line-height: 70.848px; letter-spacing: -3px; font-weight: 700; }
.hero__lead { margin-top: 22px; font-size: 23px; line-height: 40px; color: #e6ece8; }
.hero__actions { display: flex; justify-content: center; gap: 12px; margin-top: 52px; }
/* 483:14514·483:14516: both hero links are fixed 250px wide (September 28). */
.hero__actions .btn { width: 250px; }
.hero__actions .btn--outline { color: white; border-color: white; background: transparent; }
.hero__actions .btn--outline:hover { background: #ffffff18; }
.hero__note { margin-top: 17.5px; font-size: 13px; color: #9aa59f; line-height: 21.45px; }
.section { margin-top: 42px; }
.section-heading { text-align: center; }
.eyebrow { color: var(--brand); font-size: 22px; font-weight: 700; line-height: 53.568px; letter-spacing: .2px; }
.section-heading h2 { font-size: 39.68px; font-weight: 700; line-height: 53.568px; letter-spacing: -1.8px; }
.problem { margin-top: 113px; min-height: 883px; padding-top: 91.5px; }
.problem-art { width: 100%; height: auto; margin-top: 30.8px; border-radius: 24px; }
.problem-mobile,.brand-mobile { display: none; }
.brand { min-height: 1027px; padding-top: 100px; }
.brand-art { width: calc(100% + 20px); max-width: none; height: auto; margin-top: -5px; }
.cases { min-height: 863px; padding-top: 65px; }
.cases .eyebrow { color: var(--green); }
.case-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; margin-top: 62px; }
.case-card { border: 1.2px solid #dde8d9; border-radius: 24px; padding: 32px 31px; min-height: 501px; background: linear-gradient(143deg,#fff,#f4faf1); --accent: #8ccb38; --tint: #eaf3d9; }
.case-card--2 { --accent: #5db548; --tint: #e3f1dd; }
.case-card--3 { --accent: #1e7a6a; --tint: #deece6; }
.case-badge { display: inline-flex; align-items: center; justify-content: center; border-radius: 100px; padding: 5px 14px; background: var(--accent,var(--brand)); color: #0a1210; font-size: 12px; font-weight: 700; line-height: 16px; }
.case-card--2 .case-badge,.case-card--3 .case-badge { color: white; }
.case-card h3 { margin-top: 21px; font-size: 23px; line-height: 33.35px; letter-spacing: 0; white-space: nowrap; }
.case-card--2 h3 { letter-spacing: -1.15px; }
.case-quote { margin-top: 21px; min-height: 56px; font-family: Pretendard,sans-serif; font-size: 17px; font-weight: 500; line-height: 28.05px; color: #4b5852; }
.case-method { border-top: 1px solid #d9e5d3; margin-top: 28px; padding-top: 20px; }
.case-method h4 { font-size: 13px; line-height: 16px; color: var(--accent); }
.case-method ul { margin-top: 20px; display: grid; gap: 20px; }
.case-method li { position: relative; padding-left: 16px; font: 500 16px/26px Pretendard,sans-serif; color: #3f5a50; letter-spacing: 0; }
.case-method li::before { content: ''; position: absolute; left: 0; top: 10px; width: 6px; height: 6px; border-radius: 50%; background: linear-gradient(135deg,var(--accent),var(--teal)); }
.case-result { display: flex; align-items: center; justify-content: center; min-height: 52px; margin-top: 24px; padding: 10px 4px; background: color-mix(in srgb,var(--accent) 12%,transparent); border: 1px solid color-mix(in srgb,var(--accent) 35%,transparent); border-radius: 14px; font-size: 16px; font-weight: 700; color: var(--teal); letter-spacing: 0; }
.portfolio { padding-top: 118.5px; }
.process { min-height: 1021.38px; padding-top: 118.5px; }
.stats { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 30px; margin-top: 56px; height: 290px; }
.stat { text-align: center; padding-top: 20px; }
.stat:nth-child(2),.stat:nth-child(3) { padding-top: 34px; }
.stat__figure { display: flex; justify-content: center; align-items: baseline; line-height: 1; letter-spacing: -.7px; }
.stat__figure strong { font-size: 200px; color: var(--green); line-height: 1; }
.stat__figure span { font-size: 41px; font-weight: 700; }
.stat__desc { margin-top: 12px; color: #626262; font-size: 15px; line-height: 25px; }
.timeline { margin-top: 30px; isolation: isolate; }
.confirmations { position: relative; height: 175px; }
.confirmation { position: absolute; top: 0; width: 240px; min-height: 104px; padding: 12px 20px; border: 1px solid #e5eae3; border-radius: 12px; background: white; }
.confirmation:nth-child(1) { left: 0; }
.confirmation:nth-child(2) { left: 37.54%; }
.confirmation:nth-child(3) { left: 67.05%; }
.confirmation small { font-family: Pretendard,sans-serif; font-size: 12px; color: #6b7470; }
.confirmation h3 { margin-top: 2px; font-size: 20px; line-height: 24px; color: var(--dark); }
.confirmation p { font-family: Pretendard,sans-serif; margin-top: 10px; font-size: 14px; color: #5a6b63; letter-spacing: 0; }
.timeline-steps { position: relative; display: grid; grid-template-columns: repeat(8,minmax(0,1fr)); padding-top: 10px; }
.timeline-steps::before { content: ''; position: absolute; top: 15px; left: 6.25%; right: 6.25%; height: 1px; background: #c3d6b0; }
.timeline-steps li { font-family: Pretendard,sans-serif; position: relative; text-align: center; font-size: 15px; line-height: 18px; color: var(--dark); }
.timeline-steps li:not(.key-step) { font-weight: 500; }
.timeline-dot { display: block; position: relative; width: 10px; height: 10px; border-radius: 50%; margin: 0 auto 30px; background: #c9cec7; }
.key-step { font-family: Pretendard,sans-serif !important; font-weight: 700; color: var(--teal) !important; }
.key-step .timeline-dot { background: var(--brand); }
.key-step .timeline-dot::before { content: ''; position: absolute; inset: -10px; border: 1px solid var(--brand); border-radius: 50%; background: transparent; box-shadow: 0 0 30px 15px #d9f2ab; }
.key-step .timeline-dot::after { content: ''; position: absolute; width: 1px; height: 70px; bottom: 20px; left: 4px; background: #a6cf72; }
.note { color: var(--muted); font-size: 13px; line-height: 21.45px; }
.process .note { margin-top: 58px; }
.plans-section { min-height: 1062px; padding-top: 118.5px; }
.plans { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin-top: 57.4px; }
.plan { display: flex; flex-direction: column; min-height: 639px; padding: 30px; border: 1px solid #b5d98a; border-radius: 24px; background: linear-gradient(149deg,#fff,#f2f8ee); }
.plan--standard { background: linear-gradient(135deg,#eef7e4,#ddefe8); }
.plan--allinone { background: var(--dark); color: #fff; border-color: #416847; }
.plan__name { padding-top: 16px; font-size: 30px; line-height: 42px; letter-spacing: -.7px; }
.plan__tagline { margin-top: 4px; font-size: 17px; font-weight: 700; line-height: 29px; }
.plan__desc { margin-top: 16px; font-size: 15px; line-height: 25px; letter-spacing: -.75px; color: var(--muted); white-space: nowrap; }
.plan--allinone .plan__desc,.plan--allinone .plan__hint { color: #c5c5c5; }
.plan__list { min-height: 235px; margin-top: 27px; border-top: 1px solid #d4e1ce; padding-top: 24px; }
.plan--allinone .plan__list { border-color: #294439; }
.plan__list li { font-size: 15px; line-height: 34px; }
.plan__hint { margin-top: 12px; font-size: 13px; color: var(--muted); line-height: 22px; }
.plan__price { margin-top: 32px; font-size: 18px; font-weight: 700; line-height: 30px; }
.plan .btn { margin-top: auto; border-radius: 12px; }
.plan .btn--outline { border-color: #3a9a5c; }
/* 386:1350: plan cards grow 5% on mouse hover. */
@media (hover: hover) and (min-width: 769px) {
  .plan { position: relative; transition: transform .25s ease; }
  .plan:hover { z-index: 1; transform: scale(1.05); }
}
.plan-note { padding-top: 17px; }
.turnkey-section { min-height: 460px; }
.turnkey { min-height: 460px; padding: 52px 55px 20px; border: 1px solid #5a9650; border-radius: 24px; background: radial-gradient(ellipse at 12% 4%,#35522280,transparent 42%),radial-gradient(ellipse at center,#12302b,#0a1210 75%); color: #f6f4f4; }
.turnkey-top { display: grid; grid-template-columns: 46% 1fr; gap: 32px; }
.turnkey h2 { font-size: 28px; line-height: 39.2px; margin-top: 21px; }
.turnkey-top p { font-family: Pretendard,sans-serif; font-size: 17px; line-height: 28.9px; color: #c9cec7; margin-top: 9px; }
.turnkey-options { display: flex; flex-wrap: wrap; align-content: start; gap: 12px 10px; max-width: 360px; padding-top: 49px; }
.turnkey-options li { border: 1px solid #8ccb3880; border-radius: 16px; background: #ffffff14; padding: 7px 13px; font: 500 14px/17.5px Pretendard,sans-serif; color: #d6e3cf; }
.turnkey-steps { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin-top: 52px; }
.turnkey-steps li { position: relative; text-align: center; }
.turnkey-steps small { display: block; color: #9fcb6a; font-size: 12px; font-weight: 700; }
.turnkey-dot { display: block; position: relative; z-index: 1; height: 28px; width: 28px; border: 4px solid var(--dark); background: linear-gradient(135deg,#a6d84a,#1e7a6a); border-radius: 50%; margin: 16px auto 14px; box-shadow: 0 0 14px 3px #7fc63844; }
.turnkey-steps li:not(:last-child)::after { content: ''; position: absolute; height: 1px; left: 50%; width: 100%; top: 50px; background: repeating-linear-gradient(90deg,#3a9a5c 0 5px,transparent 5px 11px); }
.turnkey-steps h3 { font-size: 19px; line-height: 23px; }
.turnkey-steps p { font-family: Pretendard,sans-serif; margin-top: 7px; font-size: 14px; line-height: 17px; color: #93aa99; }
.turnkey-note { font-family: Pretendard,sans-serif; font-size: 13px; line-height: 16px; color: #839987; margin-top: 12px; }
.faq-section { min-height: 807.78px; padding-top: 87.5px; padding-bottom: 100px; }
.faq__list { max-width: 1100px; margin: 25.4px auto 0; }
.faq__item { border-bottom: 1px solid #d9d9d9; }
summary { list-style: none; cursor: pointer; }
summary::-webkit-details-marker { display: none; }
.faq__item summary { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 25px 0; min-height: 97.56px; font-size: 24px; line-height: 31.68px; font-weight: 700; }
.faq__icon { flex: 0 0 auto; color: #3a9a5c; font-size: 26.4px; font-weight: 400; transition: transform .2s; }
[open] > summary .faq__icon { transform: rotate(45deg); }
.faq__answer { max-width: 880px; padding-bottom: 26px; }
.faq__answer p { font-size: 18px; line-height: 29.7px; color: var(--muted); }
.faq__answer p + p { margin-top: 20px; }
.faq__answer ul { padding-left: 1.2em; list-style: disc; font-size: 18px; line-height: 29.7px; color: var(--muted); }
.faq__answer li + li { margin-top: 8px; }
.faq__answer strong { color: var(--ink); }
.section--dark { background: var(--dark); color: #fff; padding: 100px 0 90px; }
.contact { display: grid; grid-template-columns: 529fr 556fr; gap: 90px; }
.contact .h2 { font-size: 42px; line-height: 56.7px; letter-spacing: -1.8px; padding-top: 15px; }
.contact__lead { font-size: 16px; line-height: 26.4px; color: #c5c5c5; margin-top: 20px; }
.contact__links { display: flex; flex-direction: column; gap: 8px; padding-top: 35px; font-size: 15px; }
.contact__links a:hover { text-decoration: underline; }
.form { display: flex; flex-direction: column; }
.form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 17px; }
.field { display: flex; flex-direction: column; min-width: 0; }
.field--full { grid-column: 1 / -1; }
.field label { font-size: 14px; line-height: 24px; margin-bottom: 7px; }
.field input,.field select,.field textarea { width: 100%; min-height: 52px; padding: 12px; border: 1px solid #666; border-radius: 0; color: #181d27; background: #e1e1e1; font-size: 16px; }
.field textarea { min-height: 94px; line-height: 26.4px; resize: vertical; }
.field input::placeholder,.field textarea::placeholder { color: #757575; }
.field input:focus,.field select:focus,.field textarea:focus { outline: 2px solid var(--brand); outline-offset: 2px; }
.field input[aria-invalid='true'] { border: 2px solid #ff8a8a; }
.select-wrap { position: relative; }
.select-wrap select { appearance: none; padding-right: 35px; background: #d9d9d9 url('assets/select-chevron.svg') no-repeat right 5px center / 10px 6px; }
.copy-mobile { display: none; }
.field select { min-height: 49px; }
.field select:has(option[value='']:checked) { color: #757575; }
.btn--submit { margin-top: 20px; border-radius: 12px; border-color: #fff; }
.form__note { font-size: 13px; line-height: 22px; color: #aaa; margin-top: 14px; }
.form__note.is-error { color: #ff9c9c; }
.form__note.is-success { color: #a6d84a; }
.footer { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; min-height: 165px; border-top: 1px solid #26302c; background: var(--dark); color: #aaa; font-size: 12px; line-height: 20px; }
.footer img { width: 123px; height: auto; }

/* Desktop artwork geometry from nodes 386:817, 386:939 and 386:1167. */
@media (min-width: 1280px) {
  /* Figma draws each eyebrow+title as one mixed-size text node; titles sit 5px higher than CSS line boxes. */
  .section-heading h2 { position: relative; top: -5px; }
  /* 386:1215/386:1216: 97.56px row including the 1px rule; question and 43.56px "+" box top-aligned at 26.4px. */
  .faq__item summary { align-items: flex-start; padding: 26.4px 0; min-height: 96.56px; }
  .faq__icon { line-height: 43.56px; }
  /* 386:1092/386:1094: price 20px below the hint block, button 24px below the price. */
  .plan__price { margin-top: 36px; }
  .plan .btn { margin-top: 24px; }
  /* 386:899: the portfolio article leaves 336px between the track and the Process eyebrow. */
  .portfolio { padding-bottom: 156px; }
  .case-card { position: relative; min-height: 501px; padding: 0; }
  .case-card > .case-badge { position: absolute; top: 34.8px; left: 30.8px; }
  .case-card > h3 { position: absolute; top: 82.175px; left: 30.8px; right: 30.8px; margin: 0; line-height: 33.35px; }
  .case-card > .case-quote { position: absolute; top: 136.55px; left: 30.8px; right: 30.8px; margin: 0; }
  .case-method { position: absolute; top: 213.925px; left: 30.8px; right: 30.8px; margin: 0; padding-top: 21.375px; }
  .case-method ul { margin-top: 21.375px; gap: 21.775px; }
  .case-method li { line-height: 25.6px; white-space: nowrap; }
  .case-result { position: absolute; top: 415.8px; left: 30.8px; right: 30.8px; margin: 0; height: 52px; line-height: 24px; }
  .process > .container { position: relative; padding-top: 0; }
  .stats { height: 248.383px; margin-top: 73.364px; }
  .stat,.stat:nth-child(2),.stat:nth-child(3) { position: relative; padding: 0; }
  .stat__figure { position: absolute; top: -27.359px; left: 0; width: 100%; }
  .stat:nth-child(2) .stat__figure,.stat:nth-child(3) .stat__figure { top: -13.668px; }
  .stat__desc { position: absolute; top: 195px; left: 0; right: 0; margin: 0; }
  .stat:nth-child(2) .stat__desc { top: 225.93px; }
  .stat:nth-child(3) .stat__desc { top: 208.69px; }
  .timeline { margin-top: 56px; height: 262px; }
  .confirmations { height: 175px; }
  .confirmation { padding: 15px 19px; height: 104px; }
  .confirmation small { display: block; line-height: 14px; font-weight: 500; }
  .confirmation h3 { margin-top: 6px; }
  .confirmation p { line-height: 17px; }
  .timeline-steps { padding-top: 10px; }
  .timeline-steps::before { left: 0; right: 0; height: 1.5px; background: #d6e3cf; }
  .timeline-dot { margin-bottom: 25px; }
  .key-step .timeline-dot { box-shadow: 0 0 0 8px white,0 0 0 10px var(--brand); }
  .key-step .timeline-dot::before { inset: -55px; border: 0; box-shadow: none; background: radial-gradient(circle,#8ccb3847,transparent 70%); z-index: -1; }
  .key-step .timeline-dot::after { height: 60px; bottom: 23px; width: 1.5px; }
  .process .note { margin-top: 34px; }
  .turnkey { position: relative; height: 460px; padding: 0; isolation: isolate; overflow: hidden; background: radial-gradient(ellipse at center,#12302b,#0a1210); }
  .turnkey::before,.turnkey::after { content: ''; position: absolute; z-index: -1; width: 520px; height: 520px; border-radius: 50%; filter: blur(50px); }
  .turnkey::before { left: -60px; top: -180px; background: radial-gradient(circle,#8ccb3859,transparent 70%); }
  .turnkey::after { right: -134px; top: 140px; background: radial-gradient(circle,#1e7a6a73,transparent 70%); }
  .turnkey-top { display: block; }
  .turnkey-top > div { position: absolute; left: 55px; top: 51px; width: 420px; }
  .turnkey .case-badge { height: 32px; font-size: 13px; padding: 8px 16px; line-height: 16px; background: linear-gradient(135deg,#a6d84a,#5db548); }
  .turnkey h2 { margin-top: 20px; }
  .turnkey-top p { margin-top: 9px; }
  .turnkey-options { position: absolute; left: 47.62%; top: 103px; padding: 0; width: min(390px, calc(52.38% - 40px)); max-width: none; gap: 13px 10px; }
  .turnkey-options li { height: 35px; padding: 8px 13px; line-height: 17px; white-space: nowrap; }
  .turnkey-options li:nth-child(1) { width: 80px; }
  .turnkey-options li:nth-child(2) { width: 154px; }
  .turnkey-options li:nth-child(3) { width: auto; }
  .turnkey-options li:nth-child(4) { width: 158px; }
  .turnkey-options li:nth-child(5) { width: 122px; }
  .turnkey-options li:nth-child(6) { width: 119px; }
  .turnkey-steps { position: absolute; top: 289px; left: 55px; width: calc(100% - 58px); margin: 0; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 36px; }
  .turnkey-steps small { line-height: 14px; }
  .turnkey-dot { margin: 16px auto 14px; }
  .turnkey-steps li:not(:last-child)::after { top: 44px; width: calc(100% + 36px); height: 1.5px; }
  .turnkey-note { position: absolute; top: 419px; left: 55px; margin: 0; }
  /* Contact controls and collapsed details, measured from nodes 386:1265–1321. */
  .section--dark { padding-top: 101px; }
  .form__grid { row-gap: 16.094px; }
  .field input { height: 52.398px; }
  .field select { height: 49px; }
  .select-wrap { min-height: 52.398px; }
  .field textarea { height: 101.898px; min-height: 101.898px; }
}

@media(min-width: 1281px) { .hero::before { background-size: cover; } }
@media(max-width: 1279px) {
  .case-card { padding: 24px; }
  .case-card h3 { font-size: 20px; white-space: normal; }
  .case-method li { font-size: 15px; }
  .case-result { font-size: 14px; }
  .plan { padding: 24px; }
  .plan__desc { white-space: normal; min-height: 50px; }
  .stat__figure strong { font-size: 160px; }
  .stat__figure span { font-size: 32px; }
  .contact { gap: 48px; }
  .timeline-steps li { font-size: 13px; }
}
@media(max-width: 900px) {
  .nav { gap: 16px; }
  .section { min-height: 0; padding-block: 72px; margin-top: 24px; }
  .problem { margin-top: 40px; }
  .section-heading h2 { font-size: 34px; line-height: 1.4; }
  .eyebrow { font-size: 18px; line-height: 44px; }
  .case-grid { gap: 16px; margin-top: 48px; }
  .case-card { padding: 20px; display: flex; flex-direction: column; }
  .case-card h3 { min-height: 66px; }
  .case-quote { min-height: 110px; }
  .case-result { margin-top: auto; }
  .case-method { margin-bottom: 24px; }
  .stats { height: auto; margin: 48px 0 70px; }
  .stat__figure strong { font-size: 130px; }
  .stat__figure span { font-size: 25px; }
  .stat__desc { font-size: 13px; }
  .confirmation { width: 200px; padding-inline: 14px; }
  .confirmation p { font-size: 12px; }
  .confirmation:nth-child(2) { left: 35%; }
  .confirmation:nth-child(3) { left: auto; right: 0; }
  .plans { gap: 14px; }
  .plan { padding: 22px 18px; }
  .plan__tagline { min-height: 58px; }
  .plan__list { min-height: 272px; }
  .plan__hint { min-height: 44px; }
  .plan__price { font-size: 16px; margin-bottom: 24px; }
  .turnkey { padding: 36px; }
  .turnkey-top { gap: 24px; }
  .turnkey h2 { font-size: 24px; }
  .turnkey-top p { font-size: 15px; }
  .turnkey-options { padding-top: 30px; }
  .turnkey-steps h3 { font-size: 17px; }
  .faq__list { margin-top: 32px; }
  .faq__item summary { font-size: 20px; }
  .contact { grid-template-columns: 1fr; }
}
@media(max-width: 768px) {
  :root { --gutter: 20px; }
  .header__inner { height: 72px; }
  .header__inner > .btn,.nav { display: none; }
  .nav-toggle { display: flex; }
  .mobile-nav { display: flex; flex-direction: column; padding: 12px 20px 24px; gap: 8px; background: white; border-top: 1px solid #eee; box-shadow: 0 16px 25px #0001; }
  .mobile-nav a { padding: 10px 12px; }
  .hero { height: 740px; padding-top: 218px; }
  .hero::before { top: 72px; }
  .hero h1 { font-size: clamp(26px,6.5vw,42px); line-height: 1.35; letter-spacing: -1.5px; }
  .hero__lead { font-size: 15px; line-height: 26px; margin-top: 32px; }
  .hero__actions { margin-top: 48px; gap: 10px; flex-wrap: wrap; }
  .hero__actions .btn { padding-inline: 17px; font-size: 14px; }
  .hero__note { font-size: 11px; }
  .section { margin-top: 0; padding-block: 64px; }
  .section-heading h2 { font-size: clamp(25px,6.2vw,34px); line-height: 1.4; letter-spacing: -1.1px; }
  .eyebrow { font-size: 16px; line-height: 36px; }
  .problem { padding-top: 88px; }
  .problem-art,.brand-art { display: none; }
  .problem-mobile { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; background: radial-gradient(at 20% 60%,#dcf5a9,transparent),#eef7ef; border-radius: 20px; padding: 24px 16px; margin-top: 36px; }
  .problem-mobile > p { padding: 18px 12px; border-radius: 14px; background: #ffffffcf; color: #315342; font-size: 14px; font-weight: 600; box-shadow: 0 5px 15px #3a6e3212; }
  .problem-mobile small { display: block; margin-top: 15px; font-size: 11px; color: #7c8e80; }
  .brand-mobile { display: flex; flex-direction: column; align-items: center; margin-top: 36px; }
  .brand-mobile__inputs { text-align: center; color: #54705e; background: #f5f9f2; border: 1px solid #e0ead9; border-radius: 16px; padding: 22px; line-height: 30px; width: 100%; }
  .brand-mobile__core { display: flex; flex-direction: column; justify-content: center; width: 235px; height: 235px; margin: 28px 0; border-radius: 50%; background: linear-gradient(140deg,#8ccb38,#5db548 60%,#1e7a6a); color: white; text-align: center; box-shadow: inset 0 -4px 20px #ffffff44; }
  .brand-mobile__core small { font-size: 10px; letter-spacing: 1px; }
  .brand-mobile__core strong { font-size: 27px; margin-block: 8px; }
  .brand-mobile__core p { font-size: 12px; }
  .brand-mobile ul { display: grid; gap: 12px; width: 100%; }
  .brand-mobile li { padding: 18px 20px; border: 1px solid #e0ead9; border-radius: 14px; background: #f7faf6; color: #567363; font-size: 14px; }
  .brand-mobile li strong { display: block; margin-bottom: 4px; color: #20392c; font-size: 18px; }
  .case-grid,.plans { grid-template-columns: 1fr; margin-top: 36px; gap: 20px; }
  .case-card { padding: 28px; min-height: 0; }
  .case-card h3 { min-height: 0; font-size: 22px; }
  .case-badge { align-self: flex-start; }
  .case-quote { min-height: 0; }
  .case-method { margin-top: 24px; }
  .case-method ul { gap: 14px; }
  .case-method li { font-size: 16px; }
  .case-result { margin-top: 0; font-size: 15px; }
  .stats { gap: 10px; margin-top: 40px; margin-bottom: 42px; }
  .stat,.stat:nth-child(2),.stat:nth-child(3) { padding-top: 0; }
  .stat__figure { flex-direction: column; align-items: center; }
  .stat__figure strong { font-size: 86px; }
  .stat__figure span { font-size: 20px; }
  .stat__desc { font-size: 11px; line-height: 18px; }
  .timeline { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 0; }
  .confirmations { display: flex; flex-direction: column; gap: 16px; height: auto; }
  .confirmation { position: static; width: 100%; min-height: 120px; padding: 14px; }
  .confirmation h3 { font-size: 18px; }
  .confirmation p { font-size: 12px; line-height: 19px; }
  .timeline-steps { display: flex; flex-direction: column; padding-top: 0; justify-content: space-between; }
  .timeline-steps::before { top: 10px; bottom: 10px; left: 5px; height: auto; width: 1px; }
  .timeline-steps li { display: flex; text-align: left; align-items: center; gap: 14px; font-size: 13px; line-height: 22px; }
  .timeline-dot { margin: 0; flex: 0 0 10px; }
  .key-step .timeline-dot::before { inset: -4px; box-shadow: 0 0 16px 3px #d9f2ab; }
  .key-step .timeline-dot::after { display: none; }
  .process .note { margin-top: 32px; }
  .plan { min-height: 600px; padding: 30px; }
  .plan__tagline,.plan__desc,.plan__list,.plan__hint { min-height: 0; }
  .plan__list { margin-top: 24px; margin-bottom: 12px; }
  .plan__price { margin: 28px 0 24px; font-size: 18px; }
  .plan-note { margin-top: 8px; }
  .turnkey-section { padding-top: 20px; }
  .turnkey { padding: 28px 24px; }
  .turnkey-top { grid-template-columns: 1fr; gap: 24px; }
  .turnkey h2 { font-size: 24px; line-height: 34px; }
  .turnkey-options { padding-top: 0; gap: 8px; }
  .turnkey-options li { font-size: 12px; padding: 6px 10px; }
  .turnkey-steps { grid-template-columns: 1fr 1fr; gap: 28px 16px; margin-top: 36px; }
  .turnkey-steps li:nth-child(2)::after { display: none; }
  .turnkey-steps h3 { font-size: 17px; }
  .turnkey-steps p { font-size: 12px; }
  .turnkey-note { margin-top: 28px; font-size: 11px; line-height: 19px; }
  .faq__item summary { min-height: 85px; font-size: 17px; line-height: 26px; padding-block: 22px; gap: 16px; }
  .faq__item p,.faq__answer ul { font-size: 15px; line-height: 26px; }
  .contact { gap: 40px; }
  .contact .h2 { font-size: 34px; line-height: 46px; padding-top: 0; }
  .contact__lead { font-size: 15px; }
  .form__grid { column-gap: 12px; }
  .form__note { font-size: 12px; }
}
@media(max-width: 400px) {
  .form__grid { grid-template-columns: minmax(0,1fr); }
}
@media(prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *,*::before,*::after { transition: none !important; } }



/* Native horizontal scrolling remains usable without JavaScript. */
.portfolio-carousel { margin-top: 57.4px; }
.portfolio-viewport { overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; scrollbar-width: none; border-radius: 12px; }
.portfolio-viewport::-webkit-scrollbar { display: none; }
.portfolio-track { display: flex; gap: 16px; width: max-content; }
.portfolio-track img { flex: 0 0 auto; width: auto; max-width: none; height: 420px; border-radius: 12px; object-fit: contain; user-select: none; }
@media (max-width: 700px) {
  .portfolio-carousel { margin-top: 36px; }
  .portfolio-track { gap: 12px; }
  .portfolio-track img { height: 280px; }
}

/* September 21 mobile frames: 448:6930. Native snap galleries, 380px reference. */
.carousel-dots { display: none; }
.form__consent { margin-top: 24px; font-size: 13px; line-height: 1.7; color: #c5c5c5; }
.form__consent-check { display: flex; align-items: flex-start; gap: 10px; color: #fff; cursor: pointer; }
.form__consent input { flex: 0 0 20px; width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--brand); }
.form__consent input[aria-invalid='true'] { outline: 2px solid #ff8a8a; }
.form__consent ul { list-style: disc; padding-left: 20px; margin-top: 12px; }
@media (max-width: 768px) {
  h1,h2,h3,p { word-break: keep-all; overflow-wrap: anywhere; }
  input,select,textarea { font-size: 16px; }
  .header__inner { height: 56px; }
  .header .logo img { width: 146px; }
  .hero { height: auto; min-height: 0; padding: 144px 0 30px; }
  .hero::before { top: 56px; }
  .hero h1 { font-size: 27px; line-height: 38px; letter-spacing: -1.2px; }
  .hero__lead { margin-top: 14px; font-size: 14px; line-height: 22px; color: #fff; }
  .hero__actions { flex-direction: column; gap: 12px; margin-top: 28px; }
  .hero__actions .btn { width: 100%; min-height: 52px; font-size: 15px; }
  .hero__note { margin-top: 18px; font-size: 13px; line-height: 18px; color: #ffffffc7; }
  .section { min-height: 0; padding-block: 56px; }
  .section-heading .eyebrow { font-size: 13px; line-height: 18px; color: #477c20; margin-bottom: 10px; }
  .section-heading h2 { font-size: 26px; line-height: 36px; letter-spacing: -1px; }
  .problem .section-heading h2 { max-width: 240px; margin-inline: auto; font-size: 25px; line-height: 35px; }
  .brand .section-heading h2,.cases .section-heading h2,.plans-section .section-heading h2 { max-width: 250px; margin-inline: auto; }
  .problem-mobile { display: block; position: relative; height: 394px; margin-top: 32px; padding: 0; background: radial-gradient(at 20% 10%,#eaf6d6,transparent 65%),radial-gradient(at 80% 80%,#dceee8,#f5faf6); }
  .problem-mobile > p { position: absolute; width: 64%; padding: 16px; font-size: 13px; line-height: 19px; background: #fafffaf2; border: 1px solid #e4efe0; box-shadow: 0 8px 18px #264d2510; }
  .problem-mobile small { margin-top: 6px; font-size: 13px; line-height: 18px; color: #526858; }
  .problem-mobile > p:nth-child(1) { left: 5%; top: 88px; transform: rotate(3deg); z-index: 2; }
  .problem-mobile > p:nth-child(2) { right: 2%; top: 143px; transform: rotate(-3deg); z-index: 3; }
  .problem-mobile > p:nth-child(3) { left: 7%; top: 220px; transform: rotate(2deg); z-index: 4; }
  .problem-mobile > p:nth-child(4) { right: 10%; top: 16px; transform: rotate(-5deg); }
  .problem-mobile > p:nth-child(5) { right: 3%; top: 283px; transform: rotate(-16deg); }
  .brand-mobile { margin-top: 32px; }
  .brand-mobile__label { width: 100%; color: #58675a; font-size: 13px; line-height: 18px; margin-bottom: 12px; }
  .brand-mobile .brand-mobile__inputs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; padding: 0; border: 0; background: none; text-align: center; }
  .brand-mobile .brand-mobile__inputs li { padding: 12px 14px; font-size: 13px; line-height: 20px; border: 0; border-radius: 10px; color: #46624f; }
  .brand-mobile__arrow { display: block; height: 80px; padding-top: 22px; color: #467c2c; font-size: 26px; }
  .brand-mobile__core { width: 212px; height: 212px; margin: 0; background: linear-gradient(135deg,#68ba46,#1e7a6a); }
  .brand-mobile__core small { font-size: 13px; letter-spacing: .5px; }
  .brand-mobile__core strong { font-size: 23px; line-height: 30px; margin-block: 6px; }
  .brand-mobile__core p { font-size: 13px; line-height: 18px; }
  .brand-mobile__label--center { text-align: center; }
  .brand-mobile__outputs li { display: flex; gap: 16px; align-items: center; padding: 16px; border: 0; min-height: 102px; font-size: 13px; line-height: 20px; }
  .brand-mobile__outputs img { flex: 0 0 72px; width: 72px; height: 72px; object-fit: cover; border-radius: 12px; }
  .brand-mobile__outputs li strong { font-size: 16px; line-height: 22px; }
  .case-grid,.plans { display: flex; align-items: stretch; gap: 12px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: 20px; scrollbar-width: none; margin: 32px -20px 0; padding: 0 20px 4px; }
  .case-grid::-webkit-scrollbar,.plans::-webkit-scrollbar { display: none; }
  .case-card,.plan { flex: 0 0 calc(100% - 12px); scroll-snap-align: center; min-width: 0; }
  .case-card { min-height: 344px; padding: 20px; border-radius: 18px; display: flex; flex-direction: column; gap: 0; }
  .case-badge { font-size: 13px; line-height: 16px; padding: 4px 10px; }
  .case-card h3 { margin-top: 14px; font-size: 18px; line-height: 26px; letter-spacing: -.6px; white-space: normal; }
  .case-quote { margin-top: 12px; font-size: 13.5px; line-height: 21px; }
  .case-method { margin-top: 16px; padding-top: 16px; }
  .case-method h4 { font-size: 13px; line-height: 18px; color: #356832; }
  .case-method ul { gap: 8px; margin-top: 12px; }
  .case-method li { font-size: 13px; line-height: 20px; padding-left: 14px; }
  .case-result { min-height: 42px; font-size: 13px; line-height: 18px; margin-top: auto; padding: 10px 4px; border-radius: 8px; }
  .case-method { margin-bottom: 16px; }
  .portfolio .section-heading { text-align: left; }
  .portfolio-carousel { margin-top: 32px; }
  .portfolio-viewport { margin-inline: -20px; padding-inline: 20px; border-radius: 0; scroll-padding-inline: 20px; scroll-snap-type: x mandatory; }
  .portfolio-track { width: 100%; gap: 12px; }
  .portfolio-track img { flex: 0 0 calc(100% - 12px); width: calc(100% - 12px); max-width: none; height: 288px; object-fit: contain; background: #f0f0f0; border-radius: 18px; scroll-snap-align: center; }
  .portfolio-track [data-portfolio-copy] { display: none; }
  .carousel-dots { display: flex; justify-content: center; align-items: center; gap: 0; margin-top: 10px; }
  .carousel-dot { display: grid; place-items: center; width: 30px; height: 32px; padding: 0; border: 0; background: transparent; cursor: pointer; }
  .carousel-dot::before { content: ''; display: block; width: 7px; height: 7px; border-radius: 8px; background: #bdcba9; }
  .carousel-dot[aria-current='true']::before { width: 18px; background: #7aaa32; }
  .plan { min-height: 488px; padding: 24px; border-radius: 18px; }
  .plan__name { font-size: 26px; line-height: 36px; }
  .plan__tagline { font-size: 15px; line-height: 24px; }
  .plan__desc { font-size: 13.5px; line-height: 21px; margin-top: 4px; min-height: 42px; }
  .plan__list { font-size: 14px; line-height: 22px; gap: 7px; margin-top: 24px; min-height: 167px; }
  .plan__hint { font-size: 13px; line-height: 19px; color: #52664e; }
  .plan__price { font-size: 17px; line-height: 26px; margin: 16px 0 20px; }
  .plan .btn { margin-top: auto; }
  .plan-note { font-size: 13px; line-height: 20px; margin-top: 4px; padding-top: 0; color: #58675a; }
  .turnkey-section { padding-top: 0; }
  .turnkey { min-height: 0; padding: 24px 20px 36px; border-radius: 24px; }
  .turnkey-top { gap: 16px; }
  .turnkey h2 { font-size: 23px; line-height: 32px; margin-top: 16px; letter-spacing: -1px; }
  .turnkey-top p { font-size: 13px; line-height: 21px; color: #ffffffc7; }
  .turnkey-options { gap: 8px; max-width: none; }
  .turnkey-options li { font-size: 13px; line-height: 18px; padding: 6px 9px; background: #263c33; color: #ffffffc7; border-color: #536947; }
  .turnkey-steps { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0; margin-top: 32px; }
  .turnkey-steps small { font-size: 13px; }
  .turnkey-steps h3 { font-size: 13px; line-height: 19px; }
  .turnkey-dot { width: 20px; height: 20px; margin: 10px auto; }
  .turnkey-steps li:not(:last-child)::after { display: block; top: 41px; }
  .contact { gap: 32px; }
  .contact > div { text-align: center; }
  .contact .h2 { font-size: 27px; line-height: 37px; }
  .contact__lead { font-size: 13.5px; line-height: 21px; margin-top: 12px; }
  .contact__links { padding-top: 18px; gap: 6px; font-size: 14px; line-height: 20px; }
  .form__grid { grid-template-columns: minmax(0,1fr); gap: 12px; }
  .field label { font-size: 13px; line-height: 18px; margin-bottom: 10px; }
  .field input,.field select,.field textarea { border-radius: 6px; }
  .field textarea { min-height: 124px; }
  .form__note { font-size: 13px; color: #ffffffc7; }
  .stat__desc,.confirmation p { font-size: 13px; color: #59635c; }
}

.form__consent label { cursor: pointer; }
@media (max-width: 768px) {
  .brand-mobile__core { background: linear-gradient(135deg,#397f2c,#176354); }
  .plan__name { padding-top: 0; }
  .plan__list { padding-top: 16px; }
  .plan__list li { font-size: 14px; line-height: 22px; }
  .plan__list li + li { margin-top: 7px; }
  .plan--allinone .plan__desc,.plan--allinone .plan__hint { color: #ffffffc7; }
}

.mobile-break { display: none; }
@media (max-width: 768px) {
  .mobile-break { display: initial; }
  .desktop-break { display: none; }
}

/* Shared policy links and readable, script-free legal documents. */
.privacy-link { display: inline-block; margin-top: 10px; color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.footer { padding: 32px 20px; text-align: center; }
.footer__company { font-size: 13px; line-height: 1.9; }
.legal-nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 24px; font-size: 14px; line-height: 1.6; }
.legal-nav a { padding-block: 8px; }
.legal-nav a:hover,.legal-home:hover { text-decoration: underline; text-underline-offset: 4px; }
.footer .legal-nav { color: #ddd; }
.legal-header { border-bottom: 1px solid #e2e8df; background: #fff; }
.legal-header .container { max-width: 1040px; min-height: 80px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.legal-header img { width: 146px; height: auto; }
.legal-home { font-size: 14px; color: #42624d; }
.legal-main { max-width: 960px; padding: 48px 32px 72px; margin-inline: auto; }
.legal-main > .legal-nav { justify-content: flex-start; border-bottom: 1px solid #dce5d7; margin-bottom: 36px; }
.legal-main .legal-nav [aria-current='page'] { font-weight: 700; color: #24633b; box-shadow: inset 0 -3px #659b30; }
.legal-main h1 { font-size: clamp(28px,5vw,40px); line-height: 1.4; letter-spacing: -1.2px; }
.legal-date { color: #626262; font-size: 14px; margin-top: 12px; }
.legal-toc { margin-top: 28px; padding: 16px 20px; background: #f3f7ef; border: 1px solid #dce5d7; border-radius: 12px; }
.legal-toc summary { font-weight: 700; list-style: disclosure-closed; margin-left: 16px; }
.legal-toc[open] summary { list-style: disclosure-open; }
.legal-toc ol { display: grid; gap: 8px; margin-top: 16px; }
.legal-toc a { display: inline-block; padding-block: 3px; color: #345740; }
.legal-toc a:hover { text-decoration: underline; }
.legal-content { margin-top: 40px; font-size: 16px; line-height: 1.9; color: #353d35; }
.legal-content h2 { margin: 44px 0 18px; padding-top: 24px; border-top: 1px solid #e0e7dc; color: #181d27; font-size: 22px; line-height: 1.5; letter-spacing: -.5px; scroll-margin-top: 24px; }
.legal-content > h2:first-child { margin-top: 0; }
.legal-content p { margin-block: 16px; }
.legal-content strong { font-weight: 700; color: #182c20; }
.legal-content ol,.legal-content ul { padding-left: 1.5em; margin-block: 16px; }
.legal-content ol { list-style: decimal; }
.legal-content ul { list-style: disc; }
.legal-content li + li { margin-top: 10px; }
.legal-content li > ul { margin-block: 10px; }
.legal-content a { color: #24633b; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.legal-table { overflow-x: auto; margin-block: 20px; border: 1px solid #dce5d7; border-radius: 8px; }
.legal-table table { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.8; }
.legal-table th,.legal-table td { padding: 14px 16px; text-align: left; vertical-align: top; border-bottom: 1px solid #dce5d7; overflow-wrap: anywhere; }
.legal-table thead { background: #edf4e8; color: #243d27; }
.legal-table tbody th { width: 23%; background: #f8faf6; font-weight: 600; }
.legal-table tbody tr:last-child > * { border-bottom: 0; }
.legal-company { border-top: 1px solid #dce5d7; margin-top: 40px; padding-top: 20px; font-size: 14px; }
.legal-top { display: inline-block; margin-top: 24px; padding: 10px 0; color: #345740; text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 768px) {
  .legal-header .container { min-height: 72px; gap: 16px; }
  .legal-home { max-width: 110px; font-size: 13px; text-align: right; }
  .legal-main { padding: 28px 20px 48px; }
  .legal-main > .legal-nav { gap: 8px 16px; font-size: 13px; margin-bottom: 28px; }
  .legal-content { font-size: 15px; line-height: 1.85; }
  .legal-content h2 { font-size: 20px; }
  .legal-table th,.legal-table td { padding: 12px 10px; }
  .legal-table table { min-width: 480px; font-size: 14px; }
  .footer .legal-nav { gap: 8px 16px; font-size: 13px; }
}
@media print {
  .legal-header,.legal-main > .legal-nav,.legal-toc,.legal-top,.legal-footer,.skip-link { display: none; }
  .legal-main { max-width: none; padding: 0; }
  .legal-content { font-size: 11pt; }
  .legal-content h2 { break-after: avoid; }
  .legal-table { overflow: visible; }
  .legal-table table { min-width: 0; }
  .legal-table tr { break-inside: avoid; }
}

/* Final mobile readability pass before the September 23 release. */
@media (max-width: 768px) {
  .hero::before { background-image: linear-gradient(#07120db3,#07120db3),url('assets/hero-background.webp'); }
  .confirmation small,.footer { font-size: 13px; }
  .case-card--2 .case-badge { color: #0a1210; }
  .field input::placeholder,.field textarea::placeholder { color: #626262; }
  .problem-mobile > p,.turnkey-options li { backdrop-filter: none; }
}

/* September 23 follow-up: match the desktop palette and revised mobile frames. */
@media (max-width: 768px) {
  .section-heading .eyebrow { color: var(--brand); }
  .cases .section-heading .eyebrow { color: var(--green); }
  .brand-mobile__label,.portfolio .section-heading { text-align: center; }
  .brand-mobile__core { background: linear-gradient(135deg,#8ccb38,#5db548 50%,#2f8e6a 85%,#1e7a6a); }
  .portfolio-track img { object-fit: cover; background: transparent; }
  .problem .section-heading h2 { max-width: 100%; }
  .problem-mobile { height: 305px; margin-top: 28px; overflow: hidden; }
  .problem-mobile > p { display: flex; flex-direction: column; width: 84%; min-height: 88px; padding: 14px 16px 22px; border-radius: 16px; color: #12302b; background: #ffffffed; font-weight: 600; }
  .problem-mobile small { margin: 0 0 6px; font-weight: 400; }
  .problem-mobile > p:nth-child(1) { left: 4%; right: auto; top: 14px; transform: rotate(1deg); z-index: 1; }
  .problem-mobile > p:nth-child(2) { left: auto; right: 4%; top: 78px; transform: rotate(-1deg); z-index: 2; }
  .problem-mobile > p:nth-child(3) { left: 5%; right: auto; top: 142px; transform: rotate(.6deg); z-index: 3; }
  .problem-mobile > p:nth-child(4) { left: auto; right: 3%; top: 206px; transform: rotate(-1deg); z-index: 4; }
  .problem-mobile__count { position: absolute; top: 4px; right: 8%; z-index: 5; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #e25a4a; color: #fff; font-size: 15px; line-height: 18px; font-weight: 700; }
}

/* September 28 form format: mobile 483:16744 (380px frame). */
@media (max-width: 768px) {
  .copy-desktop { display: none; }
  .copy-mobile { display: inline; }
  .form__grid { gap: 16px; }
  .field label { font-weight: 700; font-size: 13px; line-height: 18px; margin-bottom: 8px; }
  .field input,.field select { height: 50px; min-height: 50px; padding: 0 14px; }
  .field input,.field select,.field textarea { border: 0; border-radius: 8px; background-color: #e0e2e1; font-weight: 500; }
  .field textarea { height: 125px; min-height: 125px; padding: 15px 14px; line-height: 20px; }
  .field input::placeholder,.field textarea::placeholder { color: #6b706e; }
  .field select:has(option[value='']:checked) { color: #6b706e; }
  .select-wrap { min-height: 0; }
  .select-wrap select { padding-right: 36px; background-image: url('assets/select-chevron-mobile.svg'); background-position: right 13px center; }
  .field input[aria-invalid='true'] { border: 2px solid #ff8a8a; }
  .btn--submit { margin-top: 16px; min-height: 56px; border-color: transparent; border-radius: 12px; font-size: 15.5px; line-height: 20px; }
  .form__note { margin-top: 16px; font-size: 12.5px; line-height: 18px; color: #adb5b0; }
}

/* September 28 audit: remaining 380px differences from 448:6930 (values from the nodes named below). */
@media (max-width: 768px) {
  /* 448:8345/8346/8353: 450px hero, scrim 55%→75%, translucent secondary CTA. */
  .hero { padding-bottom: 56px; }
  .hero::before { background-image: linear-gradient(#050f0d8c,#050f0dbf),url('assets/hero-background.webp'); }
  .hero__actions { gap: 10px; margin-top: 24px; }
  .hero__actions .btn--outline { min-height: 54.4px; border: 1.2px solid #ffffff73; background: #ffffff1f; }
  .hero__note { margin-top: 14px; }
  /* 448:8248/8256 arrows: 1×28 line and 9×8 triangle, #5db548. */
  .brand-mobile__arrow { position: relative; width: 100%; height: 80px; padding: 0; font-size: 0; }
  .brand-mobile__arrow::before { content: ''; position: absolute; left: 50%; top: 20px; width: 1px; height: 28px; margin-left: -.5px; background: #5db548; }
  .brand-mobile__arrow::after { content: ''; position: absolute; left: 50%; top: 52px; margin-left: -4.5px; border-inline: 4.5px solid transparent; border-top: 8px solid #5db548; }
  /* 448:8252 core: 210px, stops 0/35/72/100%. */
  .brand-mobile__core { width: 210px; height: 210px; background: linear-gradient(135deg,#8ccb38,#5db548 35%,#2f8e6a 72%,#1e7a6a); }
  /* 448:8414 case slide: flat #f7fbf4, no stroke; 448:8434 result: #8ccb38 14%, radius 10, no stroke. */
  .case-card { border: 0; background: #f7fbf4; }
  .case-quote { color: #3f5a50; }
  .case-method h4 { color: #2f8e6a; }
  .case-method li::before { top: 7px; }
  .case-result { border: 0; border-radius: 10px; background: #8ccb3824; color: #2f8e6a; }
  /* 448:8480/8550 dots: 18×7 active, 7×7 at 28%, 6px apart; each button keeps a wider invisible tap area. */
  .carousel-dots { margin-top: 5px; }
  .carousel-dot { position: relative; width: auto; padding: 0 3px; }
  .carousel-dot::after { content: ''; position: absolute; inset: 0 -6px; }
  .carousel-dot::before { border-radius: 3.5px; background: #8ccb3847; }
  .carousel-dot[aria-current='true']::before { background: #8ccb38; }
  /* 448:8490 plan slide geometry. */
  .plan { min-height: 0; padding: 26px 22px; border: 1.2px solid #dbe5db; border-radius: 24px; }
  .plan--allinone { border-color: #ffffff24; }
  .plan__tagline { margin-top: 0; }
  .plan__desc { margin-top: 4px; min-height: 0; white-space: normal; }
  .plan__list { margin: 18px 0 0; padding: 16px 0; min-height: 0; border-top-color: #d9d9d9; }
  .plan__hint { margin-top: 0; color: #626262; }
  .plan__price { margin: 16px 0 18px; }
  .plan .btn { margin-top: 0; min-height: 53px; padding-block: 14px; line-height: 23px; }
  .plan .btn--outline { background: #fff; }
  .plan-note { text-align: center; color: #5a6b63; font-weight: 500; line-height: 18px; } /* 448:8554: Medium, 18px line (12px raised to the 13px minimum). */
  /* 448:8303/8324 all-in-one: no stroke, solid 22% white flow line, plain 18px dots, labels weight 500. */
  .turnkey { border: 0; padding: 28px 20px 38px; }
  .turnkey-steps { margin-top: 43px; }
  .turnkey-steps small { line-height: 13px; }
  .turnkey-dot { width: 18px; height: 18px; margin: 4px auto 9px; border: 0; box-shadow: none; }
  .turnkey-steps li:not(:last-child)::after { top: 25px; height: 1px; background: #ffffff38; }
  .turnkey-steps h3 { font-weight: 500; }
  /* 448:8414 slide rhythm: badge 22, title 59, quote 97, rule 151, label 164, list 193, result 281, height 345. */
  .case-card { min-height: 0; padding: 22px 20px; }
  .case-card h3 { margin-top: 13px; }
  .case-method { margin: 12px 0 12px; padding-top: 12px; }
  .case-method ul { margin-top: 11px; }
  /* 448:8306: badge 28px tall, 12px rhythm down to the chips. */
  .turnkey .case-badge { height: 28px; padding: 0 12px; }
  .turnkey-top { gap: 12px; }
  .turnkey h2 { margin-top: 12px; }
  .turnkey-top p { margin-top: 12px; }
  /* 448:8224: 16px label, 12px gap, 166x42 source chips 8px apart. 448:8259: 10px from label to cards and between cards. */
  .brand-mobile__label { line-height: 16px; }
  .brand-mobile .brand-mobile__inputs { gap: 8px; }
  .brand-mobile .brand-mobile__inputs li { padding: 11px 14px; }
  .brand-mobile__label--center { margin-bottom: 10px; }
  .brand-mobile .brand-mobile__outputs { gap: 10px; }
  /* 448:8302 frame: 40px around the all-in-one box. 448:8395: portfolio dots 24px below the slide. */
  .turnkey-section { padding-block: 40px; }
  .portfolio .carousel-dots { margin-top: 13px; }
  /* 448:8408/448:8395: the frame ends 56px below the 7px dots; the 32px tap area must not add to that. */
  .cases .carousel-dots,.portfolio .carousel-dots { margin-bottom: -12.5px; }
}