/* EatRate public website + authentication layouts. Area-only layout; tokens only, no raw colours. */

/* ---------- Shared editorial helpers ---------- */
.erp-section{padding-block:var(--space-10)}
.erp-section + .erp-section{border-top:1px solid var(--er-border)}
.erp-prose{max-width:72ch;display:grid;gap:var(--space-4);line-height:1.65}
.erp-prose p{color:var(--er-ink-700)}
.erp-prose h2{font-size:var(--text-xl);margin-top:var(--space-4)}
.erp-prose details{background:var(--er-surface);border:1px solid var(--er-border);border-radius:var(--radius-md);padding:var(--space-4)}
.erp-prose summary{cursor:pointer;font-weight:650;min-height:24px}
.erp-prose details p{margin-top:var(--space-2)}
.erp-kicker{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}
.erp-collection{display:grid;gap:var(--space-4);grid-template-columns:1fr}
.erp-collection-4{display:grid;gap:var(--space-4);grid-template-columns:1fr}
.erp-feature{display:grid;gap:var(--space-2);align-content:start}
.erp-feature .er-icon{color:var(--er-brand)}
.erp-feature h3{font-size:var(--text-base)}
.erp-muted-box{background:var(--er-surface-muted);border:1px solid var(--er-border);border-radius:var(--radius-md);padding:var(--space-4)}
.erp-meta-list{display:grid;gap:var(--space-3);margin:0}
.erp-meta-list div{display:grid;gap:2px}
.erp-meta-list dt{font-size:var(--text-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--er-text-secondary)}
.erp-meta-list dd{margin:0;font-weight:600}
.erp-map{height:280px;border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--er-border);background:var(--er-stone-100)}
.erp-avatar{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--er-forest-100);color:var(--er-forest-900);font-family:var(--font-display);font-weight:800;font-size:var(--text-xl);flex:none}
.erp-avatar-lg{width:96px;height:96px;font-size:var(--text-3xl)}
.erp-person{display:grid;gap:var(--space-3);align-content:start;background:var(--er-surface);border:1px solid var(--er-border);border-radius:var(--radius-lg);padding:var(--space-4)}
.erp-person h3{font-size:var(--text-base)}
a.erp-person{color:var(--er-text);text-decoration:none;transition:border-color var(--motion-fast) var(--ease-standard)}
a.erp-person:hover{border-color:var(--er-border-strong);color:var(--er-text)}
.erp-auth-brand ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-3)}
.erp-auth-brand li{display:flex;gap:var(--space-3);align-items:flex-start}
.erp-auth-brand li .er-icon{color:var(--er-brand);margin-top:2px}
.erp-search{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:flex-end}
.erp-search .er-field{flex:1 1 240px;margin:0}
.erp-post{display:grid;gap:var(--space-3);background:var(--er-surface);border:1px solid var(--er-border);border-radius:var(--radius-lg);padding:var(--space-4)}
.erp-post img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius-md)}
.erp-plan{display:grid;gap:var(--space-3);align-content:start;background:var(--er-surface);border:1px solid var(--er-border);border-radius:var(--radius-lg);padding:var(--space-6)}
.erp-plan .erp-plan-price{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:800;font-variant-numeric:tabular-nums}
.erp-inline-form{display:inline}

