:root{
  --bg:#f6f7f2;
  --bg2:#e8f2e2;
  --panel:rgba(255,255,255,.88);
  --panel2:rgba(16,18,15,.05);
  --line:rgba(16,18,15,.12);
  --text:#10120f;
  --muted:rgba(16,18,15,.72);
  --muted2:rgba(16,18,15,.55);
  --accent:#ffd400;
  --accent2:#35d38a;
  --good:#35d38a;
  --shadow:0 18px 60px rgba(15,23,42,.16);
  --radius:18px;
  --radius2:26px;
  --max:1160px;
  --sans:'Sora', ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  --display:'Space Grotesk', 'Sora', ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  --mono:'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;overflow-x:hidden;overflow-y:auto}
html{background:var(--bg);scrollbar-gutter:stable}
body{
  font-family:var(--sans);
  color:var(--text);
  line-height:1.55;
  background:
    url("../img/bg-grid.svg") 0 0 / 200px 200px repeat,
    url("../img/bg-orbs.svg") center / cover no-repeat,
    radial-gradient(900px 520px at 8% -12%, rgba(255,212,0,.28), transparent 60%),
    radial-gradient(840px 520px at 92% 8%, rgba(53,211,138,.24), transparent 58%),
    radial-gradient(780px 620px at 40% 120%, rgba(255,212,0,.18), transparent 65%),
    linear-gradient(180deg, var(--bg), var(--bg2));
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background-image:
    radial-gradient(rgba(16,18,15,.10) 1px, transparent 1px),
    radial-gradient(rgba(53,211,138,.16) 1px, transparent 1px);
  background-size:32px 32px, 56px 56px;
  opacity:.10;
  mix-blend-mode:soft-light;
}
body::after{
  content:"";
  position:fixed;
  inset:-10%;
  pointer-events:none;
  background:
    radial-gradient(420px 260px at 12% 18%, rgba(255,212,0,.16), transparent 60%),
    radial-gradient(380px 240px at 88% 24%, rgba(53,211,138,.16), transparent 60%),
    radial-gradient(520px 320px at 50% 90%, rgba(255,212,0,.12), transparent 60%);
  animation:float 12s ease-in-out infinite;
  opacity:.9;
}

img{
  max-width:100%;
  height:auto;
  -webkit-user-drag:none;
  user-select:none;
  -webkit-touch-callout:none;
}
a{color:inherit}
a:hover{opacity:.92}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible{
  outline:2px solid rgba(255,212,0,.65);
  outline-offset:2px;
}

.container{max-width:var(--max);margin:0 auto;padding:0 24px}

@keyframes fade-up{
  from{opacity:0;transform:translateY(18px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes fade-in{
  from{opacity:0}
  to{opacity:1}
}

@keyframes float{
  0%{transform:translateY(0)}
  50%{transform:translateY(-6px)}
  100%{transform:translateY(0)}
}

@keyframes form-sheen{
  0%{transform:translate(-12%, -8%)}
  50%{transform:translate(8%, 6%)}
  100%{transform:translate(-12%, -8%)}
}

@keyframes logo-breathe{
  0%{transform:scale(1)}
  50%{transform:scale(1.04)}
  100%{transform:scale(1)}
}
@keyframes orbit{
  0%{transform:translate(-50%, -50%) rotate(0deg) translateX(36px)}
  100%{transform:translate(-50%, -50%) rotate(360deg) translateX(36px)}
}
@keyframes scanline{
  0%{transform:translateY(-120%)}
  100%{transform:translateY(120%)}
}
@keyframes badge-pulse{
  0%,100%{box-shadow:0 0 0 0 rgba(255,212,0,.25)}
  50%{box-shadow:0 0 0 8px rgba(255,212,0,.02)}
}
@keyframes tag-float{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-4px)}
}
@keyframes cursor-blink{
  0%,49%{opacity:1}
  50%,100%{opacity:0}
}

/* Reveal on scroll */
.reveal{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .6s ease, transform .6s ease;
  transition-delay:var(--reveal-delay, 0s);
  will-change:opacity, transform;
  animation:none !important;
}
.reveal.in-view{
  opacity:1;
  transform:translateY(0);
}

/* Header */
.site-header{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(248,250,244,.90);
  backdrop-filter: blur(12px);
  border-bottom:1px solid rgba(16,18,15,.08);
}
.nav{
  height:74px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  min-width:0;
}
.brand img{
  height:44px;
  width:auto;
  max-width:120px;
  object-fit:contain;
  image-rendering:auto;
}
.brand-text{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.brand-text strong{font-size:1.05rem;letter-spacing:.2px}
.brand-text span{
  font-size:.82rem;
  font-weight:650;
  color:var(--muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:360px;
}

.nav-links{display:flex;align-items:center;gap:22px}
.nav-links a{
  text-decoration:none;
  color:var(--muted);
  font-weight:750;
  font-size:.95rem;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid transparent;
  transition:color .2s ease, border-color .2s ease, background .2s ease;
}
.nav-links a.active,
.nav-links a:hover{
  color:var(--text);
  background:rgba(255,212,0,.10);
  border-color:rgba(255,212,0,.30);
}

.nav-right{display:flex;align-items:center;gap:12px}

.lang{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px;
  border-radius:14px;
  border:1px solid rgba(255,212,0,.22);
  background:rgba(255,212,0,.12);
}
.lang a{
  text-decoration:none;
  font-weight:850;
  font-size:.78rem;
  letter-spacing:.08em;
  color:rgba(16,18,15,.65);
  padding:6px 8px;
  border-radius:10px;
}
.lang a.active{
  background:rgba(16,18,15,.06);
  border:1px solid rgba(16,18,15,.10);
  color:var(--text);
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:12px 18px;
  min-height:46px;
  border-radius:16px;
  border:1px solid rgba(255,212,0,.20);
  background:rgba(16,18,15,.04);
  color:var(--text);
  text-decoration:none;
  font-weight:850;
  letter-spacing:.2px;
  white-space:nowrap;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
  box-shadow: 0 14px 46px rgba(15,23,42,.18);
}
.btn:hover{transform:translateY(-1px);border-color:rgba(255,212,0,.35);box-shadow:0 18px 70px rgba(15,23,42,.22)}
.btn:active{transform:translateY(0)}
.btn.primary{
  border-color: rgba(255,212,0,.45);
  background: linear-gradient(135deg, rgba(255,212,0,.94), rgba(53,211,138,.70));
  color:#0b0b0b;
  box-shadow: 0 14px 46px rgba(255,212,0,.16), 0 18px 70px rgba(15,23,42,.22);
}
.btn.ghost{
  background:rgba(16,18,15,.03);
  border-color:rgba(255,212,0,.16);
}
.btn.small{padding:10px 14px;min-height:42px;border-radius:14px;font-size:.94rem}

.menu-toggle{
  display:none;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,212,0,.22);
  background:rgba(255,212,0,.08);
  color:var(--text);
  font-weight:900;
}

/* Sections */
.section{padding:82px 0}
.section.sm{padding:58px 0}

.kicker{
  font-size:.78rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#0f5f3a;
  font-family:var(--mono);
  margin:0 0 12px;
}

.h1{
  font-size:3.0rem;
  line-height:1.05;
  margin:0 0 14px;
  letter-spacing:-.02em;
}
.h1, h2, h3, .brand-text strong{
  font-family:var(--display);
}

.lead{
  font-size:1.14rem;
  color:var(--muted);
  max-width:72ch;
  margin:0;
}

.hero-grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:34px;
  align-items:start;
}

.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}

.panel{
  border-radius:var(--radius2);
  background:linear-gradient(180deg, rgba(255,255,255,.90), rgba(246,248,242,.92));
  border:1px solid rgba(255,212,0,.16);
  box-shadow:var(--shadow);
}

.hero-card{padding:20px;animation:fade-up .6s ease both .08s}
.hero-card h3{margin:0 0 10px;font-size:1.15rem}
.hero-card p{margin:0;color:var(--muted)}
.hero-card ul{margin:14px 0 0;padding-left:18px;color:var(--muted)}
.hero-card li{margin:8px 0}
.hero-illus{border-radius:18px;display:block;margin:0 0 12px;border:1px solid rgba(16,18,15,.10);background:rgba(16,18,15,.03);animation:fade-in .7s ease both .12s, float 7s ease-in-out infinite}

.hero-visual{
  padding:22px;
  position:relative;
  overflow:hidden;
}
.hero-visual > *{position:relative;z-index:1}
.hero-visual::after{
  content:"";
  position:absolute;
  inset:-20%;
  background:
    radial-gradient(280px 180px at 80% 20%, rgba(255,212,0,.25), transparent 70%),
    radial-gradient(280px 200px at 20% 80%, rgba(53,211,138,.22), transparent 70%);
  opacity:.85;
  pointer-events:none;
}
.orbit{
  position:absolute;
  top:16px;
  right:16px;
  width:92px;
  height:92px;
  border-radius:999px;
  border:1px dashed rgba(255,212,0,.28);
  opacity:.7;
  pointer-events:none;
  z-index:0;
}
.orbit::before,
.orbit::after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:10px;
  height:10px;
  border-radius:999px;
  background:#ffd400;
  box-shadow:0 0 16px rgba(255,212,0,.45);
  animation:orbit 6s linear infinite;
}
.orbit::after{
  width:8px;
  height:8px;
  background:#35d38a;
  animation-duration:4.5s;
}
.noctua-gallery{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:12px;
  position:relative;
  z-index:1;
}
.noctua-gallery img{
  border-radius:16px;
  border:1px solid rgba(255,212,0,.18);
  background:rgba(255,255,255,.02);
  box-shadow:0 18px 50px rgba(0,0,0,.35);
  aspect-ratio:1/1;
  object-fit:contain;
  padding:8px;
}
.noctua-stamp{
  position:relative;
  z-index:1;
  margin-top:16px;
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-size:.78rem;
  color:var(--accent);
}
.noctua-stamp span{color:var(--muted);letter-spacing:.08em}
.hero-visual h3{margin-top:18px}
.noctua-logo-hero{
  max-width:220px;
  width:100%;
  height:auto;
  display:block;
  margin:0 auto 14px;
  filter:drop-shadow(0 18px 40px rgba(0,0,0,.45));
  animation:logo-breathe 6s ease-in-out infinite;
}

