/* =========================================================
   TV Mounting Calculator — scoped styles (.tvm-calc)
   Change fonts/colors in the variables below.
   ========================================================= */
.tvm-calc{
  --tvm-ink:#0B0C0E;
  --tvm-ink-2:#111317;
  --tvm-ink-3:#181B20;
  --tvm-line:rgba(244,239,230,.09);
  --tvm-line-2:rgba(244,239,230,.16);
  --tvm-ivory:#F4EFE6;
  --tvm-ivory-2:#E9E2D5;
  --tvm-muted:#A39E95;
  --tvm-muted-2:#8F8A81;
  --tvm-gold:#C9A76B;
  --tvm-gold-2:#E6CF9F;
  --tvm-gold-3:#9C7F4A;
  --tvm-err:#E8998B;
  --tvm-ease:cubic-bezier(.2,.7,.2,1);

  max-width:1160px;
  margin:0 auto;
  font-family:var(--tvm-sans);
  font-size:16px;
  line-height:1.6;
  font-weight:400;
  color:var(--tvm-ivory);
  text-align:left;
  -webkit-font-smoothing:antialiased;
}
/* Fonts: built-in pair. In "theme" mode the variables stay unset,
   so everything inherits the theme's fonts. */
.tvm-calc.tvm-fonts-builtin{
  --tvm-serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --tvm-sans:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
.tvm-calc *,.tvm-calc *::before,.tvm-calc *::after{box-sizing:border-box}
.tvm-calc [hidden]{display:none !important}
.tvm-calc svg{display:block}

/* ---- neutralize theme / Elementor defaults ---- */
.tvm-calc button,.tvm-calc button:hover,.tvm-calc button:focus,.tvm-calc button:active{
  margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;
  color:inherit;font:inherit;line-height:1.3;letter-spacing:normal;text-transform:none;
  text-decoration:none;text-shadow:none;width:auto;min-height:0;cursor:pointer;
  -webkit-appearance:none;appearance:none;
}
.tvm-calc button:focus{outline:none}
.tvm-calc button:focus-visible,.tvm-calc .tvm-chk:focus-within{outline:2px solid var(--tvm-gold);outline-offset:3px}
.tvm-calc h3,.tvm-calc p,.tvm-calc ul,.tvm-calc li,.tvm-calc form{margin:0;padding:0}
.tvm-calc ul{list-style:none}
.tvm-calc label{display:block;margin:0;font-weight:inherit;color:inherit}

/* ---- card ---- */
.tvm-calc .tvm-card{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
  border:1px solid var(--tvm-line-2);
  border-radius:28px;
  overflow:hidden;
  background:var(--tvm-ink-2);
  box-shadow:0 30px 80px -30px rgba(0,0,0,.7);
}
.tvm-calc .tvm-form{padding:48px}
.tvm-calc .tvm-sum{
  padding:48px;
  display:flex;flex-direction:column;
  border-left:1px solid var(--tvm-line);
  background:
    radial-gradient(600px circle at 100% 0%,rgba(201,167,107,.16),transparent 55%),
    linear-gradient(180deg,#1A1813,#121317);
}

/* ---- type ---- */
.tvm-calc .tvm-eyebrow{
  display:inline-flex;align-items:center;gap:12px;
  font-size:12px;letter-spacing:.24em;text-transform:uppercase;font-weight:600;color:var(--tvm-gold);
}
.tvm-calc .tvm-eyebrow::before{content:"";width:28px;height:1px;background:linear-gradient(90deg,transparent,var(--tvm-gold))}
.tvm-calc .tvm-title{
  font-size:38px;line-height:1.1;letter-spacing:-.01em;
  color:var(--tvm-ivory);margin:14px 0 8px;text-transform:none;
}
/* built-in & custom fonts set the title font; theme mode keeps the theme's heading font */
.tvm-calc:not(.tvm-fonts-theme) .tvm-title{font-family:var(--tvm-serif);font-weight:600}
.tvm-calc .tvm-lead{font-size:15px;color:var(--tvm-muted);line-height:1.6}
.tvm-calc .tvm-label{
  display:block;margin:28px 0 12px;
  font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--tvm-muted);
}

/* ---- segmented choices ---- */
.tvm-calc .tvm-seg{display:grid;gap:8px}
.tvm-calc .tvm-seg-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.tvm-calc .tvm-seg-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.tvm-calc .tvm-seg button,
.tvm-calc .tvm-seg button:hover,
.tvm-calc .tvm-seg button:focus{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:72px;padding:14px 10px;
  border:1px solid var(--tvm-line-2);border-radius:14px;
  background:transparent;color:var(--tvm-ivory-2);
  font-size:15px;font-weight:500;text-align:center;
  transition:border-color .35s var(--tvm-ease),background .35s var(--tvm-ease),color .35s;
}
.tvm-calc .tvm-seg button:hover{border-color:var(--tvm-gold-3)}
.tvm-calc .tvm-seg button small{display:block;margin-top:3px;font-size:12px;font-weight:400;color:var(--tvm-muted)}
.tvm-calc .tvm-seg button.is-on,
.tvm-calc .tvm-seg button.is-on:hover,
.tvm-calc .tvm-seg button.is-on:focus{border-color:var(--tvm-gold);background:rgba(201,167,107,.1);color:var(--tvm-ivory)}

/* ---- checkboxes ---- */
.tvm-calc .tvm-checks{display:grid;gap:10px}
.tvm-calc .tvm-chk{
  position:relative;display:flex;align-items:center;gap:14px;
  min-height:64px;padding:14px 18px;
  border:1px solid var(--tvm-line-2);border-radius:14px;cursor:pointer;
  transition:border-color .35s var(--tvm-ease),background .35s var(--tvm-ease);
}
.tvm-calc .tvm-chk:hover{border-color:var(--tvm-gold-3)}
.tvm-calc .tvm-chk input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.tvm-calc .tvm-box{
  width:22px;height:22px;flex:none;border-radius:7px;border:1.5px solid var(--tvm-line-2);
  display:grid;place-items:center;transition:all .3s var(--tvm-ease);
}
.tvm-calc .tvm-box svg{width:14px;height:14px;color:#17130C;opacity:0;transform:scale(.5);transition:all .3s var(--tvm-ease)}
.tvm-calc .tvm-txt{flex:1;min-width:0;font-size:15px;line-height:1.35;color:var(--tvm-ivory)}
.tvm-calc .tvm-txt small{display:block;margin-top:3px;font-size:12px;color:var(--tvm-muted)}
.tvm-calc .tvm-amt{flex:none;text-align:right;font-size:14px;font-weight:600;color:var(--tvm-gold-2)}
.tvm-calc .tvm-amt small{display:block;margin-top:2px;font-size:11px;font-weight:400;color:var(--tvm-muted)}
.tvm-calc .tvm-chk.is-on{border-color:var(--tvm-gold);background:rgba(201,167,107,.07)}
.tvm-calc .tvm-chk.is-on .tvm-box{background:var(--tvm-gold);border-color:var(--tvm-gold)}
.tvm-calc .tvm-chk.is-on .tvm-box svg{opacity:1;transform:none}

/* ---- quantity ---- */
.tvm-calc .tvm-qty{display:inline-flex;align-items:center;border:1px solid var(--tvm-line-2);border-radius:14px;overflow:hidden}
.tvm-calc .tvm-qty button,
.tvm-calc .tvm-qty button:hover,
.tvm-calc .tvm-qty button:focus{
  width:52px;height:52px;display:grid;place-items:center;
  font-size:22px;line-height:1;color:var(--tvm-gold-2);background:transparent;transition:background .3s;
}
@media (hover:hover){.tvm-calc .tvm-qty button:hover{background:rgba(201,167,107,.1)}}
.tvm-calc .tvm-qty button:disabled{opacity:.35;cursor:default;background:transparent}
.tvm-calc .tvm-qty output{
  width:56px;text-align:center;font-family:var(--tvm-serif);font-size:28px;line-height:1;
  font-variant-numeric:lining-nums tabular-nums;color:var(--tvm-ivory);
}

/* ---- summary ---- */
.tvm-calc .tvm-sum .tvm-eyebrow{margin-bottom:24px}
.tvm-calc .tvm-lines{flex:1 1 auto;display:flex;flex-direction:column;gap:12px;font-size:14px;color:var(--tvm-ivory-2)}
.tvm-calc .tvm-lines li{
  display:flex;justify-content:space-between;align-items:flex-start;gap:16px;
  padding-bottom:12px;border-bottom:1px dashed var(--tvm-line-2);
  animation:tvm-in .45s var(--tvm-ease) both;
}
.tvm-calc .tvm-lines li span:last-child{flex:none;font-weight:600;color:var(--tvm-ivory)}
.tvm-calc .tvm-total{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin:30px 0 8px}
.tvm-calc .tvm-total span{font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--tvm-muted)}
.tvm-calc .tvm-total b{
  font-family:var(--tvm-serif);font-size:72px;font-weight:600;line-height:1;color:var(--tvm-gold-2);
  font-variant-numeric:lining-nums tabular-nums;
}
.tvm-calc .tvm-fine{font-size:12px;line-height:1.6;color:var(--tvm-muted-2);margin-bottom:24px}

/* ---- buttons ---- */
.tvm-calc .tvm-btn,
.tvm-calc .tvm-btn:hover,
.tvm-calc .tvm-btn:focus{
  position:relative;overflow:hidden;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  height:56px;padding:0 30px;border-radius:999px;
  font-family:var(--tvm-sans);font-size:15px;font-weight:600;letter-spacing:.02em;white-space:nowrap;
  transition:transform .4s var(--tvm-ease),box-shadow .4s var(--tvm-ease),border-color .3s,color .3s;
}
.tvm-calc .tvm-btn svg{width:18px;height:18px;transition:transform .4s var(--tvm-ease)}
.tvm-calc .tvm-btn:hover svg{transform:translateX(3px)}
.tvm-calc .tvm-btn-gold,
.tvm-calc .tvm-btn-gold:hover,
.tvm-calc .tvm-btn-gold:focus{
  width:100%;
  background:linear-gradient(135deg,var(--tvm-gold-2),var(--tvm-gold) 55%,var(--tvm-gold-3));
  color:#17130C;
  box-shadow:0 12px 40px -12px rgba(201,167,107,.55),inset 0 1px 0 rgba(255,255,255,.4);
}
.tvm-calc .tvm-btn-gold::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);
  transform:translateX(-120%);transition:transform .9s var(--tvm-ease);
}
.tvm-calc .tvm-btn-gold:hover{transform:translateY(-2px);box-shadow:0 20px 50px -12px rgba(201,167,107,.7),inset 0 1px 0 rgba(255,255,255,.4)}
.tvm-calc .tvm-btn-gold:hover::after{transform:translateX(120%)}
.tvm-calc .tvm-btn-gold:disabled{opacity:.6;cursor:wait;transform:none}
.tvm-calc .tvm-btn-ghost,
.tvm-calc .tvm-btn-ghost:hover,
.tvm-calc .tvm-btn-ghost:focus{border:1px solid var(--tvm-line-2);background:transparent;color:var(--tvm-ivory)}
.tvm-calc .tvm-btn-ghost:hover{border-color:var(--tvm-gold);color:var(--tvm-gold-2)}

