:root {
  --bg: #0b0d12;
  --panel: #121621;
  --panel-2: #171c29;
  --text: #f4f7fb;
  --muted: #aab4c3;
  --line: #273044;
  --accent: #72e3b3;
  --accent-2: #b6f5d8;
  --warning: #ffd479;
  --max: 1120px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color-scheme: dark;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; background: radial-gradient(circle at 20% 0%, #182238 0, transparent 32rem), var(--bg); color:var(--text); line-height:1.6; }
a { color:inherit; }
.container { width:min(calc(100% - 2rem), var(--max)); margin-inline:auto; }
.nav { display:flex; align-items:center; justify-content:space-between; min-height:72px; gap:1rem; }
.wordmark { text-decoration:none; font-weight:800; letter-spacing:-.04em; font-size:1.35rem; }
.wordmark span { color:var(--accent); }
.navlinks { display:flex; gap:1rem; align-items:center; flex-wrap:wrap; }
.navlinks a { text-decoration:none; color:var(--muted); font-size:.95rem; }
.navlinks a:hover { color:var(--text); }
.hero { padding:6rem 0 4rem; }
.eyebrow { display:inline-flex; padding:.35rem .65rem; border:1px solid var(--line); border-radius:999px; color:var(--accent-2); background:rgba(114,227,179,.06); font-size:.82rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
h1 { font-size:clamp(2.6rem, 7vw, 5.4rem); line-height:.98; letter-spacing:-.055em; margin:1.2rem 0; max-width:13ch; }
h2 { font-size:clamp(1.8rem, 4vw, 3rem); line-height:1.08; letter-spacing:-.035em; margin:0 0 1rem; }
h3 { margin:.2rem 0 .55rem; letter-spacing:-.02em; }
.lede { max-width:760px; font-size:clamp(1.05rem, 2vw, 1.28rem); color:var(--muted); }
.actions { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2rem; }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:.72rem 1.05rem; border-radius:11px; border:1px solid var(--line); text-decoration:none; font-weight:750; background:var(--panel-2); }
.btn.primary { background:var(--accent); color:#07130e; border-color:transparent; }
.btn.disabled { opacity:.55; pointer-events:none; }
.micro { margin-top:.8rem; color:var(--muted); font-size:.9rem; }
.section { padding:4.5rem 0; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.product-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.card { background:linear-gradient(180deg, rgba(255,255,255,.025), transparent), var(--panel); border:1px solid var(--line); border-radius:18px; padding:1.35rem; }
.card p { color:var(--muted); margin-bottom:0; }
.product-card { display:flex; flex-direction:column; gap:1rem; min-height:330px; }
.product-card .tag { color:var(--accent-2); font-size:.82rem; font-weight:700; text-transform:uppercase; letter-spacing:.07em; }
.product-card .actions { margin-top:auto; }
.compact-list { display:grid; gap:.45rem; padding-left:1.15rem; color:var(--muted); }
.split { display:grid; grid-template-columns:1.1fr .9fr; gap:2rem; align-items:start; }
.feature-list { display:grid; gap:.75rem; padding:0; list-style:none; }
.feature-list li { display:flex; gap:.75rem; color:var(--muted); }
.feature-list li::before { content:"✓"; color:var(--accent); font-weight:900; }
.screenshot { min-height:360px; display:grid; place-items:center; border:1px dashed #43506a; border-radius:18px; background:linear-gradient(135deg, #151c2a, #0f131c); color:var(--muted); text-align:center; padding:2rem; }
.screenshot-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin-top:2rem; }
.screenshot-frame { margin:0; overflow:hidden; border:1px solid var(--line); border-radius:18px; background:var(--panel); }
.screenshot-frame img { display:block; width:100%; height:auto; aspect-ratio:16/10; object-fit:cover; background:#0f131c; }
.screenshot-frame figcaption { padding:1rem; color:var(--muted); font-size:.94rem; }
.shot-placeholder { aspect-ratio:16/10; display:grid; place-content:center; gap:.35rem; padding:1.5rem; text-align:center; background:linear-gradient(135deg,#182132,#0e121a); border-bottom:1px solid var(--line); color:var(--muted); }
.shot-placeholder strong { color:var(--text); font-size:1.1rem; }
.pending-shot { border-style:dashed; }
.emphasis-card { min-height:100%; }
.language-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.7rem; }
.language-grid span { border:1px solid var(--line); border-radius:11px; padding:.7rem .85rem; background:var(--panel-2); color:var(--muted); }
.price { font-size:3.4rem; font-weight:850; letter-spacing:-.05em; line-height:1; }
.price small { font-size:1rem; color:var(--muted); font-weight:600; letter-spacing:0; }
.faq { display:grid; gap:.7rem; }
details { border:1px solid var(--line); border-radius:13px; background:var(--panel); padding:1rem 1.1rem; }
summary { cursor:pointer; font-weight:750; }
details p { color:var(--muted); }
.notice { border-left:3px solid var(--warning); padding:.7rem 1rem; background:rgba(255,212,121,.06); color:#f2dfae; }
footer { border-top:1px solid var(--line); padding:2rem 0 3rem; color:var(--muted); }
.footer-row { display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.footer-links { display:flex; gap:1rem; flex-wrap:wrap; }
.kicker { color:var(--accent-2); font-weight:750; }
.table-wrap { overflow:auto; border:1px solid var(--line); border-radius:14px; }
table { width:100%; border-collapse:collapse; min-width:620px; }
th,td { padding:.85rem 1rem; text-align:left; border-bottom:1px solid var(--line); }
th { color:var(--muted); font-size:.86rem; }
code { background:#161c29; padding:.12rem .35rem; border-radius:5px; }
@media (max-width: 900px) {
  .screenshot-gallery { grid-template-columns:1fr; }
}
@media (max-width: 820px) {
  .grid-3, .split, .product-grid { grid-template-columns:1fr; }
  .hero { padding-top:4rem; }
  .navlinks .optional { display:none; }
}

.product-hero { padding-bottom: 2.5rem; }
.hero-shot-wrap { padding-top: 0; }
.hero-shot { box-shadow: 0 24px 70px rgba(0,0,0,.35); }
.hero-shot img { aspect-ratio: auto; }
.feature-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.feature-card { min-height: 220px; }
.product-screenshots { display:grid; grid-template-columns:1.35fr .65fr; gap:1rem; margin-top:2rem; align-items:start; }
.product-screenshots .screenshot-frame img { aspect-ratio:auto; object-fit:contain; }
.pdf-frame img { max-height:620px; object-fit:contain; background:white; }
.language-card, .local-first-card { display:grid; grid-template-columns:1.05fr .95fr; gap:2rem; align-items:center; }
.simple-points { display:grid; gap:.7rem; }
.simple-points span { border:1px solid var(--line); border-radius:11px; padding:.8rem .9rem; background:var(--panel-2); color:var(--muted); }
@media (max-width: 820px) {
  .feature-grid, .product-screenshots, .language-card, .local-first-card { grid-template-columns:1fr; }
}


/* Screenshot enlarge + lightbox */
.shot-actions {
  display:flex;
  justify-content:flex-end;
  padding:.75rem 1rem 0;
  background:var(--panel);
}
.hero-shot .shot-actions {
  padding:.8rem 1rem;
}
.enlarge-link {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:.48rem .75rem;
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--panel-2);
  color:var(--text);
  text-decoration:none;
  font-size:.86rem;
  font-weight:750;
}
.enlarge-link:hover {
  border-color:var(--accent);
  color:var(--accent-2);
}
.lightbox[hidden] { display:none; }
.lightbox {
  position:fixed;
  inset:0;
  z-index:1000;
  display:grid;
  place-items:center;
  padding:.5rem;
  background:rgba(3,5,8,.97);
  cursor:zoom-out;
}
.lightbox-image {
  display:block;
  width:98vw;
  height:96vh;
  max-width:none;
  max-height:none;
  object-fit:contain;
  border-radius:0;
  box-shadow:none;
  cursor:default;
}
.lightbox-close {
  position:fixed;
  top:1rem;
  right:1rem;
  z-index:1001;
  width:44px;
  height:44px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:999px;
  background:rgba(20,24,32,.92);
  color:#fff;
  font:inherit;
  font-size:1.8rem;
  line-height:1;
  cursor:pointer;
}
.lightbox-close:hover { background:#273044; }
body.lightbox-open { overflow:hidden; }
@media (max-width:640px) {
  .lightbox { padding:.75rem; }
  .shot-actions { justify-content:stretch; }
  .enlarge-link { width:100%; }
}


/* TinyRental highlight cards + direct screenshot click */
.trust-strip {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
  padding-top:0;
  padding-bottom:0;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.trust-strip > div {
  padding:1.35rem;
  border:1px solid var(--line);
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.025), transparent), var(--panel);
}
.trust-strip strong,
.trust-strip span {
  display:block;
}
.trust-strip span {
  margin-top:.25rem;
  color:var(--muted);
}

.shot-open {
  position:relative;
  display:block;
  width:100%;
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  cursor:zoom-in;
  text-align:inherit;
}
.shot-open img {
  display:block;
  width:100%;
  height:auto;
}
.shot-open:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:-2px;
}

@media (max-width:820px) {
  .trust-strip {
    grid-template-columns:1fr;
  }
}


/* Offer Desk canonical screenshot gallery */
.offerdesk-gallery {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
  margin-top:2rem;
  align-items:start;
}
.offerdesk-gallery .screenshot-frame img {
  aspect-ratio:auto;
  object-fit:contain;
}
.offerdesk-gallery .screenshot-frame:last-child {
  grid-column:1 / -1;
}
.offerdesk-gallery .screenshot-frame:last-child .shot-open {
  max-width:760px;
  margin-inline:auto;
}
@media (max-width:820px) {
  .offerdesk-gallery {
    grid-template-columns:1fr;
  }
  .offerdesk-gallery .screenshot-frame:last-child {
    grid-column:auto;
  }
  .offerdesk-gallery .screenshot-frame:last-child .shot-open {
    max-width:none;
  }
}


/* Product page parity additions */
.demo-placeholder {
  display:grid;
  place-items:center;
  text-align:center;
  padding:2rem;
  color:var(--muted);
}
.demo-placeholder > div {
  display:grid;
  gap:.35rem;
}
.demo-placeholder strong {
  color:var(--text);
  font-size:1.15rem;
}
.gallery-grid:has(.gallery-card:nth-child(3):last-child) .gallery-card:last-child {
  grid-column:1 / -1;
  width:min(100%, 760px);
  margin-inline:auto;
}
@media (max-width:820px) {
  .gallery-grid:has(.gallery-card:nth-child(3):last-child) .gallery-card:last-child {
    grid-column:auto;
    width:100%;
  }
}