:root {
  --bg: #f1f5f9;
  --panel: #ffffff;
  --ink: #0f172a;
  --muted: #64748b;
  --line: #e2e8f0;
  --accent: #0f766e;
  --signal: #f97316;
  --accent-ink: #ffffff;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; background: var(--bg); color: var(--ink); }

/* ---- top bar ---- */
.topbar {
  display: flex; align-items: center; gap: 20px;
  padding: 10px 18px; background: var(--panel); border-bottom: 1px solid var(--line);
  position: sticky; top: 0; z-index: 10;
}
.brand { display: flex; align-items: center; gap: 10px; }
.brand-link { color:inherit;text-decoration:none; }
.brand-mark { width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#102a2a;color:#fff;box-shadow:inset -8px -8px 0 rgba(15,118,110,.38);position:relative;overflow:hidden;flex:0 0 auto; }
.brand-mark::after { content:"";position:absolute;width:18px;height:5px;background:var(--signal);right:-3px;top:9px;transform:rotate(-32deg);border-radius:4px; }
.brand-mark > span { font-weight:900;font-size:21px;letter-spacing:-.08em;transform:translateX(-1px); }
.brand-mark.small { width:34px;height:34px;border-radius:9px; }.brand-mark.small > span { font-size:17px; }.brand-mark.small::after { width:14px;height:4px;top:7px; }
.brand-name { font-weight:850;font-size:15px;letter-spacing:-.02em;display:block; }.brand-name > span { color:var(--accent); }
.brand-sub { font-size: 11px; color: var(--muted); }
.tabs { display: flex; gap: 6px; margin-left: 8px; }
.tab {
  border: 1px solid var(--line); background: #f8fafc; color: var(--ink);
  padding: 7px 14px; border-radius: 8px; font-size: 13px; font-weight: 600; cursor: pointer;
}
.tab.active { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.actions { margin-left: auto; display: flex; gap: 8px; }
.btn {
  border: 1px solid var(--line); background: #fff; padding: 8px 14px; border-radius: 8px;
  font-size: 13px; font-weight: 600; cursor: pointer;
}
.btn.primary { background: var(--accent); color: #fff; border-color: var(--accent); }
.btn.ghost { background: transparent; color: var(--muted); }
.btn:hover { filter: brightness(0.97); }
.quote-link, .btn { text-decoration: none; color: inherit; display: inline-flex; align-items: center; justify-content: center; }

/* ---- ForgeMetric landing page ---- */
.home-page { height:auto;min-height:100%;background:#f7f8f4;color:#102022;overflow-x:hidden; }
.home-nav { width:min(1240px,calc(100% - 48px));height:82px;margin:auto;display:flex;align-items:center;gap:34px;border-bottom:1px solid rgba(16,32,34,.12); }
.home-nav .brand-name { font-size:18px; }.home-nav .brand-sub { display:block;margin-top:1px;text-transform:uppercase;letter-spacing:.11em;font-size:8px; }
.home-links { display:flex;gap:30px;margin-left:auto; }.home-links a { color:#4c5c5d;text-decoration:none;font-size:13px;font-weight:650; }.home-links a:hover { color:var(--accent); }
.home-nav-cta { margin-left:14px!important;border-color:#173839!important;background:#173839!important;color:#fff!important;border-radius:999px!important;padding:11px 18px!important;gap:10px; }
.home-page main { width:100%; }
.home-hero { width:min(1240px,calc(100% - 48px));margin:0 auto;min-height:660px;display:grid;grid-template-columns:.92fr 1.08fr;align-items:center;gap:70px;padding:74px 0 78px; }
.eyebrow { display:flex;align-items:center;gap:9px;text-transform:uppercase;letter-spacing:.14em;font-size:10px;font-weight:800;color:var(--accent);margin:0 0 24px; }.eyebrow span { width:30px;height:2px;background:var(--signal); }
.hero-copy h1 { max-width:620px;font-size:clamp(48px,5.2vw,78px);line-height:.98;letter-spacing:-.055em;margin:0;color:#102a2a;font-weight:850; }.hero-copy h1 em { color:var(--accent);font-style:normal; }
.hero-lede { max-width:570px;font-size:17px;line-height:1.7;color:#5c6b6c;margin:28px 0 0; }
.hero-actions { display:flex;gap:12px;margin-top:34px; }.hero-actions .btn,.home-cta .btn { border-radius:999px;padding:14px 22px;gap:14px;font-size:13px; }
.hero-primary { background:var(--signal)!important;border-color:var(--signal)!important;color:#fff!important;box-shadow:0 10px 24px rgba(249,115,22,.2); }.hero-primary:hover { transform:translateY(-1px);filter:none; }
.hero-secondary { background:transparent!important;border-color:#bfc8c5!important;color:#173839!important; }
.hero-proof { display:flex;flex-wrap:wrap;gap:0;margin-top:42px;border-top:1px solid #d8dedb;padding-top:20px; }.hero-proof span { display:flex;flex-direction:column;padding:0 23px;border-right:1px solid #d8dedb;color:#788382;font-size:10px;text-transform:uppercase;letter-spacing:.08em; }.hero-proof span:first-child { padding-left:0; }.hero-proof span:last-child { border:0; }.hero-proof strong { color:#173839;font-size:18px;letter-spacing:-.02em;text-transform:none;margin-bottom:3px; }
.hero-visual { min-height:520px;position:relative;border-radius:30px;background:#153737;color:#d2e8e4;overflow:hidden;box-shadow:0 35px 70px rgba(24,55,55,.22); }
.visual-grid { position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(to bottom,black,transparent 96%); }
.visual-toolbar { height:52px;display:flex;align-items:center;gap:10px;padding:0 20px;border-bottom:1px solid rgba(255,255,255,.12);font-size:9px;letter-spacing:.12em;position:relative;z-index:1; }.visual-toolbar b { margin-left:auto;color:#78e2cc;font-size:8px; }.visual-dot { width:8px;height:8px;border-radius:50%;background:var(--signal);box-shadow:0 0 0 4px rgba(249,115,22,.16); }
.product-carousel { background:#102a2a;isolation:isolate; }
.product-carousel::after { content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(6,22,22,.66),rgba(6,22,22,.14) 46%,rgba(6,22,22,.72)),linear-gradient(90deg,rgba(6,22,22,.66),rgba(6,22,22,.12) 46%,rgba(6,22,22,.45)); }
.carousel-track { position:absolute;inset:0;display:flex;width:500%;height:100%;animation:productCarousel 24s ease-in-out infinite;will-change:transform; }
.product-carousel:hover .carousel-track { animation-play-state:paused; }
.carousel-slide { position:relative;flex:0 0 20%;margin:0;background:#102a2a;overflow:hidden; }
.carousel-slide img { width:100%;height:100%;display:block;object-fit:cover;object-position:center;filter:saturate(.95) contrast(1.04); }
.carousel-slide:nth-child(2) img { object-position:center 58%; }
.carousel-slide:nth-child(3) img { object-position:center 46%; }
.carousel-slide:nth-child(4) img { object-position:center 52%; }
.carousel-slide figcaption { position:absolute;left:24px;top:76px;z-index:2;display:flex;flex-direction:column;gap:6px;max-width:min(72%,420px);color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.45); }
.carousel-slide figcaption small { color:#8df0dd;font-size:9px;font-weight:850;letter-spacing:.16em; }
.carousel-slide figcaption strong { font-size:20px;line-height:1.2;letter-spacing:0; }
.carousel-toolbar { position:absolute;inset:0 0 auto;z-index:3;background:rgba(10,34,34,.62);backdrop-filter:blur(10px); }
.product-carousel .visual-card { z-index:3; }
@keyframes productCarousel {
  0%, 20.833% { transform:translateX(0); }
  25%, 45.833% { transform:translateX(-20%); }
  50%, 70.833% { transform:translateX(-40%); }
  75%, 95.833% { transform:translateX(-60%); }
  100% { transform:translateX(-80%); }
}
@media (prefers-reduced-motion: reduce) {
  .carousel-track { animation:none; }
}
.hero-sketch { width:95%;height:auto;display:block;margin:20px auto 0;color:#b9d6d1;position:relative;z-index:1; }.hero-sketch .sketch-soft { fill:rgba(214,241,236,.06); }.hero-sketch .sketch-accent { stroke:#fb8a4d;stroke-width:5; }.hero-sketch .sketch-dash { stroke:#5a8c87;stroke-dasharray:8 8; }.dimension-lines,.dimension-text { color:#6ca49e; }.dimension-text { font:12px system-ui,sans-serif;letter-spacing:.06em; }
.visual-card { position:absolute;z-index:2;background:rgba(248,250,247,.96);color:#173839;border-radius:13px;padding:13px 16px;box-shadow:0 12px 30px rgba(0,0,0,.16);display:flex;flex-direction:column;gap:4px; }.visual-card small { color:#7b8987;font-size:8px;letter-spacing:.12em; }.visual-card strong { font-size:12px; }.visual-card-a { left:20px;bottom:22px; }.visual-card-b { right:20px;bottom:22px; }.visual-card-b i { display:inline-block;width:7px;height:7px;border-radius:50%;background:#10b981;margin-right:6px; }
.product-strip { min-height:82px;background:#102a2a;color:#e2eeec;display:flex;align-items:center;justify-content:center;gap:28px;padding:18px 24px;text-transform:uppercase;letter-spacing:.11em;font-size:11px; }.product-strip > span { color:#7fa09c; }.product-strip i { width:4px;height:4px;background:var(--signal);border-radius:50%; }
.home-section { width:min(1160px,calc(100% - 48px));margin:0 auto;padding:118px 0; }.section-kicker { color:var(--signal);font-size:10px;font-weight:850;letter-spacing:.15em;text-transform:uppercase;margin-bottom:16px; }.section-intro { display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:end; }.section-intro h2,.workflow-copy h2,.home-cta h2 { margin:0;color:#102a2a;font-size:clamp(36px,4.2vw,56px);letter-spacing:-.045em;line-height:1.04; }.section-intro p,.workflow-copy > p { margin:0;color:#657372;line-height:1.75;font-size:15px; }
.capability-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:58px; }.capability-grid article { position:relative;min-height:300px;padding:30px;border:1px solid #d9dfdc;border-radius:20px;background:#fbfcfa;overflow:hidden; }.capability-grid article::after { content:"";position:absolute;width:120px;height:120px;border:1px solid #dce6e3;border-radius:50%;right:-58px;bottom:-58px; }.cap-number { position:absolute;right:24px;top:24px;color:#9facaa;font-size:10px;letter-spacing:.12em; }.cap-icon { width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#e5f2ef;color:var(--accent);font-size:25px;margin-bottom:58px; }.capability-grid h3 { margin:0 0 12px;font-size:19px;letter-spacing:-.02em; }.capability-grid p { margin:0;color:#687675;line-height:1.65;font-size:13px;max-width:290px; }
.workflow-section { border-top:1px solid #d8dedb;display:grid;grid-template-columns:.9fr 1.1fr;gap:120px; }.workflow-copy .eyebrow { margin-bottom:22px; }.workflow-copy > p:not(.eyebrow) { margin-top:24px;max-width:440px; }.text-link { display:inline-flex;align-items:center;gap:14px;margin-top:30px;color:var(--accent);font-weight:800;font-size:13px;text-decoration:none; }.text-link span { color:var(--signal); }
.workflow-list { list-style:none;padding:0;margin:0;display:grid; }.workflow-list li { display:grid;grid-template-columns:54px 1fr;gap:22px;padding:27px 0;border-bottom:1px solid #d8dedb; }.workflow-list li:first-child { padding-top:0; }.workflow-list > li > span { width:42px;height:42px;border-radius:50%;display:grid;place-items:center;border:1px solid #b9c8c5;color:var(--accent);font-size:10px;font-weight:850; }.workflow-list strong { font-size:18px; }.workflow-list p { margin:7px 0 0;color:#697776;font-size:13px;line-height:1.55; }
.home-cta { width:min(1240px,calc(100% - 48px));margin:0 auto 58px;border-radius:26px;background:#163837;padding:60px 66px;display:flex;align-items:center;justify-content:space-between;gap:35px;color:#fff;position:relative;overflow:hidden; }.home-cta::after { content:"FM";position:absolute;right:190px;bottom:-70px;font-size:190px;font-weight:900;color:rgba(255,255,255,.035);letter-spacing:-.1em; }.home-cta > div,.home-cta > a { position:relative;z-index:1; }.home-cta > div > span { color:#86b5ae;text-transform:uppercase;font-size:9px;letter-spacing:.15em; }.home-cta h2 { color:#fff;max-width:700px;font-size:40px;margin-top:12px; }
.home-footer { width:min(1240px,calc(100% - 48px));margin:auto;min-height:120px;border-top:1px solid #d8dedb;display:flex;align-items:center;gap:34px;color:#73807f;font-size:11px; }.home-footer p { margin-right:auto; }.home-footer > span { text-transform:uppercase;letter-spacing:.12em;font-size:9px; }

@media (max-width: 980px) {
  .home-links { display:none; }.home-hero { grid-template-columns:1fr;padding-top:58px; }.hero-copy { max-width:720px; }.hero-visual { min-height:500px; }.section-intro,.workflow-section { grid-template-columns:1fr;gap:45px; }.capability-grid { grid-template-columns:1fr 1fr; }.home-cta { padding:48px; }
}
@media (max-width: 680px) {
  .home-nav,.home-hero,.home-section,.home-cta,.home-footer { width:min(100% - 30px,1240px); }.home-nav { height:70px; }.home-nav-cta { padding:9px 12px!important;font-size:11px; }.home-nav .brand-sub { display:none; }.home-hero { padding:50px 0;gap:44px;min-height:0; }.hero-copy h1 { font-size:46px; }.hero-lede { font-size:15px; }.hero-actions { align-items:stretch;flex-direction:column; }.hero-proof { gap:18px; }.hero-proof span { padding:0;border:0;min-width:28%; }.hero-visual { min-height:390px;border-radius:20px; }.hero-sketch { margin-top:10px; }.visual-card { padding:10px 11px; }.visual-card-a { left:10px;bottom:12px; }.visual-card-b { right:10px;bottom:12px; }.product-strip { justify-content:flex-start;overflow:auto;gap:18px;white-space:nowrap; }.home-section { padding:80px 0; }.section-intro { gap:22px; }.capability-grid { grid-template-columns:1fr;margin-top:38px; }.capability-grid article { min-height:250px; }.cap-icon { margin-bottom:35px; }.workflow-section { gap:55px; }.home-cta { padding:38px 28px;align-items:flex-start;flex-direction:column; }.home-cta h2 { font-size:32px; }.home-footer { padding:30px 0;align-items:flex-start;flex-direction:column;gap:14px; }.home-footer p { margin:0; }
  .carousel-slide figcaption { left:16px;top:64px;max-width:calc(100% - 32px); }
  .carousel-slide figcaption strong { font-size:15px; }
  .carousel-toolbar b { display:none; }
  .product-carousel .visual-card { max-width:calc(50% - 16px); }
  .product-carousel .visual-card strong { font-size:10px;line-height:1.25; }
}

/* ---- layout ---- */
.layout { display: grid; grid-template-columns: 340px 1fr; height: calc(100vh - 61px); }
.panel { overflow-y: auto; background: var(--panel); border-right: 1px solid var(--line); padding: 14px; }
.canvas { overflow-y: auto; padding: 18px 22px; }

@media (max-width: 760px) {
  body:not(.home-page):not(.quote-page) { height:auto;overflow-x:hidden; }
  body:not(.home-page):not(.quote-page) .topbar { position:relative;flex-wrap:wrap;gap:8px;padding:9px 12px; }
  body:not(.home-page):not(.quote-page) .topbar .brand { width:100%; }
  body:not(.home-page):not(.quote-page) .topbar .brand-sub { display:none; }
  body:not(.home-page):not(.quote-page) .tabs { order:2;width:100%;margin-left:0;overflow-x:auto;padding-bottom:2px;scrollbar-width:thin; }
  body:not(.home-page):not(.quote-page) .tab { flex:0 0 auto; }
  body:not(.home-page):not(.quote-page) .actions { order:3;width:100%;margin-left:0;overflow-x:auto;padding-bottom:2px; }
  body:not(.home-page):not(.quote-page) .actions > * { flex:0 0 auto; }
  .layout { display:block;height:auto; }
  .panel { overflow:visible;border-right:0;border-bottom:1px solid var(--line);padding:12px; }
  .canvas { overflow:visible;padding:14px 10px; }
  .titleblock { grid-template-columns:1fr 1fr; }
  .tb-main { grid-column:1 / -1;border-right:0; }
  .views { grid-template-columns:1fr; }
  .bom-wrap { overflow-x:auto; }
  .bom { min-width:640px; }
}

/* ---- form ---- */
.section { border: 1px solid var(--line); border-radius: 10px; margin: 0 0 12px; padding: 0; }
.section legend {
  font-size: 13px; font-weight: 700; padding: 8px 12px; cursor: pointer; width: 100%;
  display: flex; justify-content: space-between; align-items: center; color: var(--ink);
}
.section .chev { color: var(--muted); font-size: 12px; }
.section-body { padding: 4px 12px 12px; display: flex; flex-direction: column; gap: 9px; }
.section.is-collapsed .section-body { display: none; }
.ctl { display: flex; flex-direction: column; gap: 4px; }
.ctl > label { font-size: 12px; color: var(--muted); }
.ctl-in { display: flex; align-items: center; gap: 6px; }
.ctl-in input, .ctl-in select, .ctl textarea {
  width: 100%; padding: 7px 9px; border: 1px solid var(--line); border-radius: 7px;
  font-size: 13px; background: #fff; color: var(--ink);
}
.ctl .unit { font-size: 11px; color: var(--muted); min-width: 22px; }
.ctl.toggle { flex-direction: row; align-items: center; gap: 8px; }
.ctl.toggle input { width: 16px; height: 16px; }
.ctl.toggle span { font-size: 13px; color: var(--ink); font-weight: 500; }

/* ---- title block ---- */
.titleblock {
  display: grid; grid-template-columns: minmax(260px, 2fr) repeat(2, minmax(110px, 1fr)); gap: 0;
  border: 1px solid var(--ink); border-radius: 6px; overflow: hidden; margin-bottom: 16px; background: #fff;
}
.tb-main { grid-column: span 1; padding: 10px 12px; border-right: 1px solid var(--line); }
.tb-title { font-weight: 700; font-size: 15px; }
.tb-sub { font-size: 11px; color: var(--muted); margin-top: 2px; }
.tb-cell { padding: 6px 10px; border-left: 1px solid var(--line); border-top: 1px solid var(--line); }
.tb-l { display: block; font-size: 9px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.tb-v { font-size: 12px; font-weight: 600; }

/* ---- views ---- */
.views { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.view-cell { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 6px; }
.view-svg { width: 100%; height: auto; display: block; background:
  linear-gradient(#fbfdff 0 0) padding-box; }
.view-title { font-size: 13px; font-weight: 700; fill: var(--ink); text-anchor: middle; }
.dim-text { font-size: 12px; fill: #dc2626; }
.note-text { font-size: 11px; fill: var(--muted); }

/* ---- BOM ---- */
.bom-wrap { margin-top: 20px; }
.bom-wrap h3 { font-size: 14px; margin: 0 0 8px; }
.bom { width: 100%; border-collapse: collapse; font-size: 12px; background: #fff; }
.bom th, .bom td { border: 1px solid var(--line); padding: 6px 9px; text-align: left; vertical-align: top; }
.bom th { background: #f8fafc; font-size: 11px; text-transform: uppercase; letter-spacing: .03em; color: var(--muted); }
.bom td.num { text-align: center; font-weight: 700; }
.bom td.notes { color: var(--muted); }
.finish-note { font-size: 11px; color: var(--muted); margin-top: 8px; }

/* ---- print ---- */
@media print {
  .topbar, .panel { display: none !important; }
  .layout { display: block; height: auto; }
  .canvas { overflow: visible; padding: 0; }
  .views { page-break-inside: avoid; }
  body { background: #fff; }
}

/* ---- quotation and admin costing ---- */
.hidden { display: none !important; }
.quote-page { min-height: 100%; height: auto; }
.quote-topbar { position: sticky; }
.quote-shell { width: min(1180px, calc(100% - 32px)); margin: 28px auto 60px; display: grid; gap: 20px; }
.quote-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 24px; box-shadow: 0 8px 30px rgba(15,23,42,.05); }
.section-heading { display: flex; justify-content: space-between; margin-bottom: 22px; }
.section-heading > div { display: grid; grid-template-columns: 42px 1fr; column-gap: 12px; }
.section-heading h1, .section-heading h2 { margin: 0; font-size: 21px; }
.section-heading p { grid-column: 2; margin: 5px 0 0; color: var(--muted); font-size: 13px; }
.step { grid-row: 1 / 3; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: #e0f2fe; color: var(--accent); font-weight: 800; }
.admin-step { background: #fef3c7; color: #92400e; }
.staff-step { background:#ede9fe;color:#6d28d9; }
.btn.staff-btn { background:#6d28d9;border-color:#6d28d9;color:#fff; }
.btn.staff-btn:hover { background:#5b21b6;border-color:#5b21b6; }
#staff-workspace { display:grid;gap:20px; }
.staff-views { margin:4px 0 24px; }
#staff-output h3 { margin-top:25px; }
.staff-totals .cost-grand { border-top:1px solid var(--line);margin-top:4px;padding-top:11px;color:#5b21b6; }
.quote-grid { display: grid; gap: 14px; }.quote-grid.two { grid-template-columns: repeat(2,minmax(0,1fr)); }.quote-grid.three { grid-template-columns: repeat(3,minmax(0,1fr)); }
.quote-page label { display: flex; flex-direction: column; gap: 5px; color: #475569; font-size: 12px; font-weight: 600; }
.quote-page input, .quote-page select, .quote-page textarea { width: 100%; border: 1px solid #cbd5e1; border-radius: 8px; padding: 10px 11px; font: inherit; font-size: 14px; color: var(--ink); background: #fff; }
.quote-page textarea { resize: vertical; }.quote-page label > small { font-weight: 400; color: var(--muted); }
.buyer-form { display: grid; gap: 14px; margin-top: 18px; }
.design-summary { border: 1px solid var(--line); background: #f8fafc; border-radius: 9px; padding: 9px 12px; display: flex; flex-direction: column; }
.design-summary span, .design-summary small { font-size: 11px; color: var(--muted); }.design-summary strong { font-size: 14px; margin: 2px 0; }
.action-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 20px; }.status { color: #b45309; font-size: 13px; }
.required-note { margin-top:14px;color:var(--muted);font-size:11px; }.btn:disabled { opacity:.45;cursor:not-allowed;filter:none; }
.table-scroll { overflow-x: auto; }.quote-table { width: 100%; border-collapse: collapse; font-size: 13px; }.quote-table th,.quote-table td { padding: 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }.quote-table th { background: #f8fafc; color: var(--muted); font-size: 11px; text-transform: uppercase; }.quote-table td small { display:block;color:var(--muted);margin-top:3px; }
.quote-totals { width: min(390px,100%); margin: 18px 0 0 auto; }.quote-totals div { display:flex;justify-content:space-between;padding:7px 4px;font-size:13px; }.quote-totals .grand { border-top:2px solid var(--ink);font-size:17px;margin-top:4px;padding-top:11px; }
.final-price-card { border:1px solid var(--line);border-radius:10px;background:#f8fafc;padding:18px 20px;display:flex;justify-content:space-between;gap:22px;align-items:center; }
.final-price-card div { display:grid;gap:5px; }.final-price-card span { color:var(--muted);font-size:12px;font-weight:700; }.final-price-card strong { font-size:28px;letter-spacing:0;color:var(--accent); }.final-price-card p { margin:0;display:grid;gap:4px;text-align:right; }.final-price-card b { font-size:15px; }.final-price-card p span { font-weight:500; }
.quote-result { margin-top:18px;padding:14px;border-radius:9px;background:#ecfdf5;border:1px solid #a7f3d0;display:flex;flex-direction:column;gap:4px;color:#065f46; }.download-list { display:flex;flex-wrap:wrap;gap:8px;margin-top:12px; }
.special-limit { margin-top:16px;padding:16px;border-radius:10px;background:#fff7ed;border:1px solid #fdba74;color:#9a3412;display:flex;flex-direction:column;gap:7px; }.special-limit strong { font-size:16px; }.special-limit span { line-height:1.5; }.special-actions { display:flex;flex-wrap:wrap;gap:9px;margin-top:5px; }.btn.whatsapp { background:#15803d;border-color:#15803d;color:#fff; }
.admin-login { display:flex;align-items:end;gap:10px;max-width:550px; }.admin-login label { flex:1; }
.admin-entry { display:flex;justify-content:center;gap:8px;padding:8px 0 18px;border-top:1px solid var(--line); }.admin-entry .btn { font-size:11px;color:var(--muted); }
.warning { padding:12px;background:#fff7ed;border:1px solid #fdba74;border-radius:8px;color:#9a3412;margin-bottom:16px;font-size:13px; }
.commercial-settings { margin-bottom:14px; }.cost-products { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:20px; }.cost-card { border:1px solid var(--line);border-radius:10px;padding:12px; }.cost-card legend { font-weight:800;padding:0 7px; }.cost-grid { display:grid;gap:7px; }.cost-grid label { display:grid;grid-template-columns:1fr minmax(260px,1.2fr);align-items:center;gap:8px; }.cost-grid label span { display:flex;align-items:center;gap:6px; }.cost-grid .cost-input-pair { display:grid;grid-template-columns:1fr 1fr;gap:8px; }.cost-grid .cost-input-pair > span { min-width:0; }.cost-grid input { min-width:0;padding:7px; }.cost-grid em { min-width:32px;font-size:10px;color:var(--muted);font-style:normal; }.cost-column-head { display:grid;grid-template-columns:1fr repeat(2,minmax(126px,.6fr));gap:8px;padding-bottom:5px;border-bottom:1px solid var(--line);color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase; }.cost-column-head span:not(:first-child) { text-align:center; }.cost-grid .labour-cost { border-top:1px solid var(--line);padding-top:9px;margin-top:3px;color:var(--ink); }
.preset-card { margin-top:20px;border:1px solid #86efac;border-radius:10px;padding:14px;background:#f0fdf4; }.preset-card legend { padding:0 7px;font-weight:800;color:#166534; }.preset-card p { margin:7px 0 13px;color:#4b5563;font-size:12px; }.preset-card .preset-toggle { flex-direction:row;align-items:center;color:#14532d;font-size:13px; }.preset-toggle input { width:auto; }.quote-grid.four { grid-template-columns:repeat(4,minmax(0,1fr)); }
.material-heading { display:flex;justify-content:space-between;align-items:end;gap:16px;margin:28px 0 12px; }.material-heading h3,.fallback-heading { margin:0 0 4px; }.material-heading p,.admin-copy { margin:0;color:var(--muted);font-size:12px; }.material-library { display:grid;gap:8px; }.material-row { display:grid;grid-template-columns:1.5fr .9fr repeat(4,.7fr) .8fr auto;gap:7px;align-items:end;border:1px solid var(--line);border-radius:9px;padding:10px;background:#fafafa; }.material-row.required-sheet { border-color:#7dd3fc;background:#f0f9ff; }.material-row input,.material-row select { padding:7px;font-size:12px; }.material-row .availability-toggle { flex-direction:row;align-items:center;min-height:32px; }.availability-toggle input { width:auto; }.material-required { align-self:center;color:#0369a1;font-size:10px;font-weight:700;white-space:nowrap; }.material-remove { color:#b91c1c;padding:7px; }.fallback-heading { margin-top:26px; }
.rule-heading { display:flex;justify-content:space-between;align-items:end;gap:16px;margin-top:28px; }.rule-heading h3 { margin:0 0 4px; }.rule-heading p { margin:0;color:var(--muted);font-size:12px; }.rule-add { display:flex;gap:8px;min-width:340px; }.rule-add select { min-width:170px; }.rule-help { margin:12px 0;padding:10px 12px;border-radius:8px;background:#eff6ff;color:#1e3a8a;font-size:12px; }.cost-rules { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px; }.rule-card { border:1px solid #bfdbfe;border-radius:10px;padding:12px;background:#fbfdff; }.rule-card legend { font-weight:800;padding:0 7px;color:#1e3a8a; }.rule-top { display:flex;justify-content:space-between;align-items:center;margin-bottom:10px; }.rule-enabled { flex-direction:row!important;align-items:center; }.rule-enabled input { width:auto; }.rule-delete { color:#b91c1c;padding:5px 9px; }.rule-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px; }.rule-card h4 { margin:14px 0 7px;font-size:11px;text-transform:uppercase;color:var(--muted); }.range-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px; }.rule-card input,.rule-card select { padding:7px;font-size:12px; }
@media (max-width: 980px) { .material-row { grid-template-columns:repeat(3,minmax(0,1fr)); }.material-heading { align-items:stretch;flex-direction:column; } }
@media (max-width: 760px) { .quote-grid.two,.quote-grid.three,.quote-grid.four,.cost-products,.cost-rules { grid-template-columns:1fr; }.material-row { grid-template-columns:1fr 1fr; }.cost-grid label { grid-template-columns:1fr; }.cost-column-head { display:none; }.rule-heading { align-items:stretch;flex-direction:column; }.rule-add { min-width:0; }.rule-grid,.range-grid { grid-template-columns:1fr 1fr; }.quote-card { padding:17px; }.quote-topbar .brand-sub { display:none; }.quote-topbar { gap:8px;padding:9px; }.quote-shell { width:min(100% - 18px,1180px);margin-top:12px; }.admin-login { align-items:stretch;flex-direction:column; }.final-price-card { align-items:flex-start;flex-direction:column; }.final-price-card p { text-align:left; } }
@media print { .quote-page .topbar,.quote-page #buyer-view,.quote-page #admin-view,.quote-page .no-print,.quote-page .download-list { display:none!important; }.quote-shell { width:100%;margin:0; }.quote-card { border:0;box-shadow:none;padding:0; }.quote-result { border:1px solid #999;background:#fff;color:#111; } }
@media (max-width: 760px) {
  body:not(.home-page):not(.quote-page) .titleblock { grid-template-columns:1fr 1fr; }
  body:not(.home-page):not(.quote-page) .tb-main { grid-column:1 / -1;border-right:0; }
  body:not(.home-page):not(.quote-page) .views { grid-template-columns:1fr; }
  body:not(.home-page):not(.quote-page) .bom { min-width:640px; }
}