/* ============================================================
   PINGOU — readability layer
   Larger, calmer type for older readers. Loaded after every
   other stylesheet so it can set a consistent floor.
   ============================================================ */

:root {
  --read-xs: 0.8125rem;   /* 13px — only for short meta labels */
  --read-sm: 0.9375rem;   /* 15px */
  --read-base: 1.125rem;  /* 18px */
  --read-lg: 1.25rem;     /* 20px */
  --read-nav: 1.0625rem;  /* 17px */
}

body {
  font-size: var(--read-base);
  line-height: 1.68;
}

/* Headings breathe a little more; old eyes dislike cramped leading. */
h1, h2, h3, h4, h5, h6 { line-height: 1.08; }

/* ---------- announcement + header ---------- */
.promo-inner {
  height: 42px;
  font-size: 0.75rem;
  letter-spacing: 0.07em;
}
.site-header .nav { height: 88px; }
.brand { font-size: 1.4375rem; }
.brand-sup { font-size: 0.625rem; }
.nav-links a {
  padding: 11px 17px;
  font-size: var(--read-nav);
  font-weight: 500;
}
.nav-signin { font-size: 1rem; padding: 10px 12px; }
.nav-right { gap: 12px; }
.nav-auth { gap: 10px; }
.nav-toggle { width: 48px; height: 48px; }
.lang-btn {
  min-width: 32px;
  height: 30px;
  font-size: 0.8125rem;
}
.lang-btn[data-lang="ar"] { font-size: 0.9375rem; }

.mobile-menu a.m-link { font-size: 2rem; }
.mobile-menu a.m-link span { font-size: 0.8125rem; }
.mobile-menu .m-meta { font-size: 0.9375rem; }

.user-chip { height: 48px; }
.user-chip .u-name { font-size: 0.9375rem; }
.user-menu { width: 260px; }
.user-menu-head strong { font-size: 1rem; }
.user-menu-head span { font-size: 0.875rem; }
.user-menu a, .user-menu button {
  padding: 12px 10px;
  font-size: 0.9375rem;
}

/* ---------- shared type ---------- */
.eyebrow {
  font-size: var(--read-xs);
  letter-spacing: 0.12em;
  line-height: 1.3;
}
.hero-eyebrow-row .loc { font-size: 0.75rem; }
.hero-eyebrow-row .sep { width: 34px; }

.btn {
  height: 56px;
  padding: 0 27px;
  font-size: 1rem;
}
.btn--sm { height: 46px; padding: 0 19px; font-size: 0.875rem; }
.btn--lg { height: 62px; padding: 0 32px; font-size: 1.0625rem; }
.link-arrow { font-size: 1rem; }
.pill, .tag { font-size: 0.75rem; }
.pill { padding: 8px 13px; }

/* ---------- hero ---------- */
.hero { padding: 66px 0 86px; }
.hero h1 {
  font-size: clamp(3rem, 5.05vw, 5rem);
  line-height: 1;
  max-width: 13.5ch;
}
.hero-sub {
  margin-top: 28px;
  font-size: clamp(1.125rem, 1.3vw, 1.25rem);
  line-height: 1.7;
  max-width: 45ch;
}
.hero-actions { margin-top: 36px; gap: 14px; }
.hero-price { margin-top: 36px; padding-top: 26px; gap: 14px; }
.hero-price .hp-num { font-size: 2.625rem; }
.hero-price .hp-num small { font-size: 0.875rem; }
.hero-price p { font-size: 0.9375rem; line-height: 1.5; max-width: 220px; }
.hero-avail { font-size: 0.75rem; }
.float-metric { left: 4px; top: -8px; }
.float-order { width: 192px; }
.float-order .fo-top span { font-size: 0.6875rem; }
.float-order strong { font-size: 1.5rem; }
.float-order small { font-size: 0.75rem; }
.float-chip { font-size: 0.75rem; }
.browser-url { font-size: 0.625rem; }

/* ---------- client strip + stats ---------- */
.trust-strip .marquee-label { font-size: 0.75rem; }
.logo-item span { font-size: 1.125rem; }
.logo-item em { font-size: 0.6875rem; }
.logo-item .glyph { width: 24px; height: 24px; font-size: 0.6875rem; }
.stat .s-val { font-size: clamp(2.5rem, 3.6vw, 3.25rem); }
.stat p { margin-top: 12px; font-size: 0.8125rem; line-height: 1.45; }

/* ---------- section headers ---------- */
.section { padding: 112px 0; }
.sec-head { margin-bottom: 52px; }
.sec-head h2 { line-height: 1.06; }
.sec-head .sec-side p { font-size: 1.125rem; line-height: 1.72; }
.sec-head .sec-side .link-arrow { margin-top: 20px; }

