/* =============================================================================
   BIGZI — Premium /about/ + /contacts/ pages (.ab scope)
   Cinematic hero + animated stats + elevated cards + framed map + reveal motion.
   Design wave: Visual Storyteller + UI Designer + UX Architect + Accessibility.
   Green text on #F7FAF8 uses #0A7A33 (a11y: #0A8538 on off-white = 4.33:1 fail).
   ========================================================================== */
.ab {
    --ink:#001A34; --body:#475467; --muted:#6B7280;
    --green:#0A8538; --green-on-tint:#0A7A33; --green-deep:#076A2C;
    --green-12:rgba(10,133,56,.12); --green-08:rgba(10,133,56,.08);
    --surface:#FFFFFF; --surface-2:#F7FAF8; --hairline:#EAEFF1;
    --ab-radius-hero:24px; --ab-radius-card:20px; --ab-radius-chip:14px;
    --sh-rest:0 1px 2px rgba(0,26,52,.04),0 1px 1px rgba(0,26,52,.03);
    --sh-raised:0 4px 12px rgba(0,26,52,.06),0 1px 3px rgba(0,26,52,.05);
    --sh-hover:0 18px 40px -12px rgba(0,26,52,.18),0 6px 14px -8px rgba(0,26,52,.12);
    --sh-hero:0 30px 60px -24px rgba(0,40,80,.34),0 12px 28px -16px rgba(0,26,52,.20);
    --ease:cubic-bezier(.22,.61,.36,1); --ease-spring:cubic-bezier(.34,1.32,.64,1);
    --dur-fast:160ms; --dur:280ms; --dur-slow:560ms;
    --section-y:clamp(56px,7vw,104px); --container:1160px; --gutter:clamp(20px,5vw,40px);
    color:var(--body);
}
.ab *{box-sizing:border-box;}
/* Global inline-SVG reset — every icon is a thin-stroke line glyph, sized small,
   no fill (else the line paths flood solid black at the SVG's default huge size). */
.ab svg{width:18px;height:18px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle;}
.ab__inner{max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter);}

/* ---- Type ---- */
.ab h1{font:800 clamp(32px,5vw,52px)/1.06 "Gilroy",sans-serif;letter-spacing:-.02em;margin:0;}
.ab h2{font:800 clamp(25px,3.4vw,34px)/1.12 "Gilroy",sans-serif;letter-spacing:-.015em;color:var(--ink);margin:0;}
.ab h3{font:700 clamp(18px,1.6vw,20px)/1.25 "Gilroy",sans-serif;letter-spacing:-.01em;color:var(--ink);margin:0;}
.ab p{font:450 clamp(15px,1vw,16px)/1.62 "Gilroy",sans-serif;margin:0;}
.ab__eyebrow{display:inline-block;font:700 12px/1 "Gilroy",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--green-on-tint);}
.ab__lead{font:500 clamp(16px,1.5vw,19px)/1.5 "Gilroy",sans-serif;letter-spacing:-.005em;}

/* ---- Section rhythm ---- */
.ab-section{padding-block:var(--section-y);}
.ab-section--alt{background:var(--surface-2);}
.ab-section__head{margin-bottom:clamp(28px,3.5vw,44px);}
.ab-section__head .ab__eyebrow{margin-bottom:10px;}