/* ---------- Landing ---------- */
.erp-hero{display:grid;gap:var(--space-8);padding-block:var(--space-8) var(--space-10)}
.erp-hero-copy{display:grid;gap:var(--space-4);align-content:center}
.erp-hero-copy h1{font-size:var(--text-3xl);line-height:1.08;letter-spacing:-.02em;max-width:18ch}
.erp-hero-copy .er-lead{max-width:56ch}
.erp-hero-search{display:flex;flex-wrap:wrap;gap:var(--space-2);background:var(--er-surface);border:1px solid var(--er-border-strong);border-radius:var(--radius-lg);padding:var(--space-2)}
.erp-hero-search input{flex:1 1 200px;min-height:48px;border:0;background:transparent;padding:0 var(--space-3);font-size:var(--text-base)}
.erp-hero-search input:focus-visible{box-shadow:none;outline:none}
.erp-hero-search:focus-within{box-shadow:var(--er-focus-ring);border-color:var(--er-brand)}
.erp-hero-media{display:grid;gap:var(--space-3);grid-template-columns:repeat(2,minmax(0,1fr))}
.erp-hero-media > :first-child{grid-column:1/-1}
/* Exactly two hero product cards, stacked 1 column x 2 rows on every breakpoint (never a side-by-side grid). */
.erp-hero-cards{display:grid;gap:var(--space-4);grid-template-columns:1fr;grid-auto-rows:1fr}
.erp-product-card{display:flex;gap:var(--space-4);align-items:center;background:var(--er-surface);border:1px solid var(--er-border);border-radius:var(--radius-lg);padding:var(--space-5);text-decoration:none;color:var(--er-text);transition:border-color var(--motion-fast) var(--ease-standard),box-shadow var(--motion-fast) var(--ease-standard)}
.erp-product-card:hover{border-color:var(--er-border-strong);box-shadow:var(--shadow-sm)}
.erp-product-card .er-icon-wrap{flex:none;width:56px;height:56px;border-radius:var(--radius-md);display:grid;place-items:center;background:var(--er-forest-100);color:var(--er-brand)}
.erp-product-card:nth-child(2) .er-icon-wrap{background:var(--er-terracotta-100);color:var(--er-terracotta-700)}
.erp-product-card-text{display:grid;gap:2px}
.erp-product-card h3{font-size:var(--text-base);margin:0}
.erp-product-card p{margin:0;color:var(--er-text-secondary);font-size:var(--text-sm)}
.erp-product-card .er-icon-arrow{margin-inline-start:auto;flex:none;color:var(--er-text-secondary)}
/* Fixed-count showcase rows: 5 columns desktop, horizontal-scroll snap of 2-visible on mobile. */
.erp-collection-5{display:grid;gap:var(--space-4);grid-auto-flow:column;grid-auto-columns:minmax(46%,1fr);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:var(--space-2);scrollbar-width:thin}
.erp-collection-5 > *{scroll-snap-align:start}
.erp-promise{display:grid;gap:var(--space-3);grid-template-columns:1fr;list-style:none;margin:0;padding:0}
.erp-promise li{display:flex;gap:var(--space-2);align-items:center;font-weight:600;font-size:var(--text-sm)}
.erp-promise .er-icon{color:var(--er-brand)}
.erp-band{background:var(--er-forest-950);color:var(--er-white)}
.erp-band h2,.erp-band h3{color:var(--er-white)}
.erp-band p,.erp-band .er-eyebrow{color:var(--er-forest-100)}
.erp-split{display:grid;gap:var(--space-8);align-items:center}
.erp-trace{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-2)}
.erp-trace li{display:flex;gap:var(--space-3);align-items:center;background:var(--er-surface);color:var(--er-text);border:1px solid var(--er-border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);font-weight:600}
.erp-trace .er-icon{color:var(--er-terracotta-700)}
.erp-band .erp-trace li{background:var(--er-forest-900);color:var(--er-white);border-color:var(--er-forest-800)}
.erp-band .erp-trace .er-icon{color:var(--er-saffron-400)}
.erp-partners{display:grid;gap:var(--space-4);grid-template-columns:1fr}
.erp-partner{display:grid;gap:var(--space-3);align-content:start;background:var(--er-surface);border:1px solid var(--er-border);border-radius:var(--radius-lg);padding:var(--space-6)}
.erp-example-label{font-size:var(--text-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--er-text-secondary)}

/* ---------- Listing + detail ---------- */
.erp-listing{display:grid;gap:var(--space-6)}
.erp-filter{display:grid;gap:var(--space-4);align-content:start}
.erp-detail{display:grid;gap:var(--space-6)}
.erp-aside{display:grid;gap:var(--space-4);align-content:start}
.erp-aside-card{display:grid;gap:var(--space-4);background:var(--er-surface);border:1px solid var(--er-border);border-radius:var(--radius-lg);padding:var(--space-4)}

/* ---------- Auth ---------- */
.erp-auth{display:grid;gap:var(--space-6);justify-items:center;padding-block:var(--space-4) var(--space-8)}
.erp-auth-card{width:100%;max-width:480px;display:grid;gap:var(--space-4);background:var(--er-surface);border:1px solid var(--er-border);border-radius:var(--radius-lg);padding:var(--space-6)}
.erp-auth-card h1{font-size:var(--text-2xl)}
.erp-auth-card form{display:grid;gap:var(--space-4)}
.erp-auth-brand{display:none}
.erp-auth-links{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4);justify-content:space-between;font-size:var(--text-sm)}
.erp-auth-links a{display:inline-flex;align-items:center;min-height:44px}
.erp-demo{border-top:1px solid var(--er-border);padding-top:var(--space-4);display:grid;gap:var(--space-2)}
.erp-demo h2{font-size:var(--text-sm);font-family:var(--font-body);font-weight:650;color:var(--er-text-secondary)}
.erp-demo ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--space-2)}
.erp-demo button{min-height:44px}
.erp-code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-variant-numeric:tabular-nums;letter-spacing:.06em;word-break:break-all}
.erp-codes{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-2);grid-template-columns:repeat(2,minmax(0,1fr))}
.erp-codes li{background:var(--er-surface-muted);border:1px solid var(--er-border);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3);text-align:center}
.erp-qr{width:216px;height:216px;margin-inline:auto;padding:var(--space-2);background:var(--er-white);border:1px solid var(--er-border);border-radius:var(--radius-md);display:grid;place-items:center}
.erp-check{display:flex;gap:var(--space-2);align-items:flex-start;min-height:44px;font-size:var(--text-sm)}
.erp-check input{width:20px;height:20px;margin-top:2px;flex:none;accent-color:var(--er-brand)}

