/* ePasal website layer — loaded only on the website, never inside the native app.
   Phones: the app fills the screen.  Tablets & desktops: the app is centred as a phone-width
   column, and on wide screens the space beside it carries the brand and a "scan to open" card. */
html.web{background:#EAF4EC}
@media (min-width:768px){
  html.web{background:
    radial-gradient(900px 600px at 12% 8%,#D3EFD8 0,rgba(211,239,216,0) 60%),
    radial-gradient(800px 560px at 92% 92%,#FFF0BD 0,rgba(255,240,189,0) 58%),
    #EDF6EF;background-attachment:fixed}
  html.web body{box-shadow:0 0 0 1px rgba(15,23,42,.06),0 30px 80px rgba(15,23,42,.20)}
}

/* Intro panel: always in the page (search engines and screen readers read it), visible only on wide screens */
html.web #web-intro{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

.wi-brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:#0A7A3B;font-weight:800;font-size:22px;letter-spacing:-.02em;margin-bottom:22px}
.wi-brand img{width:52px;height:52px;border-radius:14px;box-shadow:0 4px 14px rgba(10,122,59,.18)}
.wi-left h1{font-size:clamp(26px,2.5vw,46px);line-height:1.08;letter-spacing:-.03em;font-weight:800;color:#0F2A1B}
.wi-left h1 em{font-style:normal;color:var(--brand)}
.wi-lead{margin-top:14px;font-size:clamp(14px,1.05vw,17px);line-height:1.6;color:#41544A;max-width:520px}
.wi-list{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:9px;font-size:clamp(13.5px,1vw,16px);font-weight:600}
.wi-list li{display:flex;align-items:center;gap:10px}
.wi-list li::before{content:"";flex:0 0 20px;height:20px;border-radius:50%;background:var(--brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-6.5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
.wi-links{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:26px;font-size:13.5px}
.wi-links a,.wi-copy a{color:#41544A;text-decoration:none;font-weight:600}
.wi-links a:hover{color:var(--brand);text-decoration:underline}
.wi-copy{margin-top:14px;font-size:12px;color:#7A8C81}
.wi-card{width:min(100%,330px);background:#fff;border:1px solid rgba(15,23,42,.07);border-radius:22px;padding:clamp(14px,2.4vw,22px);box-shadow:0 12px 40px rgba(15,23,42,.10);text-align:center}
.wi-card h2{font-size:18px;letter-spacing:-.02em;color:#0F2A1B;margin-top:12px}
.wi-card h3{font-size:16px;color:#0F2A1B}
.wi-card p{margin-top:6px;font-size:13.5px;line-height:1.5;color:#5A6B5F}
.wi-qr{width:clamp(88px,13vw,148px);height:clamp(88px,13vw,148px);margin:0 auto;padding:clamp(6px,1.2vw,10px);background:#fff;border:1px solid #E1ECE4;border-radius:14px;color:#0F2A1B}
.wi-qr svg{width:100%;height:100%;display:block}
.wi-stores{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.wi-store{display:flex;flex-direction:column;align-items:center;padding:9px 12px;border-radius:12px;background:#0F2A1B;color:#fff;text-decoration:none;font-size:11px;line-height:1.2}
.wi-store b{font-size:16px}
.wi-sell{text-align:left}
.wi-btn{display:inline-block;margin-top:12px;padding:10px 16px;border-radius:11px;background:var(--brand);color:#fff;text-decoration:none;font-weight:700;font-size:13.5px}
.wi-social{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:13px}
.wi-social a{color:#41544A;font-weight:600;text-decoration:none}
.wi-social a:hover{color:var(--brand)}


/* Real site footer, appended after the app's own content. Hidden by default (and on
   phones/native); web-desktop.css turns it on at desktop widths. */
.ep-site-footer{background:#0F2A1B;color:#BFD3C6;padding:40px 24px 28px;font-family:'Figtree',-apple-system,'Segoe UI',Roboto,system-ui,sans-serif;font-size:14px;line-height:1.7;margin-top:40px}
.ep-site-footer .ep-f-wrap{max-width:1180px;margin:0 auto}
.ep-site-footer .ep-f-cols{display:flex;flex-wrap:wrap;gap:24px 56px;justify-content:space-between}
.ep-site-footer a{color:#fff;text-decoration:none}
.ep-site-footer a:hover{text-decoration:underline}
.ep-site-footer .ep-f-links{display:flex;flex-direction:column;gap:4px}
.ep-site-footer strong{color:#fff;display:block;margin-bottom:4px}
.ep-site-footer .ep-f-legal{margin-top:18px;padding-top:16px;border-top:1px solid #244734;color:#8FA898;font-size:13px}
.ep-f-brand{max-width:240px}
.ep-f-brand p{color:#DDEBE1;font-size:13px;line-height:1.55;margin:8px 0 14px}
.ep-f-contact b{display:block;color:#fff;font-size:12.5px;font-weight:700;margin-bottom:4px}
.ep-f-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-top:28px;padding-top:22px;border-top:1px solid #244734}
.ep-f-payment{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.ep-f-payment-lbl{font-size:12.5px;font-weight:700;color:#DDEBE1;margin-right:2px}
.ep-f-pay-badge{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:#fff;font-size:12px;font-weight:600;padding:6px 12px;border-radius:7px}
.ep-f-social{display:flex;gap:10px}
.ep-f-social a{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}
.ep-f-social svg{width:13px;height:13px}
.ep-f-social a:hover{background:rgba(255,255,255,.16)}
@media (max-width:600px){.ep-f-bottom{flex-direction:column;align-items:flex-start}}