:root { --ink:#112b47; --cyan:#00afd8; --magenta:#e72d7b; --yellow:#ffd339; --paper:#f7fafc; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); font-family:Arial, Helvetica, sans-serif; background:#e9f4f8; }
.page-shell { min-height:100svh; display:grid; place-items:center; padding:28px 16px; position:relative; overflow:hidden; background:radial-gradient(circle at 92% 10%, #ffdf57 0 7%, transparent 7.2%), radial-gradient(circle at 3% 88%, #d51769 0 10%, transparent 10.2%), linear-gradient(145deg, #e7f6fa, #fdfdf8); }
.top-pattern { position:absolute; top:-86px; left:-32px; width:260px; height:260px; border:27px solid var(--cyan); border-radius:50%; opacity:.18; }
.card { width:min(100%, 470px); padding:44px 28px 24px; background:rgba(255,255,255,.93); border:1px solid rgba(17,43,71,.07); border-radius:31px; box-shadow:0 22px 60px rgba(17,43,71,.15); text-align:center; position:relative; backdrop-filter:blur(8px); }
.share-button { display:grid; place-items:center; width:40px; height:40px; border:0; border-radius:50%; background:#eff5f7; color:var(--ink); cursor:pointer; position:absolute; right:20px; top:20px; transition:transform .2s, background .2s; }
.share-button:hover { background:#dbeef4; transform:translateY(-2px); }.share-button svg { width:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.brand-logo { width:min(100%, 330px); margin:0 auto -3px; }.brand-logo img { display:block; width:100%; height:auto; mix-blend-mode:multiply; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.eyebrow { font-size:10px; letter-spacing:2.2px; font-weight:800; color:var(--magenta); margin:0 0 7px; }
h1 { margin:0; font-size:32px; line-height:.92; letter-spacing:-1.6px; font-weight:300; } h1 strong { font-weight:900; }
.intro { margin:15px auto 25px; max-width:330px; color:#587084; font-size:14px; line-height:1.45; }
.links { display:grid; gap:11px; text-align:left; }.link { min-height:70px; padding:10px 15px; display:flex; align-items:center; gap:13px; color:var(--ink); text-decoration:none; border:1px solid #dfebee; border-radius:17px; background:#fff; box-shadow:0 4px 12px rgba(15,43,62,.05); transition:transform .2s, box-shadow .2s, border-color .2s; }.link:hover, .link:focus-visible { transform:translateY(-3px); box-shadow:0 9px 18px rgba(15,43,62,.11); outline:none; }.link:active { transform:scale(.985); }
.icon { width:42px; height:42px; flex:0 0 42px; border-radius:13px; display:grid; place-items:center; color:#fff; }.icon svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }.link b { display:block; font-size:15px; }.link small { display:block; margin-top:3px; color:#718494; font-size:12px; }.arrow { margin-left:auto; color:#9eacb5; font-size:21px; font-weight:300; }
.link-whatsapp .icon { background:#25d366; }.link-instagram .icon { background:linear-gradient(135deg,#7b36b6,#e72d7b,#ffb23f); }.link-tiktok .icon { background:#171717; }.link-facebook .icon { background:#1877f2; }.link-catalog .icon { background:#ffae00; }.link-location .icon { background:var(--magenta); }.link-store-featured { color:#142033; border-color:#ffc500; background:linear-gradient(105deg,#ffd11b,#ffad00 62%,#ff8f10); box-shadow:0 8px 19px rgba(237,156,0,.28); }.link-store-featured .icon { color:#142033; background:#fff5b8; }.link-store-featured small { color:#584300; }.link-store-featured .arrow { color:#142033; }.link-store-featured:hover, .link-store-featured:focus-visible { border-color:#e98700; box-shadow:0 11px 23px rgba(237,156,0,.38); }.link:hover .arrow { color:var(--ink); }
.footer-note { margin:23px 0 0; color:#8b9ba5; font-size:11px; font-weight:700; letter-spacing:.4px; }
@media (max-width:380px) { .page-shell { padding:14px 10px; }.card { border-radius:25px; padding:38px 19px 20px; }.brand-logo { width:280px; }.intro { margin-bottom:19px; }.link { min-height:65px; }.icon { width:38px; height:38px; flex-basis:38px; } }
@media (min-width:700px) { .card { padding:49px 38px 28px; } }