/*
 * M.A. Fire Place — native Elementor pages built by `wp maf pages` (Maintenance & cleaning, Contact, Convert).
 * Styles the native widgets (Heading, Text Editor, Button, Icon Box, Icon List) inside containers that carry the
 * class .maf-page, using the DESIGN-v2 tokens defined on :root by maf-core.css. Loaded only on pages containing
 * such a container (inc/render/pages.php). Section padding, backgrounds and images are Elementor settings, so the
 * owner can change them in the editor; this file only sets the type, buttons, cards and grids.
 *
 * Classes set by the builder:
 *   sections   .maf-page + .maf-cream | .maf-sand | .maf-dark (+ .maf-hero)
 *   widgets    .maf-eyebrow .maf-h1 .maf-h2 .maf-h3 .maf-lede .maf-note .maf-illu .maf-checklist .maf-iconbox
 *              .maf-btn + .maf-btn-fire | .maf-btn-line | .maf-btn-glass
 *   containers .maf-grid + .maf-grid-2|3|4, .maf-card, .maf-actions, .maf-flush
 */

/* ---------- base ---------- */
.elementor .e-con.maf-page{font-family:var(--f-body);color:var(--text)}
.elementor .e-con.maf-dark{color:var(--cream)}
.maf-page .elementor-widget{font-family:var(--f-body)}