/* ---- contact step ---- */
.tvm-calc .tvm-contact{
  grid-column:1/-1;
  padding:48px;
  border-top:1px solid var(--tvm-line);
  background:linear-gradient(180deg,rgba(201,167,107,.05),transparent 40%),var(--tvm-ink-2);
  animation:tvm-in .7s var(--tvm-ease) both;
}
.tvm-calc .tvm-contact-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px 48px;flex-wrap:wrap;margin-bottom:30px}
.tvm-calc .tvm-contact-head .tvm-title{margin-bottom:0}
.tvm-calc .tvm-contact-head .tvm-lead{max-width:420px}
.tvm-calc .tvm-inline-total{color:var(--tvm-gold-2);font-weight:600}
.tvm-calc .tvm-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.tvm-calc .tvm-field{display:flex;flex-direction:column;gap:8px}
.tvm-calc .tvm-field.tvm-full{grid-column:1/-1}
.tvm-calc .tvm-field > span{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--tvm-muted)}
.tvm-calc .tvm-field > span i{font-style:normal;color:var(--tvm-gold)}
.tvm-calc .tvm-field input,
.tvm-calc .tvm-field select,
.tvm-calc .tvm-field textarea{
  width:100%;margin:0;
  min-height:54px;padding:15px 18px;
  font-family:var(--tvm-sans);font-size:16px;line-height:1.4;color:var(--tvm-ivory);
  background:var(--tvm-ink);border:1px solid var(--tvm-line-2);border-radius:14px;box-shadow:none;
  transition:border-color .3s,box-shadow .3s;
  -webkit-appearance:none;appearance:none;
}
.tvm-calc .tvm-field textarea{min-height:96px;resize:vertical}
.tvm-calc .tvm-field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23C9A76B' stroke-width='1.5'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 18px center;padding-right:44px;
}
.tvm-calc .tvm-field input[type=date]{color-scheme:dark}
.tvm-calc .tvm-field input::placeholder,.tvm-calc .tvm-field textarea::placeholder{color:var(--tvm-muted-2);opacity:1}
.tvm-calc .tvm-field input:focus,
.tvm-calc .tvm-field select:focus,
.tvm-calc .tvm-field textarea:focus{outline:none;border-color:var(--tvm-gold);box-shadow:0 0 0 4px rgba(201,167,107,.14)}
.tvm-calc .tvm-field em{display:none;font-style:normal;font-size:12px;color:var(--tvm-err)}
.tvm-calc .tvm-field.is-err input{border-color:var(--tvm-err)}
.tvm-calc .tvm-field.is-err em{display:block}
.tvm-calc .tvm-hp{position:absolute !important;left:-9999px;width:1px;height:1px;overflow:hidden}
.tvm-calc .tvm-contact-foot{display:flex;justify-content:flex-end;align-items:center;gap:20px;margin-top:28px;flex-wrap:wrap}
.tvm-calc .tvm-contact-foot .tvm-btn-gold{width:auto;min-width:240px}
.tvm-calc .tvm-status{flex:1;min-width:220px;font-size:14px;color:var(--tvm-err)}
.tvm-calc .tvm-status a{color:var(--tvm-gold-2);text-decoration:underline}

