.calc{border-radius:var(--r-xl);background:var(--cream);box-shadow:var(--shadow-md);gap:2rem;padding:clamp(1.5rem,4vw,3rem);display:grid}@media (min-width:900px){.calc{grid-template-columns:1fr 1.1fr;align-items:center;gap:3.5rem}}.calc__inputs{gap:2rem;display:grid}.calc__field{grid-template-columns:1fr auto;align-items:baseline;gap:.75rem 1rem;display:grid}.calc__field label{font-weight:600;font-size:var(--step--1)}.calc__val{font-family:var(--font-display);font-size:var(--step-3);letter-spacing:-.02em;font-weight:380;line-height:1}.calc__field input{grid-column:1/-1}.calc input[type=range]{--fill:50%;appearance:none;cursor:pointer;background:0 0;width:100%;height:2rem}.calc input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg, var(--pandan-700) var(--fill), var(--sand) var(--fill));border-radius:99px;height:6px}.calc input[type=range]::-moz-range-track{background:var(--sand);border-radius:99px;height:6px}.calc input[type=range]::-moz-range-progress{background:var(--pandan-700);border-radius:99px;height:6px}.calc input[type=range]::-webkit-slider-thumb{appearance:none;width:26px;height:26px;box-shadow:0 0 0 1px var(--line-strong), 0 4px 12px #00000026;transition:transform .3s var(--ease-spring);background:#fff;border-radius:50%;margin-top:-10px}.calc input[type=range]::-moz-range-thumb{width:26px;height:26px;box-shadow:0 0 0 1px var(--line-strong), 0 4px 12px #00000026;background:#fff;border:0;border-radius:50%}.calc input[type=range]:active::-webkit-slider-thumb{transform:scale(1.15)}.calc input[type=range]:focus-visible{outline:2px solid var(--focus);outline-offset:4px;border-radius:8px}.calc__results{gap:1.25rem;display:grid}.calc__row-head{font-size:var(--step--1);justify-content:space-between;align-items:baseline;gap:1rem;font-weight:560;display:flex}.calc__row-head strong{font-family:var(--font-display);font-size:var(--step-2);font-weight:420}.calc__row--them strong{color:var(--clay-ink)}.calc__row--us strong{color:var(--pandan-700)}.calc__bar{background:var(--paper-2);border-radius:99px;height:12px;margin-top:.5rem;overflow:hidden}.calc__bar span{height:100%;width:var(--w);border-radius:inherit;transition:width .6s var(--ease-out);display:block}.calc__row--them .calc__bar span{background:linear-gradient(90deg, var(--clay), #d27c55)}.calc__row--us .calc__bar span{background:var(--pandan-700)}.calc__per{font-size:var(--step--2);color:var(--ink-3);margin-top:.35rem}.calc__saving{border-radius:var(--r-md);background:var(--pandan-800);color:#f7f2eacc;font-size:var(--step--1);margin-top:.5rem;padding:1.4rem 1.5rem}.calc__saving-num{font-family:var(--font-display);font-size:var(--step-5);letter-spacing:-.04em;color:var(--turmeric-300);margin-block:.3rem;font-weight:320;line-height:1}.calc__note{font-size:var(--step--2);color:var(--ink-3)}
.faq{border-top:1px solid var(--line-strong)}.faq__item{border-bottom:1px solid var(--line-strong)}.faq__item::details-content{block-size:0;transition:block-size .5s var(--ease-out), content-visibility .5s allow-discrete;overflow:hidden}.faq__item[open]::details-content{block-size:auto}.faq summary{cursor:pointer;font-family:var(--font-display);font-size:var(--step-1);letter-spacing:-.01em;justify-content:space-between;align-items:center;gap:1.5rem;padding:1.4rem 0;font-weight:420;line-height:1.3;list-style:none;display:flex}:lang(th) .faq summary{line-height:1.5}.faq summary::-webkit-details-marker{display:none}.faq__icon{width:2.4rem;height:2.4rem;box-shadow:inset 0 0 0 1px var(--line-strong);transition:transform .5s var(--ease-spring), background-color .3s, color .3s;border-radius:50%;flex:none;place-items:center;display:grid}.faq summary:hover .faq__icon{background:var(--ink);color:var(--cream);box-shadow:none}.faq__item[open] .faq__icon{transform:rotate(45deg)}.faq__a{max-width:44rem;color:var(--ink-2);padding-bottom:1.5rem}