/* Eposy menu + page extras (2026-11-04). Services dropdown, breadcrumbs and small helpers for the painted (aia) pages.
   Reuses the colours and radii of eposy-elevate.css. Roll back: remove the <link> to this file. */

/* ---------- Services dropdown (desktop header) ---------- */
.nav-dd{position:relative;display:flex;align-items:center}
.nav-dd__btn{display:inline-flex;align-items:center;gap:.3rem;margin:0;padding:.35rem 0;border:0;background:none;font:inherit;font-size:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.nav-dd__btn:hover,.nav-dd.is-open .nav-dd__btn,.nav-dd.is-current .nav-dd__btn{color:var(--ink,#f4f7ff)}
.nav-dd__btn svg{transition:transform .2s ease;opacity:.75}
.nav-dd.is-open .nav-dd__btn svg{transform:rotate(180deg)}
.nav-dd__btn:focus-visible{outline:2px solid #22d3ee;outline-offset:4px;border-radius:6px}
.nav-dd__menu{position:absolute;top:calc(100% + .9rem);left:-1.2rem;z-index:1200;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem 1.1rem;width:min(720px,calc(100vw - 2.5rem));padding:1.1rem 1.1rem 1.2rem;
  border-radius:18px;border:1px solid rgba(121,157,230,.22);
  background:radial-gradient(70% 60% at 0% 0%,rgba(59,123,255,.16),transparent 70%),radial-gradient(60% 50% at 100% 0%,rgba(34,211,238,.10),transparent 70%),linear-gradient(165deg,rgba(20,34,72,.97),rgba(7,13,30,.985));
  box-shadow:0 30px 80px -20px rgba(0,0,0,.65),0 0 60px -25px rgba(34,111,255,.55),inset 0 1px 0 rgba(255,255,255,.05);
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s}
.nav-dd.is-open .nav-dd__menu{opacity:1;visibility:visible;transform:none;transition:opacity .2s ease,transform .2s ease}
.nav-dd__h{margin:.15rem .55rem .45rem;font-family:var(--font-display,inherit);font-size:.66rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#8fe3f5}
.nav-dd__menu a{display:block;padding:.55rem .6rem;border-radius:11px;border:1px solid transparent;color:var(--ink,#f4f7ff);text-decoration:none;transition:background .15s,border-color .15s}
.nav-dd__menu a:hover,.nav-dd__menu a:focus-visible,.nav-dd__menu a[aria-current=page]{background:rgba(45,111,255,.12);border-color:rgba(121,157,230,.2);outline:none}
.nav-dd__t{display:block;font-size:.86rem;font-weight:600;line-height:1.25}
.nav-dd__s{display:block;margin-top:.12rem;font-size:.74rem;line-height:1.35;color:var(--muted,#94a8c9)}
@media (max-width:1180px){.nav-dd__menu{left:-4rem}}
@media (max-width:980px){.nav-dd__menu{display:none}}
@media (prefers-reduced-motion:reduce){.nav-dd__menu,.nav-dd__btn svg{transition:none}}

/* ---------- Breadcrumbs (visible, hero) ---------- */
.aia-crumbs{margin:0 0 1.1rem}
.aia-crumbs ol{display:flex;flex-wrap:wrap;gap:.25rem .45rem;margin:0;padding:0;list-style:none;font-size:.78rem;color:var(--muted,#94a8c9)}
.aia-crumbs li{display:inline-flex;align-items:center;gap:.45rem}
.aia-crumbs li+li::before{content:"";width:5px;height:5px;border-top:1.4px solid currentColor;border-right:1.4px solid currentColor;transform:rotate(45deg);opacity:.6}
.aia-crumbs a{color:#bfe9ff;text-decoration:none}
.aia-crumbs a:hover{text-decoration:underline}
.aia-crumbs [aria-current]{color:var(--ink,#f4f7ff)}
@media (max-width:900px){.aia-crumbs ol{justify-content:center}}

/* ---------- Long page titles (SEO h1s) stay readable ---------- */
.aia-hero--long h1{font-size:clamp(2.1rem,4.6vw,3.6rem);line-height:1.04}
@media (max-width:420px){.aia-hero--long h1{font-size:clamp(1.85rem,8.6vw,2.3rem)}.aia-hero h1{overflow-wrap:anywhere}}
.aia-hero .lede+.lede{margin-top:-1.2rem}

/* ---------- Prose blocks, card links and notes inside painted pages ---------- */
.aia .aia-prose{max-width:760px;margin:0 auto}
.aia .aia-prose p{color:#b4c4e0;font-size:1rem;line-height:1.75}
.aia .aia-prose h2{font-family:var(--font-display);font-size:clamp(1.5rem,3vw,2rem);letter-spacing:-.02em}
.aia .sec > .aia-prose:first-of-type:not(:only-of-type){margin-top:0}
.aia-card .aia-more{display:inline-flex;align-items:center;gap:.3rem;margin-top:.7rem;color:#8fe3f5;font-weight:600;font-size:.88rem;text-decoration:none}
.aia-card .aia-more::after{content:"\2192";transition:transform .2s}
.aia-card .aia-more:hover::after{transform:translateX(3px)}
.aia-card p:has(.aia-more){display:flex;flex-direction:column;align-items:flex-start}
.aia .aia-note{margin:1.2rem 0 0;color:var(--muted,#94a8c9);font-size:.88rem;line-height:1.6}
.aia .aia-split .lede+.aia-checks{margin-top:1.2rem}
.aia-split > .rv > p:not(.eyebrow):not(.lede):not(.aia-note){color:#b4c4e0;line-height:1.7}
.aia-realbuild{margin:1.4rem 0 0}
.aia-realbuild a{color:#8fe3f5;font-weight:600;text-decoration:none;border-bottom:1px solid rgba(143,227,245,.35);padding-bottom:2px}
.aia-realbuild a:hover{border-bottom-color:#8fe3f5}
.aia-cta__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:.4rem}
.aia-cta .hero-actions .btn{min-height:44px}

/* ---------- FAQ inside painted pages ---------- */
.aia .sec--faq .faq-kicker{display:inline-flex;align-items:center;gap:.5rem;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:#bfe9ff;font-weight:600}
.aia .sec--faq .faq-kicker::before{content:"";width:.45rem;height:.45rem;border-radius:50%;background:var(--cyan,#22d3ee);box-shadow:0 0 10px var(--cyan,#22d3ee)}
.aia .sec--faq .faq-intro h2{font-family:var(--font-display);font-size:clamp(1.9rem,4.2vw,3rem);line-height:1.08;letter-spacing:-.03em;font-weight:800}
.aia .sec--faq .faq-panel{border-color:rgba(121,157,230,.22);background:linear-gradient(165deg,rgba(20,34,72,.55),rgba(7,13,30,.75));box-shadow:0 24px 60px -30px rgba(0,0,0,.6)}
.aia .sec--faq .faq-q{min-height:48px}
.aia .sec--faq .faq-help-card{border-radius:18px}

/* ---------- Mobile safety ---------- */
@media (max-width:600px){
  .aia-split,.aia-grid3,.aia-grid4{min-width:0}
  .aia-card,.aia-quote{min-width:0;overflow-wrap:anywhere}
  .aia-cta__actions .btn{width:100%;justify-content:center}
}

/* ---------- Footer X link: the icon had no size rule and rendered full-width on phones (pre-existing) ---------- */
.footer-social{display:flex;gap:.6rem;margin:.4rem 0 1rem}
.footer-social-link{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;border:1px solid rgba(121,157,230,.25);background:rgba(45,111,255,.08);color:var(--ink,#f4f7ff);transition:background .2s,border-color .2s}
.footer-social-link:hover{background:rgba(45,111,255,.18);border-color:rgba(34,211,238,.45)}
.footer-social-link svg{width:17px;height:17px;display:block}
/* r-layoutfix: hero aligns with header container; FAQ inner padding */
.aia-hero{max-width:var(--site-max,1080px)}
.aia-hero h1{font-size:clamp(2.3rem,6.2vw,4.6rem)}
.aia-hero--long h1{font-size:clamp(2rem,4.4vw,3.4rem)}
.faq-panel .faq-q,.aia .sec--faq .faq-q{padding:1.1rem 1.4rem 1.1rem 1.5rem}
.faq-panel .faq-a-inner{margin:0 1.5rem 1.25rem 1.5rem;padding:.15rem 0 .15rem 1rem}
@media (max-width:480px){.faq-panel .faq-q,.aia .sec--faq .faq-q{padding:1rem 1.1rem 1rem 1.25rem}.faq-panel .faq-a-inner{margin:0 1.1rem 1.1rem 1.25rem}}
/* r-layoutfix2: prose sections align with container; standard eyebrow size */
.aia .prose-block.aia-prose--left{margin-left:0;margin-right:auto}
.aia .prose-block.aia-prose--left p.eyebrow{font-size:.7rem;letter-spacing:.18em;line-height:normal}
/* r-mobilefix: stack FAQ (base rule in styles.css overrode its earlier media query) */
@media (max-width:900px){.faq-layout,.aia .sec--faq .faq-layout{grid-template-columns:1fr;gap:2rem}.faq-intro{position:static}}
