.insumos-hero {
  padding:100px 0 0;
  background:linear-gradient(90deg,#fbf8f1 0 44%,rgba(251,248,241,.72)),linear-gradient(rgba(0,12,61,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(0,12,61,.035) 1px,transparent 1px);
  background-size:auto,70px 70px,70px 70px;
  color:#061b50
}
.insumos-hero-grid {
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:70px;
  align-items:center;
  min-height:590px
}
.insumos-hero .breadcrumb {
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase
}
.insumos-hero .eyebrow,.brands-section .eyebrow,.technical-catalog .eyebrow {
  margin-top:55px;
  color:#c57000
}
.insumos-hero h1,.brands-heading h2,.catalog-title h2 {
  margin:32px 0;
  font-family:"Arial Narrow","Roboto Condensed",Arial,sans-serif;
  font-size:clamp(56px,5vw,84px);
  font-weight:500;
  line-height:1.02;
  letter-spacing:-.055em
}
.insumos-hero h1 em,.brands-heading h2 em,.catalog-title h2 em {
  display:block;
  color:#bf6d00;
  font-style:normal
}
.insumos-hero-grid>div>p:last-of-type {
  max-width:640px;
  color:#445974;
  line-height:1.7
}
.hero-brands {
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  gap:26px;
  align-items:stretch;
  min-height:500px
}
.hero-shantui-stack {
  display:grid;
  grid-template-rows:repeat(2,minmax(0,1fr));
  gap:26px
}
.hero-brand-card {
  position:relative;
  overflow:hidden;
  min-height:235px;
  background:#fff;
  clip-path:polygon(0 0,90% 0,100% 12%,100% 100%,0 94%);
  box-shadow:0 30px 60px rgba(0,20,65,.15)
}
.hero-brand-card--primary {
  transform:rotate(-2deg)
}
.hero-brand-card--secondary {
  transform:rotate(2deg)
}
.hero-brand-card--kinshofer {
  min-height:500px;
  transform:rotate(3deg)
}
.hero-brands img {
  width:100%;
  height:100%;
  object-fit:cover;
  background:#edf0f3
}
.hero-brand-card:after {
  content:"";
  position:absolute;
  inset:55% 0 0;
  background:linear-gradient(transparent,#061441 55%)
}
.hero-brands span,.hero-brands strong {
  position:absolute;
  z-index:1;
  left:28px;
  color:#fff;
  text-transform:uppercase
}
.hero-brands span {
  bottom:82px;
  color:#ffa30f;
  font-size:9px;
  letter-spacing:.12em
}
.hero-brands strong {
  bottom:35px;
  font-size:30px
}
.insumos-values {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  background:#fff;
  border-top:1px solid #d3dbe4
}
.insumos-values article {
  min-height:140px;
  padding:30px 5vw;
  border-right:1px solid #d3dbe4
}
.insumos-values span,.quote-card-meta span {
  color:#d87900;
  font-size:9px;
  letter-spacing:.12em
}
.insumos-values h3 {
  margin:0 0 12px;
  font-size:17px
}
.insumos-values p {
  margin:0;
  color:#51647c;
  font-size:11px;
  line-height:1.5
}
.brands-section {
  padding:105px 0;
  background:#f2f5f8
}
.brands-heading,.catalog-title {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:90px;
  align-items:end
}
.brands-heading p,.catalog-title p {
  color:#52667e;
  line-height:1.7
}
.brand-duo {
  display:grid;
  grid-template-columns:1fr 1fr;
  margin-top:50px
}
.brand-duo article {
  min-height:520px;
  padding:65px 70px;
  background:#061441;
  color:#fff
}
.brand-duo article+article {
  background:linear-gradient(135deg,#edf1f5,#fff3db);
  color:#061b50
}
.brand-duo span {
  color:#ffa30f;
  font-size:9px;
  letter-spacing:.12em;
  text-transform:uppercase
}
.brand-duo h3 {
  max-width:540px;
  margin:70px 0 25px;
  font-size:42px;
  line-height:1.1
}
.brand-duo p {
  line-height:1.7
}
.brand-duo ul {
  padding:25px 0;
  border-top:1px solid rgba(127,145,170,.35);
  list-style:none
}
.brand-duo li {
  padding:9px 0;
  font-size:12px
}
.brand-duo li:before {
  content:"—";
  margin-right:14px;
  color:#ffa30f
}
.brand-duo a {
  display:inline-block;
  margin-top:15px;
  padding-bottom:12px;
  border-bottom:1px solid currentColor;
  font-size:10px;
  font-weight:800;
  text-transform:uppercase
}
.technical-catalog {
  padding:105px 0;
  background:#fff
}
.catalog-filters {
  display:grid;
  grid-template-columns:1.15fr 1.45fr 1.45fr .9fr;
  gap:16px;
  margin-top:55px;
  padding:25px;
  background:#f1f4f7;
  border:1px solid #d4dce5
}
.brand-tabs {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  align-self:end
}
.brand-tabs button,.catalog-status button {
  border:1px solid #cbd5e1;
  background:transparent;
  color:#061b50;
  cursor:pointer
}
.brand-tabs button {
  height:48px
}
.brand-tabs button.active {
  background:#061b50;
  color:#fff
}
.catalog-filters label,.quote-form-title+form label {
  display:flex;
  flex-direction:column;
  gap:9px;
  color:#50627b;
  font-size:8px;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase
}
.catalog-filters input,.catalog-filters select,.quote-drawer input,.quote-drawer textarea {
  width:100%;
  height:48px;
  padding:0 14px;
  border:0;
  border-bottom:1px solid #bac7d5;
  background:#fff;
  color:#061b50
}
.catalog-status {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:24px 2px;
  border-bottom:1px solid #d4dce5;
  color:#728097;
  font-size:9px;
  text-transform:uppercase
}
.catalog-status button {
  padding:10px;
  border:0
}
.quote-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
  margin-top:30px
}
.quote-card {
  display:flex;
  min-height:660px;
  flex-direction:column;
  border:1px solid #cbd5e1;
  background:#fff
}
.quote-card[hidden] {
  display:none
}
.quote-card-media {
  position:relative;
  height:220px;
  overflow:hidden;
  background:linear-gradient(#f5f4ef 40%,#061441)
}
.quote-card-media img {
  width:100%;
  height:100%;
  object-fit:contain
}
.quote-card-carousel {
  position:relative;
  width:100%;
  height:100%
}
.quote-card-slides {
  position:relative;
  width:100%;
  height:100%
}
.quote-card-slide {
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0;
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease;
  background:linear-gradient(#f5f4ef 40%,#061441)
}
.quote-card-slide.active {
  opacity:1;
  pointer-events:auto
}
.carousel-control {
  position:absolute;
  top:50%;
  z-index:3;
  width:34px;
  height:34px;
  padding:0;
  border:0;
  border-radius:50%;
  background:rgba(6,20,65,.78);
  color:#fff;
  font-size:22px;
  line-height:34px;
  text-align:center;
  transform:translateY(-50%);
  cursor:pointer
}
.carousel-control.prev {
  left:12px
}
.carousel-control.next {
  right:12px
}
.carousel-dots {
  position:absolute;
  right:16px;
  bottom:16px;
  z-index:3;
  display:flex;
  gap:7px
}
.carousel-dot {
  width:10px;
  height:10px;
  padding:0;
  border:1px solid rgba(255,255,255,.8);
  border-radius:50%;
  background:rgba(6,20,65,.35);
  cursor:pointer
}
.carousel-dot.active {
  border-color:#ffa30f;
  background:#ffa30f
}
.quote-card-media b,.quote-card-media small {
  position:absolute;
  z-index:1;
  text-transform:uppercase
}
.quote-card-media b {
  top:20px;
  left:20px;
  padding:10px 14px;
  background:#ffa30f;
  font-size:9px;
  letter-spacing:.1em
}
.quote-card-media small {
  left:20px;
  bottom:18px;
  color:#fff;
  font-size:9px;
  font-weight:800
}
.quote-card-body {
  display:flex;
  flex:1;
  flex-direction:column;
  padding:25px
}
.quote-card-meta {
  display:flex;
  justify-content:space-between;
  gap:18px
}
.quote-card-meta small {
  color:#7c8aa0;
  font-size:8px
}
.quote-card h3 {
  margin:28px 0 16px;
  font-size:28px;
  font-weight:500
}
.quote-card-body>p {
  min-height:48px;
  color:#405673;
  font-size:12px;
  line-height:1.6
}
.quote-card dl {
  display:grid;
  grid-template-columns:1fr 1fr;
  margin:12px 0 0;
  border-top:1px solid #d5dde6;
  border-bottom:1px solid #d5dde6
}
.quote-card dl div {
  padding:15px 10px 15px 0
}
.quote-card dl div+div {
  padding-left:14px;
  border-left:1px solid #d5dde6
}
.quote-card dt {
  color:#8491a3;
  font-size:7px;
  text-transform:uppercase
}
.quote-card dd {
  margin:8px 0 0;
  font-size:9px;
  line-height:1.4
}
.detail-toggle {
  display:flex;
  justify-content:space-between;
  padding:18px 0;
  border:0;
  border-bottom:1px solid #d5dde6;
  background:none;
  color:#061b50;
  font-size:9px;
  font-weight:800;
  text-transform:uppercase;
  cursor:pointer
}
.detail-toggle span,.add-quote span {
  color:#ffa30f
}
.detail-panel {
  display:none;
  padding:15px 0;
  color:#52667e;
  font-size:10px;
  line-height:1.5
}
.detail-panel.open {
  display:block
}
.add-quote {
  display:flex;
  justify-content:space-between;
  width:100%;
  margin-top:auto;
  padding:18px;
  border:0;
  background:#061b50;
  color:#fff;
  font-weight:800;
  cursor:pointer
}
.floating-quote {
  position:fixed;
  right:24px;
  bottom:22px;
  z-index:70;
  padding:15px 15px 15px 25px;
  border:0;
  background:#ffa30f;
  color:#061b50;
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  cursor:pointer;
  box-shadow:0 14px 35px rgba(0,12,61,.2)
}
.floating-quote b {
  display:inline-grid;
  width:38px;
  height:38px;
  margin-left:16px;
  place-items:center;
  border-radius:50%;
  background:#061b50;
  color:#fff
}
.quote-overlay {
  position:fixed;
  inset:0;
  z-index:90;
  background:rgba(0,12,40,.62);
  opacity:0;
  visibility:hidden;
  transition:.3s
}
.quote-overlay.open {
  opacity:1;
  visibility:visible
}
.quote-drawer {
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  z-index:100;
  width:min(600px,100%);
  overflow-y:auto;
  background:#fff;
  transform:translateX(102%);
  transition:.35s
}
.quote-drawer.open {
  transform:none
}
.quote-drawer header {
  position:relative;
  padding:38px 34px;
  background:#08123b;
  color:#fff
}
.quote-drawer header small {
  color:#ffa30f;
  font-size:8px;
  text-transform:uppercase
}
.quote-drawer header h2 {
  margin:20px 0 0;
  font-size:36px
}
.quote-drawer header button {
  position:absolute;
  top:28px;
  right:30px;
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.3);
  background:none;
  color:#fff;
  font-size:25px;
  cursor:pointer
}
.quote-drawer-body {
  padding:32px
}
.quote-empty {
  padding:25px 0;
  border-bottom:1px solid #d5dde6;
  color:#728097
}
.quote-line {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:18px 0;
  border-bottom:1px solid #d5dde6
}
.quote-line small,.quote-line strong,.quote-line span {
  display:block
}
.quote-line small {
  color:#d87900;
  font-size:8px;
  text-transform:uppercase
}
.quote-line strong {
  margin:8px 0
}
.quote-line span {
  color:#7b8ba2;
  font-size:8px;
  text-transform:uppercase
}
.quote-line>div:last-child {
  display:flex;
  align-items:center
}
.quote-line button {
  width:34px;
  height:34px;
  border:1px solid #d1dae5;
  background:#f4f6f8
}
.quote-line b {
  width:34px;
  text-align:center
}
.quote-form-title {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
  margin:30px 0
}
.quote-form-title h3 {
  font-size:22px
}
.quote-form-title p {
  color:#52667e;
  font-size:11px;
  line-height:1.5
}
.quote-drawer form {
  display:grid;
  gap:18px
}
.form-pair {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px
}
.quote-drawer textarea {
  height:80px;
  padding-top:12px
}
.drawer-actions {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:15px
}
.drawer-actions button {
  min-height:52px;
  border:0;
  background:#ffa30f;
  color:#061b50;
  font-size:9px;
  font-weight:800;
  text-transform:uppercase;
  cursor:pointer
}
.drawer-actions button:last-child {
  background:#061b50;
  color:#fff
}
.drawer-open {
  overflow:hidden
}
@media(max-width:1000px) {
  .insumos-hero-grid,.brands-heading,.catalog-title {
    grid-template-columns:1fr
  }
  .hero-brands {
    grid-template-columns:1fr;
    min-height:0
  }
  .hero-brand-card--kinshofer {
    min-height:350px
  }
  .brand-duo {
    grid-template-columns:1fr
  }
  .catalog-filters {
    grid-template-columns:1fr 1fr
  }
  .quote-grid {
    grid-template-columns:1fr 1fr
  }
}
@media(max-width:650px) {
  .insumos-hero {
    padding-top:60px
  }
  .insumos-hero-grid {
    display:block
  }
  .insumos-hero h1,.brands-heading h2,.catalog-title h2 {
    font-size:48px
  }
  .hero-brands {
    margin-top:55px;
    gap:18px
  }
  .hero-shantui-stack {
    gap:18px
  }
  .hero-brand-card,
  .hero-brand-card--kinshofer {
    min-height:280px;
    transform:none
  }
  .hero-brands strong {
    font-size:25px
  }
  .insumos-values {
    grid-template-columns:1fr
  }
  .insumos-values article {
    border-right:0;
    border-bottom:1px solid #d3dbe4
  }
  .brands-section,.technical-catalog {
    padding:75px 0
  }
  .brand-duo article {
    min-height:0;
    padding:45px 28px
  }
  .brand-duo h3 {
    margin-top:45px;
    font-size:34px
  }
  .catalog-filters,.quote-grid {
    grid-template-columns:1fr
  }
  .quote-card {
    min-height:610px
  }
  .floating-quote {
    right:12px;
    bottom:12px
  }
  .quote-drawer-body {
    padding:24px
  }
  .form-pair,.drawer-actions {
    grid-template-columns:1fr
  }
}
/* Mejoras de legibilidad, densidad y selección del catálogo. */
.technical-catalog>.wrap {
  width:min(96%,1700px);
  max-width:none
}
.catalog-filters {
  position:sticky;
  top:84px;
  z-index:45;
  box-shadow:0 9px 22px rgba(0,12,61,.08)
}
.catalog-filters label {
  font-size:10px;
  letter-spacing:.09em
}
.catalog-filters input,.catalog-filters select {
  font-size:12px
}
.quote-grid {
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px
}
.quote-card {
  min-height:600px;
  transition:border-color .22s ease,box-shadow .22s ease,background-color .22s ease
}
.quote-card-media {
  height:190px
}
.quote-card-media b,.quote-card-media small {
  font-size:10px
}
.quote-card-media small {
  max-width:calc(100% - 40px);
  padding:8px 11px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:3px;
  background:rgba(6,20,65,.92);
  box-shadow:0 4px 12px rgba(0,12,40,.28);
  color:#fff;
  line-height:1.25;
  text-shadow:0 1px 2px rgba(0,0,0,.45);
}
.quote-card-body {
  padding:22px
}
.quote-card-meta span,.quote-card-meta small {
  font-size:9px;
  line-height:1.4
}
.quote-card h3 {
  font-size:25px
}
.quote-card-body>p {
  font-size:13px
}
.quote-card dt {
  font-size:9px
}
.quote-card dd {
  font-size:10px
}
.detail-toggle,.add-quote {
  font-size:10px
}
.detail-panel {
  font-size:11px
}
.quote-card.selected {
  border-color:#9dbb7e;
  background:#f8fbf4;
  box-shadow:0 0 0 2px rgba(119,154,78,.13)
}
.quote-card.selected .quote-card-body {
  background:#fbfdf8
}
.quote-card.selected .add-quote {
  border:1px solid #afc89a;
  background:#eef5e9;
  color:#264d14
}
.quote-card.selected .add-quote span {
  color:#3e741f;
  font-size:17px
}
@media(max-width:1400px) {
  .quote-grid {
    grid-template-columns:repeat(3,minmax(0,1fr))
  }
}
@media(max-width:1000px) {
  .quote-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .catalog-filters {
    top:76px
  }
}
@media(max-width:650px) {
  .catalog-filters {
    position:static;
    box-shadow:none
  }
  .quote-grid {
    grid-template-columns:1fr
  }
  .quote-card-media {
    height:210px
  }
}
/* Panel desplegable de compatibilidad y detalle técnico. */
.detail-panel {
  margin:0 0 18px;
  padding:20px;
  background:#f3f5f7;
  color:#52667e;
  line-height:1.55
}
.detail-panel section {
  padding:0 0 16px
}
.detail-panel section+section {
  padding-top:16px;
  border-top:1px solid #d6dee7
}
.detail-panel strong {
  display:block;
  margin-bottom:11px;
  color:#122b5b;
  font-size:9px;
  letter-spacing:.07em;
  text-transform:uppercase
}
.detail-panel ul {
  margin:0;
  padding:0;
  list-style:none
}
.detail-panel li {
  position:relative;
  padding:3px 0 3px 13px
}
.detail-panel li:before {
  position:absolute;
  left:0;
  color:#e58a00;
  content:"·"
}
.detail-panel a {
  display:inline-flex;
  gap:10px;
  margin-top:1px;
  padding-bottom:7px;
  border-bottom:1px solid #8fa0b5;
  color:#061b50;
  font-size:9px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase
}
.detail-panel a span {
  color:#e58a00
}
.detail-toggle.open {
  border-bottom-color:transparent
}
/* Legibilidad del formulario de solicitud de cotización. */
.quote-drawer header small {
  font-size:10px;
  letter-spacing:.06em
}
.quote-drawer header h2 {
  font-size:38px;
  line-height:1.1
}
.quote-line small {
  font-size:10px;
  letter-spacing:.06em
}
.quote-line strong {
  font-size:17px;
  line-height:1.3
}
.quote-line span {
  font-size:10px;
  line-height:1.4
}
.quote-line button,.quote-line b {
  font-size:14px
}
.quote-form-title h3 {
  font-size:24px;
  line-height:1.2
}
.quote-form-title p {
  font-size:13px;
  line-height:1.55
}
.quote-form-title+form label {
  font-size:11px;
  line-height:1.35;
  letter-spacing:.08em
}
.quote-form-title+form label small {
  font-size:10px
}
.quote-drawer input,.quote-drawer textarea {
  font-size:14px;
  line-height:1.5
}
.quote-drawer input::placeholder,.quote-drawer textarea::placeholder {
  color:#60738d;
  opacity:1
}
.drawer-actions button {
  font-size:11px;
  line-height:1.3
}
@media(max-width:650px) {
  .quote-drawer header h2 {
    font-size:32px
  }
  .quote-form-title {
    grid-template-columns:1fr;
    gap:8px
  }
  .quote-form-title h3 {
    font-size:22px
  }
  .quote-drawer input,.quote-drawer textarea {
    font-size:16px
  }
}