.project-card{
  position:relative;
  padding:26px;
  border-radius:26px;
  border:1px solid rgba(255,212,0,.20);
  background:
    radial-gradient(280px 200px at 80% -10%, rgba(255,212,0,.18), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.86), rgba(245,247,241,.86));
  box-shadow:0 22px 70px rgba(0,0,0,.42);
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap:18px;
  align-items:center;
}
.project-card p{color:var(--muted)}
.project-badge{
  justify-self:end;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(16,18,15,.18);
  background:#ffd400;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:.72rem;
  color:#10120f;
  box-shadow:0 8px 18px rgba(255,212,0,.18);
  animation:badge-pulse 3.5s ease-in-out infinite;
}
.project-meta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:14px;
}

.stack-grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap:18px;
  align-items:stretch;
}
.stack-card{
  padding:24px;
  border-radius:24px;
  border:1px solid rgba(255,212,0,.22);
  background:linear-gradient(180deg, rgba(255,255,255,.78), rgba(245,247,241,.78));
  box-shadow:0 22px 70px rgba(15,23,42,.18);
}
.stack-card h3{margin:0 0 10px}
.stack-card p{margin:0 0 14px;color:var(--muted)}
.stack-list{display:grid;gap:10px}
.stack-item{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:800;
  letter-spacing:.01em;
}
.stack-item span{color:var(--muted);font-weight:600}

