.public-page { background:var(--page-bg); color:var(--text); font-size:16px; }
.public-page * { min-width:0; }
.public-container { width:100%; max-width:1240px; padding-inline:32px; margin-inline:auto; }
.public-header { position:sticky; top:0; z-index:1030; background:var(--surface); border-bottom:1px solid var(--border); }
.public-header .navbar { gap:24px; padding-block:16px; }
.public-brand { padding:0; font-size:20px; flex-shrink:0; }
.public-header .navbar-collapse { gap:20px; justify-content:space-between; }
.public-nav-links,.public-header-actions,.public-footer-links { display:flex; align-items:center; flex-wrap:wrap; gap:18px; }
.public-nav-links a { font-size:14px; font-weight:600; padding-block:10px; color:var(--muted); }
.public-nav-links a:hover { color:var(--primary); }
.public-header-actions { gap:8px; }
.public-header .navbar-toggler { margin-left:auto; }
.public-page .btn { overflow-wrap:anywhere; }
.public-page section { scroll-margin-top:110px; }
.landing-hero { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); align-items:center; gap:64px; padding-block:76px 56px; }
.hero-badge,.section-label { color:var(--tint-text); font-size:13px; font-weight:700; display:inline-flex; align-items:center; gap:8px; margin-bottom:20px; }
.landing-hero h1 { font-size:54px; font-weight:800; line-height:1.12; letter-spacing:0; margin-bottom:24px; overflow-wrap:anywhere; }
.landing-hero h1 span { display:block; color:var(--primary); }
.hero-subtitle,.section-subtitle { color:var(--muted); font-size:17px; line-height:1.8; }
.hero-buttons { display:flex; gap:12px; flex-wrap:wrap; margin-top:28px; }
.hero-buttons .btn { padding:14px 24px; font-size:14px; }
.app-preview { padding:24px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-panel); box-shadow:var(--shadow-hover); }
.preview-heading { display:flex; justify-content:space-between; gap:16px; align-items:center; margin-bottom:20px; font-size:14px; font-weight:700; }
.preview-heading .bi { color:var(--tint-text); font-size:22px; }
.preview-timer { background:linear-gradient(120deg,#0f3d25,#1b5e3a); color:#fff; border-radius:var(--radius-card); padding:24px; }
.preview-timer p { color:#dcefe2; font-size:13px; margin-bottom:16px; }
.preview-timer .project-chip { color:#fff; background:#28583c; }
.preview-time { display:block; font-size:44px; font-weight:700; font-variant-numeric:tabular-nums; line-height:1.3; margin:14px 0 0; }
.preview-stats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-block:20px; }
.preview-stat { background:var(--panel-bg); padding:16px; border-radius:var(--radius-input); }
.preview-stat small { color:var(--muted); display:block; }
.preview-stat strong { font-size:26px; font-variant-numeric:tabular-nums; }
.preview-stat:last-child { background:var(--info-bg); color:var(--info-text); }
.preview-stat:last-child small { color:inherit; }
.preview-chart { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); align-items:end; gap:14px; height:118px; border-bottom:1px solid var(--border); padding:12px 8px; background:repeating-linear-gradient(to top,transparent 0 34px,var(--border) 35px,transparent 36px); }
.preview-chart span { width:100%; max-width:28px; justify-self:center; border-radius:999px; background:var(--green-600); height:65%; }
.preview-chart span:nth-child(2) { height:88%; background:var(--green-400); }
.preview-chart span:nth-child(3) { height:48%; }
.preview-chart span:nth-child(4) { height:100%; background:var(--amber); }
.preview-chart span:nth-child(5) { height:78%; }
.preview-chart span:nth-child(6),.preview-chart span:nth-child(7) { height:28%; background:var(--green-200); }
.stats-section { padding-block:16px 56px; }
.landing-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.landing-stat { border-top:1px solid var(--border); padding-top:24px; display:flex; align-items:center; gap:14px; }
.landing-stat .bi { color:var(--tint-text); font-size:26px; }
.landing-stat strong { display:block; font-size:24px; }
.landing-stat p { margin:0; font-size:13px; color:var(--muted); }
.landing-section { padding-block:64px; }
.section-header { max-width:740px; margin-bottom:36px; }
.public-page h2 { font-size:34px; line-height:1.25; margin-bottom:16px; overflow-wrap:anywhere; }
.features-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.feature-card,.benefit-item { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-card); padding:28px; transition:transform 180ms,box-shadow 180ms; }
.feature-card:hover,.benefit-item:hover { transform:translateY(-2px); box-shadow:var(--shadow-hover); }
.feature-icon-wrap,.benefit-icon { display:grid; place-items:center; width:48px; height:48px; border-radius:var(--radius-input); color:var(--tint-text); background:var(--tint); font-size:24px; margin-bottom:24px; flex-shrink:0; }
.feature-card:nth-child(4) .feature-icon-wrap { color:var(--info-text); background:var(--info-bg); }
.feature-card:nth-child(6) .feature-icon-wrap { color:var(--warning-text); background:var(--warning-bg); }
.public-page h3 { font-size:19px; line-height:1.5; margin-bottom:12px; }
.feature-card p,.benefit-item p { color:var(--muted); font-size:14px; line-height:1.8; margin:0; }
.apps-band { margin-block:48px 16px; color:#fff; background:repeating-linear-gradient(120deg,transparent 0 48px,rgb(188 224 201 / 7%) 49px 50px,transparent 51px 96px),linear-gradient(120deg,#0f3d25,#1b5e3a); }
.apps-band .section-label,.apps-band p { color:#dcefe2; }
.apps-band .section-header { max-width:760px; }
.apps-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; }
.app-download { border-top:1px solid #60866c; padding-top:24px; display:flex; flex-direction:column; align-items:flex-start; }
.app-download>.bi { color:#bce0c9; font-size:32px; margin-bottom:16px; }
.app-download p { font-size:14px; flex:1; margin-bottom:24px; }
.apps-band .btn { background:#fff; color:#0f3d25; border-color:#bce0c9; }
.apps-band .btn:hover { background:#dcefe2; }
.apps-band :focus-visible { outline-color:#bce0c9; }
.pomodoro-band { background:var(--panel-bg); }
.pomodoro-content { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); align-items:center; gap:64px; }
.pomodoro-content p { color:var(--muted); line-height:1.8; }
.pomodoro-features { display:flex; gap:16px; flex-wrap:wrap; margin-block:24px; padding:0; list-style:none; font-size:13px; }
.pomodoro-features .bi { color:var(--primary); margin-right:6px; }
.pomodoro-timer-preview { width:230px; height:230px; border-radius:50%; border:10px solid var(--tint); outline:2px solid var(--primary); display:flex; flex-direction:column; align-items:center; justify-content:center; justify-self:center; }
.pomodoro-timer-preview strong { font-size:44px; color:var(--primary); font-variant-numeric:tabular-nums; }
.pomodoro-timer-preview span { color:var(--muted); font-size:13px; }
.benefits-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.benefit-item { display:flex; gap:20px; }
.benefit-icon { margin:0; }
.faq-section { background:var(--panel-bg); }
.public-page .accordion { max-width:860px; }
.public-page .accordion-item { border:1px solid var(--border); border-radius:var(--radius-input); overflow:hidden; margin-bottom:12px; }
.public-page .accordion-button { padding:20px 24px; font-weight:600; line-height:1.6; font-size:16px; }
.public-page .accordion-button::after { flex-shrink:0; margin-left:16px; }
.public-page .accordion-body { font-size:14px; color:var(--muted); line-height:1.8; padding:20px 24px; }
.public-page .accordion-header { margin:0; }
.cta-section { text-align:center; padding-block:80px; }
.cta-section p { color:var(--muted); margin-bottom:24px; }
.public-footer { border-top:1px solid var(--border); padding-block:32px; }
.public-footer-content { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px; }
.public-footer-links { font-size:12px; gap:16px; }
.public-footer small { width:100%; color:var(--muted); }
.public-page .reveal { opacity:1; transform:none; animation:none; transition:opacity 360ms,transform 360ms; }
.public-page .reveal.is-pending { opacity:0; transform:translateY(8px); }
@media(min-width:1200px) { .public-header .navbar-toggler { display:none; } }
@media(max-width:1199px) {
  .public-header .navbar-collapse { padding-top:20px; }
  .public-nav-links { margin-bottom:16px; }
  .landing-hero { gap:32px; }
  .landing-hero h1 { font-size:44px; }
}
@media(max-width:767px) {
  .public-container { padding-inline:20px; }
  .public-header .navbar { padding-block:12px; }
  .public-header-actions { flex-wrap:wrap; }
  .public-nav-links { align-items:flex-start; flex-direction:column; gap:4px; }
  .landing-hero { grid-template-columns:minmax(0,1fr); padding-block:40px; gap:32px; }
  .landing-hero h1 { font-size:36px; }
  .hero-subtitle,.section-subtitle { font-size:16px; }
  .landing-stats,.features-grid,.benefits-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
  .apps-grid,.pomodoro-content { grid-template-columns:minmax(0,1fr); gap:32px; }
  .landing-section { padding-block:40px; }
  .public-page h2 { font-size:28px; }
  .apps-band { margin-block:24px 0; }
  .public-footer-content { align-items:flex-start; flex-direction:column; }
}
@media(max-width:575px) {
  .features-grid,.benefits-grid { grid-template-columns:minmax(0,1fr); }
  .app-preview { padding:18px; }
  .preview-timer { padding:20px; }
  .preview-time { font-size:38px; }
  .preview-stats { gap:12px; }
  .preview-stat { padding:12px; }
  .landing-stat { gap:10px; align-items:flex-start; }
  .landing-stat strong { font-size:20px; }
  .feature-card,.benefit-item { padding:24px; }
  .hero-buttons .btn { width:100%; }
  .public-page h3 { overflow-wrap:anywhere; }
}
@media(prefers-reduced-motion:no-preference) { html:has(.public-page) { scroll-behavior:smooth; } }
@media(prefers-reduced-motion:reduce) {
  .public-page *,.public-page *::before,.public-page *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
  .public-page .reveal.is-pending { opacity:1; transform:none; }
  .public-page .btn:hover,.feature-card:hover,.benefit-item:hover { transform:none; }
}