@font-face{font-family:"Bebas Neue";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/bebas-neue-400.woff2") format("woff2")}
  @font-face{font-family:"DM Mono";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/dm-mono-400.woff2") format("woff2")}
  @font-face{font-family:"DM Mono";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/dm-mono-500.woff2") format("woff2")}
  @font-face{font-family:"DM Sans";font-style:normal;font-weight:300;font-display:swap;src:url("fonts/dm-sans-variable.woff2") format("woff2")}
  @font-face{font-family:"DM Sans";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/dm-sans-variable.woff2") format("woff2")}
  @font-face{font-family:"DM Sans";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/dm-sans-variable.woff2") format("woff2")}
  @font-face{font-family:"DM Sans";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/dm-sans-variable.woff2") format("woff2")}

  :root{
    --green:#7aab2a; --green-dark:#3B6D11; --green-light:#e8f5d0;
    --dark:#1a1a1a; --muted:#888; --border:#e0e0e0; --bg:#f7f7f5; --white:#ffffff;
    --r:16px;
    --mark:url("images/mark-bg.png");
  }
  *,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{font-family:"DM Sans",sans-serif;background:var(--bg);color:var(--dark);line-height:1.5;overflow-x:hidden;-webkit-font-smoothing:antialiased}
  ::selection{background:var(--green);color:#fff}
  a{color:inherit;text-decoration:none}
  img{display:block;max-width:100%}
  .wrap{max-width:1200px;margin:0 auto;padding:0 26px}

  .label{font-family:"DM Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:12px;margin-bottom:16px}
  .label::after{content:"";flex:1;height:1px;background:var(--border)}
  .label.solo{display:inline-flex}.label.solo::after{display:none}
  .label .gr{color:var(--green)}

  .btn{display:inline-flex;align-items:center;gap:9px;font-weight:500;font-size:.95rem;padding:14px 26px;border-radius:999px;transition:.22s cubic-bezier(.2,.8,.2,1);cursor:pointer;border:none}
  .btn-green{background:var(--green);color:#fff}
  .btn-green:hover{background:var(--green-dark);transform:translateY(-2px);box-shadow:0 14px 34px -12px rgba(122,171,42,.5)}
  .btn-out{background:transparent;border:1.5px solid var(--border);color:var(--dark)}
  .btn-out.light{color:#fff;border-color:rgba(255,255,255,.28)}
  .btn-out.light:hover{border-color:#fff}

  /* placeholder de imagen (se ve intencional aunque no haya foto) */
  .ph{position:relative;background:var(--green-light);overflow:hidden;border-radius:var(--r)}
  .ph::before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(45deg,rgba(59,109,17,.06) 0 2px,transparent 2px 24px)}
  .ph::after{content:"";position:absolute;top:50%;left:50%;width:34%;max-width:96px;aspect-ratio:1;transform:translate(-50%,-50%);background:var(--mark) center/contain no-repeat;opacity:.4}
  .ph .cap{position:absolute;bottom:12px;left:14px;z-index:2;font-family:"DM Mono",monospace;font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--green-dark)}
  .ph.dk{background:#232320}.ph.dk::before{background-image:repeating-linear-gradient(45deg,rgba(122,171,42,.10) 0 2px,transparent 2px 24px)}
  .ph.dk::after{opacity:.5}.ph.dk .cap{color:#9a9a9a}
  /* para foto real: <img class="shot"> reemplaza al .ph */
  .shot{width:100%;height:100%;object-fit:cover;border-radius:var(--r)}

  /* LOGO */
  .brand{display:flex;align-items:center;gap:10px}
  .brand .mk{width:30px;height:30px;flex:none;background:var(--mark) center/contain no-repeat}
  .brand .wm{font-family:"Bebas Neue";font-size:1.65rem;letter-spacing:.09em;line-height:1;color:var(--dark)}
  .brand .wm b{color:var(--green);font-weight:400}

  /* NAV */
  header.nav{position:fixed;top:0;left:0;right:0;z-index:80;transition:.3s;border-bottom:1px solid transparent}
  header.nav.scrolled{background:rgba(247,247,245,.82);backdrop-filter:blur(14px);border-bottom-color:var(--border)}
  .nav-inner{display:flex;align-items:center;justify-content:space-between;height:74px}
  .navlinks{display:flex;gap:30px;font-family:"DM Mono",monospace;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
  .navlinks a{position:relative;transition:.2s}
  .navlinks a:hover{color:var(--dark)}
  .navlinks a::after{content:"";position:absolute;left:0;bottom:-5px;width:0;height:1.5px;background:var(--green);transition:.25s}
  .navlinks a:hover::after{width:100%}
  .nav .btn{padding:10px 20px}
  @media(max-width:920px){.navlinks{display:none}}

  /* HERO (imagen protagonista) */
  .hero{position:relative;background:var(--dark);color:#fff;padding:132px 0 70px;overflow:hidden}
  .hero::before{content:"";position:absolute;top:-160px;right:-120px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(122,171,42,.35),transparent 68%);animation:drift 20s ease-in-out infinite}
  @keyframes drift{0%,100%{transform:translate(0,0)}50%{transform:translate(40px,40px)}}
  .grain{position:absolute;inset:0;opacity:.05;pointer-events:none;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
  .hero .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
  .hero .label{color:#9a9a9a}.hero .label::after{background:rgba(255,255,255,.16)}
  h1.hero-t{font-family:"Bebas Neue";font-weight:400;letter-spacing:.01em;line-height:.85;text-transform:uppercase;font-size:clamp(2.9rem,10vw,7rem)}
  h1.hero-t .line{display:block;overflow:hidden}
  h1.hero-t .in{display:block;transform:translateY(105%);animation:rise .85s cubic-bezier(.16,1,.3,1) forwards}
  h1.hero-t .line:nth-child(2) .in{animation-delay:.1s}
  h1.hero-t .line:nth-child(3) .in{animation-delay:.2s}
  @keyframes rise{to{transform:translateY(0)}}
  h1.hero-t .g{color:var(--green)}
  .hero p.sub{margin-top:26px;max-width:42ch;color:#c7c7c2;font-size:1.08rem}
  .hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
  .hero-img{aspect-ratio:1/1;width:100%;object-fit:contain;background:#fff;border-radius:16px;box-shadow:0 30px 70px -30px rgba(0,0,0,.7);animation:fade 1s .4s both}
  @keyframes fade{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
  @media(max-width:900px){.hero .wrap{grid-template-columns:1fr;gap:30px}.hero-img{aspect-ratio:16/10;max-height:340px}}
  .accent-bar{height:5px;background:linear-gradient(90deg,var(--green),var(--green-dark))}

  /* MARQUEE */
  .marquee{background:var(--green);padding:18px 0;overflow:hidden;position:relative}
  .mq-track{display:flex;width:max-content;animation:scroll 30s linear infinite}
  .marquee:hover .mq-track{animation-play-state:paused}
  @keyframes scroll{to{transform:translateX(-50%)}}
  .mq-item{font-family:"Bebas Neue";font-size:1.6rem;letter-spacing:.04em;text-transform:uppercase;color:#fff;display:flex;align-items:center;white-space:nowrap}
  .mq-item span{color:rgba(255,255,255,.6);margin:0 28px;font-size:.8rem}

  /* SECTION */
  section.blk{padding:96px 0;position:relative}
  .lead-head{display:flex;justify-content:space-between;align-items:flex-end;gap:34px;margin-bottom:44px;flex-wrap:wrap}
  .lead-head h2{font-family:"Bebas Neue";font-weight:400;letter-spacing:.01em;line-height:.9;text-transform:uppercase;font-size:clamp(2.6rem,6vw,4.6rem)}
  .lead-head h2 .g{color:var(--green)}
  .lead-head p{color:var(--muted);max-width:34ch;font-size:1rem}

  /* CARDS de línea (imagen protagonista) */
  .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
  .pcard{background:var(--white);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:.28s}
  .pcard:hover{border-color:var(--green);transform:translateY(-5px);box-shadow:0 20px 46px -24px rgba(26,26,26,.32)}
  .pcard .pic{aspect-ratio:4/5;border-radius:0}
  .pcard img.pic{width:100%;height:100%;object-fit:contain;background:#f2f2ef;display:block}
  .pcard.hi img.pic{background:#fff}
  .pcard .body{padding:24px 24px 26px}
  .pcard .kx{font-family:"DM Mono",monospace;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--green)}
  .pcard h3{font-family:"Bebas Neue";font-weight:400;letter-spacing:.02em;font-size:1.9rem;line-height:.98;text-transform:uppercase;margin:8px 0 8px}
  .pcard p{color:var(--muted);font-size:.94rem;margin-bottom:14px}
  .pcard .chips{display:flex;flex-wrap:wrap;gap:7px}
  .pcard .chips i{font-style:normal;font-family:"DM Mono",monospace;font-size:9px;letter-spacing:.04em;padding:4px 9px;border-radius:5px;background:var(--green-light);color:var(--green-dark)}
  .pcard.hi .kx{color:var(--green)}
  @media(max-width:860px){.cards{grid-template-columns:1fr}}

  /* GALLERY grande */
  .gal{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:200px;gap:16px}
  .gal .ph,.gal .shot{width:100%;height:100%}
  .gal .t-wide{grid-column:span 2}
  .gal .t-tall{grid-row:span 2}
  .gal .t-big{grid-column:span 2;grid-row:span 2}
  @media(max-width:860px){.gal{grid-template-columns:1fr 1fr;grid-auto-rows:160px}.gal .t-big{grid-column:span 2}}
  @media(max-width:520px){.gal{grid-template-columns:1fr;grid-auto-rows:200px}.gal .t-wide,.gal .t-big{grid-column:span 1}.gal .t-tall,.gal .t-big{grid-row:span 1}}

  /* CAPS compacto */
  .caps-list{border-top:1px solid var(--dark)}
  .caprow{display:grid;grid-template-columns:56px 1fr auto;gap:22px;align-items:center;padding:20px 6px;border-bottom:1px solid var(--border);transition:.25s}
  .caprow:hover{padding-left:18px;background:var(--white)}
  .caprow .cn{font-family:"DM Mono",monospace;font-size:.8rem;color:var(--muted)}
  .caprow h4{font-family:"Bebas Neue";font-weight:400;letter-spacing:.02em;font-size:clamp(1.5rem,3.2vw,2.3rem);text-transform:uppercase;transition:.25s;line-height:1}
  .caprow:hover h4{color:var(--green)}
  .caprow .d{color:var(--muted);font-size:.9rem;max-width:32ch;text-align:right}
  @media(max-width:680px){.caprow{grid-template-columns:40px 1fr}.caprow .d{display:none}}

  /* PROCESS */
  .proc{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
  .pstep{padding:26px;border:1px solid var(--border);border-radius:var(--r);background:var(--white);transition:.28s}
  .pstep:hover{border-color:var(--green);transform:translateY(-4px)}
  .pstep .pn{font-family:"Bebas Neue";font-weight:400;font-size:2.8rem;color:var(--green);line-height:1;margin-bottom:8px}
  .pstep h4{font-family:"Bebas Neue";font-weight:400;letter-spacing:.03em;font-size:1.35rem;text-transform:uppercase;margin-bottom:6px}
  .pstep p{color:var(--muted);font-size:.9rem}
  @media(max-width:760px){.proc{grid-template-columns:1fr 1fr}}

  /* stats confianza */
  .stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  .stat{background:var(--green-light);border-radius:var(--r);padding:30px}
  .stat .big{font-family:"Bebas Neue";font-weight:400;font-size:clamp(3rem,6vw,4.4rem);color:var(--green-dark);line-height:.9}
  .stat span{color:#5f7a3a;font-size:.9rem;display:block;margin-top:8px}
  @media(max-width:680px){.stats{grid-template-columns:1fr}}

  .rev{opacity:0;transform:translateY(28px);transition:.75s cubic-bezier(.16,1,.3,1)}
  .rev.on{opacity:1;transform:none}

  /* FINAL */
  .final{background:var(--dark);color:#fff;padding:112px 0;text-align:center;position:relative;overflow:hidden}
  .final::before{content:"";position:absolute;top:50%;left:50%;width:680px;height:680px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(122,171,42,.2),transparent 66%)}
  .final .wrap{position:relative;z-index:2}
  .final h2{font-family:"Bebas Neue";font-weight:400;letter-spacing:.01em;line-height:.86;text-transform:uppercase;font-size:clamp(3.2rem,10vw,7.5rem)}
  .final h2 .g{color:var(--green)}
  .final p{color:#c7c7c2;max-width:48ch;margin:20px auto 30px;font-size:1.08rem}
  .final .hero-cta{justify-content:center}

  /* FOOTER */
  footer{background:var(--dark);color:#fff;padding:38px 0 44px;border-top:1px solid rgba(255,255,255,.08)}
  .foot-word{font-family:"Bebas Neue";font-weight:400;letter-spacing:.02em;text-transform:uppercase;font-size:clamp(3rem,15vw,11rem);line-height:.8;color:transparent;-webkit-text-stroke:1px rgba(122,171,42,.4);margin-bottom:32px}
  .foot-grid{display:flex;justify-content:space-between;gap:22px;flex-wrap:wrap;color:#9a9a9a;font-family:"DM Mono",monospace;font-size:.8rem;letter-spacing:.03em}
  .foot-grid a:hover{color:var(--green)}

  .wa{position:fixed;right:22px;bottom:22px;z-index:90;width:58px;height:58px;border-radius:50%;background:var(--green);display:flex;align-items:center;justify-content:center;box-shadow:0 14px 32px -8px rgba(122,171,42,.6);transition:.25s}
  .wa:hover{transform:scale(1.1) rotate(-6deg);background:var(--green-dark)}
  .wa svg{width:29px;height:29px;fill:#fff}
  .pcard .pic{transition:transform .45s cubic-bezier(.2,.8,.2,1)}
  .pcard:hover .pic{transform:scale(1.04)}
  .gal .ph,.gal .shot{transition:transform .45s cubic-bezier(.2,.8,.2,1)}
  .gal .ph:hover,.gal .shot:hover{transform:scale(1.03)}
  .hero-img{transition:transform .3s ease-out}
  .rev{will-change:opacity,transform}
  .band{background:var(--dark);color:#fff;padding:88px 0;text-align:center;position:relative;overflow:hidden}
  .band::before{content:"";position:absolute;top:50%;left:50%;width:620px;height:620px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(122,171,42,.18),transparent 66%)}
  .band .wrap{position:relative;z-index:2}
  .band .eyebrow{font-family:"DM Mono",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--green);margin-bottom:14px}
  .band h2{font-family:"Bebas Neue";font-weight:400;letter-spacing:.01em;line-height:.9;text-transform:uppercase;font-size:clamp(2.6rem,7vw,5.4rem)}
  .band h2 .g{color:var(--green)}
  .band p{color:#c7c7c2;max-width:52ch;margin:18px auto 24px;font-size:1.08rem}
  .band .bchips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
  .band .bchips i{font-style:normal;font-family:"DM Mono",monospace;font-size:11px;letter-spacing:.05em;padding:7px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.22);color:var(--green-light)}
  @media(max-width:600px){
    .wrap{padding:0 18px}
    section.blk{padding:62px 0}
    .hero{padding:116px 0 54px}
    .band{padding:60px 0}
    .final{padding:76px 0}
    .lead-head{margin-bottom:30px}
    .hero-cta .btn{flex:1 1 auto;justify-content:center}
  }
  #intro{position:fixed;inset:0;z-index:100000;background:var(--dark);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;animation:introFade .7s ease 2s forwards}
  #intro .i-mark{width:90px;height:90px;background:var(--mark) center/contain no-repeat;opacity:0;animation:iMark .8s cubic-bezier(.16,1,.3,1) .12s forwards, iOut .9s cubic-bezier(.7,0,.3,1) 1.05s forwards}
  @keyframes iMark{from{opacity:0;transform:scale(.9);filter:blur(8px)}to{opacity:1;transform:scale(1);filter:blur(0)}}
  @keyframes iOut{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.18)}}
  @keyframes introFade{to{opacity:0}}
  @media(prefers-reduced-motion:reduce){#intro{display:none}}
  .prodgrid{display:grid;grid-template-columns:1.4fr 1fr;gap:16px}
  .prodgrid .shot{height:380px}
  @media(max-width:700px){.prodgrid{grid-template-columns:1fr}.prodgrid .shot{height:250px}}
  .hero-carousel{position:relative;overflow:hidden}
  .hero-carousel .hslide{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#fff;opacity:0;transition:opacity .9s ease}
  .hero-carousel .hslide.on{opacity:1}
  .hero-carousel .hdots{position:absolute;bottom:14px;left:0;right:0;display:flex;justify-content:center;gap:8px;z-index:3}
  .hero-carousel .hdots span{width:8px;height:8px;border-radius:50%;background:rgba(26,26,26,.28);transition:.3s;cursor:pointer}
  .hero-carousel .hdots span.on{background:var(--green);width:22px;border-radius:5px}
  .stands-feature{position:relative;aspect-ratio:16/8;background:#f2f2ef;border-radius:18px;overflow:hidden;box-shadow:0 26px 64px -34px rgba(26,26,26,.5)}
  .scarousel .cslide{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#f2f2ef;opacity:0;transition:opacity .9s ease}
  .scarousel .cslide.on{opacity:1}
  .scarousel .cdots{position:absolute;bottom:16px;left:0;right:0;display:flex;justify-content:center;gap:8px;z-index:3}
  .scarousel .cdots span{width:8px;height:8px;border-radius:50%;background:rgba(26,26,26,.3);transition:.3s;cursor:pointer}
  .scarousel .cdots span.on{background:var(--green);width:22px;border-radius:5px}
  @media(max-width:700px){.stands-feature{aspect-ratio:4/3}}
  .feat3d{display:grid;grid-template-columns:1fr .8fr;gap:36px;align-items:center;background:var(--white);border:1px solid var(--border);border-radius:18px;padding:34px}
  .feat3d-txt .label{margin-bottom:14px}
  .feat3d-txt h2{font-family:"Bebas Neue";font-weight:400;letter-spacing:.01em;line-height:.9;text-transform:uppercase;font-size:clamp(2rem,4.5vw,3.4rem);margin-bottom:12px}
  .feat3d-txt h2 .g{color:var(--green)}
  .feat3d-txt p{color:var(--muted);font-size:1rem;margin-bottom:14px;max-width:46ch}
  .feat3d-txt .chips{display:flex;flex-wrap:wrap;gap:7px}
  .feat3d-txt .chips i{font-style:normal;font-family:"DM Mono",monospace;font-size:9px;letter-spacing:.04em;padding:4px 9px;border-radius:5px;background:var(--green-light);color:var(--green-dark)}
  .feat3d-img{aspect-ratio:1/1;background:#f2f2ef;border-radius:14px;overflow:hidden}
  .feat3d-img img{width:100%;height:100%;object-fit:contain;display:block}
  @media(max-width:760px){.feat3d{grid-template-columns:1fr;padding:24px}}
  .brandwall{background:#fff;border:1px solid var(--border);border-radius:18px;padding:40px 48px}
  .brandgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px 24px;align-items:center}
  .brandgrid img{width:100%;height:64px;object-fit:contain;display:block}
  @media(max-width:640px){.brandgrid{grid-template-columns:repeat(2,1fr);gap:26px}.brandgrid img{height:58px}}
  @media(max-width:600px){.brandwall{padding:22px}}
  .pstep .pico{display:inline-flex;width:46px;height:46px;border-radius:12px;background:var(--green-light);align-items:center;justify-content:center;margin-bottom:14px}
  .pstep .pico svg{width:24px;height:24px;stroke:var(--green-dark);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .pstep .pn{font-size:1.5rem !important;color:var(--muted) !important;letter-spacing:.08em}
  .caso{background:var(--dark);color:#fff;padding:94px 0;position:relative;overflow:hidden}
  .caso::before{content:"";position:absolute;top:-140px;left:-120px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(122,171,42,.28),transparent 68%)}
  .caso-grid{position:relative;z-index:2;display:grid;grid-template-columns:1fr .66fr;gap:50px;align-items:center}
  .caso .label{color:#9a9a9a;margin-bottom:16px}
  .caso h2{font-family:"Bebas Neue";font-weight:400;letter-spacing:.01em;line-height:.9;text-transform:uppercase;font-size:clamp(2.4rem,5.5vw,4.4rem)}
  .caso h2 .g{color:var(--green)}
  .caso p{color:#c7c7c2;font-size:1.06rem;margin-top:16px;max-width:44ch}
  .caso-tag{margin-top:18px;font-family:"DM Mono",monospace;font-size:11px;letter-spacing:.06em;color:var(--green)}
  .caso-video{border-radius:18px;overflow:hidden;box-shadow:0 30px 70px -30px rgba(0,0,0,.7);background:#000;max-width:330px;margin-left:auto}
  .caso-video video{width:100%;display:block;aspect-ratio:380/574;object-fit:cover}
  @media(max-width:800px){.caso-grid{grid-template-columns:1fr;gap:28px}.caso-video{margin:0 auto}}