:root { --ink:#14221c; --green:#087a47; --blue:#1388a5; --yellow:#f4b915; }
* { box-sizing:border-box; }
html { min-height:100%; background:#d8d8d8; }
body { min-height:100%; margin:0; color:var(--ink); font-family:Arial,Helvetica,sans-serif; text-rendering:optimizeLegibility; }
a { color:inherit; }
.page-shell { position:relative; min-height:100svh; width:min(100%,680px); margin:0 auto; overflow:hidden; isolation:isolate; background:radial-gradient(circle at 9% 49%,rgba(154,229,255,.58),transparent 31%),radial-gradient(circle at 88% 20%,rgba(255,231,137,.52),transparent 32%),radial-gradient(circle at 22% 87%,rgba(178,231,205,.5),transparent 35%),linear-gradient(145deg,#fbfdfc 0%,#fffefa 53%,#f5faf6 100%); box-shadow:0 0 80px rgba(0,0,0,.08); }
.page-shell::before { content:""; position:absolute; inset:0; z-index:-1; opacity:.22; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.11'/%3E%3C/svg%3E"); mix-blend-mode:multiply; pointer-events:none; }
.ambient { position:absolute; z-index:-2; width:270px; height:270px; border-radius:50%; filter:blur(48px); opacity:.34; pointer-events:none; }
.ambient-blue { top:33%; left:-140px; background:#80e0f4; }
.ambient-yellow { top:-75px; right:-120px; background:#ffe58c; }
.ambient-green { right:-130px; bottom:2%; background:#9bdab7; }
.link-card { display:flex; min-height:100svh; flex-direction:column; padding:62px 34px 30px; }
.profile-header { display:flex; flex-direction:column; align-items:center; text-align:center; }
.profile-logo { display:block; width:min(100%,410px); height:auto; object-fit:contain; margin:-24px auto -11px; filter:drop-shadow(0 8px 16px rgba(20,65,47,.08)); }
.profile-header p { max-width:440px; margin:0 auto; color:#1e2b25; font-size:1rem; font-weight:520; line-height:1.45; }
.primary-links { display:grid; gap:14px; margin-top:38px; }
.primary-link { position:relative; display:grid; min-height:72px; grid-template-columns:54px 1fr 30px; align-items:center; padding:9px 15px 9px 9px; border:1px solid rgba(12,67,43,.07); border-radius:16px; background:rgba(255,255,255,.9); box-shadow:0 7px 22px rgba(19,67,47,.1); text-decoration:none; backdrop-filter:blur(12px); transition:transform 160ms ease,box-shadow 160ms ease,background 160ms ease; }
.primary-link:hover { transform:translateY(-2px); background:#fff; box-shadow:0 12px 28px rgba(19,67,47,.15); }
.primary-link:focus-visible,.social-link:focus-visible { outline:3px solid rgba(19,136,165,.32); outline-offset:3px; }
.primary-icon { display:grid; width:50px; height:50px; place-items:center; overflow:hidden; border-radius:12px; }
.primary-icon svg { width:29px; height:29px; fill:currentColor; }
.primary-icon img { width:42px; height:42px; object-fit:contain; }
.primary-icon .whatsapp-symbol { width:29px; height:29px; }
.primary-icon-whatsapp { color:#fff; background:#25d366; box-shadow:inset 0 0 0 1px rgba(0,0,0,.04); }
.primary-icon-site { background:#f8fbf9; }
.primary-icon-location { color:var(--green); background:#e8f4ed; }
.primary-copy { min-width:0; padding:0 12px; text-align:center; }
.primary-copy strong { display:block; overflow:hidden; color:#111b16; font-size:1rem; font-weight:700; line-height:1.28; text-overflow:ellipsis; white-space:nowrap; }
.primary-copy small { display:block; overflow:hidden; margin-top:3px; color:#66726c; font-size:.72rem; line-height:1.3; text-overflow:ellipsis; white-space:nowrap; }
.link-arrow { display:grid; width:30px; height:30px; place-items:center; color:#7b8781; }
.link-arrow svg { width:21px; height:21px; }
.social-block { margin-top:32px; text-align:center; }
.social-block>p { margin:0 0 14px; color:#53635b; font-size:.78rem; font-weight:700; letter-spacing:.11em; text-transform:uppercase; }
.social-links { display:flex; justify-content:center; gap:12px; }
.social-link { display:grid; width:48px; height:48px; place-items:center; border:1px solid rgba(20,34,28,.09); border-radius:15px; background:rgba(255,255,255,.82); box-shadow:0 5px 15px rgba(19,67,47,.08); transition:transform 160ms ease,background 160ms ease,color 160ms ease; }
.social-link:hover { transform:translateY(-2px); background:#fff; }
.social-link svg { width:23px; height:23px; fill:currentColor; }
.social-link .social-symbol { width:23px; height:23px; object-fit:contain; }
.social-instagram { color:#c92f73; } .social-facebook { color:#1877f2; } .social-youtube { color:#ff0033; } .social-linkedin { color:#0a66c2; } .social-tiktok { color:#111; }
footer { margin-top:auto; padding-top:34px; text-align:center; }
.footer-line { display:block; width:36px; height:3px; margin:0 auto 13px; border-radius:4px; background:linear-gradient(90deg,var(--green),var(--blue),var(--yellow)); }
footer p { margin:0; color:#34463d; font-size:.84rem; font-weight:700; }
footer small { display:block; margin-top:5px; color:#78847e; font-size:.7rem; }
@media (max-width:540px) { html { background:#f8fbf9; } .page-shell { box-shadow:none; } .link-card { padding:42px 20px 24px; } .profile-logo { width:min(100%,340px); margin:-28px auto -8px; } .profile-header p { max-width:350px; font-size:.93rem; } .primary-links { margin-top:30px; } .primary-link { min-height:68px; grid-template-columns:50px 1fr 24px; padding-right:12px; border-radius:15px; } .primary-icon { width:46px; height:46px; } .primary-copy { padding:0 7px; } .primary-copy strong { font-size:.94rem; } .primary-copy small { font-size:.65rem; } }
@media (max-width:370px) { .link-card { padding-right:14px; padding-left:14px; } .social-links { gap:9px; } .social-link { width:44px; height:44px; } }
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; transition:none!important; } }