/* ---------- services ---------- */
.service-card { padding: 30px; }
.service-card h3 { font-size: 1.625rem; }
.service-card p { margin-top: 11px; font-size: 1.0625rem; line-height: 1.65; }
.sc-index { font-size: 0.8125rem; }
.sc-price { font-size: 0.875rem; line-height: 1.5; }
.sc-arrow { width: 40px; height: 40px; }

/* ---------- app showcase ---------- */
.app-copy p { font-size: 1.125rem; line-height: 1.7; }
.app-point { font-size: 1.0625rem; line-height: 1.5; }
.app-point small { font-size: 0.9375rem; line-height: 1.55; margin-top: 4px; }
.tech-chip { font-size: 0.8125rem; padding: 7px 10px; }
.app-price { font-size: 0.875rem; }
.app-price strong { font-size: 1.375rem; }

/* ---------- process ---------- */
.process-step { padding: 26px 24px 28px; }
.ps-top { margin-bottom: 34px; }
.ps-num { font-size: 0.8125rem; }
.ps-icon { width: 40px; height: 40px; }
.process-step h3 { font-size: 1.375rem; }
.process-step p { margin-top: 10px; font-size: 1rem; line-height: 1.65; min-height: 0; }
.ps-meta { margin-top: 18px; padding-top: 14px; font-size: 0.75rem; }

/* ---------- pricing ---------- */
.pricing-grid { gap: 14px; }
.plan-card { padding: 26px 22px; }
.pc-badge-slot { min-height: 28px; margin-bottom: 12px; }
.pc-index { font-size: 0.75rem; }
.plan-card h3 { font-size: 1.6875rem; }
.pc-kicker { font-size: 0.75rem; line-height: 1.4; }
.pc-price { margin-top: 22px; }
.pc-price .amt { font-size: 3rem; }
.pc-price .cur b { font-size: 0.875rem; }
.pc-price .cur small { font-size: 0.6875rem; }
.pc-blurb { margin-top: 16px; font-size: 1rem; line-height: 1.6; min-height: 0; }
.plan-card .btn {
  margin-top: 20px;
  height: auto;
  min-height: 50px;
  padding: 10px 12px;
  font-size: 0.9375rem;
  line-height: 1.3;
  white-space: normal;
  text-align: center;
}
.pc-features { margin-top: 22px; padding-top: 18px; gap: 12px; }
.pc-features li { font-size: 0.9375rem; line-height: 1.55; }
.pc-features .check { width: 17px; height: 17px; margin-top: 2px; }
.pc-delivery { margin-top: 20px; padding-top: 14px; font-size: 0.8125rem; line-height: 1.5; }
.pricing-foot { margin-top: 30px; padding-top: 24px; }
.pricing-foot .pf-note { font-size: 0.9375rem; line-height: 1.6; }
.pricing-foot .pf-links { font-size: 1rem; gap: 24px; }

/* ---------- trust / guarantees ---------- */
.trust-copy p { font-size: 1.125rem; line-height: 1.72; }
.guarantee { padding: 26px; }
.guarantee strong { font-size: 1.125rem; line-height: 1.4; }
.guarantee p { margin-top: 7px; font-size: 0.9375rem; line-height: 1.6; }
.pay-chip { font-size: 0.75rem; }
.pb-label, .pay-band-secure { font-size: 0.8125rem; }

/* ---------- testimonials ---------- */
.quote-card { padding: 26px; }
.quote-card blockquote { font-size: 1.1875rem; line-height: 1.55; }
.qc-metric { font-size: 0.75rem; }
.qc-person > div strong { font-size: 0.9375rem; }
.qc-person > div span { font-size: 0.8125rem; }

/* ---------- FAQ ---------- */
.faq-intro p { font-size: 1.0625rem; line-height: 1.7; }
.faq-intro .faq-contact { font-size: 0.9375rem; padding: 12px 17px; }
.faq-q { font-size: 1.125rem; line-height: 1.5; }
.faq-a p { font-size: 1.0625rem; line-height: 1.72; }
.fq-icon { width: 38px; height: 38px; }

/* ---------- final CTA ---------- */
.cta-panel { padding: 78px 64px; }
.cta-panel p { font-size: 1.125rem; line-height: 1.7; }
.cta-meta { font-size: 0.75rem; line-height: 1.5; }

