/* ============ TOKENS (derivados del logo CARADHRAS) ============ */
  :root{
    --grafito:#354046;      /* logo: montaña */
    --grafito-2:#2A333A;
    --grafito-deep:#1B2226; /* cuerpo oscuro */
    --acero:#608FA3;        /* logo: remolino de aire */
    --acero-600:#4E7E92;
    --acero-200:#8FB2C2;
    --niebla:#EDF1F2;
    --niebla-2:#F6F8F9;
    --linea:#DCE3E5;
    --blanco:#FFFFFF;
    --texto:#2A333A;
    --mute:#5C6A71;
    --mute-dark:#9FB0B8;
    --radius:4px;
    --maxw:1180px;
    --ease:cubic-bezier(.22,.61,.36,1);
    --header-h:clamp(70px,9vw,104px);
    /* roles tipográficos: display / cuerpo / datos — máx. 3 familias */
    --f-display:"Archivo",sans-serif;
    --f-body:"Inter",system-ui,sans-serif;
    --f-mono:"IBM Plex Mono",monospace;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    font-family:var(--f-body);color:var(--texto);background:var(--blanco);
    line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;
  }
  h1,h2,h3,h4{font-family:var(--f-display);line-height:1.05;letter-spacing:-.01em}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(18px,4vw,28px)}
  .eyebrow{
    font-family:var(--f-mono);font-size:clamp(.62rem,1.4vw,.72rem);
    letter-spacing:.22em;text-transform:uppercase;color:var(--acero-600);font-weight:500;
  }
  a{color:inherit;text-decoration:none}
  img{display:block;max-width:100%}
  section{position:relative}

  /* ============ HEADER (bookend blanco) ============ */
  header{
    position:fixed;top:0;left:0;right:0;z-index:100;
    background:#fff;border-bottom:1px solid var(--linea);
    box-shadow:0 1px 0 rgba(53,64,70,.03);
  }
  .nav{display:flex;align-items:center;justify-content:space-between;height:var(--header-h)}
  .nav .logo img{height:clamp(38px,6.5vw,80px);width:auto}
  .nav-links{display:flex;align-items:center;gap:clamp(18px,3vw,34px)}
  .nav-links a{
    font-size:clamp(.78rem,1.6vw,.84rem);font-weight:500;letter-spacing:.02em;
    color:var(--mute);transition:color .2s;
  }
  .nav-links a:hover{color:var(--acero-600)}
  .nav-cta{
    font-size:clamp(.78rem,1.6vw,.84rem);font-weight:600;
    padding:10px 18px;border-radius:var(--radius);
    background:var(--acero);color:#fff !important;transition:background .2s,transform .2s;
  }
  .nav-cta:hover{background:var(--acero-600);transform:translateY(-1px)}
  .burger{display:none;background:none;border:0;cursor:pointer;padding:8px}
  .burger span{display:block;width:24px;height:2px;background:var(--grafito);margin:5px 0;transition:.3s}

  /* ============ HERO ============ */
  .hero{
    background:var(--grafito-deep);color:#fff;
    padding:clamp(130px,19vw,190px) 0 clamp(70px,10vw,110px);
    position:relative;overflow:hidden;
  }
  .hero::before{
    content:"";position:absolute;inset:0;
    background:
      radial-gradient(120% 90% at 78% 20%, rgba(96,143,163,.20), transparent 55%),
      linear-gradient(160deg,#232C31 0%, #1B2226 60%, #161C20 100%);
  }
  .hero-airflow{position:absolute;right:-4%;top:0;height:100%;width:60%;pointer-events:none;opacity:.9}
  .hero-airflow path{
    fill:none;stroke:var(--acero);stroke-width:2;opacity:.5;stroke-linecap:round;
    stroke-dasharray:2600;stroke-dashoffset:2600;animation:draw 3.2s var(--ease) .3s forwards;
  }
  .hero-airflow path.l2{stroke:var(--acero-200);opacity:.32;animation-delay:.55s;stroke-width:1.4}
  .hero-airflow path.l3{stroke:#fff;opacity:.12;animation-delay:.8s;stroke-width:1}
  @keyframes draw{to{stroke-dashoffset:0}}
  .hero .wrap{position:relative;z-index:2}
  .hero .eyebrow{color:var(--acero-200)}
  .hero h1{
    font-size:clamp(2.6rem,9vw,6.4rem);font-weight:800;text-transform:uppercase;
    letter-spacing:-.02em;margin:clamp(14px,2.5vw,20px) 0 0;
  }
  .hero h1 .drop{display:block;color:var(--acero-200)}
  .hero .lead{
    font-size:clamp(1rem,2.2vw,1.32rem);color:#C9D5DA;max-width:640px;
    margin:clamp(18px,3vw,26px) 0 0;font-weight:400;
  }
  .hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:clamp(26px,4vw,38px)}
  .btn{
    font-family:var(--f-body);font-size:clamp(.86rem,1.8vw,.95rem);font-weight:600;
    padding:clamp(12px,2vw,15px) clamp(18px,3vw,26px);border-radius:var(--radius);
    cursor:pointer;border:1px solid transparent;transition:all .2s var(--ease);
    display:inline-flex;align-items:center;gap:9px;
  }
  .btn-primary{background:var(--acero);color:#fff}
  .btn-primary:hover{background:var(--acero-600);transform:translateY(-2px);box-shadow:0 10px 24px rgba(78,126,146,.35)}
  .btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.25)}
  .btn-ghost:hover{border-color:var(--acero-200);color:var(--acero-200)}
  .hero-brands{
    margin-top:clamp(36px,6vw,54px);padding-top:clamp(18px,3vw,26px);
    border-top:1px solid rgba(143,178,194,.16);
    display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  }
  .hero-brands .lbl{font-family:var(--f-mono);font-size:clamp(.58rem,1.3vw,.68rem);letter-spacing:.18em;text-transform:uppercase;color:var(--mute-dark)}
  .hero-brands .names{font-family:var(--f-display);font-weight:700;letter-spacing:.08em;color:#E6EDEF;font-size:clamp(.82rem,1.8vw,.95rem)}
  .hero-brands .names span{color:var(--acero-200);margin:0 6px}

  /* ============ BANDAS ============ */
  .band{padding:clamp(64px,10vw,104px) 0}
  .band.niebla{background:var(--niebla)}
  .sec-head{max-width:720px;margin-bottom:clamp(36px,6vw,56px)}
  .sec-head h2{
    font-size:clamp(1.7rem,4.5vw,2.9rem);font-weight:700;color:var(--grafito);margin:14px 0 0;
  }
  .sec-head p{color:var(--mute);font-size:clamp(.95rem,2vw,1.08rem);margin-top:16px}

  /* ============ TRES LÍNEAS ============ */
  .fuerzas{background:var(--grafito);color:#fff;padding:clamp(64px,10vw,104px) 0;position:relative;overflow:hidden}
  .fuerzas .sec-head h2{color:#fff}
  .fuerzas .sec-head p{color:#C4D0D5}
  .fuerzas .eyebrow{color:var(--acero-200)}
  .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,3vw,28px);position:relative;z-index:2}
  .fcard{
    background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.015));
    border:1px solid rgba(143,178,194,.16);border-radius:var(--radius);
    padding:clamp(24px,4vw,34px) clamp(20px,3.5vw,30px) clamp(28px,4.5vw,38px);
    transition:transform .3s var(--ease),border-color .3s,background .3s;
  }
  .fcard:hover{transform:translateY(-6px);border-color:var(--acero-200);background:rgba(96,143,163,.10)}
  .fcard .num{font-family:var(--f-mono);font-size:clamp(.62rem,1.4vw,.72rem);letter-spacing:.2em;color:var(--acero-200)}
  .fcard h3{font-size:clamp(1.5rem,3.5vw,2rem);font-weight:800;text-transform:uppercase;margin:18px 0 4px;color:#fff;letter-spacing:-.01em}
  .fcard .role{font-family:var(--f-mono);font-size:clamp(.66rem,1.5vw,.74rem);color:var(--mute-dark);letter-spacing:.04em;margin-bottom:16px}
  .fcard p{color:#C4D0D5;font-size:clamp(.88rem,1.9vw,.96rem)}
  .fcard ul{list-style:none;margin-top:18px;display:flex;flex-direction:column;gap:8px}
  .fcard li{font-size:clamp(.78rem,1.7vw,.86rem);color:#AEBEC5;padding-left:18px;position:relative}
  .fcard li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;border-radius:50%;background:var(--acero)}

  /* ============ QUÉ SUMINISTRAMOS ============ */
  .grid4{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--linea);border:1px solid var(--linea);border-radius:var(--radius);overflow:hidden}
  .scard{background:#fff;padding:clamp(26px,4.5vw,40px) clamp(22px,4vw,36px);transition:background .3s}
  .scard:hover{background:var(--niebla-2)}
  .scard .idx{font-family:var(--f-mono);font-size:clamp(.68rem,1.5vw,.78rem);color:var(--acero-600);letter-spacing:.12em}
  .scard h3{font-size:clamp(1.1rem,2.5vw,1.35rem);font-weight:700;color:var(--grafito);margin:14px 0 12px}
  .scard p{color:var(--mute);font-size:clamp(.88rem,1.9vw,.98rem)}

  /* ============ MARCAS ============ */
  .marcas-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,3vw,24px)}
  .mcard{
    border:1px solid var(--linea);border-radius:var(--radius);background:#fff;
    padding:clamp(24px,4vw,34px) clamp(20px,3.5vw,30px);display:flex;flex-direction:column;
    transition:box-shadow .3s,transform .3s;
  }
  .mcard:hover{box-shadow:0 14px 40px rgba(53,64,70,.10);transform:translateY(-4px)}
  .mcard .logo-box{height:86px;display:flex;align-items:center;margin-bottom:22px}
  .mcard .logo-box img{max-height:60px;width:auto;max-width:82%}
  .badge{
    display:inline-block;align-self:flex-start;font-family:var(--f-mono);
    font-size:clamp(.58rem,1.3vw,.66rem);letter-spacing:.12em;text-transform:uppercase;
    padding:5px 11px;border-radius:100px;margin-bottom:14px;
  }
  .badge.excl{background:var(--grafito);color:#fff}
  .badge.dist{background:var(--niebla);color:var(--acero-600);border:1px solid var(--linea)}
  .mcard h3{font-size:clamp(1rem,2.2vw,1.15rem);color:var(--grafito);margin-bottom:6px}
  .mcard p{color:var(--mute);font-size:clamp(.84rem,1.8vw,.92rem)}

  /* ============ CLIENTES / APLICACIONES ============ */
  .apps{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,60px);align-items:start}
  .app-row{display:flex;gap:18px;padding:clamp(14px,2.5vw,20px) 0;border-bottom:1px solid var(--linea)}
  .app-row:last-child{border-bottom:0}
  .app-row .k{font-family:var(--f-mono);font-size:clamp(.68rem,1.5vw,.78rem);color:var(--acero-600);min-width:34px}
  .app-row .t strong{display:block;color:var(--grafito);font-family:var(--f-display);font-weight:600;font-size:clamp(.94rem,2.1vw,1.05rem)}
  .app-row .t span{color:var(--mute);font-size:clamp(.8rem,1.8vw,.9rem)}
  .clientes{background:var(--niebla);border-radius:var(--radius);padding:clamp(26px,4.5vw,38px) clamp(22px,4vw,34px)}
  .clientes h4{font-size:clamp(.98rem,2.2vw,1.1rem);color:var(--grafito);margin-bottom:20px}
  .chips{display:flex;flex-wrap:wrap;gap:10px}
  .chip{font-size:clamp(.76rem,1.7vw,.84rem);background:#fff;border:1px solid var(--linea);color:var(--grafito);padding:8px 14px;border-radius:100px}

  /* ============ NOSOTROS ============ */
  .nosotros{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(36px,6vw,64px);align-items:center}
  .nosotros .mark{max-width:clamp(150px,24vw,230px);margin:0 auto;opacity:.95}
  .nosotros h2{font-size:clamp(1.7rem,4.5vw,2.7rem);color:var(--grafito);font-weight:700}
  .nosotros p{
    color:var(--mute);font-size:clamp(.95rem,2.1vw,1.05rem);margin-top:18px;
    text-align:justify;hyphens:auto;-webkit-hyphens:auto;
  }
  .diff{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,3vw,22px);margin-top:32px}
  .diff div{border-left:2px solid var(--acero);padding-left:16px}
  .diff strong{display:block;color:var(--grafito);font-family:var(--f-display);font-weight:600;font-size:clamp(.88rem,1.9vw,.98rem)}
  .diff span{font-size:clamp(.8rem,1.8vw,.88rem);color:var(--mute)}

  /* ============ CONTACTO ============ */
  .contacto{background:var(--grafito-deep);color:#fff;padding:clamp(64px,10vw,104px) 0}
  .contacto .eyebrow{color:var(--acero-200)}
  .contacto .cwrap{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(36px,6vw,64px);align-items:start}
  .contacto h2{font-size:clamp(1.7rem,4.5vw,2.8rem);color:#fff;font-weight:700;margin:14px 0 0}
  .contacto .lead{color:#C4D0D5;margin-top:18px;font-size:clamp(.95rem,2.1vw,1.05rem);max-width:420px}
  .cinfo{margin-top:clamp(26px,4.5vw,38px);display:flex;flex-direction:column;gap:clamp(14px,2.5vw,20px)}
  .cinfo .row{display:flex;gap:14px;align-items:baseline}
  .cinfo .row .lab{font-family:var(--f-mono);font-size:clamp(.58rem,1.3vw,.68rem);letter-spacing:.16em;text-transform:uppercase;color:var(--mute-dark);min-width:96px}
  .cinfo .row .val{color:#E6EDEF;font-size:clamp(.88rem,1.9vw,.98rem)}
  .cinfo .row .val.pend{color:var(--mute-dark);font-style:italic}
  .cinfo a.val:hover{color:var(--acero-200)}
  form{
    background:rgba(255,255,255,.04);border:1px solid rgba(143,178,194,.16);
    border-radius:var(--radius);padding:clamp(24px,4.5vw,34px) clamp(20px,4vw,32px);
  }
  .field{margin-bottom:18px}
  .field.two{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:0}
  .field.two .field{margin-bottom:18px}
  label{display:block;font-family:var(--f-mono);font-size:clamp(.58rem,1.3vw,.68rem);letter-spacing:.1em;text-transform:uppercase;color:var(--mute-dark);margin-bottom:7px}
  input,select,textarea{
    width:100%;background:rgba(255,255,255,.06);border:1px solid rgba(143,178,194,.22);
    border-radius:var(--radius);padding:12px 14px;color:#fff;font-family:var(--f-body);
    font-size:clamp(.88rem,1.9vw,.95rem);transition:border-color .2s,background .2s;
  }
  input::placeholder,textarea::placeholder{color:#7B8990}
  input:focus,select:focus,textarea:focus{outline:none;border-color:var(--acero-200);background:rgba(96,143,163,.12)}
  select option{background:var(--grafito-deep);color:#fff}
  textarea{resize:vertical;min-height:96px}
  .form-note{font-size:clamp(.7rem,1.6vw,.78rem);color:var(--mute-dark);margin-top:14px}
  .form-msg{display:none;border-radius:var(--radius);padding:14px 16px;font-size:clamp(.8rem,1.8vw,.9rem);margin-top:16px}
  .form-msg.ok{background:rgba(96,143,163,.16);border:1px solid var(--acero-200);color:#DCE9ED}
  .form-msg.err{background:rgba(180,80,80,.14);border:1px solid #C08A8A;color:#EDD6D6}
  .hidden-field{display:none}

  /* ============ FOOTER (bookend blanco) ============ */
  footer{background:#fff;border-top:1px solid var(--linea);color:var(--mute);padding:clamp(24px,4vw,34px) 0 clamp(14px,2.5vw,18px)}
  .fgrid{display:grid;grid-template-columns:1.5fr 1fr 1.2fr 1fr;gap:clamp(20px,3vw,32px);align-items:start}
  footer .mark{height:clamp(50px,8.2vw,104px);width:auto;margin-bottom:8px}
  footer .tag{font-family:var(--f-display);font-weight:700;letter-spacing:.05em;color:var(--grafito);font-size:clamp(.8rem,1.8vw,.9rem)}
  footer .fcol h5{font-family:var(--f-mono);font-size:clamp(.58rem,1.3vw,.68rem);letter-spacing:.16em;text-transform:uppercase;color:var(--acero-600);margin-bottom:8px}
  footer .fcol a,footer .fcol p{display:block;font-size:clamp(.8rem,1.8vw,.88rem);color:var(--mute);margin-bottom:4px;line-height:1.5}
  footer .fcol a:hover{color:var(--grafito)}
  .fbar{
    border-top:1px solid var(--linea);margin-top:clamp(16px,2.5vw,24px);padding-top:12px;
    display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;
    font-size:clamp(.68rem,1.5vw,.78rem);color:var(--mute-dark);
  }

  /* ============ PROYECTO DE REFERENCIA (sutil) ============ */
  .referencia{background:var(--grafito);color:#fff;padding:clamp(48px,7vw,74px) 0}
  .referencia .eyebrow{color:var(--acero-200)}
  .ref-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,56px);align-items:center}
  .referencia h3{font-family:var(--f-display);font-weight:700;font-size:clamp(1.4rem,3.4vw,2rem);color:#fff;margin:12px 0 0;letter-spacing:-.01em;line-height:1.1}
  .referencia .sub{color:#C4D0D5;font-size:clamp(.88rem,2vw,1rem);margin-top:14px;max-width:420px}
  .ref-list{display:flex;flex-direction:column}
  .ref-row{display:flex;align-items:center;gap:14px;padding:15px 0;border-bottom:1px solid rgba(143,178,194,.16)}
  .ref-row:last-child{border-bottom:0}
  .ref-row::before{content:"";flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:var(--acero)}
  .ref-row .what{color:#E6EDEF;font-size:clamp(.86rem,1.9vw,.96rem);font-weight:500}
  @media(max-width:900px){.ref-grid{grid-template-columns:1fr}}

  /* reveal */
  .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
  .reveal.in{opacity:1;transform:none}

  /* ============ RESPONSIVE ============ */
  @media(max-width:900px){
    .grid3,.marcas-grid{grid-template-columns:1fr}
    .grid4{grid-template-columns:1fr}
    .apps,.nosotros,.contacto .cwrap{grid-template-columns:1fr}
    .nav-links{
      position:fixed;top:var(--header-h);left:0;right:0;background:#fff;
      flex-direction:column;gap:0;padding:0;max-height:0;overflow:hidden;
      transition:max-height .35s var(--ease);border-bottom:1px solid var(--linea);
    }
    .nav-links.open{max-height:440px}
    .nav-links a{padding:16px 24px;width:100%;border-bottom:1px solid var(--niebla);color:var(--grafito)}
    .nav-links .nav-cta{margin:16px 24px;text-align:center;width:calc(100% - 48px);justify-content:center;display:flex}
    .burger{display:block}
  }
  @media(max-width:560px){
    .diff{grid-template-columns:1fr}
    .field.two{grid-template-columns:1fr}
  }
  @media(prefers-reduced-motion:reduce){
    *{animation:none !important;transition:none !important}
    .reveal{opacity:1;transform:none}
    .hero-airflow path{stroke-dashoffset:0}
  }

/* ============ MULTIPÁGINA: extras ============ */
/* estado activo del menú */
.nav-links a.active{color:var(--acero-600);font-weight:600}
.nav-links a.active:not(.nav-cta){position:relative}
.nav-links a.active:not(.nav-cta)::after{
  content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--acero);
}
@media(max-width:900px){.nav-links a.active:not(.nav-cta)::after{display:none}}

/* cabecera de página interior */
.page-head{background:var(--grafito-deep);color:#fff;padding:clamp(120px,17vw,180px) 0 clamp(46px,7vw,72px);position:relative;overflow:hidden}
.page-head::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(120% 90% at 82% 15%, rgba(96,143,163,.18), transparent 55%),
             linear-gradient(160deg,#232C31 0%,#1B2226 70%);
}
.page-head .wrap{position:relative;z-index:2}
.page-head .eyebrow{color:var(--acero-200)}
.page-head h1{font-size:clamp(2rem,6vw,3.5rem);font-weight:800;color:#fff;margin:14px 0 0;letter-spacing:-.02em}
.page-head p{color:#C4D0D5;font-size:clamp(.95rem,2.1vw,1.12rem);margin-top:16px;max-width:620px}

/* bloque de línea de producto (página Líneas) */
.linea{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(28px,5vw,60px);align-items:start;padding:clamp(38px,6vw,60px) 0;border-bottom:1px solid var(--linea)}
.linea:last-child{border-bottom:0}
.linea .lnum{font-family:var(--f-mono);font-size:clamp(.66rem,1.5vw,.74rem);letter-spacing:.2em;color:var(--acero-600)}
.linea h2{font-size:clamp(1.5rem,3.6vw,2.2rem);color:var(--grafito);font-weight:700;margin:10px 0 0}
.linea .marca{font-family:var(--f-mono);font-size:clamp(.68rem,1.5vw,.78rem);color:var(--mute);letter-spacing:.06em;margin-top:8px}
.linea .desc{color:var(--mute);font-size:clamp(.94rem,2vw,1.04rem);margin-top:14px}
.linea .items{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:6px;list-style:none}
.linea .items li{font-size:clamp(.86rem,1.9vw,.94rem);color:var(--grafito);padding:12px 14px;background:var(--niebla);border-radius:var(--radius);border-left:2px solid var(--acero)}
@media(max-width:900px){.linea{grid-template-columns:1fr}.linea .items{grid-template-columns:1fr}}

/* franja CTA de cierre */
.cta-band{background:var(--acero);color:#fff;padding:clamp(40px,6vw,62px) 0}
.cta-band .inner{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.cta-band h3{font-size:clamp(1.25rem,3vw,1.85rem);color:#fff;font-weight:700}
.cta-band p{color:#E4EEF2;font-size:clamp(.9rem,2vw,1rem);margin-top:8px}
.btn-white{background:#fff;color:var(--acero-600)}
.btn-white:hover{background:var(--niebla);transform:translateY(-2px)}

/* tarjeta de marca ampliada */
.marca-full{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(24px,4vw,48px);align-items:start;padding:clamp(32px,5vw,52px) 0;border-bottom:1px solid var(--linea)}
.marca-full:last-child{border-bottom:0}
.marca-full .brandbox{background:var(--niebla-2);border:1px solid var(--linea);border-radius:var(--radius);padding:clamp(22px,4vw,32px);display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.marca-full .brandbox img{max-height:58px;width:auto;max-width:100%}
.marca-full h2{font-size:clamp(1.4rem,3.4vw,2rem);color:var(--grafito);font-weight:700}
.marca-full .desc{color:var(--mute);font-size:clamp(.94rem,2vw,1.04rem);margin-top:12px}
.marca-full h4{font-family:var(--f-display);font-size:clamp(.9rem,2vw,1rem);color:var(--grafito);margin:22px 0 12px}
.tags{display:flex;flex-wrap:wrap;gap:9px}
.tags span{font-size:clamp(.78rem,1.7vw,.86rem);background:#fff;border:1px solid var(--linea);color:var(--grafito);padding:7px 13px;border-radius:100px}
@media(max-width:900px){.marca-full{grid-template-columns:1fr}}

/* proyecto destacado */
.proyecto{border:1px solid var(--linea);border-radius:var(--radius);padding:clamp(26px,4.5vw,40px);background:#fff}
.proyecto .ptit{font-family:var(--f-display);font-weight:700;font-size:clamp(1.3rem,3.2vw,1.9rem);color:var(--grafito)}
.proyecto .pmeta{font-family:var(--f-mono);font-size:clamp(.66rem,1.5vw,.74rem);letter-spacing:.14em;text-transform:uppercase;color:var(--acero-600);margin-bottom:10px}
.proyecto .plist{margin-top:22px;display:flex;flex-direction:column}
.proyecto .prow{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--linea)}
.proyecto .prow:last-child{border-bottom:0}
.proyecto .prow::before{content:"";flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:var(--acero)}
.proyecto .prow span{color:var(--grafito);font-size:clamp(.88rem,1.9vw,.98rem);font-weight:500}

/* ============ FOOTER responsive ordenado ============ */
@media(max-width:900px){
  .fgrid{grid-template-columns:1fr 1fr;gap:clamp(18px,3.5vw,26px);align-items:start}
}
@media(max-width:600px){
  .fgrid{grid-template-columns:1fr;gap:20px}
  footer .fcol h5{margin-bottom:10px}
}

/* ============ nota de otros proyectos (banda referencia) ============ */
.ref-nota{
  margin-top:clamp(20px,3.5vw,30px);padding-top:clamp(16px,2.5vw,22px);
  border-top:1px solid rgba(143,178,194,.16);
  color:var(--mute-dark);font-size:clamp(.82rem,1.8vw,.92rem);max-width:820px;
}

/* ============ marca tipográfica (sin logo de fábrica) ============ */
.brandname{
  font-family:var(--f-display);font-weight:800;color:var(--grafito);
  font-size:clamp(1.5rem,3.4vw,2rem);letter-spacing:-.01em;line-height:1.05;
  display:flex;flex-direction:column;gap:2px;
}
.brandname em{
  font-style:normal;font-family:var(--f-mono);font-weight:400;
  font-size:clamp(.6rem,1.4vw,.7rem);letter-spacing:.14em;text-transform:uppercase;
  color:var(--acero-600);
}