.code-panel{
  position:relative;
  padding:22px 22px 18px;
  border-radius:24px;
  border:1px solid rgba(53,211,138,.22);
  background:
    radial-gradient(260px 180px at 90% -20%, rgba(53,211,138,.14), transparent 60%),
    #0b0f14;
  box-shadow:0 24px 70px rgba(0,0,0,.55);
  font-family:var(--mono);
  font-size:.86rem;
  color:#dbe8e2;
  overflow:hidden;
}
.code-panel::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  height:38%;
  top:-40%;
  background:linear-gradient(180deg, transparent, rgba(255,212,0,.06), transparent);
  animation:scanline 8s ease-in-out infinite;
  pointer-events:none;
  opacity:.7;
}
.code-panel::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg, transparent, rgba(255,212,0,.08), transparent);
  animation:code-sheen 6s ease-in-out infinite;
  pointer-events:none;
}
@keyframes code-sheen{
  0%{transform:translateX(-35%)}
  50%{transform:translateX(35%)}
  100%{transform:translateX(-35%)}
}
.code-line{display:flex;gap:12px;line-height:1.6}
.code-line .ln{width:28px;text-align:right;color:rgba(219,232,226,.35)}
.code-key{color:#ffd400}
.code-fn{color:#35d38a}
.code-var{color:#ffd2b1}
.code-str{color:#c7ffd9}
.code-com{color:rgba(219,232,226,.45)}

.tag-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:12px;
}
.tag{
  padding:12px 14px;
  border-radius:16px;
  border:1px solid rgba(16,18,15,.18);
  background:#fff4b3;
  font-weight:800;
  letter-spacing:.02em;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  animation:tag-float 6s ease-in-out infinite;
}
.tag:nth-child(2){animation-delay:.3s}
.tag:nth-child(3){animation-delay:.6s}
.tag:nth-child(4){animation-delay:.9s}
.tag:nth-child(5){animation-delay:1.2s}
.tag:nth-child(6){animation-delay:1.5s}
.tag span{
  font-family:var(--mono);
  color:#2f5c45;
  font-size:.78rem;
}

.timeline{
  position:relative;
  padding-left:18px;
  display:grid;
  gap:16px;
}
.timeline::before{
  content:"";
  position:absolute;
  left:6px;
  top:6px;
  bottom:6px;
  width:2px;
  background:linear-gradient(180deg, rgba(255,212,0,.6), rgba(53,211,138,.6));
}
.timeline-step{
  position:relative;
  padding:14px 16px 14px 18px;
  border-radius:16px;
  border:1px solid rgba(255,212,0,.18);
  background:linear-gradient(180deg, rgba(255,255,255,.78), rgba(245,247,241,.78));
}
.timeline-step::before{
  content:"";
  position:absolute;
  left:-6px;
  top:18px;
  width:12px;
  height:12px;
  border-radius:999px;
  background:#ffd400;
  box-shadow:0 0 0 4px rgba(255,212,0,.18);
}
.timeline-step h4{margin:0 0 6px}
.timeline-step p{margin:0;color:var(--muted)}

.terminal{
  border-radius:22px;
  border:1px solid rgba(53,211,138,.22);
  background:#0b0f14;
  box-shadow:0 24px 70px rgba(0,0,0,.55);
  overflow:hidden;
  font-family:var(--mono);
}
.terminal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 14px;
  background:linear-gradient(90deg, rgba(255,212,0,.18), rgba(53,211,138,.12));
  border-bottom:1px solid rgba(255,255,255,.06);
  font-size:.78rem;
  color:rgba(16,18,15,.8);
}
.terminal-dots{display:flex;gap:6px}
.terminal-dot{width:10px;height:10px;border-radius:999px;background:rgba(16,18,15,.25)}
.terminal-body{padding:16px 18px;color:#dbe8e2;font-size:.84rem;line-height:1.6}
.terminal-body strong{color:#ffd400}
.terminal-body em{color:#35d38a;font-style:normal}
.terminal-cursor{
  display:inline-block;
  width:8px;
  height:14px;
  background:#35d38a;
  margin-left:6px;
  border-radius:2px;
  animation:cursor-blink 1.1s steps(2, start) infinite;
}

/* Feature cards */
.features{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:16px;
  margin-top:26px;
}
.feature{
  padding:18px;
  border-radius:var(--radius);
  background:linear-gradient(180deg, rgba(255,255,255,.70), rgba(245,247,241,.70));
  border:1px solid rgba(255,212,0,.12);
  animation:fade-up .55s ease both;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.feature:hover{
  transform:translateY(-4px);
  border-color:rgba(255,212,0,.30);
  box-shadow:0 18px 50px rgba(15,23,42,.18);
}
.features .feature:nth-child(1){animation-delay:.05s}
.features .feature:nth-child(2){animation-delay:.12s}
.features .feature:nth-child(3){animation-delay:.19s}
.feature .icon{
  width:46px;height:46px;
  border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg, rgba(255,212,0,.22), rgba(53,211,138,.14));
  border:1px solid rgba(255,212,0,.22);
  margin-bottom:12px;
  font-size:18px;
  line-height:1.1;
}
.feature h4{margin:0 0 6px;font-size:1.04rem}
.feature p{margin:0;color:var(--muted)}

/* Section header */
.section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:22px;
  margin-bottom:22px;
}
.section-head h2{
  margin:0;
  font-size:2.0rem;
  line-height:1.1;
  letter-spacing:-.01em;
  position:relative;
}
.section-head h2::after{
  content:"";
  display:block;
  width:46px;
  height:4px;
  border-radius:999px;
  margin-top:10px;
  background:linear-gradient(90deg, rgba(255,212,0,.9), rgba(53,211,138,.8));
}
.section-head p{margin:0;color:var(--muted);max-width:78ch}

/* Service cards */
.service-grid{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:16px;
}

.service-tiles{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:16px;
}
.service-tile{
  padding:18px;
  border-radius:22px;
  background:linear-gradient(180deg, rgba(255,255,255,.86), rgba(245,247,241,.86));
  border:1px solid rgba(255,212,0,.18);
  box-shadow:0 18px 60px rgba(15,23,42,.20);
  display:grid;
  gap:12px;
  height:100%;
  transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.service-tile:hover{
  transform:translateY(-4px);
  border-color:rgba(255,212,0,.32);
  box-shadow:0 22px 70px rgba(15,23,42,.18);
}
.tile-media{
  border-radius:16px;
  border:1px solid rgba(255,212,0,.16);
  background:rgba(255,255,255,.02);
  padding:10px;
}
.tile-media img{display:block;width:100%;height:auto}
.service-tile h3{margin:0;font-size:1.1rem}
.service-tile p{margin:0;color:var(--muted)}

.tech-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:14px;
}
.tech-card{
  padding:12px 14px;
  border-radius:16px;
  border:1px solid rgba(53,211,138,.22);
  background:rgba(53,211,138,.08);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-weight:800;
  transition:transform .2s ease, border-color .2s ease;
}
.tech-card:hover{
  transform:translateY(-2px);
  border-color:rgba(53,211,138,.4);
}
.tech-card span{font-family:var(--mono);color:rgba(16,18,15,.65);font-size:.78rem}

.value-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:16px;
}
.value-card{
  padding:20px;
  border-radius:22px;
  border:1px solid rgba(255,212,0,.16);
  background:linear-gradient(180deg, rgba(255,255,255,.78), rgba(245,247,241,.78));
  box-shadow:0 20px 60px rgba(0,0,0,.32);
}
.value-card h4{margin:0 0 8px}
.value-card p{margin:0;color:var(--muted)}

.sector-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:16px;
}
.sector-card{
  padding:18px;
  border-radius:20px;
  border:1px solid rgba(53,211,138,.18);
  background:rgba(53,211,138,.06);
  font-weight:800;
  letter-spacing:.01em;
  transition:transform .2s ease, border-color .2s ease;
}
.sector-card:hover{
  transform:translateY(-3px);
  border-color:rgba(53,211,138,.35);
}
.sector-card span{
  display:block;
  margin-top:6px;
  font-weight:600;
  color:var(--muted);
}
.service-card{
  position:relative;
  padding:20px;
  border-radius:22px;
  background:linear-gradient(180deg, rgba(255,255,255,.82), rgba(245,247,241,.82));
  border:1px solid rgba(255,212,0,.16);
  box-shadow: 0 18px 60px rgba(0,0,0,.22);
  text-decoration:none;
  overflow:hidden;
  animation:fade-up .6s ease both;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.service-card.featured{
  border-color:rgba(255,212,0,.45);
  background:
    radial-gradient(420px 220px at 12% 0%, rgba(255,212,0,.22), transparent 60%),
    rgba(255,255,255,.86);
  box-shadow:0 22px 70px rgba(255,212,0,.14), 0 22px 70px rgba(0,0,0,.34);
  padding-top:52px;
}
.service-card.featured .service-top{margin-top:4px}
.service-card.featured::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:22px;
  border:1px solid rgba(255,212,0,.22);
  pointer-events:none;
}
.service-grid .service-card:nth-child(odd){animation-delay:.08s}
.service-grid .service-card:nth-child(even){animation-delay:.16s}
.service-card:hover{
  border-color:rgba(255,212,0,.32);
  transform:translateY(-4px);
  box-shadow:0 24px 70px rgba(15,23,42,.20);
}
.service-card.featured:hover{
  border-color:rgba(255,212,0,.55);
  transform:translateY(-6px);
  box-shadow:0 26px 80px rgba(255,212,0,.20), 0 26px 80px rgba(15,23,42,.26);
}
.service-badge{
  position:absolute;
  top:14px;
  left:14px;
  padding:8px 14px;
  border-radius:999px;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#07090b;
  background:linear-gradient(135deg, #ffd400, #35d38a);
  box-shadow:0 10px 30px rgba(255,212,0,.28);
  line-height:1.2;
  min-height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
}
.service-top{display:flex;gap:16px;align-items:flex-start}
.service-icon{
  flex:0 0 auto;
  width:74px;height:74px;
  border-radius:18px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,212,0,.12);
  display:flex;align-items:center;justify-content:center;
}
.service-icon img{width:70px;height:70px;display:block;object-fit:contain}
.service-card h3{margin:0 0 6px;font-size:1.2rem}
.service-card p{margin:0;color:var(--muted)}
.service-list{margin:14px 0 0;padding-left:18px;color:var(--muted)}
.service-list li{margin:7px 0}
.service-arrow{
  position:absolute;
  right:18px;
  top:18px;
  width:38px;height:38px;
  border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(16,18,15,.18);
  background:#fff4b3;
  color:#10120f;
}

/* Case cards */
.case-grid{margin-top:16px}
.case-top{align-items:center}
.case-logo{
  width:170px;height:110px;
  border-radius:16px;
  display:flex;align-items:center;justify-content:center;
  padding:12px;
  background:linear-gradient(135deg, rgba(255,212,0,.10), rgba(53,211,138,.06));
  border:1px solid rgba(255,212,0,.18);
}
.case-logo img{
  max-width:145px;
  max-height:86px;
  object-fit:contain;
  display:block;
}
.case-cta{
  margin-top:16px;
  padding:18px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  background:linear-gradient(135deg, rgba(255,212,0,.18), rgba(53,211,138,.10));
  border:1px solid rgba(255,212,0,.28);
}
.case-cta p{margin:0;color:var(--muted);max-width:70ch}
.case-cta strong{color:var(--text)}
.case-cta .actions{display:flex;gap:10px;flex-wrap:wrap}

/* Chips */
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{
  padding:8px 14px;
  border-radius:999px;
  font-size:.78rem;
  font-weight:750;
  letter-spacing:.02em;
  color:#10120f;
  background:#ffd400;
  border:1px solid rgba(16,18,15,.18);
  box-shadow:0 6px 14px rgba(15,23,42,.12);
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  line-height:1.2;
  min-height:30px;
  white-space:nowrap;
}

/* Split + Callouts */
.split{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap:16px;
  align-items:start;
}
.callout{
  padding:20px 22px;
  border-radius:24px;
  border:1px solid rgba(53,211,138,.18);
  background:linear-gradient(180deg, rgba(255,255,255,.86), rgba(245,247,241,.86));
  box-shadow:0 20px 60px rgba(0,0,0,.35);
}
.callout h3{margin:0 0 8px}
.callout p{margin:0;color:var(--muted)}
.callout .actions{margin-top:14px;display:flex;gap:10px;flex-wrap:wrap}

/* Stats */
.stat-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap:16px;
  margin-top:18px;
}
.stat{
  padding:20px 20px;
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.76), rgba(245,247,241,.76));
  border:1px solid rgba(255,212,0,.18);
  display:flex;
  flex-direction:column;
  gap:6px;
  min-height:126px;
  min-width:0;
}
.stat .value{
  font-size:1.38rem;
  font-weight:950;
  letter-spacing:-.02em;
  margin:0;
  line-height:1.15;
  overflow-wrap:normal;
  word-break:normal;
}
.stat .label{margin:0;color:var(--muted);line-height:1.4;overflow-wrap:anywhere;font-size:.94rem}

