/* RychléVýpočty.cz — Foundation PRO 2026-07-14
   Cohesive extension of the aggregate calculator system. */
:root{
  --agg-ink:#172c2d;
  --agg-deep:#203c3d;
  --agg-green:#2b7772;
  --agg-moss:#6e8f87;
  --agg-sand:#d59852;
  --agg-stone:#687a7b;
  --agg-soft:#f3f6f4;
  --agg-line:#d8e3e1;
  --agg-muted:#5e7273;
  --agg-shadow:0 24px 70px rgba(25,56,57,.12);
}

.foundation-pro{
  background:
    radial-gradient(circle at 8% 4%,rgba(49,137,128,.12),transparent 24%),
    radial-gradient(circle at 92% 8%,rgba(213,152,82,.13),transparent 22%),
    linear-gradient(180deg,#fbfcfb 0,#eff5f4 46%,#f9fbfa 100%);
}

.foundation-pro .eyebrow{background:#edf7f6;border-color:rgba(43,119,114,.18);color:#206e69}
.foundation-pro .btn-primary,.foundation-pro .header-cta{background:linear-gradient(135deg,#1d4f50,#267b75 60%,#d19751)}
.foundation-pro .btn-primary{box-shadow:0 14px 30px rgba(35,101,98,.23)}
.foundation-pro .mode-button.is-active{background:linear-gradient(145deg,#1c3d3f,#276f6c)}
.foundation-pro .mode-number,.foundation-pro .use-grid span,.foundation-pro .steps-grid span,.foundation-pro .example-card>span{background:#1f4a4b}
.foundation-pro .purpose-card input:checked+span,.foundation-pro .choice-card input:checked+span{border-color:#33877f;background:#edf8f6;box-shadow:inset 0 0 0 1px #33877f}
.foundation-pro .mode-intro-basic{background:#eef8f6;border-color:rgba(43,119,114,.2)}
.foundation-pro .mode-intro-basic>span{background:#2b7772}
.foundation-pro .basic-details{background:#fafcfb}
.foundation-pro .source-grid{grid-template-columns:repeat(3,1fr)}

.foundation-hero{
  background:
    radial-gradient(circle at 88% 10%,rgba(213,152,82,.2),transparent 27%),
    radial-gradient(circle at 12% 3%,rgba(43,119,114,.13),transparent 29%);
}
.foundation-hero::after{
  opacity:.12;
  background-image:
    linear-gradient(30deg,rgba(33,90,88,.16) 12%,transparent 12.5%,transparent 87%,rgba(33,90,88,.16) 87.5%,rgba(33,90,88,.16)),
    linear-gradient(150deg,rgba(33,90,88,.16) 12%,transparent 12.5%,transparent 87%,rgba(33,90,88,.16) 87.5%,rgba(33,90,88,.16));
  background-size:52px 30px;
}
.foundation-visual{
  background:
    radial-gradient(circle at 88% 9%,rgba(219,160,91,.34),transparent 28%),
    linear-gradient(145deg,#183637,#245a58 62%,#8c6338);
}
.slab-card{position:relative;overflow:hidden;min-height:330px;border-radius:25px;background:#edf2ef;box-shadow:inset 0 0 0 1px rgba(255,255,255,.68)}
.slab-house{position:relative;height:92px;background:linear-gradient(180deg,#eef7f4 0,#dce9e5 100%)}
.slab-house i{position:absolute;left:68px;bottom:0;width:176px;height:62px;background:#f7f8f3;border:4px solid #527875;border-bottom:0;clip-path:polygon(0 34%,50% 0,100% 34%,100% 100%,0 100%)}
.slab-house b{position:absolute;left:131px;bottom:0;width:42px;height:45px;background:#6d8f8b;border:3px solid #527875}
.slab-house span{position:absolute;left:87px;bottom:21px;width:31px;height:25px;background:#bddbd6;border:3px solid #527875}
.slab-layer{display:flex;justify-content:space-between;align-items:center;padding:0 20px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.2)}
.slab-layer span{font-size:.72rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.slab-layer b{font-size:.94rem}
.slab-concrete{height:55px;background:repeating-linear-gradient(135deg,#8b9695 0 7px,#a5aeac 7px 14px)}
.slab-insulation{height:36px;background:repeating-linear-gradient(90deg,#c69247 0 15px,#e1b46d 15px 30px)}
.slab-gravel{height:72px;background:radial-gradient(circle,#697776 0 3px,transparent 4px),radial-gradient(circle at 70% 60%,#536562 0 5px,transparent 6px),#879694;background-size:24px 22px,34px 30px,auto}
.slab-ground{height:64px;background:repeating-linear-gradient(15deg,#755b3f 0 9px,#664c34 9px 17px)}
.slab-marker{position:absolute;right:16px;top:105px;max-width:190px;padding:13px 15px;border-radius:18px;background:rgba(18,48,48,.92);box-shadow:0 14px 30px rgba(0,0,0,.24)}
.slab-marker span,.slab-marker strong{display:block}
.slab-marker span{color:rgba(255,255,255,.68);font-size:.68rem}
.slab-marker strong{margin-top:4px;color:#fff;font-size:1.22rem;line-height:1.05}

.basic-dimensions{margin-top:0}
.basic-area-confirm{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:12px;padding:14px 16px;border:1px solid #cfe0dd;border-radius:18px;background:linear-gradient(135deg,#edf8f6,#f8f4eb)}
.basic-area-confirm span{color:#5d7372;font-size:.79rem;font-weight:850}
.basic-area-confirm strong{color:#1e5957;font-size:1.15rem}
.budget-gauge{display:flex;height:10px;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.13)}
.budget-gauge i,.budget-gauge span,.budget-gauge b{display:block;min-width:2px;transition:width .25s ease}
.budget-gauge i{background:#6ec5b7}
.budget-gauge span{background:#8bbdd1}
.budget-gauge b{background:#e0aa5f}
.foundation-pro .result-main{
  background:
    radial-gradient(circle at 96% 4%,rgba(219,162,90,.53),transparent 31%),
    linear-gradient(145deg,#17383a,#24615e 66%,#79532f);
}
.foundation-pro .result-main output{font-size:clamp(2.65rem,5.4vw,4.35rem);white-space:nowrap}
.foundation-pro .gauge-legend{display:grid;grid-template-columns:repeat(3,1fr);font-size:.66rem}
.foundation-pro .gauge-legend span:nth-child(2){text-align:center}
.foundation-pro .gauge-legend span:last-child{text-align:right}
.foundation-pro .result-insight{border-left-color:#2f827b;background:#edf8f6}
.foundation-pro .result-insight strong{color:#1f5956}
.foundation-pro .result-actions button.copied{background:#1f5b58;color:#fff;border-color:#1f5b58}
.foundation-pro #drainageFields{margin-top:13px}
.foundation-pro #drainageFields[hidden]{display:none!important}
.foundation-pro .feature-toggle-row{margin-bottom:12px}
.foundation-pro .feature-toggle input:checked+span{border-color:#33877f;background:#edf8f6;box-shadow:inset 0 0 0 1px #33877f}
.foundation-pro .feature-toggle span{min-height:86px}
.foundation-pro .advanced-block{background:#f9fbfa}
.foundation-pro .breakdown-table td:nth-child(3),.foundation-pro .breakdown-table td:nth-child(4){font-weight:850;color:#213f40;white-space:nowrap}
.foundation-pro .scenario-card.is-current{border-color:#33877f;box-shadow:inset 0 0 0 1px #33877f,0 13px 28px rgba(32,92,88,.08)}
.foundation-pro .scenario-card span{font-size:.71rem;font-weight:900;text-transform:uppercase;letter-spacing:.06em}
.foundation-pro .scenario-card small{line-height:1.45}
.foundation-pro .foundation-components{grid-template-columns:repeat(4,1fr)}
.foundation-pro .reverse-shell{grid-template-columns:minmax(0,1fr) 300px}
.foundation-pro .offer-checks{grid-template-columns:repeat(3,1fr)}
.foundation-pro .source-grid a{transition:transform .18s ease,border-color .18s ease}
.foundation-pro .source-grid a:hover{transform:translateY(-3px);border-color:#9bc7c1}
.foundation-pro .related-card>span{background:#e9f5f3;color:#216c67}
.foundation-pro .content-article strong,.foundation-pro .source-grid strong,.foundation-pro .mistake-grid strong{color:#214e4c}
.foundation-pro .formula-box{background:linear-gradient(135deg,#eaf7f5,#f8f1e6);border-color:#bddbd6;color:#214e4d}
.foundation-pro .notice-box{background:#f8f1e6;border-color:rgba(190,135,68,.27)}

@media (min-width:1101px){
  .foundation-pro .aggregate-result{top:148px}
  .foundation-pro .aggregate-form{min-width:0}
  .foundation-pro .aggregate-work{grid-template-columns:minmax(0,1.08fr) minmax(390px,.82fr)}
}

@media (max-width:1100px){
  .foundation-pro .source-grid{grid-template-columns:repeat(2,1fr)}
  .foundation-pro .foundation-components{grid-template-columns:repeat(2,1fr)}
  .foundation-pro .offer-checks{grid-template-columns:repeat(2,1fr)}
  .foundation-visual{max-width:720px}
}

@media (max-width:760px){
  .foundation-pro .aggregate-work{display:flex;flex-direction:column}
  .foundation-pro .aggregate-form{order:1;width:100%}
  .foundation-pro .aggregate-result{order:2;width:100%}
  .foundation-pro .purpose-grid{grid-template-columns:1fr 1fr}
  .foundation-pro .purpose-card span{min-height:92px;padding:14px}
  .foundation-pro .basic-dimensions{grid-template-columns:1fr 1fr}
  .foundation-pro .field-grid{gap:11px}
  .foundation-pro .result-main output{font-size:clamp(2.55rem,13vw,3.35rem)}
  .foundation-pro .gauge-legend{font-size:.61rem}
  .foundation-pro .source-grid,.foundation-pro .foundation-components,.foundation-pro .offer-checks{grid-template-columns:1fr}
  .foundation-pro .reverse-shell{grid-template-columns:1fr}
  .foundation-pro .content-article p,.foundation-pro .content-article li{line-height:1.72}
}

/* Tablet guard: the shared calibration layout keeps two columns above 760 px.
   Foundation PRO needs more room for labelled price fields, so it stacks sooner. */
@media (max-width:840px){
  body.foundation-pro .aggregate-hero{padding:22px 0 20px}
  body.foundation-pro .breadcrumb,
  body.foundation-pro .foundation-visual,
  body.foundation-pro .anchor-nav,
  body.foundation-pro .lead-desktop,
  body.foundation-pro .aggregate-trust{display:none!important}
  body.foundation-pro .lead-mobile{display:inline!important}
  body.foundation-pro .aggregate-hero-grid{grid-template-columns:1fr!important;gap:20px!important}
  body.foundation-pro .aggregate-hero-copy h1{font-size:clamp(2.35rem,8.5vw,3.55rem)}
  body.foundation-pro .aggregate-work{
    display:flex!important;
    flex-direction:column!important;
    width:calc(100% - 24px)!important;
    gap:16px!important;
    margin:20px auto 32px!important;
    padding:0!important;
  }
  body.foundation-pro .aggregate-form,
  body.foundation-pro .aggregate-result{
    position:relative!important;
    top:auto!important;
    order:initial!important;
    width:100%!important;
    min-width:0!important;
    border-radius:25px!important;
  }
  body.foundation-pro .aggregate-form{order:1!important}
  body.foundation-pro .aggregate-result{order:2!important}
  body.foundation-pro .main-nav{display:none}
}

@media (max-width:480px){
  .foundation-pro .purpose-grid,.foundation-pro .basic-dimensions{grid-template-columns:1fr}
  .foundation-pro .purpose-card span{min-height:0}
  .foundation-pro .result-main output{font-size:2.45rem}
  .foundation-pro .result-metrics{grid-template-columns:1fr 1fr}
  .foundation-pro .gauge-legend{grid-template-columns:1fr;gap:4px}
  .foundation-pro .gauge-legend span,.foundation-pro .gauge-legend span:nth-child(2),.foundation-pro .gauge-legend span:last-child{text-align:left}
}

@media print{
  .foundation-pro .aggregate-result{display:block!important}
  .foundation-pro .result-actions{display:none!important}
}