/* ---------- Partner onboarding ---------- */
.erp-onboard{display:grid;gap:var(--space-6)}
.erp-onboard-nav{display:none}
.erp-onboard form{display:grid;gap:var(--space-6)}
.erp-fieldset{border:1px solid var(--er-border);border-radius:var(--radius-lg);background:var(--er-surface);padding:var(--space-4);margin:0;display:grid;gap:var(--space-4);min-width:0}
.erp-fieldset legend{font-family:var(--font-display);font-weight:750;font-size:var(--text-lg);padding-inline:var(--space-2)}
.erp-fieldset-grid{display:grid;gap:var(--space-4)}
.erp-form-actions{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;justify-content:space-between}

/* ---------- ≥640 ---------- */
@media (min-width:640px){
  .erp-collection,.erp-collection-4,.erp-partners{grid-template-columns:repeat(2,minmax(0,1fr))}
  .erp-promise{grid-template-columns:repeat(2,minmax(0,1fr))}
  .erp-codes{grid-template-columns:repeat(2,minmax(0,1fr))}
  .erp-fieldset-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .erp-fieldset-grid .erp-span{grid-column:1/-1}
  .erp-fieldset{padding:var(--space-6)}
}

/* ---------- Desktop ≥1024 ---------- */
@media (min-width:1024px){
  .erp-section{padding-block:var(--space-16)}
  .erp-collection-5{grid-auto-flow:row;grid-template-columns:repeat(5,minmax(0,1fr));overflow-x:visible;scroll-snap-type:none}
  .erp-hero{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:var(--space-12);align-items:center;padding-block:var(--space-12) var(--space-16)}
  .erp-hero-copy h1{font-size:var(--text-4xl)}
  .erp-split{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-12)}
  .erp-collection{grid-template-columns:repeat(3,minmax(0,1fr))}
  .erp-collection-4{grid-template-columns:repeat(3,minmax(0,1fr))}
  .erp-partners{grid-template-columns:repeat(3,minmax(0,1fr))}
  .erp-listing{grid-template-columns:280px minmax(0,1fr);align-items:start;gap:var(--space-8)}
  .erp-filter{position:sticky;top:calc(var(--er-topbar-height) + var(--space-4))}
  .erp-listing .erp-collection{grid-template-columns:repeat(2,minmax(0,1fr))}
  .erp-detail{grid-template-columns:minmax(0,1fr) 340px;align-items:start;gap:var(--space-8)}
  .erp-aside{position:sticky;top:calc(var(--er-topbar-height) + var(--space-4))}
  .erp-detail .erp-collection{grid-template-columns:repeat(2,minmax(0,1fr))}
  .erp-map{height:360px}
  .erp-auth.has-brand{grid-template-columns:minmax(0,1fr) 480px;align-items:center;justify-items:stretch;gap:var(--space-12);max-width:1080px;margin-inline:auto;padding-block:var(--space-8) var(--space-12)}
  .erp-auth-brand{display:grid;gap:var(--space-4);align-content:center;max-width:52ch}
  .erp-auth-brand h2{font-size:var(--text-3xl);line-height:1.1}
  .erp-onboard{grid-template-columns:220px minmax(0,1fr);align-items:start;gap:var(--space-8)}
  .erp-onboard-nav{display:grid;gap:var(--space-1);position:sticky;top:calc(var(--er-topbar-height) + var(--space-4))}
  .erp-onboard-nav a{display:flex;align-items:center;gap:var(--space-2);min-height:44px;padding:0 var(--space-3);border-radius:var(--radius-sm);color:var(--er-ink-700);text-decoration:none;font-weight:600}
  .erp-onboard-nav a:hover{background:var(--er-forest-50);color:var(--er-brand)}
}

/* ---------- Wide ≥1280 ---------- */
@media (min-width:1280px){
  .erp-collection-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .erp-listing .erp-collection{grid-template-columns:repeat(3,minmax(0,1fr))}
  .erp-detail{grid-template-columns:minmax(0,1fr) 380px}
  .erp-hero-media{gap:var(--space-4)}
  .erp-promise{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* ---------- Extra wide ≥1536 ---------- */
@media (min-width:1536px){
  .erp-hero{gap:var(--space-16)}
  .er-container.erp-wide{max-width:1440px}
  .erp-detail .erp-collection{grid-template-columns:repeat(3,minmax(0,1fr))}
  .erp-map{height:420px}
}

/* Hidden attribute must win over layout display rules. */
.erp-auth [hidden],.erp-onboard [hidden]{display:none!important}
@media (min-width:1024px){.erp-auth-brand{order:-1}}
.erp-steps{margin:0;padding-left:var(--space-6);display:grid;gap:var(--space-6)}
.erp-steps > li{display:grid;gap:var(--space-3)}
.erp-steps h2{font-size:var(--text-base);font-family:var(--font-body);font-weight:650}
.erp-steps form{display:grid;gap:var(--space-4)}
.erp-app-row{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-3);align-items:center;justify-content:space-between}
