:root{
  --bg:#040b12;
  --text:#f0ece5;
  --muted:#d5d1cb;
  --gold:#d7a45c;
  --gold-soft:#efc67f;
  --line:rgba(255,255,255,.16);
  --sep:rgba(215,164,92,.26);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;min-height:100%;background:var(--bg)}
body{font-family:"Montserrat","Segoe UI",Arial,sans-serif;color:var(--text);overflow-x:hidden}
a{text-decoration:none;color:inherit}

.landing{position:relative;min-height:100svh;isolation:isolate;background:var(--bg)}
.landing__bg{
  position:fixed;inset:0;z-index:-3;
  background:url("assets/fondo-renderia.jpg") center 42% / cover no-repeat;
  transform:scale(1.02);
  filter:brightness(.5) saturate(.95);
}
.landing__overlay{
  position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    radial-gradient(circle at 50% 12%, rgba(255,220,170,.06), transparent 14%),
    linear-gradient(180deg, rgba(2,6,10,.34) 0%, rgba(2,6,10,.42) 28%, rgba(2,6,10,.52) 55%, rgba(2,6,10,.78) 82%, rgba(2,6,10,.94) 100%);
}
.topbar{
  position:absolute;inset:0 0 auto 0;z-index:10;height:72px;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 clamp(32px,4.8vw,76px);
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg, rgba(2,6,10,.54), rgba(2,6,10,.08));
}
.topbar__brand img{display:block;height:42px;width:auto}
.topbar__nav{display:flex;gap:clamp(26px,3.3vw,50px);font-size:12px;font-weight:400;color:#efede9}
.topbar__nav a{position:relative;padding:10px 0}
.topbar__nav a.active{color:#f2c16f}
.topbar__nav a.active::after{
  content:"";position:absolute;left:50%;bottom:2px;transform:translateX(-50%);
  width:44px;height:2px;background:linear-gradient(90deg,transparent,var(--gold-soft),transparent);
  box-shadow:0 0 10px rgba(239,198,127,.95);
}
.hero{
  min-height:calc(100svh - 178px);padding:96px 24px 24px;
  display:flex;align-items:center;justify-content:center;
}
.hero__content{width:min(860px,92vw);display:flex;flex-direction:column;align-items:center;text-align:center}
.hero__logo{display:block;width:clamp(300px,48vw,680px);height:auto;filter:drop-shadow(0 10px 28px rgba(0,0,0,.45))}
.hero__eyebrow{margin:18px 0 0;color:#ebe5dd;font-size:clamp(10px,.95vw,13px);font-weight:500;letter-spacing:.36em;text-shadow:0 2px 8px rgba(0,0,0,.9)}
.hero__eyebrow span{color:var(--gold-soft)}
.hero__rule{width:96px;height:18px;position:relative;display:grid;place-items:center;margin:7px 0 3px}
.hero__rule::before,.hero__rule::after{content:"";position:absolute;top:50%;width:41%;height:1px;background:linear-gradient(90deg,transparent,var(--gold-soft))}
.hero__rule::before{left:0}.hero__rule::after{right:0;transform:scaleX(-1)}
.hero__rule span{width:5px;height:5px;border-radius:50%;background:var(--gold-soft);box-shadow:0 0 11px rgba(239,198,127,.95)}
.hero__tagline{margin:0;color:#f1ece4;font-size:clamp(19px,1.68vw,27px);font-weight:300;line-height:1.42;letter-spacing:.05em;text-shadow:0 3px 14px rgba(0,0,0,.96)}
.hero__status{margin-top:18px;padding:10px 24px;border:1px solid rgba(215,164,92,.7);border-radius:999px;background:rgba(4,10,15,.52);color:#f2c16f;font-size:11px;font-weight:500;letter-spacing:.24em;box-shadow:inset 0 0 0 1px rgba(255,255,255,.03)}
.hero__copy{margin:16px 0 0;color:#f5f2ed;font-size:clamp(11px,.95vw,14px);font-weight:300;line-height:1.58;letter-spacing:.075em;text-shadow:0 2px 12px rgba(0,0,0,.98)}
.hero__note{margin:8px 0 0;color:#efedea;font-size:clamp(10px,.78vw,12px);font-weight:300;letter-spacing:.05em;text-shadow:0 2px 10px rgba(0,0,0,.98)}
.capabilities{
  position:relative;z-index:4;min-height:178px;
  display:grid;grid-template-columns:repeat(4,1fr);
  padding:22px clamp(38px,5vw,76px) 24px;
  background:linear-gradient(180deg, rgba(4,10,15,.80), rgba(4,10,15,.95));
  border-top:1px solid rgba(255,255,255,.18);box-shadow:0 -18px 35px rgba(0,0,0,.26);
}
.capability{display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 clamp(16px,2.6vw,38px)}
.capability + .capability{border-left:1px solid var(--sep)}
.capability__icon{width:47px;height:47px;color:#e7ae59;margin-bottom:7px}
.capability__icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 5px rgba(231,174,89,.18))}
.capability h2{margin:0 0 7px;color:#f4f0ea;font-size:clamp(14px,1.18vw,19px);font-weight:500;letter-spacing:.17em}
.capability p{margin:0;color:#dedbd6;font-size:clamp(10px,.84vw,13px);font-weight:300;line-height:1.52}
.site-footer{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

@media (min-aspect-ratio: 16/9){
  .landing__bg{background-position:center 38%}
  .hero{min-height:calc(100svh - 164px);padding-top:80px;padding-bottom:12px}
  .hero__logo{width:clamp(270px,36vw,540px)}
  .hero__eyebrow{margin-top:12px}
  .hero__status{margin-top:14px}
  .hero__copy{margin-top:11px}
  .capabilities{min-height:164px;padding-top:18px;padding-bottom:18px}
  .capability__icon{width:42px;height:42px}
}
@media (max-height: 920px) and (min-width: 900px){
  .topbar{height:58px}
  .topbar__brand img{height:34px}
  .topbar__nav{font-size:10px}
  .hero{min-height:calc(100svh - 145px);padding-top:62px;padding-bottom:6px}
  .hero__logo{width:clamp(240px,30vw,460px)}
  .hero__eyebrow{margin-top:10px;font-size:9px}
  .hero__tagline{font-size:16px;line-height:1.34}
  .hero__status{margin-top:10px;padding:8px 19px;font-size:9px}
  .hero__copy{margin-top:9px;font-size:10px;line-height:1.45}
  .hero__note{margin-top:4px;font-size:9px}
  .capabilities{min-height:145px;padding-top:13px;padding-bottom:12px}
  .capability__icon{width:34px;height:34px;margin-bottom:4px}
  .capability h2{font-size:13px;margin-bottom:4px}
  .capability p{font-size:9px}
}
@media (max-width: 900px){
  .landing__bg{background-position:center 43%}
  .topbar{height:62px;padding:0 22px}
  .topbar__brand img{height:36px}
  .topbar__nav{gap:18px;font-size:10px}
  .hero{min-height:auto;padding:92px 18px 42px}
  .hero__logo{width:min(440px,78vw)}
  .hero__copy{font-size:12px}
  .capabilities{grid-template-columns:1fr 1fr;padding:0 22px}
  .capability{padding:22px 18px 24px}
  .capability:nth-child(3), .capability:nth-child(4){border-top:1px solid var(--sep)}
  .capability:nth-child(3){border-left:0}
}
@media (max-width: 560px){
  .landing__bg{background-position:center 48%}
  .topbar{height:58px;padding:0 15px}
  .topbar__brand img{height:28px}
  .topbar__nav{gap:12px;font-size:8px}
  .topbar__nav a:nth-child(3), .topbar__nav a:nth-child(4){display:none}
  .hero{padding:80px 15px 38px}
  .hero__logo{width:min(360px,90vw)}
  .hero__eyebrow{margin-top:16px;font-size:8px;letter-spacing:.22em}
  .hero__tagline{font-size:16px}
  .hero__copy{font-size:11px;max-width:410px}
  .desktop-only{display:none}
  .capabilities{grid-template-columns:1fr;padding:0 18px}
  .capability + .capability{border-left:0;border-top:1px solid var(--sep)}
  .capability{padding:20px 10px 22px}
  .capability__icon{width:40px;height:40px}
  .capability h2{font-size:14px}
  .capability p{font-size:11px}
}