/* ---- CTA buttons ---- */
.ab-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 26px;border-radius:999px;font:700 16px/1 "Gilroy",sans-serif;text-decoration:none;cursor:pointer;border:0;transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),background var(--dur-fast),color var(--dur-fast);}
.ab-btn--green{background:var(--green);color:#fff;box-shadow:0 8px 20px -6px rgba(10,133,56,.5);}
.ab-btn--green:hover{transform:translateY(-2px);background:var(--green-deep);box-shadow:0 14px 28px -8px rgba(10,133,56,.55);}
.ab-btn--green:active{transform:translateY(0);}
.ab-btn--ghost{background:transparent;border:1.5px solid var(--green);color:var(--green-on-tint);}
.ab-btn--ghost:hover{background:var(--green);color:#fff;transform:translateY(-2px);}
.ab-btn:focus-visible{outline:3px solid rgba(10,133,56,.5);outline-offset:3px;}

/* ---- Hero ---- */
.ab-hero{position:relative;max-width:var(--container);margin:24px auto var(--section-y);border-radius:var(--ab-radius-hero);overflow:hidden;box-shadow:var(--sh-hero);min-height:380px;display:flex;align-items:center;isolation:isolate;}
.ab-hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center right;z-index:0;filter:saturate(1.02) contrast(1.02);}
.ab-hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,rgba(0,26,16,.88) 0%,rgba(0,26,16,.64) 34%,rgba(0,26,16,.2) 64%,rgba(0,26,16,0) 88%),linear-gradient(0deg,rgba(0,18,11,.30),rgba(0,18,11,0) 42%);}
.ab-hero__body{position:relative;z-index:2;max-width:560px;padding:clamp(28px,4vw,52px);}
.ab-hero .ab__eyebrow{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(6px);color:rgba(255,255,255,.92);margin-bottom:18px;}
.ab-hero .ab__eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:#34D17A;}
.ab-hero h1{color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.55);}
.ab-hero__sub{color:rgba(255,255,255,.9);margin:16px 0 26px;font:500 clamp(16px,1.5vw,19px)/1.5 "Gilroy",sans-serif;text-shadow:0 1px 3px rgba(0,0,0,.5);max-width:46ch;}
.ab-hero__cta-row{display:flex;flex-wrap:wrap;gap:18px;}
.ab-hero__cta-row .ab-btn--ghost{border-color:rgba(255,255,255,.45);color:#fff;background:rgba(255,255,255,.06);backdrop-filter:blur(4px);}
.ab-hero__cta-row .ab-btn--ghost:hover{background:rgba(255,255,255,.16);}
@media (min-width:768px) and (prefers-reduced-motion:no-preference){
    .ab-hero__img{animation:abDrift 26s ease-in-out infinite alternate;}
}
@keyframes abDrift{from{transform:scale(1.02);}to{transform:scale(1.06);}}

/* ---- Stat band (overlaps hero) ---- */
.ab-stats-wrap{max-width:var(--container);margin:calc(var(--section-y) * -0.6) auto 0;padding-inline:var(--gutter);position:relative;z-index:3;}
.ab-stats{margin-top:-56px;background:var(--surface);border:1px solid var(--hairline);border-radius:var(--ab-radius-card);box-shadow:var(--sh-raised);display:grid;grid-template-columns:repeat(4,1fr);padding:8px;}
.ab-stat{position:relative;text-align:center;padding:26px 18px 24px;border-radius:14px;transition:background var(--dur-fast) var(--ease);}
.ab-stat+.ab-stat::before{content:"";position:absolute;left:0;top:22%;height:56%;width:1px;background:var(--hairline);}
.ab-stat:hover{background:var(--surface-2);}
.ab-stat__num{font:800 clamp(30px,3.4vw,44px)/1 "Gilroy",sans-serif;letter-spacing:-.02em;color:var(--green);font-variant-numeric:tabular-nums;}
.ab-stat--text .ab-stat__num{font-size:clamp(20px,2vw,27px);}
.ab-stat__label{margin-top:8px;font:600 13px/1.35 "Gilroy",sans-serif;color:var(--body);}

/* ---- Feature / trust cards ---- */
.ab-grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;}
.ab-feat{position:relative;background:var(--surface);border:1px solid var(--hairline);border-radius:var(--ab-radius-card);padding:28px;box-shadow:var(--sh-rest);transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease);}
.ab-feat::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg,var(--green-08),transparent 30%);opacity:0;transition:opacity var(--dur) var(--ease);}
.ab-feat:hover{transform:translateY(-4px);box-shadow:var(--sh-hover);border-color:rgba(10,133,56,.22);}
.ab-feat:hover::after{opacity:1;}
.ab-feat__chip{width:52px;height:52px;border-radius:var(--ab-radius-chip);display:grid;place-items:center;margin-bottom:18px;background:linear-gradient(145deg,#E8F6EE 0%,#D6EFE0 100%);box-shadow:inset 0 0 0 1px rgba(10,133,56,.14),0 4px 10px -4px rgba(10,133,56,.30);transition:transform var(--dur) var(--ease-spring);}
.ab-feat:hover .ab-feat__chip{transform:translateY(-2px) scale(1.04);}
.ab-feat__chip svg{width:24px;height:24px;stroke:var(--green);stroke-width:1.9;fill:none;}
.ab-feat h3{margin-bottom:8px;}
.ab-feat p{margin:0;}

/* ---- Editorial split (mission + image) ---- */
.ab-split{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,4vw,56px);align-items:center;}
.ab-split__media{border-radius:var(--ab-radius-card);overflow:hidden;box-shadow:var(--sh-raised);aspect-ratio:4/3;}
.ab-split__media img{width:100%;height:100%;object-fit:cover;display:block;}
.ab-split__body p+p{margin-top:14px;}
.ab-steps{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px;}
.ab-step{display:flex;align-items:center;gap:10px;font:600 14px/1.3 "Gilroy",sans-serif;color:var(--ink);}
.ab-step__n{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:var(--green-12);color:var(--green-on-tint);font-weight:800;font-size:13px;}

/* ---- Brand wall ---- */
.ab-brands{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;align-items:center;}
.ab-brand{display:flex;align-items:center;justify-content:center;height:64px;background:var(--surface);border:1px solid var(--hairline);border-radius:14px;}
.ab-brand img{max-height:30px;max-width:100px;filter:grayscale(100%) opacity(.9);transition:filter var(--dur) var(--ease);}
.ab-brand:hover img{filter:grayscale(0) opacity(1);}

/* ---- Contact cards ---- */
/* 2×2 grid of wide horizontal cards (icon left, content right) — fills the
   desktop width instead of four narrow, mostly-empty columns. */
.ab-grid-4{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
/* wpautop injects <br>/<p></p> between the inline <a> contact cards (they live in
   post_content); strip them so they don't consume grid tracks and break the 2×2. */
.ab-grid-4 > br,.ab-grid-4 > p:empty{display:none;}
.ab-contact{display:grid;grid-template-columns:auto 1fr;column-gap:22px;row-gap:6px;align-content:center;min-height:150px;padding:30px 32px;background:var(--surface);border:1px solid var(--hairline);border-radius:var(--ab-radius-card);box-shadow:var(--sh-rest);text-decoration:none;transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease);}
.ab-contact:hover{transform:translateY(-4px);box-shadow:var(--sh-hover);border-color:rgba(10,133,56,.22);}
.ab-contact:focus-visible{outline:none;border-color:var(--green);box-shadow:0 0 0 3px var(--green-12),var(--sh-raised);}
.ab-contact__chip{grid-column:1;grid-row:1 / span 3;align-self:center;width:60px;height:60px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(145deg,#E8F6EE,#D6EFE0);box-shadow:inset 0 0 0 1px rgba(10,133,56,.14);}
.ab-contact__chip svg{width:26px;height:26px;stroke:var(--green);stroke-width:1.9;fill:none;}
.ab-contact__k{grid-column:2;align-self:end;font:700 11px/1 "Gilroy",sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);}
.ab-contact__v{grid-column:2;font:700 19px/1.35 "Gilroy",sans-serif;color:var(--ink);letter-spacing:-.01em;}
a.ab-contact .ab-contact__v{color:var(--green-on-tint);}
.ab-contact__cta{grid-column:2;align-self:start;margin-top:4px;display:inline-flex;align-items:center;gap:6px;font:600 14px/1 "Gilroy",sans-serif;color:var(--green-on-tint);}
.ab-contact__cta svg{width:16px;height:16px;transition:transform var(--dur) var(--ease);}
.ab-contact:hover .ab-contact__cta svg{transform:translateX(4px);}
.ab-hours__dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--green);margin-right:6px;animation:abPulse 2.4s var(--ease) infinite;}
@keyframes abPulse{0%{box-shadow:0 0 0 0 rgba(10,133,56,.28);}70%{box-shadow:0 0 0 9px rgba(10,133,56,0);}100%{box-shadow:0 0 0 0 rgba(10,133,56,0);}}
/* Closed hours → muted slate dot, no pulse (honest live-status colour).
   :has() covers no-JS modern browsers; .is-closed (set by JS) covers browsers
   without :has() support. */
