:root{
  --primary:#1D2D44;
  --primaryDark:#162338;
  --accent:#4CAF50;
  --accentDark:#3E9B41;
  --gold:#FFC107;

  --bg:#ffffff;
  --bg2:#ffffff; /* used later in gradient block */
  --soft:#F5F8FC;

  --text:#0f172a;
  --muted:#5b6476;
  --line:rgba(15,23,42,0.12);
  --shadow: 0 18px 55px rgba(18, 18, 60, 0.12);
  --r16:16px;
  --r22:22px;
  --max:1180px;
  --font:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --fontDisplay:'Manrope','Inter',system-ui,sans-serif;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:var(--font);
  color:var(--text);
  background:
    radial-gradient(900px 420px at 18% -10%, rgba(108,44,242,.14), transparent 60%),
    radial-gradient(800px 420px at 85% 0%, rgba(225,29,72,.08), transparent 55%),
    #fff;
}
a{color:inherit}
.is-wrap{width:min(var(--max), calc(100% - 40px)); margin:0 auto}
/*.is-main{padding-bottom:50px}
*/
/* Header */
.is-header{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.is-header__inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0}
.is-brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.is-brand__name{font-family:var(--fontDisplay);font-weight:800;letter-spacing:-.02em}
.is-nav .is-menu{list-style:none;display:flex;gap:12px;margin:0;padding:0}
.is-nav .is-menu a{text-decoration:none;font-size:13px;color:rgba(15,23,42,.72);padding:8px 10px;border-radius:999px}
.is-nav .is-menu a:hover{background:rgba(108,44,242,.08);color:rgba(15,23,42,.92)}

