
:root {
  --brand: #b40017;
  --brand-dark: #7e0011;
  --ink: #0f172a;
  --muted: #475569;
  --line: #dbe3ef;
  --soft: #f8fafc;
  --panel: #ffffff;
  --accent: #e11d48;
  --success: #0f766e;
  --shadow: 0 20px 60px rgba(15, 23, 42, 0.10);
  --radius: 24px;
}
html { scroll-behavior: smooth; }
body {
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: linear-gradient(180deg, #fff 0%, #f7f9fc 100%);
  line-height: 1.65;
}
a { color: var(--brand); text-decoration: none; }
a:hover { color: var(--brand-dark); }
img { max-width: 100%; height: auto; }
.bg-grid {
  background-image: radial-gradient(circle at 1px 1px, rgba(15,23,42,.06) 1px, transparent 0);
  background-size: 24px 24px;
}
.navbar {
  backdrop-filter: saturate(180%) blur(14px);
  background: rgba(255,255,255,.92);
  border-bottom: 1px solid rgba(15,23,42,.06);
}
.navbar-brand { font-weight: 800; letter-spacing: -.03em; }
.brand-mark {
  display:inline-flex; align-items:center; gap:.7rem;
}
.brand-mark__box {
  width: 40px; height: 40px; border-radius: 12px;
  background: linear-gradient(135deg, var(--brand), #ff4d6d);
  box-shadow: 0 10px 28px rgba(180,0,23,.24);
}
.hero {
  padding: 7rem 0 5rem;
  position: relative;
  overflow: hidden;
}
.hero:before, .hero:after {
  content:""; position:absolute; border-radius:999px; filter: blur(50px); opacity:.35; pointer-events:none;
}
.hero:before { width: 28rem; height: 28rem; top: -8rem; right: -7rem; background:#fecdd3; }
.hero:after { width: 24rem; height: 24rem; bottom: -10rem; left: -8rem; background:#dbeafe; }
.eyebrow {
  display:inline-flex; align-items:center; gap:.5rem; border:1px solid rgba(180,0,23,.15);
  background: rgba(255,255,255,.86); border-radius:999px; padding:.45rem .85rem; font-size:.9rem; color:var(--brand); font-weight:700;
}
.display-title {
  font-size: clamp(2.3rem, 5vw, 4.7rem);
  line-height: 1.02;
  letter-spacing: -.05em;
  font-weight: 900;
}
.lead-soft { font-size: 1.15rem; color: var(--muted); max-width: 52rem; }
.hero-panel, .card-float, .metric, .timeline, .faq-item, .job-card, .contact-card, .cta-band {
  background: rgba(255,255,255,.9);
  border: 1px solid rgba(15,23,42,.06);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.hero-visual {
  padding: 1.2rem;
  position: relative;
}
.visual-panel {
  border-radius: 22px;
  background: linear-gradient(135deg, #0f172a, #1e293b);
  color:#fff; min-height: 420px; position:relative; overflow:hidden; padding:1.4rem;
}
.visual-panel .orb { position:absolute; border-radius:999px; filter: blur(18px); opacity:.65; }
.visual-panel .orb.one { width:170px;height:170px;background:#60a5fa;top:-30px;right:-30px; }
.visual-panel .orb.two { width:160px;height:160px;background:#fb7185;bottom:-30px;left:-30px; }
.kpi-grid { display:grid; grid-template-columns: repeat(2,1fr); gap:1rem; margin-top:1rem; }
.kpi { background: rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); border-radius:18px; padding:1rem; }
.kpi strong { font-size:1.4rem; display:block; }
.section { padding: 5rem 0; }
.section-title { font-weight: 900; letter-spacing: -.04em; font-size: clamp(1.8rem,3vw,3rem); }
.section-sub { color: var(--muted); max-width: 44rem; }
.card-float { padding: 1.4rem; height: 100%; }
.card-float h3 { font-size:1.1rem; font-weight:800; }
.icon-badge {
  width: 52px; height: 52px; border-radius: 16px; display:grid; place-items:center;
  background: linear-gradient(135deg, rgba(180,0,23,.12), rgba(225,29,72,.22)); color: var(--brand); font-weight: 800; margin-bottom: 1rem;
}
.metric { padding: 1.3rem; height:100%; }
.metric-value { font-size: 2rem; font-weight: 900; letter-spacing: -.05em; }
.metric small, .muted { color: var(--muted); }
.logo-strip {
  display:grid; gap:1rem; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}
.logo-pill {
  border:1px solid var(--line); border-radius:18px; padding:1rem 1.2rem; background:#fff; font-weight:800; text-align:center;
}
.cta-band { padding: 2rem; }
.footer {
  padding: 4rem 0 2.5rem; background:#0f172a; color:#dbe3ef; margin-top:4rem;
}
.footer a { color:#fff; }
.footer .small { color:#b7c3d7; }
.breadcrumb-wrap { padding-top: 6.5rem; }
.breadcrumb { margin-bottom:0; }
.page-hero { padding: 2rem 0 2.5rem; }
.list-check { list-style:none; padding-left:0; }
.list-check li { position:relative; padding-left:1.6rem; margin-bottom:.55rem; }
.list-check li:before { content:'•'; position:absolute; left:0; color:var(--brand); font-weight:900; }
.timeline { padding:1.4rem; }
.timeline-step { border-left: 2px solid rgba(180,0,23,.2); padding-left: 1rem; margin-left: .5rem; margin-bottom:1rem; }
.timeline-step strong { display:block; }
.faq-item { padding: 1.2rem 1.3rem; margin-bottom: 1rem; }
.job-card { padding:1.35rem; height:100%; }
.contact-card { padding:1.35rem; height:100%; }
.hero-actions .btn { padding:.9rem 1.2rem; border-radius: 14px; font-weight:700; }
.btn-brand { background: var(--brand); color:#fff; border:none; }
.btn-brand:hover { background: var(--brand-dark); color:#fff; }
.btn-lightline { border:1px solid rgba(15,23,42,.12); background:#fff; }
.tag-cloud { display:flex; flex-wrap:wrap; gap:.65rem; }
.tag-cloud span { border:1px solid var(--line); background:#fff; padding:.55rem .8rem; border-radius:999px; font-size:.95rem; }
.feature-ribbon { display:flex; gap: .8rem; flex-wrap:wrap; margin-top: 1.2rem; }
.feature-ribbon span { background:#fff; border:1px solid var(--line); border-radius:999px; padding:.55rem .9rem; font-weight:600; }
.notice { border-left:4px solid var(--brand); background:#fff; border-radius:18px; padding:1rem 1.1rem; }
.bg-accent {
  background: linear-gradient(135deg, #fff1f2, #eff6ff);
}
.sticky-cta {
  position: fixed; right: 18px; bottom: 18px; z-index: 1020;
}
.sticky-cta .btn { border-radius:999px; box-shadow: var(--shadow); }
@media (max-width: 991.98px) {
  .hero { padding-top: 6rem; }
  .sticky-cta { right: 12px; bottom: 12px; }
}


.app-card {
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.9));
  border: 1px solid rgba(15,23,42,.08);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 1.6rem;
}
.app-card--hero {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.app-card__top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.app-pill {
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:.5rem .85rem;
  background: rgba(180,0,23,.08);
  color: var(--brand);
  font-weight: 800;
}
.app-price {
  font-size: clamp(2rem, 4vw, 3.4rem);
  line-height: 1;
  letter-spacing: -.05em;
  font-weight: 900;
}
.app-price small,
.price-inline {
  font-size: 1rem;
  color: var(--muted);
}

.download-card h2 { font-size: 1.15rem; font-weight: 800; }
.meta-line { color: var(--muted); font-size: .92rem; }
.cookie-settings-link { color:#fff; text-decoration:none; background:none; border:0; }
.cookie-settings-link:hover { color:#fff; opacity:.85; }
.cookie-banner { position: fixed; left: 20px; right: 20px; bottom: 20px; z-index: 1080; max-width: 1120px; margin: 0 auto; background: rgba(15,23,42,.96); color: #e5eefb; border: 1px solid rgba(255,255,255,.1); border-radius: 24px; box-shadow: 0 24px 70px rgba(0,0,0,.28); }
.cookie-banner__inner { padding: 1.25rem; }
.cookie-banner__title { font-size: 1.1rem; font-weight: 800; color: #fff; }
.cookie-banner__text { color: #cbd5e1; font-size: .98rem; margin-bottom: 0; }
.cookie-banner__actions { display:flex; gap:.75rem; flex-wrap:wrap; }
.cookie-banner__chips { display:flex; gap:.6rem; flex-wrap:wrap; margin-top:.9rem; }
.cookie-chip { border:1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.04); color:#fff; border-radius:999px; padding:.45rem .8rem; font-size:.86rem; }
.cookie-modal-backdrop { position: fixed; inset: 0; z-index: 1075; background: rgba(2,6,23,.54); display:none; }
.cookie-modal-backdrop.is-open { display:block; }
.cookie-panel { position: fixed; z-index: 1085; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(720px, calc(100vw - 32px)); background: #fff; border-radius: 28px; box-shadow: var(--shadow); border: 1px solid rgba(15,23,42,.08); display:none; }
.cookie-panel.is-open { display:block; }
.cookie-panel__body { padding: 1.5rem; }
.cookie-option { border:1px solid var(--line); border-radius:18px; padding:1rem 1rem; }
.cookie-option + .cookie-option { margin-top: .9rem; }
.form-switch .form-check-input { width: 3rem; height: 1.6rem; }
@media (max-width: 767.98px) { .cookie-banner { left: 12px; right: 12px; bottom: 12px; } .cookie-banner__inner { padding: 1rem; } }


.navbar .nav-link.active { color: var(--brand); font-weight: 700; }
.navbar-toggler { border: 1px solid rgba(15,23,42,.12); }
.partner-slide { display:flex; align-items:center; justify-content:center; min-height:92px; border:1px dashed rgba(15,23,42,.16); border-radius:20px; background:linear-gradient(180deg,#fff,#f8fafc); font-weight:800; color:var(--muted); padding:1rem; text-align:center; }
.partner-slide small { display:block; font-weight:600; color:#64748b; margin-top:.15rem; }
.owl-stage { display:flex; align-items:stretch; }
.owl-carousel .owl-item img { width:auto; }
.owl-theme .owl-dots .owl-dot span { background:#cbd5e1; }
.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background: var(--brand); }
.solution-card { background: linear-gradient(180deg,#fff,#fff7f8); border:1px solid rgba(180,0,23,.08); border-radius:24px; padding:1.45rem; height:100%; box-shadow: var(--shadow); }
.reference-card { border:1px solid var(--line); background:#fff; border-radius:20px; padding:1.2rem; height:100%; }
.reference-card .eyebrow { font-size:.78rem; }
.person-card { background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:24px; padding:1.4rem; box-shadow: var(--shadow); height:100%; }
.person-card h3 { font-size:1.1rem; font-weight:800; }
.person-role { color:var(--brand); font-weight:700; margin-bottom:.55rem; }
.form-panel { background:rgba(255,255,255,.92); border:1px solid rgba(15,23,42,.06); border-radius:28px; box-shadow: var(--shadow); padding:1.5rem; }
.confirm-shell { min-height:calc(100vh - 330px); display:flex; align-items:center; }
.check-badge { width:72px; height:72px; border-radius:22px; display:grid; place-items:center; background:linear-gradient(135deg, rgba(15,118,110,.16), rgba(34,197,94,.18)); color:var(--success); font-size:1.7rem; font-weight:900; }
.anchor-grid { display:grid; gap:1rem; grid-template-columns: repeat(auto-fit, minmax(230px,1fr)); }
.highlight-box { background:linear-gradient(135deg,#fff1f2,#eff6ff); border:1px solid rgba(15,23,42,.08); border-radius:24px; padding:1.25rem; }
.shop-pill { display:inline-flex; align-items:center; gap:.4rem; border-radius:999px; padding:.5rem .85rem; background:rgba(15,23,42,.06); font-weight:700; }
