/* ============ ESTILOS COMPARTIDOS DISAE ============ */

/* Generado a partir de index.html, contacto.html y servicios-logisticos.html */


/* ---------- BASE + PAGINA PRINCIPAL ---------- */

:root{
    --primary:#f15a29;
    --primary-dark:#d64a1c;
    --secondary:#231f20;
    --lavender:#919bd9;
    --cream:#fbf0ed;
    --white:#ffffff;
    --ink-soft:#5a5451;
    --line:#e3d6d0;
  }

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

html{scroll-behavior:smooth;}

body{
    background:var(--cream);
    color:var(--secondary);
    font-family:'Inter',sans-serif;
    overflow-x:hidden;
  }

@media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important;}
  }

.eyebrow{
    font-family:'JetBrains Mono',monospace;
    font-size:12px;
    font-weight:600;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--primary);
  }

h1,h2,h3{
    font-family:'Big Shoulders Display',sans-serif;
    font-weight:800;
    text-transform:uppercase;
    line-height:0.95;
    letter-spacing:.01em;
  }

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

/* ---------- NAV ---------- */
  header{
    position:sticky;
    top:0;
    z-index:50;
    background:rgba(35,31,32,0.94);
    backdrop-filter:blur(6px);
    border-bottom:1px solid rgba(255,255,255,0.08);
  }

.nav-inner{
    max-width:1180px;
    margin:0 auto;
    padding:16px 32px;
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    gap:20px;
  }

.nav-home{
    justify-self:start;
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 16px;
    border:1px solid rgba(255,255,255,0.25);
    border-radius:2px;
    font-family:'JetBrains Mono',monospace;
    font-size:12px;
    font-weight:600;
    letter-spacing:.06em;
    text-transform:uppercase;
    color:rgba(255,255,255,0.8);
    transition:border-color .2s ease, color .2s ease, background .2s ease;
  }

.nav-home svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;}

.nav-home:hover{border-color:var(--primary); color:var(--white); background:rgba(241,90,41,0.1);}

.brand{
    justify-self:center;
    text-align:center;
    line-height:1.3;
  }

.brand-full{
    font-family:'Inter',sans-serif;
    font-size:10.5px;
    font-weight:500;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:rgba(255,255,255,0.55);
  }

.brand-short{
    font-family:'Big Shoulders Display',sans-serif;
    font-size:26px;
    font-weight:800;
    letter-spacing:.03em;
    color:var(--white);
  }

.brand-short span{color:var(--primary);}

.nav-right{
    justify-self:end;
    display:flex;
    align-items:center;
    gap:16px;
  }

.nav-cta{
    background:var(--primary);
    color:var(--white);
    padding:10px 20px;
    border-radius:2px;
    font-size:13px;
    font-weight:600;
    letter-spacing:.02em;
    white-space:nowrap;
    transition:background .2s ease, transform .2s ease;
  }

.nav-cta:hover{background:var(--primary-dark); transform:translateY(-1px);}

.nav-link{
    font-family:'JetBrains Mono',monospace;
    font-size:12px;
    font-weight:600;
    letter-spacing:.06em;
    text-transform:uppercase;
    color:rgba(255,255,255,0.65);
    white-space:nowrap;
    transition:color .2s ease;
  }

.nav-link:hover{color:var(--white);}

.logo-slot{
    height:44px;
    flex:0 0 auto;
    background:var(--white);
    border-radius:4px;
    padding:5px 10px;
    display:flex;
    align-items:center;
    justify-content:center;
  }

.logo-slot img{
    height:100%;
    width:auto;
    display:block;
  }

@media (max-width:760px){
    .nav-inner{grid-template-columns:1fr; justify-items:center; gap:14px; text-align:center;}
    .nav-home{justify-self:center;}
    .nav-right{justify-self:center;}
  }

/* ---------- AIR FREIGHT BANNER (full width, below header) ---------- */
  .air-hero{
    position:relative;
    width:100%;
    min-height:460px;
    background:
      linear-gradient(90deg, rgba(35,31,32,0.88) 0%, rgba(35,31,32,0.55) 45%, rgba(35,31,32,0.25) 100%),
      url('../img/banner-flete-aereo.jpg');
    background-size:cover;
    background-position:center;
    display:flex;
    align-items:flex-end;
    overflow:hidden;
  }

.air-hero-content{
    position:relative;
    z-index:2;
    max-width:1180px;
    margin:0 auto;
    width:100%;
    padding:0 32px 64px;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:24px;
    flex-wrap:wrap;
  }

.air-hero-text{max-width:760px;}