.ab-contact__v:has([data-hours-status][data-open="0"]) .ab-hours__dot,
.ab-hours__dot.is-closed{background:#94A3B8;animation:none;box-shadow:none;}

/* ---- Map ---- */
.ab-map{position:relative;border-radius:var(--ab-radius-card);overflow:hidden;border:1px solid var(--hairline);box-shadow:var(--sh-raised);height:clamp(320px,42vw,440px);background:var(--surface-2);}
.ab-map iframe{width:100%;height:100%;border:0;display:block;}
.ab-map::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(0,26,52,.06);pointer-events:none;}
.ab-map__chip{position:absolute;left:20px;bottom:20px;max-width:320px;display:flex;gap:12px;align-items:flex-start;background:rgba(255,255,255,.93);backdrop-filter:blur(10px);border:1px solid var(--hairline);border-radius:16px;padding:14px 16px;box-shadow:var(--sh-raised);}
.ab-map__chip .dot{width:36px;height:36px;border-radius:11px;flex:0 0 auto;display:grid;place-items:center;background:var(--green);color:#fff;}
.ab-map__chip .dot svg{width:20px;height:20px;stroke:#fff;stroke-width:2;fill:none;}
.ab-map__chip .addr{font:600 14px/1.45 "Gilroy",sans-serif;color:var(--ink);}
.ab-map__chip .route{font:700 13px/1 "Gilroy",sans-serif;color:var(--green-on-tint);margin-top:6px;display:inline-flex;gap:4px;text-decoration:none;}

/* ---- Legal / Реквизиты panel ---- */
.ab-legal{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--ab-radius-card);box-shadow:var(--sh-raised);padding:clamp(24px,3vw,36px);}
.ab-legal__head{display:flex;align-items:center;gap:12px;margin-bottom:24px;}
.ab-legal__badge{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--green);color:#fff;box-shadow:0 6px 14px -6px rgba(10,133,56,.5);}
.ab-legal__badge svg{width:20px;height:20px;stroke:#fff;stroke-width:2;fill:none;}
.ab-legal__grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.ab-legal__row{background:var(--surface-2);border:1px solid var(--hairline);border-radius:14px;padding:16px 18px;transition:border-color var(--dur-fast),background var(--dur-fast);}
.ab-legal__row:hover{border-color:rgba(10,133,56,.22);background:#fff;}
.ab-legal__row--wide{grid-column:1 / -1;}
.ab-legal__k{font:700 11px/1 "Gilroy",sans-serif;letter-spacing:.1em;text-transform:uppercase;color:rgba(71,80,103,.75);margin-bottom:7px;}
.ab-legal__v{font:600 16px/1.4 "Gilroy",sans-serif;color:var(--ink);}
.ab-legal__v a{color:var(--green-on-tint);text-decoration:none;}

/* ---- Closing CTA panel ---- */
.ab-cta{position:relative;overflow:hidden;text-align:center;background:linear-gradient(180deg,#FFFFFF,#F7FAF8);border:1px solid var(--hairline);border-radius:var(--ab-radius-card);box-shadow:var(--sh-raised);padding:clamp(40px,6vw,64px) var(--gutter);}
.ab-cta::before{content:"";position:absolute;right:-60px;top:-60px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,var(--green-12),transparent 65%);pointer-events:none;}
.ab-cta h2{margin-bottom:10px;}
.ab-cta p{max-width:56ch;margin:0 auto 26px;}
.ab-cta__row{display:flex;flex-wrap:wrap;gap:18px;justify-content:center;}
/* Equal-width CTA buttons — even side-by-side AND when they stack on narrow widths. */
.ab-cta__row .ab-btn{flex:1 1 236px;max-width:340px;}

/* ---- Sticky mobile call bar (contacts) ---- */
.ab-stickycall{display:none;}

/* ---- Scroll reveal (default VISIBLE; hidden only once JS marks html.is-ready) ---- */
.is-ready .ab-reveal{opacity:0;transform:translateY(24px);transition:opacity var(--dur-slow) var(--ease),transform var(--dur-slow) var(--ease);}
.is-ready .ab-reveal.is-in{opacity:1;transform:none;}

/* ========================= Mobile ========================= */
@media (max-width:860px){
    .ab-split{grid-template-columns:1fr;}
    .ab-brands{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:575px){
    .ab-hero{min-height:300px;align-items:flex-end;margin-top:16px;}
    .ab-hero::before{background:linear-gradient(180deg,rgba(0,26,16,.30) 0%,rgba(0,26,16,.44) 42%,rgba(0,26,16,.84) 100%);}
    .ab-hero__body{padding:24px;}
    .ab-hero__cta-row .ab-btn{width:100%;}
    .ab-stats{grid-template-columns:1fr 1fr;margin-top:-32px;}
    .ab-stat+.ab-stat::before{display:none;}
    .ab-stat:nth-child(n+3)::after{content:"";position:absolute;top:0;left:14%;right:14%;height:1px;background:var(--hairline);}
    .ab-grid-2,.ab-grid-4{grid-template-columns:1fr;gap:14px;}
    .ab-feat,.ab-contact{padding:22px;}
    .ab-brands{grid-template-columns:repeat(3,1fr);gap:12px;}
    .ab-legal__grid{grid-template-columns:1fr;}
    .ab-map{height:clamp(260px,60vw,320px);}
    .ab-map__chip{left:12px;right:12px;bottom:12px;max-width:none;}
    .ab-reveal{transform:translateY(16px);}
    /* sticky call bar appears on mobile contacts */
    .ab-stickycall{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px));background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-top:1px solid var(--hairline);box-shadow:0 -6px 20px rgba(0,26,52,.08);}
    .ab-stickycall .ab-btn{width:100%;height:48px;}
    body.ab-has-stickycall{padding-bottom:76px;}
}

/* ---- Theme link-style override ----
   woocommerce.min.css forces `body:not(.woocommerce-page) .page-content .entry-content a`
   to underline + link-green at specificity (0,3,2), which beats our flat .ab-btn rules.
   We re-assert inside our scope by matching that exact ancestor chain + one extra class
   (.ab / a component class), winning cleanly at (0,4,x)+ — no !important. */
body:not(.woocommerce-page) .page-content .entry-content .ab a{text-decoration:none;}
body:not(.woocommerce-page) .page-content .entry-content .ab .ab-btn--green{color:#fff;}
body:not(.woocommerce-page) .page-content .entry-content .ab .ab-btn--ghost{color:var(--green-on-tint);}
body:not(.woocommerce-page) .page-content .entry-content .ab .ab-btn--ghost:hover{color:#fff;}
body:not(.woocommerce-page) .page-content .entry-content .ab-hero__cta-row .ab-btn--ghost{color:#fff;}
body:not(.woocommerce-page) .page-content .entry-content .ab-hero__cta-row .ab-btn--ghost:hover{color:#fff;}

/* ---- Reduced motion: kill all motion, show final state ---- */
@media (prefers-reduced-motion:reduce){
    .ab-hero__img{animation:none;}
    .ab-hours__dot{animation:none;}
    .is-ready .ab-reveal{opacity:1;transform:none;transition:none;}
    .ab *{transition:none !important;}
}