/* =====================================================================
   Адв. Георгиева - pages.css: шаблоните на страниците (Услуга, Сфери,
   За мен, Консултации, Контакти). Само правилата от makets/final/assets/
   maket.css, които ги няма в base.css (карти, hero, .usp, .split, .map-box
   са там). Зарежда се след base.css само на страници с шаблон (setup.php).
   ===================================================================== */

/* ---------- общо: дребните отстояния, които в макета са inline style ---------- */
.page-hero__sub p+p{margin-top:12px}
.zamen-prose{margin-top:20px}
.zamen-btns{margin-top:28px}
.kontakti-map{margin-top:var(--gap)}
.form-contacts{margin-top:22px}
.form-grid>div>.form-note{margin-top:14px}

/* ---------- услуга: тяло + странична колона ---------- */
.with-side{display:grid;grid-template-columns:minmax(0,var(--container-text)) 340px;justify-content:space-between;gap:56px;align-items:start}
/* sticky е разрешеното свойство (TASKS B2.2) - колоната следва четенето, без да вади нищо от потока */
.side{position:sticky;top:calc(var(--header-h) + 24px);display:grid;gap:20px}
.side-card{background:var(--c-surface);border-radius:var(--r-card);padding:26px}
.side-card h3{font-size:20px}
.side-card p{margin-top:8px;font-size:15px}
.side-card .btn{margin-top:18px}
/* В хедъра телефонът се свива до икона под 1180px и изчезва под 1024px; в картата трябва да остане цял. */
.side-card .header-phone{display:inline-flex;margin-top:16px;font-size:17px}
.side-card .header-phone span{display:inline}
.side-links{list-style:none;margin-top:12px}
.side-links a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 0;border-bottom:1px solid var(--c-border);color:var(--c-text);text-decoration:none;font-size:15px}
.side-links a svg{width:16px;height:16px;flex:none;color:var(--c-accent)}
.side-links a:hover{color:var(--c-accent-hover)}
@media (max-width:1100px){.with-side{grid-template-columns:1fr}.side{position:static}}

/* ---------- формата: карта + контакти ---------- */
.form-card{background:#fff;border:1px solid var(--c-border);border-radius:var(--r-card);padding:36px;box-shadow:var(--shadow-soft)}
.form-card>h2{font-size:clamp(22px,1.1rem + .8vw,28px)}
.form-card>.form-note{margin-top:10px;font-size:15px;color:var(--c-muted);font-style:italic}
.form-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:start}
.contact-list{list-style:none;display:grid;gap:22px}
.contact-list li{display:flex;gap:16px;align-items:flex-start}
.contact-list .icon-circle{flex:none}
.contact-list b{display:block;font:600 17px/1.35 var(--f-body);color:var(--c-text)}
.contact-list b a{color:inherit;text-decoration:none}
.contact-list small{display:block;margin-top:3px;font-size:14px;color:var(--c-muted)}
@media (max-width:1023px){.form-grid{grid-template-columns:1fr;gap:32px}.form-card{padding:24px 18px}}

/* ---------- Fluent Forms (селекторите от design/live/konsultacii-dom.md) ----------
   Плъгинът носи свой CSS + „styler" (.fluentform_wrapper_N.ffs_custom_wrap …,
   за radio до 6 класа тежест). :is(.frm-fluent-form,#ag-ff) хваща всяка форма,
   но носи тежестта на id - така стилът на макета печели без !important. */