/* Quote */
.quote{
  padding:18px 20px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.82);
  position:relative;
}
.quote::before{
  content:\"“\";
  position:absolute;
  top:6px;left:12px;
  font-size:2.2rem;
  color:rgba(255,212,0,.45);
}
.quote p{margin:0 0 8px;color:var(--text)}
.quote span{color:var(--muted);font-size:.95rem}

/* Steps */
.steps{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:16px;
}
.steps.steps-4{grid-template-columns: repeat(4, minmax(0, 1fr))}
.step{
  padding:20px;
  border-radius:22px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.10);
  animation:fade-up .55s ease both;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.step:hover{
  transform:translateY(-3px);
  border-color:rgba(255,212,0,.26);
  box-shadow:0 18px 50px rgba(0,0,0,.28);
}
.steps .step:nth-child(1){animation-delay:.06s}
.steps .step:nth-child(2){animation-delay:.12s}
.steps .step:nth-child(3){animation-delay:.18s}
.step .num{
  width:42px;height:42px;
  border-radius:15px;
  display:flex;align-items:center;justify-content:center;
  font-weight:950;
  background:rgba(255,212,0,.18);
  border:1px solid rgba(255,212,0,.22);
  margin-bottom:12px;
  line-height:1.1;
}
.step h3{margin:0 0 8px}
.step p{margin:0;color:var(--muted)}
.process-note{
  margin-top:16px;
  padding:18px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  background:linear-gradient(135deg, rgba(255,212,0,.16), rgba(53,211,138,.08));
  border:1px solid rgba(255,212,0,.25);
}
.process-note h3{margin:0 0 6px;font-size:1.1rem}
.process-note p{margin:0;color:var(--muted);max-width:70ch}