.air-hero-content .stop-code{
    font-family:'JetBrains Mono',monospace;
    font-size:12px;
    font-weight:600;
    letter-spacing:.12em;
    color:var(--lavender);
    display:block;
  }

.air-hero-content h1{
    font-size:clamp(42px,6.5vw,84px);
    color:var(--white);
    margin-top:14px;
    max-width:760px;
  }

.air-hero-content p{
    margin-top:18px;
    font-size:18px;
    line-height:1.6;
    color:rgba(255,255,255,0.78);
    max-width:520px;
  }

.air-hero-btn{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:var(--primary);
    color:var(--white);
    padding:16px 28px;
    font-family:'JetBrains Mono',monospace;
    font-size:13px;
    font-weight:600;
    letter-spacing:.06em;
    text-transform:uppercase;
    border-radius:2px;
    white-space:nowrap;
    transition:background .2s ease, transform .2s ease;
  }

.air-hero-btn:hover{background:var(--primary-dark); transform:translateY(-2px);}

.air-hero-btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;}

/* ---------- SECTION HEAD (shared) ---------- */
  .section-head{
    max-width:640px;
    margin:0 auto 56px;
    text-align:center;
  }

.section-head h2{
    font-size:clamp(32px,4.5vw,48px);
    margin-top:14px;
    color:var(--secondary);
  }

.section-head p{
    margin-top:16px;
    color:var(--ink-soft);
    font-size:16px;
    line-height:1.6;
  }

/* ---------- REFERENCE IMAGE PLACEHOLDER ---------- */
  .ref-image{
    aspect-ratio:4/3;
    border:1.5px dashed #c9b7b0;
    border-radius:4px;
    background:var(--white);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    color:#b7a89f;
    transition:border-color .25s ease, background .25s ease;
  }

.ref-image svg{width:34px;height:34px;stroke:#c9b7b0;fill:none;stroke-width:1.4;}

.ref-image span{
    font-family:'JetBrains Mono',monospace;
    font-size:10.5px;
    letter-spacing:.08em;
    text-transform:uppercase;
  }

/* ---------- SERVICES CARDS ---------- */
  .services-section{
    max-width:1180px;
    margin:0 auto;
    padding:120px 32px 110px;
  }

.cards-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:40px;
    align-items:stretch;
  }

.service-card{
    display:flex;
    flex-direction:column;
  }

@media (max-width:900px){
    .cards-grid{grid-template-columns:1fr; max-width:420px; margin:0 auto;}
  }