/* ---------- footer ---------- */
.footer-brand p { font-size: 1rem; line-height: 1.7; }
.footer-status { font-size: 0.8125rem; }
.footer-col h4 { font-size: 0.75rem; margin-bottom: 18px; }
.footer-col a, .footer-col p { font-size: 1rem; line-height: 1.5; margin-bottom: 12px; }
.footer-col .foot-note { font-size: 0.875rem; line-height: 1.6; }
.pay-mini { font-size: 0.75rem; padding: 6px 9px; }
.footer-bottom { font-size: 0.8125rem; line-height: 1.6; padding: 26px 0; }

/* ---------- toasts / modal ---------- */
.toast { font-size: 0.9375rem; padding: 16px 18px; }
.toast strong { font-size: 1rem; }
.modal-head h3 { font-size: 1.625rem; }
.modal-head p { font-size: 1rem; }
.modal-close { width: 40px; height: 40px; }

/* ---------- legal / long-form pages ---------- */
.legal-body p, .legal-body li { font-size: 1.0625rem; line-height: 1.8; }
.legal-body h2 { font-size: 1.75rem; }

/* ---------- work page ---------- */
.page-hero .crumb { font-size: 0.75rem; }
.page-hero-side p { font-size: 1.125rem; line-height: 1.72; }
.page-hero-meta { font-size: 0.75rem; line-height: 1.5; }
.filter-btn { font-size: 0.9375rem; padding: 10px 16px; }
.work-count { font-size: 0.75rem; }
.project-info p { font-size: 1.0625rem; line-height: 1.65; }
.pi-result { font-size: 0.8125rem; line-height: 1.5; }
.pi-stack { font-size: 0.75rem; }
.case-kicker { font-size: 0.8125rem; line-height: 1.5; }
.case-head .case-tagline { font-size: 1.125rem; line-height: 1.65; }
.case-section h4 { font-size: 0.75rem; }
.case-section p { font-size: 1.0625rem; line-height: 1.75; }
.case-result strong { font-size: 1.75rem; }
.case-result span { font-size: 0.8125rem; line-height: 1.5; }
.case-quote p { font-size: 1.1875rem; line-height: 1.55; }
.case-quote .cq-person > div strong { font-size: 0.9375rem; }
.case-quote .cq-person > div span { font-size: 0.8125rem; }

/* ---------- plans / comparison ---------- */
.plan-lg .lg-kicker { font-size: 0.75rem; }
.plan-lg .lg-blurb { font-size: 1.0625rem; line-height: 1.7; }
.plan-lg .lg-price .cur { font-size: 0.9375rem; }
.plan-lg .lg-price .cur small { font-size: 0.75rem; }
.plan-lg .lg-foot { font-size: 0.8125rem; line-height: 1.5; }
.compare { font-size: 1rem; }
.compare th:first-child, .compare td:first-child { font-size: 1rem; }
.compare thead th { font-size: 1.0625rem; }
.compare thead th span { font-size: 0.8125rem; }
.compare td { font-size: 0.9375rem; }
.plan-help p { font-size: 1.0625rem; }
.plan-help-card .ph-row { font-size: 1rem; padding: 15px 0; }
.plan-help-card .ph-row span:last-child { font-size: 0.8125rem; }
.addon-row-mini { font-size: 1rem; }
.addon-row-mini b { font-size: 0.8125rem; }
.start-note { font-size: 0.875rem; }
.hosting-card h3 { font-size: 1.125rem; }
.hosting-card p { font-size: 0.9375rem; }
.hc-head p { font-size: 0.9375rem; }
.hc-kicker { font-size: 0.75rem; }
.hc-price small { font-size: 0.75rem; }
.hc-tier-top span { font-size: 0.9375rem; }
.hc-tier-top b { font-size: 0.8125rem; }
.hc-specs { font-size: 0.8125rem; line-height: 1.65; }
.hc-tier small { font-size: 0.8125rem; }
.hc-note { font-size: 0.8125rem !important; }
.pf-note, .compare-note { line-height: 1.6; }

/* ============================================================
   App flows — auth, studio wizard, checkout, invoice
   ============================================================ */

.app-header-inner { height: 80px; }
.app-header .brand { font-size: 1.25rem; }
.app-breadcrumb { font-size: 0.75rem; line-height: 1.5; }
.app-header-right .back-link { font-size: 0.9375rem; }
.app-back-link { font-size: 0.9375rem; }
.app-footer-mini { font-size: 0.75rem; line-height: 1.6; }

