/* MiterCut Site blocks: the forms and the mat demo. Plain colours with the theme's tokens when it's there. */
:root { --mcs-accent: var(--wp--preset--color--accent, #1F5F5B); --mcs-accent-dark: var(--wp--preset--color--accent-dark, #174845); --mcs-accent-soft: var(--wp--preset--color--accent-soft, #EEF4F3); --mcs-line-2: #C9C5BD; --mcs-panel: #FFFFFF; --mcs-wall: var(--wp--preset--color--wall, #ECE8E1); --mcs-ink-2: var(--wp--preset--color--ink-2, #5A5852); }
.mc-form { display: grid; gap: 12px; max-width: 520px; }
.mc-form label { display: grid; gap: 6px; font-weight: 700; }
.mc-form input[type=email], .mc-form input[type=text], .mc-form textarea { font: inherit; padding: 12px 14px; border: 2px solid var(--mcs-line-2); border-radius: 12px; background: var(--mcs-panel); }
.mc-form input:focus, .mc-form textarea:focus { border-color: var(--mcs-accent); outline: none; }
.mc-form button { font: inherit; font-weight: 700; min-height: 52px; border: 0; border-radius: 14px; background: var(--mcs-accent); color: #fff; padding: 0 24px; cursor: pointer; justify-self: start; }
.mc-form button:hover { background: var(--mcs-accent-dark); }
.mc-form .mc-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.mc-form-msg { padding: 12px 16px; border-radius: 12px; background: var(--mcs-accent-soft); color: var(--mcs-accent-dark); font-weight: 700; }
.mc-form-msg.bad { background: #FBEAE7; color: #A33A2C; }
.mc-form .mc-check { display: flex; align-items: flex-start; gap: 10px; font-weight: 400; font-size: 16px; text-align: left; }
.mc-form .mc-check input { width: 20px; height: 20px; margin-top: 3px; accent-color: var(--mcs-accent); flex: none; }
.mc-matscene { background: var(--mcs-wall); border-radius: 22px; padding: clamp(24px, 4vw, 44px); display: grid; gap: 22px; justify-items: center; }
.mc-matscene-frame { width: auto; padding: 16px; background: linear-gradient(135deg, #7A5636, #5A3D24); border-radius: 3px; box-shadow: 0 24px 40px rgba(30,30,28,0.22); }
.mc-matscene-mat { --b: 26px; background: #F7F3EA; padding: var(--b); box-shadow: inset 0 0 0 1px rgba(0,0,0,0.08); transition: padding .08s linear; }
.mc-matscene-art { height: 100%; background:
  radial-gradient(circle at 70% 30%, #C8794F 0 13%, transparent 13.5%),
  radial-gradient(120% 70% at 30% 100%, #5E7752 0 40%, transparent 40.5%),
  radial-gradient(130% 60% at 80% 100%, #7E9466 0 42%, transparent 42.5%), #E6D8BD;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.15), 0 0 0 1px #fff; }
.mc-matscene-read { display: grid; grid-template-columns: repeat(3, auto); gap: 18px 28px; text-align: center; }
.mc-matscene-read b { display: block; font-size: 24px; font-variant-numeric: tabular-nums; }
.mc-matscene-note { margin: 0; text-align: center; }
.mc-matscene-mat { --mat: #F7F3EA; --mat2: #C8794F; background: var(--mat); transition: padding .08s linear, background-color .25s; }
.mc-matscene-mat { --H: min(440px, calc((100vw - 120px) * 1.15)); --r: .8462; --p: .0833; box-sizing: border-box; height: var(--H); width: calc(var(--H) * var(--r)); padding: calc(var(--H) * var(--p)); transition: padding .08s linear, background-color .25s; }
.mc-matscene-inner { height: 100%; box-sizing: border-box; transition: padding .2s, background-color .25s; }
.mc-matscene-mat.double .mc-matscene-inner { padding: 5px; background: var(--mat2); }
.mc-matscene-play { width: min(420px, 100%); display: grid; gap: 14px; }
.mc-matscene-slider { display: grid; gap: 6px; text-align: center; }
.mc-matscene-slider input { width: 100%; accent-color: var(--mcs-accent); height: 28px; cursor: grab; }
.mc-matscene-slider input:active { cursor: grabbing; }
.mc-matscene-chips { display: flex; gap: 10px; align-items: center; justify-content: center; flex-wrap: wrap; }
.mc-matscene-chips button { width: 30px; height: 30px; border-radius: 50%; border: 2px solid #fff; background: var(--c); box-shadow: 0 0 0 1px rgba(0,0,0,.18); cursor: pointer; padding: 0; }
.mc-matscene-chips button.on { box-shadow: 0 0 0 3px var(--mcs-accent); }
.mc-matscene-chips button:focus-visible, .mc-matscene-slider input:focus-visible { outline: 3px solid var(--mcs-accent); outline-offset: 3px; }
.mc-matscene-double { display: inline-flex; gap: 6px; align-items: center; margin-left: 8px; font-size: 15px; cursor: pointer; }
.mc-matscene-double input { accent-color: var(--mcs-accent); width: 18px; height: 18px; }
.wp-block-mitercut-signup.mc-form-wrap { display: flex; justify-content: center; margin: 28px auto 14px; }
.wp-block-mitercut-contact .mc-form { max-width: 520px; }
.mc-form, .mc-form * { box-sizing: border-box; }
.mc-matscene .mc-small { font-size: 15px; color: var(--mcs-ink-2); }
.mc-matscene-read.no-price { grid-template-columns: repeat(2, auto); }
@media (max-width: 600px) { .mc-matscene-read { grid-template-columns: 1fr 1fr; } }