:root{
          --paper:#F5F6EE;
          --paper-dim:#EFF1E4;
          --ink:#2B513C;
          --ink-soft:#4B5A50;
          --blueprint:#BD5F28;
          --blueprint-dim:#6F8F5A;
          --ok:#1C4430;
          --warn:#A47F4E;
          --line: rgba(27,43,33,0.14);
          --mycelium:#6F8F5A;
          --mycelium-glow:#E7EEDD;
        }
        *{box-sizing:border-box;}
        html{scroll-behavior:smooth;}
        body{
          margin:0;
          background:var(--paper);
          color:var(--ink);
          font-family:'Inter', -apple-system, sans-serif;
          -webkit-font-smoothing:antialiased;
          position:relative;
        }
        #mycelium-bg{
          position:absolute;
          top:0; left:0;
          width:100%;
          z-index:0;
          pointer-events:none;
        }
        #mycelium-bg svg{ display:block; width:100%; height:100%; }
        body > *:not(#mycelium-bg){ position:relative; z-index:1; }
        #mycelium-bg .glow-dot{
          position:absolute;
          top:0; left:0;
          width:26px; height:26px;
          margin-left:-13px; margin-top:-13px;
          border-radius:50%;
          background:radial-gradient(circle, var(--mycelium-glow) 0%, var(--mycelium) 55%, transparent 75%);
          filter:blur(7px);
          opacity:0.85;
          will-change:transform;
        }
        @media (prefers-reduced-motion: reduce){
          *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
        }
        .mono{ font-family:'Fraunces', serif; }
        .label{
          font-family:'Fraunces', serif;
          text-transform:uppercase;
          letter-spacing:0.14em;
          font-size:0.68rem;
          color:var(--blueprint);
        }
        .display{
          font-family:'Fraunces', serif;
          font-weight:700;
          letter-spacing:-0.01em;
        }

        .miceli-welcome{
            --mw-bg:#fbf7ee; --mw-ink:#24302a; --mw-soft:#5d6b62; --mw-line:#ddd5c3; --mw-accent:#3f7a62;
            width:min(34rem,calc(100vw - 2rem)); padding:0; border:0; border-radius:20px;
            background:var(--mw-bg); color:var(--mw-ink); font:inherit;
            box-shadow:0 24px 70px rgba(0,0,0,.28);
        }
        @media (prefers-color-scheme:dark){
            .miceli-welcome{--mw-bg:#1f2923; --mw-ink:#eef0e6; --mw-soft:#b3bdb2; --mw-line:#33413a; --mw-accent:#8cc7aa}
        }
        .miceli-welcome::backdrop{background:rgba(16,22,18,.5); backdrop-filter:blur(2px)}
        .miceli-welcome[open]{animation:mw-in .35s ease-out}
        @keyframes mw-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
        @media (prefers-reduced-motion:reduce){.miceli-welcome[open]{animation:none}}
        body:has(.miceli-welcome[open]){overflow:hidden}

        .miceli-welcome__box{position:relative; padding:2rem 1.5rem 1.5rem}
        .miceli-welcome__close{
            position:absolute; top:.6rem; right:.6rem; width:2.5rem; height:2.5rem;
            border:0; border-radius:50%; background:transparent; color:var(--mw-soft);
            font-size:1.6rem; line-height:1; cursor:pointer;
        }
        .miceli-welcome__close:hover{background:var(--mw-line)}
        .miceli-welcome__title{margin:0 2rem .5rem 0; font-size:1.5rem; line-height:1.2}
        .miceli-welcome__text{margin:0 0 1.25rem; color:var(--mw-soft); line-height:1.55}
        .miceli-welcome__options{display:grid; gap:.6rem; margin:0 0 1.25rem; padding:0; list-style:none}
        .miceli-welcome__options a{
            display:flex; align-items:center; justify-content:space-between; gap:1rem;
            padding:.9rem 1rem; border:1.5px solid var(--mw-line); border-radius:12px;
            color:inherit; text-decoration:none; font-weight:600;
            transition:border-color .2s, background .2s;
        }
        .miceli-welcome__options a:hover{border-color:var(--mw-accent); background:color-mix(in srgb,var(--mw-accent) 8%,transparent)}
        .miceli-welcome__options a span[aria-hidden]{color:var(--mw-accent)}
        .miceli-welcome__stay{
            display:block; margin:0 auto; padding:.5rem .75rem; border:0; background:none;
            color:var(--mw-soft); font:inherit; text-decoration:underline; cursor:pointer;
        }
        .miceli-welcome__stay:hover{color:var(--mw-ink)}
        .miceli-welcome :focus-visible{outline:3px solid var(--mw-accent); outline-offset:2px}

        .hero-text .miceli-pick{
          position:relative; z-index:2;            /* por encima del fondo #mycelium-bg */
          margin-top:2rem; padding:1.1rem 0 0;
          border-top:1px solid rgba(127,127,127,.25);
          background:none; display:block; max-width:34rem;
          margin-bottom:1rem;
        }
        .hero-text .miceli-pick__title{
          margin:0 0 .25rem; font-family:'Fraunces',Georgia,serif;
          font-size:1.05rem; font-weight:600; color:inherit;
        }
        .hero-text .miceli-pick__text{
          margin:0 0 .8rem; font-size:.9rem; opacity:.75; max-width:none;
        }
        .hero-text .miceli-pick__list{
          list-style:none; margin:0; padding:0;
          display:flex; flex-wrap:wrap; gap:.5rem;
        }
        .hero-text .miceli-pick__link{
          display:inline-block; padding:.45rem .9rem; border-radius:999px;
          border:1px solid var(--mycelium, #4f8a6b); color:inherit;
          font-size:.88rem; text-decoration:none;
          transition:background .2s, color .2s;
        }
        .hero-text .miceli-pick__link:hover,
        .hero-text .miceli-pick__link:focus-visible{
          background:var(--mycelium, #4f8a6b); color:#fff; outline:none;
        }
        .hero-text .miceli-pick__link:focus-visible{ box-shadow:0 0 0 3px rgba(79,138,107,.35); }
        @media (max-width:520px){
          .hero-text .miceli-pick__list{ flex-direction:column; }
          .hero-text .miceli-pick__link{ display:block; text-align:center; }
        }
        @media (prefers-reduced-motion:reduce){ .hero-text .miceli-pick__link{ transition:none; } }

        /* NAV */
        nav{
          position:sticky; top:0; z-index:50;
          display:flex; align-items:center; justify-content:space-between;
          padding:1.2rem clamp(2rem, 20vw, 26rem);
          background:rgba(241,239,231,0.92);
          backdrop-filter:blur(6px);
          border-bottom:1px solid var(--line);
        }
        nav .brand{ display:flex; align-items:center; gap:0.55rem; }
        nav .brand svg{ width:26px; height:auto; display:block; }
        nav .wordmark{ font-family:'Fraunces', serif; font-weight:700; font-size:1.05rem; }
        .status-pill{
          display:flex; align-items:center; gap:0.4rem;
          font-family:'Fraunces', serif;
          font-size:0.66rem;
          letter-spacing:0.04em;
          color:var(--ink-soft);
          border:1px solid var(--line);
          border-radius:999px;
          padding:0.3rem 0.65rem;
        }
        .status-pill .dot{
          width:7px; height:7px; border-radius:50%;
          background:var(--ok);
          box-shadow:0 0 0 3px rgba(28,68,48,0.18);
          animation:pulse 2.6s ease-in-out infinite;
        }
        @keyframes pulse{
          0%,100%{ box-shadow:0 0 0 3px rgba(28,68,48,0.18); }
          50%{ box-shadow:0 0 0 6px rgba(28,68,48,0.08); }
        }

        .lang-switch{
                  display:flex;
                  align-items:center;
                  gap:0.35rem;
                  font-family:'JetBrains Mono', monospace;
                  font-size:0.7rem;
                  letter-spacing:0.03em;
                }
                .lang-link{
                  color:var(--ink-soft);
                  text-decoration:none;
                  padding:0.25rem 0.4rem;
                  border-radius:4px;
                  transition:background 0.15s ease, color 0.15s ease;
                }
                .lang-link:hover{ background:var(--paper-dim); }
                .lang-link.active{
                  color:var(--ink);
                  font-weight:700;
                  background:var(--paper-dim);
                }
                nav{ flex-wrap:wrap; row-gap:0.5rem; }
                @media (max-width:420px){
                  .status-pill{ display:none; }
                }

        /* HERO */
        .hero{ padding:3.2rem 2rem 3rem; }
        .hero-grid{ display:block; }
        .hero-visual{ width:100%; max-width:180px; margin:2rem auto 0; opacity:0.95; }
        .hero-visual svg{ width:100%; height:auto; display:block; }
        .hero .label{ display:block; margin-bottom:0.9rem; }
        .hero h1{
          font-size:clamp(2.3rem, 10vw, 3.4rem);
          line-height:1.06;
          margin:0 0 1.1rem;
          font-family:'Fraunces', serif;
        }
        .hero h1 em, .hero h2 em{
          font-style:normal;
          color:var(--blueprint);
        }

        .hero p{
          color:var(--ink-soft);
          font-size:1.02rem;
          line-height:1.55;
          max-width:34ch;
          margin:0 0 1.8rem;
        }
        .cta-row{ display:flex; flex-wrap:wrap; gap:0.8rem; }
        .btn{
          font-family:'Inter', sans-serif;
          font-size:0.75rem;
          letter-spacing:0.04em;
          text-transform:uppercase;
          text-decoration:none;
          border-radius:8px;
          padding:0.8rem 1.2rem;
          display:inline-block;
        }
        .btn.primary{ background:var(--ink); color:var(--paper); }
        .btn.ghost{ background:none; border:1px solid var(--line); color:var(--ink); }

        /* SECTION SHELL */
        section{ padding:3.4rem 2rem; border-top:1px solid var(--line); max-width:1120px; margin-left:auto; margin-right:auto; }
        .section-head{ margin-bottom:1.8rem; }
        .section-head .label{ margin-bottom:0.5rem; }
        .section-head h2{ font-size:clamp(1.5rem, 6.5vw, 2rem); margin:0 0 0.7rem; }
        .section-head p{ color:var(--ink-soft); line-height:1.55; font-size:0.94rem; }
        .orange_text {color: var(--blueprint) !important; }

        /* DIAGNÓSTICO — collapsible panel */
        .diag-panel{
          max-height:0;
          overflow:hidden;
          transition:max-height 0.45s ease;
          margin-top:1.4rem;
        }
        .diag-panel.open{ max-height:640px; }
        .diag-grid{
          display:grid;
          grid-template-columns:1fr 1fr;
          border-top:1px solid var(--line);
          border-left:1px solid var(--line);
        }
        .diag-item{
          padding:0.85rem 1rem;
          border-right:1px solid var(--line);
          border-bottom:1px solid var(--line);
        }
        .diag-label{
          font-family:'Inter', sans-serif;
          font-size:0.6rem;
          letter-spacing:0.06em;
          text-transform:uppercase;
          color:var(--ink-soft);
          margin:0 0 0.25rem;
        }
        .diag-value{
          font-family:'Inter', sans-serif;
          font-size:0.86rem;
          color:var(--ink);
          margin:0;
          word-break:break-word;
        }

        /* BITÁCORA — signature element */
        .log{ position:relative; padding-left:1.1rem; }
        .log::before{
          content:"";
          position:absolute; left:0; top:6px; bottom:6px; width:1px;
          background:var(--line);
        }
        .entry{
          position:relative;
          padding:0 0 1.5rem 1.2rem;
          cursor:pointer;
        }
        .entry:last-child{ padding-bottom:0; }
        .entry::before{
          content:"";
          position:absolute; left:-1.1rem; top:6px;
          width:9px; height:9px; border-radius:50%;
          background:var(--paper);
          border:2px solid var(--blueprint);
        }
        .entry.type-fix::before{ border-color:var(--warn); }
        .entry.type-security::before{ border-color:var(--ok); }
        .entry-head{
          display:flex; align-items:baseline; gap:0.6rem; flex-wrap:wrap;
          margin-bottom:0.35rem;
        }
        .entry-head .ver{
          font-family:'Inter', sans-serif;
          font-weight:700;
          font-size:0.85rem;
        }
        .entry-head .date{
          font-family:'Inter', sans-serif;
          font-size:0.72rem;
          color:var(--ink-soft);
        }
        .entry h3{
          font-family:'Inter', sans-serif;
          font-weight:600;
          font-size:1.05rem;
          margin:0 0 0.3rem;
        }
        .entry .detail{
          color:var(--ink-soft);
          font-size:0.9rem;
          line-height:1.5;
          max-height:0;
          overflow:hidden;
          transition:max-height 0.4s ease;
        }
        .entry.open .detail{ max-height:200px; }
        .diff{
          font-family:'Inter', sans-serif;
          font-size:0.8rem;
          display:block;
          margin-top:0.5rem;
        }
        .diff.plus{ color:var(--ok); }
        .diff.minus{ color:var(--warn); }
        .log-hint{ margin-top:0.4rem; color:var(--ink-soft); font-size:0.78rem; opacity:0.8; }

        /* SERVICIOS — spec sheet rows */
        .spec-row{
          display:grid;
          grid-template-columns:2.4rem 1fr;
          gap:1rem;
          padding:1.2rem 0;
          border-top:1px solid var(--line);
        }
        .spec-row:last-child{ border-bottom:1px solid var(--line); }
        .spec-row .num{
          font-family:'Inter', sans-serif;
          color:var(--blueprint-dim);
          font-weight:700;
        }
        .spec-row h3{ font-family:'Inter', sans-serif; font-size:1.15rem; margin:0 0 0.3rem; }
        .spec-row p{ color:var(--ink-soft); font-size:0.9rem; line-height:1.5; margin:0; }

        /* MANIFESTO */
        .manifesto{ background:var(--ink-soft); color:var(--paper); max-width:none; margin-left:0; margin-right:0; }
        .manifesto blockquote{
          margin:0 auto;
          max-width:640px;
          font-family:'Inter', sans-serif;
          font-weight:600;
          font-size:clamp(1.4rem, 6.5vw, 2rem);
          line-height:1.35;
        }
        .manifesto cite{
          display:block; margin-top:1.2rem; font-style:normal;
          font-family:'Inter', sans-serif; font-size:0.7rem;
          letter-spacing:0.1em; text-transform:uppercase; color:var(--blueprint-dim);
        }

        /* CONTACTO */
        footer{ padding:4rem 7rem 1rem; max-width:1120px; margin-left:auto; margin-right:auto; }
        footer h2{ font-family:'Inter', sans-serif; font-size:1.6rem; margin:0 0 0.6rem; }
        footer p{ color:var(--ink-soft); font-size:0.92rem; margin:0 0 1.6rem; }
        .form{ display:grid; gap:0.8rem; }
        .form input, .form textarea{
          width:100%;
          background:#fff;
          border:1px solid var(--line);
          border-radius:8px;
          padding:0.75rem 0.9rem;
          font-family:'Inter', sans-serif;
          font-size:0.92rem;
          color:var(--ink);
        }
        .form textarea{ min-height:90px; resize:vertical; }
        .form button{
          justify-self:start;
          background:var(--ink); color:var(--paper);
          border:none; border-radius:8px;
          padding:0.8rem 1.3rem;
          font-family:'Inter', sans-serif;
          font-size:0.75rem; letter-spacing:0.05em; text-transform:uppercase;
          cursor:pointer;
        }
        .foot-note{
          margin-top:2rem;
          font-family:'Inter', sans-serif;
          font-size:0.72rem;
          color:var(--ink-soft);
        }

          #form-header{ margin-bottom: 1.5rem; }
          .field{ margin-bottom: 1rem; }
          .field label{
            display:block;
            font-family:'JetBrains Mono', monospace;
            font-size:0.68rem;
            letter-spacing:0.05em;
            text-transform:uppercase;
            color:var(--ink-soft);
            margin-bottom:0.35rem;
          }
          .field-input, .field-textarea{
            width:100%;
            background:#fff;
            border:1px solid var(--line);
            border-radius:8px;
            padding:0.75rem 0.9rem;
            font-family:'Work Sans', sans-serif;
            font-size:0.92rem;
            color:var(--ink);
          }
          .field-textarea{ min-height:90px; resize:vertical; }
          .field-error{
            display:none;
            margin-top:0.35rem;
            font-size:0.78rem;
            color:#a4432f;
          }
          .field.show-error .field-error{ display:block; }
          .field-input.has-error, .field-textarea.has-error{ border-color:#a4432f; }

          .field-hp{
            display:none;
            position:absolute;
            left:-9999px;
            width:1px;
            height:1px;
            overflow:hidden;
          }

          .form-error{
            background:#fbeceb;
            border:1px solid #e3b3ac;
            color:#8a2f22;
            padding:0.75rem 1rem;
            border-radius:8px;
            font-size:0.85rem;
            margin-bottom:1rem;
          }

          #submitBtn{ position:relative; }
          #submitBtn.loading{ color:transparent; pointer-events:none; }
          #submitBtn.loading::after{
            content:"";
            position:absolute; left:50%; top:50%;
            width:14px; height:14px;
            margin:-7px 0 0 -7px;
            border:2px solid rgba(255,255,255,0.4);
            border-top-color:#fff;
            border-radius:50%;
            animation:spin 0.6s linear infinite;
          }
          @keyframes spin{ to{ transform:rotate(360deg); } }

          .success-panel{
            display:none;
            background:var(--paper-dim);
            border:1px solid var(--line);
            border-radius:8px;
            padding:1.5rem;
            text-align:center;
          }
          .success-panel.visible{
            display:block;
            animation:success-glow 0.8s ease-in-out 3;
          }
          .success-panel h3{ font-family:'Roboto Slab', serif; margin:0 0 0.5rem; color:var(--ink); }
          .success-panel p{ margin:0; color:var(--ink-soft); font-size:0.92rem; }

          @keyframes success-glow{
            0%, 100%{
              border-color:var(--line);
              box-shadow:0 0 0 rgba(111,143,90,0);
            }

            50%{
              border-color:#6F8F5A;
              box-shadow:
                0 0 6px rgba(111,143,90,0.45),
                0 0 16px rgba(111,143,90,0.25);
            }
          }

        /* PÁGINAS MICELI — directory block */
        .miceli-pages{
          position:relative;
          overflow:hidden;
          max-width:none;
          margin-left:0;
          margin-right:0;
          background:rgba(226,229,216,0.88);
          border-top:1px solid rgba(27,43,33,0.16);
          border-bottom:1px solid rgba(27,43,33,0.12);
        }

        .miceli-pages::before{
          content:"";
          position:absolute;
          inset:0;
          background:linear-gradient(
            90deg,
            rgba(111,143,90,0.07),
            transparent 35%,
            rgba(189,95,40,0.035)
          );
          pointer-events:none;
        }

        .miceli-pages .section-head,
        .miceli-pages .miceli-pages-grid{
          position:relative;
          z-index:1;
        }

        .miceli-pages .section-head{
          max-width:1120px;
          margin-left:auto;
          margin-right:auto;
        }

        .miceli-pages-grid{
          display:grid;
          grid-template-columns:1fr;
          gap:0.85rem;
          max-width:1120px;
          margin:0 auto;
        }

        .miceli-page-card{
          display:flex;
          flex-direction:column;
          gap:0.45rem;
          min-height:180px;
          padding:1.25rem;
          border:1px solid rgba(27,43,33,0.13);
          border-radius:10px;
          background:rgba(245,246,238,0.68);
          color:var(--ink);
          text-decoration:none;
          transition:transform 0.2s ease, background 0.2s ease,
                      border-color 0.2s ease, box-shadow 0.2s ease;
        }

        .miceli-page-card:hover{
          transform:translateY(-2px);
          background:rgba(245,246,238,0.88);
          border-color:rgba(43,81,60,0.28);
          box-shadow:0 8px 24px rgba(43,81,60,0.07);
        }

        .miceli-page-card:focus-visible{
          outline:2px solid var(--blueprint);
          outline-offset:3px;
        }

        .miceli-page-card__type{
          font-family:'Fraunces', serif;
          text-transform:uppercase;
          letter-spacing:0.12em;
          font-size:0.62rem;
          color:var(--blueprint);
        }

        .miceli-page-card__title{
          font-family:'Inter', sans-serif;
          font-weight:600;
          font-size:1.05rem;
          line-height:1.3;
        }

        .miceli-page-card__description{
          color:var(--ink-soft);
          font-size:0.88rem;
          line-height:1.5;
          max-width:48ch;
        }

        .miceli-page-card__link{
          margin-top:auto;
          padding-top:0.65rem;
          font-family:'Inter', sans-serif;
          font-size:0.72rem;
          font-weight:600;
          letter-spacing:0.04em;
          text-transform:uppercase;
          color:var(--ink);
        }

          .mini-footer{
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:1rem;
            max-width:1120px;
            margin:0 auto;
            padding:1.4rem 2rem;
            border-top:1px solid var(--line);
          }
          .mini-footer-domain{
            font-family:'Fraunces', serif;
            font-size:1rem;
            letter-spacing:0.02em;
            color:var(--ink-soft);
          }
          .mini-footer-word{
            font-family:'Inter', sans-serif;
            font-weight:700;
            font-size:0.95rem;
            color:var(--ink);
          }


        @media (min-width:760px){
          .hero{ padding:5rem 2rem 4rem; }
          section{ padding:4.5rem 2rem; }
          .hero-grid{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:3rem; align-items:center; }
          .hero-visual{ max-width:260px; margin:0; justify-self:end; }
          .miceli-pages-grid{
                      grid-template-columns:1fr 1fr;
                      gap:1rem;
                    }

                    .miceli-page-card{
                      min-height:190px;
                      padding:1.4rem;
                    }
        }
        @media (max-width:560px){
          .hero{ padding-left:1.25rem; padding-right:1.25rem; }
          section{ padding-left:1.25rem; padding-right:1.25rem; }
          footer{ padding-left:1.25rem; padding-right:1.25rem; }
          nav{ padding-left:1.25rem; padding-right:1.25rem; }
          .mini-footer{ padding-left:1.25rem; padding-right:1.25rem; }
          .miceli-pages{
                      padding-left:1.25rem;
                      padding-right:1.25rem;
                    }

                    .miceli-pages .section-head,
                    .miceli-pages-grid{
                      max-width:none;
                    }
        }