/* forms */
.label { font-size: 0.9375rem; line-height: 1.5; }
.label .opt { font-size: 0.6875rem; }
.field-hint { font-size: 0.875rem; line-height: 1.55; }
.field-error { font-size: 0.875rem; }
.input, .select, .textarea {
  min-height: 54px;
  padding: 14px 15px;
  font-size: 1.0625rem;
  line-height: 1.5;
}
.textarea { min-height: 130px; }
.input::placeholder, .textarea::placeholder { font-size: 1rem; }
.select { padding-right: 44px; }
.input[type="file"] { font-size: 0.9375rem; }
.input[type="file"]::file-selector-button { font-size: 0.875rem; padding: 7px 12px; }
.input-group .input { padding-left: 44px; }
.input-group .input-action { font-size: 0.8125rem; }
.checkbox { font-size: 0.9375rem; line-height: 1.55; }
.radio-tile { padding: 16px; }
.radio-tile strong { font-size: 1rem; }
.radio-tile span { font-size: 0.9375rem; line-height: 1.5; }
.chip { font-size: 0.9375rem; padding: 10px 14px; }
.chip.lg { font-size: 1rem; padding: 12px 18px; }
.switch-row .sw-txt strong { font-size: 1rem; }
.switch-row .sw-txt span { font-size: 0.875rem; line-height: 1.5; }
.upload-box strong { font-size: 1rem; }
.upload-box span { font-size: 0.875rem; }
.upload-box .btn { font-size: 0.875rem; }
.upload-file { font-size: 0.75rem; }

/* auth */
.auth-card .auth-sub { font-size: 1rem; line-height: 1.65; }
.auth-topbar .auth-top-right a { font-size: 0.9375rem; }
.auth-tabs { margin-top: 30px; }
.auth-tab { height: 44px; font-size: 0.9375rem; }
.social-btn { height: 52px; font-size: 0.9375rem; }
.social-btn .sb-demo { font-size: 0.6875rem; }
.auth-divider { font-size: 0.75rem; }
.auth-form .field label { font-size: 0.9375rem; }
.auth-form .input { height: 54px; min-height: 54px; font-size: 1.0625rem; }
.auth-submit { height: 56px; font-size: 1rem; }
.auth-row .checkbox, .auth-row .forgot { font-size: 0.875rem; }
.auth-switch { font-size: 0.9375rem; line-height: 1.6; padding-top: 22px; }
.auth-legal { font-size: 0.8125rem; line-height: 1.65; }
.demo-box { font-size: 0.875rem; line-height: 1.55; padding: 12px 14px; }
.demo-box button { font-size: 0.875rem; }
.auth-error { font-size: 0.875rem; line-height: 1.55; }
.oauth-account strong { font-size: 1rem; }
.oauth-account span { font-size: 0.875rem; }
.oauth-note { font-size: 0.8125rem; line-height: 1.6; }
.oauth-provider { font-size: 0.75rem; }
.av-quote-card blockquote { font-size: 1.3125rem; line-height: 1.5; }
.av-person > div strong { font-size: 0.9375rem; }
.av-person > div span { font-size: 0.8125rem; }
.av-estimate .ae-head { font-size: 0.6875rem; }
.av-estimate .ae-row { font-size: 0.9375rem; }
.av-estimate .ae-total span { font-size: 0.75rem; }
.av-step { font-size: 0.75rem; }
.auth-session { font-size: 0.875rem; }
.auth-session a, .auth-session button { font-size: 0.875rem; }

