/* ===== IMPTRADE — DESIGN SYSTEM ===== */
:root{
  --red:#E8432D;
  --red-deep:#C6341F;
  --red-glow:rgba(232,67,45,0.35);
  --ink:#0E0E0E;
  --ink-soft:#3A3A38;
  --gray:#6E6E6B;
  --line:#EAE8E3;
  --line-dark:rgba(255,255,255,0.10);
  --panel:#F6F5F1;
  --panel-2:#EFEDE7;
  --dark:#0B0B0C;
  --dark-2:#131316;
  --dark-panel:#1B1B1E;
  --white:#ffffff;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter', sans-serif;
  color:var(--ink);
  background:#fff;
  font-size:16px;
  line-height:1.55;
}
a{color:inherit; text-decoration:none;}
h1,h2,h3,h4{font-family:'Plus Jakarta Sans', sans-serif; letter-spacing:-0.01em;}
img{max-width:100%; display:block;}
.wrap{max-width:1240px; margin:0 auto; padding:0 32px;}

/* texture helpers */
.grid-texture{
  background-image:
    linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px);
  background-size:44px 44px;
}
.grid-texture-dark{
  background-image:
    linear-gradient(rgba(0,0,0,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,0.04) 1px, transparent 1px);
  background-size:44px 44px;
}
.glow-red{
  position:absolute; width:520px; height:520px; border-radius:50%;
  background:radial-gradient(circle, var(--red-glow) 0%, transparent 70%);
  filter:blur(20px); pointer-events:none;
}

.eyebrow{
  font-family:'Plus Jakarta Sans', sans-serif; font-weight:700; font-size:11.5px;
  letter-spacing:0.14em; text-transform:uppercase; color:var(--red);
  display:flex; align-items:center; gap:8px;
}
.eyebrow.on-dark{color:#FF8F7A;}
.eyebrow .dot{width:6px; height:6px; border-radius:50%; background:var(--red); display:inline-block;}

.pill{
  display:inline-flex; align-items:center; gap:8px;
  border:1px solid var(--line); border-radius:999px; padding:9px 16px;
  font-size:13.5px; font-weight:600; color:var(--ink-soft); background:#fff;
}
.pill .rd{width:6px; height:6px; border-radius:50%; background:var(--red); flex-shrink:0;}
.pill.on-dark{background:rgba(255,255,255,0.05); border-color:var(--line-dark); color:#D8D8D6;}

.btn{
  display:inline-flex; align-items:center; gap:8px; padding:14px 24px; border-radius:999px;
  font-weight:700; font-size:14.5px; font-family:'Plus Jakarta Sans', sans-serif;
  transition:transform .15s ease, background .2s ease, color .2s ease, box-shadow .2s ease; border:1px solid transparent;
}
.btn:hover{transform:translateY(-1px);}
.btn-red{background:var(--red); color:#fff; box-shadow:0 10px 24px rgba(232,67,45,0.28);}
.btn-red:hover{background:var(--red-deep);}
.btn-outline{border-color:var(--ink); color:var(--ink);}
.btn-outline:hover{background:var(--ink); color:#fff;}
.btn-outline-light{border-color:rgba(255,255,255,0.35); color:#fff;}
.btn-outline-light:hover{background:#fff; color:var(--ink);}
.btn-black{background:var(--ink); color:#fff;}
.btn-black:hover{background:#000;}
.link-arrow{font-weight:700; font-size:13.5px; color:var(--red); display:inline-flex; gap:6px; align-items:center;}
.link-arrow:hover{gap:10px;}

/* ===== NAV ===== */
header{position:sticky; top:0; z-index:100; background:rgba(255,255,255,0.94); backdrop-filter:blur(10px); border-bottom:1px solid var(--line);}
nav{display:flex; align-items:center; justify-content:space-between; padding:8px 32px; max-width:1240px; margin:0 auto;}
.logo{display:flex; align-items:center; gap:10px;}
.logo img{height:124px; width:auto;}
.nav-links{display:flex; gap:4px; align-items:center;}
.nav-links a{
  font-size:14px; font-weight:600; color:var(--ink-soft); padding:9px 15px; border-radius:999px;
  border:1px solid transparent;
}
.nav-links a.active{color:var(--red); border-color:var(--red); background:#FDEEEC;}
.nav-links a:hover:not(.active){background:var(--panel);}
.burger{display:none;}

section{padding:72px 0;}
.section-tight{padding:52px 0;}

/* ===== ICONS ===== */
.icn{width:22px; height:22px; stroke:currentColor; fill:none; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;}

/* ===== IMAGE BANNERS (photo placeholders w/ duotone) ===== */
.photo-banner{
  position:relative; border-radius:20px; overflow:hidden; min-height:340px;
  background:#0B0B0C;
}
.photo-banner img{width:100%; height:100%; object-fit:cover; position:absolute; inset:0;}
.photo-banner .duotone{
  position:absolute; inset:0;
  background:linear-gradient(200deg, rgba(20,8,5,0.15), rgba(11,11,12,0.82) 68%),
             linear-gradient(0deg, rgba(232,67,45,0.22), transparent 55%);
}
.photo-banner .content{position:relative; z-index:2; height:100%; padding:34px; display:flex; align-items:flex-end; min-height:340px;}
.banner-text{max-width:540px; color:#fff;}
.banner-text h3{font-size:clamp(22px,2.6vw,30px); font-weight:700; margin-top:10px; line-height:1.3;}
.banner-pills{position:absolute; top:26px; right:26px; z-index:3; display:flex; flex-direction:column; gap:8px;}
.banner-pill{
  background:rgba(11,11,12,0.55); border:1px solid rgba(255,255,255,0.18); color:#fff;
  padding:9px 16px; border-radius:999px; font-size:12.5px; font-weight:600; display:flex; align-items:center; gap:8px;
  backdrop-filter:blur(4px);
}

/* ===== CARDS ===== */
.card{border:1px solid var(--line); border-radius:16px; padding:26px 24px; background:#fff;}
.card.dark{background:var(--dark-panel); border-color:var(--line-dark); color:#fff;}

/* ===== FOOTER ===== */
footer{background:var(--dark); color:#B8B8B6; padding-top:64px;}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:44px; border-bottom:1px solid var(--line-dark);}
.foot-brand .logo{background:#fff; display:inline-flex; align-items:center; padding:10px 16px; border-radius:10px; margin-bottom:14px;}
.foot-brand .logo img{height:52px; margin-bottom:0;}
.foot-brand p{font-size:13.5px; max-width:280px; color:#8B8B89;}
.foot-col h5{font-family:'Plus Jakarta Sans'; font-size:13px; font-weight:700; color:#fff; margin-bottom:16px; text-transform:uppercase; letter-spacing:0.06em;}
.foot-col a{display:block; font-size:13.5px; color:#9C9C9A; padding:6px 0;}
.foot-col a:hover{color:#fff;}
.foot-bottom{display:flex; justify-content:space-between; align-items:center; padding:24px 0; font-size:12.5px; color:#7B7B79;}

/* ===== RESPONSIVE ===== */
@media (max-width:900px){
  .nav-links{display:none;}
  section{padding:70px 0;}
  .foot-grid{grid-template-columns:1fr 1fr; gap:30px;}
}
@media (max-width:560px){
  .foot-grid{grid-template-columns:1fr;}
}