/* Buttons */
.is-btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:10px 14px;border-radius:12px;
  font-weight:800;font-size:13px;text-decoration:none;
  border:1px solid transparent;cursor:pointer;
  transition:transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease, opacity .12s ease;
}
.is-btn:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(0,0,0,.08)}
.is-btn:active{transform:translateY(0)}
.is-btn--primary{background:linear-gradient(135deg,var(--accent),#f43f5e);color:#fff}
.is-btn--light{background:rgba(108,44,242,.10);border-color:rgba(108,44,242,.20);color:rgba(15,23,42,.92)}
.is-btn--ghost{background:transparent;border-color:rgba(15,23,42,.16);color:rgba(15,23,42,.88)}

.is-pill{
  display:inline-flex;align-items:center;
  padding:7px 10px;border-radius:999px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.22);
  font-weight:800;font-size:12px;color:#fff
}

/* Typography */
.is-h1{font-family:var(--fontDisplay);font-weight:900;letter-spacing:-.03em;line-height:1.05;margin:10px 0 10px;font-size:clamp(28px,3.2vw,44px)}
.is-h2{font-family:var(--fontDisplay);font-weight:900;letter-spacing:-.02em;margin:0 0 6px;font-size:24px}
.is-h3{font-family:var(--fontDisplay);font-weight:900;margin:0 0 8px;font-size:18px}
.is-sub{margin:0 0 16px;color:rgba(255,255,255,.84);font-size:15px;max-width:62ch}
.is-muted{color:rgba(15,23,42,.62);font-size:13px;line-height:1.6}

/* Hero */
/* Hero */
.is-hero{
  background:linear-gradient(180deg,var(--primary) 0%, var(--primaryDark) 55%, var(--primary) 100%);
  color:#fff;
  padding:46px 0 34px;
}
.is-hero__inner{display:grid;grid-template-columns:1.15fr .85fr;gap:22px;align-items:center}
.is-hero__cta{display:flex;gap:12px;flex-wrap:wrap}
.is-hero__meta{display:flex;gap:14px;flex-wrap:wrap;margin-top:14px;font-size:13px;color:rgba(255,255,255,.90)}
.is-hero__card{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18);border-radius:18px;padding:16px}
.is-heroMock{border-radius:16px;background:#fff;overflow:hidden;box-shadow:0 18px 40px rgba(0,0,0,.18)}
.is-heroMock__top{padding:10px 12px;background:#f1f5f9;display:flex;gap:6px}
.is-heroMock__dot{width:10px;height:10px;border-radius:99px;background:#cbd5e1}
.is-heroMock__body{padding:14px;display:grid;gap:10px}
.is-heroMock__line{height:10px;border-radius:999px;background:#e2e8f0}
.is-heroMock__line.w1{width:72%}
.is-heroMock__line.w2{width:54%}
.is-heroMock__row{height:14px;border-radius:12px;background:#edf2f7}
.is-heroMock__total{height:18px;border-radius:999px;background:#e2e8f0;width:45%;justify-self:end}
.is-hero__cardNote{margin-top:10px;font-size:12px;color:rgba(255,255,255,.88)}


/* Tool section */
.is-tool{padding:26px 0 44px;}
.is-tool__title{text-align:center;margin-bottom:14px}
.is-tool__title .is-muted{max-width:80ch;margin:0 auto}

/* Band */
.is-band{background:linear-gradient(90deg,var(--primary),var(--primaryDark));color:#fff;padding:26px 0}
.is-band__inner{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;flex-wrap:wrap}
.is-band__left{max-width:50ch}
.is-band__text{margin:6px 0 0;color:rgba(255,255,255,.85)}
.is-band__cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;flex:1;min-width:320px}
.is-miniCard{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:16px;padding:12px}
.is-avatar{width:44px;height:44px;border-radius:999px;background:rgba(255,255,255,.22);margin-bottom:8px}
.is-miniCard__name{font-weight:900;font-size:13px}
.is-miniCard__text{font-size:12px;margin-top:6px;color:rgba(255,255,255,.86)}

.is-miniCard{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:16px;padding:12px}
.is-avatar{width:44px;height:44px;border-radius:999px;background:rgba(255,255,255,.22);margin-bottom:8px}
.is-miniCard__name{font-weight:900;font-size:13px}
.is-miniCard__text{font-size:12px;margin-top:6px;color:rgba(255,255,255,.86)}

/* Logo chips */
.is-logos{padding:22px 0}
.is-logos__row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.is-logoChip{padding:8px 12px;border-radius:999px;border:1px solid var(--line);background:#fff;box-shadow:0 10px 24px rgba(0,0,0,.06);font-weight:900;font-size:12px;color:rgba(15,23,42,.78)}

/* Sections */
.is-section{padding:44px 0}
.is-section--soft{background:var(--soft);border-top:1px solid rgba(108,44,242,.08);border-bottom:1px solid rgba(108,44,242,.08)}
.is-head{text-align:center;margin-bottom:18px}

.is-tabs{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:10px 0 16px}
.is-tab{padding:10px 14px;border-radius:999px;border:1px solid rgba(108,44,242,.18);background:#fff;font-weight:900;cursor:pointer}
.is-tab--active{background:rgba(108,44,242,.10)}

.is-templateGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.is-template{border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:var(--shadow);padding:14px;display:none}
.is-template--show{display:block}
.is-template__shot{height:220px;border-radius:14px;background:linear-gradient(180deg, rgba(108,44,242,.10), rgba(225,29,72,.06)), repeating-linear-gradient(180deg, rgba(15,23,42,.10), rgba(15,23,42,.10) 2px, transparent 2px, transparent 12px)}
.is-template__cap{margin-top:10px;font-weight:800;font-size:13px;color:rgba(15,23,42,.76)}

.is-features{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.is-feature{border:1px solid rgba(108,44,242,.14);background:#fff;border-radius:18px;padding:14px;box-shadow:0 14px 30px rgba(0,0,0,.05)}
.is-ico{width:38px;height:38px;border-radius:14px;background:linear-gradient(135deg, rgba(108,44,242,.22), rgba(225,29,72,.14));margin-bottom:10px}
.is-feature__t{font-family:var(--fontDisplay);font-weight:900}
.is-feature__d{margin-top:4px;color:rgba(15,23,42,.62);font-size:13px;line-height:1.55}

/* FAQ */
.is-faq{max-width:860px;margin:0 auto;display:grid;gap:10px}
.is-faq__item{border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 12px 28px rgba(0,0,0,.05);padding:12px 14px}
.is-faq__q{cursor:pointer;font-weight:900;font-family:var(--fontDisplay)}
.is-faq__a{margin-top:10px;color:rgba(15,23,42,.70);font-size:13px;line-height:1.65}

/* SEO blocks */
.is-section--seo{background:#fff;border-top:1px solid rgba(15,23,42,.08)}
.is-seoGrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.is-seoBlock{border:1px solid rgba(108,44,242,.14);background:linear-gradient(180deg, rgba(108,44,242,.04), rgba(225,29,72,.02));border-radius:18px;padding:16px}
.is-seoText{color:rgba(15,23,42,.70);line-height:1.7;margin:10px 0 14px}

/* Footer */
.is-footer{background:#0b1020;color:rgba(255,255,255,.92);margin-top:40px}
.is-footer__grid{padding:34px 0 10px;display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:14px}
.is-footer__title{font-family:var(--fontDisplay);font-weight:900;margin-bottom:10px}
.is-footer__text{color:rgba(255,255,255,.72);font-size:13px;line-height:1.65}
.is-footer__link{display:block;text-decoration:none;color:rgba(255,255,255,.78);font-size:13px;padding:6px 0}
.is-footer__link:hover{color:#fff}
.is-footer__bottom{border-top:1px solid rgba(255,255,255,.10);padding:14px 0 18px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:rgba(255,255,255,.78);font-size:13px}
.is-footer__muted{color:rgba(255,255,255,.62)}

.is-fab{
  position:fixed;right:16px;bottom:16px;width:46px;height:46px;border-radius:999px;border:0;cursor:pointer;color:#fff;font-weight:900;
  background:linear-gradient(135deg,var(--primary),var(--accent));
  box-shadow:0 14px 30px rgba(0,0,0,.22);
}

/* Responsive */
@media (max-width:980px){
  .is-hero__inner{grid-template-columns:1fr}
  .is-band__cards{grid-template-columns:1fr}
  .is-templateGrid{grid-template-columns:1fr}
  .is-features{grid-template-columns:1fr 1fr}
  .is-seoGrid{grid-template-columns:1fr}
  .is-footer__grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .is-wrap{width:calc(100% - 26px)}
  .is-features{grid-template-columns:1fr}
  .is-footer__grid{grid-template-columns:1fr}
}

/* ===== Invoice Studio (full module styles) ===== */
/* ===== Base ===== */
*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family: var(--font);
  color: var(--text);
  background:
    radial-gradient(1200px 600px at 20% -10%, rgba(109,94,252,.35), transparent 60%),
    radial-gradient(1000px 500px at 90% 0%, rgba(34,211,238,.25), transparent 55%),
    radial-gradient(900px 500px at 60% 110%, rgba(189,158,94,.12), transparent 55%),
    linear-gradient(180deg, var(--bg), var(--bg2));
}

a{ color: inherit; }
img{ max-width:100%; height:auto; display:block; }
.inspk-container{
  width: min(var(--max), calc(100% - 40px));
  margin: 0 auto;
}

.inspk-main{ padding: 18px 0 56px; }

/* ===== Header ===== */
.inspk-header{
  position: sticky;
  top:0;
  z-index: 50;
  background: rgba(11,16,32,0.72);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
}
.inspk-header__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding: 14px 0;
}
.inspk-brand{ display:flex; flex-direction:column; gap:2px; }
.inspk-brand__link{ text-decoration:none; display:inline-flex; align-items:center; gap:10px; }
.inspk-brand__name{
  font-family: var(--fontDisplay);
  letter-spacing: -0.02em;
  font-weight: 700;
  font-size: 18px;
}
.inspk-brand__tag{ color: var(--muted); font-size: 12px; }

.inspk-nav .inspk-menu{
  list-style:none;
  display:flex;
  gap: 14px;
  padding:0;
  margin:0;
  align-items:center;
}
.inspk-nav .inspk-menu a{
  text-decoration:none;
  font-size: 13px;
  padding: 8px 10px;
  border-radius: 999px;
  color: var(--muted);
  border: 1px solid transparent;
}
.inspk-nav .inspk-menu a:hover{
  color: var(--text);
  border-color: var(--line);
  background: rgba(255,255,255,0.03);
}

/* ===== Hero ===== */
.inspk-hero{ padding: 40px 0 12px; }
.inspk-hero__grid{
  display:grid;
  grid-template-columns: 1.25fr .75fr;
  gap: 22px;
  align-items: stretch;
}
.inspk-h1{
  font-family: var(--fontDisplay);
  margin:0 0 10px;
  font-size: clamp(28px, 3.3vw, 44px);
  letter-spacing: -0.03em;
  line-height: 1.05;
}
.inspk-sub{
  margin:0 0 16px;
  color: var(--muted);
  font-size: 15px;
  max-width: 52ch;
}
.inspk-sub__small{ color: rgba(255,255,255,0.72); }
.inspk-hero__badges{ display:flex; gap:10px; flex-wrap:wrap; }
.inspk-badge{
  font-size: 12px;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,0.03);
}

.inspk-hero__card{
  border: 1px solid var(--line);
  border-radius: var(--r22);
  background: linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.015));
  box-shadow: var(--shadow);
  padding: 16px;
}
.inspk-mini{
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(109,94,252,.12), rgba(34,211,238,.06));
  border: 1px solid rgba(255,255,255,0.09);
  padding: 14px;
}
.inspk-mini__top{ display:flex; gap:12px; align-items:center; }
.inspk-mini__logo{
  width: 42px; height: 42px; border-radius: 14px;
  background: linear-gradient(135deg, var(--primary), var(--primary2));
}
.inspk-mini__meta{ flex:1; display:grid; gap:8px; }
.inspk-mini__line{
  height: 10px; border-radius: 999px;
  background: rgba(255,255,255,0.14);
}
.inspk-mini__rows{ margin-top: 14px; display:grid; gap:10px; }
.inspk-mini__row{ height: 14px; border-radius: 999px; background: rgba(255,255,255,0.10); }
.inspk-mini__total{ margin-top: 16px; display:flex; justify-content:flex-end; }
.inspk-mini__pill{ width: 45%; height: 16px; border-radius: 999px; background: rgba(255,255,255,0.16); }
.inspk-mini__caption{ margin: 10px 2px 0; color: var(--muted); font-size: 12px; }

/* ===== Section ===== */
.inspk-section{ padding: 28px 0 56px; }
.inspk-h2{
  font-family: var(--fontDisplay);
  font-size: 22px;
  margin: 0 0 6px;
  letter-spacing: -0.02em;
}
.inspk-h3{
  font-family: var(--fontDisplay);
  font-size: 18px;
  margin: 0 0 8px;
}
.inspk-muted{ color: var(--muted); font-size: 13px; line-height: 1.55; }

/* ===== Cards / Buttons ===== */
.inspk-card{
  border: 1px solid var(--line);
  background: rgba(255,255,255,0.03);
  border-radius: var(--r22);
  box-shadow: var(--shadow);
  padding: 18px;
}
.inspk-link{ color: rgba(255,255,255,0.86); }
.inspk-link:hover{ color: #fff; }

.inspk-btn{
  appearance:none;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.03);
  color: var(--text);
  padding: 10px 14px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  display:inline-flex;
  align-items:center;
  gap: 10px;
  transition: transform .12s ease, background .12s ease, border-color .12s ease, opacity .12s ease;
}
.inspk-btn:hover{ transform: translateY(-1px); border-color: rgba(255,255,255,0.22); background: rgba(255,255,255,0.06); }
.inspk-btn:active{ transform: translateY(0px); }
.inspk-btn[disabled]{ opacity: .55; cursor:not-allowed; transform:none; }

.inspk-btn--primary{
  border-color: rgba(109,94,252,0.55);
  background: linear-gradient(135deg, rgba(109,94,252,0.24), rgba(34,211,238,0.12));
}
.inspk-btn--primary:hover{ border-color: rgba(109,94,252,0.85); }
.inspk-btn--ghost{
  background: transparent;
  border-color: rgba(255,255,255,0.10);
}
.inspk-btn--soft{
  border-color: rgba(34,211,238,0.35);
  background: rgba(34,211,238,0.08);
}

.inspk-btn__spinner{
  width: 14px; height: 14px;
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,0.22);
  border-top-color: rgba(255,255,255,0.85);
  display:none;
  animation: spin .8s linear infinite;
}
.inspk-btn--loading .inspk-btn__spinner{ display:inline-block; }
.inspk-btn--loading .inspk-btn__label{ opacity:.85; }
@keyframes spin{ to{ transform: rotate(360deg);} }

/* ===== Studio ===== */
.inspk-studio{
  border: 1px solid var(--line);
  border-radius: var(--r22);
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.02));
  box-shadow: var(--shadow);
  overflow:hidden;
}
.inspk-studio__top{
  padding: 18px 18px 14px;
  border-bottom: 1px solid var(--line);
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 18px;
  flex-wrap: wrap;
}
.inspk-actions{ display:flex; gap: 10px; flex-wrap:wrap; justify-content:flex-end; }

.inspk-studio__grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 0;
}
.inspk-form{
  padding: 18px;
  border-right: 1px solid var(--line);
  background: rgba(0,0,0,0.08);
}
.inspk-form__section{
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 14px;
  background: rgba(255,255,255,0.02);
  margin-bottom: 14px;
}
.inspk-form__sectionTitle{
  font-family: var(--fontDisplay);
  font-size: 14px;
  letter-spacing: -0.01em;
  margin-bottom: 10px;
  color: rgba(255,255,255,0.92);
}
.inspk-grid2{ display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.inspk-grid3{ display:grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; }

.inspk-field{ display:flex; flex-direction:column; gap: 6px; }
.inspk-field span{ font-size: 12px; color: var(--muted); }
.inspk-field input,
.inspk-field select,
.inspk-field textarea{
  width:100%;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.03);
  color: var(--text);
  padding: 10px 12px;
  font-size: 13px;
  outline: none;
}
.inspk-field textarea{ resize: vertical; min-height: 86px; }
.inspk-field input:focus,
.inspk-field select:focus,
.inspk-field textarea:focus{
  border-color: rgba(109,94,252,0.65);
  box-shadow: 0 0 0 4px rgba(109,94,252,0.12);
}

.inspk-items{ display:grid; gap: 10px; }
.inspk-item{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.02);
  border-radius: 16px;
  padding: 12px;
}
.inspk-item__top{
  display:flex;
  gap: 10px;
  align-items:center;
  justify-content:space-between;
  margin-bottom: 10px;
}
.inspk-item__title{
  font-family: var(--fontDisplay);
  font-size: 13px;
  color: rgba(255,255,255,0.92);
}
.inspk-item__remove{
  color: rgba(255,255,255,0.85);
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.03);
  border-radius: 12px;
  padding: 8px 10px;
  cursor:pointer;
  font-size: 12px;
}
.inspk-item__remove:hover{ border-color: rgba(255,92,122,0.55); color:#fff; }
.inspk-item__grid{
  display:grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  gap: 10px;
}
.inspk-item__grid .wide{ grid-column: 1 / -1; }

.inspk-items__footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  margin-top: 10px;
}

.inspk-alert{
  display:none;
  margin-top: 10px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.03);
  border-radius: 14px;
  padding: 10px 12px;
  font-size: 13px;
}
.inspk-alert.is-show{ display:block; }
.inspk-alert.is-ok{ border-color: rgba(49,232,163,0.35); background: rgba(49,232,163,0.08); }
.inspk-alert.is-bad{ border-color: rgba(255,92,122,0.35); background: rgba(255,92,122,0.08); }