.fluentform{margin-top:26px}
.fluentform :is(.frm-fluent-form,#ag-ff) fieldset{border:0;margin:0;padding:0;min-width:0}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-t-container{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-t-cell{width:auto;padding:0}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-group{margin-bottom:18px}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-input--label{margin-bottom:7px}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-input--label label{font:600 var(--t-small)/1.4 var(--f-body);color:var(--c-text)}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-is-required.asterisk-right label::after{content:" *";margin-left:0;color:var(--c-err)}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-form-control{display:block;width:100%;min-height:52px;padding:13px 16px;border:1px solid var(--c-border);border-radius:var(--r-field);background:#fff;font:400 16px/1.4 var(--f-body);color:var(--c-text);transition:border-color .15s,box-shadow .15s;-webkit-appearance:none;appearance:none}
.fluentform :is(.frm-fluent-form,#ag-ff) textarea.ff-el-form-control{min-height:130px;resize:vertical}
.fluentform :is(.frm-fluent-form,#ag-ff) select.ff-el-form-control{padding-right:44px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B58C5A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center/18px}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-form-control::placeholder{color:#9AA0AB}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-form-control:focus{outline:0;border-color:var(--c-accent);box-shadow:0 0 0 3px var(--c-accent-soft)}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-form-check{display:inline-flex;margin:0 22px 0 0}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-form-check-label{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0;cursor:pointer;font-size:16px;color:var(--c-text)}
/* Кръгчето на radio: 22px е размерът на индикатора (като иконите), не височина на блок. */
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-form-check-input{appearance:none;-webkit-appearance:none;transform:none;flex:none;width:22px;height:22px;margin:0;border:1.5px solid #C9C2B6;border-radius:50%;background:#fff;display:grid;place-content:center;cursor:pointer}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-form-check-input::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--c-accent);transform:scale(0);transition:transform .12s}
/* Кръгчето на „styler"-а (::after) се маха - иначе има две точки една върху друга. */
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-form-check-input::after{content:none;display:none}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-form-check-input:checked{border-color:var(--c-accent)}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-form-check-input:checked::before{transform:scale(1)}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-form-check-input:focus-visible{outline:2px solid var(--c-accent);outline-offset:3px}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-is-error .ff-el-form-control,.fluentform :is(.frm-fluent-form,#ag-ff) .ff-el-is-error .ff-el-form-check-input{border-color:var(--c-err)}
.fluentform :is(.frm-fluent-form,#ag-ff) .error.text-danger{margin-top:6px;font-size:13px;font-weight:500;color:var(--c-err);text-align:left}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-btn-submit{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:13px 32px;border:0;border-radius:var(--r-btn);background:var(--c-accent);color:var(--c-dark);font:600 15px/1.2 var(--f-body);cursor:pointer;box-shadow:none;transition:background-color .18s}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-btn-submit:hover,.fluentform :is(.frm-fluent-form,#ag-ff) .ff-btn-submit:focus-visible{background:var(--c-accent-hover);color:#fff}
.fluentform :is(.frm-fluent-form,#ag-ff) .ff-btn-submit:is(.is-sending,.ff-working,[disabled]){opacity:.75;pointer-events:none}
.fluentform :is(.ff-errors-summary,.ff-errors-in-stack,#ag-ff){margin:0 0 18px;padding:14px 16px;border:0;border-radius:var(--r-field);background:#FCEEEE;color:var(--c-err);font-size:14px;font-weight:500}
/* Успехът: Fluent скрива формата и вмъква div.ff-message-success (role=status) - зелената карта на #uspeh. */
.fluentform :is(.ff-message-success,#ag-ff){display:flex;gap:16px;align-items:flex-start;margin-top:22px;padding:24px;border:1px solid #BFE3CD;border-left:4px solid var(--c-ok);border-radius:var(--r-card);background:#F1FAF4;box-shadow:none;color:var(--c-text);font:600 17px/1.4 var(--f-body);text-align:left}
.fluentform :is(.ff-message-success,#ag-ff)::before{content:"";flex:none;width:24px;height:24px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232E7D4F' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E") no-repeat center/contain}
.fluentform :is(.ff-message-success,#ag-ff) b{display:block;font:600 17px/1.4 var(--f-body)}
.fluentform :is(.ff-message-success,#ag-ff):focus{outline:0}
@media (max-width:640px){
  .fluentform :is(.frm-fluent-form,#ag-ff) .ff-t-container{grid-template-columns:1fr;gap:0}
  .fluentform :is(.frm-fluent-form,#ag-ff) .ff-btn-submit{width:100%}
}

/* ---------- контакти ---------- */
.contact-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.contact-card{background:#fff;border:1px solid var(--c-border);border-radius:var(--r-card);padding:28px}
.contact-card h3{font:700 17px/1.35 var(--f-body);margin-top:16px}
.contact-card p{margin-top:8px;font-size:16px;line-height:1.6;color:var(--c-text)}
.contact-card p a{color:var(--c-text);text-decoration:none;font-weight:600}
.contact-card small{display:block;margin-top:4px;color:var(--c-muted);font-size:14px}
.contact-card .link-arrow{margin-top:14px}
@media (max-width:1023px){.contact-cards{grid-template-columns:1fr}}