.service-card:nth-child(1) .ref-image{background:#fbf0ed;}

.service-card:nth-child(2) .ref-image{background:#f2f0fa;}

.service-card:nth-child(3) .ref-image{background:#fbf0ed;}

.service-card h3{
    margin-top:22px;
    font-size:22px;
    color:var(--primary);
    line-height:1.15;
  }

.card-text{
    margin-top:14px;
    font-size:14.5px;
    line-height:1.6;
    color:var(--ink-soft);
    text-align:justify;
    hyphens:auto;
  }

.cert-list{
    margin-top:10px;
    list-style:none;
    display:flex;
    flex-direction:column;
    gap:7px;
  }

.cert-list li{
    font-family:'JetBrains Mono',monospace;
    font-size:12px;
    letter-spacing:.01em;
    color:var(--secondary);
    display:flex;
    gap:8px;
  }

.cert-list li::before{
    content:"—";
    color:var(--primary);
    flex:0 0 auto;
  }

.card-copy{flex:1 1 auto;}

.card-btn{
    margin-top:18px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:var(--primary);
    color:var(--white);
    padding:11px 22px;
    font-family:'JetBrains Mono',monospace;
    font-size:12px;
    font-weight:600;
    letter-spacing:.06em;
    text-transform:uppercase;
    border-radius:2px;
    transition:background .2s ease, transform .2s ease;
  }

.card-btn:hover{background:var(--primary-dark); transform:translateY(-2px);}

/* ---------- WHY CHOOSE US ---------- */
  .why{
    background:var(--white);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    padding:110px 32px;
  }

.why-grid{
    max-width:1180px;
    margin:0 auto;
    display:grid;
    grid-template-columns:0.85fr 1.15fr;
    gap:64px;
    align-items:center;
  }

@media (max-width:860px){
    .why-grid{grid-template-columns:1fr; gap:40px;}
  }

.why-copy h2{
    font-size:clamp(30px,4vw,46px);
    margin-top:14px;
    color:var(--secondary);
  }

.why-copy p{
    margin-top:18px;
    font-size:16px;
    line-height:1.65;
    color:var(--ink-soft);
    max-width:400px;
  }

.why-list{
    list-style:none;
  }

.why-list li{
    display:flex;
    align-items:flex-start;
    gap:16px;
    padding:16px 0;
    border-bottom:1px dashed var(--line);
  }

.why-list li:last-child{border-bottom:none;}

.why-icon{
    width:42px;
    height:42px;
    border-radius:50%;
    background:var(--cream);
    border:1.5px solid var(--primary);
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
  }

.why-icon svg{width:19px;height:19px;stroke:var(--primary);fill:none;stroke-width:1.7;}

.why-list span{
    font-size:15.5px;
    font-weight:500;
    color:var(--secondary);
    padding-top:9px;
  }

/* reveal animation */
  .reveal{
    opacity:0;
    transform:translateY(24px);
    transition:opacity .7s ease, transform .7s ease;
  }

.reveal.is-visible{
    opacity:1;
    transform:translateY(0);
  }

/* ---------- QUOTE CTA ---------- */
  .quote{
    background:var(--primary);
    color:var(--white);
    padding:120px 32px;
    position:relative;
    overflow:hidden;
  }

.quote::after{
    content:"";
    position:absolute;
    inset:0;
    background-image:repeating-linear-gradient(-45deg, rgba(255,255,255,0.06) 0 2px, transparent 2px 26px);
    pointer-events:none;
  }

.quote-inner{
    max-width:760px;
    margin:0 auto;
    text-align:center;
    position:relative;
    z-index:2;
  }

.quote .eyebrow{color:var(--secondary);}

.quote h2{
    font-size:clamp(36px,5.5vw,64px);
    margin-top:16px;
    color:var(--white);
  }

.quote p{
    margin-top:24px;
    font-size:17px;
    line-height:1.65;
    color:rgba(255,255,255,0.92);
    max-width:600px;
    margin-left:auto;
    margin-right:auto;
  }

.quote-btn{
    margin-top:40px;
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:var(--secondary);
    color:var(--white);
    padding:18px 34px;
    font-family:'JetBrains Mono',monospace;
    font-size:13px;
    font-weight:600;
    letter-spacing:.08em;
    text-transform:uppercase;
    border-radius:2px;
    border:1px solid var(--secondary);
    cursor:pointer;
    transition:background .2s ease, color .2s ease, transform .2s ease;
  }

.quote-btn:hover{
    background:transparent;
    color:var(--secondary);
    transform:translateY(-2px);
  }

.quote-btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;}

/* ---------- FOOTER ---------- */
  footer{
    background:var(--secondary);
    color:rgba(255,255,255,0.55);
    padding:34px 32px;
    font-family:'JetBrains Mono',monospace;
    font-size:11.5px;
    letter-spacing:.05em;
  }

.footer-inner{
    max-width:1180px;
    margin:0 auto;
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:12px;
  }

.footer-inner span{color:var(--primary);}

/* ---------- WHATSAPP FLOATING BUTTON ---------- */
  .whatsapp-float{
    position:fixed;
    bottom:24px;
    right:24px;
    z-index:60;
    width:58px;
    height:58px;
    border-radius:50%;
    background:#25D366;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 6px 18px rgba(0,0,0,0.28);
    transition:transform .2s ease, box-shadow .2s ease;
  }

.whatsapp-float:hover{transform:translateY(-3px) scale(1.05); box-shadow:0 10px 24px rgba(0,0,0,0.32);}

.whatsapp-float svg{width:30px;height:30px;fill:var(--white);}



/* ---------- PAGINA CONTACTO ---------- */

/* ---------- HERO ---------- */
  .hero{
    position:relative;
    background:var(--secondary);
    color:var(--white);
    padding:100px 32px 110px;
    overflow:hidden;
  }

.hero::before{
    content:"";
    position:absolute;
    inset:0;
    background-image:
      linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
    background-size:64px 64px;
    mask-image:radial-gradient(ellipse at 70% 30%, black 0%, transparent 70%);
    pointer-events:none;
  }

.hero-inner{
    max-width:1180px;
    margin:0 auto;
    position:relative;
    z-index:2;
  }

.hero-inner h1{
    font-size:clamp(48px,7vw,96px);
    max-width:820px;
  }

.hero-route{
    position:absolute;
    right:-40px;
    top:0;
    bottom:0;
    width:520px;
    z-index:1;
    opacity:.9;
  }

@media (max-width:1000px){ .hero-route{display:none;} }

/* ---------- CONTACT SECTION ---------- */
  .contact{
    max-width:1180px;
    margin:0 auto;
    padding:100px 32px 130px;
  }

.contact-tag{
    display:flex;
    align-items:center;
    gap:14px;
    margin-bottom:56px;
  }

.contact-tag .node-dot{
    width:52px;
    height:52px;
    border-radius:50%;
    background:var(--secondary);
    border:3px solid var(--primary);
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
  }

.contact-tag .node-dot svg{width:22px;height:22px;stroke:var(--white);fill:none;stroke-width:1.6;}

.contact-tag .stop-code{
    font-family:'JetBrains Mono',monospace;
    font-size:12px;
    font-weight:600;
    letter-spacing:.12em;
    color:var(--primary);
    display:block;
  }

.contact-tag h2{
    font-size:clamp(30px,4vw,44px);
    color:var(--secondary);
    margin-top:4px;
  }

.contact-grid{
    display:grid;
    grid-template-columns:0.85fr 1.15fr;
    gap:56px;
    align-items:start;
  }

@media (max-width:900px){
    .contact-grid{grid-template-columns:1fr;}
  }

.info-item{
    display:flex;
    gap:16px;
    align-items:flex-start;
    padding:22px 0;
    border-bottom:1px solid var(--line);
  }

.info-item:first-child{padding-top:0;}

.info-icon{
    width:42px;
    height:42px;
    border-radius:50%;
    background:var(--white);
    border:1.5px solid var(--primary);
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
  }

.info-icon svg{width:19px;height:19px;stroke:var(--primary);fill:none;stroke-width:1.7;}

.info-label{
    font-family:'JetBrains Mono',monospace;
    font-size:10.5px;
    font-weight:600;
    letter-spacing:.1em;
    text-transform:uppercase;
    color:var(--ink-soft);
    opacity:.75;
  }

.info-value{
    margin-top:6px;
    font-size:16px;
    line-height:1.5;
    color:var(--secondary);
    font-weight:500;
  }

.info-value a{transition:color .2s ease;}

.info-value a:hover{color:var(--primary);}

.map-frame{
    margin-top:32px;
    border:1px solid var(--line);
    border-radius:4px;
    overflow:hidden;
    background:var(--white);
  }

.map-frame iframe{
    display:block;
    width:100%;
    height:320px;
    border:0;
  }

.map-caption{
    padding:12px 16px;
    font-family:'JetBrains Mono',monospace;
    font-size:10.5px;
    letter-spacing:.06em;
    text-transform:uppercase;
    color:var(--ink-soft);
    border-top:1px solid var(--line);
  }

.contact-form{
    background:var(--white);
    border:1px solid var(--line);
    border-radius:4px;
    padding:44px;
  }

.contact-form .eyebrow{margin-bottom:10px; display:block;}

.contact-form h3{
    font-size:clamp(24px,3vw,32px);
    color:var(--secondary);
    margin-bottom:30px;
  }

.form-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
    margin-bottom:20px;
  }

@media (max-width:520px){
    .form-row{grid-template-columns:1fr;}
  }

.field{
    display:flex;
    flex-direction:column;
    gap:8px;
  }

.field label{
    font-family:'JetBrains Mono',monospace;
    font-size:10.5px;
    font-weight:600;
    letter-spacing:.1em;
    text-transform:uppercase;
    color:var(--ink-soft);
  }

.field input{
    font-family:'Inter',sans-serif;
    font-size:15px;
    padding:13px 14px;
    border:1px solid var(--line);
    border-radius:2px;
    background:var(--cream);
    color:var(--secondary);
    transition:border-color .2s ease, background .2s ease;
  }

.field input:focus{
    outline:none;
    border-color:var(--primary);
    background:var(--white);
  }

.form-submit{
    margin-top:12px;
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:var(--primary);
    color:var(--white);
    padding:16px 30px;
    font-family:'JetBrains Mono',monospace;
    font-size:13px;
    font-weight:600;
    letter-spacing:.08em;
    text-transform:uppercase;
    border:none;
    border-radius:2px;
    cursor:pointer;
    transition:background .2s ease, transform .2s ease;
  }

.form-submit:hover{background:var(--primary-dark); transform:translateY(-2px);}

.form-submit svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;}

