/*
Theme Name: Renzo Zamora
Theme URI: https://renzozamora.com/
Author: Renzo Zamora
Author URI: https://renzozamora.com/sobre-mi/
Description: Tema WordPress profesional de alto rendimiento para Renzo Zamora — Diseñador y Desarrollador Web. Incluye arquitectura modular basada en template-parts para loops reutilizables, soporte nativo de Schema.org en todos los elementos, integración con Amazon S3, componentes interactivos con glassmorphism y carga lazy.
Version: 1.0.1
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rzamora
Tags: custom-background, custom-logo, custom-menu, featured-images, portfolio, blog, dark-mode
*/


    :root{--paper:#f4f2e9;--ink:#202821;--green:#183c32;--lime:#d4f16c;--muted:#71756b;--line:rgba(32,40,33,.15);--white:#fbfaf5;--serif:Georgia,'Times New Roman',serif;--sans:'DM Sans',Arial,sans-serif;--display:'Manrope',Arial,sans-serif;--max:1210px}
    *{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}.wrap{width:min(var(--max),calc(100% - 64px));margin-inline:auto}.announcement{background:var(--green);color:#f8f6ec;text-align:center;padding:9px 20px;font-size:11px;letter-spacing:.12em;text-transform:uppercase}.announcement b{color:var(--lime);font-weight:600}.header{position:sticky;top:0;z-index:20;background:rgba(244,242,233,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.nav{height:78px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-size:15px;font-weight:800;letter-spacing:-.04em}.brand-mark{width:34px;height:34px;display:grid;place-items:center;background:var(--green);color:var(--lime);font-weight:800;font-size:15px;letter-spacing:-.1em}.nav-links{display:flex;align-items:center;gap:34px;font-size:13px;color:#4b5149}.nav-links a:not(.button):hover{color:var(--green)}.button{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:14px 19px;background:var(--lime);color:#1c2b21;border:1px solid var(--lime);font-size:12px;font-weight:700;letter-spacing:.015em;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px);background:#e0fa85}.button.dark{background:var(--green);border-color:var(--green);color:white}.button.dark:hover{background:#245447}.button.outline{background:transparent;border-color:rgba(255,255,255,.35);color:#fff}.mobile-toggle{display:none;border:0;background:none;padding:10px;font-size:22px}.hero{padding:74px 0 58px;overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:42px;align-items:center}.eyebrow{display:flex;gap:11px;align-items:center;color:#617064;text-transform:uppercase;letter-spacing:.16em;font-size:10px;font-weight:700}.eyebrow:before{content:'';width:25px;height:1px;background:#8c9a89}.hero h1{font:600 clamp(48px,6.5vw,82px)/.99 var(--display);letter-spacing:-.075em;margin:22px 0 24px;max-width:730px}.hero h1 em{font-family:var(--serif);font-weight:400;letter-spacing:-.07em;color:#55705b}.hero-copy{font-size:16px;color:#666c62;max-width:475px;line-height:1.7}.hero-actions{display:flex;gap:12px;align-items:center;margin-top:30px}.text-link{display:inline-flex;gap:9px;align-items:center;font-size:12px;font-weight:700;border-bottom:1px solid var(--ink);padding:10px 2px}.hero-note{display:flex;gap:13px;align-items:center;margin-top:34px;font-size:11px;color:#72776e}.avatars{display:flex}.avatars img{width:29px;height:29px;object-fit:cover;border-radius:50%;border:2px solid var(--paper);margin-right:-7px}.hero-visual{position:relative;min-height:495px;background:#d9dfca;overflow:hidden}.hero-photo{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center 30%;filter:saturate(.84)}.image-caption{position:absolute;bottom:17px;left:18px;padding:8px 11px;background:var(--paper);font-size:9px;text-transform:uppercase;letter-spacing:.12em}.visual-stamp{position:absolute;right:20px;top:20px;width:94px;height:94px;border-radius:50%;background:var(--lime);display:grid;place-items:center;text-align:center;font-size:9px;font-weight:700;line-height:1.35;letter-spacing:.08em;transform:rotate(9deg)}.hero-index{position:absolute;right:19px;bottom:17px;color:white;font-size:10px;letter-spacing:.15em}.proof{padding:22px 0;border-block:1px solid var(--line)}.proof-row{display:flex;align-items:center;justify-content:space-between;gap:24px}.proof-label{font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:#777c70;max-width:155px}.proof-logos{display:flex;align-items:center;justify-content:space-between;gap:35px;width:77%;font:700 17px var(--display);letter-spacing:-.06em;color:#73796f}.proof-logos span:nth-child(2){font:600 15px var(--serif);letter-spacing:.02em}.proof-logos span:nth-child(3){font:800 17px var(--display);letter-spacing:-.08em}.proof-logos span:nth-child(4){font:700 13px var(--sans);letter-spacing:.02em}.proof-logos span:nth-child(5){font:800 14px var(--display);letter-spacing:.12em}.section{padding:112px 0}.section-heading{display:grid;grid-template-columns:.72fr 1.28fr;align-items:end;gap:36px;margin-bottom:48px}.section-heading h2{font:600 clamp(38px,5vw,60px)/1.04 var(--display);letter-spacing:-.065em;margin:0}.section-heading h2 em{font:400 1em var(--serif);color:#607362}.section-intro{max-width:370px;color:#6f746a;font-size:14px;margin:0 0 6px;line-height:1.7}.dark-section{background:var(--green);color:#f5f3e9}.dark-section .eyebrow{color:#c4cdb9}.dark-section .eyebrow:before{background:var(--lime)}.dark-section .section-heading h2 em{color:var(--lime)}.dark-section .section-intro{color:#c0c9bc}.services-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:12px}.service{grid-column:span 4;min-height:232px;border:1px solid rgba(246,245,235,.2);padding:23px;display:flex;flex-direction:column;justify-content:space-between;transition:background .25s,color .25s,transform .25s}.service:hover{background:var(--lime);color:var(--ink);transform:translateY(-4px)}.service-top{display:flex;justify-content:space-between;align-items:center}.service-num{font-size:10px;letter-spacing:.15em;color:#b4c0b0}.service-icon{font:400 23px var(--serif);color:var(--lime)}.service:hover .service-icon{color:var(--green)}.service h3{font:600 22px/1.15 var(--display);letter-spacing:-.05em;margin:24px 0 8px}.service p{font-size:12px;line-height:1.65;color:#c2c8bd;max-width:280px;margin:0}.service:hover p{color:#596156}.service:hover .service-num{color:#586252}.service-arrow{align-self:flex-end;margin-top:17px;font-size:19px}.work{padding-bottom:118px}.work-head{margin-bottom:35px}.work-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.project{position:relative;min-height:410px;background:#e6e1d4;overflow:hidden}.project:nth-child(2){margin-top:72px}.project:nth-child(3){margin-top:-58px}.project img{position:absolute;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.75,.25,1)}.project:hover img{transform:scale(1.045)}.project:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(18,31,25,.72))}.project-meta{position:absolute;z-index:1;left:22px;right:22px;bottom:20px;color:white;display:flex;justify-content:space-between;align-items:end}.project-meta h3{font:600 28px var(--display);letter-spacing:-.05em;margin:0}.project-meta p{font-size:9px;text-transform:uppercase;letter-spacing:.14em;margin:4px 0 0;color:#e0e2d7}.project-arrow{font-size:22px}.project:nth-child(2) img{object-position:center 28%}.project:nth-child(4) img{object-position:center 20%}.services-bridge{padding-top:0}.bridge-inner{padding:34px 38px;background:#e4e9d5;display:flex;align-items:center;justify-content:space-between;gap:30px}.bridge-inner h3{font:600 30px/1.12 var(--display);letter-spacing:-.06em;margin:0;max-width:560px}.bridge-inner h3 em{font:400 var(--serif);color:#617463}.bridge-inner p{font-size:12px;color:#687064;margin:8px 0 0}.about{background:#e9e8dc}.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:75px;align-items:center}.about-photo{height:475px;position:relative;background:#d7d8c7;overflow:hidden}.about-photo img{width:100%;height:100%;object-fit:cover;object-position:center 24%}.about-side-note{position:absolute;bottom:15px;left:15px;background:var(--paper);padding:10px 13px;font:italic 13px var(--serif)}.about-copy h2{font:600 clamp(40px,5.2vw,62px)/1.02 var(--display);letter-spacing:-.07em;margin:18px 0 23px}.about-copy h2 em{font:400 var(--serif);color:#58725e}.about-copy>p{font-size:14px;color:#666c62;max-width:480px;line-height:1.8}.about-points{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:30px 0}.point{border-top:1px solid var(--line);padding-top:12px}.point strong{display:block;font:700 13px var(--display)}.point span{font-size:11px;color:#74796e}.journal{padding-bottom:115px}.journal-list{border-top:1px solid var(--line)}.journal-item{display:grid;grid-template-columns:80px 1fr auto;gap:20px;align-items:center;border-bottom:1px solid var(--line);padding:19px 4px}.journal-item span{font-size:10px;color:#828578}.journal-item h3{font:500 19px var(--display);letter-spacing:-.03em;margin:0}.journal-item b{font-size:18px;font-weight:400}.closing{background:var(--lime);padding:82px 0}.closing-inner{display:flex;align-items:end;justify-content:space-between;gap:30px}.closing h2{font:600 clamp(42px,7vw,78px)/.98 var(--display);letter-spacing:-.075em;margin:17px 0 14px;max-width:760px}.closing h2 em{font:400 var(--serif)}.closing p{font-size:13px;color:#4e5c45;max-width:400px;margin:0}.closing .eyebrow{color:#53634e}.closing .eyebrow:before{background:var(--green)}.closing .button{background:var(--green);border-color:var(--green);color:white;white-space:nowrap}.footer{background:var(--green);color:#f2f0e4;padding:42px 0 20px}.footer-top{display:flex;align-items:flex-start;justify-content:space-between;padding-bottom:38px}.footer-brand p{max-width:260px;color:#bfc8bb;font-size:11px;line-height:1.7}.footer-links{display:flex;gap:60px}.footer-col{display:grid;gap:9px;font-size:11px;color:#c4ccbf}.footer-col strong{font-size:9px;color:var(--lime);letter-spacing:.15em;text-transform:uppercase;margin-bottom:6px}.footer-bottom{border-top:1px solid rgba(255,255,255,.18);padding-top:16px;display:flex;justify-content:space-between;color:#b6c0b4;font-size:9px;letter-spacing:.06em}.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:translateY(0)}:focus-visible{outline:3px solid #83a344;outline-offset:4px}::selection{background:var(--lime);color:var(--ink)}
    @media(max-width:850px){.wrap{width:min(var(--max),calc(100% - 40px))}.nav-links{gap:18px}.nav-links a:nth-child(2){display:none}.hero-grid{grid-template-columns:1fr  .8fr;gap:22px}.hero-visual{min-height:420px}.section{padding:85px 0}.service{grid-column:span 6}.project{min-height:330px}.about-grid{gap:38px}.about-photo{height:410px}.proof-logos{gap:18px}}
    @media(max-width:620px){.wrap{width:calc(100% - 36px)}.announcement{font-size:9px;letter-spacing:.08em}.nav{height:66px}.nav-links{display:none;position:absolute;left:0;right:0;top:66px;padding:18px;background:var(--paper);border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:0}.nav-links.open{display:flex}.nav-links a{padding:12px 4px}.nav-links a:nth-child(2){display:block}.nav-links .button{margin-top:9px}.mobile-toggle{display:block}.hero{padding:48px 0 35px}.hero-grid{grid-template-columns:1fr;gap:28px}.hero h1{font-size:clamp(48px,14vw,68px);max-width:520px}.hero-copy{font-size:14px}.hero-visual{min-height:420px;max-height:540px}.hero-actions{flex-wrap:wrap}.hero-note{margin-top:25px}.proof-row{display:block}.proof-label{max-width:none;margin-bottom:18px}.proof-logos{width:100%;gap:13px;flex-wrap:wrap;font-size:14px}.proof-logos span{flex:1;text-align:center}.proof-logos span:nth-child(2){font-size:13px}.section{padding:72px 0}.section-heading{grid-template-columns:1fr;gap:17px;margin-bottom:30px}.section-heading h2{font-size:42px}.section-intro{font-size:13px}.services-grid{gap:9px}.service{grid-column:span 12;min-height:190px;padding:19px}.service h3{font-size:21px;margin:16px 0 7px}.service p{max-width:340px}.work{padding-bottom:75px}.work-grid{grid-template-columns:1fr;gap:12px}.project,.project:nth-child(2),.project:nth-child(3){margin:0;min-height:340px}.bridge-inner{padding:25px;display:block}.bridge-inner h3{font-size:25px}.bridge-inner .button{margin-top:19px}.about-grid{grid-template-columns:1fr;gap:28px}.about-photo{height:410px}.about-copy h2{font-size:46px}.about-points{gap:13px}.journal{padding-bottom:74px}.journal-item{grid-template-columns:46px 1fr auto;gap:12px;padding:16px 2px}.journal-item h3{font-size:15px}.closing{padding:58px 0}.closing-inner{display:block}.closing h2{font-size:53px}.closing .button{margin-top:24px}.footer-top{display:block}.footer-links{margin-top:29px;gap:40px}.footer-bottom{gap:15px;line-height:1.5}}
    @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.reveal{opacity:1;transform:none}}
  


    :root{--paper:#11111b;--ink:#f5f3fa;--green:#1a1930;--lime:#fa1b68;--muted:#a8a7b6;--line:rgba(255,255,255,.14);--white:#f5f3fa;--max:1120px}
    body{background:#11111b;color:#f5f3fa;font-family:var(--display)}
    .announcement{height:46px;background:linear-gradient(100deg,#cd1049,#a20e58);color:#fff;font-size:12px;letter-spacing:0;text-transform:uppercase;font-weight:700;padding:8px}.announcement b{color:#ffe7a6}
    .header{position:relative;background:#151421;border:0}.nav{height:100px;max-width:1120px}.brand{font-size:18px;color:#fff}.brand-mark{width:54px;height:54px;border:2px solid #fff;border-radius:50%;background:transparent;color:#fff;font-size:17px;letter-spacing:-.1em}.nav-links{color:#fff}.nav-links a:not(.button):hover{color:#29dacd}.button,.button.dark,.closing .button{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:12px 24px;border:1px solid rgba(244,20,99,.45);border-radius:12px;background:linear-gradient(135deg,rgba(244,20,99,.22) 0%,rgba(238,53,167,.1) 100%);color:#fff;font:700 16px/1.2 'Inter',Arial,sans-serif;white-space:nowrap;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 8px 24px rgba(244,20,99,.18),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .25s ease,background .25s ease,border-color .25s ease,box-shadow .25s ease}.button:hover,.button.dark:hover,.closing .button:hover{transform:translateY(-2px);background:linear-gradient(135deg,#f41463 0%,#ee35a7 100%);border-color:#f41463;box-shadow:0 12px 32px rgba(244,20,99,.4),0 0 20px rgba(238,53,167,.35);color:#fff}.button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s ease}.button:hover svg{transform:translate(3px,-3px)}.button.outline{background:transparent;border-color:rgba(255,255,255,.38);box-shadow:none}
    .hero{position:relative;text-align:center;padding:5px 0 57px;background:radial-gradient(ellipse at 50% 42%,rgba(65,36,113,.38),transparent 55%),#11111b}.hero-grid{display:flex;flex-direction:column;gap:24px;max-width:880px}.hero-content{width:100%}.hero .eyebrow{display:inline-flex;border:1px solid rgba(54,217,212,.35);background:rgba(36,207,201,.07);border-radius:999px;padding:8px 28px;color:#43d9d2;font-size:10px;letter-spacing:.19em;justify-content:center}.hero .eyebrow:before{display:none}.hero h1{max-width:820px;margin:27px auto 22px;text-transform:uppercase;font:800 clamp(39px,6vw,69px)/1.04 var(--display);letter-spacing:-.055em;color:#f8f6fb}.hero h1 em{font:inherit;background:linear-gradient(95deg,#2dd9ce 7%,#8b59ed 55%,#ee35a7 94%);color:transparent;background-clip:text;-webkit-background-clip:text}.hero-copy{max-width:680px;margin:0 auto;color:#c8c5d1;font-size:16px;line-height:1.7}.hero-actions{justify-content:center;margin-top:24px}.hero-actions .button{min-width:245px}.hero-actions .text-link{color:#f3f0f7;border-color:rgba(255,255,255,.4)}.hero-note{justify-content:center;color:#d1cdda;margin-top:22px}.avatars img{border-color:#171624}.hero-visual{width:min(780px,100%);min-height:310px;height:360px;background:#201b37;border:1px solid rgba(131,109,184,.4);border-radius:18px;margin-top:9px;box-shadow:0 30px 90px rgba(0,0,0,.32);overflow:hidden}.hero-photo{object-fit:cover;object-position:center 29%;filter:saturate(.72) brightness(.75)}.hero-visual:after{content:'RENZOZAMORA.COM  /  DISEÑO Y DESARROLLO WEB';position:absolute;left:0;right:0;bottom:0;padding:18px;background:linear-gradient(transparent,rgba(10,10,20,.78));color:#fff;font-size:10px;letter-spacing:.16em;text-align:left}.visual-stamp{width:95px;height:95px;right:17px;top:17px;background:#f31567;color:#fff}.image-caption{display:none}
    .proof{border:0;background:#171622;padding:21px 0}.proof-label{color:#c5c0d0;max-width:210px}.proof-logos{color:#aaa6b7}
    .section{background:#11111b}.dark-section{background:linear-gradient(180deg,#211d39,#191727);color:#fff}.dark-section .section-intro,.service p{color:#c1bdce}.dark-section .section-heading h2 em,.service-icon{color:#31d7ce}.service{border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.025);border-radius:12px}.service:hover{background:#29253d;color:white;transform:translateY(-3px);border-color:#4b3d70}.service:hover p{color:#d7d3e1}.service:hover .service-icon{color:#38ddd4}.service-num{color:#b0aaba}.service:hover .service-num{color:#ded8e8}
    .work{background:#f5f3fa;color:#191722}.work .eyebrow,.about .eyebrow,.journal .eyebrow{color:#635c78}.work .eyebrow:before,.about .eyebrow:before,.journal .eyebrow:before{background:#a59db5}.work .section-intro{color:#696474}.project{border-radius:12px}.services-bridge{background:#f5f3fa;padding:0 0 90px;color:#191722}.bridge-inner{background:#e7e1f4;border-radius:14px}.bridge-inner h3 em{color:#7555b6}.about{background:#e8e5ef;color:#191722}.about .section-intro,.about-copy>p{color:#615d69}.about-copy h2 em{color:#7653b8}.point{border-color:rgba(25,23,34,.2)}.point span{color:#6e6975}.journal{background:#f5f3fa;color:#191722}.journal .section-intro{color:#696474}.journal-list,.journal-item{border-color:rgba(25,23,34,.18)}.journal-item span{color:#777181}.closing{background:linear-gradient(110deg,#4f32a0,#27214f);color:#fff}.closing .eyebrow{color:#45dad1}.closing .eyebrow:before{background:#45dad1}.closing h2 em{color:#46d9d1}.closing p{color:#d0cbdc}.closing .button{border-radius:12px}.footer{background:#101019}.reveal{transform:translateY(20px)}
    .brand-logo{display:block;width:158px;height:auto;object-fit:contain}.nav{height:96px}.header{background:#151421}.mobile-toggle{color:#fff}
    .hero{padding:20px 0 0;overflow:hidden;background:radial-gradient(ellipse at 52% 78%,rgba(97,47,146,.42),transparent 47%),radial-gradient(ellipse at 80% 72%,rgba(18,127,156,.20),transparent 35%),#11111b}.hero-grid{display:block;max-width:1120px;position:relative;min-height:700px}.hero-content{position:relative;z-index:3;text-align:center;padding-top:4px}.hero .eyebrow{padding:9px 22px}.hero h1{font-size:clamp(52px,7.3vw,88px);line-height:.99;max-width:950px;margin:22px auto 17px;letter-spacing:-.065em}.hero-copy{max-width:630px;font-size:16px}.hero-actions{margin-top:21px}.hero-note{gap:13px;margin-top:18px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#c5bfd2}.hero-note i{height:3px;width:3px;background:#39d8d0;border-radius:50%}
    .hero-scene{position:absolute;inset:276px 0 0;width:100%;height:auto;min-height:0;margin:0;background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible}.hero-scene:after{display:none}.hero-scene .hero-photo{position:absolute;z-index:2;right:4%;bottom:0;width:min(51%,550px);height:calc(100% + 32px);object-fit:contain;object-position:bottom center;filter:drop-shadow(0 0 44px rgba(71,208,210,.18))}.hero-word{position:absolute;left:0;bottom:28px;z-index:0;font:800 clamp(82px,15vw,180px)/.76 var(--display);letter-spacing:-.1em;color:rgba(229,224,247,.09);text-align:left;white-space:nowrap}.hero-word span{color:transparent;-webkit-text-stroke:1px rgba(214,209,235,.23)}.project-preview{position:absolute;z-index:1;left:6%;bottom:58px;width:clamp(230px,30vw,380px);height:240px;overflow:hidden;background:#f7f6f1;transform:rotate(-5deg);border:7px solid rgba(245,243,250,.94);box-shadow:0 26px 70px rgba(0,0,0,.42)}.project-preview img{width:100%;height:100%;object-fit:cover;object-position:top center}.project-preview>div{position:absolute;left:0;right:0;bottom:0;padding:28px 12px 11px;background:linear-gradient(transparent,rgba(10,9,17,.83));color:#fff;display:flex;align-items:end;justify-content:space-between}.project-preview strong{font:700 15px var(--display)}.project-preview span{font-size:8px;letter-spacing:.1em;text-transform:uppercase}.scene-orbit{position:absolute;border:1px solid rgba(53,221,216,.4);border-radius:50%;transform:rotate(-26deg)}.orbit-a{z-index:0;width:600px;height:240px;right:5%;bottom:70px}.orbit-b{z-index:0;width:510px;height:205px;right:9%;bottom:86px;border-color:rgba(198,63,206,.35);transform:rotate(28deg)}.hero-caption{position:absolute;z-index:4;right:0;bottom:35px;color:#fff;text-transform:uppercase;letter-spacing:.13em;font-size:10px;line-height:1.9;text-align:right}.hero-caption b{color:#3adad3;font-weight:700}.visual-stamp{z-index:4;right:28%;top:100px;width:88px;height:88px;background:#f41463;color:#fff;line-height:1.35;letter-spacing:.1em;transform:rotate(10deg)}
    @media(max-width:850px){.hero-grid{min-height:650px}.hero-scene{inset:300px 0 0}.hero-scene .hero-photo{right:0;width:58%}.project-preview{left:3%;width:32%;height:210px}.hero-word{font-size:15vw}.orbit-a{width:50vw}.orbit-b{width:46vw}}
    @media(max-width:620px){.announcement{height:auto;min-height:42px;padding:8px 12px;font-size:10px}.nav{height:75px}.brand-logo{width:125px}.nav-links{background:#171624;border-color:rgba(255,255,255,.15)}.mobile-toggle{color:white}.hero{padding:12px 0 0}.hero-grid{min-height:670px}.hero-content{padding-top:4px}.hero .eyebrow{padding:8px 11px;font-size:8px;letter-spacing:.12em}.hero h1{font-size:clamp(44px,12vw,64px);margin:22px auto 15px;line-height:1}.hero-copy{font-size:13px;max-width:440px}.hero-actions{flex-direction:column;gap:8px;margin-top:17px}.hero-actions .button{width:100%;max-width:340px}.hero-note{font-size:8px;gap:8px;letter-spacing:.07em}.hero-scene{inset:365px 0 0}.hero-scene .hero-photo{right:-6%;width:76%;height:calc(100% + 10px)}.project-preview{left:-1%;bottom:34px;width:46%;height:145px;border-width:5px;transform:rotate(-7deg)}.project-preview>div{padding:23px 7px 7px;display:block}.project-preview strong{font-size:12px}.project-preview span{display:block;font-size:7px}.hero-word{left:-3%;bottom:14px;font-size:19vw;line-height:.78}.orbit-a{width:88vw;height:34vw;right:-10%;bottom:25px}.orbit-b{width:77vw;height:31vw;right:-5%;bottom:40px}.hero-caption{right:0;bottom:18px;font-size:7px}.visual-stamp{right:20%;top:43px;width:64px;height:64px;font-size:7px}.proof{padding:17px 0}.proof-label{margin-bottom:14px;text-align:center;max-width:none}.dark-section{padding:67px 0}.service{border-radius:10px}.work{padding:70px 0}.services-bridge{padding-bottom:67px}.about{padding:67px 0}.closing{padding:59px 0}.closing .button{margin-top:24px}}
    :root{--sans:'Inter',Arial,sans-serif;--display:'Jost',Arial,sans-serif;--paper:#11111b;--ink:#f5f3fa}
    .header{position:fixed;z-index:30;top:46px;left:0;right:0;width:100%;background:transparent;border:0;backdrop-filter:none;-webkit-backdrop-filter:none;transition:top .28s ease,background .28s ease,backdrop-filter .28s ease,box-shadow .28s ease}.header.scrolled{top:0;background:rgba(20,19,32,.76);backdrop-filter:blur(18px) saturate(145%);-webkit-backdrop-filter:blur(18px) saturate(145%);border-bottom:1px solid rgba(255,255,255,.12);box-shadow:0 8px 28px rgba(5,4,14,.16)}
    .brand-logo{filter:brightness(0) invert(1)}.hero{padding-top:132px}.hero-grid{min-height:700px}.hero-scene .hero-photo{z-index:5}.visual-stamp{display:none}
    .announcement{font-family:'Jost',Arial,sans-serif}
    .proof,.section,.dark-section,.work,.services-bridge,.about,.journal,.closing,.footer{background-color:#11111b;background-image:none;color:#f5f3fa}
    #servicios .eyebrow,#servicios .section-intro,#servicios .service-num,#servicios .service p{font-size:16px}
    .work .eyebrow,.about .eyebrow,.journal .eyebrow{color:#64ddd5}.work .eyebrow:before,.about .eyebrow:before,.journal .eyebrow:before{background:#64ddd5}
    .work .section-intro,.about .section-intro,.about-copy>p,.journal .section-intro{color:#c8c5d1}.about-copy h2 em,.bridge-inner h3 em{color:#56d8d2}
    .services-bridge{padding-top:0}.bridge-inner{background:#191827;color:#f5f3fa;border:1px solid rgba(255,255,255,.14)}.bridge-inner p{color:#c8c5d1}
    .point{border-color:rgba(255,255,255,.18)}.point strong{color:#f5f3fa}.point span,.journal-item span{color:#b5b1c2}
    .journal-list,.journal-item{border-color:rgba(255,255,255,.17)}.closing h2 em{color:#44d9d2}.closing p{color:#c8c5d1}
    :root{--serif:'Jost',Arial,sans-serif}
    h1,h2,h3,h4,h5,h6{font-family:'Jost',Arial,sans-serif;font-weight:600}
    .hero h1,.section-heading h2,.service h3,.project-meta h3,.bridge-inner h3,.about-copy h2,.closing h2{font-weight:600}
    .nav-links,.nav-links a,.nav-links .button{font-family:'Inter',Arial,sans-serif;font-size:16px}
    .button,.button.dark,.closing .button{font:700 16px/1.2 'Inter',Arial,sans-serif}
    /* Hero estandarizado con la tipografía y escala del resto del proyecto */
    .hero .eyebrow{display:inline-flex;align-items:center;border:1px solid rgba(54,217,212,.35);background:rgba(36,207,201,.08);border-radius:999px;padding:8px 24px;color:#43d9d2;font:700 13px/1 'Inter',Arial,sans-serif;letter-spacing:.15em;text-transform:uppercase;justify-content:center}
    .hero-copy{max-width:680px;margin:0 auto;color:#cfcbdb;font:400 18px/1.7 'Inter',Arial,sans-serif}
    .hero-actions{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:24px;flex-wrap:wrap}
    .hero-actions .button{min-width:245px;font:700 16px/1.2 'Inter',Arial,sans-serif}
    .hero-actions .text-link{display:inline-flex;align-items:center;gap:8px;font:600 16px/1.4 'Inter',Arial,sans-serif;color:#f3f0f7;border-bottom:1px solid rgba(255,255,255,.45);padding:10px 4px;transition:color .2s ease,border-color .2s ease}
    .hero-actions .text-link:hover{color:#3adad3;border-color:#3adad3}
    .hero-actions .text-link span{display:inline-block;font-size:16px;transition:transform .2s ease}
    .hero-actions .text-link:hover span{transform:translateY(2px)}
    .hero-note{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:22px;font:600 13px/1.4 'Inter',Arial,sans-serif;letter-spacing:.09em;text-transform:uppercase;color:#c5bfd2}
    .hero-note i{width:4px;height:4px;background:#39d8d0;border-radius:50%;display:inline-block;opacity:.8}
    main>section:not(.hero):not(.services-bridge){background-color:#11111b;background-image:none;color:#f5f3fa}
    .proof{position:relative;border-block:1px solid rgba(255,255,255,.12);padding:24px 0}.proof-row{justify-content:center;gap:36px}.proof-label{max-width:none;color:#b8b4c4;font-size:12px;letter-spacing:.12em}.proof-logos{max-width:820px;color:#d6d2df;opacity:.78}.proof-logos span{font-size:18px}
    .section-heading{display:block;text-align:center;max-width:900px;margin:0 auto 46px}.section-heading>div{display:flex;flex-direction:column;align-items:center;gap:17px}.section-heading .eyebrow,.about-copy .eyebrow,.closing .eyebrow{justify-content:center;color:#f04d97;font-size:12px;letter-spacing:.18em}.section-heading .eyebrow:before,.about-copy .eyebrow:before,.closing .eyebrow:before{display:none}.section-heading h2,.about-copy h2,.closing h2{font-size:clamp(42px,5.7vw,68px);line-height:.99;letter-spacing:-.045em;text-transform:uppercase}.section-heading h2 em,.about-copy h2 em,.closing h2 em{font-style:normal;color:#39d7d0}.section-heading .section-intro{max-width:720px;margin:20px auto 0;color:#c5c2ce;font-size:17px;line-height:1.7}
    .dark-section{padding-block:118px}.services-grid{gap:14px}.service{position:relative;min-height:250px;padding:28px 27px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));border:1px solid rgba(255,255,255,.13);border-radius:14px;transition:transform .25s ease,border-color .25s ease,background .25s ease}.service:before{content:"";position:absolute;left:27px;right:27px;top:0;height:2px;background:linear-gradient(90deg,#28d5cf,#895be8,#ee3286);opacity:.78}.service:nth-child(3n+2):before{background:linear-gradient(90deg,#895be8,#ee3286,#f8a928)}.service:nth-child(3n):before{background:linear-gradient(90deg,#ee3286,#f8a928,#28d5cf)}.service:hover{background:linear-gradient(145deg,rgba(59,218,212,.1),rgba(255,255,255,.025));border-color:rgba(57,215,208,.5);transform:translateY(-5px)}.service-top{margin-bottom:26px}.service-num{font-size:16px;color:#c8c4d1;letter-spacing:.1em}.service-icon,.service-arrow{color:#39d7d0}.service h3{font-size:24px;line-height:1.1;text-transform:uppercase;letter-spacing:-.025em}.service p{font-size:16px;line-height:1.7;color:#c5c2ce;max-width:34ch}
    .work{padding-block:120px}.work-grid{gap:22px}.project{min-height:460px;border-radius:14px;background:#1a1928;border:1px solid rgba(255,255,255,.16)}.project:nth-child(2){margin-top:78px}.project:nth-child(3){margin-top:-58px}.project img{filter:saturate(.86) brightness(.84)}.project:hover img{filter:saturate(1) brightness(.95)}.project:after{inset:38% 0 0;background:linear-gradient(transparent,rgba(9,8,16,.88))}.project-meta{left:25px;right:25px;bottom:23px}.project-meta h3{font-size:30px;text-transform:uppercase;letter-spacing:-.035em}.project-meta p{font-size:13px;color:#e3deeb;letter-spacing:.12em}.project-arrow{width:42px;height:42px;border:1px solid rgba(255,255,255,.6);border-radius:50%;display:grid;place-items:center}
    .services-bridge{padding:0 0 96px}.bridge-inner{min-height:190px;padding:40px 48px;background:radial-gradient(ellipse at 100% 0%,rgba(119,68,187,.18),transparent 48%),#191827;border:1px solid rgba(255,255,255,.16);border-radius:14px}.bridge-inner h3{font-size:clamp(28px,3.5vw,40px);line-height:1.08;letter-spacing:-.035em;text-transform:uppercase}.bridge-inner p{font-size:16px}.bridge-inner .button,.closing .button{min-height:54px;font-size:16px}
    .about{padding-block:116px}.about-grid{grid-template-columns:.88fr 1.12fr;gap:84px}.about-photo{height:520px;background:radial-gradient(ellipse at 55% 40%,rgba(48,160,170,.2),transparent 55%),#191827;border:1px solid rgba(255,255,255,.16);border-radius:14px}.about-photo img{object-fit:contain;object-position:center bottom}.about-side-note{background:#11111b;color:#fff;border:1px solid rgba(255,255,255,.18);font:500 16px 'Inter',Arial,sans-serif}.about-copy h2{margin:20px 0 24px}.about-copy>p{color:#c5c2ce;font-size:17px;line-height:1.75}.about-points{gap:22px 28px;margin:32px 0}.point{padding-top:14px;border-color:rgba(255,255,255,.2)}.point strong{font:600 17px 'Jost',Arial,sans-serif}.point span{display:block;margin-top:4px;font:400 15px/1.55 'Inter',Arial,sans-serif;color:#c4c0ce}.about-copy .text-link{color:white;border-color:rgba(255,255,255,.6);font:600 16px 'Inter',Arial,sans-serif}
    .journal{padding-block:112px}.journal .section-heading{margin-bottom:42px}.journal-list{border-top:1px solid rgba(255,255,255,.18)}.journal-item{min-height:84px;padding:20px 12px;border-color:rgba(255,255,255,.17);transition:padding .2s ease,color .2s ease}.journal-item:hover{padding-left:22px;color:#42d8d1}.journal-item span{font-size:13px;letter-spacing:.12em}.journal-item h3{font:600 21px 'Jost',Arial,sans-serif;text-transform:uppercase;letter-spacing:-.02em}.journal-item b{font-size:22px;color:#43d8d1}
    .closing{padding-block:100px;border-top:1px solid rgba(255,255,255,.12);text-align:center;background:radial-gradient(ellipse at 50% 100%,rgba(97,47,146,.28),transparent 55%),#11111b!important}.closing-inner{display:flex;flex-direction:column;align-items:center;gap:27px}.closing-inner>div{display:flex;flex-direction:column;align-items:center}.closing h2{max-width:880px;margin:18px 0 16px}.closing p{font-size:17px;line-height:1.7;max-width:650px}.closing .button{margin:0;border-radius:12px}
    .footer{border-top:1px solid rgba(255,255,255,.14);padding-top:52px}.footer-brand p{font:400 15px/1.7 'Inter',Arial,sans-serif;color:#c5c2ce}.footer-col{font:400 15px/1.5 'Inter',Arial,sans-serif;color:#d4d0dd}.footer-col strong{font:600 13px 'Jost',Arial,sans-serif;color:#44d8d0;letter-spacing:.14em}.footer-bottom{font:400 13px 'Inter',Arial,sans-serif;color:#bcb8c8}
    @media(max-width:850px){.section-heading h2,.about-copy h2,.closing h2{font-size:clamp(40px,7vw,58px)}.project,.project:nth-child(2),.project:nth-child(3){min-height:350px}.about-grid{gap:42px}.about-photo{height:440px}}
    @media(max-width:620px){.proof-row{display:flex;flex-direction:column;gap:13px}.proof-logos{width:100%;justify-content:center;gap:18px}.proof-logos span{font-size:16px}.section-heading{margin-bottom:32px}.section-heading .section-intro{font-size:16px}.dark-section,.work,.about,.journal{padding-block:78px}.service{min-height:220px;padding:24px 22px}.service:before{left:22px;right:22px}.service h3{font-size:22px}.service p{font-size:16px}.project,.project:nth-child(2),.project:nth-child(3){min-height:350px;margin:0}.services-bridge{padding-bottom:70px}.bridge-inner{padding:28px 24px;gap:12px}.bridge-inner h3{font-size:27px}.about-grid{gap:30px}.about-photo{height:380px}.about-copy h2{font-size:43px}.about-copy>p{font-size:16px}.about-points{gap:18px 14px}.point strong{font-size:16px}.point span{font-size:14px}.journal-item{grid-template-columns:1fr auto;gap:8px}.journal-item span{grid-column:1/-1;font-size:12px}.journal-item h3{font-size:18px}.closing{padding-block:76px}.closing h2{font-size:44px}.closing p{font-size:16px}.footer{padding-top:38px}.footer-col{font-size:14px}.footer-bottom{font-size:12px}}
    @media(max-width:620px){.header{top:42px}.header.scrolled{top:0}.hero{padding-top:112px}.hero-grid{min-height:670px}.hero .eyebrow{padding:7px 16px;font-size:11.5px;letter-spacing:.1em}.hero-copy{font-size:16px;line-height:1.65;max-width:440px}.hero-actions{flex-direction:column;gap:12px;margin-top:20px}.hero-actions .button{width:100%;max-width:340px;font-size:16px}.hero-actions .text-link{font-size:15px;padding:8px 4px}.hero-note{font-size:11.5px;gap:10px;letter-spacing:.06em}}
  


.inline-icon,.service-icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.inline-icon{display:block}.service-arrow{width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(67,216,209,.4);border-radius:50%;color:#43d8d1}.service-arrow:hover{background:#30d4ce;color:#11111b}.service-arrow .inline-icon{width:18px;height:18px}
.project-carousel{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:12px}.work-grid{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:8px 4px 22px}.work-grid::-webkit-scrollbar{display:none}.work-grid .project{flex:0 0 min(72%,720px);min-height:440px;scroll-snap-align:center;margin:0!important}.carousel-control{width:44px;height:44px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.25);border-radius:50%;background:#191827;color:#f5f3fa;cursor:pointer;transition:background .2s,color .2s,border-color .2s}.carousel-control svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.carousel-control:hover:not(:disabled){background:#30d4ce;color:#11111b;border-color:#30d4ce}.carousel-control:disabled{opacity:.35;cursor:default}.carousel-progress{height:2px;max-width:220px;background:rgba(255,255,255,.18);margin:16px auto 0}.carousel-progress span{display:block;width:25%;height:100%;background:#35d2cd;transition:transform .25s ease}.project-arrow svg,.journal-read svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.journal-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:16px 4px}.journal-card{display:flex;flex-direction:column;border:1px solid rgba(255,255,255,.14);border-radius:14px;background:linear-gradient(145deg,#181728,#131221);color:#f5f3fa;transition:transform .24s,border-color .24s,box-shadow .24s}.journal-card:hover{transform:translateY(-5px);border-color:rgba(53,210,205,.6);box-shadow:0 20px 45px rgba(0,0,0,.25)}.journal-image{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:13px 13px 0 0;background:#232136;flex-shrink:0}.journal-image:after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(12,11,19,.4))}.journal-image img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .5s ease,filter .3s}.journal-card:hover .journal-image img{transform:scale(1.045);filter:saturate(1.08)}.journal-category{position:absolute;z-index:2;left:14px;top:14px;padding:4px 8px;border:1px solid rgba(255,255,255,.3);border-radius:4px;background:rgba(17,17,27,.88);color:#57ded6;font:700 9.5px 'Inter',Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase}.journal-copy{padding:22px;display:flex;flex-direction:column;flex:1 1 auto}.journal-meta{display:flex;align-items:center;justify-content:space-between;width:100%;gap:12px;margin-bottom:2px}.journal-kicker{color:#f41463;font:700 12px/1.3 'Inter',Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase}.journal-read-time{display:inline-flex;align-items:center;gap:6px;color:#a9a4b8;font:500 12px/1.3 'Inter',Arial,sans-serif;letter-spacing:.02em;white-space:nowrap}.journal-read-time svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:.8}.journal-copy h3{min-height:58px;margin:10px 0 0;color:#f5f3fa;font:600 22px/1.2 'Jost',Arial,sans-serif;text-transform:uppercase;letter-spacing:-.02em}.journal-read{margin-top:auto;padding-top:22px;display:inline-flex;align-items:center;gap:8px;color:#43d8d1;font:600 15px 'Inter',Arial,sans-serif;transition:color .2s ease,gap .2s ease}.journal-card:hover .journal-read{color:#5df6ee;gap:11px}.menu-icon{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:850px){.journal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.work-grid .project{flex-basis:82%;min-height:370px}}
@media(max-width:620px){.project-carousel{grid-template-columns:34px minmax(0,1fr) 34px;gap:6px}.carousel-control{width:34px;height:34px}.work-grid{gap:12px;padding-bottom:16px}.work-grid .project{flex-basis:100%;min-height:340px}.journal-grid{grid-template-columns:1fr;gap:14px}.journal-image{aspect-ratio:16/9}.journal-copy h3{min-height:0;font-size:21px}.journal-copy{padding:18px}}
@media(prefers-reduced-motion:reduce){.journal-card,.work-grid,.journal-image img{transition:none;scroll-behavior:auto}}



/* Fondo ambiental continuo en todo el contenido posterior al hero */
main{position:relative;isolation:isolate;background:#11111b}
main::before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(ellipse 42% 9% at 0% 23%,rgba(34,211,205,.11),transparent 72%),radial-gradient(ellipse 46% 11% at 100% 48%,rgba(121,65,214,.11),transparent 74%),radial-gradient(ellipse 42% 10% at 5% 74%,rgba(36,192,207,.09),transparent 72%),radial-gradient(ellipse 44% 10% at 100% 91%,rgba(196,49,153,.07),transparent 74%)}
main>section:not(.hero){position:relative;background:transparent!important;background-image:none!important;color:#f5f3fa}
main>section.services-bridge::before{content:none!important;display:none!important}
/* Border Glow para los proyectos del carrusel (React Bits BorderGlow) */
.work-grid{padding:26px 8px 34px!important}
#proyectos .project {
  --edge-proximity: 0;
  --cursor-angle: 45deg;
  --edge-sensitivity: 30;
  --color-sensitivity: calc(var(--edge-sensitivity) + 20);
  --border-radius: 24px;
  --glow-padding: 38px;
  --cone-spread: 25;
  --fill-opacity: 0.35;
  --card-bg: #151622;

  /* Glow color vars: Cian característico de la web (HSL 176 85% 76%) */
  --glow-color: hsl(176deg 85% 76% / 100%);
  --glow-color-60: hsl(176deg 85% 76% / 60%);
  --glow-color-50: hsl(176deg 85% 76% / 50%);
  --glow-color-40: hsl(176deg 85% 76% / 40%);
  --glow-color-30: hsl(176deg 85% 76% / 30%);
  --glow-color-20: hsl(176deg 85% 76% / 20%);
  --glow-color-10: hsl(176deg 85% 76% / 10%);

  /* Gradiente de malla con la paleta de la web (#2dd9ce, #8b59ed, #ee35a7) */
  --gradient-one: radial-gradient(at 80% 55%, #8b59ed 0px, transparent 50%);
  --gradient-two: radial-gradient(at 69% 34%, #ee35a7 0px, transparent 50%);
  --gradient-three: radial-gradient(at 8% 6%, #2dd9ce 0px, transparent 50%);
  --gradient-four: radial-gradient(at 41% 38%, #8b59ed 0px, transparent 50%);
  --gradient-five: radial-gradient(at 86% 85%, #ee35a7 0px, transparent 50%);
  --gradient-six: radial-gradient(at 82% 18%, #2dd9ce 0px, transparent 50%);
  --gradient-seven: radial-gradient(at 51% 4%, #ee35a7 0px, transparent 50%);
  --gradient-base: linear-gradient(135deg, #2dd9ce 0%, #8b59ed 50%, #ee35a7 100%);

  position: relative;
  isolation: isolate;
  border-radius: var(--border-radius)!important;
  transform: translate3d(0, 0, 0.01px);
  border: 1px solid rgba(255, 255, 255, 0.16)!important;
  background-color: var(--card-bg, #151622)!important;
  overflow: visible!important;
  box-shadow:
    rgba(0, 0, 0, 0.25) 0px 8px 24px,
    rgba(0, 0, 0, 0.3) 0px 20px 48px;
  transition: box-shadow 0.28s ease, transform 0.28s ease;
}

#proyectos .project:hover {
  transform: translateY(-4px);
  box-shadow:
    rgba(0, 0, 0, 0.35) 0px 14px 34px,
    rgba(45, 217, 206, 0.14) 0px 20px 60px;
}

/* Contenedor multimedia: inset 1.5px para dejar visible exactamente el perímetro de 1.5px del borde */
#proyectos .project-media {
  position: absolute;
  inset: 1.5px;
  border-radius: calc(var(--border-radius) - 1.5px);
  overflow: hidden;
  z-index: 1;
  pointer-events: none;
}

#proyectos .project-media img,
#proyectos .project > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .7s cubic-bezier(.2,.75,.25,1), filter .35s ease;
  filter: saturate(.88) brightness(.82);
}

#proyectos .project:hover .project-media img,
#proyectos .project:hover > img {
  transform: scale(1.04);
  filter: saturate(1.05) brightness(.92);
}

/* Overlay gradiente lineal con los colores de la web al hacer hover */
#proyectos .project-media::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 2;
  opacity: 0;
  background:
    linear-gradient(
      135deg,
      rgba(45, 217, 206, 0.48) 0%,
      rgba(139, 89, 237, 0.40) 50%,
      rgba(238, 53, 167, 0.34) 100%
    ),
    rgba(12, 11, 22, 0.2);
  transition: opacity 0.35s ease;
}

#proyectos .project:hover .project-media::before {
  opacity: 1;
}

#proyectos .project-media::after {
  content: "";
  position: absolute;
  inset: 32% 0 0;
  border-radius: inherit;
  background: linear-gradient(transparent, rgba(12, 11, 20, 0.5) 40%, rgba(9, 8, 16, 0.92) 95%);
  pointer-events: none;
  z-index: 1;
}

#proyectos .project > .project-meta {
  position: absolute;
  z-index: 4;
  left: 32px;
  right: 32px;
  bottom: 28px;
  color: white;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  pointer-events: none;
}

#proyectos .project > .project-meta h3 {
  font-size: 32px;
  font-weight: 700;
  letter-spacing: -0.03em;
  margin: 0;
  text-transform: uppercase;
  color: #fff;
}

#proyectos .project > .project-meta p {
  font-size: 13px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin: 6px 0 0 0;
  color: #e0dce9;
}

/* Botón con flecha: cyan con glassmorphism */
#proyectos .project-arrow {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(45, 217, 206, 0.2) 0%, rgba(45, 217, 206, 0.08) 100%);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(45, 217, 206, 0.45);
  color: #2dd9ce;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.3),
    0 4px 16px rgba(0, 0, 0, 0.28);
  transition: transform 0.28s ease, background 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease, color 0.28s ease;
  pointer-events: auto;
}

#proyectos .project-arrow svg {
  display: block;
  width: 20px;
  height: 20px;
  margin: 0;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 6px rgba(45, 217, 206, 0.55));
  transition: filter 0.25s ease;
}

#proyectos .project:hover .project-arrow {
  background: linear-gradient(135deg, rgba(45, 217, 206, 0.42) 0%, rgba(45, 217, 206, 0.18) 100%);
  border-color: rgba(45, 217, 206, 0.85);
  color: #ffffff;
  transform: scale(1.12);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.5),
    inset 0 0 12px rgba(45, 217, 206, 0.3),
    0 0 26px rgba(45, 217, 206, 0.5),
    0 8px 24px rgba(0, 0, 0, 0.35);
}

#proyectos .project:hover .project-arrow svg {
  transform: none;
  filter: drop-shadow(0 0 8px rgba(45, 217, 206, 0.9));
}

/* Pseudo-elementos y capa de brillo en proyectos */
#proyectos .project::before,
#proyectos .project > .edge-light {
  content: "";
  position: absolute;
  border-radius: inherit;
  pointer-events: none;
  transition: opacity 0.25s ease-out;
}

#proyectos .project:not(:hover)::before,
#proyectos .project:not(:hover) > .edge-light {
  opacity: 0;
  transition: opacity 0.65s ease-in-out;
}

/* Borde coloreado con gradiente de malla: situado tras .project-media (inset 1.5px) para que solo ilumine el perímetro exterior */
#proyectos .project::before {
  inset: -1px;
  border-radius: calc(var(--border-radius) + 1px);
  z-index: 0;
  background:
    var(--gradient-one),
    var(--gradient-two),
    var(--gradient-three),
    var(--gradient-four),
    var(--gradient-five),
    var(--gradient-six),
    var(--gradient-seven),
    var(--gradient-base);

  opacity: calc((var(--edge-proximity) - var(--color-sensitivity)) / (100 - var(--color-sensitivity)));

  -webkit-mask-image:
    conic-gradient(
      from var(--cursor-angle) at center,
      black calc(var(--cone-spread) * 1%),
      transparent calc((var(--cone-spread) + 15) * 1%),
      transparent calc((100 - var(--cone-spread) - 15) * 1%),
      black calc((100 - var(--cone-spread)) * 1%)
    );
  mask-image:
    conic-gradient(
      from var(--cursor-angle) at center,
      black calc(var(--cone-spread) * 1%),
      transparent calc((var(--cone-spread) + 15) * 1%),
      transparent calc((100 - var(--cone-spread) - 15) * 1%),
      black calc((100 - var(--cone-spread)) * 1%)
    );
}

/* Deshabilitar relleno interior para mantener la imagen del proyecto 100% nítida y limpia */
#proyectos .project::after {
  display: none!important;
}

/* Destello exterior e interior en el borde (edge-light) */
#proyectos .project > .edge-light {
  inset: calc(var(--glow-padding) * -1);
  pointer-events: none;
  z-index: 3;
  border-radius: calc(var(--border-radius) + var(--glow-padding));

  -webkit-mask-image:
    conic-gradient(
      from var(--cursor-angle) at center, black 2.5%, transparent 10%, transparent 90%, black 97.5%
    );
  mask-image:
    conic-gradient(
      from var(--cursor-angle) at center, black 2.5%, transparent 10%, transparent 90%, black 97.5%
    );

  opacity: calc((var(--edge-proximity) - var(--edge-sensitivity)) / (100 - var(--edge-sensitivity)));
  mix-blend-mode: plus-lighter;
}

#proyectos .project > .edge-light::before {
  content: "";
  position: absolute;
  inset: var(--glow-padding);
  border-radius: var(--border-radius);
  box-shadow:
    inset 0 0 0 1.5px var(--glow-color, hsl(176deg 85% 76% / 100%)),
    inset 0 0 2px 0 var(--glow-color-60, hsl(176deg 85% 76% / 60%)),
    inset 0 0 5px 0 var(--glow-color-50, hsl(176deg 85% 76% / 50%)),
    inset 0 0 14px 0 var(--glow-color-30, hsl(176deg 85% 76% / 30%)),
    0 0 2px 0 var(--glow-color-60, hsl(176deg 85% 76% / 60%)),
    0 0 5px 0 var(--glow-color-50, hsl(176deg 85% 76% / 50%)),
    0 0 15px 0 var(--glow-color-30, hsl(176deg 85% 76% / 30%)),
    0 0 35px 2px var(--glow-color-20, hsl(176deg 85% 76% / 20%));
}

@media(prefers-reduced-motion:reduce){#proyectos .project,#proyectos .project::before,#proyectos .project > .edge-light{transition:none}}/* Contención horizontal y fondo limpio en la invitación entre secciones */
html,body{max-width:100%;overflow-x:clip}
main{width:100%;min-width:0;overflow-x:clip}
.wrap{min-width:0}
.hero-grid,.section-heading,.services-grid,.bridge-inner,.closing-inner{min-width:0}
.hero-grid>*,.section-heading>*,.services-grid>*,.bridge-inner>*,.closing-inner>*{min-width:0}
.work-grid{width:100%;max-width:100%;overscroll-behavior-inline:contain}
main>section.services-bridge{background:transparent!important;background-image:none!important}
main>section.services-bridge::before{content:none!important;display:none!important}
/* Desplaza el retrato hacia el lateral para despejar el copy central */
.hero-scene .hero-photo{right:-12%}
@media(max-width:850px){.hero-scene .hero-photo{right:-7%}}
@media(max-width:620px){.hero-scene .hero-photo{right:-13%}}
/* Carrusel de proyectos del hero, desplazado a la izquierda y con flotación suave */
.hero-preview{left:0%;animation:hero-preview-float 5.8s ease-in-out infinite}
.hero-preview-track{position:absolute;inset:0}
.hero-preview-slide{position:absolute;inset:0;opacity:0;transform:translateX(18px) scale(.985);transition:opacity .55s ease,transform .65s cubic-bezier(.2,.75,.25,1);pointer-events:none}
.hero-preview-slide.is-active{opacity:1;transform:translateX(0) scale(1);pointer-events:auto}
.hero-preview-slide>img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center}
.hero-preview-slide>.hero-preview-meta{position:absolute;z-index:1;left:0;right:0;bottom:0;min-height:55px;padding:25px 12px 10px;background:linear-gradient(transparent,rgba(10,9,17,.88));color:#fff;display:flex;align-items:end;justify-content:space-between;gap:7px}
.hero-preview-meta strong{font:600 15px var(--display)}
.hero-preview-meta span{font:500 8px 'Inter',Arial,sans-serif;letter-spacing:.08em;text-align:right;text-transform:uppercase}
.hero-preview-controls{position:absolute;z-index:4;top:9px;right:9px;display:flex;align-items:center;gap:5px;padding:4px;border:1px solid rgba(255,255,255,.25);border-radius:999px;background:rgba(17,17,27,.58);backdrop-filter:blur(10px)}
.hero-preview-controls button{display:grid;place-items:center;width:25px;height:25px;padding:0;border:0;border-radius:50%;background:transparent;color:#fff;cursor:pointer;transition:background .2s,color .2s}
.hero-preview-controls button:hover,.hero-preview-controls button:focus-visible{background:rgba(255,255,255,.16);outline:none}
.hero-preview-controls svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hero-preview-dots{display:flex;align-items:center;gap:4px}
.hero-preview-dots button{width:7px;height:7px;min-width:7px;min-height:7px;border-radius:50%;background:rgba(255,255,255,.45)}
.hero-preview-dots button.active{width:15px;border-radius:5px;background:#39d8d0}
@keyframes hero-preview-float{0%,100%{translate:0 0}50%{translate:0 -9px}}
@media(max-width:850px){.hero-preview{left:-1%}}
@media(max-width:620px){.hero-preview{left:-3%;animation-duration:6.5s}.hero-preview-slide>.hero-preview-meta{padding:23px 7px 7px;display:block}.hero-preview-meta strong{font-size:12px}.hero-preview-meta span{display:block;margin-top:2px;font-size:7px;text-align:left}.hero-preview-controls{top:5px;right:5px;gap:2px;padding:3px}.hero-preview-controls button{width:22px;height:22px}.hero-preview-controls svg{width:14px;height:14px}.hero-preview-dots{gap:3px}.hero-preview-dots button{width:6px;height:6px;min-width:6px;min-height:6px}.hero-preview-dots button.active{width:11px}}
@media(prefers-reduced-motion:reduce){.hero-preview{animation:none}.hero-preview-slide{transition:none}}
/* Restablece las capas del carrusel frente a los estilos antiguos del marco */
.project-preview>.hero-preview-track{position:absolute;inset:0;left:0;right:0;top:0;bottom:0;padding:0;background:none;color:inherit;display:block}
.project-preview>.hero-preview-controls{position:absolute;inset:auto 9px auto auto;top:9px;bottom:auto;left:auto;padding:4px;border:1px solid rgba(255,255,255,.25);border-radius:999px;background:rgba(17,17,27,.58);color:#fff;display:flex;align-items:center;justify-content:center;gap:5px}
@media(max-width:620px){.project-preview>.hero-preview-controls{inset:5px 5px auto auto;padding:3px;gap:2px}}
.all-projects-link{display:flex;width:max-content;max-width:100%;align-items:center;gap:10px;margin:22px auto 0;color:#48d8d1;font:600 16px 'Inter',Arial,sans-serif;transition:color .2s ease}.all-projects-link:hover{color:#fff}.all-projects-link span{font-size:20px}



  .announcement{display:flex;min-height:46px;height:auto;align-items:center;justify-content:center;padding:9px 18px;background:linear-gradient(100deg,#cd1049,#a20e58);color:#fff;text-align:center;font:700 clamp(10px,1vw,12px)/1.35 'Jost',Arial,sans-serif;letter-spacing:.035em;text-transform:uppercase;white-space:normal;text-wrap:balance}
  .announcement b{color:#ffe7a6;font-weight:700}
  .header,.site-header{position:fixed;z-index:30;top:46px;left:0;right:0;width:100%;background:transparent;border:0;backdrop-filter:none;-webkit-backdrop-filter:none;transition:top .28s ease,background .28s ease,backdrop-filter .28s ease,box-shadow .28s ease}
  .header.scrolled,.site-header.scrolled{top:0;background:rgba(20,19,32,.78);backdrop-filter:blur(18px) saturate(145%);-webkit-backdrop-filter:blur(18px) saturate(145%);border-bottom:1px solid rgba(255,255,255,.12);box-shadow:0 8px 28px rgba(5,4,14,.16)}
  .brand-logo,.site-header .logo img{filter:brightness(0) invert(1)}
  @media(max-width:620px){.announcement{min-height:42px;padding:8px 12px;font-size:10px;letter-spacing:.025em}.header,.site-header{top:42px}.header.scrolled,.site-header.scrolled{top:0}}
  @media(prefers-reduced-motion:reduce){.header,.site-header{transition:none}}

/* Border Glow para servicios (React Bits BorderGlow con borderRadius=27) */
#servicios .service {
  --edge-proximity: 0;
  --cursor-angle: 45deg;
  --edge-sensitivity: 30;
  --color-sensitivity: calc(var(--edge-sensitivity) + 20);
  --border-radius: 27px;
  --glow-padding: 40px;
  --cone-spread: 25;
  --fill-opacity: 0.5;
  --card-bg: #151622;

  /* Glow color vars: Cian característico de la web (HSL 176 85% 76%) */
  --glow-color: hsl(176deg 85% 76% / 100%);
  --glow-color-60: hsl(176deg 85% 76% / 60%);
  --glow-color-50: hsl(176deg 85% 76% / 50%);
  --glow-color-40: hsl(176deg 85% 76% / 40%);
  --glow-color-30: hsl(176deg 85% 76% / 30%);
  --glow-color-20: hsl(176deg 85% 76% / 20%);
  --glow-color-10: hsl(176deg 85% 76% / 10%);

  /* Gradiente de malla con la paleta de la web (#2dd9ce, #8b59ed, #ee35a7) */
  --gradient-one: radial-gradient(at 80% 55%, #8b59ed 0px, transparent 50%);
  --gradient-two: radial-gradient(at 69% 34%, #ee35a7 0px, transparent 50%);
  --gradient-three: radial-gradient(at 8% 6%, #2dd9ce 0px, transparent 50%);
  --gradient-four: radial-gradient(at 41% 38%, #8b59ed 0px, transparent 50%);
  --gradient-five: radial-gradient(at 86% 85%, #ee35a7 0px, transparent 50%);
  --gradient-six: radial-gradient(at 82% 18%, #2dd9ce 0px, transparent 50%);
  --gradient-seven: radial-gradient(at 51% 4%, #ee35a7 0px, transparent 50%);
  --gradient-base: linear-gradient(135deg, #2dd9ce 0%, #8b59ed 50%, #ee35a7 100%);

  position: relative;
  border-radius: var(--border-radius)!important;
  isolation: isolate;
  transform: translate3d(0, 0, 0.01px);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  border: 1px solid rgba(255, 255, 255, 0.14)!important;
  background: var(--card-bg, #151622)!important;
  overflow: visible;
  padding: 28px 26px;
  box-shadow:
    rgba(0, 0, 0, 0.1) 0px 1px 2px,
    rgba(0, 0, 0, 0.1) 0px 2px 4px,
    rgba(0, 0, 0, 0.1) 0px 4px 8px,
    rgba(0, 0, 0, 0.1) 0px 8px 16px,
    rgba(0, 0, 0, 0.1) 0px 16px 32px,
    rgba(0, 0, 0, 0.1) 0px 32px 64px;
  transition: box-shadow 0.25s ease, background-color 0.25s ease;
}

#servicios .service:hover {
  transform: none!important;
  background-color: var(--card-bg, #151622)!important;
  border-color: rgba(255, 255, 255, 0.14)!important;
  color: #f5f3fa;
}

#servicios .service > :not(.edge-light) {
  position: relative;
  z-index: 2;
}

/* 1. Contador con font-size reducido y tipografía limpia */
#servicios .service-num {
  font-size: 11px!important;
  font-weight: 600;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: #a9a4b5;
  line-height: 1;
}
#servicios .service:hover .service-num {
  color: #d6d1e2;
}

/* 2. Cabecera y alineación superior para que los títulos inicien a la misma altura */
#servicios .service-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 44px;
  margin-bottom: 24px;
}

#servicios .service-body {
  display: flex;
  flex-direction: column;
}

#servicios .service h3 {
  margin: 0 0 10px 0;
  font-size: 24px;
  line-height: 1.15;
  text-transform: uppercase;
  letter-spacing: -0.025em;
  color: #fff;
}

#servicios .service p {
  margin: 0;
  font-size: 15px;
  line-height: 1.65;
  color: #c5c2ce;
  max-width: 32ch;
}
#servicios .service:hover p {
  color: #d3cfdc;
}

/* 4. Contenedor cyan con glassmorphism para el icono */
#servicios .service-icon-box {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  background: linear-gradient(135deg, rgba(45, 217, 206, 0.14) 0%, rgba(45, 217, 206, 0.04) 100%);
  border: 1px solid rgba(45, 217, 206, 0.28);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    inset 0 -1px 0 rgba(45, 217, 206, 0.15),
    0 4px 16px rgba(45, 217, 206, 0.12);
  transition: transform 0.3s ease, background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

#servicios .service:hover .service-icon-box {
  background: linear-gradient(135deg, rgba(45, 217, 206, 0.22) 0%, rgba(45, 217, 206, 0.08) 100%);
  border-color: rgba(45, 217, 206, 0.55);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.3),
    0 0 20px rgba(45, 217, 206, 0.3);
  transform: scale(1.05);
}

#servicios .service-icon {
  width: 20px;
  height: 20px;
  stroke: #39d7d0;
  stroke-width: 1.8;
  filter: drop-shadow(0 0 6px rgba(45, 217, 206, 0.45));
}

/* 3. Espacio dedicado para la flecha de enlace en la parte inferior */
#servicios .service-arrow-wrap {
  margin-top: auto;
  padding-top: 28px;
  display: flex;
  align-items: center;
}

#servicios .service .inline-icon {
  width: 20px;
  height: 20px;
  color: rgba(255, 255, 255, 0.7);
  transition: transform 0.25s ease, color 0.25s ease;
}

#servicios .service:hover .inline-icon {
  color: #39d7d0;
  transform: translate(3px, -3px);
}

/* Pseudo-elementos y capa de brillo */
#servicios .service::before,
#servicios .service::after,
#servicios .service > .edge-light {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  transition: opacity 0.25s ease-out;
}

#servicios .service:not(:hover):not(.sweep-active)::before,
#servicios .service:not(:hover):not(.sweep-active)::after,
#servicios .service:not(:hover):not(.sweep-active) > .edge-light {
  opacity: 0;
  transition: opacity 0.75s ease-in-out;
}

/* Borde coloreado con gradiente de malla (React Bits BorderGlow) */
#servicios .service::before,
#servicios .service:nth-child(n)::before {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: auto;
  width: auto;
  z-index: 0;
  border: 1px solid transparent;
  background:
    linear-gradient(var(--card-bg, #151622) 0 100%) padding-box,
    linear-gradient(rgba(255, 255, 255, 0) 0% 100%) border-box,
    var(--gradient-one) border-box,
    var(--gradient-two) border-box,
    var(--gradient-three) border-box,
    var(--gradient-four) border-box,
    var(--gradient-five) border-box,
    var(--gradient-six) border-box,
    var(--gradient-seven) border-box,
    var(--gradient-base) border-box;

  opacity: calc((var(--edge-proximity) - var(--color-sensitivity)) / (100 - var(--color-sensitivity)));

  -webkit-mask-image:
    conic-gradient(
      from var(--cursor-angle) at center,
      black calc(var(--cone-spread) * 1%),
      transparent calc((var(--cone-spread) + 15) * 1%),
      transparent calc((100 - var(--cone-spread) - 15) * 1%),
      black calc((100 - var(--cone-spread)) * 1%)
    );
  mask-image:
    conic-gradient(
      from var(--cursor-angle) at center,
      black calc(var(--cone-spread) * 1%),
      transparent calc((var(--cone-spread) + 15) * 1%),
      transparent calc((100 - var(--cone-spread) - 15) * 1%),
      black calc((100 - var(--cone-spread)) * 1%)
    );
}

/* Relleno sutil cerca de los bordes (React Bits) */
#servicios .service::after {
  z-index: 0;
  border: 1px solid transparent;
  background:
    var(--gradient-one) padding-box,
    var(--gradient-two) padding-box,
    var(--gradient-three) padding-box,
    var(--gradient-four) padding-box,
    var(--gradient-five) padding-box,
    var(--gradient-six) padding-box,
    var(--gradient-seven) padding-box,
    var(--gradient-base) padding-box;

  -webkit-mask-image:
    linear-gradient(to bottom, black, black),
    radial-gradient(ellipse at 50% 50%, black 40%, transparent 65%),
    radial-gradient(ellipse at 66% 66%, black 5%, transparent 40%),
    radial-gradient(ellipse at 33% 33%, black 5%, transparent 40%),
    radial-gradient(ellipse at 66% 33%, black 5%, transparent 40%),
    radial-gradient(ellipse at 33% 66%, black 5%, transparent 40%),
    conic-gradient(from var(--cursor-angle) at center, transparent 5%, black 15%, black 85%, transparent 95%);
  -webkit-mask-composite: xor;
  mask-image:
    linear-gradient(to bottom, black, black),
    radial-gradient(ellipse at 50% 50%, black 40%, transparent 65%),
    radial-gradient(ellipse at 66% 66%, black 5%, transparent 40%),
    radial-gradient(ellipse at 33% 33%, black 5%, transparent 40%),
    radial-gradient(ellipse at 66% 33%, black 5%, transparent 40%),
    radial-gradient(ellipse at 33% 66%, black 5%, transparent 40%),
    conic-gradient(from var(--cursor-angle) at center, transparent 5%, black 15%, black 85%, transparent 95%);
  mask-composite: subtract, add, add, add, add, add;
  opacity: calc(var(--fill-opacity, 0.5) * (var(--edge-proximity) - var(--color-sensitivity)) / (100 - var(--color-sensitivity)));
  mix-blend-mode: soft-light;
}

/* Destello exterior e interior en el borde (React Bits edge-light) */
#servicios .service > .edge-light {
  inset: calc(var(--glow-padding) * -1);
  pointer-events: none;
  z-index: 1;
  border-radius: calc(var(--border-radius) + var(--glow-padding));

  -webkit-mask-image:
    conic-gradient(
      from var(--cursor-angle) at center, black 2.5%, transparent 10%, transparent 90%, black 97.5%
    );
  mask-image:
    conic-gradient(
      from var(--cursor-angle) at center, black 2.5%, transparent 10%, transparent 90%, black 97.5%
    );

  opacity: calc((var(--edge-proximity) - var(--edge-sensitivity)) / (100 - var(--edge-sensitivity)));
  mix-blend-mode: plus-lighter;
}

#servicios .service > .edge-light::before {
  content: "";
  position: absolute;
  inset: var(--glow-padding);
  border-radius: var(--border-radius);
  box-shadow:
    inset 0 0 0 1px var(--glow-color, hsl(40deg 80% 80% / 100%)),
    inset 0 0 1px 0 var(--glow-color-60, hsl(40deg 80% 80% / 60%)),
    inset 0 0 3px 0 var(--glow-color-50, hsl(40deg 80% 80% / 50%)),
    inset 0 0 6px 0 var(--glow-color-40, hsl(40deg 80% 80% / 40%)),
    inset 0 0 15px 0 var(--glow-color-30, hsl(40deg 80% 80% / 30%)),
    inset 0 0 25px 2px var(--glow-color-20, hsl(40deg 80% 80% / 20%)),
    inset 0 0 50px 2px var(--glow-color-10, hsl(40deg 80% 80% / 10%)),
    0 0 1px 0 var(--glow-color-60, hsl(40deg 80% 80% / 60%)),
    0 0 3px 0 var(--glow-color-50, hsl(40deg 80% 80% / 50%)),
    0 0 6px 0 var(--glow-color-40, hsl(40deg 80% 80% / 40%)),
    0 0 15px 0 var(--glow-color-30, hsl(40deg 80% 80% / 30%)),
    0 0 25px 2px var(--glow-color-20, hsl(40deg 80% 80% / 20%)),
    0 0 50px 2px var(--glow-color-10, hsl(40deg 80% 80% / 10%));
}

@media (max-width: 620px) {
  #servicios .service {
    --border-radius: 20px;
    --glow-padding: 24px;
    border-radius: 20px!important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #servicios .service,
  #servicios .service::before,
  #servicios .service::after,
  #servicios .service > .edge-light {
    transition: none!important;
  }
}


/* Border Glow en la invitación: corrección limpia de borde sin sangrado interior */
.services-bridge{padding:24px 0 96px!important}
.services-bridge .bridge-inner{
  --edge-proximity:0;
  --cursor-angle:45deg;
  --edge-sensitivity:30;
  --color-sensitivity:calc(var(--edge-sensitivity) + 20);
  --border-radius:22px;
  --glow-padding:36px;
  --cone-spread:25;
  --card-bg:#161524;
  --glow-color:hsl(176deg 85% 76% / 100%);
  --glow-color-60:hsl(176deg 85% 76% / 60%);
  --glow-color-50:hsl(176deg 85% 76% / 50%);
  --glow-color-30:hsl(176deg 85% 76% / 30%);
  --glow-color-20:hsl(176deg 85% 76% / 20%);
  --gradient-one:radial-gradient(at 80% 55%,#8b59ed 0,transparent 50%);
  --gradient-two:radial-gradient(at 69% 34%,#ee35a7 0,transparent 50%);
  --gradient-three:radial-gradient(at 8% 6%,#2dd9ce 0,transparent 50%);
  --gradient-four:radial-gradient(at 41% 38%,#8b59ed 0,transparent 50%);
  --gradient-five:radial-gradient(at 86% 85%,#ee35a7 0,transparent 50%);
  --gradient-six:radial-gradient(at 82% 18%,#2dd9ce 0,transparent 50%);
  --gradient-seven:radial-gradient(at 51% 4%,#ee35a7 0,transparent 50%);
  --gradient-base:linear-gradient(135deg,#2dd9ce 0%,#8b59ed 50%,#ee35a7 100%);
  position:relative;
  isolation:isolate;
  overflow:visible!important;
  border:1px solid rgba(255,255,255,.14)!important;
  border-radius:var(--border-radius)!important;
  background-color:var(--card-bg)!important;
  box-shadow:0 12px 36px rgba(0,0,0,.28);
  transform:translate3d(0,0,.01px);
  transition:box-shadow .25s ease;
}
.services-bridge .bridge-inner:hover{
  box-shadow:0 16px 44px rgba(0,0,0,.35),0 0 28px rgba(45,217,206,.07);
}
.services-bridge .bridge-inner>:not(.edge-light){
  position:relative;
  z-index:3;
}
.services-bridge .bridge-inner::before,
.services-bridge .bridge-inner>.edge-light{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  transition:opacity .25s ease-out;
}
/* Borde 1px con gradiente: el padding-box opaco bloquea cualquier sangrado al interior */
.services-bridge .bridge-inner::before{
  z-index:1;
  border:1px solid transparent;
  background:
    linear-gradient(var(--card-bg) 0 100%) padding-box,
    linear-gradient(rgba(255,255,255,0) 0% 100%) border-box,
    var(--gradient-one) border-box,
    var(--gradient-two) border-box,
    var(--gradient-three) border-box,
    var(--gradient-four) border-box,
    var(--gradient-five) border-box,
    var(--gradient-six) border-box,
    var(--gradient-seven) border-box,
    var(--gradient-base) border-box;
  opacity:calc((var(--edge-proximity) - var(--color-sensitivity))/(100 - var(--color-sensitivity)));
  -webkit-mask-image:conic-gradient(from var(--cursor-angle) at center,black calc(var(--cone-spread)*1%),transparent calc((var(--cone-spread) + 15)*1%),transparent calc((100 - var(--cone-spread) - 15)*1%),black calc((100 - var(--cone-spread))*1%));
  mask-image:conic-gradient(from var(--cursor-angle) at center,black calc(var(--cone-spread)*1%),transparent calc((var(--cone-spread) + 15)*1%),transparent calc((100 - var(--cone-spread) - 15)*1%),black calc((100 - var(--cone-spread))*1%));
}
.services-bridge .bridge-inner::after{
  display:none!important;
}
/* Destello de borde exterior e interior */
.services-bridge .bridge-inner>.edge-light{
  inset:calc(var(--glow-padding)*-1);
  z-index:2;
  border-radius:calc(var(--border-radius) + var(--glow-padding));
  -webkit-mask-image:conic-gradient(from var(--cursor-angle) at center,black 2.5%,transparent 10%,transparent 90%,black 97.5%);
  mask-image:conic-gradient(from var(--cursor-angle) at center,black 2.5%,transparent 10%,transparent 90%,black 97.5%);
  opacity:calc((var(--edge-proximity) - var(--edge-sensitivity))/(100 - var(--edge-sensitivity)));
  mix-blend-mode:plus-lighter;
}
.services-bridge .bridge-inner>.edge-light::before{
  content:"";
  position:absolute;
  inset:var(--glow-padding);
  border-radius:var(--border-radius);
  box-shadow:
    inset 0 0 0 1px var(--glow-color),
    inset 0 0 2px 0 var(--glow-color-60),
    inset 0 0 5px 0 var(--glow-color-50),
    inset 0 0 15px 0 var(--glow-color-30),
    0 0 2px 0 var(--glow-color-60),
    0 0 5px 0 var(--glow-color-50),
    0 0 15px 0 var(--glow-color-30),
    0 0 35px 2px var(--glow-color-20);
}
.services-bridge .bridge-inner:not(:hover)::before,
.services-bridge .bridge-inner:not(:hover)>.edge-light{
  opacity:0;
  transition:opacity .65s ease;
}
/* Border Glow en artículos del blog (#ideas .journal-card) */
#ideas .journal-card {
  --edge-proximity: 0;
  --cursor-angle: 45deg;
  --edge-sensitivity: 30;
  --color-sensitivity: calc(var(--edge-sensitivity) + 20);
  --border-radius: 16px;
  --glow-padding: 34px;
  --cone-spread: 25;
  --card-bg: #151423;
  --glow-color: hsl(176deg 85% 76% / 100%);
  --glow-color-60: hsl(176deg 85% 76% / 60%);
  --glow-color-50: hsl(176deg 85% 76% / 50%);
  --glow-color-30: hsl(176deg 85% 76% / 30%);
  --glow-color-20: hsl(176deg 85% 76% / 20%);
  --gradient-one: radial-gradient(at 80% 55%, #8b59ed 0, transparent 50%);
  --gradient-two: radial-gradient(at 69% 34%, #ee35a7 0, transparent 50%);
  --gradient-three: radial-gradient(at 8% 6%, #2dd9ce 0, transparent 50%);
  --gradient-four: radial-gradient(at 41% 38%, #8b59ed 0, transparent 50%);
  --gradient-five: radial-gradient(at 86% 85%, #ee35a7 0, transparent 50%);
  --gradient-six: radial-gradient(at 82% 18%, #2dd9ce 0, transparent 50%);
  --gradient-seven: radial-gradient(at 51% 4%, #ee35a7 0, transparent 50%);
  --gradient-base: linear-gradient(135deg, #2dd9ce 0%, #8b59ed 50%, #ee35a7 100%);
  position: relative;
  isolation: isolate;
  overflow: visible!important;
  border: 1px solid rgba(255, 255, 255, 0.13)!important;
  border-radius: var(--border-radius)!important;
  background-color: var(--card-bg)!important;
  transform: translate3d(0, 0, 0.01px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
  transition: transform 0.28s ease, box-shadow 0.28s ease;
}

#ideas .journal-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.35), 0 0 28px rgba(45, 217, 206, 0.1);
}

#ideas .journal-card > :not(.edge-light) {
  position: relative;
  z-index: 2;
}

#ideas .journal-card::before,
#ideas .journal-card > .edge-light {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  transition: opacity 0.25s ease-out;
}

#ideas .journal-card::before {
  z-index: 1;
  border: 1px solid transparent;
  background:
    linear-gradient(var(--card-bg) 0 100%) padding-box,
    linear-gradient(rgba(255, 255, 255, 0) 0% 100%) border-box,
    var(--gradient-one) border-box,
    var(--gradient-two) border-box,
    var(--gradient-three) border-box,
    var(--gradient-four) border-box,
    var(--gradient-five) border-box,
    var(--gradient-six) border-box,
    var(--gradient-seven) border-box,
    var(--gradient-base) border-box;
  opacity: calc((var(--edge-proximity) - var(--color-sensitivity)) / (100 - var(--color-sensitivity)));
  -webkit-mask-image: conic-gradient(
    from var(--cursor-angle) at center,
    black calc(var(--cone-spread) * 1%),
    transparent calc((var(--cone-spread) + 15) * 1%),
    transparent calc((100 - var(--cone-spread) - 15) * 1%),
    black calc((100 - var(--cone-spread)) * 1%));
  mask-image: conic-gradient(
    from var(--cursor-angle) at center,
    black calc(var(--cone-spread) * 1%),
    transparent calc((var(--cone-spread) + 15) * 1%),
    transparent calc((100 - var(--cone-spread) - 15) * 1%),
    black calc((100 - var(--cone-spread)) * 1%));
}

#ideas .journal-card > .edge-light {
  inset: calc(var(--glow-padding) * -1);
  z-index: 3;
  border-radius: calc(var(--border-radius) + var(--glow-padding));
  -webkit-mask-image: conic-gradient(
    from var(--cursor-angle) at center, black 2.5%, transparent 10%, transparent 90%, black 97.5%
  );
  mask-image: conic-gradient(
    from var(--cursor-angle) at center, black 2.5%, transparent 10%, transparent 90%, black 97.5%
  );
  opacity: calc((var(--edge-proximity) - var(--edge-sensitivity)) / (100 - var(--edge-sensitivity)));
  mix-blend-mode: plus-lighter;
}

#ideas .journal-card > .edge-light::before {
  content: "";
  position: absolute;
  inset: var(--glow-padding);
  border-radius: var(--border-radius);
  box-shadow:
    inset 0 0 0 1px var(--glow-color),
    inset 0 0 2px 0 var(--glow-color-60),
    inset 0 0 5px 0 var(--glow-color-50),
    inset 0 0 14px 0 var(--glow-color-30),
    0 0 2px 0 var(--glow-color-60),
    0 0 5px 0 var(--glow-color-50),
    0 0 15px 0 var(--glow-color-30),
    0 0 35px 2px var(--glow-color-20);
}

#ideas .journal-card:not(:hover)::before,
#ideas .journal-card:not(:hover) > .edge-light {
  opacity: 0;
  transition: opacity 0.65s ease;
}

@media(prefers-reduced-motion:reduce){#ideas .journal-card::before,#ideas .journal-card > .edge-light{transition:none}}


/* WordPress menu items mirror the flat links in the HTML navigation. */
.nav-links .menu-item,.page-nav-links .menu-item{list-style:none}
.nav-links .menu-item>a,.page-nav-links .menu-item>a{display:block}
@media(max-width:620px){.nav-links .menu-item>a,.page-nav-links .menu-item>a{padding:12px 4px}}