/* ===== Preview ===== */
.inspk-previewWrap{
  padding: 18px;
  background: rgba(255,255,255,0.015);
}
.inspk-previewCard{
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 18px;
  background: white;
  color: #0b1020;
  overflow:hidden;
  box-shadow: 0 18px 44px rgba(0,0,0,0.35);
}
.inspk-preview{ padding: 26px; }

.inv-head{ display:grid; gap: 16px; }
.inv-brand{ display:flex; align-items:flex-start; justify-content:space-between; gap: 16px; }
.inv-title{
  font-family: var(--fontDisplay);
  font-size: 22px;
  letter-spacing: .06em;
}
.inv-meta{ min-width: 220px; }
.inv-meta__row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  font-size: 12px;
  padding: 6px 0;
  border-bottom: 1px solid rgba(11,16,32,0.10);
}
.inv-meta__row span{ color: rgba(11,16,32,0.65); }

.inv-parties{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.inv-party__label{
  font-size: 11px;
  color: rgba(11,16,32,0.55);
  margin-bottom: 4px;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.inv-party__name{ font-weight: 700; font-size: 14px; margin-bottom: 4px; }
.inv-party__line{ font-size: 12px; color: rgba(11,16,32,0.75); line-height: 1.4; }

.inv-table{ margin-top: 16px; border-top: 1px solid rgba(11,16,32,0.12); }
.inv-row{
  display:grid;
  grid-template-columns: 1.6fr .4fr .5fr .5fr;
  gap: 10px;
  font-size: 12px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(11,16,32,0.10);
}
.inv-row--head{
  font-weight: 700;
  color: rgba(11,16,32,0.75);
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: 11px;
}
.ta-r{ text-align:right; }

.inv-totals{
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 16px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(11,16,32,0.12);
}
.inv-pay__label{ font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: rgba(11,16,32,0.55); }
.inv-pay__text{ font-size: 12px; color: rgba(11,16,32,0.75); margin-top: 4px; white-space: pre-wrap; }

.inv-sum{ align-self:start; }
.inv-sum__row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  padding: 6px 0;
  font-size: 12px;
  border-bottom: 1px solid rgba(11,16,32,0.08);
}
.inv-sum__row span{ color: rgba(11,16,32,0.65); }
.inv-sum__row--grand{
  border-bottom: 0;
  margin-top: 8px;
  padding-top: 10px;
  font-size: 14px;
}
.inv-notes{
  margin-top: 16px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.inv-notes__label{
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: rgba(11,16,32,0.55);
  margin-bottom: 4px;
}
.inv-notes__text{ font-size: 12px; color: rgba(11,16,32,0.75); white-space: pre-wrap; }

.inv-footer{
  margin-top: 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(11,16,32,0.10);
}
.inv-footer__soft{ font-size: 11px; color: rgba(11,16,32,0.55); }

.inspk-help{
  margin-top: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 12px 14px;
  background: rgba(255,255,255,0.02);
}
.inspk-help__title{
  font-family: var(--fontDisplay);
  font-size: 13px;
  margin-bottom: 8px;
}
.inspk-help__list{
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}

/* ===== Footer ===== */
.inspk-footer{ border-top: 1px solid var(--line); background: rgba(0,0,0,0.12); }
.inspk-footer__inner{
  padding: 18px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  flex-wrap:wrap;
}
.inspk-dot{ opacity:.6; margin: 0 8px; }

/* ===== Responsive ===== */
@media (max-width: 980px){
  .inspk-hero__grid{ grid-template-columns: 1fr; }
  .inspk-studio__grid{ grid-template-columns: 1fr; }
  .inspk-form{ border-right: 0; border-bottom: 1px solid var(--line); }
}
@media (max-width: 640px){
  .inspk-container{ width: calc(100% - 26px); }
  .inspk-grid2{ grid-template-columns: 1fr; }
  .inspk-grid3{ grid-template-columns: 1fr; }
  .inv-parties{ grid-template-columns: 1fr; }
  .inv-totals{ grid-template-columns: 1fr; }
  .inv-notes{ grid-template-columns: 1fr; }
  .inv-row{ grid-template-columns: 1.35fr .45fr .6fr .6fr; }
}

/* ===== Print: only invoice preview ===== */
@media print{
  body{ background: #fff !important; color:#000 !important; }
  .inspk-header, .inspk-footer, .inspk-hero, .inspk-help, .inspk-form, .inspk-studio__top{ display:none !important; }
  .inspk-main{ padding: 0 !important; }
  .inspk-section{ padding: 0 !important; }
  .inspk-container{ width: 100% !important; margin: 0 !important; }
  .inspk-previewWrap{ padding: 0 !important; background: transparent !important; }
  .inspk-previewCard{ border: 0 !important; box-shadow: none !important; border-radius: 0 !important; }
  .inspk-preview{ padding: 18px !important; }
}

/* ===== Invoice Studio theme overrides ===== */
/* Style the invoice tool module (inspk-*) to match light theme */
.inspk-studio{border:1px solid var(--line)!important;border-radius:18px!important;background:#fff!important;box-shadow:var(--shadow)!important}
.inspk-studio__top{border-bottom:1px solid rgba(15,23,42,.10)!important}
.inspk-form{background:#fafafa!important;border-right:1px solid rgba(15,23,42,.10)!important}
.inspk-form__section{background:#fff!important;border:1px solid rgba(15,23,42,.10)!important}
.inspk-form__sectionTitle{color:rgba(15,23,42,.88)!important}
.inspk-muted{color:rgba(15,23,42,.62)!important}
.inspk-btn{background:#fff!important;color:rgba(15,23,42,.92)!important;border-color:rgba(15,23,42,.16)!important}
.inspk-btn--primary{background:linear-gradient(135deg,var(--accent),#f43f5e)!important;color:#fff!important;border-color:transparent!important}
.inspk-btn--soft{background:rgba(108,44,242,.10)!important;border-color:rgba(108,44,242,.22)!important}
.inspk-btn--ghost{background:transparent!important}
.inspk-field input,.inspk-field select,.inspk-field textarea{background:#fff!important;color:rgba(15,23,42,.92)!important;border-color:rgba(15,23,42,.14)!important}
.inspk-field span{color:rgba(15,23,42,.62)!important}
.inspk-previewCard{border-color:rgba(15,23,42,.10)!important;box-shadow:0 18px 40px rgba(0,0,0,.10)!important}

@media print{
  .is-header,.is-hero,.is-band,.is-logos,.is-section,.is-footer,.is-fab{display:none!important}
}




/* =========================================
   RESPONSIVE CSS ONLY
   Paste at END of your CSS
   ========================================= */

/* ---------- Tablet / small desktop ---------- */
@media (max-width: 1024px){

  /* Global wrap breathing room */
  .is-wrap{ width: calc(100% - 32px) !important; }

  /* Header: keep clean + logo + CTA */
  .is-header__inner{ gap:12px !important; padding:10px 0 !important; }
  .custom-logo{ max-height:48px !important; }

  /* HERO: stack nicely */
  .is-hero{ padding:34px 0 26px !important; }
  .is-hero__inner{
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .is-hero__card{ order: 2 !important; }
  .is-hero__content{ order: 1 !important; }

  /* Hero meta: wrap + spacing */
  .is-hero__meta{
    gap: 10px !important;
    row-gap: 8px !important;
    font-size: 12px !important;
  }

  /* Studio: stack form + preview */
  .inspk-studio__grid{
    grid-template-columns: 1fr !important;
  }
  .inspk-form{
    border-right: 0 !important;
    border-bottom: 1px solid rgba(15,23,42,.10) !important;
  }
  .inspk-previewWrap{ padding: 16px !important; }
  .inspk-preview{ padding: 18px !important; }

  /* Action buttons: align + wrap */
  .inspk-studio__top{
    align-items: flex-start !important;
    gap: 12px !important;
  }
  .inspk-actions{
    width: 100% !important;
    justify-content: flex-start !important;
    gap: 8px !important;
  }
}

/* ---------- Mobile ---------- */
@media (max-width: 767px){

  /* Header: tighter + ensure CTA visible */
  .is-header__inner{ padding:10px 0 !important; }
  .custom-logo{ max-height:42px !important; }
  .is-btn.is-btn--ghost{
    padding: 9px 12px !important;
    font-size: 12px !important;
    border-radius: 12px !important;
  }

  /* HERO: typography + spacing */
  .is-hero{ padding:28px 0 22px !important; }
  .is-pill{ font-size: 11px !important; padding:6px 10px !important; }
  .is-h1{ font-size: clamp(22px, 7vw, 34px) !important; }
  .is-sub{ font-size: 14px !important; }
  .is-hero__cta{ gap:10px !important; }
  .is-hero__cta .is-btn{ width: 100% !important; }

  /* Hero meta: 2 columns for readability */
  .is-hero__meta{
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px 10px !important;
    margin-top: 12px !important;
  }

  /* Studio top: title + buttons vertical */
  .inspk-studio__top{
    padding: 14px !important;
  }
  .inspk-actions{
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }
  .inspk-btn{ justify-content:center !important; width:100% !important; }

  /* Form grids: single column */
  .inspk-form{ padding: 14px !important; }
  .inspk-form__section{ padding: 12px !important; }
  .inspk-grid2,
  .inspk-grid3{
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  /* Line item grid: single column */
  .inspk-item__grid{
    grid-template-columns: 1fr !important;
  }
  .inspk-item__grid .wide{ grid-column: auto !important; }

  /* Add item footer: stack */
  .inspk-items__footer{
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }
  #inv_addItem{ width:100% !important; }

  /* Preview: prevent overflow, improve readability */
  .inspk-previewWrap{ padding: 12px !important; }
  .inspk-previewCard{ border-radius: 16px !important; }
  .inspk-preview{ padding: 16px !important; }

  /* Invoice header: stack meta under title */
  .inv-brand{
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
  }
  .inv-meta{ min-width: 100% !important; }

  /* Parties: stack */
  .inv-parties{
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  /* Invoice rows: tighter + prevent wrapping weird */
  .inv-row{
    grid-template-columns: 1.25fr .45fr .6fr .6fr !important;
    gap: 8px !important;
    font-size: 11.5px !important;
  }

  /* Totals + notes: stack */
  .inv-totals{ grid-template-columns: 1fr !important; gap: 12px !important; }
  .inv-notes{ grid-template-columns: 1fr !important; gap: 12px !important; }

  /* Band cards: stack */
  .is-band__cards{
    grid-template-columns: 1fr !important;
    min-width: 0 !important;
  }

  /* Features: single column */
  .is-features{
    grid-template-columns: 1fr !important;
  }

  /* SEO grid: single column */
  .is-seoGrid{
    grid-template-columns: 1fr !important;
  }

  /* Footer: single column */
  .is-footer__grid{
    grid-template-columns: 1fr !important;
  }
}

/* ---------- Very small phones ---------- */
@media (max-width: 420px){

  /* Hero meta: single column */
  .is-hero__meta{ grid-template-columns: 1fr !important; }

  /* Actions: single column */
  .inspk-actions{ grid-template-columns: 1fr !important; }

  /* Invoice table: simplify columns */
  .inv-row{
    grid-template-columns: 1.3fr .7fr .7fr !important;
  }
  .inv-row > div:nth-child(4){ display:none !important; } /* hide Amount col */
  .inv-row--head > div:nth-child(4){ display:none !important; }
}




/* =========================================
   FIX: AOS hiding content (Blank page)
   Paste at END of CSS
   ========================================= */

/* If AOS JS doesn't run, show content anyway */
[data-aos],
.aos-init {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

/* Ensure hero content is visible */
.is-hero__content,
.is-hero__card,
.is-head,
.is-section,
.is-tool__title,
.is-faq,
.is-seoBlock {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}