/* studio surfaces */
.studio { width: min(1340px, calc(100% - 56px)); }
.side-plan-head .sp-label { font-size: 0.75rem; }
.side-plan-head a { font-size: 0.875rem; }
.side-plan h3 { font-size: 1.5rem; }
.side-plan .sp-kicker { font-size: 0.9375rem; }
.side-plan .sp-price strong { font-size: 1.75rem; }
.side-plan .sp-price span { font-size: 0.8125rem; }
.side-plan .sp-meta { font-size: 0.6875rem; line-height: 1.5; }
.step-rail-item { font-size: 0.9375rem; padding: 10px 0; }
.step-rail-item .sr-dot { width: 30px; height: 30px; font-size: 0.75rem; }
.step-rail-item:not(:last-child)::before { left: 14.5px; top: 40px; }
.step-rail-item .sr-time { font-size: 0.75rem; }
.se-head { font-size: 0.8125rem; padding: 16px 18px; }
.se-line { font-size: 0.9375rem; padding: 7px 0; line-height: 1.5; }
.se-line b { font-size: 0.875rem; }
.se-total span { font-size: 0.75rem; }
.se-total strong { font-size: 1.75rem; }
.se-total strong small { font-size: 0.75rem; }
.se-note { font-size: 0.8125rem; line-height: 1.55; padding: 0 18px 16px; }
.side-help { font-size: 0.9375rem; line-height: 1.6; }
.side-help strong { font-size: 1rem; }
.wizard-top .wt-labels { font-size: 0.75rem; }
.wizard-top .wt-total { font-size: 1.25rem; }
.wizard-top .wt-total small { font-size: 0.75rem; }
.wizard-head .wh-eyebrow { font-size: 0.75rem; }
.wizard-head p { font-size: 1.0625rem; line-height: 1.65; }
.wizard-head .wh-right { font-size: 0.75rem; }
.wizard-actions .wa-note { font-size: 0.75rem; line-height: 1.5; }
.step-lead { font-size: 1.0625rem; line-height: 1.65; }
.chips-label { font-size: 0.9375rem; }
.addon-info strong { font-size: 1rem; }
.addon-info span { font-size: 0.9375rem; line-height: 1.5; }
.addon-price { font-size: 0.875rem; }
.addon-price small { font-size: 0.75rem; }
.addon-qty button { width: 32px; height: 32px; font-size: 1rem; }
.addon-qty span { font-size: 0.9375rem; }
.style-card strong { font-size: 1rem; }
.style-card .style-desc { font-size: 0.875rem; line-height: 1.5; }
.review-block-head h4 { font-size: 0.75rem; }
.review-block-head button { font-size: 0.875rem; }
.review-row { font-size: 0.9375rem; line-height: 1.6; grid-template-columns: 150px 1fr; }
.review-summary-item span { font-size: 0.75rem; }
.review-total .rt-label { font-size: 0.75rem; }
.review-total .rt-label strong { font-size: 1rem; }
.review-total .rt-val { font-size: 2rem; }
.terms-box .checkbox { font-size: 0.9375rem; }
.review-plan-strip span { font-size: 0.8125rem; }
.review-plan-strip strong { font-size: 1rem; }

/* dashboard */
.dash-head p { font-size: 1.0625rem; }
.dash-stat span { font-size: 0.75rem; line-height: 1.4; }
.dash-section-head h2 { font-size: 1.25rem; }
.dash-section-head a { font-size: 0.875rem; }
.draft-info strong { font-size: 1rem; }
.draft-info span { font-size: 0.875rem; }
.draft-progress .dp-top { font-size: 0.75rem; }
.draft-total small { font-size: 0.75rem; }
.draft-card .btn { height: 42px; font-size: 0.875rem; }
.dash-empty p { font-size: 1rem; }
.dash-side-card h3 { font-size: 0.75rem; }
.profile-row > div strong { font-size: 1rem; }
.profile-row > div span { font-size: 0.875rem; }
.dash-links a { font-size: 0.9375rem; padding: 11px 0; }
.order-status { font-size: 0.75rem; }
.order-info strong { font-size: 1rem; }
.order-info span { font-size: 0.75rem; }
.order-amount { font-size: 1.25rem; }

/* checkout */
.co-step { font-size: 0.9375rem; }
.co-step .cs-dot { width: 28px; height: 28px; font-size: 0.75rem; }
.co-card-head p { font-size: 1rem; }
.co-card-head .edit-link { font-size: 0.875rem; }
.billing-strip strong { font-size: 1rem; }
.billing-strip span, .billing-strip a { font-size: 0.875rem; }
.pay-method { padding: 16px; }
.pay-method .pm-name { font-size: 1rem; }
.pay-method .pm-name .pm-tag { font-size: 0.6875rem; }
.pay-method .pm-desc { font-size: 0.9375rem; line-height: 1.5; }
.pay-note { font-size: 0.875rem; line-height: 1.6; }
.checkout-submit-row .csr-note { font-size: 0.8125rem; }
.sandbox-note { font-size: 0.8125rem; line-height: 1.55; }
.summary-head h2 { font-size: 0.75rem; }
.summary-head span { font-size: 0.75rem; }
.summary-plan strong { font-size: 1.0625rem; }
.summary-plan span { font-size: 0.9375rem; }
.summary-line { font-size: 0.9375rem; padding: 7px 0; line-height: 1.5; }
.summary-line b { font-size: 0.875rem; }
.summary-total span { font-size: 0.75rem; }
.summary-total strong { font-size: 2rem; }
.summary-total strong small { font-size: 0.75rem; }
.summary-trust span { font-size: 0.8125rem; }
.summary-payrow p { font-size: 0.8125rem; }
.summary-payrow .pay-chip { font-size: 0.6875rem; }
.pay-overlay-card h3 { font-size: 1.5rem; }
.pay-overlay-card p { font-size: 1rem; line-height: 1.6; }
.pay-step { font-size: 0.875rem; }
.pay-step .ps-dot { width: 20px; height: 20px; font-size: 0.6875rem; }
.pay-overlay-card .secure-note { font-size: 0.75rem; }
.co-next-item strong { font-size: 1rem; }
.co-next-item small { font-size: 0.875rem; }

