html { scroll-behavior: smooth; }
body.seoweb-2026 { margin: 0; background: #F6F8F7; }
body.admin-bar [data-screen-label] [style*="position:sticky"][style*="top:0"] { top: 32px !important; }
@media (max-width: 782px) { body.admin-bar [data-screen-label] [style*="position:sticky"][style*="top:0"] { top: 46px !important; } }
.seoweb-shortcode-cta{background:#10353A;color:#fff;border-radius:24px;padding:42px;text-align:center;position:relative;overflow:hidden;margin:40px 0;font-family:'Hanken Grotesk',system-ui,sans-serif}.seoweb-shortcode-cta h2{margin:0;font-size:30px;letter-spacing:-.8px}.seoweb-shortcode-cta p{margin:14px auto 0;max-width:540px;color:#B9D4D0;font-size:17px;line-height:1.55}.seoweb-shortcode-cta a{display:inline-flex;margin-top:24px;background:#fff;color:#10353A;text-decoration:none;font-weight:800;padding:14px 24px;border-radius:13px}.sw-filter-hidden{display:none!important}.sw-topic-active{background:#2E7B82!important;color:#fff!important;border-color:#2E7B82!important}.sw-topic-inactive{background:#fff!important;color:#3C4F53!important;border-color:#DDE4E3!important}.sw-form-message{margin-top:14px;padding:12px 14px;border-radius:11px;font-size:13.5px;font-weight:700}.sw-form-message.ok{background:#E6F4EC;color:#1F8A5B}.sw-form-message.err{background:#FCE8E6;color:#B42318}.sw-context-banner{background:#fff;border:1px solid var(--border,#E2E7E6);border-radius:13px;padding:14px 16px;margin-bottom:16px;display:flex;gap:12px;align-items:flex-start}.sw-context-banner b{display:block;font-size:15.5px;color:var(--ink,#16262B);margin-top:2px}.sw-context-banner span{font-family:'Spline Sans Mono',monospace;font-size:11px;color:var(--primary-d,#235F66);text-transform:uppercase;letter-spacing:.05em}.sw-lightbox{position:fixed;inset:0;z-index:99999;background:rgba(10,24,26,.84);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:40px;cursor:zoom-out}.sw-lightbox img{max-width:min(1180px,94vw);max-height:90vh;width:auto;height:auto;border-radius:14px;box-shadow:0 40px 90px -20px rgba(0,0,0,.6);cursor:default;display:block}.sw-lightbox button{position:absolute;top:22px;right:26px;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.14);border:none;color:#fff;font-size:24px;cursor:pointer}.sw-floating-toc{position:fixed;right:18px;bottom:18px;z-index:9990;font-family:'Hanken Grotesk',system-ui,sans-serif}.sw-floating-toc button{background:#10353A;color:#fff;border:none;border-radius:999px;padding:12px 16px;font-weight:800;box-shadow:0 22px 50px -20px rgba(15,40,45,.55);cursor:pointer}.sw-floating-toc nav{display:none;position:absolute;right:0;bottom:52px;width:min(320px,calc(100vw - 36px));background:#fff;border:1px solid #E2E7E6;border-radius:16px;box-shadow:0 22px 60px -22px rgba(15,40,45,.45);padding:14px}.sw-floating-toc.open nav{display:block}.sw-floating-toc a{display:block;padding:8px 10px;border-radius:9px;text-decoration:none;color:#16262B;font-size:13px;font-weight:700}.sw-floating-toc a.active,.sw-floating-toc a:hover{background:#E3EFEE;color:#235F66}@media(max-width:760px){.sw-floating-toc{bottom:82px}.sw-lightbox{padding:16px}}

/* v1.0.2: Megamenu hover bridge + stacking fix.
   Several Claude service templates place the dropdown 16px below the trigger.
   Without an invisible bridge, the pointer leaves .sw-mw before reaching .sw-mega. */
[data-screen-label] .sw-mw{position:relative!important;z-index:5000;}
[data-screen-label] .sw-mw::after{content:"";position:absolute;left:-24px;top:100%;width:820px;height:26px;display:block;background:transparent;pointer-events:auto;}
[data-screen-label] .sw-mw .sw-mega{z-index:5001!important;}
[data-screen-label] .sw-mw:hover .sw-mega,[data-screen-label] .sw-mw:focus-within .sw-mega{opacity:1!important;visibility:visible!important;transform:none!important;pointer-events:auto!important;}
[data-screen-label] [style*="position:sticky"][style*="top:0"]{z-index:5000!important;overflow:visible!important;}
@media(max-width:880px){[data-screen-label] .sw-mw::after{display:none;}}

/* v1.0.5: Updated Claude handover requires a full-height megamenu trigger and a flush panel. */
[data-screen-label] [data-r-nav] .sw-mw > a{display:flex!important;align-items:center!important;min-height:55px!important;padding:18px 0!important;}
[data-screen-label] .sw-mw .sw-mega{top:100%!important;margin-top:0!important;}

/* v1.0.6: Claude 1.0.2 requires one fixed 60px header height across every template. */
[data-screen-label] > div[style*="position:sticky"] > div,
[data-screen-label] div[style*="position:sticky"][style*="top:0"] > div[style*="max-width:1140px"]{
  height:60px!important;
  min-height:60px!important;
  align-items:center!important;
}
[data-screen-label] div[style*="position:sticky"] a[href*="/en/"],
[data-screen-label] div[style*="position:sticky"] a[hreflang],
[data-screen-label] [data-sw-lang] a{
  box-sizing:border-box;
}


/* v1.0.7: Favicon is served site-wide from prototypes/assets/favicon.svg plus a 512px PNG fallback. */

/* SeoWeb global mobile drawer shell. Server-rendered so the hamburger is visible before JS runs. */
.sw-burger{
    display:none;
    position:fixed;
    top:9px;
    right:16px;
    z-index:2600;
    width:44px;
    height:44px;
    border-radius:12px;
    border:1px solid rgba(20,40,44,.14);
    background:rgba(255,255,255,.92);
    -webkit-backdrop-filter:blur(10px);
    backdrop-filter:blur(10px);
    align-items:center;
    justify-content:center;
    cursor:pointer;
    padding:0;
    color:var(--ink,#16262B);
    box-shadow:0 4px 14px -8px rgba(15,40,45,.4);
}
.sw-burger:focus-visible{outline:3px solid rgba(46,123,130,.28);outline-offset:3px;}
.sw-mnav-ov{position:fixed;inset:0;z-index:3000;background:rgba(16,30,32,.44);opacity:0;pointer-events:none;transition:opacity .26s ease;}
.sw-mnav-ov.on{opacity:1;pointer-events:auto;}
.sw-mnav{position:fixed;top:0;right:0;bottom:0;width:min(88vw,372px);z-index:3001;background:#fff;transform:translateX(102%);transition:transform .34s cubic-bezier(.33,0,.1,1);display:flex;flex-direction:column;box-shadow:-30px 0 70px -34px rgba(15,40,45,.55);font-family:"Hanken Grotesk",system-ui,sans-serif;color:var(--ink,#16262B);}
.sw-mnav.on{transform:none;}
.sw-mnav a{text-decoration:none;}
.sw-mnav-loading{padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid var(--border,#E2E7E6);}
.sw-mnav-logo{font-weight:800;font-size:25px;letter-spacing:-1.2px;text-decoration:none;line-height:1;}
.sw-mnav-logo span{color:var(--ink,#16262B);}.sw-mnav-logo b{color:var(--primary,#2E7B82);font-weight:800;}
.sw-mnav-fallback-cta{font-size:14px;font-weight:700;color:var(--primary-d,#235F66);}
body.sw-noscroll{overflow:hidden;}
@media(max-width:880px){.sw-burger{display:inline-flex;}}
@media(min-width:881px){.sw-burger,.sw-mnav,.sw-mnav-ov{display:none!important;}}


/* v1.0.10: Mobile menu visibility fix.
   The desktop megamenu fix intentionally gives the sticky header z-index 5000.
   On mobile that placed the 2600 burger behind the header. Keep Claude's relative
   mobile stack by lowering the sticky header only below 880px. */
@media(max-width:880px){
  [data-screen-label] [style*="position:sticky"][style*="top:0"]{z-index:2400!important;}
  .sw-burger{display:inline-flex!important;z-index:2600!important;}
  .sw-mnav-ov{z-index:3000!important;}
  .sw-mnav{z-index:3001!important;}
}

/* v1.0.12: Claude 1.0.6 adds the WordPress theme screenshot at root screenshot.png
   and clarifies that the mobile drawer must not appear on maintenance/design-reference screens. */