.form-note{
    margin-top:16px;
    font-size:12.5px;
    color:var(--ink-soft);
    opacity:.8;
  }

.form-honeypot{
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}

.form-status{
  display:none;
  margin-bottom:20px;
  padding:12px 16px;
  border-radius:2px;
  font-size:14px;
  line-height:1.5;
}
.form-status--ok{background:#e8f5e9; color:#2e7d32; border:1px solid #a5d6a7;}
.form-status--error{background:#fdecea; color:#c62828; border:1px solid #f3b0ab;}
.contact-form.form-sent .form-status--ok{display:block;}
.contact-form.form-failed .form-status--error{display:block;}



/* ---------- PAGINA SERVICIOS LOGISTICOS ---------- */

.hero-inner--simple h1{
    margin-top:0;
  }

.hero .eyebrow{color:var(--lavender);}

.hero h1{
    font-size:clamp(48px,7vw,96px);
    margin-top:18px;
    max-width:820px;
  }

.hero h1 em{
    font-style:normal;
    color:var(--primary);
  }

.hero p{
    margin-top:26px;
    max-width:520px;
    font-size:17px;
    line-height:1.6;
    color:rgba(255,255,255,0.72);
  }

.hero-manifest{
    margin-top:56px;
    display:flex;
    flex-wrap:wrap;
    gap:0;
    border-top:1px solid rgba(255,255,255,0.15);
    max-width:820px;
  }

.hero-manifest div{
    flex:1 1 150px;
    padding:16px 22px 0 0;
    border-right:1px solid rgba(255,255,255,0.15);
  }

.hero-manifest div:last-child{border-right:none;}

.hero-manifest .hm-label{
    font-family:'JetBrains Mono',monospace;
    font-size:10px;
    letter-spacing:.1em;
    text-transform:uppercase;
    color:rgba(255,255,255,0.45);
  }

.hero-manifest .hm-value{
    font-family:'Big Shoulders Display',sans-serif;
    font-size:26px;
    font-weight:700;
    margin-top:4px;
  }

/* route dashed line decoration in hero */
  .hero-route{
    position:absolute;
    right:-40px;
    top:0;
    bottom:0;
    width:520px;
    z-index:1;
    opacity:.9;
  }

/* ---------- SERVICES SECTION ---------- */
  .services{
    max-width:1180px;
    margin:0 auto;
    padding:110px 32px 60px;
    position:relative;
  }

.services-head{
    max-width:640px;
    margin-bottom:80px;
  }

.services-head h2{
    font-size:clamp(34px,4.5vw,52px);
    margin-top:14px;
    color:var(--secondary);
  }

.services-head p{
    margin-top:16px;
    color:var(--ink-soft);
    font-size:16px;
    line-height:1.6;
  }

.route{
    position:relative;
  }

.route::before{
    content:"";
    position:absolute;
    left:29px;
    top:14px;
    bottom:14px;
    width:0;
    border-left:2px dashed var(--primary);
    opacity:.55;
  }

@media (max-width:720px){
    .route::before{left:23px;}
  }

.stop{
    position:relative;
    display:grid;
    grid-template-columns:64px 1fr;
    gap:0 36px;
    padding-bottom:96px;
  }

.stop:last-child{padding-bottom:0;}

.node{
    position:relative;
    z-index:2;
  }

.node-dot{
    width:60px;
    height:60px;
    border-radius:50%;
    background:var(--secondary);
    border:3px solid var(--primary);
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--white);
  }

.node-dot svg{width:26px;height:26px;stroke:var(--white);fill:none;stroke-width:1.6;}

@media (max-width:720px){
    .stop{grid-template-columns:48px 1fr;}
    .node-dot{width:48px;height:48px;}
    .node-dot svg{width:20px;height:20px;}
  }

.stop-body{
    display:grid;
    grid-template-columns:1.1fr 0.9fr;
    gap:40px;
    align-items:center;
  }

@media (max-width:860px){
    .stop-body{grid-template-columns:1fr; gap:24px;}
  }

.stop-code{
    font-family:'JetBrains Mono',monospace;
    font-size:12px;
    font-weight:600;
    letter-spacing:.12em;
    color:var(--primary);
    display:block;
    margin-bottom:10px;
  }

.stop-title{
    font-size:clamp(24px,3vw,34px);
    color:var(--secondary);
  }

.stop-text{
    margin-top:16px;
    font-size:15.5px;
    line-height:1.65;
    color:var(--ink-soft);
    max-width:480px;
  }

.ref-image{
    aspect-ratio:4/3;
    border:1.5px dashed #c9b7b0;
    border-radius:4px;
    background:var(--white);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    color:#b7a89f;
    transition:border-color .25s ease, background .25s ease;
  }

.ref-image--photo{
  border:none;
  padding:0;
  overflow:hidden;
}
.ref-image--photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:4px;
}

.stop:nth-child(1) .ref-image{background:#fbf0ed;}

.stop:nth-child(2) .ref-image{background:#f2f0fa;}

.stop:nth-child(3) .ref-image{background:#fbf0ed;}

.stop:nth-child(4) .ref-image{background:#f2f0fa;}