/* ===== JOTA SOLUTIONS shared.css v3 — Tailwind-first ===== */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;1,9..40,300&family=DM+Mono:wght@400;500&display=swap');

:root {
  --teal:#1b6b5d;--teal-light:#237a6b;--teal-dark:#14534a;
  --teal-pale:#e8f4f2;--teal-mid:#b8d9d3;
  --ink:#111714;--ink-mid:#2d3a35;--ink-soft:#4a5e57;
  --muted:#7a9288;--border:#d8e8e4;--border-dark:#a8ccc5;
  --surface:#f4faf8;--surface2:#eaf5f2;--white:#ffffff;
  --font-display:'Outfit',sans-serif;--font-body:'DM Sans',sans-serif;--font-mono:'DM Mono',monospace;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;scroll-padding-top:84px;}
body{font-family:'DM Sans',sans-serif;background:#fff;color:#111714;overflow-x:hidden;-webkit-font-smoothing:antialiased;}

/* Reveal animation */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease;}
.reveal.visible{opacity:1;transform:none;}
.delay-1{transition-delay:.1s;}.delay-2{transition-delay:.2s;}.delay-3{transition-delay:.3s;}.delay-4{transition-delay:.4s;}.delay-5{transition-delay:.5s;}

/* Pulse dot */
@keyframes pdot{0%,100%{box-shadow:0 0 0 0 rgba(27,107,93,.4);}50%{box-shadow:0 0 0 7px rgba(27,107,93,0);}}
.pulse-dot{width:9px;height:9px;background:#1b6b5d;border-radius:50%;animation:pdot 2s ease infinite;flex-shrink:0;}

/* Navbar scroll */
.js-navbar{transition:background .35s,border-color .35s,box-shadow .35s;border-bottom:1px solid transparent;}
.js-navbar.scrolled{background:rgba(255,255,255,.96);backdrop-filter:blur(14px);border-bottom-color:#d8e8e4;box-shadow:0 2px 20px rgba(27,107,93,.08);}

/* Nav dropdown */
.nav-dropdown{background:#fff;border:1px solid #d8e8e4;box-shadow:0 16px 48px rgba(27,107,93,.12);}
.nav-dropdown a{transition:color .2s,background .2s;border-radius:12px;}
.nav-dropdown a:hover{color:#1b6b5d;background:#e8f4f2;}
.nav-link {
    color: var(--ink-soft);
    font-weight: 500;
    font-size: 0.9rem;
    font-family: var(--font-body);
    transition: color 0.2s;
    background: none;
    border: none;
    cursor: pointer;
    letter-spacing: 0.01em;
}

/* Glow divider */
.glow-divider{height:2px;background:linear-gradient(90deg,transparent,#b8d9d3,transparent);}

/* Hero dot pattern */
.hero-dot-pattern{position:absolute;inset:0;background-image:radial-gradient(circle,#b8d9d3 1px,transparent 1px);background-size:32px 32px;opacity:.35;}

/* Image frame border */
.img-frame{position:relative;}
.img-frame::before{content:'';position:absolute;inset:-12px -12px 12px 12px;border:2px solid #b8d9d3;border-radius:28px;z-index:0;}

/* Section wrap */
.section-wrap{max-width:1280px;margin:0 auto;padding:6rem 1.5rem;}
@media(min-width:768px){.section-wrap{padding:7rem 2.5rem;}}
@media(min-width:1024px){.section-wrap{padding:8rem 4rem;}}
@media(max-width:768px){#anmat{display: none;}.cat-count{margin-left:0 !important;}#stats{grid-template-columns: auto !important;}#section-margin{width: 100%;}.grid-cols-\[240px_1fr\]{grid-template-columns: 1fr !important;}}

/* Clamp typography — Tailwind can't do fluid clamp */
.display-xl{font-family:'Outfit',sans-serif;font-weight:800;line-height:1.05;letter-spacing:-.025em;font-size:clamp(2.6rem,5.5vw,4.8rem);color:#111714;}
.display-lg{font-family:'Outfit',sans-serif;font-weight:800;line-height:1.08;letter-spacing:-.02em;font-size:clamp(2rem,4vw,3.2rem);color:#111714;}
.display-md{font-family:'Outfit',sans-serif;font-weight:700;line-height:1.2;letter-spacing:-.015em;font-size:clamp(1.1rem,2vw,1.4rem);color:#111714;}
.label-mono{font-family:'DM Mono',monospace;font-size:.72rem;letter-spacing:.12em;color:#7a9288;text-transform:uppercase;}
.body-lg{font-size:1.05rem;line-height:1.78;color:#4a5e57;font-family:'DM Sans',sans-serif;}
.body-md{font-size:.93rem;line-height:1.72;color:#4a5e57;font-family:'DM Sans',sans-serif;}

/* Shared.js injected components */
.js-footer{background:#111714;color:#fff;border-top:3px solid #1b6b5d;}
.js-footer-title{font-family:'Outfit',sans-serif;font-weight:700;font-size:.7rem;text-transform:uppercase;letter-spacing:.18em;color:rgba(255,255,255,.35);}
.js-footer-link{font-family:'DM Sans',sans-serif;font-size:.88rem;color:rgba(255,255,255,.5);text-decoration:none;transition:color .2s;display:block;}
.js-footer-link:hover{color:#a8d9d0;}
.js-divider{height:1px;background:rgba(255,255,255,.08);}
.js-badge{font-family:'Outfit',sans-serif;font-size:.65rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#1b6b5d;background:#e8f4f2;border:1px solid #b8d9d3;border-radius:9999px;padding:4px 12px;}
.section-badge{font-family:'Outfit',sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#1b6b5d;background:#e8f4f2;border:1px solid #b8d9d3;border-radius:9999px;padding:5px 16px;display:inline-block;}
.js-cta-btn{background:#1b6b5d;color:#fff;font-family:'Outfit',sans-serif;font-weight:700;font-size:.85rem;letter-spacing:.02em;border-radius:9999px;padding:10px 22px;text-decoration:none;display:inline-block;transition:background .2s,transform .2s,box-shadow .2s;}
.js-cta-btn:hover{background:#237a6b;transform:translateY(-1px);box-shadow:0 6px 24px rgba(27,107,93,.3);}

/* Cards */
.card{background:#fff;border:1.5px solid #d8e8e4;border-radius:20px;transition:border-color .3s,transform .3s,box-shadow .3s;}
.card:hover{border-color:#b8d9d3;transform:translateY(-5px);box-shadow:0 16px 48px rgba(27,107,93,.1);}
.card-surface{background:#f4faf8;border:1.5px solid #d8e8e4;border-radius:20px;transition:border-color .3s,transform .3s,box-shadow .3s;}
.card-surface:hover{border-color:#b8d9d3;transform:translateY(-5px);box-shadow:0 16px 48px rgba(27,107,93,.1);}


/* Buttons */
.btn-primary{font-family:'Outfit',sans-serif;font-weight:700;font-size:.92rem;letter-spacing:.02em;background:#1b6b5d;color:#fff;padding:14px 30px;border-radius:9999px;display:inline-flex;align-items:center;gap:8px;text-decoration:none;border:none;cursor:pointer;transition:background .2s,transform .2s,box-shadow .2s;}
.btn-primary:hover{background:#237a6b;transform:translateY(-2px);box-shadow:0 10px 32px rgba(27,107,93,.35);}
.btn-outline{font-family:'Outfit',sans-serif;font-weight:700;font-size:.92rem;letter-spacing:.02em;background:transparent;color:#1b6b5d;padding:14px 30px;border-radius:9999px;display:inline-flex;align-items:center;gap:8px;text-decoration:none;border:2px solid #b8d9d3;cursor:pointer;transition:border-color .2s,background .2s;}
.btn-outline:hover{border-color:#1b6b5d;background:#e8f4f2;}

/* Icon box */
.icon-box{width:48px;height:48px;border-radius:14px;background:#e8f4f2;border:1px solid #b8d9d3;display:flex;align-items:center;justify-content:center;flex-shrink:0;}

/* Form */
.js-input{width:100%;background:#fff;border:1.5px solid #d8e8e4;border-radius:12px;padding:12px 16px;font-size:.9rem;font-family:'DM Sans',sans-serif;color:#111714;outline:none;transition:border-color .2s,box-shadow .2s;}
.js-input::placeholder{color:#7a9288;}
.js-input:focus{border-color:#1b6b5d;box-shadow:0 0 0 3px rgba(27,107,93,.1);}
.js-label{display:block;font-family:'Outfit',sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#7a9288;margin-bottom:8px;}

/* Breadcrumb */
.breadcrumb a{color:#7a9288;text-decoration:none;font-size:.83rem;font-family:'DM Sans',sans-serif;}
.breadcrumb a:hover{color:#1b6b5d;}
.breadcrumb span{color:#7a9288;font-size:.83rem;}

/* Scrollbar */
::-webkit-scrollbar{width:5px;}
::-webkit-scrollbar-track{background:#f4faf8;}
::-webkit-scrollbar-thumb{background:#b8d9d3;border-radius:3px;}
::selection{background:rgba(27,107,93,.15);color:#1b6b5d;}

/* ── Documentacion page ── */
.sidebar{position:sticky;top:100px;max-height:calc(100vh - 120px);overflow-y:auto;}
.sidebar::-webkit-scrollbar{width:3px;}
.sidebar::-webkit-scrollbar-thumb{background:#b8d9d3;border-radius:2px;}
.side-link{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:10px;font-family:'Outfit',sans-serif;font-weight:600;font-size:.82rem;color:#7a9288;text-decoration:none;transition:background .2s,color .2s;border-left:2px solid transparent;}
.side-link:hover,.side-link.active{background:#e8f4f2;color:#1b6b5d;border-left-color:#1b6b5d;}
.side-link .side-count{margin-left:auto;font-family:'DM Mono',monospace;font-size:.68rem;background:#eaf5f2;color:#7a9288;padding:2px 8px;border-radius:9999px;}
.side-link:hover .side-count,.side-link.active .side-count{background:#b8d9d3;color:#14534a;}
.doc-section{scroll-margin-top:100px;}
.cat-icon{width:40px;height:40px;border-radius:12px;background:#e8f4f2;border:1.5px solid #b8d9d3;display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0;}
.doc-row{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:12px;border:1.5px solid #d8e8e4;background:#fff;transition:border-color .2s,box-shadow .2s,transform .2s;text-decoration:none;margin-bottom:8px;}
.doc-row:hover{border-color:#b8d9d3;box-shadow:0 4px 16px rgba(27,107,93,.08);transform:translateX(4px);}
.doc-row-icon{width:36px;height:36px;border-radius:9px;background:#e8f4f2;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.doc-row-label{font-family:'DM Sans',sans-serif;font-size:.88rem;color:#4a5e57;font-weight:500;flex:1;line-height:1.4;}
.doc-row-year{font-family:'DM Mono',monospace;font-size:.7rem;color:#7a9288;background:#eaf5f2;padding:3px 10px;border-radius:9999px;flex-shrink:0;}
.doc-row-dl{display:flex;align-items:center;gap:6px;font-family:'Outfit',sans-serif;font-weight:700;font-size:.75rem;color:#1b6b5d;flex-shrink:0;}
.product-card{background:#fff;border:1.5px solid #d8e8e4;border-radius:16px;padding:18px 20px;transition:border-color .25s,box-shadow .25s,transform .25s;}
.product-card:hover{border-color:#b8d9d3;box-shadow:0 8px 28px rgba(27,107,93,.1);transform:translateY(-3px);}
.product-name{font-family:'Outfit',sans-serif;font-weight:700;font-size:.95rem;color:#111714;margin-bottom:10px;}
.chips{display:flex;flex-wrap:wrap;gap:6px;}
.chip{display:inline-flex;align-items:center;gap:4px;font-family:'Outfit',sans-serif;font-weight:700;font-size:.68rem;letter-spacing:.06em;padding:5px 10px;border-radius:8px;text-decoration:none;transition:background .2s,color .2s;}
.chip-anmat{background:rgba(27,107,93,.08);color:#1b6b5d;border:1px solid #b8d9d3;}.chip-anmat:hover{background:#1b6b5d;color:#fff;}
.chip-senasa{background:rgba(27,107,93,.05);color:#14534a;border:1px solid #a8ccc5;}.chip-senasa:hover{background:#14534a;color:#fff;}
.chip-hs{background:rgba(74,110,100,.06);color:#4a5e57;border:1px solid #d8e8e4;}.chip-hs:hover{background:#4a5e57;color:#fff;}
.chip-ft{background:#eaf5f2;color:#7a9288;border:1px solid #d8e8e4;}.chip-ft:hover{background:#7a9288;color:#fff;}
.chip-disabled{background:#f4faf8;color:#a8ccc5;border:1px solid #d8e8e4;opacity:.5;cursor:not-allowed;pointer-events:none;}
.subcat-label{font-family:'Outfit',sans-serif;font-weight:800;font-size:.72rem;text-transform:uppercase;letter-spacing:.14em;color:#1b6b5d;background:#e8f4f2;border:1px solid #b8d9d3;display:inline-block;padding:4px 14px;border-radius:6px;margin:1.5rem 0 1rem;}
.featured-card{background:linear-gradient(135deg,#e8f4f2 0%,#fff 100%);border:2px solid #b8d9d3;border-radius:20px;padding:24px 28px;}
.search-wrap{position:relative;}
.search-wrap svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#7a9288;}
#search-input{padding-left:42px;}
@media(max-width:1023px){.sidebar{display:none;}}