/* ---- success ---- */
.tvm-calc .tvm-done{text-align:center;padding:20px 0 8px;animation:tvm-in .7s var(--tvm-ease) both}
.tvm-calc .tvm-tick{
  width:84px;height:84px;margin:0 auto 22px;border-radius:50%;
  border:1px solid var(--tvm-gold);display:grid;place-items:center;color:var(--tvm-gold-2);
}
.tvm-calc .tvm-tick svg{width:36px;height:36px}
.tvm-calc .tvm-done .tvm-lead{max-width:440px;margin:0 auto 28px}

@keyframes tvm-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width:960px){
  .tvm-calc .tvm-card{grid-template-columns:minmax(0,1fr)}
  .tvm-calc .tvm-sum{border-left:0;border-top:1px solid var(--tvm-line)}
  .tvm-calc .tvm-lines{flex:0 0 auto}
  .tvm-calc .tvm-fields{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:600px){
  .tvm-calc .tvm-card{border-radius:22px}
  .tvm-calc .tvm-form,
  .tvm-calc .tvm-sum,
  .tvm-calc .tvm-contact{padding:30px 18px}
  .tvm-calc .tvm-title{font-size:32px}
  .tvm-calc .tvm-label{margin:24px 0 10px}
  .tvm-calc .tvm-seg button,
  .tvm-calc .tvm-seg button:hover,
  .tvm-calc .tvm-seg button:focus{min-height:64px;padding:12px 6px;font-size:14px}
  .tvm-calc .tvm-seg button small{font-size:11px}
  .tvm-calc .tvm-chk{padding:12px 14px;gap:12px}
  .tvm-calc .tvm-txt{font-size:14px}
  .tvm-calc .tvm-total b{font-size:56px}
  .tvm-calc .tvm-fields{grid-template-columns:minmax(0,1fr);gap:16px}
  .tvm-calc .tvm-contact-foot .tvm-btn-gold{width:100%;min-width:0}
  .tvm-calc .tvm-btn,
  .tvm-calc .tvm-btn:hover,
  .tvm-calc .tvm-btn:focus{padding:0 20px}
}
@media (max-width:340px){
  .tvm-calc .tvm-seg-3{grid-template-columns:minmax(0,1fr)}
  .tvm-calc .tvm-seg-3 button{min-height:56px}
}
@media (prefers-reduced-motion:reduce){
  .tvm-calc *,.tvm-calc *::before,.tvm-calc *::after{animation:none !important;transition:none !important}
}
