/* * The Law Office of Edersy Suarez — tarjeta digital (navy + plata, editorial). * * Es el diseño aprobado por Dany, portado tal cual desde la maqueta: logo plata * monocromático FLOTANDO sobre el navy (nunca dentro de una caja blanca — esa * versión se descartó), marco grabado fino de membrete legal, filete con * diamante y serif Cormorant. Aire generoso: para un bufete, la sobriedad ES el * mensaje. * * TODO va prefijado con .edersy-card: la hoja comparte con el preflight * de Tailwind y con las demás tarjetas, así que sin el prefijo un `a` o un * `button` suelto se colaría en el resto del sitio. El reset vive dentro del * scope por lo mismo. */ @font-face{font-family:"Edersy Serif";font-style:normal;font-weight:400 700;font-display:swap; src:url("/card/edersy-suarez/fonts/cormorant-regular.woff2") format("woff2")} @font-face{font-family:"Edersy Serif";font-style:italic;font-weight:400 700;font-display:swap; src:url("/card/edersy-suarez/fonts/cormorant-italic.woff2") format("woff2")} @font-face{font-family:"Edersy Sans";font-style:normal;font-weight:300;font-display:swap; src:url("/card/edersy-suarez/fonts/montserrat-300.woff2") format("woff2")} @font-face{font-family:"Edersy Sans";font-style:normal;font-weight:400;font-display:swap; src:url("/card/edersy-suarez/fonts/montserrat-400.woff2") format("woff2")} @font-face{font-family:"Edersy Sans";font-style:normal;font-weight:500;font-display:swap; src:url("/card/edersy-suarez/fonts/montserrat-500.woff2") format("woff2")} /* El lienzo de la ruta: sin esto se ve el gris del layout alrededor. */ html:has(.edersy-card), body:has(.edersy-card){background:#050f1f} .edersy-card{ --navy:#081a33; --navy-hi:#16345c; --blue:#245ea8; --blue-2:#3d7fd0; --silver:#b8c2d2; --silver-2:#dfe6f0; --ivory:#f3f5f9; --card:#ffffff; --ink:#122036; --mut:#66728a; --line:rgba(36,94,168,.16); --line-s:rgba(184,194,210,.26); --serif:"Edersy Serif",Georgia,serif; --sans:"Edersy Sans","Segoe UI",system-ui,Arial,sans-serif; width:100%;max-width:460px;margin:0 auto;background:var(--ivory);color:var(--ink); font-family:var(--sans);position:relative;overflow:hidden;-webkit-font-smoothing:antialiased; } .edersy-card *{margin:0;box-sizing:border-box} .edersy-card img{display:block;max-width:100%} .edersy-card a{text-decoration:none;color:inherit} .edersy-card button{font:inherit;color:inherit;background:none;border:0;cursor:pointer} /* ---------- HERO ---------- */ .edersy-card .hero{position:relative;padding:48px 40px 44px;text-align:center; background:radial-gradient(115% 70% at 50% 8%, var(--navy-hi), var(--navy) 62%)} /* marco grabado: inset 18 contra padding 40/48 deja aire parejo al contenido */ .edersy-card .hero::before{content:"";position:absolute;inset:18px; border:1px solid rgba(184,194,210,.22);pointer-events:none} .edersy-card .lang{position:absolute;top:30px;right:30px;z-index:3; border:1px solid rgba(184,194,210,.4);border-radius:30px;color:var(--silver); font-size:11px;letter-spacing:.14em;padding:7px 13px;background:rgba(8,26,51,.4)} .edersy-card .mark{width:308px;max-width:82%;height:auto;margin:0 auto; filter:drop-shadow(0 10px 30px rgba(0,0,0,.45))} .edersy-card .tagline{margin-top:30px;font-family:var(--serif);font-size:27px;font-weight:500; color:#eef2f8;line-height:1.25;letter-spacing:.01em} .edersy-card .loc{margin-top:14px;font-size:11px;letter-spacing:.34em;color:var(--silver);text-transform:uppercase} /* estado en vivo desde su Google Business Profile (no aparece si Google calla) */ .edersy-card .gstatus{margin-top:16px;display:inline-block;padding:8px 16px;border-radius:30px; border:1px solid rgba(184,194,210,.3);color:var(--silver-2);font-size:12px;letter-spacing:.06em} .edersy-card .gstatus[data-open="yes"]{color:#8fd8b0;border-color:rgba(143,216,176,.4)} .edersy-card .rule{display:flex;align-items:center;justify-content:center;gap:12px;margin:26px auto 30px;width:150px} .edersy-card .rule i{flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(184,194,210,.6))} .edersy-card .rule i:last-child{background:linear-gradient(90deg,rgba(184,194,210,.6),transparent)} .edersy-card .rule b{width:7px;height:7px;transform:rotate(45deg);border:1px solid var(--silver);flex:0 0 auto} .edersy-card .acts{display:flex;flex-direction:column;gap:12px} .edersy-card .cta{display:block;width:100%;text-align:center;border-radius:7px;text-transform:uppercase} .edersy-card .cta.solid{background:linear-gradient(180deg,var(--blue-2),var(--blue));color:#fff; font-size:14px;font-weight:600;letter-spacing:.11em;padding:17px 18px; box-shadow:0 12px 26px rgba(36,94,168,.45)} .edersy-card .cta.ghost{border:1px solid rgba(184,194,210,.4);color:#e2e8f2;font-size:12px; font-weight:500;letter-spacing:.15em;padding:14px 18px} /* ---------- SECCIONES ---------- */ .edersy-card section{padding:52px 32px} .edersy-card .eyebrow{font-size:11px;letter-spacing:.32em;color:var(--blue);text-transform:uppercase;text-align:center} .edersy-card .h2{font-family:var(--serif);font-weight:600;font-size:40px;line-height:1.04; text-align:center;margin-top:10px;color:var(--ink)} /* ---------- ÁREAS DE PRÁCTICA ---------- */ .edersy-card .areas{margin-top:32px;display:grid;grid-template-columns:1fr 1fr;gap:13px} .edersy-card .area{position:relative;background:var(--card);border:1px solid var(--line-s); border-radius:14px;padding:28px 16px;text-align:center; box-shadow:0 8px 22px rgba(12,28,52,.06);overflow:hidden} .edersy-card .area::before{content:"";position:absolute;top:0;left:0;right:0;height:3px; background:linear-gradient(90deg,var(--blue),var(--blue-2))} .edersy-card .area .ic{width:38px;height:38px;margin:0 auto 14px;color:var(--blue)} .edersy-card .area .ic svg{width:38px;height:38px;fill:none;stroke:currentColor;stroke-width:1.5; stroke-linecap:round;stroke-linejoin:round} .edersy-card .area b{display:block;font-family:var(--serif);font-size:18px;font-weight:600; color:var(--ink);line-height:1.18} /* ---------- BANDA DEL ABOGADO ---------- */ .edersy-card .band{position:relative;text-align:center;padding:50px 40px;color:#fff; background:radial-gradient(120% 80% at 50% 0%,var(--navy-hi),var(--navy) 68%)} .edersy-card .band::before{content:"";position:absolute;inset:18px; border:1px solid rgba(184,194,210,.18);pointer-events:none} .edersy-card .band .eyebrow{color:var(--silver)} .edersy-card .band h3{font-family:var(--serif);font-size:33px;font-weight:600;margin-top:10px; color:#fff;line-height:1.08} .edersy-card .band h3 em{font-style:italic;color:var(--silver-2)} .edersy-card .band p{margin-top:16px;color:#c3ccdb;font-size:14px;line-height:1.7} /* ---------- CONTACTO ---------- */ .edersy-card .rows{margin-top:30px;display:flex;flex-direction:column} .edersy-card .r{display:flex;align-items:center;gap:16px;width:100%;text-align:left; color:var(--ink);padding:18px 2px;border-bottom:1px solid var(--line)} .edersy-card .r:first-child{border-top:1px solid var(--line)} .edersy-card .r .ic{width:46px;height:46px;flex:0 0 46px;border:1px solid var(--line); border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--blue);background:#fff} .edersy-card .r .ic svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7; stroke-linecap:round;stroke-linejoin:round} .edersy-card .r .m{display:flex;flex-direction:column} .edersy-card .r .m b{font-size:16px;font-weight:600} .edersy-card .r .m span{font-size:12.5px;color:var(--mut);margin-top:2px} /* ---------- PIE ---------- */ .edersy-card footer{position:relative;text-align:center;padding:46px 40px 50px; background:radial-gradient(120% 90% at 50% 0%,var(--navy-hi),var(--navy) 70%)} .edersy-card footer .mark{width:236px;max-width:70%;margin:0 auto} .edersy-card footer .fn{margin-top:22px;font-family:var(--serif);font-size:18px;color:#eef2f8} .edersy-card footer .meta{margin-top:8px;color:var(--silver);font-size:11px;letter-spacing:.2em;text-transform:uppercase} .edersy-card footer .share{margin-top:18px;color:var(--silver-2);font-size:12px;letter-spacing:.14em;text-transform:uppercase} /* ---------- AVISO LEGAL ---------- */ /* Obligado en la tarjeta de un bufete: enviar datos por aquí no crea relación abogado-cliente, y conviene decirlo donde se piden esos datos. */ .edersy-card .legal{background:var(--navy);color:var(--silver);text-align:center; padding:0 34px 34px;font-size:10.5px;line-height:1.6;letter-spacing:.02em} /* El fax es un dato, no una acción: nadie envía un fax tocando la pantalla. Se ve igual que las demás filas pero sin cursor de enlace ni respuesta al toque, para no prometer algo que no ocurre. */ .edersy .rows .r[data-dato="si"]{cursor:default} .edersy .rows .r[data-dato="si"]:hover, .edersy .rows .r[data-dato="si"]:active{transform:none}