/* Mobile companions to the A1 products experience. Desktop rules remain in pages.css. */
@media (max-width: 820px) {
  .site-header { direction:ltr; height:52px; padding:0 14px; gap:10px; background:var(--surface); box-shadow:none; transition:transform .22s ease; }
  .site-header.header-hidden { transform:translateY(-100%); }
  .brand { margin:0; }
  .brand img { width:54px; height:auto; }
  .theme-toggle { margin:0 0 0 auto; width:34px; height:34px; flex:none; font-size:1rem; display:grid; place-items:center; }
  .menu-button { display:flex; margin:0; width:34px; height:36px; align-items:center; flex:none; }
  .menu-button span { width:21px; height:2px; background:var(--ink); }
  .mobile-nav { top:52px; direction:rtl; z-index:22; background:var(--surface); border-top:1px solid var(--line); }
  .mobile-nav a { color:var(--ink); }
  .shell, .page-hero .hero-inner.shell { width:calc(100% - 28px); }
  .page-hero, .careers-hero { height:auto; min-height:150px; background:var(--surface-soft); color:var(--ink); }
  .page-hero > img, .careers-hero .hero-brand, .page-hero:after { display:none; }
  .page-hero .hero-inner { position:relative; inset:auto; min-height:150px; padding:26px 0 30px; align-items:stretch; justify-content:center; text-align:center; }
  .page-hero .hero-inner > * { align-self:stretch; width:100%; text-align:center; }
  .page-hero .crumbs, .page-hero p { display:none; }
  .page-hero h1 { margin:0 0 14px; font-size:1.42rem; line-height:1.4; color:var(--ink); }
  .page-hero .hero-inner .search-box { align-self:stretch; width:100%; max-width:none; height:46px; margin:0; padding:0 15px; border:1px solid var(--line); border-radius:8px; background:var(--surface); box-shadow:0 5px 16px #00000012; }
  .page-hero .search-box .search { height:100%; width:100%; margin:0; border:0; background:transparent; color:var(--ink); text-align:right; font-size:0.88rem; }
  .page-hero .search-icon { width:16px; height:16px; margin-right:7px; border-color:var(--navy); }
  .page-hero .search-icon:after { background:var(--navy); }
  .page { padding:12px 0 34px; min-height:calc(100vh - 270px); }
  .grid-2, .faq-layout { display:flex; flex-direction:column; gap:12px; }
  .panel { padding:18px; border-radius:8px; }
  .panel h2 { font-size:1.25rem; line-height:1.45; }
  .lead { font-size:0.9rem; line-height:1.7; margin-bottom:14px; }
  .benefits { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .benefit-intro { grid-column:1/-1; }
  .benefit-intro h2, .jobs-head h2, .process h2 { font-size:1.22rem; margin:0 0 5px; }
  .benefit-intro p { margin:0 0 12px; }
  .benefit { min-width:0; min-height:116px; padding:14px 8px; border-radius:8px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; }
  .benefit b { line-height:1; }
  .benefit .icon { width:29px; height:29px; }
  .benefit strong { max-width:130px; font-size:0.86rem; line-height:1.5; }
  .jobs-head { margin:22px 0 12px; }
  .jobs { grid-template-columns:1fr; gap:9px; }
  .job { padding:17px; border-radius:8px; background:var(--surface); }
  .job h3 { font-size:1.04rem; line-height:1.4; }
  .job .meta { font-size:0.83rem; gap:14px; }
  .job p { margin:10px 0; font-size:0.9rem; line-height:1.65; color:var(--muted); }
  .job a { display:inline-block; font-size:0.9rem; }
  .jobs-actions { margin-top:14px; }
  .all-jobs { width:100%; justify-content:center; font-size:0.9rem; }
  .process { margin-top:22px; padding:18px 14px; }
  .steps { grid-template-columns:1fr; gap:8px; margin-top:16px; }
  .steps:before { display:none; }
  .step { display:flex; align-items:center; gap:12px; padding:9px 12px; background:var(--surface); border:1px solid var(--line); text-align:right; }
  .step b { width:40px; height:40px; flex:none; margin:0; background:var(--surface-soft); }
  .step span { margin:0; font-size:0.87rem; }
  .faq-list, .side-stack { gap:9px; }
  .faq-item { border-radius:8px; background:var(--surface); }
  .faq-q { padding:15px; gap:16px; font-size:0.96rem; line-height:1.5; }
  .faq-a { padding:0 15px 16px; font-size:0.9rem; line-height:1.8; color:var(--muted); }
  .side-cta { text-align:right; }
  .side-cta .primary { display:inline-flex; }
  .contact-form { grid-template-columns:1fr; gap:11px; }
  .field.full, .file-row { grid-column:auto; }
  .field label { font-size:0.88rem; }
  .field input, .field select, .field textarea { min-height:44px; padding:10px 12px; font-size:0.9rem; }
  .file-row { font-size:0.84rem; }
  .contact-card { background:var(--surface); }
  .visual { min-height:110px; }
  .strip { margin-top:12px; display:grid; gap:7px; padding:16px; }
  .strip a { margin:5px 0 0; justify-content:center; text-align:center; }
  .bottom-nav { display:flex; position:fixed; inset:auto 0 0; z-index:40; height:66px; padding-bottom:env(safe-area-inset-bottom); background:var(--surface); border-top:1px solid var(--line); box-shadow:0 -3px 16px #0000000a; }
  .bottom-nav a, .bottom-nav .nav-item { flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; text-decoration:none; color:var(--ink); }
  .bottom-nav .nav-item { opacity:.72; }
  .bottom-nav .nav-icon { width:20px; height:20px; display:block; }
  .bottom-nav svg { width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; }
  .bottom-nav small { font:0.68rem/1.2 Peyda,Tahoma,sans-serif; white-space:nowrap; }
  .bottom-nav { direction:rtl; }
  .bottom-nav a { position:relative; color:var(--muted); font-weight:400; }
  .bottom-nav .nav-icon { width:21px; height:21px; }
  .bottom-nav a.is-active { color:var(--navy); font-weight:700; }
  .bottom-nav a.is-active:before { content:""; position:absolute; top:0; width:28px; height:2px; border-radius:2px; background:var(--orange); }
  [data-theme=dark] .bottom-nav a { color:var(--muted); }
  [data-theme=dark] .bottom-nav a.is-active { color:#fff; }
  body { padding-bottom:calc(66px + env(safe-area-inset-bottom)); }
}
@media (max-width: 560px) {
  .shell, .page-hero .hero-inner.shell { width:calc(100% - 16px); }
  .page { padding-top:9px; }
  .panel { padding:15px; }
}
@media (max-width: 820px) {
  [data-theme=dark] .site-header { background:#22262d; }
  [data-theme=dark] .page-hero { background:#191c22; }
  [data-theme=dark] .page { background:#11151e; }
  [data-theme=dark] .benefit, [data-theme=dark] .process { background:#171f30; }
  [data-theme=dark] .job p, [data-theme=dark] .job .meta { color:#a8b4ca; }
  [data-theme=dark] .bottom-nav { background:#141a26; }
  .contact-methods, .expert-panel { border:2px solid var(--orange); }
}

@media (max-width:820px) {
  .site-header { direction:ltr; }
  .site-header .brand { margin:0; }
  html[data-theme] .site-header .theme-toggle { margin:0 0 0 auto; }
  .site-header .menu-button { margin:0; }
}

@media (max-width:820px) {
  .blog-page { padding-top:10px; }
  .blog-layout { display:block; }
  .blog-sidebar { display:none; }
  .blog-heading { align-items:center; margin-bottom:7px; padding:8px 4px 12px; }
  .blog-heading h2 { font-size:1.22rem; }
  .blog-heading p { display:none; }
  .blog-heading>span { font-size:.76rem; }
  .blog-card { grid-template-columns:112px minmax(0,1fr); gap:12px; min-height:126px; padding:10px 0; }
  .blog-card>img { width:112px; height:106px; border-radius:8px; }
  .blog-card-body { min-width:0; }
  .blog-meta { gap:7px; font-size:.68rem; }
  .blog-card h3 { margin:4px 0; font-size:.93rem; line-height:1.55; }
  .blog-card p { display:none; }
  .blog-card a { font-size:.78rem; }
  .mobile-blog-actions { display:grid; gap:9px; margin-top:24px; padding-top:22px; border-top:1px solid var(--line); }
  .mobile-blog-actions h2 { margin-bottom:3px; font-size:1.2rem; }
  .blog-action { display:grid; grid-template-columns:38px 1fr auto; gap:11px; align-items:center; min-height:66px; padding:12px 14px; border:1px solid var(--line); border-radius:9px; color:var(--ink); text-decoration:none; background:var(--surface); }
  .blog-action .icon { width:26px; height:26px; color:var(--navy); }
  .blog-action b,.blog-action small { display:block; }
  .blog-action b { font-size:.93rem; }
  .blog-action small { margin-top:2px; color:var(--muted); font-size:.75rem; }
  .blog-action>i { color:var(--navy); font-style:normal; }
  .blog-action.primary-action { background:var(--orange); border-color:var(--orange); color:#fff; }
  .blog-action.primary-action .icon,.blog-action.primary-action>i,.blog-action.primary-action small { color:#fff; }
  .blog-action.secondary-action { border-color:var(--navy); }
  .blog-action.tertiary-action { border-color:var(--line); }
  .related-posts { display:block; margin-top:26px; padding-top:20px; }
  .related-head { margin-bottom:12px; }
  .related-posts h2 { font-size:1.2rem; }
  .related-grid { grid-template-columns:1fr 1fr; gap:8px; }
  .related-grid a { display:block; padding:8px; }
  .related-grid img { width:100%; height:92px; margin-bottom:7px; }
  .related-grid b { display:block; font-size:.8rem; }
  .related-grid small { font-size:.7rem; }
}

/* Unified full-height mobile navigation */
@media (max-width:900px) {
  body.mobile-menu-active { overflow:hidden; }
  body.mobile-menu-active .site-header { z-index:60; transform:none; }
  body.mobile-menu-active .bottom-nav { transform:translateY(110%); }
  .site-header.mobile-menu-open .theme-toggle { display:none !important; }
  .mobile-nav {
    position:fixed;
    top:68px;
    right:0;
    bottom:0;
    left:0;
    z-index:59;
    display:flex;
    flex-direction:column;
    gap:0;
    padding:16px clamp(20px,7vw,44px) max(24px,env(safe-area-inset-bottom));
    overflow-y:auto;
    overscroll-behavior:contain;
    border-top:1px solid var(--line);
    background:var(--surface);
    box-shadow:none;
    opacity:0;
    visibility:hidden;
    transform:translateY(-8px);
    transition:opacity .2s ease,visibility .2s ease,transform .2s ease;
  }
  .mobile-nav.open { display:flex; opacity:1; visibility:visible; transform:translateY(0); }
  .mobile-menu-links { display:grid; }
  .mobile-menu-links>a,.mobile-menu-group>summary {
    position:relative;
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:58px;
    padding:8px 2px;
    border:0;
    border-bottom:1px solid var(--line);
    color:var(--ink);
    font:700 1rem/1.6 Peyda,Tahoma,sans-serif;
    text-decoration:none;
    cursor:pointer;
    list-style:none;
  }
  .mobile-menu-group>summary::-webkit-details-marker { display:none; }
  .mobile-menu-links>a.active,.mobile-menu-group>summary.active { color:var(--navy); }
  .mobile-menu-links>a.active:after,.mobile-menu-group>summary.active:after {
    content:"";
    position:absolute;
    right:0;
    bottom:-1px;
    width:32px;
    height:2px;
    border-radius:2px;
    background:var(--orange);
  }
  .mobile-menu-group>summary i {
    display:grid;
    place-items:center;
    width:28px;
    height:28px;
    color:var(--muted);
    font-style:normal;
    font-size:1rem;
    transition:transform .2s ease,color .2s ease;
  }
  .mobile-menu-group[open]>summary i { transform:rotate(180deg); color:var(--navy); }
  .mobile-menu-group>div {
    display:grid;
    padding:4px 12px 10px 0;
    border-bottom:1px solid var(--line);
    background:var(--surface-soft);
  }
  .mobile-menu-group>div a {
    min-height:43px;
    display:flex;
    align-items:center;
    padding:7px 12px;
    border:0;
    color:var(--muted);
    font-size:.9rem;
    text-decoration:none;
  }
  .mobile-menu-group>div a.active { color:var(--navy); font-weight:700; }
  .mobile-menu-group>div a.active:before {
    content:"";
    width:5px;
    height:5px;
    margin-left:9px;
    border-radius:50%;
    background:var(--orange);
  }
  .mobile-menu-footer { display:grid; gap:12px; margin-top:0; padding-top:0; }
  .mobile-theme-row {
    min-height:52px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:0 2px;
    border-bottom:1px solid var(--line);
    color:var(--ink);
    font-weight:700;
  }
  .mobile-theme-toggle {
    display:flex;
    align-items:center;
    gap:7px;
    padding:0;
    border:0;
    background:transparent;
    color:var(--navy);
    font:inherit;
    cursor:pointer;
  }
  .mobile-theme-toggle>span { width:18px; text-align:center; font-size:1.08rem; line-height:1; }
  .mobile-theme-toggle>i {
    position:relative;
    width:46px;
    height:24px;
    border:1px solid #b9c7dc;
    border-radius:15px;
    background:#dce5f2;
    transition:background .2s,border-color .2s;
  }
  .mobile-theme-toggle>i:after {
    content:"";
    position:absolute;
    top:3px;
    left:3px;
    width:16px;
    height:16px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 1px 4px #00025730;
    transition:left .2s;
  }
  .mobile-theme-toggle[aria-pressed=true]>i { border-color:#5f75a3; background:#253a69; }
  .mobile-theme-toggle[aria-pressed=true]>i:after { left:25px; }
  .mobile-menu-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; direction:rtl; }
  .mobile-menu-actions a {
    min-height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:8px 12px;
    border-radius:8px;
    font-size:.88rem;
    font-weight:700;
    line-height:1.4;
    text-align:center;
    text-decoration:none;
  }
  .mobile-menu-consult { border:1px solid var(--line) !important; background:var(--surface) !important; color:var(--ink) !important; }
  .mobile-menu-price { border:1px solid var(--orange) !important; background:var(--orange) !important; color:#fff !important; }
  [data-theme=dark] .mobile-menu-links>a,[data-theme=dark] .mobile-menu-group>summary,[data-theme=dark] .mobile-theme-row { color:#f4f7ff; }
  [data-theme=dark] .mobile-menu-group>div a { color:#c7d2e5; }
  [data-theme=dark] .mobile-menu-consult { border-color:#5b6a85 !important; color:#f4f7ff !important; }
  .site-header.mobile-menu-open .menu-button { margin-left:auto; }
}

@media (max-width:820px) {
  .mobile-nav { top:52px; }
}
