/* One-screen console: calculator + layout + price + best areas (homepage and layout planner page).
   Loaded only on pages whose calculator marker says planner="1". */
#calculator.block{padding:22px 0}
#calculator h2{font-size:clamp(22px,2.4vw,28px)}
.calc-rates{margin:6px 0 0}
.calc-rates>summary{display:inline-block;cursor:pointer;font-size:.82rem;font-weight:600;color:var(--accent);padding:4px 0}
.calc-rates[open]{margin-bottom:10px}
/* three columns on laptop and tablet landscape */
@media(min-width:1000px){
  #calculator .calc:has(.calc-areas){grid-template-columns:minmax(0,.9fr) minmax(0,1.15fr) minmax(0,1.05fr);gap:14px;align-items:stretch;margin-top:12px}
}
@media(min-width:700px) and (max-width:999px){
  #calculator .calc:has(.calc-areas){grid-template-columns:1fr 1fr;gap:14px;align-items:start}
  #calculator .calc-areas{grid-column:1/-1}
}
#calculator .calc:has(.calc-areas) .calc-inputs{padding:16px;gap:10px}
#calculator .calc:has(.calc-areas) .pl-mode legend{font-size:1rem;margin-bottom:6px}
#calculator .pl-seg span{min-height:34px}
#calculator .pl-line{padding:6px 0}
#calculator .pl-step button{width:32px;height:32px}
#calculator .pl-step input[type=number]{min-height:32px;font-size:1.2rem;width:56px}
#calculator .pl-controls .calc-fine{display:none}
#calculator .calc:has(.calc-areas) .areaslide{padding:8px 12px}
#calculator .calc-right{gap:12px}
#calculator .calc:has(.calc-areas) .pl-plan{padding:14px}
#calculator .pl-head{margin-bottom:8px}
#calculator .pl-sheet{padding:6px}
#calculator .pl-sheet svg{max-height:min(34vh,290px);margin:0 auto;width:auto;max-width:100%}
#calculator .pl-legend{margin:8px 0 0;font-size:.7rem}
#calculator .pl-incl{margin-top:8px;padding-top:6px}
#calculator .pl-incl>summary{cursor:pointer;font-size:.82rem}
#calculator .calc:has(.calc-areas) .calc-out{padding:16px 18px}
#calculator .calc:has(.calc-areas) .calc-out .figure{font-size:34px}
#calculator .calc:has(.calc-areas) .calc-out .range{font-size:.84rem}
#calculator .calc:has(.calc-areas) .calc-out .note{font-size:.72rem;margin-top:6px;line-height:1.4}
#calculator .calc-lead{margin-top:10px;padding:10px 12px}
#calculator .calc-lead>p:first-child{font-size:.88rem;margin-bottom:6px}
#calculator .calc-lead input,#calculator .calc-lead .btn{min-height:38px}
/* best-areas column: dark card */
#calculator .calc-areas{--card:#1d1f22;--line2:#34373b;--txt:#f5f1e8;--mut:#a9a69d;--br:#c9a15f;
  display:flex;flex-direction:column;gap:10px;min-width:0;padding:18px;border-radius:20px;color:var(--txt);border:1px solid #2a2c30;
  background:radial-gradient(120% 70% at 90% -8%,#2d2820 0,#141517 58%);box-shadow:0 14px 36px rgba(22,24,26,.28)}
.cfx-eyebrow{margin:0;font:600 10.5px/1 "Manrope",system-ui,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--br)}
#calculator .calc-areas h3{margin:0;font-family:var(--serif,Georgia,serif);font-weight:500;font-size:clamp(20px,1.9vw,24px);line-height:1.15;color:var(--txt)}
.cfx-form{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0;max-width:none}
.cfx-form label{display:flex;flex-direction:column;gap:2px;margin:0;padding:7px 12px 6px;border-radius:12px;background:var(--card);border:1px solid var(--line2);min-width:0}
.cfx-form label span{font:600 9.5px/1.2 "Manrope",system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.cfx-form select{width:100%;min-width:0;height:24px;min-height:0;padding:0 18px 0 0;border:0;border-radius:0;background-color:transparent;color:var(--txt);font:600 14.5px "Manrope",system-ui,sans-serif;appearance:none;-webkit-appearance:none;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--br) 50%),linear-gradient(135deg,var(--br) 50%,transparent 50%);background-position:calc(100% - 7px) 10px,calc(100% - 2px) 10px;background-size:5px 5px;background-repeat:no-repeat}
.cfx-form select option{color:#141517;background:#fff}
.cfx-form label:focus-within{box-shadow:0 0 0 2px var(--br)}
.cfx-form select:focus{outline:0}
.al-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.cfx-sum{margin:0;font-size:12px;line-height:1.35;color:var(--mut)}
.cfx-sum b{color:var(--br);font-weight:600}
.cfx-cards{display:flex;flex-direction:column;gap:8px}
.cfx-r{position:relative;display:grid;grid-template-columns:88px 1fr;align-items:center;gap:12px;min-height:90px;padding:12px 14px 14px;border-radius:14px;background:linear-gradient(180deg,#212326,#1a1c1f);border:1px solid var(--line2);overflow:hidden;transition:transform .3s cubic-bezier(.23,1,.32,1),border-color .2s;min-width:0}
.cfx-r:hover{transform:translateX(3px);border-color:#5a4a2e}
.cfx-r.top{border-color:rgba(201,161,95,.65);background:linear-gradient(180deg,#2a251d,#1b1b1d)}
.cfx-k{display:flex;flex-direction:column;gap:2px;padding-right:12px;border-right:1px solid var(--line2)}
.cfx-k em{font:600 9.5px/1 "Manrope",sans-serif;letter-spacing:.14em;text-transform:uppercase;font-style:normal;color:#8d8a82}
.cfx-r.top .cfx-k em{color:var(--br)}
.cfx-k b{font-family:var(--serif,Georgia,serif);font-weight:500;font-size:34px;line-height:1.05;color:#c9a15f;letter-spacing:-.02em}
.cfx-k span{font-size:10.5px;line-height:1.2;color:var(--mut)}
.cfx-n{min-width:0}
.cfx-t{margin:0 0 4px;display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.cfx-t a{font-family:var(--serif,Georgia,serif);font-size:17px;line-height:1.15;color:#f5f1e8;text-decoration:none;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cfx-t a:hover{color:var(--br)}
.cfx-t small{font:600 10px/1 "Manrope",sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#8d8a82;white-space:nowrap}
.cfx-l{margin:0;font-size:11.5px;line-height:1.5;color:#b8b5ac;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cfx-fit{position:absolute;left:0;bottom:0;height:3px;width:100%;transform-origin:left;background:linear-gradient(90deg,#8d6c36,#c9a15f);border-radius:0 3px 3px 0}
.cfx-empty{margin:0;padding:12px;color:var(--mut);font-size:13px}
.cfx-mail{display:flex;flex-wrap:wrap;gap:8px;margin:0;max-width:none;margin-top:auto}
.cfx-mail input[type=email]{flex:1 1 150px;height:42px;min-height:0;padding:0 14px;border-radius:999px;border:1px solid var(--line2);background:var(--card);color:var(--txt);font:500 14px "Manrope",sans-serif;min-width:0}
.cfx-mail input::placeholder{color:#77756d}
.cfx-mail input:focus{outline:2px solid var(--br);outline-offset:1px}
.cfx-mail button{height:42px;padding:0 20px;border:0;border-radius:999px;background:var(--br);color:#141517;font:700 14px "Manrope",sans-serif;cursor:pointer;white-space:nowrap;transition:transform .15s,background .2s}
.cfx-mail button:hover{background:#d8b172}
.cfx-mail button:active{transform:scale(.97)}
.cfx-mail .al-err{flex-basis:100%;margin:0;color:#ff9d8a;font-size:12.5px}
.cfx-mail .al-err:empty{display:none}
.cfx-ok{margin:0;font-size:14px;color:var(--txt)}
.cfx-src{margin:0;font-size:10.5px;line-height:1.4;color:#85827a}
@media(min-width:700px) and (max-width:999px){
  #calculator .calc-areas{padding:18px}
  .cfx-cards{flex-direction:row}.cfx-r{flex:1;grid-template-columns:1fr;gap:6px}.cfx-k{border-right:0;padding:0;flex-direction:row;align-items:baseline;gap:8px;flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){.cfx-r,.cfx-mail button{transition:none}}
/* tightening for one screen */
#calculator .cfx-sum,#calculator .cfx-sum span{color:#a9a69d}
#calculator .cfx-sum b{color:#c9a15f}
#calculator .cfx-src{color:#85827a}
#calculator .cfx-form label span{color:#a9a69d}
@media(min-width:1000px){
  #calculator .calc:has(.calc-areas){align-items:start}
  #calculator .calc:has(.calc-areas) .calc-inputs{align-content:start}
  #calculator .calc-areas{align-self:stretch}
  #calculator .pl-legend{display:none}
  #calculator .pl-sheet svg{max-height:min(32vh,250px)}
  #calculator .calc:has(.calc-areas) .calc-out .note{display:none}
  #calculator .calc-lead>p:first-child{display:none}
  #calculator .calc-lead{margin-top:8px}
  #calculator .calc-lead form#plform{flex-wrap:nowrap}
  #calculator .calc-lead form#plform input{flex:1 1 0;min-width:0;font-size:.9rem}
  #calculator .calc-lead form#plform .btn{padding-left:14px;padding-right:14px}
  .calc-rates:not([open]){position:absolute;top:4px;right:24px;margin:0}
  #calculator .wrap{position:relative}
}
.calc-rates>summary::after,.calc-rates>summary::before{display:none!important;content:none!important}
.calc-rates>summary{list-style:none;padding:2px 0;border:0}
.calc-rates>summary::-webkit-details-marker{display:none}
#calculator .pl-incl>summary{padding:6px 0!important;min-height:0!important;border:0!important}
#calculator .pl-incl{border-top:1px solid var(--line)}
@media(min-width:1000px){
  #calculator .lede{max-width:none;padding-right:240px;font-size:.88rem}
  #calculator .calc:has(.calc-areas) .pl-mode legend{font-size:.95rem}
  #calculator .pl-sheet svg{max-height:min(30vh,215px)}
  #calculator.block{padding:18px 0}
}
@media(min-width:700px) and (max-width:999px){
  #calculator .pl-legend{display:none}
  #calculator .calc:has(.calc-areas) .calc-out .note{display:none}
  #calculator .calc-lead>p:first-child{display:none}
  #calculator .calc:has(.calc-areas) .calc-inputs{align-content:start}
  #calculator .pl-sheet svg{max-height:230px}
  #calculator .calc-lead form#plform{flex-wrap:nowrap}
  #calculator .calc-lead form#plform input{flex:1 1 0;min-width:0;font-size:.9rem}
}
#calculator .cfx-l{color:#b8b5ac}
#calculator .cfx-t a{color:#f5f1e8}
#calculator .cfx-t small,#calculator .cfx-k em{color:#8d8a82}
#calculator .cfx-r.top .cfx-k em{color:#c9a15f}
#calculator .cfx-k b{color:#c9a15f}
#calculator .cfx-k span{color:#a9a69d}
@media(min-width:1000px){
  #calculator .calc:has(.calc-areas){grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr) minmax(0,1.25fr)}
  #calculator .calc-areas{padding:16px}
  .cfx-cards{gap:7px}
}