/* invoice */
.invoice-topbar .inv-back { font-size: 0.9375rem; }
.invoice-topbar .inv-brand { font-size: 1.1875rem; }
.inv-brand-block .inv-logo { font-size: 1.3125rem; }
.inv-brand-block p { font-size: 0.9375rem; line-height: 1.6; }
.inv-status .inv-num { font-size: 0.875rem; }
.inv-meta h4 { font-size: 0.75rem; }
.inv-meta p { font-size: 0.9375rem; line-height: 1.6; }
.inv-table th { font-size: 0.75rem; }
.inv-table td { font-size: 1rem; }
.inv-table td .it-desc { font-size: 0.8125rem; }
.inv-table td .it-amt { font-size: 0.9375rem; }
.inv-total-row { font-size: 1rem; }
.inv-total-row.grand { font-size: 1.125rem; }
.inv-total-row.grand b { font-size: 1.75rem; }
.inv-paid { font-size: 0.75rem; }
.inv-notes h4 { font-size: 0.75rem; }
.inv-notes p { font-size: 0.9375rem; line-height: 1.65; }
.inv-notes .inv-next span { font-size: 0.9375rem; line-height: 1.55; }
.inv-foot { font-size: 0.75rem; line-height: 1.6; }
.inv-sandbox { font-size: 0.8125rem; line-height: 1.55; }
.invoice-help { font-size: 0.9375rem; }
.invoice-empty p { font-size: 1.0625rem; }
.invoice-list-head p { font-size: 1rem; }
.invoice-list-row .ilr-main strong { font-size: 1.0625rem; }
.invoice-list-row .ilr-main span { font-size: 0.8125rem; }
.invoice-list-row .ilr-date { font-size: 0.875rem; }
.invoice-list-row .ilr-link { font-size: 0.9375rem; }
.inv-paid-badge { font-size: 0.6875rem; }
.invoice-empty-state p { font-size: 1.0625rem; }
.inv-recurring h4 { font-size: 0.75rem; }
.inv-recurring-row, .inv-recurring-row b, .inv-recurring-total, .inv-recurring-total b { font-size: 0.9375rem; }
.mp-head strong { font-size: 1rem; }
.mp-head span { font-size: 0.875rem; }
.mp-row > span, .mp-ref > span { font-size: 0.8125rem; }
.mp-row strong { font-size: 0.9375rem; }
.mp-ref strong { font-size: 1rem; }
.mp-copy { font-size: 0.75rem; padding: 5px 8px; }
.crypto-amount > span, .crypto-amount small, .crypto-address span { font-size: 0.8125rem; }
.crypto-address code { font-size: 0.875rem; }
.network-warning { font-size: 0.8125rem; }

/* ---------- mobile: keep the floor sensible ---------- */
@media (max-width: 1080px) {
  .nav-links a { font-size: 1rem; padding: 10px 12px; }
}

@media (max-width: 900px) {
  .nav-auth .btn { height: 48px; padding: 0 18px; font-size: 0.9375rem; }
  .hero { padding: 44px 0 64px; }
  .hero h1 { font-size: clamp(2.9rem, 9.8vw, 4rem); }
  .hero-sub { font-size: 1.125rem; }
  .section { padding: 84px 0; }
  .sec-head { margin-bottom: 38px; }
  .sec-head .sec-side p { font-size: 1.0625rem; }
  .cta-panel { padding: 56px 28px; }
}

