/* Presentation layer for the pilot page. Business logic lives in pilot-client.js. */
html { scroll-padding-top: 100px; }
.section { padding-block: 72px; }
.everyday-section { padding-top: 64px; }
.hero { padding-block: 48px; align-items: center; }
.hero h1 { font-size: clamp(38px, 4.2vw, 60px); line-height: 1.08; }
.hero-copy > p { font-size: 16px; }
.hero-benefits { list-style: none; padding: 0; margin: 20px 0; display: grid; gap: 8px; font-size: 14px; line-height: 1.5; }
.hero-benefits li::before { content: '✓'; color: var(--green); margin-right: 9px; }
.hero-copy .hero-offer { font-size: 15px !important; line-height: 1.7; padding: 16px 18px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); }
.hero-copy .hero-fair { font-size: 13px; line-height: 1.65; margin-top: 14px; }
.hero-fair a { text-decoration: underline; text-underline-offset: 3px; }
.hero .trust { margin-top: 14px; }
.hero .hero-actions { margin-top: 20px; }
.hero-offer [data-price] { white-space: nowrap; }
.problem-head { max-width: 860px; }
.problem-card p, .step p, .faq-list p, .pilot-benefit p { font-size: 14px; }
.problem-grid { margin-top: 28px; }
.pilot-benefit .large { font-size: clamp(30px, 3.5vw, 42px); }
.pilot-condition { font-size: 14px; max-width: 900px; }
.pilot-exit { margin-top: 24px; padding: 23px 25px; border: 1px solid #708870; border-radius: 12px; max-width: 940px; }
.pilot-exit h3 { font-size: 20px; letter-spacing: -.4px; }
.pilot-exit p { font-size: 14px; color: #e0e9dc; margin-top: 10px; line-height: 1.7; }
.pilot-action p { font-size: 13px; }
.product-section .product-row { margin-top: 42px; gap: 24px; }
.product-copy .checks { margin-top: 16px; }
.audience-note { text-align: left; }
.tool-gallery-controls button, .real-link, .close { min-height: 44px; }
.close { min-width: 44px; }
.faq-list summary { min-height: 44px; align-items: center; font-size: 16px; }
.tool-real-frame img { aspect-ratio: 1.44; object-fit: contain; }
.tool-real-frame.mobile img { aspect-ratio: 390 / 844; }
.legal-copy { line-height: 1.75; font-size: 15px; }
.legal-copy h1 { font-size: 28px; margin-block: 18px; }
.legal-copy h2 { font-size: 22px; margin-block: 24px 12px; }
.legal-copy h3 { font-size: 18px; margin-block: 20px 10px; }
.legal-copy p, .legal-copy ul, .legal-copy ol { margin-block: 12px; }
.legal-copy a { text-decoration: underline; overflow-wrap: anywhere; }
.legal-copy table { display: block; overflow: auto; border-collapse: collapse; }
.legal-copy th, .legal-copy td { border: 1px solid var(--line); padding: 8px; text-align: left; }
@media (max-width: 850px) {
  .everyday-section { padding-top: 40px; }
  .section { padding-block: 52px; }
  .hero { padding-block: 32px; }
  .hero-copy > p { font-size: 15px; }
}
@media (max-width: 620px) {
  html { scroll-padding-top: 84px; }
  .wrap { width: calc(100% - 36px); }
  .hero { display: flex; flex-direction: column; gap: 26px; }
  .hero-stage { width: 100%; }
  .hero h1 { font-size: clamp(36px, 9.5vw, 48px); }
  .hero-copy .hero-offer { padding: 14px; font-size: 14px !important; }
  .hero-actions { display: grid; grid-template-columns: 1fr; width: 100%; }
  .hero-actions .button { width: 100%; min-height: 48px; font-size: 14px; }
  .pilot-pill { font-size: 11px; }
  .quick-benefits .wrap { gap: 12px; }
  .pilot-exit { padding: 20px; }
  .product-section .product-row { padding: 18px; }
  .product-copy h3 { font-size: 28px; }
  .feedback-note { padding: 22px; }
  .footer-links a { display: inline-flex; min-height: 44px; align-items: center; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}

/* Individual services and direct portal communication. */
.service-message-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:28px; }
.service-message-card { padding:28px; background:var(--paper); border:1px solid var(--line); border-radius:14px; }
.service-message-card h3 { font-size:25px; line-height:1.2; margin-bottom:16px; }
.service-message-card p { font-size:15px; color:var(--muted); }
.service-message-card .checks { font-size:14px; }
@media(max-width:768px) { .service-message-grid { grid-template-columns:1fr; } .service-message-card { padding:22px; } }

.why-section .problem-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.why-section .problem-card h3{margin-top:0}@media(max-width:900px){.why-section .problem-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.why-section .problem-grid{grid-template-columns:1fr}}

/* Public direction, explicitly separate from available product features. */
.roadmap-section{background:var(--paper);border-top:1px solid var(--line)}
.roadmap-section .lead{max-width:780px;margin-top:20px}
.roadmap-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:32px}
.roadmap-card{padding:28px;border:1px solid var(--line);border-radius:16px;background:#fff;min-width:0}
.roadmap-status{display:inline-block;border-radius:99px;background:#eee8f7;color:#604681;padding:6px 12px;font-size:13px;font-weight:650}
.roadmap-status.released{background:#e7efe5;color:#305940}
.roadmap-card h3{font-size:24px;line-height:1.25;margin:20px 0 14px}
.roadmap-card p{font-size:15px;color:var(--muted)}
.roadmap-card .roadmap-detail{font-size:13px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.roadmap-card .real-link{display:inline-block;margin-top:20px}
.roadmap-note{max-width:950px;margin-top:28px;font-size:14px;color:var(--muted)}
.roadmap-legend{margin-top:20px;font-size:14px;max-width:950px}.roadmap-legend summary{cursor:pointer;font-weight:650;padding:10px 0}.roadmap-legend p{margin-top:8px;color:var(--muted)}
.roadmap-feedback{margin-top:24px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px}.roadmap-feedback span{font-size:14px;color:var(--muted)}
@media(max-width:900px){.roadmap-grid{grid-template-columns:1fr}.roadmap-card{padding:24px}}

/* Compact feature navigation; preserve full-size original product previews. */
.feature-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.feature-tabs button{min-height:48px;padding:12px 20px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--deep);font:inherit;font-size:15px;font-weight:600;cursor:pointer}
.feature-tabs button[aria-selected="true"]{background:var(--green);border-color:var(--green);color:#fff}
.feature-tabs button:hover:not([aria-selected="true"]){background:#e7efe5}
.feature-tabs button:focus-visible{outline:3px solid #7959b5;outline-offset:3px}
.features-interactive .product-row[hidden]{display:none!important}
.features-interactive .product-row{margin-top:22px}
@media(max-width:620px){.feature-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.feature-tabs button{padding:12px 8px;font-size:13px}}
.feature-devices{display:flex;gap:8px;margin-top:16px}.feature-devices button{min-height:44px;padding:10px 16px;border:1px solid var(--line);border-radius:8px;background:white;color:var(--deep);cursor:pointer;font:inherit;font-size:14px}.feature-devices button[aria-pressed=true]{background:#e7efe5;border-color:var(--green);font-weight:650}.feature-devices button:focus-visible{outline:3px solid #7959b5;outline-offset:3px}
.features-interactive[data-device] .feature-shot button{aspect-ratio:auto}
.features-interactive[data-device] .feature-shot img{display:block;width:100%;height:auto;object-fit:contain;max-width:100%}
.features-interactive[data-device=mobile] .feature-shot{width:min(100%,390px);margin-inline:auto}
.features-interactive[data-device=desktop] .feature-shot{width:100%}

.feature-extras{margin-top:28px;padding:24px 0 0;border-top:1px solid var(--line)}
.feature-extras h3{font-size:20px;line-height:1.35;margin:0 0 16px}
.feature-extras ul{list-style:none;display:flex;flex-wrap:wrap;gap:14px 28px;padding:0;margin:0}
.feature-extras li{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--deep)}
.feature-extras svg{flex:none;color:var(--green)}
.feature-extras p{margin-top:14px;font-size:13px;color:var(--muted)}
@media(max-width:620px){.feature-extras ul{display:grid;grid-template-columns:1fr;gap:14px}.feature-extras{padding-top:20px}}

.roadmap-grid.roadmap-slider{display:block;margin-top:18px}
.roadmap-slider .roadmap-card[hidden]{display:none!important}
.roadmap-slider .roadmap-card{min-height:250px;padding:30px;max-width:none}
.roadmap-slider .roadmap-card p{max-width:850px}
.roadmap-choices{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.roadmap-choices button,.roadmap-controls button{min-height:44px;padding:10px 16px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--deep);font:inherit;font-size:14px;cursor:pointer}
.roadmap-choices button[aria-pressed=true]{background:var(--green);color:#fff;border-color:var(--green)}
.roadmap-choices button:focus-visible,.roadmap-controls button:focus-visible{outline:3px solid #7959b5;outline-offset:3px}
.roadmap-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:16px}
.roadmap-controls span{font-size:13px;color:var(--muted);text-align:center}
@media(max-width:620px){.roadmap-slider .roadmap-card{padding:22px;min-height:350px}.roadmap-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.roadmap-controls button{padding:10px 12px}}

.roadmap-invitation{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,.43fr);gap:36px;align-items:center;margin-top:32px;padding:36px;border:1px solid #c9d8c7;border-left:5px solid var(--green);border-radius:18px;background:#eaf1e7}
.roadmap-invitation .eyebrow{margin-bottom:12px;color:#43654e}
.roadmap-invitation h3{font-size:clamp(26px,3vw,34px);line-height:1.2;margin:0 0 16px;color:var(--deep)}
.roadmap-invitation p{font-size:16px;color:#425c4c;max-width:720px}
.roadmap-invitation .roadmap-invitation-hint{font-size:14px;margin-top:16px}
.roadmap-invitation-action .button{min-height:48px;width:100%;justify-content:center}
.roadmap-invitation-action p{font-size:13px;line-height:1.7;margin-top:14px}
.roadmap-invitation-action p a{text-decoration:underline;overflow-wrap:anywhere}
@media(max-width:768px){.roadmap-invitation{grid-template-columns:1fr;gap:24px;padding:24px}.roadmap-invitation-action{max-width:400px}.roadmap-invitation p{font-size:15px}.roadmap-invitation-action p{font-size:13px}}

/* Keep the separate existing-customer login and pilot CTA from crowding navigation. */
.nav-actions{flex-shrink:0}
@media(max-width:1100px){.nav-links{display:none}.menu-button{display:block}.nav-actions{margin-left:auto}}
