:root {
    --brand-admin-surface-light: #f5f5f5;
    --public-text: #292929;
    --public-muted: #616161;
}
* { box-sizing: border-box; }
body { margin: 0; background: #fff; color: var(--public-text); font-family: Arial, Helvetica, sans-serif; line-height: 1.6; }
a { color: inherit; text-underline-offset: .22em; }
a:focus-visible { outline: 3px solid #006b70; outline-offset: 5px; }
.skip-link { position: absolute; top: -100px; left: 16px; z-index: 2; padding: 12px; background: #fff; }
.skip-link:focus { top: 12px; }
.homepage-intro { max-width: 950px; padding: clamp(48px, 6vw, 90px) 24px 48px; margin: auto; text-align: center; }
.homepage-intro h1 { font-size: clamp(28px, 3.2vw, 44px); font-weight: 500; line-height: 1.25; letter-spacing: -.035em; margin: 0; }
.packages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; max-width: 1320px; padding: 0 32px; margin: 0 auto; }
.package { border: 1px solid #e3e3e3; border-radius: 12px; overflow: hidden; display: flex; flex-direction: column; }
.package-image { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; background: #f5f2ee; }
.package-content { padding: 28px; display: flex; flex-direction: column; flex: 1; }
.package h2 { font-size: 26px; line-height: 1.3; margin: 0 0 6px; letter-spacing: -.02em; }
.package-description { margin: 0; color: var(--public-muted); }
.package-price { font-size: 38px; line-height: 1.2; margin: 24px 0; letter-spacing: -.03em; }
.package-price span { display: block; font-size: 13px; letter-spacing: 0; color: var(--public-muted); margin-top: 6px; }
.package ul { margin: 0 0 24px; padding-left: 20px; font-size: 15px; }
.package li { padding-left: 4px; margin-bottom: 12px; }
.package-note { margin: auto 0 0; padding-top: 20px; border-top: 1px solid #e9e9e9; font-size: 13px; color: var(--public-muted); }
.homepage-action { display: flex; justify-content: center; margin: 36px 24px 0; }
.get-started { display: inline-flex; align-items: center; justify-content: center; width: 330px; max-width: 100%; min-height: 48px; padding: 12px 24px; border: 1px solid #007d7e; border-radius: 3px; background: #007d7e; color: #fff; font-size: 14px; font-weight: 600; text-align: center; text-decoration: none; transition: background-color .1s ease, border-color .1s ease; }
.get-started:hover { background: #006566; border-color: #006566; }
.homepage-next { margin: 16px auto 56px; padding: 0 24px; text-align: center; color: var(--public-muted); font-size: 14px; }
.holding-page { max-width: 800px; margin: auto; padding: clamp(80px, 16vh, 180px) 24px; text-align: center; }
.holding-page h1 { margin: 0 0 32px; font-size: clamp(26px, 4vw, 38px); font-weight: 500; line-height: 1.4; letter-spacing: -.025em; }
.homepage-link { display: inline-block; padding: 12px 20px; border: 1px solid #d0d0d0; border-radius: 6px; text-decoration: none; }
.homepage-link:hover { background: var(--brand-admin-surface-light); }
@media (max-width: 760px) {
    .packages { grid-template-columns: 1fr; max-width: 520px; padding: 0 24px; }
    .homepage-intro { padding-bottom: 36px; }
    .package-content { padding: 24px; }
}