/* FAQ */
.faq{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:14px;
}
.faq details{
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.66);
  padding:14px 16px;
  animation:fade-up .5s ease both;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.faq details:hover{
  transform:translateY(-3px);
  border-color:rgba(255,212,0,.26);
  box-shadow:0 16px 50px rgba(0,0,0,.24);
}
.faq details:nth-child(odd){animation-delay:.06s}
.faq details:nth-child(even){animation-delay:.12s}
.faq summary{
  cursor:pointer;
  font-weight:850;
  list-style:none;
  position:relative;
  padding-right:26px;
}
.faq summary::after{
  content:"+";
  position:absolute;
  right:0;
  top:0;
  width:24px;height:24px;
  border-radius:9px;
  display:flex;align-items:center;justify-content:center;
  font-weight:900;
  color:var(--text);
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  font-size:.85rem;
  line-height:1;
}
.faq details[open] summary::after{content:"–"}
.faq summary::-webkit-details-marker{display:none}
.faq p{margin:10px 0 0;color:var(--muted)}
.faq-cta{
  margin-top:16px;
  padding:18px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  background:rgba(255,255,255,.86);
  border:1px solid rgba(255,255,255,.12);
}
.faq-cta h3{margin:0 0 6px}
.faq-cta p{margin:0;color:var(--muted);max-width:70ch}
.faq-cta .actions{display:flex;gap:10px;flex-wrap:wrap}