@media (max-width: 720px) {
  body { font-size: 1.0625rem; }
  .promo-inner { height: 38px; font-size: 0.6875rem; }
  .site-header .nav { height: 72px; }
  .brand { font-size: 1.25rem; }
  .brand-mark, .brand-mark svg { width: 26px; height: 26px; }
  .hero h1 { font-size: clamp(2.55rem, 10.8vw, 3.35rem); }
  .hero-sub { font-size: 1.0625rem; line-height: 1.7; }
  .hero-actions .btn { height: 56px; padding: 0 20px; font-size: 0.9375rem; }
  .hero-price { flex-wrap: wrap; }
  .hero-price .hp-num { font-size: 2.25rem; }
  .hero-avail { margin-left: 0; }
  .stat { padding: 0 18px; }
  .stat p { font-size: 0.75rem; }
  .sec-head h2 { line-height: 1.08; }
  .sec-head .sec-side p { font-size: 1rem; }
  .service-card { padding: 24px; }
  .service-card h3 { font-size: 1.4375rem; }
  .service-card p { font-size: 1rem; }
  .process-step { padding: 22px; }
  .process-step h3 { font-size: 1.25rem; }
  .process-step p { font-size: 0.9375rem; }
  .plan-card { padding: 24px; }
  .plan-card h3 { font-size: 1.5rem; }
  .pc-price .amt { font-size: 2.75rem; }
  .pc-blurb { font-size: 1rem; }
  .pc-features li { font-size: 0.9375rem; }
  .plan-lg .lg-price .amt { font-size: 3.25rem; }
  .faq-q { font-size: 1.0625rem; }
  .faq-a p { font-size: 1rem; }
  .quote-card blockquote { font-size: 1.125rem; }
  .cta-panel { padding: 48px 22px; }
  .cta-panel p { font-size: 1.0625rem; }
  .footer-brand p, .footer-col a, .footer-col p { font-size: 0.9375rem; }
  .footer-bottom { font-size: 0.6875rem; }
  .project-info h3 { font-size: 1.5rem; }
  .project-info p { font-size: 1rem; }
  .case-head .case-tagline { font-size: 1.0625rem; }
  .case-section p { font-size: 1rem; }
  .compare td { font-size: 0.875rem; }
  .compare thead th { font-size: 0.9375rem; }
  .hosting-card { padding: 22px; }
  .input, .select, .textarea { font-size: 1rem; }
  .review-row { grid-template-columns: 1fr; gap: 2px; }
  .review-row dt { margin-top: 8px; }
  .wizard-head p { font-size: 1rem; }
  .side-plan .sp-price strong { font-size: 1.5rem; }
  .summary-line, .se-line { font-size: 0.875rem; }
  .inv-table td { font-size: 0.9375rem; }
  .inv-table td .it-desc { font-size: 0.8125rem; }
  .invoice-topbar .inv-back { font-size: 0.875rem; }
  .inv-btn { height: 40px; padding: 0 12px; font-size: 0.8125rem; }
  .app-header-inner { height: 72px; }
}

@media (max-width: 430px) {
  .hero h1 { font-size: clamp(2.3rem, 11.5vw, 3rem); }
  .hero-eyebrow-row { gap: 8px 10px; }
  .hero-eyebrow-row .loc { display: none; }
  .eyebrow { font-size: 0.75rem; }
  .btn { font-size: 0.9375rem; }
  .filter-btn { font-size: 0.875rem; padding: 9px 13px; }
}

/* ============================================================
   Surface polish — brighter cards, clearer form fields
   ============================================================ */

.service-card,
.process-step,
.plan-card,
.guarantee,
.quote-card,
.plan-help-card,
.hosting-card,
.side-card,
.wizard-card,
.checkout-card,
.summary-card,
.dash-stat,
.dash-side-card,
.draft-card,
.order-card {
  background: var(--panel);
  border-color: rgba(var(--tint), 0.16);
  box-shadow: 0 2px 0 rgba(255, 255, 255, 0.7) inset, 0 14px 34px rgba(31, 36, 42, 0.05);
}

.service-card:hover,
.process-step:hover,
.plan-card:hover,
.quote-card:hover,
.plan-lg:hover {
  background: #fffefb;
  border-color: rgba(var(--tint), 0.28);
  box-shadow: 0 2px 0 rgba(255, 255, 255, 0.8) inset, 0 22px 48px rgba(31, 36, 42, 0.09);
}

.plan-card--featured {
  background:
    radial-gradient(110% 70% at 50% 0%, rgba(11, 122, 93, 0.1), transparent 70%),
    #fffdf9;
  border-color: rgba(11, 122, 93, 0.4);
  box-shadow: 0 18px 44px rgba(11, 122, 93, 0.1);
}

