/* Both layouts use the same semantic DOM, readers and application state. */
.viewSwitcher{display:flex;flex:none;gap:3px;padding:4px;border:1px solid #dce2f1;background:#f1f4fc;border-radius:13px}
.viewSwitcher button{border:0;background:transparent;color:#56627e;font-weight:800;font-size:13px;padding:8px 12px;border-radius:9px;min-height:36px}
.viewSwitcher button[aria-pressed=true]{background:#304bd8;color:#fff;box-shadow:0 3px 8px #304bd825}
.viewSwitcher button:focus-visible{outline:3px solid #09bcd5;outline-offset:2px}
.websiteFooter{display:none}
html[data-layout=website] body{background:#faf9f6}
html[data-layout=website] .app{display:block}
html[data-layout=website] .sidebar{position:relative;top:auto;left:auto;transform:none!important;width:100%;height:auto;max-height:none;padding:24px max(24px,calc((100vw - 1280px)/2));background:#fff;color:#172341;border-bottom:1px solid #e5e7ee;z-index:3}
html[data-layout=website] .brand{color:#172341;margin:0 0 18px;padding:0}
html[data-layout=website] .brand img{width:56px;height:56px}
html[data-layout=website] .brand strong{font-size:27px}
html[data-layout=website] .brand small{color:#68758e;font-size:12px}
html[data-layout=website] .navlabel,html[data-layout=website] .sidebottom,html[data-layout=website] .menutoggle,html[data-layout=website] .topbrand,html[data-layout=website] .mobilebar{display:none!important}
html[data-layout=website] #nav{display:flex;flex-wrap:wrap;gap:6px;overflow:visible}
html[data-layout=website] #nav button,html[data-layout=website] #nav .navRepo{flex:none;padding:9px 12px;background:#f2f5fc;color:#394866;border:1px solid #e1e6f1;font-size:13px;border-radius:9px;min-height:42px}
html[data-layout=website] #nav button.active{background:#243eaa;color:#fff;border-color:#243eaa}
html[data-layout=website] #nav .lawNav{background:#e8f5f3!important;color:#135d58!important;border-color:#cee6df!important}
html[data-layout=website] #nav .lawNav.active{background:#135d58!important;color:#fff!important}
html[data-layout=website] #nav button span{font-size:17px;color:inherit}
html[data-layout=website] #nav button:hover,html[data-layout=website] #nav .navRepo:hover{background:#e5ebff;color:#263d91}
html[data-layout=website] #nav button.active:hover{background:#243eaa;color:#fff}
html[data-layout=website] .topbar{height:76px;padding:12px max(24px,calc((100vw - 1280px)/2));background:#ffffffed;backdrop-filter:blur(14px);border-bottom:1px solid #e3e7ef;gap:18px}
html[data-layout=website] .searchbox{max-width:none;margin:0;background:#f8f9fc}
html[data-layout=website] main{max-width:1280px;padding:38px 24px 48px}
html[data-layout=website] .hero{min-height:350px;padding:54px;border-radius:12px;background:radial-gradient(ellipse at 85% 20%,#dbeaff,transparent 55%),linear-gradient(120deg,#f0f3ff,#fff8e9);color:#162846;box-shadow:none;border:1px solid #e2e6f1;grid-template-columns:1.5fr 1fr}
html[data-layout=website] .hero h1{font-size:clamp(36px,4vw,60px);max-width:700px;line-height:1.1}
html[data-layout=website] .hero p{color:#53627d;font-size:17px}
html[data-layout=website] .hero .eyebrow{color:#3150bb}
html[data-layout=website] .hero .ghost{background:#fff;color:#274497;border-color:#c6d1ed}
html[data-layout=website] .hero:before{border-color:#7393d440;box-shadow:0 0 0 50px #73a7ff10,0 0 0 100px #9d8bff0c}
html[data-layout=website] .hero-mark{width:min(240px,85%);border-radius:24px;box-shadow:0 24px 42px #132c6a25}
html[data-layout=website] .sectiontitle{margin-top:40px}
html[data-layout=website] .grid{gap:22px}
html[data-layout=website] .card{padding:25px;border-radius:12px;box-shadow:none}
html[data-layout=website] .card h3{font-size:21px}
html[data-layout=website] .card p{font-size:15px;line-height:1.7}
html[data-layout=website] .websiteFooter{display:flex;justify-content:space-between;gap:40px;padding:44px max(24px,calc((100vw - 1280px)/2));background:#112141;color:#e5edff;border-top:4px solid #54bfd8}
.websiteFooter strong{font:700 26px 'Outfit',sans-serif}.websiteFooter strong span{color:#7adaf1}
.websiteFooter p{margin:8px 0;color:#c5d3ef}.websiteFooter small{color:#95aaca}
.websiteFooter nav{display:grid;grid-template-columns:repeat(2,auto);align-content:center;gap:8px 20px}
.websiteFooter nav button{color:#e5edff;padding:8px;background:#ffffff09;border-radius:6px;font-size:13px}
.websiteFooter nav button:hover{background:#ffffff20}
@media(max-width:1100px){.topbar{gap:10px;padding-left:18px;padding-right:18px}.topbrand{display:none}.searchbox kbd{display:none}}
@media(max-width:640px){
 .topbar{height:auto;min-height:112px;display:grid;grid-template-columns:36px 1fr auto;gap:8px;padding:9px 14px}
 .topbar .menutoggle{grid-column:1;grid-row:1}.topbar .viewSwitcher{grid-column:2;grid-row:1;justify-self:center}.topbar .chatTop{grid-column:3;grid-row:1;font-size:12px;padding:9px 10px}
 .topbar .searchbox{grid-column:1/-1;grid-row:2;width:100%;max-width:none;margin:0}.topbar .topbrand{display:none}
 .viewSwitcher button{padding:7px 10px;font-size:12px}
 html[data-layout=website] .sidebar{padding:20px 16px 12px}
 html[data-layout=website] #nav{flex-wrap:nowrap;overflow-x:auto;padding-bottom:7px;scrollbar-width:thin}
 html[data-layout=website] .brand img{width:48px;height:48px}
 html[data-layout=website] .topbar{height:auto;min-height:108px;grid-template-columns:1fr auto;padding:10px 16px;gap:8px}
 html[data-layout=website] .topbar .viewSwitcher{grid-column:1;justify-self:start}
 html[data-layout=website] .topbar .chatTop{grid-column:2}
 html[data-layout=website] main{padding:24px 16px 30px}
 html[data-layout=website] .hero{display:block;padding:30px 24px;min-height:0}
 html[data-layout=website] .hero h1{font-size:36px}
 html[data-layout=website] .hero-mark{display:none}
 html[data-layout=website] .grid{grid-template-columns:1fr;gap:16px}
 html[data-layout=website] .websiteFooter{flex-direction:column;padding:30px 20px;gap:24px}
}
@media(prefers-reduced-motion:no-preference){html[data-layout=website] .card{transition:box-shadow .2s,border-color .2s}html[data-layout=website] .card:hover{box-shadow:0 10px 28px #182c6010}}