/* ---------- headings ---------- */
.maf-page .elementor-widget-heading .elementor-heading-title{margin:0;font-family:var(--f-display);font-weight:500;line-height:1.08;letter-spacing:-.01em;color:var(--text);text-wrap:balance}
.maf-page.maf-dark .elementor-widget-heading .elementor-heading-title{color:var(--cream)}
.maf-page .maf-h1 .elementor-heading-title{font-size:clamp(2.5rem,1.3rem + 4vw,4.2rem);line-height:1.03;max-width:17ch}
.maf-page .maf-h2 .elementor-heading-title{font-size:clamp(2.1rem,1.2rem + 2.9vw,3.4rem);max-width:22ch}
.maf-page .maf-h3 .elementor-heading-title{font-size:clamp(1.3rem,1.1rem + .6vw,1.6rem);line-height:1.2}
.maf-page .elementor-heading-title em{font-style:italic;font-weight:500;background:var(--fire-deep);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.08em}
.maf-page.maf-dark .elementor-heading-title em{background:var(--fire);-webkit-background-clip:text;background-clip:text}
.maf-page .maf-eyebrow .elementor-heading-title{display:inline-flex;align-items:center;gap:12px;font:600 12px/1.3 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--ember-text)}
.maf-page .maf-eyebrow .elementor-heading-title::before{content:"";width:28px;height:2px;border-radius:2px;background:var(--fire);flex:none}
.maf-page.maf-dark .maf-eyebrow .elementor-heading-title{color:var(--gold)}
.maf-page.maf-sand .maf-eyebrow .elementor-heading-title{color:#A3360A}

/* ---------- text ---------- */
.maf-page .elementor-widget-text-editor{font:400 17px/1.65 var(--f-body);color:var(--muted)}
.maf-page.maf-dark .elementor-widget-text-editor{color:var(--muted-dark)}
.maf-page .elementor-widget-text-editor p{margin:0 0 .8em}
.maf-page .elementor-widget-text-editor p:last-child{margin-bottom:0}
.maf-page .maf-lede{font-size:clamp(1.02rem,.95rem + .3vw,1.18rem);max-width:60ch}
.maf-page .maf-note{font-family:ui-monospace,Consolas,monospace;font-size:.86rem;letter-spacing:.02em}
.maf-page .maf-note p{display:inline-block;padding:2px 8px;border-radius:6px;background:rgba(42,29,23,.06)}
.maf-page.maf-dark .maf-note p{background:rgba(255,247,236,.12)}
/* .maf-note = internal "to be confirmed" notes from the build: visible in the Elementor editor only, never to visitors */
body:not(.elementor-editor-active) .maf-page .maf-note{display:none}
.maf-page a:not(.elementor-button):not(.btn){color:var(--ember-text);text-underline-offset:3px}
.maf-page.maf-dark a:not(.elementor-button):not(.btn){color:var(--gold)}

/* ---------- buttons (native Button widget) ---------- */
.maf-page .maf-btn .elementor-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;border:1px solid transparent;font:600 15px/1.15 var(--f-body);letter-spacing:.01em;text-decoration:none;text-transform:none;box-shadow:none;transition:transform .45s var(--ease),box-shadow .45s var(--ease),background-color .45s var(--ease),border-color .45s var(--ease),color .45s var(--ease)}
.maf-page .maf-btn-fire .elementor-button{background:var(--fire);background-size:140% 100%;background-position:0 0;color:var(--ink);box-shadow:var(--glow)}
.maf-page .maf-btn-fire .elementor-button:hover,.maf-page .maf-btn-fire .elementor-button:focus-visible{color:var(--ink);transform:translateY(-2px);box-shadow:var(--glow-strong);background-position:100% 0}
.maf-page .maf-btn-line .elementor-button{background:transparent;color:var(--text);border-color:rgba(42,29,23,.28)}
.maf-page .maf-btn-line .elementor-button:hover,.maf-page .maf-btn-line .elementor-button:focus-visible{background:transparent;color:var(--ember-text);border-color:var(--ember-text)}
.maf-page .maf-btn-glass .elementor-button,.maf-page.maf-dark .maf-btn-line .elementor-button{color:var(--cream);background:rgba(255,247,236,.08);border-color:rgba(255,247,236,.38);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.maf-page .maf-btn-glass .elementor-button:hover,.maf-page .maf-btn-glass .elementor-button:focus-visible,.maf-page.maf-dark .maf-btn-line .elementor-button:hover,.maf-page.maf-dark .maf-btn-line .elementor-button:focus-visible{color:var(--cream);background:rgba(255,247,236,.16);border-color:rgba(255,247,236,.7);transform:translateY(-2px)}
.maf-page .elementor-button:focus-visible{outline:3px solid var(--amber);outline-offset:3px}
.maf-page.maf-cream .elementor-button:focus-visible,.maf-page.maf-sand .elementor-button:focus-visible{outline-color:var(--ember-text)}

/* ---------- rows, grids, cards ---------- */
.elementor .e-con.maf-actions>.elementor-widget,.elementor .e-con.maf-actions>.e-con-inner>.elementor-widget{width:auto;max-width:100%;flex:0 0 auto}
.elementor .e-con.maf-grid{--display:grid;display:grid;grid-template-columns:repeat(var(--maf-cols,3),minmax(0,1fr));gap:clamp(16px,2vw,24px)}
.elementor .e-con.maf-grid>.e-con{--width:auto;width:auto;min-width:0}
.elementor .e-con.maf-grid-2{--maf-cols:2}
.elementor .e-con.maf-grid-3{--maf-cols:3}
.elementor .e-con.maf-grid-4{--maf-cols:4}
@media (max-width:1024px){
  .elementor .e-con.maf-grid-4{--maf-cols:2}
}
@media (max-width:900px){
  .elementor .e-con.maf-grid-3{--maf-cols:1}
}
@media (max-width:767px){
  .elementor .e-con.maf-grid-2{--maf-cols:1}
}
@media (max-width:560px){
  .elementor .e-con.maf-grid-4{--maf-cols:1}
}
.elementor .e-con.maf-card{background:#fff;border:1px solid rgba(42,29,23,.1);border-radius:var(--r);box-shadow:0 18px 40px -28px rgba(42,29,23,.35)}
.maf-page.maf-sand .e-con.maf-card{background:var(--cream)}
.maf-page.maf-dark .e-con.maf-card{background:rgba(255,247,236,.05);border-color:rgba(255,247,236,.14);box-shadow:none}
.elementor .e-con.maf-card>.elementor-widget-button,.elementor .e-con.maf-card>.elementor-widget-maf-wa-button{margin-top:auto}

/* ---------- icon box ---------- */
.maf-page .elementor-widget-icon-box .elementor-icon-box-wrapper{text-align:left}
.maf-page .elementor-widget-icon-box .elementor-icon-box-icon{margin:0 0 16px;display:block}
.maf-page .elementor-widget-icon-box .elementor-icon{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:16px;font-size:22px;color:var(--ember-text);fill:var(--ember-text);background:rgba(255,90,31,.1)}
.maf-page .elementor-widget-icon-box .elementor-icon svg{width:1em;height:1em}
.maf-page.maf-dark .elementor-widget-icon-box .elementor-icon{color:var(--gold);fill:var(--gold);background:rgba(242,193,78,.12)}
.maf-page .elementor-widget-icon-box .elementor-icon-box-title{margin:0 0 8px;font-family:var(--f-display);font-weight:500;font-size:1.35rem;line-height:1.2;color:var(--text)}
.maf-page.maf-dark .elementor-widget-icon-box .elementor-icon-box-title{color:var(--cream)}
.maf-page .elementor-widget-icon-box .elementor-icon-box-description{margin:0;font-size:16px;line-height:1.6;color:var(--muted)}
.maf-page.maf-dark .elementor-widget-icon-box .elementor-icon-box-description{color:var(--muted-dark)}

/* ---------- icon list (checklists) ---------- */
.maf-page .maf-checklist .elementor-icon-list-items{margin:0;padding:0;list-style:none}
.maf-page .maf-checklist .elementor-icon-list-item{display:flex;align-items:flex-start;gap:10px;padding:7px 0;font-size:16px;line-height:1.5;color:var(--text);border-bottom:1px solid rgba(42,29,23,.08)}
.maf-page .maf-checklist .elementor-icon-list-item:last-child{border-bottom:0}
.maf-page.maf-dark .maf-checklist .elementor-icon-list-item{color:var(--cream);border-bottom-color:rgba(255,247,236,.12)}
.maf-page .maf-checklist .elementor-icon-list-icon{flex:none;margin-top:.2em;color:var(--ember-text);fill:var(--ember-text)}
.maf-page .maf-checklist .elementor-icon-list-icon i{color:var(--ember-text);font-size:14px}
.maf-page .maf-checklist .elementor-icon-list-icon svg{width:14px;height:14px;fill:var(--ember-text)}
.maf-page .maf-checklist .elementor-icon-list-text{padding-inline-start:0}

/* ---------- hero ---------- */
.elementor .e-con.maf-hero{isolation:isolate}
.maf-page.maf-hero .maf-lede{color:rgba(255,247,236,.86)}
.elementor .e-con.maf-hero .maf-illu{position:absolute;right:clamp(16px,4vw,48px);bottom:18px;z-index:4;width:auto;max-width:none;margin:0}
.maf-page .maf-illu p{display:inline-flex;align-items:center;gap:6px;margin:0;font:600 12px/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:var(--cream);background:rgba(18,14,12,.62);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,247,236,.18);padding:7px 10px;border-radius:999px}
.maf-page .maf-illu p::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--amber)}

/* ---------- maf widgets placed on these pages ---------- */
/* (.maf-wa-row alignment rules live in maf-core.css: the WhatsApp button is used on any page) */
/* before/after without the photo card: one column */
.maf-ui.maf-c-before-after .ba-grid:not(:has(.photo-card)){grid-template-columns:minmax(0,1fr);max-width:980px;margin-inline:auto}

@media (prefers-reduced-motion:reduce){
  .maf-page .maf-btn .elementor-button{transition:none}
  .maf-page .maf-btn .elementor-button:hover,.maf-page .maf-btn .elementor-button:focus-visible{transform:none}
}
