/* EasySubs storefront: an open product canvas with one shared catalog. */
:root { --es-width:1440px; --es-border:#e7e2ed; --es-accent:#5630a5; --es-safe-top:env(safe-area-inset-top,0px); --es-safe-left:env(safe-area-inset-left,0px); --es-safe-right:env(safe-area-inset-right,0px); }
html { background:#fff; color-scheme:light; scroll-padding-top:calc(112px + var(--es-safe-top)); }
body.ai-store { background:#faf9fc; }
.es-header,.ai-store .es-header {
  position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:32px;
  width:100%;max-width:none;height:calc(88px + var(--es-safe-top));margin:0 0 32px;
  padding:var(--es-safe-top) max(24px,var(--es-safe-right),calc((100vw - var(--es-width))/2)) 0 max(24px,var(--es-safe-left),calc((100vw - var(--es-width))/2));
  background:#fff;border-bottom:1px solid var(--es-border);
}
/* Keep the notch/status inset opaque while content scrolls under the header.
   This is paint only: links and the native catalog keep their hit areas. */
.es-header::before {
  content:"";position:fixed;inset:0 0 auto;height:var(--es-safe-top);
  background:#fff;pointer-events:none;
}
.es-header .logo { flex-shrink:0; }
.es-header .logo img,.ai-store .es-header .logo img { width:168px;height:auto;display:block; }
.es-header .menu-button { display:none!important; }
.es-catalog { border:0;padding:0;position:static; }
.es-catalog>summary {
  display:flex;align-items:center;gap:12px;min-height:48px;margin:0;padding:12px 20px;
  background:var(--es-accent);color:#fff;border:0;border-radius:10px;
  font-size:16px;font-weight:500;line-height:24px;list-style:none;cursor:pointer;
}
.es-catalog>summary::-webkit-details-marker { display:none; }
.es-catalog>summary::after { display:none; }
.es-catalog>summary svg { width:20px;height:20px;flex-shrink:0;color:inherit; }
.es-header svg { stroke:currentColor; }
.es-catalog>summary svg:last-child { width:16px;transition:transform .16s; }
.es-catalog[open]>summary svg:last-child { transform:rotate(180deg); }
.es-catalog>summary:hover { background:#432581; }
.es-header a:focus-visible,.es-catalog summary:focus-visible { outline:3px solid #9d7dcc;outline-offset:4px; }
.es-header .es-primary-nav,.ai-store .es-header .es-primary-nav { display:flex;gap:28px;margin-left:auto;font-size:16px; }
.es-header .es-primary-nav a { color:#5d5568;white-space:nowrap; }
.es-header .es-primary-nav a:hover { color:var(--es-accent); }
.es-header .header-support,.ai-store .es-header .header-support { margin:0;padding:12px 16px;min-height:48px;border:1px solid var(--es-border);border-radius:10px;background:white;font-size:15px;white-space:nowrap;display:flex;align-items:center;gap:8px; }
.es-header .header-support svg { height:20px;width:20px; }
.es-catalog-panel {
  position:absolute;left:max(24px,calc((100vw - var(--es-width))/2));right:max(24px,calc((100vw - var(--es-width))/2));top:calc(100% + 8px);
  max-height:calc(100dvh - 112px - var(--es-safe-top) - env(safe-area-inset-bottom,0px));overflow:auto;background:#fff;
  padding:28px;border:1px solid var(--es-border);border-radius:16px;
  box-shadow:0 16px 40px #251b3621;
}
.es-catalog-heading { display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:24px; }
.es-catalog-heading>strong { font-size:24px;font-weight:500; }
.es-catalog-heading>a { display:flex;gap:12px;align-items:center;color:var(--es-accent);font-size:16px; }
.es-catalog-heading svg { width:20px;height:20px; }
.es-header .es-category-grid,.ai-store .es-header .es-category-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px; }
.es-header .es-category { display:flex;gap:16px;align-items:center;padding:20px 16px;min-height:100px;border:1px solid var(--es-border);border-radius:12px;color:#292033; }
.es-category:hover,.es-category[aria-current=page] { background:#f3eefb;border-color:#cab8e5; }
.es-header .es-category[aria-current=page] { text-decoration:none; }
.es-category-icon { display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;background:#f5f2fa;border-radius:10px;color:var(--es-accent); }
.es-category-icon svg { width:26px;height:26px; }
.es-category>span:nth-child(2) { flex:1;min-width:0; }
.es-category strong { display:block;font-size:18px;font-weight:500;line-height:1.4; }
.es-category small { display:block;margin-top:4px;font-size:14px;color:#64596f;line-height:1.5; }
.es-category>svg { width:16px;height:16px;color:#80738f;flex-shrink:0; }
.es-catalog-footer { display:flex;gap:16px;flex-wrap:wrap;margin-top:24px;padding-top:20px;border-top:1px solid var(--es-border);font-size:15px;color:#64596f; }
.es-catalog-footer a { color:var(--es-accent);text-decoration:underline;text-underline-offset:4px; }

/* The category rail is gone. The page introduction now spans both columns. */
.ai-store .store-shell,.ai-store .cards-shell,.ai-store .help,.ai-store .footer { max-width:var(--es-width);width:calc(100% - 48px); }
.ai-store .store-shell { grid-template-columns:minmax(0,1fr) 352px;gap:32px; }
.ai-store .store-breadcrumb { grid-column:1/-1;font-size:14px;padding:0; }
.ai-store .store-shell>.service-intro.hero {
  grid-column:1/-1;grid-row:auto;padding:8px 0 32px;margin:0;
  border:0;border-bottom:1px solid var(--es-border);border-radius:0;background:transparent;
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:32px;
}
.ai-store .service-banner { background:transparent;border-radius:0;min-height:0;padding:0;gap:24px;overflow:visible; }
.ai-store .service-banner h1 { font-size:48px;line-height:1.1;font-weight:500;letter-spacing:-1.2px;color:var(--ink); }
.ai-store .service-banner p { font-size:16px;color:var(--muted); }
.ai-store .service-banner .catalog-description { max-width:660px;margin-top:16px;margin-bottom:0;font-size:18px;line-height:1.65; }
.ai-store .banner-logo { width:88px;height:88px;border:1px solid var(--es-border);border-radius:20px; }
.ai-store .banner-logo .brand-image,.ai-store .banner-logo svg { width:48px;height:48px; }
.ai-store .service-intro .service-facts { display:grid;gap:12px;margin:0;padding:0; }
.ai-store .service-facts>span,.ai-store .service-facts>a { background:transparent;padding:0;font-size:15px;gap:10px; }
.ai-store .store-content { display:grid;gap:32px;grid-column:1; }
.ai-store .store-box { border:1px solid var(--es-border);border-radius:16px;padding:32px; }
.ai-store .plans-box { background:transparent;border:0;padding:0; }
.ai-store .store-section-heading h2 { font-size:30px;font-weight:500; }
.ai-store .order-sidebar { grid-column:2;grid-row:auto;position:sticky;top:112px;max-height:calc(100dvh - 136px); }
.ai-store .order-box { padding:24px;border:1px solid var(--es-border);border-radius:16px; }
.ai-store .order-support { background:#f0eafa; }
.ai-store .provider-grid { grid-template-columns:repeat(3,minmax(0,1fr));gap:16px; }
.ai-store .provider-choice { background:#fff;border-radius:12px; }
.ai-store .provider-choice[aria-pressed=true] { background:#f1ebfa;border-color:var(--es-accent); }
.ai-store .provider-choice strong { font-size:18px; }
.ai-store .provider-choice small { font-size:14px; }
.ai-store .plan-grid { grid-template-columns:repeat(3,minmax(0,1fr));gap:20px; }
.ai-store .selected-details { background:#f3eff8; }
.ai-store .home-banner h1 { font-size:56px;max-width:760px; }
.ai-store .home-banner p.home-intro { max-width:650px;font-size:20px;line-height:1.6; }
.catalog-home .store-shell { grid-template-columns:minmax(0,1fr); }
.catalog-home .home-catalog { border:0;padding:0;background:transparent; }
.catalog-home .home-products { grid-template-columns:repeat(3,minmax(0,1fr));gap:24px; }
.catalog-home .home-product { background:white;padding:16px; }
.catalog-home .home-product:hover { border-color:#a68acb; }
.catalog-home .home-product h3 { font-size:26px; }
.catalog-home .home-assistant { grid-column:1;position:static;max-height:none;overflow:visible; }
.catalog-home .home-assistant .order-card { display:grid;grid-template-columns:1fr 1fr;column-gap:40px; }
.catalog-home .home-assistant .order-card>p,.catalog-home .home-assistant .order-card>h2 { grid-column:1; }
.catalog-home .home-assistant .order-card>.checkout-button { grid-column:2;grid-row:1/4;align-self:center;margin:0;max-width:360px;justify-self:end; }
.catalog-home .home-assistant .order-card>hr { grid-column:1/-1;width:100%;margin:16px 0; }
.catalog-home .home-assistant .order-card>.home-support-hours { grid-column:2;grid-row:4;text-align:right;margin:0; }
.catalog-home .home-assistant .order-card>ul { grid-column:1; }
.catalog-home .home-assistant .order-card>.text-link { grid-column:2;align-self:center;justify-self:end; }
.catalog-home .home-assistant>.order-support { display:none; }
@media(max-width:1100px) {
  .es-header,.ai-store .es-header { gap:20px; }
  .es-header .es-primary-nav,.ai-store .es-header .es-primary-nav { gap:20px;font-size:14px; }
  .es-header .es-primary-nav>a:first-child { display:none; }
  .ai-store .store-shell { grid-template-columns:minmax(0,1fr) 304px;gap:24px; }
  .ai-store .store-shell>.service-intro.hero { grid-template-columns:1fr;gap:24px; }
  .ai-store .service-intro .service-facts { display:flex;flex-wrap:wrap;gap:12px 24px; }
  .ai-store .plan-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .catalog-home .store-shell { grid-template-columns:1fr; }
  .catalog-home .home-products { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .es-header .es-category-grid,.ai-store .es-header .es-category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:760px) {
  html { scroll-padding-top:calc(92px + var(--es-safe-top)); }
  .es-header,.ai-store .es-header { height:calc(76px + var(--es-safe-top));padding:var(--es-safe-top) max(16px,var(--es-safe-right)) 0 max(16px,var(--es-safe-left));gap:16px;margin-bottom:24px; }
  .es-header .logo img,.ai-store .es-header .logo img { width:136px; }
  .es-header .es-primary-nav,.ai-store .es-header .es-primary-nav { display:none; }
  .es-catalog { margin-left:auto; }
  .es-catalog>summary { padding:10px 12px;gap:8px;font-size:15px;min-height:44px; }
  .es-catalog>summary svg:first-child { display:none; }
  .es-header .header-support,.ai-store .es-header .header-support { padding:10px;width:44px;min-height:44px;flex-shrink:0; }
  .es-header .header-support span { display:none; }
  .es-catalog-panel { left:12px;right:12px;top:calc(100% + 4px);padding:20px;max-height:calc(100dvh - 96px - var(--es-safe-top) - env(safe-area-inset-bottom,0px)); }
  .es-catalog-heading { margin-bottom:16px;gap:12px; }
  .es-catalog-heading>strong { font-size:20px; }
  .es-catalog-heading>a { font-size:14px;gap:8px; }
  .es-catalog-heading>a svg { display:none; }
  .es-header .es-category-grid,.ai-store .es-header .es-category-grid { grid-template-columns:1fr;gap:8px; }
  .es-header .es-category { min-height:76px;padding:12px;gap:12px; }
  .es-category strong { font-size:17px; }
  .es-category small { font-size:14px; }
  .es-catalog-footer { font-size:14px;gap:8px;margin-top:16px;padding-top:16px; }
  .ai-store .store-shell,.ai-store .cards-shell,.ai-store .help,.ai-store .footer { width:calc(100% - 32px); }
  .ai-store .store-shell { grid-template-columns:minmax(0,1fr);gap:24px; }
  .ai-store .store-breadcrumb { font-size:13px; }
  .ai-store .store-shell>.service-intro.hero { grid-row:auto;order:-1;padding:8px 0 24px;gap:20px; }
  .ai-store .store-shell>.store-mode-notice { order:-3; }
  .ai-store .store-breadcrumb { order:-2; }
  .ai-store .service-banner { gap:16px;align-items:flex-start; }
  .ai-store .service-banner h1 { font-size:34px;letter-spacing:-.6px; }
  .ai-store .service-banner p { font-size:14px; }
  .ai-store .service-banner .catalog-description { font-size:17px;line-height:1.6;margin-top:12px; }
  .ai-store .banner-logo { width:56px;height:56px;border-radius:12px; }
  .ai-store .banner-logo .brand-image,.ai-store .banner-logo svg { width:32px;height:32px; }
  .ai-store .service-facts>span,.ai-store .service-facts>a { font-size:13px; }
  .ai-store .store-content { display:contents; }
  .ai-store .store-content>.store-box { grid-row:auto;grid-column:1; }
  .ai-store .store-content>.plans-box { grid-row:auto;order:0; }
  .ai-store .order-sidebar { grid-column:1;grid-row:auto;order:1;position:static;max-height:none;overflow:visible; }
  .ai-store .store-content>.credits-box { order:2; }
  .ai-store .store-content>.guide-box { order:3; }
  .ai-store .store-content>.reviews { order:4; }
  .ai-store .store-content>.store-about { order:5; }
  .ai-store .store-box { padding:20px; }
  .ai-store .plans-box,.catalog-home .home-catalog { padding:0; }
  .ai-store .store-section-heading h2 { font-size:28px; }
  .ai-store .provider-grid { grid-template-columns:repeat(2,minmax(0,1fr));gap:12px; }
  .ai-store .provider-choice strong { font-size:17px; }
  .ai-store .plan-grid { grid-template-columns:1fr;gap:20px; }
  .ai-store .home-banner h1 { font-size:42px; }
  .ai-store .home-banner p.home-intro { font-size:18px; }
  .catalog-home .home-products { grid-template-columns:1fr;gap:20px; }
  .catalog-home .home-product h3 { font-size:26px; }
  .catalog-home .home-assistant { grid-row:auto; }
  .catalog-home .home-assistant .order-card { display:block; }
  .catalog-home .home-assistant .order-card>.checkout-button { max-width:none; }
  .catalog-home .home-assistant .order-card>.home-support-hours { text-align:center;margin:12px 0; }
}
@media(max-width:360px) {
  .es-header,.ai-store .es-header { gap:8px; }
  .es-header .logo img,.ai-store .es-header .logo img { width:124px; }
  .es-catalog-panel { padding:16px; }
}
@media(prefers-reduced-motion:reduce) { .es-catalog>summary svg { transition:none; } }

/* A human introduction, next to the shortest path into the catalog. */
.catalog-home .store-shell>.service-intro.hero {
  grid-template-columns:minmax(0,1fr) 480px;gap:48px;align-items:center;padding:8px 0 40px;
}
.home-intro-copy { min-width:0; }
.home-intro-copy .home-banner { min-height:0; }
.home-hero-actions { display:flex;align-items:center;flex-wrap:wrap;gap:16px 24px;margin:24px 0; }
.home-hero-actions>.button { min-width:208px;padding-inline:24px; }
.home-reviews-link { font-size:16px;color:var(--purple);text-underline-offset:5px; }
.home-reviews-link:hover { text-decoration:underline; }
.catalog-home .home-intro-copy .service-facts { display:flex;flex-wrap:wrap;gap:12px 20px; }
.home-founder {
  display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:16px 24px;
  background:#fff;border:1px solid var(--es-border);border-radius:16px;padding:24px;
  min-width:0;align-items:start;
}
.founder-portrait { grid-column:1;grid-row:3/6;align-self:center;aspect-ratio:4/5;display:flex;align-items:flex-end;overflow:hidden;border-radius:12px;background:#f1ebfa; }
/* The supplied photo is already cropped to 4:5; preserve its original orientation. */
.founder-portrait img { display:block;width:100%;height:auto;object-fit:contain; }
.founder-profile { display:contents; }
.founder-role { grid-column:1/-1;grid-row:1; }
.founder-profile h2 { grid-column:1/-1;grid-row:2; }
.founder-bio { grid-column:2;grid-row:3; }
.founder-audience { grid-column:2;grid-row:4; }
.founder-channel { grid-column:2;grid-row:5; }
.founder-role { color:var(--purple);font-size:14px;line-height:1.5;margin:0; }
.founder-profile h2 { font-size:26px;line-height:1.2;font-weight:500;letter-spacing:-.4px;margin:0; }
.founder-bio { font-size:15px;line-height:1.6;color:var(--muted);margin:0; }
.founder-audience { margin:0; }
.founder-audience strong { display:block;font-size:28px;line-height:1.2;font-weight:500;color:var(--ink);font-variant-numeric:tabular-nums; }
.founder-audience span { display:block;font-size:13px;line-height:1.5;color:var(--muted);margin-top:4px; }
.founder-channel { display:flex;align-items:center;gap:8px;font-size:15px;font-weight:500;color:var(--purple);min-height:32px; }
.founder-channel svg,.founder-connection svg { width:20px;height:20px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round; }
.founder-channel svg:last-child { width:16px;height:16px; }
.founder-connection { grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--es-border);padding-top:16px;font-size:13px;color:var(--muted);line-height:1.5; }
.founder-connection svg { width:16px;height:16px; }
.founder-channel:hover,.founder-connection:hover { color:var(--purple-dark);text-decoration:underline;text-underline-offset:4px; }
.home-founder a:focus-visible,.home-hero-actions a:focus-visible { outline:3px solid #9d7dcc;outline-offset:4px;border-radius:4px; }
@media(max-width:1100px) {
  .catalog-home .store-shell>.service-intro.hero { grid-template-columns:minmax(0,1fr) 400px;gap:32px; }
  .catalog-home .home-banner h1 { font-size:48px; }
  .home-founder { gap:16px 20px;padding:20px; }
  .founder-profile h2 { font-size:24px; }
}
@media(max-width:900px) {
  .catalog-home .store-shell>.service-intro.hero { grid-template-columns:minmax(0,1fr);gap:32px; }
  .home-founder { grid-template-columns:minmax(0,.9fr) minmax(0,1fr);max-width:560px;width:100%; }
  .founder-profile h2 { font-size:28px; }
  .founder-bio br { display:none; }
}
@media(max-width:480px) {
  .catalog-home .store-shell>.service-intro.hero { padding:8px 0 24px;gap:24px; }
  .catalog-home .home-banner h1 { font-size:42px; }
  .home-hero-actions { gap:16px;margin:24px 0; }
  .home-hero-actions>.button { width:100%; }
  .home-reviews-link { min-height:32px;display:flex;align-items:center; }
  .home-founder { grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:16px;padding:20px; }
  .founder-portrait { grid-row:4; }
  .founder-profile h2 { font-size:26px;line-height:1.25; }
  .founder-role { font-size:13px; }
  .founder-bio { grid-column:1/-1;grid-row:3;font-size:15px; }
  .founder-audience { align-self:center; }
  .founder-audience strong { font-size:26px; }
  .founder-channel { grid-column:1/-1;grid-row:5;font-size:15px;min-height:44px;justify-content:center;background:#f1ebfa;border-radius:8px; }
  .founder-connection { font-size:13px;padding-top:12px; }
}