.input, .select, .textarea {
  background: #fffdf9;
  border-color: rgba(var(--tint), 0.22);
}
.input:hover, .select:hover, .textarea:hover { border-color: rgba(var(--tint), 0.34); }
.input:focus, .select:focus, .textarea:focus {
  border-color: var(--mint);
  background: #ffffff;
  box-shadow: 0 0 0 4px rgba(11, 122, 93, 0.1);
}
.pay-fields { background: rgba(var(--tint), 0.035); }
.select option { background: #fffdf9; }

.label .opt { color: var(--muted); font-size: 0.75rem; letter-spacing: 0.04em; }
.field-hint { color: var(--muted); }

/* Slightly stronger default focus for keyboard users. */
:focus-visible {
  outline: 3px solid var(--mint);
  outline-offset: 3px;
}

/* Larger tap targets on phones. */
@media (max-width: 720px) {
  .container { width: calc(100% - 32px); }
  .promo-inner {
    height: auto;
    min-height: 38px;
    padding: 8px 16px;
    line-height: 1.45;
    align-items: flex-start;
    text-align: left;
  }
  .app-header-inner { width: calc(100% - 28px); gap: 8px; }
  .app-header-right { gap: 6px; }
  .auth-topbar { width: calc(100% - 32px); gap: 10px; }
  .auth-topbar .auth-top-right { gap: 4px; }
  .auth-topbar .auth-top-right a {
    white-space: nowrap;
    font-size: 0.875rem;
    padding: 7px 7px;
  }
  .auth-topbar .brand { font-size: 1.125rem; }
  .filter-btn, .chip, .addon-qty button { min-height: 44px; }
  .lang-btn { min-width: 34px; height: 32px; }
}

@media (max-width: 520px) {
  .app-header-right .back-link { display: none; }
  .app-header .brand-sup { display: none; }
  .app-header .lang-btn { min-width: 28px; height: 28px; padding: 0 4px; font-size: 0.75rem; }
  .app-header .lang-switch { padding: 2px; }
  .auth-topbar .auth-top-right a:last-child { display: none; }
  .auth-topbar .brand-sup { display: none; }
  .auth-main { width: calc(100% - 32px); }
  .promo-inner { font-size: 0.6875rem; }
  .hero-price { max-width: none; }
  .hero-avail { white-space: nowrap; }
}

@media (max-width: 900px) {
  /* The language switcher lives inside the mobile menu on small screens. */
  .site-header .lang-switch { display: none; }
  .site-header .nav { gap: 12px; }
}

@media (min-width: 1101px) and (max-width: 1360px) {
  .pricing-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Comparison tables: keep the feature name visible while swiping. */
.compare-wrap { scrollbar-color: var(--muted-2) transparent; scrollbar-width: thin; }
@media (max-width: 900px) {
  .compare th:first-child,
  .compare td:first-child {
    position: sticky;
    inset-inline-start: 0;
    z-index: 2;
    background: var(--panel);
    box-shadow: 1px 0 0 var(--line);
  }
  .compare td:first-child { white-space: normal; min-width: 150px; }
}

/* Mobile comparison hint */
.compare-hint {
  display: none;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  font-size: 0.875rem;
  color: var(--muted);
}
@media (max-width: 900px) {
  .compare-hint { display: flex; }
}

/* Keep the hero price row on one calm line where space allows. */
.hero-price { max-width: 560px; }
.hero-price p { max-width: 235px; }
.hero-avail { white-space: nowrap; }

.hero-avail { font-size: 0.8125rem; }
.trust-strip .marquee-label { font-size: 0.8125rem; }
.pi-stack { font-size: 0.8125rem; }
.project-year { font-size: 0.75rem; }
.auth-page { overflow-x: clip; }

/* Wizard footer: stack the actions before they collide on tablets. */
@media (max-width: 980px) {
  .wizard-actions {
    flex-wrap: wrap;
    gap: 10px;
    padding: 18px 22px 22px;
  }
  .wizard-actions .wa-left {
    order: 1;
    width: 100%;
    justify-content: space-between;
  }
  .wizard-actions .btn--next {
    order: 2;
    width: 100%;
    min-width: 0;
    margin-top: 2px;
  }
  .wizard-actions .wa-note { display: none; }
}

.co-card-head h1 { font-size: 1.625rem; line-height: 1.2; }
.co-card-head p { font-size: 1.0625rem; }
.co-card-head .edit-link { font-size: 0.9375rem; }
@media (max-width: 600px) {
  .co-card-head { flex-direction: column; align-items: flex-start; gap: 8px; }
}

.legal-body { max-width: 720px; }
.invoice-success strong { font-size: 1rem; }
.invoice-success span { font-size: 0.875rem; line-height: 1.5; }
@media (max-width: 720px) {
  .invoice-success strong { font-size: 1rem; }
  .invoice-success span { font-size: 0.875rem; }
}

/* Collapse the main navigation before the larger type starts to crowd it. */
@media (max-width: 1040px) {
  .site-header .nav-links { display: none; }
  .site-header .nav-toggle { display: grid; }
  .site-header .lang-switch { display: none; }
}

.float-order { width: 208px; }
.float-order small { white-space: nowrap; }