/* Modals */
html.modal-open, body.modal-open{overflow:hidden}
body.modal-open{padding-right:var(--scrollbar-width, 0px)}
.modal{
  border:none;
  padding:0;
  background:transparent;
  color:var(--text);
  width:min(920px, calc(100% - 24px));
  max-width:920px;
  overflow:hidden;
}
.modal::backdrop{
  background:rgba(248,250,244,.80);
  backdrop-filter: blur(6px);
}
.modal-card{
  border-radius:26px;
  background:rgba(255,255,255,.98);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 30px 90px rgba(0,0,0,.60);
  padding:22px;
  max-height:calc(100vh - 32px);
  overflow:auto;
  overscroll-behavior:contain;
}
.modal-card::-webkit-scrollbar{width:0;height:0}
.modal-card{scrollbar-width:none}
.modal.open .modal-card{animation:fade-up .35s ease both}
.modal-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}
.modal-lead{margin:6px 0 0;color:var(--muted)}
.modal-close{
  width:38px;height:38px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:var(--text);
  font-size:22px;
  font-weight:900;
  line-height:1;
  cursor:pointer;
}
.modal-grid{
  margin-top:14px;
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap:16px;
}
.modal-grid h4{margin:0 0 8px}
.modal-foot{
  margin-top:16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.modal-foot .actions{display:flex;gap:10px;flex-wrap:wrap}

/* Pricing */
.pricing-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap:16px;
}
.price-card{
  border-radius:var(--radius2);
  background:rgba(255,255,255,.92);
  border:1px solid rgba(16,18,15,.12);
  box-shadow:var(--shadow);
  padding:24px;
  animation:fade-up .6s ease both;
  transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.price-card:hover{
  transform:translateY(-4px);
  border-color:rgba(255,212,0,.35);
  box-shadow:0 24px 70px rgba(15,23,42,.22);
}
.pricing-grid .price-card:nth-child(1){animation-delay:.06s}
.pricing-grid .price-card:nth-child(2){animation-delay:.12s}
.pricing-grid .price-card:nth-child(3){animation-delay:.18s}
.price-card.featured{outline:2px solid rgba(255,212,0,.45)}
.price-card .pk{letter-spacing:.14em;text-transform:uppercase;font-size:.75rem;color:var(--muted2)}
.price-card h3{margin:10px 0 0;font-size:1.35rem}
.price-card .price{margin:10px 0 0;font-size:2.15rem;font-weight:950}
.price-card p{margin:12px 0 0;color:var(--muted)}
.price-card ul{margin:14px 0 0;padding-left:18px;color:var(--muted)}
.price-card li{margin:7px 0}
.price-note{margin-top:14px;color:var(--muted2);font-size:.92rem}

/* Tables */
.table{
  width:100%;
  border-collapse: collapse;
  border-radius: 16px;
  overflow:hidden;
  border:1px solid rgba(16,18,15,.12);
  background: rgba(255,255,255,.92);
}
.table th,.table td{
  padding:14px 14px;
  border-bottom:1px solid rgba(16,18,15,.08);
  text-align:left;
}
.table th{background:rgba(16,18,15,.04);color:rgba(16,18,15,.85);font-size:.9rem}
.table td{color:var(--muted)}
.table tr:last-child td{border-bottom:0}

/* CTA row */
.cta-row{
  margin-top:18px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

/* Forms */
.form-grid{
  display:grid;
  grid-template-columns: 1fr .9fr;
  gap:18px;
  align-items:start;
}
.form{
  padding:24px;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,212,0,.18);
  background:
    radial-gradient(520px 260px at 100% -10%, rgba(255,212,0,.18), transparent 62%),
    rgba(255,255,255,.92);
  box-shadow:0 26px 80px rgba(15,23,42,.22);
  animation:fade-up .6s ease both;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.form form{position:relative;z-index:1}
.form-head{position:relative;z-index:1;margin-bottom:16px;display:flex;flex-direction:column;gap:8px}
.form-head h3{margin:0;font-size:1.28rem}
.form-head p{margin:0;color:var(--muted);max-width:60ch}
.form-head .chips{margin-top:4px}
.form::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(420px 220px at 90% -10%, rgba(255,212,0,.18), transparent 60%);
  pointer-events:none;
}
.form::after{
  content:"";
  position:absolute;
  inset:-30%;
  background:radial-gradient(280px 160px at 20% 20%, rgba(53,211,138,.16), transparent 60%);
  opacity:.6;
  animation:form-sheen 10s ease-in-out infinite;
  pointer-events:none;
}
.form:focus-within{
  border-color:rgba(255,212,0,.35);
  box-shadow:0 22px 70px rgba(255,212,0,.12), var(--shadow);
}
.form:hover{
  transform:translateY(-3px);
  border-color:rgba(255,212,0,.30);
  box-shadow:0 30px 90px rgba(15,23,42,.24);
}
.label{font-weight:850;margin:0 0 6px;display:block}
.input,.select,.textarea{
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid rgba(16,18,15,.12);
  background:rgba(255,255,255,.90);
  color:var(--text);
  outline:none;
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease, transform .2s ease;
}
.textarea{min-height:140px;resize:vertical}
.input:hover,.select:hover,.textarea:hover{border-color:rgba(16,18,15,.22)}
.input:focus,.select:focus,.textarea:focus{
  border-color:rgba(53,211,138,.55);
  background:rgba(255,255,255,.92);
  box-shadow:0 0 0 3px rgba(53,211,138,.12);
  transform:translateY(-1px);
}
.input::placeholder,.textarea::placeholder{color:rgba(16,18,15,.45)}
.select{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  padding-right:36px;
  background-image:linear-gradient(45deg, transparent 50%, rgba(16,18,15,.55) 50%), linear-gradient(135deg, rgba(16,18,15,.55) 50%, transparent 50%);
  background-position:calc(100% - 18px) 50%, calc(100% - 12px) 50%;
  background-size:6px 6px, 6px 6px;
  background-repeat:no-repeat;
}
.select:focus{background-position:calc(100% - 18px) 50%, calc(100% - 12px) 50%}
.input[type="checkbox"]{accent-color:var(--accent)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.help{color:var(--muted2);font-size:.92rem;margin:10px 0 0}
.form-actions{margin-top:16px;display:flex;gap:12px;flex-wrap:wrap}

.sidecard{padding:22px;animation:fade-up .6s ease both .08s;transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease}
.sidecard:hover{transform:translateY(-3px);border-color:rgba(255,212,0,.24);box-shadow:0 18px 50px rgba(15,23,42,.18)}
.sidecard h3{margin:0 0 10px}
.sidecard ul{margin:0;padding-left:18px;color:var(--muted)}
.sidecard li{margin:8px 0}

/* Footer */
.site-footer{
  position:relative;
  overflow:hidden;
  padding:64px 0 32px;
  border-top:1px solid rgba(16,18,15,.10);
  background:linear-gradient(180deg, #eef6e4 0%, #e4f0d8 100%);
}
.site-footer .container{
  max-width:none;
  padding:0;
}
.site-footer::before{
  content:"";
  position:absolute;
  inset:0;
  background:none;
  opacity:0;
  pointer-events:none;
}
.footer-grid{
  display:grid;
  grid-template-columns: 1.2fr 1fr 1fr 1.2fr;
  gap:20px;
  align-items:start;
  padding:48px clamp(20px, 6vw, 96px);
  border-radius:0;
  border-top:1px solid rgba(16,18,15,.12);
  border-bottom:1px solid rgba(16,18,15,.12);
  border-left:0;
  border-right:0;
  background:#ffffff;
  box-shadow:0 10px 30px rgba(15,23,42,.10);
  position:relative;
  z-index:1;
  overflow:hidden;
  backdrop-filter: blur(10px);
}
.footer-grid::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:0;
  background:none;
  pointer-events:none;
  opacity:0;
}
.footer-grid::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:6px;
  background:linear-gradient(180deg, #ffd400, #35d38a);
  opacity:.85;
}
.footer-grid > div{
  padding:10px 16px;
  border:none;
  background:transparent;
  box-shadow:none;
  position:relative;
  z-index:1;
}
.footer-grid > div:not(:first-child){
  border-left:1px solid rgba(16,18,15,.10);
  padding-left:24px;
}
.footer-grid > .footer-bottom{
  border-left:0;
  padding-left:0;
  padding-right:0;
}
.footer-brand{display:flex;gap:12px;align-items:flex-start}
.footer-brand img{
  height:44px;
  width:auto;
  max-width:140px;
  border-radius:12px;
  padding:6px;
  background:#ffffff;
  border:1px solid rgba(16,18,15,.10);
  object-fit:contain;
}
.footer-brand strong{
  display:block;
  font-size:1.08rem;
  letter-spacing:.02em;
}
.footer-brand strong::after{
  content:"";
  display:block;
  width:42px;
  height:2px;
  margin-top:8px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(255,212,0,.8), rgba(53,211,138,.7));
}
.footer-brand span{display:block;color:var(--muted);font-size:.9rem;margin-top:6px;max-width:52ch}
.footer-col h4{margin:0 0 10px;font-size:1.0rem}
.footer-col h4{
  letter-spacing:.04em;
  text-transform:uppercase;
  font-size:.82rem;
  color:#1a3b2a;
}
.footer-col a{
  display:block;
  text-decoration:none;
  color:rgba(16,18,15,.78);
  padding:6px 0;
  font-weight:650;
  transition:color .2s ease, transform .2s ease;
}
.footer-contact{
  margin-top:14px;
  display:grid;
  gap:12px;
  font-size:.92rem;
  color:rgba(16,18,15,.78);
}
.footer-contact div{
  position:relative;
  padding:10px 12px 10px 18px;
  border-radius:12px;
  background:#f7f9f1;
  border:1px solid rgba(16,18,15,.08);
}
.footer-contact div::before{
  content:"";
  position:absolute;
  left:8px;
  top:10px;
  bottom:10px;
  width:3px;
  border-radius:999px;
  background:linear-gradient(180deg, #ffd400, #35d38a);
}
.footer-contact span{
  display:block;
  font-size:.68rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(16,18,15,.50);
  font-weight:800;
  margin-bottom:4px;
}
.footer-contact strong{
  display:block;
  font-weight:700;
  color:rgba(16,18,15,.92);
}
.footer-contact a{
  color:rgba(16,18,15,.9);
  text-decoration:none;
  font-weight:700;
}
.footer-contact a:hover{color:#0f5f3a}
.footer-col a:hover{color:var(--text);transform:translateX(2px)}
.footer-icons{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.icon-btn{
  width:42px;height:42px;
  border-radius:14px;
  display:grid;place-items:center;
  border:1px solid rgba(16,18,15,.16);
  background:#fff4b3;
  color:#10120f;
  text-decoration:none;
  line-height:0;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.icon-btn svg{
  display:block;
  width:19px;
  height:19px;
}
.icon-btn:hover{
  transform:translateY(-2px);
  border-color:rgba(255,212,0,.55);
  box-shadow:0 16px 40px rgba(255,212,0,.20);
}
.footer-bottom{
  grid-column:1 / -1;
  margin-top:22px;
  padding-top:18px;
  border-top:1px solid rgba(16,18,15,.12);
  display:flex;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  color:var(--muted2);
  font-size:.9rem;
  position:relative;
  z-index:1;
}
.footer-bottom::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-1px;
  height:1px;
  background:linear-gradient(90deg, rgba(16,18,15,.06), rgba(255,212,0,.4), rgba(53,211,138,.35), rgba(16,18,15,.06));
  opacity:.85;
}
.footer-bottom a{color:var(--muted);text-decoration:none}
.footer-bottom a:hover{color:var(--text)}

/* Floating contact widget */
.floating{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:100;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.floating a{
  width:56px;height:56px;
  border-radius:999px;
  display:grid;place-items:center;
  border:1px solid rgba(16,18,15,.14);
  background:#ffffff;
  box-shadow: 0 16px 55px rgba(15,23,42,.16);
  text-decoration:none;
  color:#10120f;
  position:relative;
  line-height:0;
}
.floating a svg{display:block;width:22px;height:22px}
.floating .wa svg{width:22px;height:22px}
.floating a:hover{transform:translateY(-1px)}
.floating .wa{background:#25D366;border-color:rgba(0,0,0,.10);color:white}
.floating a[data-label]::before{
  content: attr(data-label);
  position:absolute;
  right: calc(100% + 12px);
  top:50%;
  transform: translateY(-50%);
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(16,18,15,.12);
  background:#ffffff;
  color:#10120f;
  font-size:.85rem;
  font-weight:750;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
}
.floating a:hover::before{opacity:1}

/* Cookie banner */
.cookie{
  position:fixed;
  left:18px;
  right:18px;
  bottom:18px;
  z-index:120;
  max-width:var(--max);
  margin:0 auto;
  padding:14px;
  border-radius:20px;
  border:1px solid rgba(16,18,15,.12);
  background:#ffffff;
  box-shadow:var(--shadow);
  display:none;
}
.cookie.show{display:block}
.cookie .row{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:flex-start}
.cookie p{margin:6px 0 0;color:var(--muted);max-width:90ch}
.cookie .actions{display:flex;gap:10px;flex-wrap:wrap}

@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important}
  .reveal{opacity:1 !important;transform:none !important}
}

/* Responsive */
@media (max-width: 980px){
  .hero-grid{grid-template-columns:1fr}
  .features{grid-template-columns:1fr}
  .service-grid{grid-template-columns:1fr}
  .service-tiles{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .faq{grid-template-columns:1fr}
  .pricing-grid{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .project-card{grid-template-columns:1fr}
  .stack-grid{grid-template-columns:1fr}
  .tech-grid{grid-template-columns:1fr 1fr}
  .value-grid{grid-template-columns:1fr}
  .sector-grid{grid-template-columns:1fr}
  .tag-grid{grid-template-columns:1fr 1fr}
  .footer-grid{
    grid-template-columns:1fr 1fr;
    padding:28px 18px;
  }
  .footer-grid > div{
    border-left:none;
    padding:6px 10px;
  }
  .footer-bottom{
    flex-direction:column;
    align-items:flex-start;
  }
  .brand-text span{max-width:240px}
  .case-cta{flex-direction:column;align-items:flex-start}
  .process-note{flex-direction:column;align-items:flex-start}
  .faq-cta{flex-direction:column;align-items:flex-start}
  .modal-grid{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
  .stat-grid{grid-template-columns:1fr}
}

@media (max-width: 840px){
  .nav-links{display:none}
  .menu-toggle{display:inline-flex}
  .nav{
    position:relative;
    flex-wrap:wrap;
    height:auto;
    padding:10px 0;
    row-gap:10px;
  }
  .nav-links.open{
    display:flex;
    position:static;
    width:100%;
    flex-basis:100%;
    order:3;
    flex-direction:column;
    gap:6px;
    margin-top:6px;
    padding:10px;
    background:#ffffff;
    border:1px solid rgba(16,18,15,.12);
    border-radius:18px;
    box-shadow:0 16px 40px rgba(15,23,42,.12);
  }
  .nav-links.open a{
    color:#10120f;
    border-color:transparent;
  }
  .nav-links.open a:hover{
    background:rgba(255,212,0,.18);
    border-color:rgba(255,212,0,.35);
    color:#10120f;
  }
  .menu-toggle{
    background:#fff4b3;
    border-color:rgba(16,18,15,.14);
    color:#10120f;
  }
  .orbit{
    top:auto;
    right:12px;
    bottom:12px;
    width:68px;
    height:68px;
    opacity:.45;
    z-index:0;
  }
  .hero-visual{padding-bottom:58px}
  .service-card{display:flex;flex-direction:column}
  .service-arrow{
    position:static;
    align-self:flex-end;
    margin-bottom:8px;
  }
  .steps{gap:12px}
  .step{
    background:#ffffff;
    border:1px solid rgba(16,18,15,.12);
    box-shadow:0 12px 28px rgba(15,23,42,.12);
  }
  .step .num{
    background:#fff4b3;
    border-color:rgba(16,18,15,.14);
  }
  .process-note{
    background:#ffffff;
    border:1px solid rgba(16,18,15,.12);
    box-shadow:0 14px 34px rgba(15,23,42,.10);
  }
  #cita-form.section.sm,
  #meeting-form.section.sm{
    padding-top:28px;
  }
  .section{padding:66px 0}
  .h1{font-size:2.35rem}
}

@media (max-width: 720px){
  .table thead{display:none}
  .table, .table tbody, .table tr, .table td{display:block;width:100%}
  .table tr{
    margin-bottom:12px;
    padding:14px;
    border:1px solid rgba(16,18,15,.12);
    border-radius:16px;
    background:#ffffff;
    box-shadow:0 10px 24px rgba(15,23,42,.10);
  }
  .table td{
    border:0;
    padding:6px 0;
    color:var(--muted);
  }
  .table td::before{
    content:attr(data-label);
    display:block;
    font-size:.68rem;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:rgba(16,18,15,.55);
    font-weight:800;
    margin-bottom:2px;
  }
}

@media (max-width: 520px){
  .container{padding:0 18px}
  .brand-text span{display:none}
  .btn{padding:12px 14px}
  .tag-grid{grid-template-columns:1fr}
  .tech-grid{grid-template-columns:1fr}
  .orbit{display:none}
  .footer-grid{
    grid-template-columns:1fr;
    padding:22px;
  }
  .footer-grid > div{
    border-left:none;
    padding:4px 6px;
  }
  .section{padding:56px 0}
  .section.sm{padding:48px 0}
  .h1{font-size:2.05rem}
  .lead{font-size:1.02rem}
  .hero-actions{flex-direction:column;align-items:stretch}
  .hero-actions .btn{width:100%}
  .cta-row{flex-direction:column;align-items:stretch}
  .cta-row .btn{width:100%}
  .case-logo{width:140px;height:90px}
  .case-logo img{max-width:120px;max-height:68px}
  .service-card{padding:18px}
  .service-card.featured{padding-top:44px}
  .feature{padding:16px}
  .step{padding:18px}
  .price-card{padding:20px}
  .kicker{letter-spacing:.1em}
  .modal-card{padding:18px}
  .modal-close{width:34px;height:34px;font-size:20px}
  .stat{min-height:auto}
}

/* ============================================================
   Blog / Recursos
   ============================================================ */
.breadcrumb{
  font-family:var(--mono);
  font-size:.82rem;
  color:var(--muted2);
  margin:0 0 14px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}
.breadcrumb a{color:var(--muted);text-decoration:none}
.breadcrumb a:hover{color:var(--text)}
.breadcrumb span{opacity:.5}

.blog-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-top:26px;
}
.post-card{
  display:flex;
  flex-direction:column;
  padding:22px;
  border-radius:var(--radius2);
  background:linear-gradient(180deg, rgba(255,255,255,.78), rgba(245,247,241,.70));
  border:1px solid rgba(255,212,0,.14);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  text-decoration:none;
  color:var(--text);
}
.post-card:hover{
  transform:translateY(-4px);
  border-color:rgba(255,212,0,.32);
  box-shadow:0 18px 50px rgba(15,23,42,.18);
}
.post-card .post-tag{
  align-self:flex-start;
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding:5px 10px;
  border-radius:999px;
  background:linear-gradient(135deg, rgba(255,212,0,.22), rgba(53,211,138,.16));
  border:1px solid rgba(255,212,0,.22);
  margin-bottom:14px;
}
.post-card h3{margin:0 0 10px;font-size:1.18rem;line-height:1.25}
.post-card p{margin:0 0 16px;color:var(--muted);flex:1}
.post-card .post-meta{
  font-family:var(--mono);
  font-size:.78rem;
  color:var(--muted2);
  display:flex;
  gap:10px;
  align-items:center;
}
.post-card .read-more{
  margin-top:14px;
  font-weight:600;
  color:var(--text);
  display:inline-flex;
  gap:6px;
  align-items:center;
}

/* Article body */
.post-header{max-width:80ch;margin:0 auto}
.post-header .post-meta{
  font-family:var(--mono);
  font-size:.82rem;
  color:var(--muted2);
  margin-top:14px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.prose{
  max-width:74ch;
  margin:0 auto;
  font-size:1.06rem;
  line-height:1.72;
  color:var(--text);
}
.prose h2{
  font-family:var(--display);
  font-size:1.6rem;
  line-height:1.2;
  margin:42px 0 14px;
  letter-spacing:-.01em;
}
.prose h3{font-size:1.22rem;margin:30px 0 10px}
.prose p{margin:0 0 18px;color:var(--muted)}
.prose ul,.prose ol{margin:0 0 18px;padding-left:22px;color:var(--muted)}
.prose li{margin:0 0 9px}
.prose strong{color:var(--text)}
.prose a{color:var(--text);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(53,211,138,.6)}
.prose a:hover{text-decoration-color:var(--accent2)}
.prose blockquote{
  margin:24px 0;
  padding:14px 20px;
  border-left:3px solid var(--accent2);
  background:var(--panel2);
  border-radius:0 var(--radius) var(--radius) 0;
  color:var(--text);
}
.prose blockquote p{margin:0;color:var(--text)}
.prose .post-key{
  margin:24px 0;
  padding:18px 22px;
  border-radius:var(--radius);
  background:linear-gradient(135deg, rgba(255,212,0,.12), rgba(53,211,138,.08));
  border:1px solid rgba(255,212,0,.20);
}
.prose .post-key h4{margin:0 0 8px;font-size:1.02rem}
.prose .post-key p{margin:0}
.post-cta{
  max-width:74ch;
  margin:44px auto 0;
}

@media (max-width:1000px){
  .blog-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:680px){
  .blog-grid{grid-template-columns:1fr}
  .prose{font-size:1.01rem}
  .prose h2{font-size:1.4rem}
}

/* ============================================================
   Calculadora de ahorro
   ============================================================ */
.calc-wrap{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
  margin-top:26px;
  align-items:start;
}
.calc-panel{
  padding:24px;
  border-radius:var(--radius2);
  background:linear-gradient(180deg, rgba(255,255,255,.82), rgba(245,247,241,.72));
  border:1px solid rgba(255,212,0,.16);
}
.calc-panel h3{margin:0 0 4px;font-size:1.18rem}
.calc-panel .help{margin:0 0 16px;color:var(--muted);font-size:.92rem}
.calc-field{margin-bottom:14px}
.calc-field .label{font-size:.95rem}
.calc-field .unit{font-family:var(--mono);font-size:.78rem;color:var(--muted2);margin-left:6px}
.calc-result{
  background:linear-gradient(135deg, rgba(53,211,138,.12), rgba(255,212,0,.10));
  border:1px solid rgba(53,211,138,.28);
  position:sticky;
  top:90px;
}
.calc-result .kicker{margin-bottom:6px}
.calc-stat-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin:18px 0;
}
.calc-stat{
  padding:16px;
  border-radius:var(--radius);
  background:rgba(255,255,255,.6);
  border:1px solid var(--line);
}
.calc-stat .big{
  font-family:var(--display);
  font-size:1.9rem;
  line-height:1.05;
  letter-spacing:-.01em;
  display:block;
}
.calc-stat .big.accent{color:#1c8f5f}
.calc-stat .cap{margin:6px 0 0;color:var(--muted);font-size:.86rem}
.calc-note{font-size:.82rem;color:var(--muted2);margin:14px 0 0}

@media (max-width:880px){
  .calc-wrap{grid-template-columns:1fr}
  .calc-result{position:static}
}

/* ============================================================
   Resultado en casos + Reseñas (testimonios)
   ============================================================ */
.case-result{
  margin:12px 0 0;
  padding:10px 14px;
  border-radius:12px;
  background:linear-gradient(135deg, rgba(53,211,138,.12), rgba(255,212,0,.10));
  border:1px solid rgba(53,211,138,.24);
  font-size:.92rem;
}
.case-result strong{color:#1c8f5f}

.testi-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-top:26px;
}
.testi-card{
  display:flex;
  flex-direction:column;
  padding:24px;
  border-radius:var(--radius2);
  background:linear-gradient(180deg, rgba(255,255,255,.82), rgba(245,247,241,.72));
  border:1px solid rgba(255,212,0,.16);
}
.testi-stars{color:#f5b301;letter-spacing:2px;font-size:1.05rem;margin-bottom:12px}
.testi-card blockquote{margin:0 0 16px;font-size:1.02rem;line-height:1.6;color:var(--text)}
.testi-author{display:flex;align-items:center;gap:12px;margin-top:auto}
.testi-avatar{
  width:42px;height:42px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--display);font-weight:700;
  background:linear-gradient(135deg, rgba(255,212,0,.30), rgba(53,211,138,.22));
  border:1px solid rgba(255,212,0,.28);
}
.testi-author .who strong{display:block;font-size:.96rem}
.testi-author .who span{display:block;font-size:.84rem;color:var(--muted2)}

@media (max-width:980px){.testi-grid{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.testi-grid{grid-template-columns:1fr}}