@font-face{
      font-family:"Roc Grotesk Condensed ExtraBold";
      src:url("../Fuente/RocGroteskCondensedExtraBold.woff2") format("woff2");
      font-style:normal;
      font-weight:800;
      font-display:swap;
    }

    @font-face{
      font-family:"Roc Grotesk Condensed Light";
      src:url("../Fuente/RocGroteskCondensedLight.woff2") format("woff2");
      font-style:normal;
      font-weight:300;
      font-display:swap;
    }

    @font-face{
      font-family:"Roc Grotesk Condensed Medium";
      src:url("../Fuente/RocGroteskCondensedMedium.woff2") format("woff2");
      font-style:normal;
      font-weight:600;
      font-display:swap;
    }

    :root{
      --primary:#eb5b30;
      --dark:#031010;
      --light:#f5f2ee;
      --gray:#565555;
      --white:#ffffff;
      --surface:rgba(245,242,238,0.04);
      --border:rgba(245,242,238,0.08);
      --shadow:0 20px 60px rgba(0,0,0,0.28);
      --radius:28px;
      --transition:0.35s ease;
      --max-width:1320px;
      --header-h:88px;

      --font-title:"Roc Grotesk Condensed ExtraBold","Impact","Haettenschweiler","Arial Narrow",sans-serif;
      --font-subtitle:"Roc Grotesk Condensed Medium","Arial Narrow","Segoe UI Condensed","Roboto Condensed",sans-serif;
      --font-body:"Roc Grotesk Condensed Light","Segoe UI",Arial,sans-serif;

      --weight-title:800;
      --weight-subtitle:600;
      --weight-body:300;
    }

    *{
      margin:0;
      padding:0;
      box-sizing:border-box;
    }

    html{
      scroll-behavior:smooth;
      scrollbar-color:var(--primary) rgba(245,242,238,0.08);
      scrollbar-width:thin;
      width:100%;
      overflow-x:clip;
    }

    body{
      font-family:var(--font-body);
      font-weight:var(--weight-body);
      background:var(--dark);
      color:var(--light);
      overflow-x:hidden;
      width:100%;
      max-width:100vw;
      text-rendering:optimizeLegibility;
    }

    ::-webkit-scrollbar{
      width:12px;
    }

    ::-webkit-scrollbar-track{
      background:rgba(245,242,238,0.08);
    }

    ::-webkit-scrollbar-thumb{
      background:var(--primary);
      border:3px solid var(--dark);
      border-radius:999px;
    }

    ::-webkit-scrollbar-thumb:hover{
      background:#ff744b;
    }

    a{
      color:inherit;
      text-decoration:none;
    }

    img, video{
      display:block;
      max-width:100%;
    }

    p::first-letter{
      text-transform:uppercase;
    }

    p strong,
    p b{
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
    }

    /* Portada centrada, sin tarjeta visual lateral */
    .hero-wrap.hero-centered{
      grid-template-columns:minmax(0,1000px)!important;
      justify-content:center;
      justify-items:center;
      gap:34px;
    }

    .hero-centered .hero-copy{
      width:min(100%,1000px);
      display:flex;
      flex-direction:column;
      align-items:center;
      text-align:center;
    }

    .hero-centered .hero-kicker{align-self:center}
    .hero-centered .hero-slogan{
      position:relative;
      inset:auto;
      margin:0 auto 20px;
      align-self:center;
    }

    .hero-centered .graffiti-title{
      margin-inline:auto;
      transform:rotate(-2deg) skewX(-2deg);
    }

    .hero-centered .title-line{transform-origin:center}
    .hero-centered .hero-copy>p{max-width:900px;margin-inline:auto}
    .hero-centered .hero-actions{justify-content:center}

    .hero-centered .hero-stats{
      width:min(100%,720px);
      margin-top:34px;
      padding:26px 12px 0;
      border-top:1px solid rgba(245,242,238,.16);
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:18px;
    }

    .hero-centered .hero-stats span{
      display:flex;
      flex-direction:column;
      align-items:center;
      gap:7px;
      color:rgba(245,242,238,.62);
      font-family:var(--font-subtitle);
      font-size:.68rem;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
    }

    .hero-centered .hero-stats b{
      color:var(--primary);
      font-family:var(--font-title);
      font-size:clamp(2.4rem,5vw,4.6rem);
      line-height:.8;
    }

    .hero-centered .hero-marquee,
    .hero-centered .scroll-cue{grid-column:1}

    @media (max-width:760px){
      .hero-wrap.hero-centered{gap:26px}
      .hero-centered .graffiti-title{transform:rotate(-1deg)}
      .hero-centered .hero-stats{margin-top:26px;padding-top:22px;gap:8px}
      .hero-centered .hero-stats span{font-size:.58rem}
    }

    @media (max-width:380px){
      .hero-centered .hero-stats{gap:4px;padding-inline:0}
      .hero-centered .hero-stats b{font-size:2rem}
      .hero-centered .hero-stats span{font-size:.52rem;letter-spacing:.04em}
    }

    /* Indicadores-sticker: se pegan en pantalla uno por uno */
    .hero-centered .hero-stats span{
      --sticker-angle:-2deg;
      position:relative;
      min-height:128px;
      padding:22px 18px 16px;
      border:1px solid rgba(3,16,16,.2);
      border-radius:20px 16px 22px 15px;
      background:var(--light);
      color:rgba(3,16,16,.66);
      box-shadow:7px 8px 0 rgba(235,91,48,.3),0 18px 34px rgba(0,0,0,.22);
      opacity:0;
      transform:rotate(var(--sticker-angle));
      will-change:transform,opacity,filter;
    }

    .hero-centered .hero-stats span:nth-child(2){--sticker-angle:1.6deg}
    .hero-centered .hero-stats span:nth-child(3){--sticker-angle:-1deg}

    .hero-centered .hero-stats span::before{
      content:"";
      position:absolute;
      top:-9px;
      left:50%;
      width:48px;
      height:18px;
      border-radius:2px;
      background:rgba(235,91,48,.82);
      box-shadow:0 2px 5px rgba(0,0,0,.12);
      transform:translateX(-50%) rotate(-3deg);
    }

    .hero-copy.visible .hero-stats span{
      animation:heroStampHit .64s cubic-bezier(.2,1.4,.32,1) both;
    }

    .hero-copy.visible .hero-stats span:nth-child(1){animation-delay:.48s}
    .hero-copy.visible .hero-stats span:nth-child(2){animation-delay:.76s}
    .hero-copy.visible .hero-stats span:nth-child(3){animation-delay:1.04s}

    @keyframes heroStampHit{
      0%{opacity:0;filter:blur(3px);transform:translate3d(0,-18px,0) rotate(calc(var(--sticker-angle) - 5deg)) scale(1.9);box-shadow:0 0 0 rgba(235,91,48,0)}
      52%{opacity:1;filter:blur(0);transform:translate3d(0,5px,0) rotate(var(--sticker-angle)) scale(.82);box-shadow:10px 12px 0 rgba(235,91,48,.42),0 24px 42px rgba(0,0,0,.28)}
      72%{transform:translate3d(0,-3px,0) rotate(calc(var(--sticker-angle) + 1deg)) scale(1.07)}
      88%{transform:translate3d(0,1px,0) rotate(var(--sticker-angle)) scale(.97)}
      100%{opacity:1;filter:none;transform:translate3d(0,0,0) rotate(var(--sticker-angle)) scale(1);box-shadow:7px 8px 0 rgba(235,91,48,.3),0 18px 34px rgba(0,0,0,.22)}
    }

    @media (max-width:760px){
      .hero-centered .hero-stats span{min-height:104px;padding:20px 8px 12px;border-radius:15px}
      .hero-centered .hero-stats span::before{width:38px;height:14px;top:-7px}
    }

    @media (prefers-reduced-motion:reduce){
      .hero-centered .hero-stats span{animation-duration:1.05s!important}
    }

    .container{
      width:min(100% - 32px, var(--max-width));
      margin:0 auto;
      min-width:0;
    }

    main,
    section{
      width:100%;
      max-width:100%;
      overflow-x:clip;
    }

    /* Fondo */
    .bg-grid{
      position:fixed;
      inset:0;
      pointer-events:none;
      z-index:-4;
      background-image:
        linear-gradient(rgba(245,242,238,0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(245,242,238,0.03) 1px, transparent 1px);
      background-size:38px 38px;
    }

    .blob{
      position:fixed;
      border-radius:50%;
      filter:blur(95px);
      opacity:0.22;
      pointer-events:none;
      z-index:-3;
      animation:blobFloat 10s ease-in-out infinite;
    }

    .blob.one{
      width:340px;
      height:340px;
      background:rgba(235,91,48,0.55);
      top:4%;
      left:-100px;
    }

    .blob.two{
      width:280px;
      height:280px;
      background:rgba(235,91,48,0.22);
      bottom:6%;
      right:-60px;
      animation-delay:1.2s;
    }

    .astronaut-rig{
      --astronaut-start:var(--header-h);
      --astronaut-y:0px;
      --astronaut-rope:42px;
      position:fixed;
      top:var(--astronaut-start);
      right:clamp(12px, 4vw, 70px);
      z-index:4;
      width:clamp(104px, 13vw, 196px);
      height:0;
      pointer-events:none;
    }

    .astronaut-rope{
      position:absolute;
      top:calc(var(--astronaut-start) * -1);
      left:50%;
      width:4px;
      height:calc(var(--astronaut-start) + var(--astronaut-rope));
      border-radius:999px;
      background:linear-gradient(
        180deg,
        rgba(245,242,238,0.18),
        rgba(245,242,238,0.86) 16%,
        rgba(235,91,48,0.92)
      );
      box-shadow:0 0 0 6px rgba(245,242,238,0.04);
      transform:translateX(-50%);
    }

    .scroll-astronaut{
      position:absolute;
      top:0;
      left:50%;
      width:100%;
      opacity:.82;
      filter:drop-shadow(0 24px 32px rgba(0,0,0,0.28));
      animation:astronautFloat 5.2s ease-in-out infinite;
      transform-origin:top center;
    }

    .scroll-astronaut img{
      width:100%;
      height:auto;
    }

    @keyframes blobFloat{
      0%,100%{transform:translate(0,0) scale(1);}
      50%{transform:translate(24px,-20px) scale(1.08);}
    }

    @keyframes astronautFloat{
      0%,100%{
        transform:
          translate3d(-50%, var(--astronaut-y), 0)
          rotate(-2deg);
      }
      50%{
        transform:
          translate3d(-50%, calc(var(--astronaut-y) - 13px), 0)
          rotate(2deg);
      }
    }

    /* Animaciones scroll */
    .reveal{
      opacity:0;
      transform:translateY(56px);
      transition:opacity .9s ease, transform .9s ease;
      will-change:opacity, transform;
    }

    .reveal-left{
      opacity:0;
      transform:translateX(-56px);
      transition:opacity .9s ease, transform .9s ease;
      will-change:opacity, transform;
    }

    .reveal-right{
      opacity:0;
      transform:translateX(56px);
      transition:opacity .9s ease, transform .9s ease;
      will-change:opacity, transform;
    }

    .reveal-scale{
      opacity:0;
      transform:scale(.94);
      transition:opacity .9s ease, transform .9s ease;
      will-change:opacity, transform;
    }

    .visible{
      opacity:1 !important;
      transform:none !important;
    }

    .delay-1{ transition-delay:.08s; }
    .delay-2{ transition-delay:.16s; }
    .delay-3{ transition-delay:.24s; }
    .delay-4{ transition-delay:.32s; }

    /* Header */
    .site-header{
      position:sticky;
      top:0;
      z-index:100;
      min-height:var(--header-h);
      backdrop-filter:blur(14px);
      background:rgba(3,16,16,0.82);
      border-bottom:1px solid var(--border);
    }

    .nav{
      min-height:var(--header-h);
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:24px;
    }

    .brand{
      display:flex;
      align-items:center;
      gap:14px;
      min-width:0;
      margin-left:8px;
    }

    .brand-logo{
      width:74px;
      height:74px;
      padding:5px;
      border-radius:50%;
      display:flex;
      align-items:center;
      justify-content:center;
      overflow:hidden;
      background:rgba(245,242,238,0.08);
      border:1px solid var(--border);
      box-shadow:var(--shadow);
      flex-shrink:0;
    }

    .brand-logo img{
      width:184%;
      height:184%;
      object-fit:contain;
      display:block;
    }

    .brand-name{
      line-height:0;
      display:flex;
      align-items:center;
    }

    .brand-wordmark{
      display:block;
      width:min(100px, 22vw);
      max-width:none;
      height:auto;
      filter:brightness(0) invert(1);
    }

    .brand-name span{
      display:block;
      margin-top:4px;
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.82rem;
      color:rgba(245,242,238,0.72);
      text-transform:lowercase;
      letter-spacing:.08em;
    }

    .nav-links{
      display:flex;
      align-items:center;
      gap:26px;
      flex-wrap:wrap;
    }

    .nav-links a{
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      color:rgba(245,242,238,0.88);
      font-size:1.02rem;
      transition:var(--transition);
      text-transform:uppercase;
    }

    .nav-links a:hover{
      color:var(--primary);
    }

    .btn-nav{
      padding:12px 20px;
      border-radius:999px;
      background:var(--primary);
      color:var(--white) !important;
      box-shadow:0 14px 32px rgba(235,91,48,0.28);
    }

    .nav-login{
      padding:10px 18px;
      border:1px solid rgba(245,242,238,0.26);
      border-radius:999px;
      background:rgba(245,242,238,0.08);
      color:var(--white) !important;
      box-shadow:0 14px 32px rgba(0,0,0,0.14);
    }

    .nav-account{
      width:44px;
      height:44px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      flex:0 0 auto;
      border:1px solid rgba(245,242,238,0.26);
      border-radius:999px;
      background:linear-gradient(135deg, rgba(245,242,238,0.2), rgba(245,242,238,0.06));
      color:var(--white) !important;
      box-shadow:0 14px 32px rgba(0,0,0,0.18);
    }

    .nav-account svg{
      width:21px;
      height:21px;
      display:block;
      fill:none;
      stroke:currentColor;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
    }

    .nav-toggle{
      display:none;
      width:48px;
      height:48px;
      border:1px solid rgba(245,242,238,0.18);
      border-radius:999px;
      background:rgba(245,242,238,0.08);
      color:var(--light);
      box-shadow:0 16px 34px rgba(0,0,0,0.24);
      backdrop-filter:blur(18px) saturate(1.35);
      -webkit-backdrop-filter:blur(18px) saturate(1.35);
      cursor:pointer;
      transition:var(--transition);
    }

    .nav-toggle span{
      display:block;
      width:19px;
      height:2px;
      border-radius:999px;
      background:currentColor;
      transition:transform .28s ease, opacity .28s ease;
    }

    .nav-toggle span + span{
      margin-top:6px;
    }

    .nav-toggle:hover{
      border-color:rgba(235,91,48,0.45);
      background:rgba(235,91,48,0.16);
    }

    /* Hero */
    .hero{
      min-height:calc(100vh - var(--header-h));
      display:grid;
      align-items:center;
      padding:50px 0 90px;
      position:relative;
      overflow:hidden;
    }

    .hero::before{
      content:"";
      position:absolute;
      inset:0;
      pointer-events:none;
      background:
        radial-gradient(circle at 15% 16%, rgba(235,91,48,0.17), transparent 22%),
        radial-gradient(circle at 80% 70%, rgba(235,91,48,0.10), transparent 20%);
    }

    /* Triángulos flotantes del sistema visual */
    .motion-triangles{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none;color:rgba(235,91,48,.34)}
    .motion-triangles i{position:absolute;width:18px;aspect-ratio:1;background:currentColor;clip-path:polygon(0 0,100% 50%,0 100%);filter:drop-shadow(0 0 10px currentColor);transform-origin:50% 50%;will-change:transform,opacity;animation:homeTriangleFloat var(--triangle-speed,5.2s) ease-in-out infinite alternate}
    .motion-triangles i:nth-child(1){left:6%;top:14%;--triangle-x:28px;--triangle-y:-22px;--triangle-rotate:12deg;--triangle-speed:4.2s;animation-delay:-1s}
    .motion-triangles i:nth-child(2){left:18%;top:74%;width:12px;--triangle-x:-20px;--triangle-y:-34px;--triangle-rotate:-10deg;--triangle-speed:5.6s;animation-delay:-4.2s}
    .motion-triangles i:nth-child(3){left:46%;top:22%;width:10px;--triangle-x:18px;--triangle-y:28px;--triangle-rotate:9deg;--triangle-speed:4.8s;animation-delay:-2.4s}
    .motion-triangles i:nth-child(4){right:8%;top:18%;width:22px;--triangle-x:-30px;--triangle-y:20px;--triangle-rotate:-13deg;--triangle-speed:5.1s;animation-delay:-5.5s}
    .motion-triangles i:nth-child(5){right:18%;top:70%;width:14px;--triangle-x:24px;--triangle-y:-26px;--triangle-rotate:11deg;--triangle-speed:4.5s;animation-delay:-3.1s}
    .motion-triangles i:nth-child(6){left:58%;bottom:8%;width:9px;--triangle-x:-16px;--triangle-y:-24px;--triangle-rotate:-8deg;--triangle-speed:5.9s;animation-delay:-.6s}
    .motion-triangles-dark{color:rgba(3,16,16,.27)}
    .motion-triangles-feature{z-index:0;color:rgba(3,16,16,.26)}
    .motion-triangles-feature i:nth-child(2),.motion-triangles-feature i:nth-child(5){color:rgba(245,242,238,.26)}
    @keyframes homeTriangleFloat{0%{transform:translate3d(0,0,0) rotate(0deg) scale(.82);opacity:.48}50%{opacity:1}100%{transform:translate3d(var(--triangle-x),var(--triangle-y),0) rotate(var(--triangle-rotate)) scale(1.14);opacity:.72}}

    .hero-wrap{
      position:relative;
      z-index:2;
      display:grid;
      grid-template-columns:1.08fr 0.92fr;
      gap:42px;
      align-items:center;
    }

    .scroll-cue{
      grid-column:1 / -1;
      justify-self:center;
      display:inline-flex;
      flex-direction:column;
      align-items:center;
      gap:8px;
      margin-top:6px;
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.92rem;
      color:rgba(245,242,238,0.72);
      text-transform:uppercase;
      transition:var(--transition);
    }

    .scroll-cue:hover{
      color:var(--primary);
      transform:translateY(3px);
    }

    .scroll-arrow{
      width:15px;
      height:15px;
      border-right:2px solid currentColor;
      border-bottom:2px solid currentColor;
      transform:rotate(45deg);
      animation:scrollCue 1.4s ease-in-out infinite;
    }

    @keyframes scrollCue{
      0%,100%{opacity:.35; transform:translateY(0) rotate(45deg);}
      50%{opacity:1; transform:translateY(7px) rotate(45deg);}
    }

    .hero-marquee{
      grid-column:1 / -1;
      width:100vw;
      margin:10px calc(50% - 50vw) 0;
      overflow:hidden;
      background:var(--primary);
      color:var(--white);
      border-top:1px solid rgba(255,255,255,0.22);
      border-bottom:1px solid rgba(3,16,16,0.18);
      box-shadow:0 18px 36px rgba(0,0,0,0.22);
      transform:rotate(-1deg);
    }

    .hero-marquee-track{
      display:flex;
      width:max-content;
      animation:heroMarquee 22s linear infinite;
      will-change:transform;
    }

    .hero-marquee span{
      flex:0 0 auto;
      padding:14px 28px;
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(1.35rem, 2.8vw, 2.4rem);
      line-height:1;
      text-transform:uppercase;
      white-space:nowrap;
    }

    .hero-marquee span::after{
      content:"/";
      margin-left:28px;
      color:rgba(255,255,255,0.62);
    }

    @keyframes heroMarquee{
      from{transform:translateX(0);}
      to{transform:translateX(-50%);}
    }

    .hero-kicker{
      display:inline-flex;
      align-items:center;
      gap:10px;
      padding:9px 14px;
      border-radius:999px;
      background:rgba(245,242,238,0.035);
      border:1px solid rgba(245,242,238,0.12);
      margin-bottom:14px;
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.86rem;
      text-transform:uppercase;
      color:rgba(245,242,238,0.74);
      letter-spacing:.08em;
    }

    .hero-kicker::before{
      content:"";
      width:10px;
      height:10px;
      border-radius:50%;
      background:var(--primary);
      box-shadow:0 0 0 8px rgba(235,91,48,0.14);
    }

    .hero-copy{
      position:relative;
    }

    .hero-slogan{
      position:absolute;
      top:4px;
      right:-122px;
      z-index:3;
      display:inline-block;
      width:fit-content;
      max-width:220px;
      color:var(--primary);
      margin:0;
      padding:8px 14px;
      border:2px solid currentColor;
      border-radius:999px;
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:1.15rem;
      line-height:.95;
      text-align:center;
      text-transform:uppercase;
      text-shadow:2px 2px 0 rgba(3,16,16,0.92);
      box-shadow:4px 4px 0 rgba(235,91,48,0.26);
      transform:rotate(-8deg);
    }

    .hero-slogan::before,
    .hero-slogan::after{
      content:"";
      position:absolute;
      border-radius:50%;
      background:currentColor;
      opacity:.75;
    }

    .hero-slogan::before{
      width:7px;
      height:7px;
      left:14px;
      bottom:-11px;
    }

    .hero-slogan::after{
      width:5px;
      height:5px;
      right:22px;
      top:-9px;
    }

    .hero-title{
      display:flex;
      flex-direction:column;
      align-items:flex-start;
      gap:0;
      margin-bottom:20px;
      perspective:900px;
    }

    .title-line{
      display:block;
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(4rem, 10vw, 8.4rem);
      line-height:.88;
      letter-spacing:0;
      text-transform:uppercase;
      transform-origin:left center;
      text-shadow:0 10px 0 rgba(235,91,48,0.08);
    }

    .hero-copy.visible .title-line{
      animation:titleKick .72s cubic-bezier(.2, 1.25, .32, 1) both;
    }

    .hero-copy.visible .title-line:nth-child(1){ animation-delay:.08s; }
    .hero-copy.visible .title-line:nth-child(2){ animation-delay:.2s; }
    .hero-copy.visible .title-line:nth-child(3){ animation-delay:.32s; }
    .hero-copy.visible .title-line:nth-child(4){ animation-delay:.44s; }

    .title-bold{
      font-family:var(--font-title);
    }

    .title-line.accent{
      color:var(--primary);
    }

    .typing-line{
      width:fit-content;
      position:relative;
      z-index:0;
    }

    .typing-line::before{
      content:"";
      position:absolute;
      left:-.08em;
      right:-.08em;
      bottom:.08em;
      z-index:-1;
      height:.24em;
      border-radius:999px;
      background:rgba(235,91,48,0.22);
      transform:scaleX(0) rotate(-1.5deg);
      transform-origin:left center;
    }

    .typing-line.accent::before{
      background:rgba(245,242,238,0.16);
    }

    .hero-copy.visible .typing-line::before{
      animation:titleSwipe .7s ease-out .58s both;
    }

    .typing-text{
      display:inline-block;
      position:relative;
      white-space:nowrap;
      padding-right:0;
    }

    .typing-1{
      --title-tilt:-2deg;
      transform:rotate(var(--title-tilt));
    }

    .typing-2{
      --title-tilt:0deg;
      color:var(--primary);
    }

    .hero-copy.visible .typing-text{
      animation:titlePulse 2.6s ease-in-out 1.1s infinite;
    }

    @keyframes titleKick{
      0%{
        opacity:0;
        transform:translateX(-42px) rotate(-5deg) scale(.9);
        filter:blur(4px);
      }
      62%{
        opacity:1;
        transform:translateX(8px) rotate(1.5deg) scale(1.05);
        filter:blur(0);
      }
      100%{
        opacity:1;
        transform:translateX(0) rotate(0) scale(1);
        filter:blur(0);
      }
    }

    @keyframes titleSwipe{
      0%{transform:scaleX(0) rotate(-1.5deg);}
      100%{transform:scaleX(1) rotate(-1.5deg);}
    }

    @keyframes titlePulse{
      0%,100%{
        transform:translateY(0) rotate(var(--title-tilt, 0deg));
        text-shadow:0 0 0 rgba(235,91,48,0);
      }
      50%{
        transform:translateY(-4px) rotate(var(--title-tilt, 0deg));
        text-shadow:0 0 24px rgba(235,91,48,0.44);
      }
    }

    .hero-copy p{
      font-family:var(--font-body);
      font-size:1.1rem;
      line-height:1.75;
      color:rgba(245,242,238,0.82);
      max-width:650px;
      text-transform:lowercase;
      margin-bottom:26px;
    }

    .hero-actions{
      display:flex;
      flex-wrap:wrap;
      gap:14px;
    }

    .btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding:15px 24px;
      border-radius:999px;
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      text-transform:uppercase;
      font-size:1rem;
      transition:var(--transition);
      border:1px solid transparent;
      position:relative;
      overflow:hidden;
      isolation:isolate;
    }

    .btn-nav,
    .service-cta{position:relative;overflow:hidden;isolation:isolate}

    .btn::before,
    .btn-nav::before,
    .service-cta::before{
      content:"";
      position:absolute;
      top:-85%;
      left:-48%;
      z-index:4;
      width:24%;
      height:270%;
      background:linear-gradient(90deg,transparent,rgba(255,255,255,.58),transparent);
      transform:translateX(-260%) rotate(18deg);
      animation:buttonSheen 5.6s ease-in-out infinite;
      pointer-events:none;
    }

    .hero-actions .btn:nth-child(2)::before{animation-delay:-1.7s}
    .hero-actions .btn:nth-child(3)::before{animation-delay:-3.4s}
    .service-item:nth-child(even) .service-cta::before{animation-delay:-2.8s}

    @keyframes buttonSheen{
      0%,58%{transform:translateX(-260%) rotate(18deg);opacity:0}
      62%{opacity:1}
      78%,100%{transform:translateX(720%) rotate(18deg);opacity:0}
    }

    .btn-primary{
      background:var(--primary);
      color:var(--white);
      box-shadow:0 16px 36px rgba(235,91,48,0.28);
    }

    .btn-primary:hover{
      transform:translateY(-3px);
    }

    .btn-secondary{
      background:rgba(245,242,238,0.04);
      border-color:rgba(245,242,238,0.12);
      color:var(--light);
    }

    .btn-secondary:hover{
      color:var(--primary);
      border-color:var(--primary);
      transform:translateY(-3px);
    }

    .hero-visual{
      display:flex;
      flex-direction:column;
      gap:18px;
    }

    .hero-tags{
      display:flex;
      flex-wrap:wrap;
      gap:12px;
      justify-content:center;
    }

    .hero-tags span{
      padding:10px 14px;
      border-radius:999px;
      background:rgba(245,242,238,0.05);
      border:1px solid rgba(245,242,238,0.08);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      text-transform:uppercase;
      color:rgba(245,242,238,0.88);
    }

    .hero-card{
      min-height:390px;
      border-radius:34px;
      padding:18px;
      position:relative;
      overflow:visible;
      background:
        radial-gradient(circle at top left, rgba(235,91,48,0.22), transparent 32%),
        linear-gradient(145deg, rgba(245,242,238,0.07), rgba(245,242,238,0.02));
      border:1px solid rgba(245,242,238,0.08);
      box-shadow:var(--shadow);
    }

    .hero-card::before{
      content:"";
      position:absolute;
      inset:16px;
      border:1px dashed rgba(245,242,238,0.14);
      border-radius:24px;
    }

    .hero-card-content{
      position:relative;
      z-index:2;
      height:100%;
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      gap:14px;
    }

    .label{
      display:inline-block;
      padding:8px 12px;
      border-radius:999px;
      background:var(--primary);
      color:var(--white);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      text-transform:uppercase;
      font-size:.78rem;
      width:fit-content;
    }

    .hero-card .label{
      margin-top:10px;
      margin-left:12px;
      align-self:flex-start;
    }

    .hero-logo{
      min-height:160px;
      display:flex;
      align-items:center;
      justify-content:center;
    }

    .hero-logo img{
      max-width:280px;
      filter:drop-shadow(0 20px 40px rgba(0,0,0,0.35));
      animation:floatSoft 4s ease-in-out infinite;
    }

    .hero-stamp{
      position:absolute;
      right:-34px;
      top:-38px;
      z-index:5;
      width:156px;
      height:156px;
      pointer-events:none;
      filter:drop-shadow(0 14px 24px rgba(0,0,0,0.34));
      animation:stampSpin 18s linear infinite;
      transform-origin:center;
    }

    @keyframes stampSpin{
      from{transform:rotate(0deg);}
      to{transform:rotate(360deg);}
    }

    @keyframes floatSoft{
      0%,100%{transform:translateY(0);}
      50%{transform:translateY(-10px);}
    }

    .hero-card-bottom{
      text-align:center;
    }

    /* Sections */
    section{
      position:relative;
      z-index:2;
      scroll-margin-top:110px;
    }

    .section-head{
      display:flex;
      justify-content:space-between;
      align-items:end;
      gap:24px;
      margin-bottom:38px;
      flex-wrap:wrap;
    }

    .section-head h2{
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(3rem, 7vw, 6rem);
      line-height:.9;
      text-transform:uppercase;
    }

    .section-head p{
      max-width:560px;
      font-family:var(--font-body);
      font-size:1rem;
      line-height:1.7;
      text-transform:lowercase;
    }

    /* Puente creativo */
    .creative-bridge{
      padding:28px 0 70px;
      overflow:hidden;
      background:
        radial-gradient(circle at 18% 26%, rgba(235,91,48,0.13), transparent 26%),
        linear-gradient(180deg, transparent, rgba(245,242,238,0.025));
    }

    .bridge-tape{
      position:relative;
      z-index:3;
      width:100vw;
      margin:0 calc(50% - 50vw) 14px;
      overflow:hidden;
      border-top:1px solid rgba(245,242,238,0.1);
      border-bottom:1px solid rgba(245,242,238,0.1);
      background:var(--primary);
      box-shadow:0 16px 32px rgba(0,0,0,0.18);
      transform:rotate(-2.5deg);
    }

    .bridge-tape-track{
      display:flex;
      width:max-content;
      animation:bridgeTapeMove 24s linear infinite;
    }

    .bridge-tape span{
      flex:0 0 auto;
      padding:12px 26px;
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      color:var(--white);
      text-transform:uppercase;
      white-space:nowrap;
    }

    .bridge-tape span::after{
      content:"x";
      margin-left:26px;
      color:rgba(3,16,16,0.52);
      font-family:var(--font-title);
      font-weight:var(--weight-title);
    }

    @keyframes bridgeTapeMove{
      from{transform:translateX(0);}
      to{transform:translateX(-50%);}
    }

    .bridge-wrap{
      display:grid;
      grid-template-columns:minmax(260px, .62fr) minmax(0, 1.38fr);
      gap:18px;
      align-items:stretch;
    }

    .bridge-copy{
      position:relative;
      padding:24px;
      border:1px solid rgba(245,242,238,0.08);
      border-radius:24px;
      background:
        radial-gradient(circle at 85% 20%, rgba(235,91,48,0.18), transparent 34%),
        rgba(245,242,238,0.035);
      box-shadow:var(--shadow);
      overflow:visible;
    }

    .bridge-stamp{
      position:absolute;
      top:-38px;
      right:-42px;
      z-index:3;
      width:min(20vw, 148px);
      object-fit:contain;
      opacity:.96;
      animation:stampSpin 14s linear infinite;
      pointer-events:none;
    }

    .bridge-copy::after{
      content:"";
      position:absolute;
      right:-42px;
      bottom:-42px;
      width:132px;
      height:132px;
      border:1px dashed rgba(235,91,48,0.38);
      border-radius:50%;
    }

    .bridge-kicker{
      display:inline-flex;
      width:fit-content;
      margin-bottom:16px;
      padding:9px 14px;
      border-radius:999px;
      background:var(--primary);
      color:var(--white);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.82rem;
      text-transform:uppercase;
    }

    .bridge-copy h2{
      position:relative;
      z-index:1;
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(2.5rem, 5.3vw, 4.6rem);
      line-height:.92;
      text-transform:uppercase;
    }

    .bridge-steps{
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:14px;
    }

    .bridge-step{
      position:relative;
      min-height:190px;
      padding:20px;
      border:1px solid rgba(245,242,238,0.08);
      border-radius:24px;
      background:linear-gradient(145deg, rgba(245,242,238,0.06), rgba(245,242,238,0.025));
      box-shadow:var(--shadow);
      display:flex;
      flex-direction:column;
      justify-content:flex-start;
      gap:14px;
      transition:var(--transition);
      overflow:hidden;
    }

    .bridge-step::before{
      content:attr(data-step);
      position:absolute;
      right:14px;
      bottom:-10px;
      z-index:0;
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(5rem, 9vw, 7.4rem);
      line-height:.8;
      color:transparent;
      -webkit-text-stroke:1px rgba(235,91,48,0.28);
      opacity:.9;
      pointer-events:none;
    }

    .bridge-step:hover{
      transform:translateY(-6px) rotate(-.6deg);
      border-color:rgba(235,91,48,0.38);
    }

    .bridge-step-label{
      position:relative;
      z-index:1;
      width:fit-content;
      padding:7px 10px;
      border-radius:999px;
      background:rgba(235,91,48,0.16);
      color:var(--primary);
      border:1px solid rgba(235,91,48,0.24);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.78rem;
      line-height:1;
      text-transform:uppercase;
    }

    .bridge-step h3{
      position:relative;
      z-index:1;
      margin-top:12px;
      margin-bottom:0;
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(1.65rem, 2.6vw, 2.15rem);
      line-height:1;
      text-transform:uppercase;
    }

    .bridge-step p{
      position:relative;
      z-index:1;
      font-family:var(--font-body);
      color:rgba(245,242,238,0.76);
      line-height:1.68;
      text-transform:lowercase;
      max-width:24ch;
    }

    .creative-bridge-cross{
      padding:30px 0 46px;
    }

    .creative-bridge-cross .bridge-wrap{
      position:relative;
      grid-template-columns:minmax(0, 940px);
      justify-content:center;
      text-align:center;
      gap:22px;
    }

    .creative-bridge-cross .bridge-copy{
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      text-align:center;
      min-height:unset;
    }

    .creative-bridge-cross .bridge-copy::after{
      right:50%;
      transform:translateX(50%);
    }

    .creative-bridge-cross .bridge-copy h2{
      max-width:12ch;
      margin:0 auto;
    }

    .creative-bridge-cross .bridge-steps{
      justify-content:center;
    }

    .creative-bridge-cross .bridge-step{
      text-align:left;
    }

    .bridge-cat{
      position:absolute;
      left:-46px;
      bottom:-24px;
      z-index:4;
      width:min(22vw, 210px);
      pointer-events:none;
    }

    .bridge-cat img{
      display:block;
      width:100%;
      height:auto;
      object-fit:contain;
      filter:
        drop-shadow(0 0 0 rgba(255,255,255,1))
        drop-shadow(2px 0 0 rgba(255,255,255,1))
        drop-shadow(-2px 0 0 rgba(255,255,255,1))
        drop-shadow(0 2px 0 rgba(255,255,255,1))
        drop-shadow(0 -2px 0 rgba(255,255,255,1))
        drop-shadow(8px 18px 24px rgba(0,0,0,0.22));
    }

    /* Proyectos */
    .services{
      padding:105px 0;
      background:var(--primary);
      overflow:hidden;
      position:relative;
    }

    .services-wrap{
      position:relative;
      z-index:2;
    }

    .services::before{
      content:"PROYECTOS";
      position:absolute;
      top:38px;
      left:50%;
      transform:translateX(-50%);
      width:max-content;
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(7rem, 15vw, 15rem);
      line-height:.8;
      color:transparent;
      -webkit-text-stroke:2px rgba(3,16,16,0.12);
      opacity:.55;
      text-transform:uppercase;
      pointer-events:none;
      white-space:nowrap;
    }

    .services::after{
      content:"";
      position:absolute;
      inset:auto -8% 28px auto;
      width:360px;
      height:360px;
      border:2px dashed rgba(3,16,16,0.14);
      border-radius:50%;
      pointer-events:none;
    }

    .services-head{
      display:grid;
      grid-template-columns:1fr;
      gap:16px;
      align-items:start;
      margin-bottom:34px;
      color:var(--dark);
    }

    .services-kicker{
      grid-column:1;
      width:fit-content;
      padding:9px 14px;
      border:1px solid rgba(3,16,16,0.22);
      border-radius:999px;
      background:rgba(245,242,238,0.12);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.9rem;
      text-transform:uppercase;
      color:rgba(3,16,16,0.72);
    }

    .services-head h2{
      grid-column:1;
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(4rem, 10vw, 8rem);
      line-height:.82;
      text-transform:uppercase;
      color:var(--white);
      -webkit-text-stroke:0;
      text-shadow:0 16px 34px rgba(3,16,16,0.18);
    }

    .services-head p{
      grid-column:1;
      max-width:520px;
      font-family:var(--font-body);
      font-size:1.08rem;
      line-height:1.55;
      color:rgba(3,16,16,0.76);
      text-transform:lowercase;
    }

    .services-grid{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:20px;
    }

    .service-item{
      position:relative;
      min-height:320px;
      overflow:hidden;
      border-radius:30px;
      padding:24px;
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      color:var(--light);
      text-decoration:none;
      background:
        radial-gradient(circle at 90% 86%, rgba(235,91,48,0.34), transparent 30%),
        linear-gradient(145deg, rgba(3,16,16,0.98), rgba(3,16,16,0.86));
      border:1px solid rgba(245,242,238,0.14);
      box-shadow:0 18px 42px rgba(3,16,16,0.22);
      transition:transform var(--transition), box-shadow var(--transition), border-color var(--transition);
      isolation:isolate;
    }

    .service-item::before{
      content:"";
      position:absolute;
      inset:14px;
      border:1px dashed rgba(245,242,238,0.13);
      border-radius:22px;
      pointer-events:none;
      z-index:1;
    }

    .service-item::after{
      content:"";
      position:absolute;
      right:-42px;
      bottom:-42px;
      width:190px;
      height:190px;
      border-radius:50%;
      background:rgba(235,91,48,0.24);
      z-index:0;
    }

    .service-item:hover{
      transform:translateY(-7px) rotate(-.4deg);
      border-color:rgba(235,91,48,.72);
      box-shadow:
        0 24px 54px rgba(3,16,16,.32),
        0 0 0 1px rgba(235,91,48,.24),
        0 0 28px rgba(235,91,48,.36),
        0 0 64px rgba(235,91,48,.18);
    }

    .service-item:focus-visible{
      outline:3px solid var(--white);
      outline-offset:5px;
      border-color:rgba(235,91,48,.72);
      box-shadow:
        0 24px 54px rgba(3,16,16,.32),
        0 0 0 1px rgba(235,91,48,.24),
        0 0 28px rgba(235,91,48,.36),
        0 0 64px rgba(235,91,48,.18);
    }

    .service-number{
      position:absolute;
      top:24px;
      right:28px;
      z-index:2;
      width:fit-content;
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(4.8rem, 9vw, 8rem);
      line-height:.86;
      color:rgba(245,242,238,0.1);
      -webkit-text-stroke:1px rgba(245,242,238,.14);
      pointer-events:none;
      animation:serviceNumberFloat 4.8s ease-in-out infinite;
      transition:color .3s ease, transform .3s ease, -webkit-text-stroke-color .3s ease;
    }

    .service-item:nth-child(even) .service-number{animation-delay:-2.4s}

    @keyframes serviceNumberFloat{
      0%,100%{transform:translateY(0) rotate(0deg)}
      50%{transform:translateY(10px) rotate(2deg)}
    }

    .service-item:hover .service-number,
    .service-item:focus-visible .service-number{
      color:rgba(235,91,48,.28);
      -webkit-text-stroke-color:rgba(235,91,48,.58);
      transform:translateX(-8px) scale(1.06);
      animation:none;
    }

    @media (prefers-reduced-motion:reduce){
      .service-number{animation:none}
    }

    .service-tag{
      display:inline-flex;
      width:fit-content;
      margin-bottom:10px;
      padding:7px 10px;
      border-radius:999px;
      background:var(--primary);
      color:var(--white);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.75rem;
      text-transform:uppercase;
    }

    .service-preview{
      position:absolute;
      top:24px;
      right:24px;
      z-index:2;
      width:min(44%, 250px);
      height:148px;
      display:flex;
      align-items:center;
      justify-content:flex-end;
      gap:8px;
      pointer-events:none;
    }

    .service-preview img,
    .service-preview video{
      width:78px;
      height:124px;
      object-fit:cover;
      border-radius:16px;
      border:1px solid rgba(245,242,238,0.22);
      background:rgba(245,242,238,0.08);
      box-shadow:0 18px 34px rgba(3,16,16,0.34);
      transform:rotate(-5deg);
      transition:transform var(--transition), filter var(--transition);
      backface-visibility:hidden;
      transform-style:preserve-3d;
    }

    .service-preview img:nth-child(2),
    .service-preview video:nth-child(2){
      transform:translateY(16px) rotate(3deg);
    }

    .service-preview img:nth-child(3),
    .service-preview video:nth-child(3){
      transform:translateY(-8px) rotate(8deg);
    }

    .service-preview-wide img{
      width:96px;
      height:86px;
      border-radius:14px;
    }

    .service-item:hover .service-preview img:first-child,
    .service-item:hover .service-preview video:first-child{
      transform:translateY(-8px) rotate(-8deg) scale(1.04);
    }

    .service-item:hover .service-preview img:nth-child(2),
    .service-item:hover .service-preview video:nth-child(2){
      transform:translateY(8px) rotate(5deg) scale(1.04);
    }

    .service-item:hover .service-preview img:nth-child(3),
    .service-item:hover .service-preview video:nth-child(3){
      transform:translateY(-16px) rotate(10deg) scale(1.04);
    }

    .service-content{
      position:relative;
      z-index:2;
      max-width:78%;
      min-width:0;
      display:flex;
      flex-direction:column;
      align-items:flex-start;
    }

    .service-item h3{
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(1.7rem, 3.5vw, 2.9rem);
      line-height:.92;
      margin-bottom:10px;
      max-width:100%;
      text-transform:uppercase;
    }

    .service-item p{
      font-family:var(--font-body);
      font-size:clamp(1.05rem,1.25vw,1.22rem);
      line-height:1.38;
      max-width:34rem;
      text-transform:lowercase;
      color:rgba(245,242,238,0.78);
      text-wrap:balance;
    }

    .service-cta{
      display:inline-flex;
      width:fit-content;
      margin-top:22px;
      margin-left:0;
      align-self:flex-start;
      padding:10px 14px;
      border-radius:999px;
      background:var(--white);
      color:var(--dark);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.78rem;
      letter-spacing:.04em;
      text-transform:uppercase;
      align-items:center;
      gap:10px;
      transition:transform .25s ease, background .25s ease, color .25s ease;
    }

    @media (max-width:760px){
      .service-item p{
        max-width:100%;
        font-size:1rem;
        line-height:1.45;
      }
    }

    .service-cta::after{
      content:"→";
      color:var(--primary);
      font-size:1.05rem;
      line-height:1;
      transition:transform .25s ease;
    }

    .service-item:hover .service-cta,
    .service-item:focus-visible .service-cta{
      background:var(--primary);
      color:var(--white);
      transform:translateX(4px);
    }

    .service-item:hover .service-cta::after,
    .service-item:focus-visible .service-cta::after{
      color:var(--white);
      transform:translateX(3px);
    }

    /* Proyectos */
    .projects{
      padding:115px 0;
      background:var(--dark);
    }

    .projects .section-head{
      margin-bottom:38px;
    }

    .projects .section-head p{
      max-width:720px;
      margin-top:14px;
      color:rgba(245,242,238,0.74);
      font-family:var(--font-body);
      font-size:1.05rem;
      line-height:1.65;
      text-transform:lowercase;
    }

    .section-kicker{
      display:inline-flex;
      margin-bottom:14px;
      color:var(--primary);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.82rem;
      letter-spacing:.08em;
      text-transform:uppercase;
    }

    .video-lite{
      display:grid;
      grid-template-columns:minmax(0, 1.05fr) minmax(300px, .95fr);
      gap:clamp(28px, 5vw, 72px);
      align-items:center;
      padding:clamp(34px, 6vw, 70px) 0;
      border-top:1px solid rgba(245,242,238,0.08);
      border-bottom:1px solid rgba(245,242,238,0.08);
    }

    .video-lite-head{
      margin-bottom:0;
    }

    .video-drive-card{
      min-height:360px;
      padding:clamp(26px, 4vw, 42px);
      border:1px solid rgba(235,91,48,.42);
      border-radius:30px;
      color:var(--light);
      text-decoration:none;
      background:
        radial-gradient(circle at 85% 18%, rgba(235,91,48,.36), transparent 34%),
        linear-gradient(145deg, rgba(245,242,238,.08), rgba(3,16,16,.82));
      box-shadow:0 24px 54px rgba(0,0,0,.24);
      display:flex;
      flex-direction:column;
      align-items:flex-start;
      position:relative;
      overflow:hidden;
      transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;
    }

    .video-drive-card::after{
      content:"↗";
      position:absolute;
      top:20px;
      right:24px;
      color:rgba(245,242,238,.12);
      font-size:clamp(5rem, 10vw, 9rem);
      font-weight:900;
      line-height:1;
      transition:color .25s ease, transform .25s ease;
    }

    .video-drive-label{
      color:var(--primary);
      font-family:var(--font-subtitle);
      font-size:.78rem;
      font-weight:var(--weight-subtitle);
      letter-spacing:.1em;
      text-transform:uppercase;
    }

    .video-drive-card > strong{
      max-width:420px;
      margin-top:22px;
      font-family:var(--font-title);
      font-size:clamp(2.5rem, 5vw, 4.8rem);
      line-height:.9;
      text-transform:uppercase;
    }

    .video-drive-formats{
      margin-top:18px;
      color:rgba(245,242,238,.68);
      font-size:.92rem;
      line-height:1.5;
    }

    .video-drive-action{
      width:100%;
      margin-top:auto;
      padding-top:20px;
      border-top:1px solid rgba(245,242,238,.16);
      display:flex;
      align-items:center;
      justify-content:space-between;
      color:var(--light);
      font-family:var(--font-subtitle);
      font-size:.88rem;
      font-weight:var(--weight-subtitle);
      letter-spacing:.07em;
      text-transform:uppercase;
    }

    .video-drive-action b{font-size:1.7rem;line-height:1;color:var(--primary)}

    .video-drive-card:hover,
    .video-drive-card:focus-visible{
      transform:translateY(-6px);
      border-color:var(--primary);
      box-shadow:0 32px 70px rgba(0,0,0,.34);
    }

    .video-drive-card:hover::after,
    .video-drive-card:focus-visible::after{color:rgba(235,91,48,.22);transform:translate(5px,-5px)}

    /* Destacado audiovisual del home */
    .video-feature{
      min-height:540px;
      padding:clamp(34px,5vw,64px) clamp(28px,5vw,62px) 92px;
      border:1px solid rgba(3,16,16,.28);
      border-radius:clamp(30px,4vw,48px);
      background:
        radial-gradient(circle at 72% 15%, rgba(255,255,255,.2), transparent 22%),
        linear-gradient(130deg, #f2673e, #d94020);
      color:var(--dark);
      display:grid;
      grid-template-columns:minmax(0,1.05fr) minmax(180px,.5fr) minmax(300px,.9fr);
      align-items:center;
      gap:clamp(18px,3vw,42px);
      position:relative;
      overflow:hidden;
      box-shadow:0 28px 68px rgba(0,0,0,.28);
      isolation:isolate;
    }

    .video-feature::before{
      content:"PLAY";
      position:absolute;
      left:-16px;
      top:-18px;
      z-index:-1;
      color:rgba(3,16,16,.07);
      font-family:var(--font-title);
      font-size:clamp(9rem,20vw,19rem);
      font-weight:900;
      line-height:.8;
      letter-spacing:-.06em;
    }

    .video-feature::after{
      content:"";
      position:absolute;
      top:-22%;
      bottom:-22%;
      left:-24%;
      z-index:4;
      width:13%;
      background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),rgba(255,255,255,.3),rgba(255,255,255,.1),transparent);
      filter:blur(3px);
      transform:skewX(-16deg);
      pointer-events:none;
      animation:homeCardReflection 6.2s ease-in-out infinite;
    }

    .video-feature-copy{position:relative;z-index:2}
    .video-feature-kicker{display:inline-flex;margin-bottom:22px;padding:8px 11px;border:1px solid rgba(3,16,16,.25);border-radius:999px;background:rgba(245,242,238,.18);font-family:var(--font-subtitle);font-size:.7rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
    .video-feature-copy h2{font-size:clamp(4rem,8vw,8rem);line-height:.76;letter-spacing:-.035em;text-transform:uppercase}
    .video-feature-copy p{max-width:520px;margin-top:28px;color:rgba(3,16,16,.76);font-size:clamp(1rem,1.55vw,1.18rem);line-height:1.6}

    .video-feature-timeline{max-width:430px;margin-top:30px;display:grid;grid-template-columns:auto minmax(90px,1fr) auto;align-items:center;gap:12px;font-family:var(--font-subtitle);font-size:.64rem;font-weight:800;letter-spacing:.08em}
    .video-feature-timeline i{height:4px;border-radius:999px;background:rgba(3,16,16,.2);overflow:hidden;position:relative}
    .video-feature-timeline i::after{content:"";position:absolute;inset:0;width:35%;border-radius:inherit;background:var(--dark);animation:homeVideoTimeline 3.4s ease-in-out infinite}

    .video-feature-character{align-self:end;position:relative;z-index:3;display:flex;justify-content:center}
    .video-feature-character img{width:min(100%,270px);height:auto;display:block;filter:drop-shadow(0 22px 24px rgba(3,16,16,.28));animation:homeVideoCat 4s ease-in-out infinite}
    .video-feature-character>span{position:absolute;top:-34px;right:-16px;z-index:2;padding:12px 14px;border-radius:18px 18px 18px 4px;background:var(--light);box-shadow:0 12px 26px rgba(0,0,0,.2);font-family:var(--font-subtitle);font-size:.68rem;font-weight:800;line-height:1.25;text-align:center;text-transform:uppercase;transform:rotate(3deg)}

    .video-feature-link{min-height:360px;padding:clamp(26px,3vw,38px);border:1px solid rgba(245,242,238,.2);border-radius:30px;background:radial-gradient(circle at 90% 8%,rgba(235,91,48,.32),transparent 28%),#071817;color:var(--light);display:flex;flex-direction:column;text-decoration:none;position:relative;z-index:2;overflow:hidden;box-shadow:0 24px 54px rgba(3,16,16,.32);transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
    .video-feature-link small{color:var(--primary);font-family:var(--font-subtitle);font-size:.68rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase}
    .video-feature-link>strong{max-width:440px;margin-top:26px;font-family:var(--font-title);font-size:clamp(2.25rem,3.7vw,4.2rem);line-height:.86;text-transform:uppercase}
    .video-feature-link>span{margin-top:18px;color:rgba(245,242,238,.65);font-size:.84rem;line-height:1.5}
    .video-feature-link em{margin-top:auto;padding-top:20px;border-top:1px solid rgba(245,242,238,.17);display:flex;align-items:center;justify-content:space-between;gap:18px;font-family:var(--font-subtitle);font-size:.78rem;font-style:normal;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
    .video-feature-link em b{color:var(--primary);font-size:1.8rem;line-height:1;transition:transform .25s ease}
    .video-feature-link:hover,.video-feature-link:focus-visible{transform:translateY(-8px) rotate(.7deg);border-color:rgba(245,242,238,.46);box-shadow:0 32px 70px rgba(3,16,16,.42),0 0 36px rgba(245,242,238,.18)}
    .video-feature-link:hover em b,.video-feature-link:focus-visible em b{transform:translate(4px,-4px)}

    .video-feature-marquee{position:absolute;left:0;right:0;bottom:0;height:54px;overflow:hidden;border-top:1px solid rgba(3,16,16,.2);background:var(--light);color:var(--dark);display:flex;align-items:center;transform:rotate(-.5deg) scale(1.01)}
    .video-feature-marquee>div{display:flex;width:max-content;will-change:transform;animation:homeVideoTape 18s linear infinite}
    .video-feature-marquee span{flex:0 0 auto;padding-inline:20px;font-family:var(--font-subtitle);font-size:.7rem;font-weight:800;letter-spacing:.08em;white-space:nowrap}

    @keyframes homeVideoTimeline{0%{transform:translateX(-110%)}65%,100%{transform:translateX(300%)}}
    @keyframes homeVideoCat{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-10px) rotate(1deg)}}
    @keyframes homeVideoTape{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
    @keyframes homeCardReflection{
      0%,18%{left:-24%;opacity:0}
      24%{opacity:.72}
      54%{left:112%;opacity:.72}
      60%,100%{left:112%;opacity:0}
    }

    @media (max-width:980px){
      .video-feature{grid-template-columns:minmax(0,1fr) minmax(280px,.85fr)}
      .video-feature-character{position:absolute;left:43%;bottom:52px;width:190px;transform:translateX(-50%);opacity:.94}
      .video-feature-character>span{right:-30px}
    }

    @media (max-width:700px){
      .video-feature{grid-template-columns:1fr;padding:30px 22px 82px;gap:24px}
      .video-feature-copy h2{font-size:clamp(3.7rem,18vw,6rem)}
      .video-feature-character{position:relative;left:auto;bottom:auto;width:auto;transform:none;align-self:center;min-height:210px}
      .video-feature-character img{width:190px}
      .video-feature-character>span{top:4px;right:calc(50% - 125px)}
      .video-feature-link{min-height:310px}
    }

    @media (prefers-reduced-motion:reduce){
      .video-feature-character img,.video-feature-timeline i::after,.video-feature-marquee>div,.video-feature::after,.btn::before,.btn-nav::before,.service-cta::before{animation:none}
    }

    .video-tags{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin-top:20px;
    }

    .video-tags span{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding:9px 13px;
      border-radius:999px;
      background:rgba(235,91,48,0.14);
      border:1px solid rgba(235,91,48,0.32);
      color:var(--light);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.78rem;
      letter-spacing:.05em;
      text-transform:uppercase;
    }

    .video-marquee{
      overflow:hidden;
      padding:10px 0 18px;
      mask-image:linear-gradient(to right, transparent, black 7%, black 93%, transparent);
      -webkit-mask-image:linear-gradient(to right, transparent, black 7%, black 93%, transparent);
    }

    .video-marquee-track{
      display:flex;
      align-items:stretch;
      gap:18px;
      width:max-content;
      animation:videoMarquee var(--marquee-duration, 54s) linear infinite;
      will-change:transform;
    }

    .video-marquee:hover .video-marquee-track{
      animation-play-state:paused;
    }

    @keyframes videoMarquee{
      from{ transform:translateX(0); }
      to{ transform:translateX(-50%); }
    }

    .video-tile{
      position:relative;
      flex:0 0 clamp(190px, 19vw, 270px);
      aspect-ratio:9 / 16;
      overflow:hidden;
      border-radius:28px;
      background:#000;
      border:1px solid rgba(245,242,238,0.1);
      box-shadow:0 24px 54px rgba(0,0,0,0.28);
      transform:rotate(-1.2deg);
      cursor:pointer;
      transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;
    }

    .video-tile.video-has-error{
      background:
        radial-gradient(circle at top, rgba(235,91,48,0.18), transparent 38%),
        linear-gradient(180deg, rgba(12,24,24,0.98), rgba(3,16,16,1));
    }

    .video-tile.video-has-error::before{
      content:"video no disponible";
      position:absolute;
      inset:0;
      display:flex;
      align-items:center;
      justify-content:center;
      padding:18px;
      color:rgba(245,242,238,0.82);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.9rem;
      letter-spacing:.06em;
      text-transform:uppercase;
      text-align:center;
      z-index:1;
    }

    .video-tile:nth-child(even){
      transform:translateY(22px) rotate(1.5deg);
    }

    .video-tile:hover,
    .video-tile:focus-visible{
      border-color:rgba(235,91,48,0.72);
      box-shadow:0 26px 62px rgba(235,91,48,0.24), 0 22px 54px rgba(0,0,0,0.32);
    }

    .video-tile:hover{
      transform:translateY(-10px) rotate(0deg) scale(1.02);
    }

    .video-tile:nth-child(even):hover{
      transform:translateY(10px) rotate(0deg) scale(1.02);
    }

    .video-tile video{
      width:100%;
      height:100%;
      display:block;
      object-fit:cover;
      filter:saturate(1.06) contrast(1.03);
      backface-visibility:hidden;
      transform:translateZ(0);
    }

    .video-tile::after{
      content:"ver video";
      position:absolute;
      top:14px;
      right:14px;
      z-index:2;
      padding:8px 11px;
      border-radius:999px;
      background:var(--accent);
      color:var(--light);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.68rem;
      letter-spacing:.04em;
      text-transform:uppercase;
      opacity:0;
      transform:translateY(-8px);
      transition:opacity .2s ease, transform .2s ease;
      pointer-events:none;
    }

    .video-tile:hover::after,
    .video-tile:focus-visible::after{
      opacity:1;
      transform:translateY(0);
    }

    .video-tile.video-has-error video{
      opacity:0;
    }

    .video-tile span{
      position:absolute;
      left:12px;
      right:12px;
      bottom:12px;
      padding:9px 11px;
      border-radius:999px;
      background:rgba(3,16,16,0.78);
      color:var(--light);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.72rem;
      letter-spacing:.04em;
      text-transform:uppercase;
      backdrop-filter:blur(10px);
    }

    .index-video-lightbox{
      position:fixed;
      inset:0;
      z-index:1000;
      display:grid;
      place-items:center;
      padding:28px;
      background:rgba(2,12,12,0.84);
      backdrop-filter:blur(14px);
      opacity:0;
      pointer-events:none;
      transition:opacity .2s ease;
    }

    .index-video-lightbox.is-open{
      opacity:1;
      pointer-events:auto;
    }

    .index-video-dialog{
      position:relative;
      width:min(420px, 92vw);
      max-height:88vh;
      display:grid;
      gap:12px;
      padding:14px;
      border-radius:28px;
      border:1px solid rgba(245,242,238,0.18);
      background:linear-gradient(145deg, rgba(12,24,24,0.98), rgba(20,16,12,0.96));
      box-shadow:0 34px 90px rgba(0,0,0,0.5);
    }

    .index-video-dialog video{
      width:100%;
      max-height:78vh;
      aspect-ratio:9 / 16;
      object-fit:contain;
      border-radius:20px;
      background:#000;
    }

    .index-video-title{
      margin:0;
      color:var(--light);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.9rem;
      letter-spacing:.04em;
      text-transform:uppercase;
    }

    .index-video-close{
      position:absolute;
      top:12px;
      right:12px;
      z-index:2;
      width:38px;
      height:38px;
      border:0;
      border-radius:999px;
      background:var(--accent);
      color:var(--light);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:1rem;
      cursor:pointer;
    }

    .projects-nav{
      display:flex;
      flex-wrap:wrap;
      gap:12px;
      margin-bottom:28px;
    }

    .project-jump{
      padding:12px 18px;
      border-radius:999px;
      background:rgba(245,242,238,0.05);
      border:1px solid rgba(245,242,238,0.08);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      text-transform:uppercase;
      transition:var(--transition);
    }

    .project-jump:hover{
      background:var(--primary);
      border-color:var(--primary);
      transform:translateY(-2px);
      color:var(--white);
    }

    /* Carrusel infinito */
    .stories-block{
      margin-bottom:56px;
      overflow:hidden;
    }

    .stories-head{
      display:flex;
      justify-content:space-between;
      align-items:end;
      gap:20px;
      margin-bottom:20px;
      flex-wrap:wrap;
    }

    .mini-kicker{
      display:inline-block;
      margin-bottom:8px;
      color:var(--primary);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.95rem;
      text-transform:uppercase;
      letter-spacing:.08em;
    }

    .stories-head h3{
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(2rem, 4vw, 3rem);
      line-height:.95;
      text-transform:uppercase;
    }

    .stories-note{
      max-width:460px;
      color:rgba(245,242,238,0.72);
      font-family:var(--font-body);
      text-transform:lowercase;
      line-height:1.65;
    }

    .stories-viewport{
      overflow:hidden;
      mask-image:linear-gradient(to right, transparent, black 6%, black 94%, transparent);
      -webkit-mask-image:linear-gradient(to right, transparent, black 6%, black 94%, transparent);
    }

    .stories-track{
      display:flex;
      gap:18px;
      width:max-content;
      animation:storiesMove 24s linear infinite;
      will-change:transform;
    }

    @keyframes storiesMove{
      from{transform:translateX(-50%);}
      to{transform:translateX(0);}
    }

    .story-card{
      flex:0 0 270px;
      border-radius:28px;
      overflow:hidden;
      background:linear-gradient(145deg, rgba(245,242,238,0.05), rgba(245,242,238,0.02));
      border:1px solid rgba(245,242,238,0.08);
      box-shadow:var(--shadow);
      transition:transform .35s ease;
    }

    .story-card:hover{
      transform:translateY(-6px);
    }

    .story-video-wrap{
      aspect-ratio:9 / 16;
      background:#000;
    }

    .story-video-wrap video{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
      background:#000;
    }

    .story-info{
      padding:16px 16px 18px;
    }

    .story-info span{
      display:inline-block;
      margin-bottom:8px;
      color:var(--primary);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.82rem;
      text-transform:uppercase;
      letter-spacing:.08em;
    }

    .story-info h4{
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:1rem;
      line-height:1.35;
      text-transform:uppercase;
    }

    /* Grid posteos */
    .post-grid{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:20px;
      margin-bottom:42px;
    }

    .project-card{
      border-radius:26px;
      overflow:hidden;
      background:linear-gradient(145deg, rgba(245,242,238,0.05), rgba(245,242,238,0.02));
      border:1px solid rgba(245,242,238,0.08);
      box-shadow:var(--shadow);
      transition:var(--transition);
    }

    .project-card:hover{
      transform:translateY(-6px);
    }

    .project-card img{
      width:100%;
      height:360px;
      object-fit:cover;
      background:#111;
    }

    .project-info{
      padding:22px;
    }

    .project-info span{
      display:inline-block;
      margin-bottom:8px;
      color:var(--primary);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.84rem;
      text-transform:uppercase;
      letter-spacing:.08em;
    }

    .project-info h3{
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:1.25rem;
      line-height:1.3;
      text-transform:uppercase;
      margin-bottom:8px;
    }

    .project-info p{
      font-family:var(--font-body);
      color:rgba(245,242,238,0.72);
      line-height:1.7;
      text-transform:lowercase;
    }

    /* Secciones de proyecto */
    .project-sections{
      display:grid;
      gap:24px;
    }

    .project-showcase{
      display:grid;
      grid-template-columns:.9fr 1.1fr;
      gap:24px;
      align-items:stretch;
      border:1px solid rgba(245,242,238,0.08);
      border-radius:32px;
      overflow:hidden;
      background:linear-gradient(145deg, rgba(245,242,238,0.05), rgba(245,242,238,0.02));
      box-shadow:var(--shadow);
    }

    .project-media{
      min-height:420px;
      background:#090909;
    }

    .project-media img,
    .project-media video{
      width:100%;
      height:100%;
      object-fit:cover;
    }

    .project-copy{
      padding:34px;
      display:flex;
      flex-direction:column;
      justify-content:center;
    }

    .project-copy .tag{
      display:inline-block;
      width:fit-content;
      margin-bottom:12px;
      padding:10px 14px;
      border-radius:999px;
      background:var(--primary);
      color:var(--white);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      text-transform:uppercase;
      font-size:.82rem;
    }

    .project-copy h3{
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(2.3rem, 4vw, 4.2rem);
      line-height:.95;
      text-transform:uppercase;
      margin-bottom:14px;
    }

    .project-copy p{
      font-family:var(--font-body);
      color:rgba(245,242,238,0.76);
      line-height:1.8;
      text-transform:lowercase;
      margin-bottom:18px;
    }

    .project-copy .back-link{
      width:fit-content;
      padding:13px 18px;
      border-radius:999px;
      border:1px solid rgba(245,242,238,0.1);
      background:rgba(245,242,238,0.04);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      text-transform:uppercase;
      transition:var(--transition);
    }

    .project-copy .back-link:hover{
      color:var(--primary);
      border-color:var(--primary);
      transform:translateY(-2px);
    }

    /* About */
    .about{
      padding:110px 0;
      background:linear-gradient(180deg, rgba(245,242,238,0.03), transparent);
    }

    .about-wrap{
      display:grid;
      grid-template-columns:clamp(280px, 28vw, 340px) minmax(0, 1fr);
      gap:30px;
      align-items:stretch;
    }

    .about-photo,
    .about-copy{
      border:1px solid rgba(245,242,238,0.08);
      border-radius:30px;
      background:linear-gradient(145deg, rgba(245,242,238,0.05), rgba(245,242,238,0.02));
      box-shadow:var(--shadow);
    }

    .about-photo{
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:flex-start;
      gap:18px;
      padding:22px;
      width:100%;
      max-width:380px;
      height:100%;
      min-height:0;
      justify-self:start;
      overflow:hidden;
    }

    .about-photo img{
      width:100%;
      aspect-ratio:1 / 1;
      height:auto;
      object-fit:cover;
      border-radius:22px;
      animation:floatSoft 4s ease-in-out infinite;
    }

    .about-profile,
    .about-skills{
      width:100%;
      padding:18px;
      border-radius:22px;
      background:rgba(245,242,238,0.04);
      border:1px solid rgba(245,242,238,0.08);
    }

    .about-skills{
      flex:1;
    }

    .about-profile{
      display:grid;
      gap:8px;
    }

    .about-profile p{
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      color:rgba(245,242,238,0.88);
      line-height:1.35;
      text-transform:none;
      margin:0;
    }

    .about-profile p:first-child{
      color:var(--primary);
      font-weight:800;
      text-transform:uppercase;
    }

    .profile-detail{
      display:flex;
      align-items:center;
      gap:10px;
    }

    .profile-icon{
      width:18px;
      height:18px;
      flex-shrink:0;
      fill:none;
      stroke:var(--primary);
      stroke-width:1.8;
      stroke-linecap:round;
      stroke-linejoin:round;
    }

    .about-skills h3{
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:2rem;
      line-height:.95;
      text-transform:uppercase;
      margin-bottom:14px;
    }

    .about-skills ul{
      display:grid;
      gap:8px;
      list-style:none;
    }

    .about-skills li{
      position:relative;
      padding-left:18px;
      font-family:var(--font-body);
      color:rgba(245,242,238,0.82);
      line-height:1.35;
    }

    .about-skills li::before{
      content:"";
      position:absolute;
      left:0;
      top:.55em;
      width:7px;
      height:7px;
      border-radius:50%;
      background:var(--primary);
    }

    .about-copy{
      padding:34px;
      display:flex;
      flex-direction:column;
      gap:18px;
      justify-self:stretch;
    }

    .about-kicker{
      display:inline-flex;
      align-items:center;
      width:fit-content;
      padding:10px 16px;
      border-radius:999px;
      background:rgba(245,242,238,0.05);
      border:1px solid rgba(245,242,238,0.08);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      text-transform:uppercase;
      letter-spacing:.08em;
      color:rgba(245,242,238,0.86);
    }

    .about-copy h2{
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(3rem, 6vw, 5rem);
      line-height:.92;
      text-transform:uppercase;
      margin:0;
    }

    .about-copy p{
      font-family:var(--font-body);
      color:rgba(245,242,238,0.8);
      line-height:1.8;
      text-transform:lowercase;
      margin:0;
    }

    .software-panel{
      margin-top:6px;
      display:flex;
      flex-direction:column;
      gap:18px;
    }

    .software-head h3{
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(2rem, 3.6vw, 3rem);
      line-height:.95;
      text-transform:uppercase;
      margin-bottom:8px;
    }

    .software-head p{
      font-family:var(--font-body);
      color:rgba(245,242,238,0.7);
      line-height:1.65;
      margin:0;
    }

    .software-list{
      display:grid;
      gap:14px;
    }

    .software-item{
      display:grid;
      grid-template-columns:52px minmax(0,1fr);
      gap:14px;
      align-items:center;
      padding:14px 16px;
      border-radius:22px;
      background:rgba(245,242,238,0.04);
      border:1px solid rgba(245,242,238,0.08);
    }

    .software-icon{
      width:52px;
      height:52px;
      border-radius:16px;
      display:flex;
      align-items:center;
      justify-content:center;
      background:rgba(245,242,238,0.08);
      border:1px solid rgba(245,242,238,0.12);
      flex-shrink:0;
      color:var(--light);
      overflow:hidden;
    }

    .software-icon-img{
      width:100%;
      height:100%;
      object-fit:contain;
      display:block;
    }

    .software-info{
      min-width:0;
    }

    .software-top{
      display:flex;
      justify-content:space-between;
      align-items:baseline;
      gap:12px;
      margin-bottom:8px;
    }

    .software-name,
    .software-percent{
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      text-transform:uppercase;
      color:rgba(245,242,238,0.92);
    }

    .software-name{
      font-size:1rem;
    }

    .software-percent{
      font-size:.88rem;
      color:rgba(245,242,238,0.68);
    }

    .software-meter{
      height:10px;
      border-radius:999px;
      background:rgba(245,242,238,0.08);
      overflow:hidden;
    }

    .software-fill{
      display:block;
      width:0;
      height:100%;
      border-radius:inherit;
      background:linear-gradient(90deg, var(--primary), #ff8a62);
      box-shadow:0 0 18px rgba(235,91,48,0.32);
      transition:width 1.2s ease;
      will-change:width;
    }

    .about.visible .software-fill{
      width:var(--level);
    }

    .software-item:nth-child(1) .software-fill{ transition-delay:.05s; }
    .software-item:nth-child(2) .software-fill{ transition-delay:.12s; }
    .software-item:nth-child(3) .software-fill{ transition-delay:.19s; }
    .software-item:nth-child(4) .software-fill{ transition-delay:.26s; }
    .software-item:nth-child(5) .software-fill{ transition-delay:.33s; }
    .software-item:nth-child(6) .software-fill{ transition-delay:.4s; }

    .software-item{
      transition:transform var(--transition), background var(--transition), border-color var(--transition);
    }

    .software-item:hover{
      transform:translateY(-2px);
      background:rgba(245,242,238,0.06);
      border-color:rgba(245,242,238,0.14);
    }

    /* About editorial */
    .about{
      padding:120px 0;
      background:
        radial-gradient(circle at 12% 18%, rgba(235,91,48,0.14), transparent 28%),
        linear-gradient(180deg, rgba(245,242,238,0.03), transparent);
    }

    .about-wrap{
      display:grid;
      grid-template-columns:minmax(260px, 360px) minmax(0,1fr);
      gap:34px;
      align-items:stretch;
    }

    .about-portrait{
      display:flex;
      flex-direction:column;
      gap:24px;
      min-width:0;
    }

    .about-photo-card{
      width:min(100%, 320px);
      aspect-ratio:1/1;
      align-self:center;
      overflow:hidden;
      border-radius:50%;
      border:4px solid rgba(235,91,48,0.9);
      background:linear-gradient(145deg, rgba(245,242,238,0.08), rgba(245,242,238,0.03));
      box-shadow:0 24px 60px rgba(0,0,0,0.34), 0 0 0 8px rgba(235,91,48,0.12);
      animation:floatSoft 4.4s ease-in-out infinite;
    }

    .about-photo-card img{
      width:100%;
      height:100%;
      object-fit:cover;
      object-position:center 22%;
    }

    .about-portrait h2{
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(2.4rem, 4vw, 4.7rem);
      line-height:.92;
      text-transform:uppercase;
      color:var(--light);
    }

    .about-portrait h2::after{
      content:"";
      display:block;
      width:84px;
      height:8px;
      margin-top:14px;
      border-radius:999px;
      background:var(--primary);
    }

    .about-copy{
      padding:42px;
      border:1px solid rgba(245,242,238,0.08);
      border-radius:30px;
      background:
        linear-gradient(rgba(245,242,238,0.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(245,242,238,0.025) 1px, transparent 1px),
        linear-gradient(145deg, rgba(245,242,238,0.05), rgba(245,242,238,0.02));
      background-size:32px 32px, 32px 32px, auto;
      box-shadow:var(--shadow);
      display:flex;
      flex-direction:column;
      gap:22px;
      min-width:0;
    }

    .about-status{
      display:inline-flex;
      align-items:center;
      gap:9px;
      width:fit-content;
      color:rgba(245,242,238,0.86);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.82rem;
      letter-spacing:.04em;
      text-transform:uppercase;
    }

    .about-status span{
      width:9px;
      height:9px;
      border-radius:50%;
      background:#4ade80;
      box-shadow:0 0 14px rgba(74,222,128,0.72);
    }

    .about-copy .about-kicker{
      margin-top:4px;
    }

    .about-copy > h2{
      font-size:clamp(3.8rem, 8.5vw, 8.4rem);
      line-height:.82;
      letter-spacing:0;
    }

    .about-copy > p{
      max-width:980px;
      font-size:1.06rem;
      line-height:1.78;
      color:rgba(245,242,238,0.78);
      text-transform:none;
    }

    .about-meta{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      padding-top:4px;
    }

    .about-meta span,
    .about-chip-list span{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:36px;
      padding:9px 13px;
      border-radius:999px;
      background:rgba(245,242,238,0.06);
      border:1px solid rgba(245,242,238,0.12);
      color:rgba(245,242,238,0.88);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.82rem;
      letter-spacing:.03em;
      text-transform:uppercase;
    }

    .about-meta .meta-chip,
    .about-meta span:nth-child(3),
    .about-chip-list .country-chip{
      gap:8px;
    }

    .about-meta span:first-child{
      background:rgba(235,91,48,0.16);
      border-color:rgba(235,91,48,0.3);
      color:var(--primary);
    }

    .about-meta .meta-location::before{
      content:"\01F4CD";
      font-size:.95em;
      line-height:1;
    }

    .about-meta .meta-age::before,
    .about-meta span:nth-child(3)::before{
      content:"\01F382";
      font-size:.95em;
      line-height:1;
    }

    .about-section-block{
      display:grid;
      gap:12px;
      margin-top:2px;
    }

    .about-mini-title{
      color:rgba(245,242,238,0.45);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.78rem;
      letter-spacing:.1em;
      text-transform:uppercase;
    }

    .about-chip-list{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
    }

    .about-chip-list .country-chip::before{
      font-size:.95em;
      line-height:1;
    }

    .about-chip-list .country-ar::before{
      content:"\01F1E6\01F1F7";
    }

    .about-chip-list .country-cl::before{
      content:"\01F1E8\01F1F1";
    }

    .about-chip-list .country-mx::before{
      content:"\01F1F2\01F1FD";
    }

    .about-chip-list .country-ec::before{
      content:"\01F1EA\01F1E8";
    }

    .software-panel{
      margin-top:6px;
      gap:14px;
    }

    .software-head h3{
      font-size:clamp(2.2rem, 4vw, 4rem);
    }

    .software-head p{
      text-transform:none;
    }

    .software-list{
      display:grid;
      grid-template-columns:repeat(3, minmax(0,1fr));
      gap:12px;
    }

    .software-item{
      display:flex;
      align-items:center;
      gap:11px;
      min-width:0;
      padding:12px;
      border-radius:20px;
    }

    .software-icon{
      width:42px;
      height:42px;
      border-radius:14px;
    }

    .software-name{
      min-width:0;
      font-size:.88rem;
      line-height:1.05;
    }

    .software-info,
    .software-top,
    .software-percent,
    .software-meter{
      display:none;
    }

    /* Reseñas */
    .reviews{
      display:none;
      padding:110px 0;
      background:var(--primary);
      color:var(--dark);
      overflow:hidden;
    }

    .reviews .section-head{
      margin-bottom:32px;
    }

    .reviews .mini-kicker{
      color:var(--dark);
    }

    .reviews .section-head h2{
      color:var(--white);
      text-shadow:0 16px 34px rgba(3,16,16,0.16);
    }

    .reviews .section-head p{
      max-width:680px;
      margin-top:12px;
      color:rgba(3,16,16,0.76);
      font-family:var(--font-body);
      font-size:1.05rem;
      line-height:1.6;
      text-transform:lowercase;
    }

    .review-card-legacy{
      display:none;
    }

    .hero-card-bottom + .review-card,
    .hero-card-bottom + .review-card + .review-card{
      display:none;
    }

    .reviews-editorial-head{
      margin:54px 0 26px;
    }

    .reviews-editorial-head h2{
      color:var(--white);
      text-shadow:0 16px 34px rgba(3,16,16,0.18);
    }

    .reviews-editorial{
      display:grid;
      grid-template-columns:minmax(0,1fr);
      gap:28px;
      align-items:start;
    }

    .reviews-grid.reviews-grid-fancy{
      display:flex;
      width:max-content;
      gap:18px;
      animation:reviewsInfinite 42s linear infinite;
      will-change:transform;
    }

    .reviews-carousel{
      position:relative;
      width:100vw;
      max-width:none;
      margin-left:calc(50% - 50vw);
      min-width:0;
      overflow:hidden;
      padding:2px 0 12px;
      -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
      mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
    }

    .reviews-carousel::before,
    .reviews-carousel::after{
      content:"";
      position:absolute;
      top:0;
      bottom:0;
      z-index:5;
      width:clamp(46px,7vw,110px);
      pointer-events:none;
    }

    .reviews-carousel::before{
      left:0;
      background:linear-gradient(90deg,var(--dark) 0%,rgba(3,16,16,.92) 28%,transparent 100%);
    }

    .reviews-carousel::after{
      right:0;
      background:linear-gradient(270deg,var(--dark) 0%,rgba(3,16,16,.92) 28%,transparent 100%);
    }

    .reviews-carousel:hover .reviews-grid-fancy{
      animation-play-state:paused;
    }

    .reviews-grid-fancy .review-card{
      flex:0 0 clamp(270px,27vw,360px);
    }

    @keyframes reviewsInfinite{
      from{transform:translateX(0)}
      to{transform:translateX(calc(-50% - 9px))}
    }

    .reviews-grid{
      display:grid;
      grid-template-columns:repeat(3, minmax(0,1fr));
      gap:18px;
    }

    .review-card{
      position:relative;
      min-height:260px;
      overflow:hidden;
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      gap:24px;
      padding:24px;
      border-radius:28px;
      background:var(--dark);
      color:var(--light);
      border:1px solid rgba(245,242,238,0.12);
      box-shadow:0 22px 44px rgba(3,16,16,0.2);
    }

    .review-card::before{
      content:"";
      position:absolute;
      inset:14px;
      border:1px dashed rgba(245,242,238,0.12);
      border-radius:20px;
      pointer-events:none;
    }

    .review-number{
      position:absolute;
      top:14px;
      right:18px;
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(3.4rem, 7vw, 6.2rem);
      line-height:.8;
      color:rgba(245,242,238,0.1);
    }

    .review-card p{
      position:relative;
      z-index:1;
      max-width:88%;
      font-family:var(--font-body);
      font-size:1.02rem;
      line-height:1.68;
      color:rgba(245,242,238,0.78);
      text-transform:lowercase;
    }

    .review-stars{
      display:inline-flex;
      align-items:center;
      width:fit-content;
      max-width:100%;
      flex:0 0 auto;
      align-self:flex-start;
      min-height:34px;
      padding:8px 14px;
      border-radius:999px;
      background:rgba(245,242,238,0.08);
      border:1px solid rgba(245,242,238,0.12);
      color:#ffd15c;
      font-size:0;
      letter-spacing:0;
      overflow:hidden;
    }

    .review-stars::before{
      content:"★★★★★";
      font-size:1rem;
      line-height:1;
    }

    .review-stars span{
      display:none !important;
      font-size:0 !important;
    }

    .review-stars,
    .review-stars *{
      color:transparent !important;
    }

    .review-stars::before{
      content:"\2605\2605\2605\2605\2605";
      letter-spacing:.12em;
      color:#ffd15c !important;
    }

    .review-stars::after{
      content:none;
    }

    .review-card strong,
    .review-card div span{
      position:relative;
      z-index:1;
      display:block;
      text-transform:uppercase;
    }

    .review-card strong{
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:1.35rem;
      line-height:.98;
      color:var(--white);
    }

    .review-footer{
      position:relative;
      z-index:1;
      display:grid;
      gap:6px;
    }

    .reviews-grid-fancy .review-card{
      min-height:250px;
      gap:18px;
      background:
        radial-gradient(circle at top right, rgba(235,91,48,0.14), transparent 34%),
        rgba(3,16,16,0.96);
    }

    @media (prefers-reduced-motion:reduce){
      .reviews-carousel{
        overflow-x:auto;
        -webkit-mask-image:none;
        mask-image:none;
        scrollbar-width:thin;
      }

      .reviews-carousel::before,
      .reviews-carousel::after{display:none}

      .reviews-grid-fancy{animation:none}
    }

    .reviews-grid-fancy .review-card p{
      max-width:100%;
      color:rgba(245,242,238,0.82);
      text-transform:none;
    }

    .review-card div span{
      margin-top:7px;
      color:var(--primary);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.78rem;
      letter-spacing:.05em;
    }

    .review-footer a{
      width:max-content;
      text-decoration:none;
      color:rgba(245,242,238,0.78);
      font-family:var(--font-subtitle);
      font-size:.78rem;
      letter-spacing:.06em;
      padding-top:4px;
      border-bottom:1px solid rgba(245,242,238,0.16);
      text-transform:uppercase;
    }

    .reviews-side{
      position:relative;
      min-height:100%;
      display:grid;
      gap:16px;
      align-content:start;
      justify-items:center;
    }

    .ig-phone-wrap{
      position:sticky;
      top:110px;
      display:grid;
      place-items:center;
      gap:14px;
      padding:24px 24px 16px;
      border-radius:32px;
      min-height:720px;
      background:
        radial-gradient(circle at 20% 18%, rgba(245,242,238,0.1), transparent 26%),
        linear-gradient(180deg, rgba(3,16,16,0.14), rgba(3,16,16,0.3));
      border:1px solid rgba(245,242,238,0.12);
      overflow:hidden;
    }

    .reviews-stamp{
      position:absolute;
      top:12px;
      left:10px;
      z-index:5;
      width:min(34%, 132px);
      object-fit:contain;
      opacity:.95;
      animation:stampSpin 12s linear infinite;
      pointer-events:none;
    }

    .ig-phone{
      position:relative;
      z-index:2;
      width:min(100%, 340px);
      padding:14px 14px 18px;
      border-radius:42px;
      background:#0d1414;
      border:2px solid rgba(245,242,238,0.18);
      box-shadow:0 28px 70px rgba(3,16,16,0.34);
      transform:rotate(-4deg);
    }

    .ig-phone::before{
      content:"";
      position:absolute;
      top:10px;
      left:50%;
      width:34%;
      height:24px;
      transform:translateX(-50%);
      border-radius:0 0 16px 16px;
      background:#050909;
    }

    .ig-phone-top,
    .ig-phone-bottom{
      display:flex;
      align-items:center;
      gap:10px;
      padding:10px 12px;
      color:var(--white);
    }

    .ig-phone-top{
      min-height:48px;
    }

    .ig-phone-top img{
      width:19px;
      height:19px;
      object-fit:contain;
    }

    .ig-phone-top strong,
    .ig-phone-bottom span{
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.8rem;
      letter-spacing:.05em;
      text-transform:uppercase;
    }

    .ig-dot{
      width:8px;
      height:8px;
      border-radius:50%;
      background:#66ff8f;
      box-shadow:0 0 12px rgba(102,255,143,0.75);
    }

    .ig-phone video{
      display:block;
      width:100%;
      aspect-ratio:9 / 16;
      object-fit:cover;
      border-radius:28px;
      background:#111;
      backface-visibility:hidden;
      transform:translateZ(0);
    }

    .ig-phone.video-has-error{
      background:
        radial-gradient(circle at top, rgba(235,91,48,0.16), transparent 32%),
        linear-gradient(180deg, rgba(12,24,24,0.96), rgba(3,16,16,1));
    }

    .ig-phone.video-has-error video{
      opacity:0;
    }

    .ig-phone-bottom{
      justify-content:center;
      color:rgba(245,242,238,0.72);
    }

    .ig-badge{
      position:absolute;
      top:54px;
      right:12px;
      z-index:3;
      padding:10px 16px;
      border-radius:999px;
      background:var(--primary);
      color:var(--white);
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:.96rem;
      text-transform:uppercase;
      box-shadow:0 18px 28px rgba(235,91,48,0.28);
      transform:rotate(9deg);
    }

    .ig-direct-btn{
      position:relative;
      z-index:4;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:46px;
      padding:12px 18px;
      width:min(100%, 240px);
      border-radius:999px;
      background:rgba(245,242,238,0.96);
      color:var(--dark);
      text-decoration:none;
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.82rem;
      letter-spacing:.05em;
      text-transform:uppercase;
      box-shadow:0 16px 30px rgba(3,16,16,0.2);
      transition:transform var(--transition), background var(--transition), color var(--transition);
      justify-self:center;
      align-self:center;
      margin:0 auto;
      text-align:center;
      overflow:visible;
    }

    .ig-direct-btn::after{
      content:"";
      position:absolute;
      top:100%;
      left:50%;
      width:1px;
      height:64px;
      margin-top:12px;
      transform:translateX(-50%);
      background:linear-gradient(180deg, rgba(245,242,238,0.4), rgba(245,242,238,0));
      pointer-events:none;
    }

    .ig-direct-label{
      position:relative;
      z-index:2;
    }

    .ig-direct-cue{
      position:absolute;
      left:50%;
      bottom:-46px;
      z-index:1;
      width:18px;
      height:18px;
      margin-left:-9px;
      border-radius:50%;
      background:rgba(245,242,238,0.94);
      border:2px solid rgba(3,16,16,0.86);
      box-shadow:0 0 0 0 rgba(245,242,238,0.42);
      pointer-events:none;
      animation:igTapHint 2.1s ease-in-out infinite;
    }

    .ig-direct-cue::before{
      content:"";
      position:absolute;
      inset:-10px;
      border-radius:50%;
      border:1px solid rgba(245,242,238,0.48);
      opacity:0;
      transform:scale(.55);
      animation:igTapPulse 2.1s ease-in-out infinite;
    }

    .ig-direct-cue::after{
      content:"";
      position:absolute;
      left:50%;
      top:50%;
      width:5px;
      height:5px;
      border-radius:50%;
      background:rgba(3,16,16,0.88);
      transform:translate(-50%, -50%);
    }

    .ig-phone-wrap .ig-direct-btn{
      width:min(100%, 240px);
      margin-top:6px;
      justify-self:center;
      align-self:center;
    }

    .ig-follow-note{
      max-width:250px;
      margin:40px auto 0;
      text-align:center;
      font-family:var(--font-body);
      font-size:.84rem;
      line-height:1.45;
      color:rgba(245,242,238,0.72);
      text-transform:lowercase;
    }

    .ig-direct-btn:hover{
      transform:translateY(-2px);
      background:var(--primary);
      color:var(--white);
    }

    @keyframes igTapHint{
      0%, 18%, 100%{
        transform:translate(-1px, 0) scale(1);
      }
      10%{
        transform:translate(-1px, -10px) scale(1.02);
      }
      14%{
        transform:translate(-1px, -2px) scale(.88);
      }
      24%{
        transform:translate(-1px, 0) scale(1);
      }
      58%{
        transform:translate(9px, 0) scale(1);
      }
      68%{
        transform:translate(9px, -10px) scale(1.02);
      }
      72%{
        transform:translate(9px, -2px) scale(.88);
      }
      82%{
        transform:translate(9px, 0) scale(1);
      }
    }

    @keyframes igTapPulse{
      0%, 8%, 18%, 56%, 66%, 100%{
        opacity:0;
        transform:scale(.55);
      }
      14%, 72%{
        opacity:.9;
        transform:scale(1.35);
      }
    }

    @media (prefers-reduced-motion: reduce){
      .ig-direct-cue,
      .ig-direct-cue::before{
        animation:none;
      }
    }

    .ig-cat{
      position:absolute;
      left:-6px;
      top:auto;
      bottom:0;
      z-index:4;
      width:min(44%, 240px);
      opacity:1;
    }

    .ig-cat img{
      width:100%;
      display:block;
      object-fit:contain;
      opacity:1;
      filter:none;
    }

    .contact > .container > .reviews-side{
      display:none;
    }

    @keyframes stampSpin{
      from{ transform:rotate(0deg); }
      to{ transform:rotate(360deg); }
    }

    /* Preview CV */
    .cv-preview{
      padding:112px 0;
      background:
        radial-gradient(circle at 15% 10%, rgba(235,91,48,0.18), transparent 28%),
        var(--dark);
    }

    .cv-wrap{
      display:grid;
      grid-template-columns:minmax(0,.85fr) minmax(320px,1.15fr);
      gap:28px;
      align-items:center;
    }

    .cv-copy{
      padding:32px;
      border-radius:30px;
      border:1px solid rgba(245,242,238,0.08);
      background:linear-gradient(145deg, rgba(245,242,238,0.06), rgba(245,242,238,0.02));
      box-shadow:var(--shadow);
    }

    .cv-copy h2{
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(2.2rem, 4.5vw, 3.75rem);
      line-height:.94;
      text-transform:uppercase;
      margin-bottom:16px;
      max-width:9ch;
      overflow-wrap:normal;
    }

    .cv-copy p{
      max-width:620px;
      margin-bottom:24px;
      color:rgba(245,242,238,0.78);
      font-family:var(--font-body);
      font-size:1.05rem;
      line-height:1.72;
      text-transform:lowercase;
    }

    .cv-contact-actions{
      display:flex;
      flex-wrap:wrap;
      gap:12px;
    }

    .cv-contact-actions a{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:48px;
      padding:13px 18px;
      border-radius:999px;
      border:1px solid rgba(245,242,238,0.14);
      background:rgba(245,242,238,0.05);
      color:var(--light);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.92rem;
      text-transform:none;
      transition:transform var(--transition), background var(--transition), border-color var(--transition);
    }

    .cv-contact-actions a:first-child{
      background:#4d67b7;
      border-color:#4d67b7;
      color:var(--white);
    }

    .cv-contact-actions .cv-contact-btn{
      background:#4d67b7;
      border-color:#4d67b7;
      color:var(--white);
    }

    .cv-contact-actions a:hover{
      transform:translateY(-2px);
      background:var(--primary);
      border-color:var(--primary);
      color:var(--white);
    }

    .cv-contact-actions a::after{
      content:"↗";
      margin-left:10px;
      font-size:.9em;
      line-height:1;
    }

    .cv-file-wrap{
      display:flex;
      flex-direction:column;
      align-items:stretch;
      gap:18px;
    }

    .cv-paper{
      position:relative;
      overflow:hidden;
      display:block;
      padding:26px;
      border-radius:32px;
      background:var(--light);
      color:var(--dark);
      box-shadow:0 28px 70px rgba(0,0,0,0.32);
      transform:rotate(1.1deg);
      transition:transform var(--transition), box-shadow var(--transition), filter var(--transition);
      cursor:pointer;
    }

    .cv-paper:hover{
      transform:rotate(0deg) translateY(-8px);
      box-shadow:0 34px 84px rgba(0,0,0,0.4);
      filter:saturate(1.04);
    }

    .cv-paper::before{
      content:"";
      position:absolute;
      inset:14px;
      border:2px solid rgba(3,16,16,0.08);
      border-radius:22px;
      pointer-events:none;
    }

    .cv-paper-head{
      position:relative;
      z-index:1;
      display:flex;
      justify-content:space-between;
      gap:16px;
      align-items:flex-start;
      padding-bottom:16px;
      border-bottom:4px solid var(--dark);
      margin-bottom:18px;
    }

    .cv-paper-head span,
    .cv-entry span{
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:.78rem;
      letter-spacing:.06em;
      text-transform:uppercase;
    }

    .cv-paper-head strong{
      max-width:260px;
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(1.6rem, 3vw, 2.4rem);
      line-height:.9;
      text-align:right;
      text-transform:uppercase;
    }

    .cv-entry{
      position:relative;
      z-index:1;
      padding:14px 0;
      border-bottom:1px solid rgba(3,16,16,0.12);
    }

    .cv-entry:last-child{
      border-bottom:0;
    }

    .cv-entry h3{
      max-width:660px;
      margin-bottom:6px;
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(1.25rem, 2.8vw, 2rem);
      line-height:1;
      text-transform:uppercase;
    }

    .cv-entry span{
      display:block;
      color:var(--primary);
    }

    .cv-entry p{
      max-width:720px;
      margin-top:8px;
      font-family:var(--font-body);
      line-height:1.55;
      text-transform:lowercase;
    }

    .cv-download-row{
      display:flex;
      justify-content:center;
      padding-top:2px;
    }

    .cv-download-row .btn{
      width:min(100%, 260px);
      justify-content:center;
    }

    .cv-download-row .btn::after{
      content:"↓";
      margin-left:10px;
      font-size:.95em;
      line-height:1;
    }

    /* Contacto */
    .contact{
      padding:110px 0 90px;
    }

    .contact-box{
      border:1px solid rgba(245,242,238,0.08);
      border-radius:34px;
      padding:42px;
      background:
        radial-gradient(circle at top right, rgba(235,91,48,0.16), transparent 30%),
        linear-gradient(145deg, rgba(245,242,238,0.05), rgba(245,242,238,0.02));
      box-shadow:var(--shadow);
      display:grid;
      grid-template-columns:1fr;
      gap:18px;
      align-items:center;
      justify-items:center;
      text-align:center;
    }

    .contact-box h2{
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(3rem, 7vw, 5.3rem);
      line-height:.9;
      text-transform:uppercase;
      margin-bottom:14px;
    }

    .contact-box p{
      font-family:var(--font-body);
      color:rgba(245,242,238,0.78);
      line-height:1.75;
      text-transform:lowercase;
      max-width:720px;
      margin:0 auto;
    }

    /* Tarifario */
    .tarifario-page{
      min-height:100vh;
      background:
        radial-gradient(circle at 85% 10%, rgba(235,91,48,0.26), transparent 30%),
        linear-gradient(180deg, #031010 0%, #0a1716 48%, #eb5b30 100%);
    }

    .tarifario-progress{
      position:fixed;
      top:0;
      left:0;
      right:0;
      height:5px;
      z-index:600;
      background:rgba(245,242,238,0.08);
    }

    .tarifario-progress span{
      display:block;
      width:0;
      height:100%;
      background:var(--primary);
      box-shadow:0 0 22px rgba(235,91,48,0.72);
    }

    .tarifario-hero{
      min-height:min(760px, calc(100vh - var(--header-h)));
      display:grid;
      align-items:center;
      padding:52px 0 34px;
      position:relative;
      overflow:hidden;
    }

    .tarifario-hero::before{
      content:"TARIFARIO";
      position:absolute;
      left:50%;
      top:8%;
      transform:translateX(-50%);
      color:transparent;
      -webkit-text-stroke:1px rgba(245,242,238,0.08);
      font-family:var(--font-title);
      font-size:clamp(5rem, 18vw, 18rem);
      line-height:.8;
      letter-spacing:.02em;
      pointer-events:none;
      white-space:nowrap;
    }

    .contacto-tarifario-hero::before{
      content:"CONTACTO";
    }

    .tarifario-hero-grid{
      position:relative;
      z-index:1;
      display:grid;
      grid-template-columns:minmax(0, .95fr) minmax(260px, 360px);
      gap:clamp(24px, 5vw, 64px);
      align-items:center;
      min-width:0;
    }

    .tarifario-kicker{
      display:inline-flex;
      width:max-content;
      margin-bottom:18px;
      padding:9px 14px;
      border-radius:999px;
      background:rgba(235,91,48,0.16);
      border:1px solid rgba(235,91,48,0.32);
      color:var(--primary);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      text-transform:uppercase;
      letter-spacing:.08em;
    }

    .tarifario-title{
      max-width:min(700px, 100%);
      font-family:var(--font-title);
      font-size:clamp(3rem, 7.4vw, 6.8rem);
      font-weight:var(--weight-title);
      line-height:.92;
      text-transform:uppercase;
      text-wrap:balance;
      overflow-wrap:normal;
      word-break:normal;
      hyphens:none;
    }

    .tarifario-title span{
      color:var(--primary);
    }

    .tarifario-lead{
      max-width:560px;
      margin-top:18px;
      color:rgba(245,242,238,0.78);
      font-size:clamp(1rem, 1.35vw, 1.16rem);
      line-height:1.48;
    }

    .tarifario-actions{
      display:flex;
      flex-wrap:wrap;
      gap:14px;
      margin-top:30px;
    }

    .tarifario-cat-card{
      position:relative;
      display:grid;
      justify-items:center;
      align-content:center;
      padding:18px 18px 20px;
      border-radius:26px;
      border:1px solid rgba(245,242,238,0.12);
      background:rgba(5,24,24,0.82);
      box-shadow:var(--shadow);
      overflow:hidden;
      transform-origin:center;
      animation:tarifarioCardFloat 5.8s ease-in-out infinite;
    }

    .tarifario-cat-card::before{
      content:"";
      position:absolute;
      width:210px;
      height:210px;
      left:50%;
      top:18px;
      transform:translateX(-50%);
      border-radius:999px;
      background:rgba(245,242,238,0.1);
      filter:blur(14px);
      pointer-events:none;
      animation:tarifarioGlowPulse 4.4s ease-in-out infinite;
    }

    .tarifario-cat-card img{
      position:relative;
      z-index:1;
      width:min(248px, 64vw);
      margin-inline:auto;
      filter:
        drop-shadow(3px 0 0 rgba(245,242,238,0.98))
        drop-shadow(-3px 0 0 rgba(245,242,238,0.98))
        drop-shadow(0 3px 0 rgba(245,242,238,0.98))
        drop-shadow(0 -3px 0 rgba(245,242,238,0.98))
        drop-shadow(2px 2px 0 rgba(245,242,238,0.9))
        drop-shadow(-2px -2px 0 rgba(245,242,238,0.9))
        drop-shadow(-2px 2px 0 rgba(245,242,238,0.84))
        drop-shadow(2px -2px 0 rgba(245,242,238,0.84))
        drop-shadow(0 24px 32px rgba(0,0,0,0.32));
      transform-origin:50% 18%;
      animation:tarifarioCatFloat 5.2s ease-in-out infinite;
    }

    .tarifario-cat-card p{
      position:relative;
      z-index:1;
      max-width:280px;
      margin-top:10px;
      color:rgba(245,242,238,0.78);
      font-size:.98rem;
      line-height:1.38;
      text-align:center;
    }

    .tarifario-tape{
      position:relative;
      z-index:2;
      width:100vw;
      margin:34px calc(50% - 50vw) 0;
      overflow:hidden;
      background:var(--primary);
      transform:rotate(-1.1deg);
      box-shadow:0 14px 36px rgba(0,0,0,0.26);
    }

    .tarifario-tape-track{
      display:flex;
      width:max-content;
      animation:tarifarioTapeMove 26s linear infinite;
    }

    .tarifario-tape span{
      flex:0 0 auto;
      padding:10px 24px;
      color:var(--light);
      font-family:var(--font-title);
      font-weight:var(--weight-title);
      font-size:clamp(1rem, 2.3vw, 2rem);
      line-height:1;
      letter-spacing:.02em;
      text-transform:uppercase;
      white-space:nowrap;
    }

    .tarifario-tape span::after{
      content:"/";
      margin-left:24px;
      color:rgba(255,255,255,0.68);
    }

    @keyframes tarifarioTapeMove{
      from{ transform:translateX(0); }
      to{ transform:translateX(-50%); }
    }

    @keyframes tarifarioCardFloat{
      0%, 100%{ transform:translateY(0) rotate(0deg); }
      50%{ transform:translateY(-8px) rotate(.7deg); }
    }

    @keyframes tarifarioGlowPulse{
      0%, 100%{ opacity:.8; transform:translateX(-50%) scale(.96); }
      50%{ opacity:1; transform:translateX(-50%) scale(1.08); }
    }

    @keyframes tarifarioCatFloat{
      0%, 100%{
        transform:translate3d(0, 0, 0) rotate(-2deg);
      }
      50%{
        transform:translate3d(0, -13px, 0) rotate(2deg);
      }
    }

    @media (prefers-reduced-motion:reduce){
      .tarifario-cat-card,
      .tarifario-cat-card::before,
      .tarifario-cat-card img,
      .tarifario-tape-track{
        animation:none;
      }
    }

    .tarifario-flow{
      padding:64px 0 78px;
    }

    .tarifario-flow-grid{
      display:grid;
      grid-template-columns:1fr;
      gap:clamp(28px, 5vw, 54px);
      align-items:start;
      min-width:0;
    }

    .tarifario-sticky{
      position:relative;
      max-width:760px;
      margin-inline:auto;
      padding:clamp(22px, 4vw, 34px);
      border-radius:26px;
      border:1px solid rgba(245,242,238,0.12);
      background:rgba(3,16,16,0.84);
      box-shadow:var(--shadow);
      min-width:0;
      overflow:hidden;
      text-align:center;
    }

    .tarifario-sticky span,
    .tarifario-step span,
    .pdf-note{
      color:var(--primary);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      text-transform:uppercase;
      letter-spacing:.08em;
      font-size:.88rem;
    }

    .tarifario-sticky h2{
      margin-top:12px;
      font-family:var(--font-title);
      font-size:clamp(2.3rem, 7vw, 5rem);
      line-height:.94;
      text-transform:uppercase;
      overflow-wrap:normal;
      word-break:normal;
      hyphens:none;
    }

    .tarifario-sticky p{
      max-width:560px;
      margin-top:18px;
      margin-inline:auto;
      color:rgba(245,242,238,0.76);
      line-height:1.55;
    }

    .tarifario-steps{
      --runner-y:0px;
      --runner-x:0px;
      --runner-tilt:0deg;
      --flow-progress:0;
      position:relative;
      display:grid;
      gap:34px;
      padding:42px 0;
      isolation:isolate;
    }

    .tarifario-steps::before{
      content:"";
      position:absolute;
      inset:0 7%;
      z-index:-1;
      background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolyline points='50,0 18,16 82,34 18,52 82,70 50,100' fill='none' stroke='%23eb5b30' stroke-width='0.7' stroke-linecap='round' stroke-linejoin='round' stroke-dasharray='2 2'/%3E%3C/svg%3E");
      background-repeat:no-repeat;
      background-size:100% 100%;
      opacity:.72;
      filter:drop-shadow(0 0 16px rgba(235,91,48,0.32));
      pointer-events:none;
    }

    .tarifario-runner{
      position:absolute;
      left:50%;
      top:34px;
      z-index:3;
      width:78px;
      height:78px;
      display:grid;
      place-items:center;
      border-radius:999px;
      background:rgba(3,16,16,0.82);
      border:1px solid rgba(235,91,48,0.42);
      transform:translate(calc(-50% + var(--runner-x)), var(--runner-y)) rotate(var(--runner-tilt));
      transition:transform .16s linear;
      box-shadow:0 12px 32px rgba(0,0,0,0.3);
      pointer-events:none;
    }

    .tarifario-runner img{
      width:62px;
      filter:
        drop-shadow(1px 0 0 rgba(245,242,238,0.95))
        drop-shadow(-1px 0 0 rgba(245,242,238,0.95))
        drop-shadow(0 1px 0 rgba(245,242,238,0.95))
        drop-shadow(0 -1px 0 rgba(245,242,238,0.95));
    }

    .tarifario-step{
      position:relative;
      width:min(610px, calc(50% - 54px));
      min-height:220px;
      display:grid;
      align-content:end;
      padding:28px;
      border-radius:28px;
      border:1px solid rgba(245,242,238,0.1);
      background:
        linear-gradient(135deg, rgba(245,242,238,0.08), rgba(245,242,238,0.02)),
        rgba(3,16,16,0.74);
      box-shadow:0 18px 42px rgba(0,0,0,0.22);
      transform:translateX(24px) scale(.98);
      opacity:.62;
      transition:transform .35s ease, opacity .35s ease, border-color .35s ease;
    }

    .tarifario-step.is-active{
      transform:translateX(0) scale(1);
      opacity:1;
      border-color:rgba(235,91,48,0.5);
    }

    .tarifario-step:nth-of-type(even){
      margin-left:auto;
      transform:translateX(-24px) scale(.98);
    }

    .tarifario-step:nth-of-type(odd){
      margin-right:auto;
    }

    .tarifario-step:nth-of-type(even).is-active{
      transform:translateX(0) scale(1);
    }

    .tarifario-step h3{
      margin-top:10px;
      font-family:var(--font-title);
      font-size:clamp(2rem, 3.2vw, 3.6rem);
      line-height:.94;
      text-transform:uppercase;
      overflow-wrap:normal;
      word-break:normal;
      hyphens:none;
    }

    .tarifario-step p{
      max-width:560px;
      margin-top:12px;
      color:rgba(245,242,238,0.75);
      line-height:1.48;
    }

    .tarifario-pdf-section{
      padding:54px 0 86px;
    }

    .tarifario-pdf-card{
      display:grid;
      grid-template-columns:minmax(0, 1fr) minmax(260px, 390px);
      gap:24px;
      align-items:stretch;
      padding:18px;
      border-radius:32px;
      border:1px solid rgba(245,242,238,0.16);
      background:linear-gradient(145deg, rgba(3,16,16,0.92), rgba(31,25,20,0.9));
      box-shadow:var(--shadow);
      min-width:0;
      overflow:hidden;
    }

    .tarifario-pdf-viewer{
      min-height:min(78vh, 760px);
      overflow:hidden;
      border-radius:22px;
      background:rgba(245,242,238,0.9);
    }

    .tarifario-pdf-viewer iframe{
      width:100%;
      height:100%;
      min-height:min(78vh, 760px);
      border:0;
      background:var(--light);
    }

    .tarifario-pdf-copy{
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      gap:26px;
      padding:22px;
      min-width:0;
    }

    .tarifario-pdf-copy h2{
      margin-top:10px;
      font-family:var(--font-title);
      font-size:clamp(2.25rem, 4.1vw, 4.3rem);
      line-height:.94;
      text-transform:uppercase;
      overflow-wrap:normal;
      word-break:normal;
      hyphens:none;
    }

    .tarifario-pdf-copy p{
      margin-top:16px;
      color:rgba(245,242,238,0.76);
      line-height:1.55;
    }

    @media (max-width:1100px){
      .tarifario-hero-grid,
      .tarifario-flow-grid,
      .tarifario-pdf-card{
        grid-template-columns:1fr;
      }

      .tarifario-hero{
        min-height:auto;
        padding:38px 0 28px;
      }

      .tarifario-title{
        max-width:620px;
        margin-inline:auto;
        font-size:clamp(2.6rem, 9.8vw, 5rem);
        text-align:center;
      }

      .tarifario-kicker,
      .tarifario-lead,
      .tarifario-actions{
        margin-inline:auto;
        justify-content:center;
        text-align:center;
      }

      .tarifario-kicker{
        display:flex;
      }

      .tarifario-cat-card{
        width:min(420px, 100%);
        margin-inline:auto;
      }

      .tarifario-tape{
        margin-top:26px;
        transform:rotate(-.7deg);
      }

      .tarifario-tape span{
        padding:9px 18px;
        font-size:clamp(.9rem, 3.6vw, 1.35rem);
      }

      .tarifario-sticky{
        position:relative;
        top:auto;
      }

      .tarifario-sticky h2,
      .tarifario-pdf-copy h2{
        font-size:clamp(2.45rem, 9.6vw, 4.8rem);
      }

      .tarifario-step,
      .tarifario-step:nth-of-type(even),
      .tarifario-step:nth-of-type(odd){
        width:calc(100% - 68px);
        margin-left:68px;
        margin-right:0;
        transform:translateY(18px) scale(.98);
      }

      .tarifario-step.is-active{
        transform:translateY(0) scale(1);
      }

      .tarifario-steps::before{
        inset:8px auto 8px 28px;
        width:18px;
        background-size:18px 100%;
      }

      .tarifario-runner{
        left:37px;
        width:52px;
        height:52px;
      }

      .tarifario-runner img{
        width:42px;
      }
    }

    @media (max-width:680px){
      .tarifario-flow{
        padding:42px 0 56px;
      }

      .tarifario-sticky{
        text-align:left;
      }

      .tarifario-sticky h2{
        font-size:clamp(2rem, 8vw, 3.4rem);
      }

      .tarifario-step,
      .tarifario-step:nth-of-type(even),
      .tarifario-step:nth-of-type(odd){
        width:calc(100% - 44px);
        margin-left:44px;
        padding:24px;
      }

      .tarifario-steps::before{
        left:18px;
        width:14px;
        background-size:14px 100%;
      }

      .tarifario-runner{
        left:25px;
        width:42px;
        height:42px;
      }

      .tarifario-runner img{
        width:34px;
      }

      .tarifario-step h3{
        font-size:clamp(1.65rem, 5.8vw, 2.7rem);
      }
    }

    @media (max-width:560px){
      .tarifario-flow{
        padding:34px 0 48px;
      }

      .tarifario-title{
        max-width:360px;
        font-size:clamp(2.2rem, 11.2vw, 3.25rem);
        line-height:.98;
      }

      .tarifario-lead{
        font-size:.98rem;
      }

      .tarifario-tape{
        margin-top:20px;
      }

      .tarifario-tape span{
        padding:8px 14px;
        font-size:.88rem;
      }

      .tarifario-actions{
        display:grid;
      }

      .tarifario-sticky,
      .tarifario-pdf-copy{
        padding:20px;
      }

      .tarifario-sticky h2,
      .tarifario-pdf-copy h2{
        font-size:clamp(2rem, 10.5vw, 3.25rem);
        line-height:.96;
      }

      .tarifario-step,
      .tarifario-step:nth-of-type(even),
      .tarifario-step:nth-of-type(odd){
        width:calc(100% - 38px);
        min-height:auto;
        margin-left:38px;
        margin-right:0;
        padding:22px 20px;
        border-radius:24px;
        transform:translateY(22px) rotate(-.8deg) scale(.98);
      }

      .tarifario-step:nth-of-type(even){
        transform:translateY(22px) rotate(.8deg) scale(.98);
      }

      .tarifario-step.is-active,
      .tarifario-step:nth-of-type(even).is-active{
        transform:translateY(0) rotate(0deg) scale(1);
      }

      .tarifario-steps{
        gap:22px;
        padding:28px 0 20px;
      }

      .tarifario-steps::before{
        display:block;
        inset:12px auto 18px 14px;
        width:12px;
        background-size:12px 100%;
        opacity:.9;
        filter:drop-shadow(0 0 10px rgba(235,91,48,0.36));
      }

      .tarifario-runner{
        display:grid;
        left:20px;
        top:28px;
        width:38px;
        height:38px;
        border-color:rgba(245,242,238,0.28);
        background:rgba(3,16,16,0.88);
        box-shadow:0 8px 18px rgba(0,0,0,0.32);
      }

      .tarifario-runner img{
        width:31px;
        filter:
          drop-shadow(1px 0 0 rgba(245,242,238,0.95))
          drop-shadow(-1px 0 0 rgba(245,242,238,0.95))
          drop-shadow(0 1px 0 rgba(245,242,238,0.95))
          drop-shadow(0 -1px 0 rgba(245,242,238,0.95));
      }

      .tarifario-step::before{
        content:"";
        position:absolute;
        left:-31px;
        top:28px;
        width:13px;
        height:13px;
        border-radius:999px;
        background:var(--primary);
        box-shadow:0 0 0 6px rgba(235,91,48,0.14), 0 0 18px rgba(235,91,48,0.5);
        opacity:.65;
        transition:opacity .25s ease, transform .25s ease;
      }

      .tarifario-step.is-active::before{
        opacity:1;
        transform:scale(1.22);
      }

      .tarifario-step h3{
        font-size:clamp(1.55rem, 7.4vw, 2.35rem);
        line-height:.98;
      }

      .tarifario-step p{
        font-size:.94rem;
        line-height:1.45;
      }

      .tarifario-cat-card img{
        width:min(210px, 70vw);
      }

      .tarifario-cat-card p{
        max-width:250px;
        font-size:.94rem;
      }

      .tarifario-pdf-card{
        padding:10px;
        border-radius:24px;
      }

      .tarifario-pdf-viewer,
      .tarifario-pdf-viewer iframe{
        min-height:68vh;
      }
    }

    /* Footer */
    .footer{
      padding:26px 0 34px;
      border-top:1px solid rgba(245,242,238,0.08);
    }

    .footer-inner{
      display:grid;
      grid-template-columns:auto 1fr auto;
      align-items:center;
      gap:18px;
      color:rgba(245,242,238,0.62);
      font-family:var(--font-body);
      text-transform:lowercase;
    }

    .footer-inner > div:not([class]){
      display:none;
    }

    .footer-brand img{
      display:block;
      width:48px;
      height:48px;
      padding:6px;
      border-radius:50%;
      object-fit:contain;
      background:rgba(245,242,238,0.08);
      border:1px solid rgba(245,242,238,0.14);
      box-shadow:0 14px 30px rgba(0,0,0,0.18);
    }

    .footer-claim{
      justify-self:center;
      text-align:center;
      color:var(--light);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:clamp(0.95rem, 1.5vw, 1.2rem);
      letter-spacing:.03em;
    }

    .footer-handle{
      justify-self:end;
      color:rgba(245,242,238,0.7);
      font-family:var(--font-subtitle);
      font-weight:var(--weight-subtitle);
      font-size:clamp(0.92rem, 1.35vw, 1.08rem);
    }

    /* Responsive */
    @media (max-width:1100px){
      .about-wrap,
      .contact-box,
      .project-showcase{
        grid-template-columns:1fr;
      }

      .hero-wrap{
        grid-template-columns:minmax(0, 1fr) minmax(220px, .42fr);
        gap:28px;
      }

      .hero-slogan{
        right:-52px;
      }

      .hero{
        padding:42px 0 72px;
      }

      .hero-card{
        min-height:300px;
      }

      .about-photo{
        max-width:none;
        width:100%;
      }

      .story-card{
        flex:0 0 240px;
      }
    }

    @media (max-width:900px){
      .container{
        width:min(100% - 24px, var(--max-width));
      }

      .site-header{
        backdrop-filter:blur(12px);
      }

      .nav{
        flex-direction:column;
        align-items:flex-start;
        justify-content:flex-start;
        padding:14px 0;
        gap:14px;
      }

      .brand{
        margin-left:0;
      }

      .nav-links{
        gap:14px;
      }

      .services{
        padding:90px 0;
      }

      .creative-bridge{
        padding:24px 0 62px;
      }

      .creative-bridge-cross{
        padding:14px 0 34px;
      }

      .bridge-cat{
        left:-10px;
        bottom:-12px;
        width:min(24vw, 164px);
      }

      .bridge-stamp{
        top:-26px;
        right:-24px;
        width:min(20vw, 118px);
      }

      .bridge-wrap{
        grid-template-columns:1fr;
        gap:14px;
      }

      .bridge-steps{
        grid-template-columns:1fr;
      }

      .bridge-step{
        min-height:165px;
      }

      .bridge-step p{
        max-width:none;
      }

      .services-head{
        grid-template-columns:1fr;
        gap:18px;
      }

      .services-head p{
        max-width:680px;
      }

      .services-grid,
      .post-grid{
        grid-template-columns:1fr;
      }

      .reviews-grid{
        grid-template-columns:repeat(2, minmax(0,1fr));
      }

      .cv-wrap{
        grid-template-columns:1fr;
      }

      .service-item h3,
      .service-item p{
        max-width:62%;
      }

      .section-head{
        margin-bottom:28px;
      }

      .projects,
      .about,
      .contact{
        padding:92px 0;
      }

      .project-media{
        min-height:320px;
      }

      .project-card img{
        height:300px;
      }

      .project-sections{
        gap:18px;
      }

      .about-copy,
      .project-copy,
      .contact-box{
        padding:24px;
      }

      .software-item{
        grid-template-columns:44px minmax(0,1fr);
      }

      .software-icon{
        width:44px;
        height:44px;
        border-radius:14px;
      }

      .stories-viewport{
        mask-image:none;
        -webkit-mask-image:none;
      }

      .story-card{
        flex:0 0 230px;
      }
    }

    @media (max-width:760px){
      .hero-marquee,
      .bridge-tape{
        width:100%;
        max-width:100%;
        margin-left:0;
        margin-right:0;
      }

      .video-marquee,
      .stories-viewport,
      .ig-phone-wrap,
      .reviews-side{
        max-width:100%;
        overflow-x:clip;
      }

      .brand{
        gap:10px;
      }

      .astronaut-rig{
        right:-8px;
        width:108px;
      }

      .astronaut-rope{
        width:3px;
      }

      .scroll-astronaut{
        opacity:.72;
      }

      .brand-logo{
        width:58px;
        height:58px;
        padding:4px;
      }

      .brand-wordmark{
        width:min(84px, 32vw);
      }

      .nav-links{
        width:100%;
        gap:10px;
      }

      .nav-links a{
        font-size:.92rem;
      }

      .hero{
        min-height:auto;
        padding:34px 0 58px;
      }

      .hero-wrap{
        grid-template-columns:1fr;
        gap:28px;
      }

      .title-line{
        font-size:clamp(3rem, 14vw, 5.2rem);
      }

      .hero-slogan{
        position:relative;
        top:auto;
        right:auto;
        margin:0 0 18px 8px;
        font-size:1rem;
      }

      .hero-copy p{
        font-size:1rem;
        line-height:1.65;
      }

      .hero-actions{
        flex-direction:column;
        align-items:stretch;
      }

      .btn{
        width:100%;
      }

      .hero-tags{
        gap:10px;
      }

      .hero-tags span{
        padding:9px 12px;
        font-size:.84rem;
      }

      .hero-card{
        min-height:320px;
        border-radius:26px;
      }

      .hero-card::before{
        inset:12px;
        border-radius:20px;
      }

      .hero-logo{
        min-height:180px;
      }

      .hero-logo img{
        max-width:280px;
      }

      .hero-stamp{
        width:124px;
        height:124px;
        right:-22px;
        top:-28px;
      }

      .services{
        padding:74px 0;
      }

      .services::before,
      .services::after{
        font-size:14rem;
        opacity:0.08;
      }

      .services-grid{
        gap:14px;
      }

      .service-item{
        min-height:auto;
        padding:20px;
      }

      .service-preview{
        position:relative;
        top:auto;
        right:auto;
        width:100%;
        height:142px;
        justify-content:flex-start;
        margin:12px 0 22px;
      }

      .service-content{
        max-width:100%;
      }

      .service-item h3,
      .service-item p{
        max-width:100%;
      }

      .projects,
      .about,
      .reviews,
      .cv-preview,
      .contact{
        padding:72px 0;
      }

      .section-head h2,
      .about-copy h2,
      .contact-box h2{
        font-size:clamp(2.5rem, 12vw, 4rem);
      }

      .project-card img{
        height:240px;
      }

      .project-media{
        min-height:260px;
      }

      .reviews-grid{
        grid-template-columns:1fr;
      }

      .review-card{
        min-height:230px;
      }

      .cv-copy,
      .cv-paper{
        padding:20px;
        border-radius:24px;
      }

      .cv-copy h2{
        font-size:clamp(1.9rem, 9vw, 2.85rem);
        max-width:10ch;
      }

      .cv-paper{
        transform:none;
      }

      .cv-paper-head{
        display:block;
      }

      .cv-paper-head strong{
        display:block;
        max-width:none;
        margin-top:10px;
        text-align:left;
      }

      .project-info,
      .project-copy{
        padding:20px;
      }

      .project-copy h3{
        font-size:clamp(2rem, 9vw, 3rem);
      }

      .about-photo{
        min-height:280px;
        padding:16px;
      }

      .about-copy{
        padding:20px;
      }

      .software-item{
        grid-template-columns:40px minmax(0,1fr);
        gap:10px;
        padding:12px;
      }

      .software-icon{
        width:40px;
        height:40px;
        border-radius:12px;
      }

      .contact-box{
        gap:18px;
        padding:20px;
      }

      .footer-inner{
        grid-template-columns:1fr;
        text-align:center;
        justify-items:center;
      }

      .story-card{
        flex:0 0 210px;
      }
    }

    @media (max-width:480px){
      html,
      body{
        max-width:100%;
        overflow-x:hidden;
      }

      .hero-wrap,
      .about-wrap,
      .reviews-editorial,
      .contact-box,
      .cv-wrap{
        min-width:0;
        max-width:100%;
      }

      .hero-marquee,
      .bridge-tape{
        transform:none;
      }

      .container{
        width:min(100% - 20px, var(--max-width));
      }

      .astronaut-rig{
        right:-26px;
        width:92px;
      }

      .scroll-astronaut{
        opacity:.66;
      }

      .brand-wordmark{
        width:min(74px, 38vw);
      }

      .nav-links{
        gap:8px;
      }

      .nav-links a{
        font-size:.82rem;
      }

      .btn-nav{
        padding:10px 16px;
      }

      .hero{
        padding:28px 0 48px;
      }

      .bridge-tape span{
        padding:10px 20px;
        font-size:.86rem;
      }

      .bridge-tape{
        transform:rotate(-1.5deg);
        margin-bottom:12px;
      }

      .creative-bridge-cross{
        padding:10px 0 28px;
      }

      .bridge-stamp{
        top:-16px;
        right:-12px;
        width:82px;
      }

      .bridge-cat{
        position:relative;
        right:auto;
        bottom:auto;
        width:110px;
        margin:4px auto 0;
      }

      .bridge-copy,
      .bridge-step{
        padding:18px;
        border-radius:22px;
      }

      .bridge-step{
        min-height:150px;
      }

      .bridge-step::before{
        right:10px;
        bottom:-6px;
        font-size:4.8rem;
      }

      .title-line{
        font-size:clamp(2.6rem, 16vw, 4.2rem);
      }

      .hero-slogan{
        font-size:.95rem;
      }

      .hero-copy p,
      .about-copy p,
      .contact-box p,
      .section-head p{
        font-size:.95rem;
        line-height:1.6;
      }

      .label,
      .project-copy .tag,
      .mini-kicker,
      .project-info span,
      .story-info span,
      .about-kicker{
        font-size:.72rem;
      }

      .hero-card{
        min-height:300px;
      }

      .hero-logo img{
        max-width:250px;
      }

      .hero-stamp{
        width:104px;
        height:104px;
        right:-14px;
        top:-20px;
      }

      .services{
        padding:64px 0;
      }

      .video-marquee-track{
        gap:12px;
      }

      .video-tile{
        flex-basis:170px;
        border-radius:22px;
      }

      .review-card{
        padding:20px;
        border-radius:24px;
      }

      .review-card p{
        max-width:100%;
      }

      .services::before,
      .services::after{
        font-size:11rem;
      }

      .service-item h3{
        font-size:1.55rem;
      }

      .service-item{
        min-height:auto;
        border-radius:24px;
      }

      .service-preview{
        height:126px;
        gap:6px;
      }

      .service-preview img,
      .service-preview video{
        width:70px;
        height:108px;
        border-radius:14px;
      }

      .service-preview-wide img{
        width:84px;
        height:74px;
      }

      .service-content{
        max-width:100%;
      }

      .project-card img{
        height:210px;
      }

      .project-media{
        min-height:220px;
      }

      .about-photo{
        min-height:250px;
      }

      .story-card{
        flex:0 0 190px;
      }
    }

    /* Responsive polish */
    @media (max-width:1024px){
      .container{
        width:min(100% - 28px, var(--max-width));
      }

      .hero-wrap{
        grid-template-columns:minmax(0,1fr) minmax(260px,.7fr);
      }

      .hero-title{
        max-width:100%;
      }

      .about-wrap{
        grid-template-columns:1fr;
      }

      .about-photo{
        display:grid;
        grid-template-columns:minmax(220px, .7fr) minmax(0, 1fr);
        align-items:start;
      }

      .about-photo > img{
        position:sticky;
        top:calc(var(--header-h) + 18px);
      }

      .about-wrap{
        grid-template-columns:1fr;
      }

      .video-lite{
        grid-template-columns:1fr;
      }

      .about-portrait{
        display:grid;
        grid-template-columns:minmax(240px,.42fr) minmax(0,1fr);
        align-items:end;
      }

      .about-photo-card{
        width:min(100%, 300px);
      }

      .software-list{
        grid-template-columns:repeat(2, minmax(0,1fr));
      }
    }

    @media (max-width:820px){
      .site-header{
        position:sticky;
      }

      .tarifario-page .current-page-link{
        display:none;
      }

      .nav{
        gap:12px;
      }

      .nav-links{
        width:100%;
        display:grid;
        grid-template-columns:repeat(3, minmax(0,1fr));
        gap:8px;
      }

      .nav-links a{
        min-height:40px;
        display:flex;
        align-items:center;
        justify-content:center;
        padding:9px 8px;
        border-radius:999px;
        background:rgba(245,242,238,0.05);
        border:1px solid rgba(245,242,238,0.07);
        text-align:center;
        line-height:1;
      }

      .nav-links .btn-nav{
        padding:9px 8px;
      }

      .hero-wrap{
        grid-template-columns:1fr;
      }

      .hero-visual{
        max-width:520px;
        width:100%;
        margin:0 auto;
      }

      .hero-marquee{
        grid-column:auto;
        margin-top:6px;
      }

      .scroll-cue{
        grid-column:auto;
      }

      .services-head h2,
      .section-head h2{
        word-break:normal;
        overflow-wrap:anywhere;
      }

      .service-number{
        font-size:3rem;
      }

      .service-preview{
        width:min(46%, 220px);
      }

      .video-tags{
        gap:8px;
      }

      .cv-wrap{
        grid-template-columns:1fr;
      }

      .reviews-editorial{
        grid-template-columns:1fr;
      }

      .reviews-grid-fancy{
        grid-template-columns:repeat(2, minmax(0,1fr));
      }

      .ig-phone-wrap{
        position:relative;
        top:auto;
        min-height:auto;
        padding-bottom:140px;
      }

      .reviews-stamp{
        width:min(28%, 110px);
      }
    }

    @media (max-width:640px){
      :root{
        --header-h:74px;
      }

      .container{
        width:min(100% - 22px, var(--max-width));
      }

      .site-header{
        background:rgba(3,16,16,0.94);
      }

      .nav{
        padding:12px 0;
      }

      .brand-logo{
        width:54px;
        height:54px;
      }

      .brand-wordmark{
        width:min(82px, 30vw);
      }

      .nav-links{
        grid-template-columns:repeat(2, minmax(0,1fr));
      }

      .nav-links a{
        font-size:.78rem;
        min-height:38px;
      }

      .astronaut-rig{
        width:82px;
        right:-24px;
        opacity:.58;
      }

      .astronaut-rope{
        opacity:.62;
      }

      .hero{
        padding-top:26px;
      }

      .hero-kicker{
        max-width:100%;
        font-size:.78rem;
      }

      .title-line{
        font-size:clamp(2.7rem, 15vw, 4.6rem);
      }

      .hero-copy p{
        max-width:100%;
      }

      .hero-actions{
        gap:10px;
      }

      .btn{
        min-height:46px;
        justify-content:center;
        text-align:center;
      }

      .hero-card{
        min-height:235px;
      }

      .hero-tags{
        justify-content:center;
      }

      .about-photo{
        display:flex;
        gap:14px;
      }

      .about-portrait{
        display:flex;
        gap:16px;
      }

      .about-photo-card{
        width:min(100%, 260px);
      }

      .about-portrait h2{
        font-size:clamp(2.05rem, 9.4vw, 3rem);
        line-height:.94;
      }

      .about-portrait h2::after{
        width:58px;
        height:6px;
        margin-top:10px;
      }

      .about-copy{
        padding:22px;
        border-radius:24px;
      }

      .about-copy > h2{
        font-size:clamp(3.4rem, 17vw, 5.4rem);
      }

      .about-copy > p{
        font-size:1rem;
        line-height:1.62;
      }

      .about-meta span,
      .about-chip-list span{
        min-height:34px;
        padding:8px 11px;
        font-size:.72rem;
      }

      .about-photo > img{
        position:static;
      }

      .about-profile,
      .about-skills{
        padding:15px;
      }

      .about-skills ul{
        gap:7px;
      }

      .software-list{
        grid-template-columns:1fr;
      }

      .software-item{
        grid-template-columns:42px minmax(0,1fr);
        display:flex;
      }

      .software-top{
        align-items:flex-start;
      }

      .software-percent{
        display:none;
      }

      .software-meter{
        height:6px;
      }

      .services-head h2{
        font-size:clamp(3.2rem, 17vw, 5rem);
      }

      .service-preview{
        position:relative;
        top:auto;
        right:auto;
        width:100%;
        max-width:100%;
        height:132px;
        margin:8px 0 20px;
        justify-content:flex-start;
      }

      .service-preview img,
      .service-preview video{
        width:74px;
        height:112px;
      }

      .service-preview-wide img{
        width:88px;
        height:76px;
      }

      .service-cta{
        align-self:flex-start;
        margin-left:0;
      }

      .projects .section-head{
        margin-bottom:22px;
      }

      .video-marquee{
        mask-image:none;
        -webkit-mask-image:none;
      }

      .video-tile{
        flex-basis:165px;
      }

      .reviews-grid{
        grid-template-columns:1fr;
      }

      .reviews-grid-fancy{
        grid-template-columns:1fr;
      }

      .review-card{
        min-height:auto;
      }

      .ig-phone{
        width:min(100%, 300px);
        transform:none;
      }

      .ig-badge{
        top:18px;
        right:18px;
        font-size:.82rem;
      }

      .ig-direct-btn{
        min-height:42px;
        padding:10px 14px;
        font-size:.76rem;
        width:min(100%, 220px);
      }

      .ig-follow-note{
        max-width:220px;
        margin-top:34px;
        font-size:.78rem;
      }

      .ig-cat{
        left:0;
        top:auto;
        bottom:0;
        width:min(38%, 170px);
      }

      .cv-paper{
        transform:none;
      }

      .contact-box{
        grid-template-columns:1fr;
      }
    }

    @media (max-width:380px){
      .container{
        width:min(100% - 18px, var(--max-width));
      }

      .nav-links a{
        font-size:.72rem;
        padding-inline:6px;
      }

      .title-line{
        font-size:clamp(2.35rem, 15vw, 3.6rem);
      }

      .hero-stamp{
        width:92px;
        height:92px;
      }

      .service-preview img,
      .service-preview video{
        width:64px;
        height:100px;
      }

      .video-tile{
        flex-basis:150px;
      }

      .cv-entry h3{
        font-size:1.15rem;
      }
    }

    @media (max-width:900px){
      :root{
        --header-h:76px;
      }

      body.nav-open{
        overflow:hidden;
      }

      .site-header{
        min-height:var(--header-h);
        z-index:300;
        background:rgba(3,16,16,0.72);
        backdrop-filter:blur(18px) saturate(1.25);
        -webkit-backdrop-filter:blur(18px) saturate(1.25);
      }

      .nav-open .site-header{
        background:transparent;
        border-bottom-color:transparent;
        backdrop-filter:none;
        -webkit-backdrop-filter:none;
      }

      .nav{
        min-height:var(--header-h);
        position:relative;
        flex-direction:row;
        align-items:center;
        justify-content:space-between;
        gap:12px;
        padding:9px 0;
      }

      .brand{
        margin-left:0;
        gap:10px;
        position:relative;
        z-index:330;
      }

      .brand-name{
        display:flex;
        align-items:center;
      }

      .brand-logo{
        width:52px;
        height:52px;
        padding:7px;
        background:rgba(245,242,238,0.1);
        border-color:rgba(245,242,238,0.16);
        box-shadow:0 10px 24px rgba(0,0,0,0.12);
      }

      .brand-logo img{
        width:100%;
        height:100%;
        object-fit:contain;
        object-position:center;
      }

      .brand-wordmark{
        width:min(104px, 34vw);
        filter:brightness(0) invert(1);
      }

      .nav-toggle{
        position:relative;
        z-index:340;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        flex-direction:column;
        flex:0 0 auto;
        width:52px;
        height:52px;
        background:rgba(245,242,238,0.18);
        border-color:rgba(245,242,238,0.18);
        box-shadow:0 10px 24px rgba(0,0,0,0.12);
      }

      .nav-toggle[aria-expanded="true"]{
        color:var(--dark);
        background:rgba(255,255,255,0.88);
        border-color:rgba(3,16,16,0.12);
        box-shadow:0 10px 24px rgba(0,0,0,0.08);
      }

      .nav-toggle[aria-expanded="true"] span:first-child{
        transform:translateY(4px) rotate(45deg);
      }

      .nav-toggle[aria-expanded="true"] span:last-child{
        transform:translateY(-4px) rotate(-45deg);
      }

      .nav-links{
        position:fixed;
        inset:0;
        z-index:320;
        width:100vw;
        height:100dvh;
        display:flex;
        flex-direction:column;
        align-items:stretch;
        justify-content:flex-start;
        gap:0;
        padding:calc(var(--header-h) + 28px) 28px 24px;
        overflow-y:auto;
        border:0;
        border-radius:0;
        background:
          radial-gradient(circle at 12% 10%, rgba(235,91,48,0.18), transparent 24%),
          linear-gradient(180deg, rgba(245,242,238,0.86), rgba(245,242,238,0.78));
        color:var(--dark);
        box-shadow:none;
        opacity:0;
        visibility:hidden;
        pointer-events:none;
        transform:translateX(100%);
        transition:opacity .3s ease, visibility .3s ease, transform .38s cubic-bezier(.2,.8,.2,1);
        backdrop-filter:blur(18px) saturate(1.08);
        -webkit-backdrop-filter:blur(18px) saturate(1.08);
      }

      .nav-links::after{
        content:"";
      }

      .nav-open .nav-links{
        opacity:1;
        visibility:visible;
        pointer-events:auto;
        transform:translateX(0);
      }

      .nav-links a{
        min-height:72px;
        display:flex;
        align-items:center;
        justify-content:space-between;
        padding:18px 0;
        border:0;
        border-bottom:1px solid rgba(3,16,16,0.12);
        border-radius:0;
        background:transparent;
        color:var(--dark);
        font-family:var(--font-subtitle);
        font-size:clamp(2.15rem, 9.4vw, 3.6rem);
        font-weight:var(--weight-subtitle);
        line-height:.98;
        text-align:left;
        box-shadow:none;
      }

      .nav-links a::after{
        content:"›";
        color:var(--primary);
        font-family:Arial, sans-serif;
        font-size:.9em;
        line-height:1;
      }

      .nav-links a:hover,
      .nav-links a:focus-visible{
        color:var(--primary);
        border-color:rgba(235,91,48,0.35);
        background:transparent;
      }

      .nav-links .btn-nav{
        margin-top:18px;
        min-height:56px;
        padding:16px 20px;
        justify-content:center;
        border:0;
        border-radius:999px;
        background:var(--primary);
        color:var(--white) !important;
        font-size:1.06rem;
        box-shadow:0 18px 42px rgba(235,91,48,0.25);
      }

      .nav-links .btn-nav::after{
        content:"";
      }

      .nav-links .nav-login{
        margin-top:18px;
        min-height:56px;
        padding:16px 20px;
        justify-content:center;
        border:1px solid rgba(3,16,16,0.12);
        border-radius:999px;
        background:rgba(3,16,16,0.06);
        color:var(--dark) !important;
        font-size:1.06rem;
        box-shadow:none;
      }

      .nav-links .nav-login::after,
      .nav-links .nav-account::after{
        content:"";
      }

      .nav-links .nav-account{
        width:58px;
        min-height:58px;
        height:58px;
        align-self:flex-start;
        justify-content:center;
        padding:0;
        border:1px solid rgba(3,16,16,0.12);
        border-radius:999px;
        background:rgba(3,16,16,0.06);
        color:var(--dark) !important;
        box-shadow:none;
      }
    }

    @media (max-width:760px){
      .hero{
        padding:34px 0 58px;
      }

      .hero-wrap{
        grid-template-columns:1fr;
        justify-items:center;
      }

      .hero-copy{
        width:100%;
        display:flex;
        flex-direction:column;
        align-items:center;
        text-align:center;
      }

      .hero-kicker{
        justify-content:center;
        max-width:100%;
        margin-inline:auto;
        letter-spacing:.04em;
      }

      .hero-slogan{
        margin:0 auto 18px;
        transform:rotate(-4deg);
      }

      .hero-title{
        width:100%;
        align-items:center;
        text-align:center;
        margin-bottom:18px;
      }

      .title-line{
        max-width:100%;
        font-size:clamp(2.65rem, 13.4vw, 4.45rem);
        line-height:.94;
        transform-origin:center;
        text-shadow:0 7px 0 rgba(235,91,48,0.08);
      }

      .typing-line{
        width:auto;
        max-width:100%;
      }

      .typing-text{
        max-width:100%;
        white-space:normal;
        overflow-wrap:normal;
        word-break:keep-all;
      }

      .hero-copy p{
        max-width:34rem;
        margin-inline:auto;
      }

      .hero-actions{
        width:100%;
        max-width:360px;
        align-items:stretch;
        justify-content:center;
      }

      .hero-visual{
        width:100%;
      }
    }

    @media (max-width:480px){
      :root{
        --header-h:70px;
      }

      .site-header{
        background:rgba(3,16,16,0.66);
      }

      .nav{
        padding:7px 0;
      }

      .brand-logo{
        width:48px;
        height:48px;
        padding:6px;
      }

      .brand-wordmark{
        width:min(94px, 36vw);
      }

      .nav-toggle{
        width:48px;
        height:48px;
      }

      .nav-links{
        padding:calc(var(--header-h) + 22px) 24px 22px;
      }

      .nav-links a{
        min-height:64px;
        padding:16px 0;
        font-size:clamp(1.95rem, 10vw, 3.05rem);
      }

      .hero{
        padding-top:26px;
      }

      .hero-kicker{
        font-size:.72rem;
        line-height:1.2;
      }

      .title-line{
        font-size:clamp(2.45rem, 13vw, 3.65rem);
        line-height:.96;
      }

      .hero-copy p{
        font-size:.95rem;
        line-height:1.62;
      }

      .about-portrait{
        gap:14px;
      }

      .about-photo-card{
        width:min(100%, 220px);
      }

      .about-portrait h2{
        font-size:clamp(1.75rem, 8.8vw, 2.35rem);
        line-height:.96;
      }
    }

    @media (max-width:360px){
      .nav-links{
        padding-inline:18px;
      }

      .nav-links a{
        font-size:1.72rem;
      }

      .title-line{
        font-size:clamp(2.12rem, 12.7vw, 3.05rem);
      }

      .hero-card{
        min-height:270px;
      }

      .hero-logo{
        min-height:156px;
      }

      .hero-logo img{
        max-width:220px;
      }
    }

    /* Portada de portfolio y capítulo de perfil */
    .hero-portfolio-meta{
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:8px;
      padding:16px 12px 10px;
      border-top:1px solid rgba(245,242,238,.14);
    }

    .hero-portfolio-meta span{
      display:flex;
      flex-direction:column;
      gap:4px;
      color:rgba(245,242,238,.62);
      font-family:var(--font-subtitle);
      font-size:.62rem;
      font-weight:800;
      letter-spacing:.07em;
      text-transform:uppercase;
    }

    .hero-portfolio-meta b{
      color:var(--primary);
      font-family:var(--font-title);
      font-size:clamp(1.45rem,2.4vw,2.35rem);
      line-height:1;
    }

    .graffiti-title{
      width:fit-content;
      position:relative;
      isolation:isolate;
      transform:rotate(-2deg) skewX(-2deg);
      padding:10px 28px 22px 4px;
    }

    .hero .hero-slogan{
      position:relative;
      top:auto;
      right:auto;
      max-width:190px;
      margin:0 8px 20px auto;
      transform:rotate(-5deg);
    }

    .hero-card .label{
      max-width:calc(100% - 24px);
      line-height:1.2;
      white-space:normal;
    }

    .graffiti-title::before{
      content:"";
      position:absolute;
      inset:-14px -28px -12px -20px;
      z-index:-1;
      opacity:.65;
      background:
        radial-gradient(circle at 6% 24%,var(--primary) 0 3px,transparent 4px),
        radial-gradient(circle at 96% 16%,var(--primary) 0 5px,transparent 6px),
        radial-gradient(circle at 88% 84%,rgba(245,242,238,.8) 0 3px,transparent 4px),
        radial-gradient(circle at 15% 92%,var(--primary) 0 4px,transparent 5px);
      pointer-events:none;
    }

    .graffiti-title::after{
      content:"";
      position:absolute;
      left:-8px;
      right:3%;
      bottom:6px;
      z-index:-1;
      height:15px;
      border-radius:70% 25% 65% 30%;
      background:linear-gradient(90deg,var(--primary) 0 38%,#ff7950 50%,var(--primary) 62% 100%);
      background-size:220% 100%;
      clip-path:polygon(0 30%,92% 0,100% 55%,36% 72%,4% 100%);
      transform:rotate(-1deg) scaleX(0);
      transform-origin:left center;
      will-change:transform,background-position,filter;
    }

    .hero-copy.visible .graffiti-title::after{
      animation:
        graffitiUnderlineDraw .9s cubic-bezier(.2,.85,.25,1) .48s both,
        graffitiUnderlineSweep 2.8s ease-in-out 1.4s infinite alternate;
    }

    @keyframes graffitiUnderlineDraw{
      0%{transform:rotate(-1deg) scaleX(0)}
      72%{transform:rotate(-1deg) scaleX(1.035)}
      100%{transform:rotate(-1deg) scaleX(1)}
    }

    @keyframes graffitiUnderlineSweep{
      0%{background-position:100% 50%;filter:drop-shadow(0 0 0 rgba(235,91,48,0))}
      100%{background-position:0 50%;filter:drop-shadow(0 0 7px rgba(235,91,48,.42))}
    }

    .graffiti-title .graffiti-main{
      font-family:"Roc Grotesk Condensed ExtraBold",var(--font-title);
      font-weight:800;
      font-size:clamp(7rem,16vw,14.5rem);
      letter-spacing:-.02em;
      color:var(--light);
      -webkit-text-stroke:.5px rgba(245,242,238,.7);
      text-shadow:none!important;
    }

    .graffiti-title .graffiti-year{
      align-self:flex-end;
      margin-top:-.08em;
      font-family:"Roc Grotesk Condensed ExtraBold",var(--font-title);
      font-weight:800;
      color:var(--primary);
      font-size:clamp(7rem,16vw,14rem);
      letter-spacing:.01em;
      -webkit-text-stroke:1px rgba(3,16,16,.65);
      text-shadow:none!important;
    }

    @media (max-width:760px){
      .graffiti-title{width:100%;padding-inline:8px;transform:rotate(-1deg)}
      .graffiti-title .graffiti-year{align-self:center;font-size:clamp(4rem,23vw,6.4rem)}
      .hero .hero-slogan{margin:0 auto 20px}
    }

    @media (prefers-reduced-motion:reduce){
      .graffiti-title::after{animation:none!important;transform:rotate(-1deg) scaleX(1)}
    }

    .about{
      padding:clamp(86px,10vw,142px) 0 clamp(92px,10vw,132px);
      overflow:hidden;
      background:
        radial-gradient(circle at 12% 18%,rgba(255,255,255,.22),transparent 26%),
        linear-gradient(135deg,#f3c7b7,#eeb29d);
      color:var(--dark);
      border-top:8px solid var(--primary);
      border-bottom:1px solid rgba(3,16,16,.16);
    }

    .about::before{
      content:"PROFILE";
      position:absolute;
      right:-2vw;
      top:34px;
      color:transparent;
      -webkit-text-stroke:2px rgba(3,16,16,.07);
      font-family:var(--font-title);
      font-size:clamp(8rem,20vw,20rem);
      font-weight:900;
      line-height:.8;
      pointer-events:none;
    }

    .about-chapter-head{
      margin-bottom:clamp(42px,6vw,74px);
      padding-bottom:clamp(30px,4vw,46px);
      border-bottom:1px solid rgba(3,16,16,.22);
      display:grid;
      grid-template-columns:minmax(100px,.25fr) minmax(0,1fr) minmax(260px,.55fr);
      align-items:end;
      gap:clamp(20px,4vw,56px);
      position:relative;
      z-index:2;
    }

    .about-chapter-head>span{
      align-self:start;
      color:var(--primary);
      font-family:var(--font-subtitle);
      font-size:.76rem;
      font-weight:800;
      letter-spacing:.12em;
      text-transform:uppercase;
    }

    .about-chapter-head h2{
      color:var(--dark);
      font-family:var(--font-title);
      font-size:clamp(3.2rem,7vw,7.4rem);
      line-height:.82;
      text-transform:uppercase;
    }

    .about-chapter-head p{
      color:rgba(3,16,16,.68);
      font-size:clamp(1rem,1.4vw,1.14rem);
      line-height:1.6;
    }

    .about .about-wrap{position:relative;z-index:2;grid-template-columns:minmax(310px,.78fr) minmax(0,1.5fr);gap:clamp(34px,5vw,72px)}
    .about .about-portrait h2{max-width:100%;color:var(--dark);font-size:clamp(2.25rem,3.25vw,3.65rem);line-height:.92;overflow-wrap:normal;word-break:normal;hyphens:none}
    .about .about-copy{
      color:var(--light);
      border-color:rgba(3,16,16,.22);
      background:
        linear-gradient(rgba(245,242,238,.025) 1px,transparent 1px),
        linear-gradient(90deg,rgba(245,242,238,.025) 1px,transparent 1px),
        linear-gradient(145deg,#10201e,#061312);
      background-size:32px 32px,32px 32px,auto;
      box-shadow:0 30px 70px rgba(3,16,16,.22);
    }

    @media (max-width:1100px){
      .about-chapter-head{grid-template-columns:1fr}
      .about-chapter-head>span{margin-bottom:4px}
      .about-chapter-head p{max-width:620px}
      .about .about-wrap{grid-template-columns:1fr}
    }

    @media (max-width:600px){
      .hero-portfolio-meta{padding-inline:4px}
      .about{border-top-width:5px}
      .about-chapter-head h2{font-size:clamp(3rem,15vw,5rem)}
    }

    /* Capa responsive final: 1600 / 1440 / 1280 / 1024 / 768 / 480 / 320 */
    @media (min-width:1600px){
      :root{--max-width:1480px}
      .hero-wrap{gap:72px}
      .graffiti-title .title-line{font-size:clamp(7rem,7.4vw,9rem)}
      .graffiti-title .graffiti-year{font-size:clamp(7.4rem,8.2vw,10rem)}
      .video-feature{min-height:610px;grid-template-columns:minmax(0,1.08fr) minmax(220px,.52fr) minmax(380px,.9fr)}
      .video-feature-character img{width:min(100%,310px)}
      .about .about-wrap{grid-template-columns:minmax(360px,.78fr) minmax(0,1.55fr)}
    }

    @media (max-width:1440px){
      :root{--max-width:1240px}
      .hero-wrap{gap:36px}
      .graffiti-title .title-line{font-size:clamp(5.2rem,8vw,7.2rem)}
      .graffiti-title .graffiti-year{font-size:clamp(5.8rem,9vw,8rem)}
      .video-feature{grid-template-columns:minmax(0,1fr) minmax(160px,.46fr) minmax(320px,.9fr)}
      .video-feature-character img{width:min(100%,235px)}
      .video-feature-link>strong{font-size:clamp(2.2rem,3.4vw,3.7rem)}
    }

    @media (max-width:1280px){
      :root{--max-width:1120px}
      .hero-wrap{grid-template-columns:minmax(0,1fr) minmax(300px,.62fr);gap:30px}
      .graffiti-title .title-line{font-size:clamp(4.5rem,7.5vw,6.2rem)}
      .graffiti-title .graffiti-year{font-size:clamp(5rem,8.5vw,6.8rem)}
      .hero-card{min-height:360px}
      .video-feature{min-height:520px;padding-inline:38px;grid-template-columns:minmax(0,1fr) minmax(145px,.38fr) minmax(300px,.85fr)}
      .video-feature-copy h2{font-size:clamp(3.8rem,6.5vw,6.2rem)}
      .video-feature-character img{width:min(100%,210px)}
      .about .about-wrap{grid-template-columns:minmax(290px,.72fr) minmax(0,1.45fr);gap:42px}
    }

    @media (max-width:1024px){
      :root{--max-width:940px}
      .hero-wrap{grid-template-columns:minmax(0,1fr) minmax(280px,.52fr)}
      .graffiti-title .title-line{font-size:clamp(4rem,7.5vw,5.3rem)}
      .graffiti-title .graffiti-year{font-size:clamp(4.5rem,8.2vw,5.8rem)}
      .hero-card{min-height:330px}
      .hero-logo img{max-width:230px}
      .video-feature{grid-template-columns:minmax(0,1fr) minmax(300px,.9fr);gap:30px}
      .video-feature-character{position:absolute;left:45%;bottom:54px;width:175px;transform:translateX(-50%)}
      .video-feature-character>span{right:-32px}
      .about .about-wrap{grid-template-columns:1fr}
      .about-portrait{display:grid;grid-template-columns:minmax(230px,.42fr) minmax(0,1fr);align-items:end}
      .services-grid{gap:16px}
    }

    @media (max-width:768px){
      .container{width:min(100% - 28px,var(--max-width))}
      .hero{padding:34px 0 62px}
      .hero-wrap{grid-template-columns:1fr;justify-items:center}
      .hero-copy{width:100%;align-items:center;text-align:center}
      .hero .hero-slogan{margin-inline:auto}
      .graffiti-title{width:100%;align-items:center;transform:rotate(-1deg)}
      .graffiti-title .title-line{font-size:clamp(3.5rem,15vw,5.6rem)}
      .graffiti-title .graffiti-year{align-self:center;font-size:clamp(4rem,18vw,6.2rem)}
      .hero-copy p{margin-inline:auto}
      .hero-actions{justify-content:center}
      .hero-visual{width:100%;max-width:520px}
      .services-grid{grid-template-columns:1fr}
      .service-item{min-height:300px}
      .about-portrait{display:flex;align-items:center}
      .about .about-portrait h2{max-width:560px;text-align:center}
      .video-feature{grid-template-columns:1fr;padding:30px 24px 84px;gap:26px}
      .video-feature-character{position:relative;left:auto;bottom:auto;width:auto;min-height:220px;transform:none}
      .video-feature-character img{width:200px}
      .video-feature-character>span{top:2px;right:calc(50% - 132px)}
      .video-feature-link{min-height:300px}
    }

    @media (max-width:480px){
      :root{--header-h:70px}
      .container{width:min(100% - 22px,var(--max-width))}
      .hero-kicker{font-size:.7rem;padding:8px 10px}
      .hero .hero-slogan{max-width:165px;font-size:.92rem}
      .graffiti-title{padding:4px 4px 18px}
      .graffiti-title .title-line{font-size:clamp(2.8rem,14vw,4rem);text-shadow:4px 5px 0 rgba(3,16,16,.72),7px 8px 0 rgba(235,91,48,.24)}
      .graffiti-title .graffiti-year{font-size:clamp(3.4rem,20vw,5rem)}
      .hero-actions{width:100%;max-width:360px}
      .hero-actions .btn{width:100%;min-height:50px}
      .hero-card{min-height:290px;padding:14px;border-radius:26px}
      .hero-portfolio-meta span{font-size:.56rem}
      .hero-tags{gap:7px}
      .hero-tags span{padding:8px 10px;font-size:.7rem}
      .about{padding-block:72px;border-top-width:5px}
      .about-chapter-head{margin-bottom:34px;padding-bottom:28px}
      .about-chapter-head h2{font-size:clamp(2.7rem,14vw,4.2rem)}
      .about-copy{padding:20px}
      .about .about-portrait h2{font-size:clamp(2rem,10vw,2.8rem)}
      .service-item{padding:20px;border-radius:24px}
      .service-number{top:20px;right:20px;font-size:3.2rem}
      .service-content{max-width:86%}
      .video-feature{padding:26px 18px 78px;border-radius:28px}
      .video-feature-copy h2{font-size:clamp(3.1rem,17vw,4.5rem)}
      .video-feature-link{min-height:280px;padding:24px}
      .video-feature-link>strong{font-size:clamp(2rem,11vw,3rem)}
    }

    @media (max-width:320px){
      .container{width:calc(100% - 16px)}
      .motion-triangles i:nth-child(even){display:none}
      .graffiti-title .title-line{font-size:2.5rem}
      .graffiti-title .graffiti-year{font-size:3.25rem}
      .hero-copy p{font-size:.9rem;line-height:1.55}
      .hero-card{min-height:270px}
      .hero-portfolio-meta{gap:4px}
      .hero-portfolio-meta b{font-size:1.25rem}
      .about-photo-card{width:min(100%,200px)}
      .about-copy{padding:16px;border-radius:20px}
      .service-item{padding:17px}
      .service-content{max-width:92%}
      .video-feature{padding-inline:14px}
      .video-feature-character img{width:170px}
      .video-feature-link{padding:20px}
    }

    p{
      text-transform:none;
    }

    p::first-letter{
      text-transform:uppercase;
    }

    @media (min-width:1025px){
      .astronaut-rig{width:clamp(96px,10.5vw,165px)}
    }

    /* Centrado final del hero: prevalece sobre todas las capas responsive anteriores */
    .hero-wrap.hero-centered{
      width:min(calc(100% - 32px),1200px)!important;
      max-width:1200px!important;
      margin-inline:auto!important;
      grid-template-columns:minmax(0,1fr)!important;
      justify-content:center!important;
      justify-items:center!important;
    }

    .hero-wrap.hero-centered .hero-copy{
      width:100%!important;
      max-width:1100px!important;
      margin-inline:auto!important;
      align-items:center!important;
      text-align:center!important;
    }

    .hero-wrap.hero-centered .hero-kicker,
    .hero-wrap.hero-centered .hero-slogan,
    .hero-wrap.hero-centered .graffiti-title{
      align-self:center!important;
      margin-left:auto!important;
      margin-right:auto!important;
    }

    .hero-wrap.hero-centered .graffiti-title .title-line{
      width:100%;
      text-align:center;
      transform-origin:center!important;
    }

    .hero-wrap.hero-centered .hero-copy>p{
      width:min(100%,900px)!important;
      margin-left:auto!important;
      margin-right:auto!important;
      text-align:center!important;
    }

    .hero-wrap.hero-centered .hero-actions{
      width:auto!important;
      max-width:none!important;
      margin-left:auto!important;
      margin-right:auto!important;
      justify-content:center!important;
    }

    .hero-wrap.hero-centered .hero-stats{
      width:min(100%,760px)!important;
      margin-left:auto!important;
      margin-right:auto!important;
    }

    @media (min-width:761px) and (max-width:1200px){
      .hero-wrap.hero-centered{width:min(calc(100% - 48px),980px)!important}
      .hero-wrap.hero-centered .hero-copy{max-width:920px!important}
      .hero-wrap.hero-centered .graffiti-title{max-width:100%}
    }

    @media (max-width:760px){
      .hero-wrap.hero-centered{width:calc(100% - 24px)!important}
      .hero-wrap.hero-centered .hero-actions{width:min(100%,380px)!important}
    }

    /* Logo limpio: gato sin contenedor circular junto al wordmark. */
    .brand-logo{
      padding:0!important;
      border:0!important;
      border-radius:0!important;
      overflow:visible!important;
      background:transparent!important;
      box-shadow:none!important;
    }

    .brand-logo img{
      width:100%!important;
      height:100%!important;
      object-fit:contain!important;
      object-position:center!important;
      transform:scale(1.35);
      transform-origin:center;
    }

    .brand{
      gap:0!important;
    }

    .brand-name{
      margin-left:-7px;
    }

    .brand-wordmark{
      width:min(90px, 20vw)!important;
    }

    @media (max-width:760px){
      .brand-name{
        margin-left:-6px;
      }

      .brand-wordmark{
        width:min(80px, 29vw)!important;
      }
    }

    /* Campo global de triángulos animados. */
    .site-triangle-field{
      position:fixed;
      inset:0;
      z-index:8;
      overflow:hidden;
      pointer-events:none;
      contain:strict;
    }

    .site-triangle-field i{
      --triangle-size:14px;
      --triangle-x:24px;
      --triangle-y:-30px;
      --triangle-turn:18deg;
      position:absolute;
      width:var(--triangle-size);
      aspect-ratio:1;
      background:rgba(235,91,48,.28);
      clip-path:polygon(0 0,100% 50%,0 100%);
      filter:drop-shadow(0 0 8px rgba(235,91,48,.22));
      opacity:.5;
      will-change:transform,opacity;
      animation:siteTriangleDrift var(--triangle-time,5.2s) ease-in-out infinite alternate;
    }

    .site-triangle-field i:nth-child(1){left:3%;top:12%;--triangle-size:18px;--triangle-time:4.6s}
    .site-triangle-field i:nth-child(2){left:12%;top:43%;--triangle-size:9px;--triangle-x:-18px;--triangle-time:6.2s;animation-delay:-3s}
    .site-triangle-field i:nth-child(3){left:5%;top:79%;--triangle-size:13px;--triangle-y:34px;animation-delay:-5s}
    .site-triangle-field i:nth-child(4){left:27%;top:18%;--triangle-size:8px;--triangle-x:-28px;--triangle-time:5s;animation-delay:-2s}
    .site-triangle-field i:nth-child(5){left:35%;top:68%;--triangle-size:16px;--triangle-y:26px;--triangle-time:6.6s;animation-delay:-6s}
    .site-triangle-field i:nth-child(6){left:47%;top:34%;--triangle-size:10px;--triangle-x:-20px;animation-delay:-4s}
    .site-triangle-field i:nth-child(7){left:55%;top:88%;--triangle-size:7px;--triangle-time:6.4s;animation-delay:-1s}
    .site-triangle-field i:nth-child(8){right:35%;top:8%;--triangle-size:12px;--triangle-y:25px;animation-delay:-5.5s}
    .site-triangle-field i:nth-child(9){right:24%;top:52%;--triangle-size:18px;--triangle-x:-25px;--triangle-time:6s;animation-delay:-2.5s}
    .site-triangle-field i:nth-child(10){right:13%;top:24%;--triangle-size:9px;--triangle-y:32px;animation-delay:-4.5s}
    .site-triangle-field i:nth-child(11){right:4%;top:67%;--triangle-size:15px;--triangle-x:-30px;--triangle-time:5.7s;animation-delay:-6s}
    .site-triangle-field i:nth-child(12){right:7%;top:91%;--triangle-size:8px;animation-delay:-3.5s}
    .site-triangle-field i:nth-child(13){left:70%;top:76%;--triangle-size:11px;--triangle-y:28px;--triangle-time:6.5s;animation-delay:-1.8s}
    .site-triangle-field i:nth-child(14){left:20%;top:94%;--triangle-size:7px;--triangle-x:-16px;animation-delay:-5.2s}

    @keyframes siteTriangleDrift{
      0%{transform:translate3d(0,0,0) rotate(0) scale(.78);opacity:.22}
      55%{opacity:.62}
      100%{transform:translate3d(var(--triangle-x),var(--triangle-y),0) rotate(var(--triangle-turn)) scale(1.16);opacity:.42}
    }

    @media (max-width:600px){
      .site-triangle-field i{opacity:.38}
      .site-triangle-field i:nth-child(3n){display:none}
    }

    @media (prefers-reduced-motion:reduce){
      .motion-triangles i,
      .site-triangle-field i{
        animation-duration:8s!important;
        opacity:.3;
      }
    }

    /* Jerarquía editorial: contraste Light + ExtraBold dentro de títulos. */
    .attitude-title{
      display:flex!important;
      flex-direction:column;
      align-items:flex-start;
      gap:.035em;
      width:fit-content;
      max-width:100%;
      text-transform:uppercase;
      line-height:1!important;
    }

    .attitude-title .attitude-light{
      display:block;
      font-family:"Roc Grotesk Condensed Light",var(--font-body);
      font-size:.68em;
      font-weight:300;
      line-height:1.03;
      letter-spacing:.012em;
      transform:translateX(.08em);
    }

    .attitude-title .attitude-bold{
      display:block;
      font-family:"Roc Grotesk Condensed ExtraBold",var(--font-title);
      font-size:1em;
      font-weight:800;
      line-height:.91;
      letter-spacing:-.025em;
    }

    .about-chapter-head .attitude-bold,
    .about-portrait .attitude-bold{
      color:var(--primary);
    }

    .video-feature-copy .attitude-light{
      color:rgba(3,16,16,.72);
    }

    .video-feature-copy .attitude-bold{
      color:var(--dark);
    }

    .cv-copy .attitude-light,
    .contact-box .attitude-light{
      color:rgba(245,242,238,.68);
    }

    .cv-copy .attitude-bold,
    .contact-box .attitude-bold{
      color:var(--primary);
    }

    .attitude-title-compact .attitude-light{font-size:.62em}

    @media (max-width:760px){
      .attitude-title{gap:.05em;line-height:1!important}
      .attitude-title .attitude-light{font-size:.62em;line-height:1.06;transform:none}
      .attitude-title .attitude-bold{font-size:.92em;line-height:.94}
    }

    /* Hero: entrada giratoria y texto editorial en dos líneas. */
    .hero-wrap.hero-centered .hero-copy>p{
      width:min(100%,720px)!important;
      max-width:720px!important;
      font-size:clamp(1.1rem,1.4vw,1.3rem);
      line-height:1.55;
      text-wrap:balance;
    }

    .graffiti-title{
      perspective:1100px;
    }

    .hero-copy.visible .graffiti-title .title-line{
      backface-visibility:hidden;
      transform-origin:center bottom;
      animation:heroTitleSpinIn .95s cubic-bezier(.18,.9,.28,1.18) both;
    }

    .hero-copy.visible .graffiti-title .title-line:nth-child(1){animation-delay:.08s}
    .hero-copy.visible .graffiti-title .title-line:nth-child(2){animation-delay:.3s}

    @keyframes heroTitleSpinIn{
      0%{opacity:0;filter:blur(5px);transform:translate3d(0,70px,0) rotateX(-88deg) rotateZ(-9deg) scale(.72)}
      58%{opacity:1;filter:blur(0);transform:translate3d(0,-8px,0) rotateX(12deg) rotateZ(2deg) scale(1.045)}
      78%{transform:translate3d(0,3px,0) rotateX(-5deg) rotateZ(-.7deg) scale(.985)}
      100%{opacity:1;filter:none;transform:translate3d(0,0,0) rotateX(0) rotateZ(0) scale(1)}
    }

    @media (max-width:760px){
      .hero-wrap.hero-centered .hero-copy>p{
        width:min(100%,34rem)!important;
        font-size:1rem;
        line-height:1.6;
      }
    }

    /* Gato fachero: personaje animado que acompaña el título principal. */
    .hero-title-scene{
      position:relative;
      width:fit-content;
      max-width:100%;
      margin-inline:auto;
      isolation:isolate;
    }

    .hero-title-scene .graffiti-title{
      position:relative;
      z-index:2;
      margin-inline:auto;
    }

    .hero-fachero{
      position:absolute;
      right:clamp(-150px,-10vw,-96px);
      bottom:clamp(-12px,0vw,4px);
      z-index:3;
      width:clamp(190px,18vw,292px);
      margin:0;
      pointer-events:none;
      opacity:0;
    }

    .hero-copy.visible .hero-fachero{
      animation:heroFacheroEntrance 1.05s cubic-bezier(.16,1.2,.3,1) .72s both;
    }

    .hero-fachero img{
      width:100%;
      height:auto;
      display:block;
      filter:drop-shadow(0 18px 24px rgba(0,0,0,.34));
      transform-origin:55% 82%;
      animation:heroFacheroPose 3.4s ease-in-out 1.8s infinite;
    }

    @keyframes heroFacheroEntrance{
      0%{opacity:0;transform:translate3d(180px,44px,0) rotate(18deg) scale(.52)}
      62%{opacity:1;transform:translate3d(-12px,-8px,0) rotate(-5deg) scale(1.07)}
      82%{transform:translate3d(5px,3px,0) rotate(2deg) scale(.97)}
      100%{opacity:1;transform:translate3d(0,0,0) rotate(-1deg) scale(1)}
    }

    @keyframes heroFacheroPose{
      0%,100%{transform:translate3d(0,0,0) rotate(-1deg)}
      50%{transform:translate3d(0,-9px,0) rotate(1.5deg)}
    }

    @media (max-width:1100px){
      .hero-fachero{
        right:-112px;
        bottom:-4px;
        width:clamp(170px,20vw,230px);
      }
    }

    @media (max-width:760px){
      .hero-title-scene{padding-bottom:0}
      .hero-fachero{
        display:none;
      }
    }

    @media (max-width:380px){
      .hero-title-scene{padding-bottom:0}
    }

    @media (prefers-reduced-motion:reduce){
      .hero-copy.visible .hero-fachero{animation-duration:1.6s}
      .hero-fachero img{animation-duration:6s}
    }

    /* Sello giratorio de marca en la esquina del hero. */
    .hero-seal{
      position:absolute;
      top:clamp(-92px,-6vw,-62px);
      left:clamp(-94px,-6vw,-68px);
      z-index:3;
      width:clamp(112px,10vw,158px);
      aspect-ratio:1;
      margin:0;
      pointer-events:none;
      opacity:0;
      animation:heroSealStamp .72s cubic-bezier(.18,1.35,.32,1) .28s both;
    }

    .hero-seal img{
      width:100%;
      height:100%;
      display:block;
      object-fit:contain;
      filter:drop-shadow(0 12px 18px rgba(0,0,0,.28));
      animation:heroSealRotate 14s linear 1s infinite;
    }

    @keyframes heroSealStamp{
      0%{opacity:0;transform:scale(1.7) rotate(-18deg)}
      58%{opacity:1;transform:scale(.88) rotate(5deg)}
      78%{transform:scale(1.06) rotate(-2deg)}
      100%{opacity:1;transform:scale(1) rotate(0)}
    }

    @keyframes heroSealRotate{
      from{transform:rotate(0)}
      to{transform:rotate(360deg)}
    }

    @media (max-width:760px){
      .hero-seal{
        display:none;
      }
    }

    @media (prefers-reduced-motion:reduce){
      .hero-seal{animation-duration:1.2s}
      .hero-seal img{animation-duration:24s}
    }

    /* Composicion tipografica y urbana del footer. */
    .footer-location{
      position:relative;
      min-height:100svh;
      display:grid;
      place-items:center;
      overflow:hidden;
      isolation:isolate;
      background:transparent;
      border-bottom:1px solid rgba(245,242,238,.1);
    }

    .footer-location::before{
      content:"";
      position:absolute;
      inset:0;
      z-index:-1;
      background:
        radial-gradient(circle at 50% 58%,rgba(235,91,48,.1),transparent 34%),
        linear-gradient(180deg,transparent 0%,transparent 58%,rgba(3,16,16,.5) 100%);
    }

    .footer-location::after{
      content:"";
      position:absolute;
      left:0;
      right:0;
      bottom:0;
      z-index:3;
      height:34%;
      pointer-events:none;
      background:linear-gradient(
        to top,
        #080707 0%,
        #080707 12%,
        rgba(8,7,7,.94) 30%,
        rgba(8,7,7,.62) 57%,
        rgba(8,7,7,0) 100%
      );
    }

    .footer-year{
      position:absolute;
      inset:50% auto auto 50%;
      z-index:0;
      translate:-50% -50%;
      color:transparent;
      -webkit-text-stroke:1px rgba(245,242,238,.24);
      font-family:var(--font-title);
      font-size:clamp(14rem,36vw,35rem);
      font-weight:var(--weight-title);
      line-height:.72;
      letter-spacing:-.065em;
      white-space:nowrap;
      user-select:none;
    }

    .footer-place{
      position:relative;
      z-index:2;
      display:flex;
      flex-direction:column;
      align-items:center;
      color:var(--light);
      font-family:var(--font-title);
      font-size:clamp(5rem,11.5vw,11rem);
      font-weight:var(--weight-title);
      line-height:.76;
      letter-spacing:-.01em;
      text-transform:uppercase;
      filter:drop-shadow(0 14px 8px rgba(0,0,0,.48));
    }

    .footer-place-line{
      display:flex;
      justify-content:center;
      gap:.012em;
      white-space:nowrap;
    }

    .footer-place-caba{font-size:1.12em}

    .footer-congress{
      position:absolute;
      left:50%;
      bottom:0;
      width:105vw;
      max-width:none;
      height:100%;
      object-fit:fill;
      object-position:center bottom;
      translate:-50% 0;
      pointer-events:none;
      user-select:none;
      filter:brightness(.68) saturate(.72) contrast(.94);
      -webkit-mask-image:linear-gradient(to top,transparent 0%,rgba(0,0,0,.12) 7%,#000 24%,#000 100%);
      mask-image:linear-gradient(to top,transparent 0%,rgba(0,0,0,.12) 7%,#000 24%,#000 100%);
    }

    .footer-congress-back{
      z-index:1;
      opacity:1;
    }

    .footer-letter{
      display:inline-block;
      transition:color .18s ease,transform .22s cubic-bezier(.2,.9,.25,1.35),text-shadow .22s ease;
    }

    .footer-letter:hover{
      color:var(--primary);
      transform:translateY(-.055em) scale(1.035);
      text-shadow:0 .055em 0 rgba(3,16,16,.32);
    }

    .footer-comma{margin-left:-.025em}

    @media (max-width:760px){
      .footer-location{min-height:100svh}
      .footer-year{font-size:clamp(10rem,55vw,19rem)}
      .footer-congress{
        width:150vw;
        height:88%;
        bottom:3%;
        object-fit:contain;
      }
      .footer-place{
        font-size:clamp(3.2rem,15vw,6.5rem);
        letter-spacing:-.012em;
      }
    }

    @media (max-width:380px){
      .footer-place{font-size:2.85rem}
    }

    @media (prefers-reduced-motion:reduce){
      .footer-letter{transition:color .12s ease}
      .footer-letter:hover{transform:none}
    }

    /* El header es fijo: el hero debe comenzar debajo de él en cada viewport. */
    html{
      scroll-padding-top:calc(var(--header-h) + 16px);
    }

    .hero{
      min-height:100svh;
      padding-top:calc(var(--header-h) + 50px);
    }

    .hero-kicker{
      position:relative;
      z-index:4;
    }

    @media (max-width:900px){
      .hero{
        padding-top:calc(var(--header-h) + 38px);
      }
    }

    @media (max-width:760px){
      .hero{
        padding-top:calc(var(--header-h) + 30px);
      }
    }

    @media (max-width:480px){
      .hero{
        padding-top:calc(var(--header-h) + 24px);
      }
    }

    /* Hero y header en clave editorial ambar. */
    .site-header{
      background:linear-gradient(
        90deg,
        rgba(17,8,5,.92),
        rgba(72,31,10,.82) 48%,
        rgba(103,43,8,.76)
      );
      border-bottom-color:rgba(245,242,238,.16);
      box-shadow:0 12px 34px rgba(0,0,0,.2);
      backdrop-filter:blur(18px) saturate(1.25);
      -webkit-backdrop-filter:blur(18px) saturate(1.25);
    }

    .site-header .nav-links{
      letter-spacing:.08em;
    }

    .site-header .nav-links a{
      color:rgba(255,247,231,.88);
    }

    .site-header .nav-links a:hover{
      color:#ffb36a;
    }

    .hero{
      background:
        linear-gradient(180deg,rgba(9,4,2,.05) 0%,rgba(9,4,2,.16) 54%,var(--dark) 100%),
        radial-gradient(ellipse at 72% 22%,rgba(245,151,45,.7) 0%,rgba(204,90,17,.42) 28%,transparent 58%),
        radial-gradient(ellipse at 26% 45%,rgba(115,45,11,.5),transparent 52%),
        linear-gradient(110deg,#100704 0%,#3a1708 46%,#7f3108 74%,#1a0a05 100%);
    }

    .hero::before{
      background:
        linear-gradient(90deg,rgba(0,0,0,.56) 0%,rgba(0,0,0,.18) 42%,rgba(0,0,0,.08) 68%,rgba(0,0,0,.34) 100%),
        linear-gradient(180deg,transparent 58%,rgba(3,16,16,.92) 100%),
        radial-gradient(circle at 70% 28%,rgba(255,190,93,.18),transparent 25%);
    }

    .hero .graffiti-title .title-line{
      color:#fff4df;
    }

    .hero .hero-slogan{
      color:#ff8b43;
    }

    @media (max-width:760px){
      .site-header{
        background:linear-gradient(90deg,rgba(18,8,5,.96),rgba(92,37,9,.9));
      }

      .hero{
        background:
          linear-gradient(180deg,rgba(9,4,2,.06),rgba(3,16,16,.96) 100%),
          radial-gradient(circle at 68% 22%,rgba(239,128,33,.58),transparent 48%),
        linear-gradient(135deg,#160905,#5d2308 65%,#180a05);
      }
    }

    .site-header{
      position:fixed;
      inset:0 0 auto;
      width:100%;
      background:rgba(12,6,4,.14);
      border-bottom-color:rgba(255,247,231,.12);
      box-shadow:none;
      backdrop-filter:blur(10px) saturate(1.08);
      -webkit-backdrop-filter:blur(10px) saturate(1.08);
    }

    .hero-centered .hero-stats{
      width:min(100%,610px);
      gap:14px;
      margin-top:26px;
      padding-top:20px;
    }

    .hero-centered .hero-stats span{
      min-height:102px;
      padding:18px 14px 13px;
      border-radius:17px 14px 18px 14px;
    }

    .hero-centered .hero-stats b{
      font-size:clamp(2.15rem,4vw,3.65rem);
    }

    .hero-centered .hero-stats span::before{
      width:42px;
      height:15px;
      top:-7px;
    }

    @media (max-width:760px){
      .hero-centered .hero-stats{width:min(100%,470px);gap:8px}
      .hero-centered .hero-stats span{min-height:88px;padding:16px 7px 10px}
      .hero-centered .hero-stats b{font-size:clamp(1.8rem,9vw,2.7rem)}
    }

    /* Sobre mi: composicion mas libre dentro del sistema visual. */
    .about{
      background:
        linear-gradient(rgba(245,242,238,.025) 1px,transparent 1px),
        linear-gradient(90deg,rgba(245,242,238,.025) 1px,transparent 1px),
        radial-gradient(circle at 16% 28%,rgba(235,91,48,.22),transparent 27%),
        linear-gradient(145deg,#071513,#031010 68%,#1f0d06);
      background-size:42px 42px,42px 42px,auto,auto;
      color:var(--light);
      border-top:1px solid rgba(245,242,238,.12);
    }

    .about::before{
      content:"02";
      top:clamp(70px,8vw,116px);
      right:-.02em;
      color:transparent;
      -webkit-text-stroke:1px rgba(245,242,238,.07);
      font-size:clamp(14rem,32vw,34rem);
      transform:rotate(3deg);
    }

    .about-chapter-head{
      grid-template-columns:auto minmax(0,1fr);
      align-items:center;
      border-bottom-color:rgba(245,242,238,.13);
    }

    .about-chapter-head>span{
      align-self:center;
      padding:10px 14px;
      border:1px solid rgba(235,91,48,.42);
      border-radius:999px;
      background:rgba(235,91,48,.12);
      color:#ff8b43;
      transform:rotate(-4deg);
    }

    .about-chapter-head h2{
      color:var(--light);
      transform:rotate(-1deg);
      transform-origin:left center;
    }

    .about-chapter-head p{
      grid-column:2;
      max-width:620px;
      color:rgba(245,242,238,.66);
    }

    .about .about-wrap{
      grid-template-columns:minmax(280px,.72fr) minmax(0,1.38fr);
      align-items:start;
    }

    .about-photo-card{
      width:min(100%,370px);
      aspect-ratio:4/5;
      border:2px solid rgba(245,242,238,.82);
      border-radius:28px 72px 32px 58px;
      box-shadow:14px 16px 0 var(--primary),0 30px 70px rgba(0,0,0,.42);
      transform:rotate(-4deg);
      animation:aboutPortraitDrift 5s ease-in-out infinite;
      transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease;
    }

    .about-photo-card:hover{
      transform:rotate(1deg) translateY(-8px);
      box-shadow:7px 9px 0 var(--primary),0 36px 76px rgba(0,0,0,.46);
    }

    @keyframes aboutPortraitDrift{
      0%,100%{translate:0 0}
      50%{translate:0 -8px}
    }

    .about .about-portrait h2{
      color:var(--light);
      transform:rotate(2deg);
      margin-top:10px;
    }

    .about .about-copy{
      padding:6px 0 0;
      border:0;
      border-radius:0;
      background:none;
      box-shadow:none;
      overflow:visible;
    }

    .about-copy > h2{
      color:var(--primary);
      text-shadow:5px 6px 0 rgba(245,242,238,.1);
      transform:rotate(-1deg);
      transform-origin:left center;
    }

    .about-copy > p{
      width:min(94%,760px);
      padding:20px 24px;
      border:1px solid rgba(245,242,238,.13);
      border-radius:22px 16px 26px 18px;
      background:rgba(245,242,238,.055);
      box-shadow:0 18px 38px rgba(0,0,0,.16);
    }

    .about-copy > p:nth-of-type(1){
      transform:rotate(.7deg);
    }

    .about-copy > p:nth-of-type(2){
      margin-left:auto;
      transform:rotate(-.8deg);
      background:rgba(235,91,48,.1);
      border-color:rgba(235,91,48,.24);
    }

    .about-section-block{
      padding:18px 0 4px;
      border-top:1px dashed rgba(245,242,238,.16);
    }

    .about-chip-list span{
      transition:transform .2s ease,background .2s ease,border-color .2s ease;
    }

    .about-chip-list span:hover{
      transform:translateY(-3px) rotate(-1deg);
      background:rgba(235,91,48,.16);
      border-color:rgba(235,91,48,.34);
    }

    @media (max-width:1100px){
      .about-chapter-head{grid-template-columns:auto minmax(0,1fr)}
      .about-chapter-head p{grid-column:2}
      .about .about-wrap{grid-template-columns:minmax(250px,.58fr) minmax(0,1fr)}
    }

    @media (max-width:760px){
      .about-chapter-head{grid-template-columns:1fr}
      .about-chapter-head p{grid-column:1}
      .about .about-wrap{grid-template-columns:1fr}
      .about-portrait{display:flex}
      .about-photo-card{width:min(82%,300px);transform:rotate(-2deg)}
      .about .about-copy{padding-top:20px}
      .about-copy > p,
      .about-copy > p:nth-of-type(2){width:100%;margin-left:0;transform:none}
    }

    @media (prefers-reduced-motion:reduce){
      .about-photo-card{animation:none}
    }