/* ===== v2.2 self-hosted fonts ===== */
@font-face{font-family:'Rubik';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/rubik-v31-latin_latin-ext-regular.woff2') format('woff2')}
@font-face{font-family:'Rubik';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/rubik-v31-latin_latin-ext-500.woff2') format('woff2')}
@font-face{font-family:'Rubik';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/rubik-v31-latin_latin-ext-600.woff2') format('woff2')}
@font-face{font-family:'Rubik';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/rubik-v31-latin_latin-ext-700.woff2') format('woff2')}
@font-face{font-family:'Aref Ruqaa';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/aref-ruqaa-v26-arabic_latin-regular.woff2') format('woff2')}
@font-face{font-family:'Aref Ruqaa';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/aref-ruqaa-v26-arabic_latin-700.woff2') format('woff2')}
@font-face{font-family:'Vazirmatn';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/vazirmatn-v16-arabic_latin-regular.woff2') format('woff2')}
@font-face{font-family:'Vazirmatn';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/vazirmatn-v16-arabic_latin-500.woff2') format('woff2')}
@font-face{font-family:'Vazirmatn';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/vazirmatn-v16-arabic_latin-700.woff2') format('woff2')}

:root{--navy:#101820;--navy2:#16222C;--navy3:#1B2833;--platinum:#E5E6E2;--white:#FFFFFF;--slate:#687984;--ink:#101820;--ink2:#3F4A52;--line-l:rgba(16,24,32,.12);--line-d:rgba(229,230,226,.16);--plat-t:rgba(229,230,226,.7);--sans:'Rubik','Segoe UI','Helvetica Neue',Arial,sans-serif;--pad:clamp(20px,5vw,72px);--r:2px}
*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--sans);font-size:17px;line-height:1.6;color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased}
html[lang=ar] body{font-family:'Vazirmatn',system-ui,'Segoe UI',Tahoma,Arial,sans-serif;line-height:1.85}
html[lang=ar] h1,html[lang=ar] h2,html[lang=ar] h3,html[lang=ar] .faq summary,html[lang=ar] footer h4{font-family:'Aref Ruqaa','Vazirmatn',serif;font-weight:700;letter-spacing:0;line-height:1.35}
.lat{font-family:'Rubik','Segoe UI',Arial,sans-serif;font-weight:500}
html[lang=zh] body{font-family:'PingFang SC','Hiragino Sans GB','Microsoft YaHei','Noto Sans CJK SC',var(--sans);line-height:1.8}
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.01em;line-height:1.15}
h1{font-size:clamp(2.2rem,5vw,3.9rem);line-height:1.08;max-width:16ch}h2{font-size:clamp(1.7rem,3vw,2.5rem);max-width:26ch}h3{font-size:1.2rem}
p{margin:0;max-width:66ch}a{color:inherit}img{max-width:100%;display:block}
:focus-visible{outline:2px solid var(--slate);outline-offset:3px}
.skip{position:absolute;inset-inline-start:-999px;top:8px;background:var(--platinum);color:var(--navy);padding:8px 12px;z-index:100}.skip:focus{inset-inline-start:8px}
.wrap{max-width:1240px;margin:0 auto;padding-inline:var(--pad)}
section{padding-block:clamp(60px,8vw,104px)}
.dark{background:var(--navy);color:var(--platinum)}.dark p{color:var(--plat-t)}.light{background:var(--white)}.light p{color:var(--ink2)}.soft{background:var(--platinum)}.soft p{color:var(--ink2)}
.lead{font-size:1.1rem}.mt{margin-top:14px}.mt2{margin-top:28px}
.btn{display:inline-block;text-decoration:none;font-weight:500;font-size:1rem;padding:13px 24px;border-radius:var(--r);border:1px solid var(--navy);color:var(--navy);transition:background .2s,color .2s,transform .2s}
.btn:hover{transform:translateY(-1px)}.btn.primary{background:var(--navy);color:var(--platinum)}.btn.primary:hover{background:var(--navy3)}
.dark .btn,.hero .btn{border-color:var(--platinum);color:var(--platinum)}.dark .btn.primary,.hero .btn.primary{background:var(--platinum);color:var(--navy)}.dark .btn.primary:hover,.hero .btn.primary:hover{background:var(--white)}
.actions{display:flex;flex-wrap:wrap;gap:12px 22px;margin-top:32px;align-items:center}.hero-link{color:var(--platinum);text-decoration:none;font-weight:500;padding:13px 4px;border-bottom:1px solid rgba(229,230,226,.45);transition:border-color .3s}.hero-link:hover{border-color:var(--platinum)}.hero-link .arr{display:inline-block;transition:transform .35s}.hero-link:hover .arr{transform:translateX(4px)}html[dir=rtl] .hero-link:hover .arr{transform:translateX(-4px)}
a,button,summary{touch-action:manipulation;-webkit-tap-highlight-color:rgba(229,230,226,.15)}
/* header */
.top{position:sticky;top:0;z-index:50;background:rgba(16,24,32,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line-d);color:var(--platinum)}
.top .wrap{display:flex;align-items:center;gap:22px;min-height:74px}
.brand img{height:48px;width:auto}
nav.main{display:flex;gap:22px;margin-inline-start:auto;align-items:center}
nav.main a,nav.main summary{text-decoration:none;color:var(--plat-t);font-size:.97rem;padding:6px 0;border-bottom:1px solid transparent;transition:color .2s,border-color .2s;cursor:pointer;list-style:none}
nav.main a:hover,nav.main summary:hover,nav.main a[aria-current=page]{color:var(--platinum);border-color:var(--platinum)}
nav.main details{position:relative}nav.main summary::-webkit-details-marker{display:none}nav.main summary::after{content:" ▾";font-size:.8em}
nav.main details>div{position:absolute;top:calc(100% + 10px);inset-inline-start:0;background:var(--navy);border:1px solid var(--line-d);border-radius:var(--r);min-width:260px;padding:8px 0;box-shadow:0 20px 40px -20px rgba(0,0,0,.6)}
nav.main details>div a{display:block;padding:10px 16px;border:0;white-space:nowrap}
.lang{display:flex;gap:2px;margin-inline-start:6px}.lang a{text-decoration:none;color:var(--plat-t);font-size:.88rem;padding:5px 8px;border-radius:var(--r);white-space:nowrap}
.lang a:hover{color:var(--platinum)}.lang a[aria-current=true]{color:var(--navy);background:var(--platinum)}

.menu{display:none;background:none;border:1px solid var(--line-d);color:var(--platinum);width:44px;height:40px;border-radius:var(--r);cursor:pointer;margin-inline-start:auto}
.menu span{display:block;width:18px;height:1.5px;background:var(--platinum);margin:5px auto}
/* hero */
.hero{position:relative;overflow:hidden;color:var(--platinum);background:var(--navy);padding-block:clamp(84px,11vw,150px)}
.hero .bg{position:absolute;inset:0;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,24,32,.9),rgba(16,24,32,.6) 60%,rgba(16,24,32,.3))}
html[dir=rtl] .hero::before{background:linear-gradient(270deg,rgba(16,24,32,.9),rgba(16,24,32,.6) 60%,rgba(16,24,32,.3))}
.hero .wrap{position:relative}.hero p{margin-top:24px;font-size:1.1rem;color:var(--plat-t)}
.hero .banner{margin-top:38px;font-size:.98rem;color:var(--plat-t);min-height:1.6em}.hero .banner span{display:inline-block;animation:fadeIn .8s}
@keyframes drift{from{transform:scale(1)}to{transform:scale(1.06)}}@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
/* reveal */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s cubic-bezier(.2,.8,.2,1),transform .7s cubic-bezier(.2,.8,.2,1)}.reveal.in{opacity:1;transform:none}
/* cards */
.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:40px}
.tab{background:var(--white);border:1px solid var(--line-l);border-radius:var(--r);overflow:hidden;text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s}
.tab:hover{transform:translateY(-4px);box-shadow:0 24px 40px -28px rgba(16,24,32,.5)}
.tab .mosaic{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:2px;background:var(--navy);aspect-ratio:16/9}
.tab .mosaic img{width:100%;height:100%;object-fit:cover}.tab .mosaic img:first-child{grid-row:1/3}
.tab .body{padding:20px 20px 22px}.tab h3{margin-bottom:8px}.tab p{font-size:.95rem}.tab .more{margin-top:14px;font-size:.92rem;text-decoration:underline;text-underline-offset:4px}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);margin-top:40px}
.block{padding-top:18px;border-top:1px solid var(--line-l)}.dark .block{border-color:var(--line-d)}.block h3{margin-bottom:8px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px 40px;margin-top:40px}
/* products */
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}
.card{background:var(--white);border:1px solid var(--line-l);border-radius:var(--r);overflow:hidden;transition:transform .25s,box-shadow .25s}
.card:hover{transform:translateY(-4px);box-shadow:0 24px 40px -28px rgba(16,24,32,.5)}
.card figure{margin:0;aspect-ratio:4/3;background:var(--navy);overflow:hidden;cursor:zoom-in}.card img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.card:hover img{transform:scale(1.03)}
.card .body{padding:18px 20px 22px}.card h3{margin-bottom:8px;font-size:1.15rem}.card p{font-size:.93rem}
.sub{margin-top:52px;padding-top:20px;border-top:1px solid var(--line-l)}.sub h3{font-size:1.35rem;margin-bottom:8px}
/* faq */
.faq details{border-top:1px solid var(--line-l);padding:18px 0}.faq details:last-child{border-bottom:1px solid var(--line-l)}
.faq summary{cursor:pointer;font-weight:600;font-size:1.08rem;list-style:none;display:flex;justify-content:space-between;gap:16px}html[lang=ar] .faq summary{font-weight:700}
.faq summary .q{flex:1}.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:"+";color:var(--slate);font-weight:400}.faq details[open] summary::after{content:"–"}
.faq details p{margin-top:12px}
/* contact */
.contact .wrap{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(32px,6vw,80px)}
form{margin-top:28px;display:grid;gap:18px}.f{display:flex;flex-direction:column;gap:6px}label{font-size:.9rem;color:var(--ink2)}
input,textarea{border:1px solid rgba(16,24,32,.3);background:var(--white);color:var(--ink);font:inherit;padding:12px 14px;border-radius:var(--r);transition:border-color .2s}
input:focus,textarea:focus{outline:none;border-color:var(--navy)}textarea{min-height:170px;resize:vertical}
.help{font-size:.84rem;color:var(--slate);display:flex;justify-content:space-between}
.status{font-size:.95rem;margin-top:8px;min-height:1.4em}.status.ok{color:#1F5B3A}.status.err{color:#8A2B2B}
form.contact-form{position:relative}.hp{position:absolute;top:0;inset-inline-start:0;width:1px;height:1px;margin:0;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;opacity:0;pointer-events:none}
.info h3{margin:0 0 16px}.info ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}.info li{padding-bottom:12px;border-bottom:1px solid var(--line-l)}
.info li b{display:block;font-weight:500;font-size:.84rem;color:var(--slate);margin-bottom:2px}
.info li small{display:block;font-size:.8rem;color:var(--slate);margin-top:2px}.info a{text-decoration:none;color:var(--navy)}.info a:hover{text-decoration:underline}
.qr{margin-top:20px;display:flex;align-items:center;gap:16px}.qr img{width:128px;height:128px;border:1px solid var(--line-l);background:#fff}.qr span{font-size:.88rem;color:var(--ink2);max-width:22ch}
.wa{display:inline-flex;align-items:center;gap:8px}
/* footer */
footer{background:var(--navy);color:var(--plat-t);padding:56px 0 28px;font-size:.93rem}
footer .grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
footer img{height:64px;width:auto;margin-bottom:14px}footer .tag{color:var(--plat-t);font-size:1rem;line-height:1.6;max-width:30ch;margin-top:2px;font-weight:500;letter-spacing:.01em}html[lang=ar] footer .tag{font-family:'Aref Ruqaa','Vazirmatn',serif;font-weight:700;font-size:1.08rem;letter-spacing:0}html[lang=zh] footer .tag{letter-spacing:.06em}footer h4{color:var(--platinum);margin:0 0 12px;font-weight:500;font-size:1.05rem}footer .btn{border-color:var(--platinum);color:var(--platinum)}footer .btn.primary{background:var(--platinum);color:var(--navy)}footer .btn.primary:hover{background:var(--white);transform:translateY(-1px)}footer .cta{padding:12px 26px;font-size:1rem}footer .fcta p{max-width:34ch}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}footer a{color:var(--plat-t);text-decoration:none}footer a:hover{color:var(--platinum)}
footer .bottom{margin-top:36px;padding-top:18px;border-top:1px solid var(--line-d);display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;font-size:.86rem}
/* lightbox */
.lb{position:fixed;inset:0;background:rgba(16,24,32,.92);display:none;align-items:center;justify-content:center;z-index:200;padding:24px}.lb.open{display:flex}
.lb img{max-width:min(1200px,96vw);max-height:88vh;border-radius:var(--r)}.lb button{position:absolute;top:16px;inset-inline-end:16px;background:none;border:1px solid var(--line-d);color:var(--platinum);width:44px;height:44px;border-radius:var(--r);font-size:1.4rem;cursor:pointer}
.lb figcaption{position:absolute;bottom:18px;inset-inline-start:0;inset-inline-end:0;text-align:center;color:var(--platinum);font-size:.95rem}
@media (max-width:1000px){.tabs,.pgrid,.grid3{grid-template-columns:1fr 1fr}.contact .wrap{grid-template-columns:1fr}footer .grid{grid-template-columns:1fr 1fr}}
@media (max-width:720px){nav.main{display:none;position:absolute;top:74px;inset-inline:0;flex-direction:column;align-items:stretch;gap:0;background:var(--navy);border-bottom:1px solid var(--line-d);padding:6px var(--pad) 14px}
nav.main.open{display:flex}nav.main a,nav.main summary{padding:13px 0;border-bottom:1px solid var(--line-d)}nav.main details>div{position:static;border:0;box-shadow:none;padding:0 0 0 14px;min-width:0}
.menu{display:block}.lang{margin-inline-start:0;gap:0}.lang a{padding:5px 6px;font-size:.84rem}.top .wrap{gap:12px}.brand img{height:44px}
.tabs,.pgrid,.grid3,.cols{grid-template-columns:1fr}footer .grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.hero .bg,.hero .banner span{animation:none}.reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}

/* ===== motion & premium touches (v1.5) ===== */
body{animation:fadeBody .7s ease-out both}@keyframes fadeBody{from{opacity:0}to{opacity:1}}
.top{transition:background .3s}.top .wrap{transition:min-height .3s}.top.scrolled{background:rgba(16,24,32,.94)}.top.scrolled .wrap{min-height:62px}.top.scrolled .brand img{height:40px}.brand img{transition:height .3s}
nav.main a,nav.main summary{position:relative;border-bottom:0}nav.main a::after,nav.main summary::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--platinum);transform:scaleX(0);transform-origin:center;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
nav.main a:hover::after,nav.main summary:hover::after,nav.main a[aria-current=page]::after{transform:scaleX(1)}nav.main summary::after{content:""}nav.main summary{padding-inline-end:14px}nav.main summary::before{content:"▾";position:absolute;inset-inline-end:0;top:6px;font-size:.75em;color:var(--plat-t)}
.hero .bg{will-change:transform}.hero .bg i{position:absolute;inset:-6%;background:url(/assets/img/bg-hex.svg) center/cover no-repeat;animation:drift 28s ease-in-out infinite alternate}
@keyframes rise{to{opacity:1;transform:none}}
.hero h1 .w{display:inline-block;opacity:0;transform:translateY(26px);animation:rise .9s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(.09s * var(--i))}
.hero p,.hero .actions,.hero .banner{opacity:0;transform:translateY(14px);animation:rise .9s cubic-bezier(.2,.8,.2,1) forwards}.hero p{animation-delay:.55s}.hero .actions{animation-delay:.75s}.hero .banner{animation-delay:.95s}
.tabs .reveal:nth-child(2),.pgrid .reveal:nth-child(3n+2),.grid3 .reveal:nth-child(3n+2){transition-delay:.1s}.tabs .reveal:nth-child(3),.pgrid .reveal:nth-child(3n+3),.grid3 .reveal:nth-child(3n+3){transition-delay:.2s}
.tab .mosaic img{transition:transform 1.6s cubic-bezier(.2,.8,.2,1)}.tab:hover .mosaic img{transform:scale(1.06)}
.card h3{position:relative;display:inline-block;padding-bottom:4px}.card h3::after{content:"";position:absolute;inset-inline-start:0;bottom:0;width:100%;height:1px;background:var(--navy);transform:scaleX(0);transform-origin:var(--tx-origin,left);transition:transform .45s cubic-bezier(.2,.8,.2,1)}html[dir=rtl] .card h3::after{transform-origin:right}.card:hover h3::after{transform:scaleX(1)}
.card{border-color:var(--line-l);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s}.card:hover{border-color:rgba(16,24,32,.28)}
.lb.open img{animation:pop .4s cubic-bezier(.2,.8,.2,1)}@keyframes pop{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
/* brand button */
.btn-brand{position:relative;display:inline-flex;align-items:center;gap:14px;padding:14px 26px;border:1px solid rgba(229,230,226,.55);border-radius:999px;color:var(--platinum);text-decoration:none;font-weight:500;font-size:1.02rem;overflow:hidden;isolation:isolate;transition:border-color .35s,color .35s,transform .35s,box-shadow .35s}
.btn-brand::before{content:"";position:absolute;inset:0;background:var(--platinum);transform:translateX(-101%);transition:transform .5s cubic-bezier(.2,.8,.2,1);z-index:-1}html[dir=rtl] .btn-brand::before{transform:translateX(101%)}
.btn-brand:hover,.btn-brand:focus-visible{color:var(--navy);border-color:var(--platinum);transform:translateY(-2px);box-shadow:0 22px 44px -22px rgba(229,230,226,.45)}.btn-brand:hover::before,.btn-brand:focus-visible::before,html[dir=rtl] .btn-brand:hover::before,html[dir=rtl] .btn-brand:focus-visible::before{transform:translateX(0)}
.btn-brand svg{width:20px;height:20px;flex:none;transition:transform .6s cubic-bezier(.2,.8,.2,1)}.btn-brand:hover svg{transform:rotate(60deg)}
.btn-brand .arr{display:inline-block;transition:transform .4s cubic-bezier(.2,.8,.2,1)}.btn-brand:hover .arr{transform:translateX(5px)}html[dir=rtl] .btn-brand:hover .arr{transform:translateX(-5px)}
footer{position:relative;overflow:hidden}footer .amb{position:absolute;inset-inline-end:-140px;top:-120px;width:520px;height:520px;opacity:.06;animation:floaty 22s ease-in-out infinite alternate;pointer-events:none}@keyframes floaty{from{transform:translateY(0) rotate(0deg)}to{transform:translateY(40px) rotate(8deg)}}
footer .wrap{position:relative}
@media (prefers-reduced-motion:reduce){body,.hero .bg i,.hero h1 .w,.hero p,.hero .actions,.hero .banner,.lb.open img,footer .amb,.tab .mosaic img{animation:none;transition:none;opacity:1;transform:none}.reveal{transition-delay:0s}}
@media (hover:none){.btn-brand:hover{transform:none;color:var(--platinum);border-color:rgba(229,230,226,.55);box-shadow:none}.btn-brand:hover::before{transform:translateX(-101%)}html[dir=rtl] .btn-brand:hover::before{transform:translateX(101%)}.btn-brand:hover svg,.btn-brand:hover .arr,.hero-link:hover .arr{transform:none}.card:hover,.tab:hover{transform:none;box-shadow:none}.card:hover img,.tab:hover .mosaic img{transform:none}.card:hover h3::after{transform:scaleX(0)}nav.main a:hover::after,nav.main summary:hover::after{transform:scaleX(0)}nav.main a[aria-current=page]::after{transform:scaleX(1)}.btn:hover{transform:none}}


/* ===== v2.0: brand button — tap choreography + idle sheen ===== */
.btn-brand.is-pressed{color:var(--navy);border-color:var(--platinum);transform:translateY(-2px);box-shadow:0 22px 44px -22px rgba(229,230,226,.45)}
.btn-brand.is-pressed::before,html[dir=rtl] .btn-brand.is-pressed::before{transform:translateX(0)}
.btn-brand.is-pressed svg{transform:rotate(60deg)}.btn-brand.is-pressed .arr{transform:translateX(5px)}html[dir=rtl] .btn-brand.is-pressed .arr{transform:translateX(-5px)}
.btn-brand::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(115deg,rgba(229,230,226,0) 42%,rgba(229,230,226,.22) 50%,rgba(229,230,226,0) 58%);background-size:260% 100%;background-repeat:no-repeat;background-position:180% 0;animation:sheen 6.5s cubic-bezier(.4,0,.2,1) infinite}
html[dir=rtl] .btn-brand::after{background-image:linear-gradient(245deg,rgba(229,230,226,0) 42%,rgba(229,230,226,.22) 50%,rgba(229,230,226,0) 58%);background-position:-80% 0;animation-name:sheenRtl}
@keyframes sheen{0%,64%{background-position:180% 0}100%{background-position:-80% 0}}
@keyframes sheenRtl{0%,64%{background-position:-80% 0}100%{background-position:180% 0}}
.btn-brand:hover::after,.btn-brand.is-pressed::after{opacity:0}
.btn-brand svg{transform-origin:50% 50%}
@media (prefers-reduced-motion:reduce){.btn-brand::after{animation:none;display:none}.btn-brand.is-pressed{transform:none}}

/* ===== v2.0.1: mobile fit — no horizontal overflow on narrow or large-text phones ===== */
body{overflow-x:hidden;overflow-x:clip}
.contact .wrap>*,form>*,.f,.info li{min-width:0}
input,textarea{width:100%;max-width:100%;min-width:0}
.info a,.info .lat{overflow-wrap:anywhere}
.skip{inset-inline-start:8px;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.skip:focus{width:auto;height:auto;padding:8px 12px;clip:auto;clip-path:none}
.brand{display:flex;align-items:center;min-width:0}
.brand img,.top.scrolled .brand img{height:auto;width:auto;max-width:100%;transition:max-height .3s}
.brand img{max-height:48px}.top.scrolled .brand img{max-height:40px}
@media (max-width:720px){.brand img{max-height:44px}.top.scrolled .brand img{max-height:40px}}
@media (max-width:400px){.top .wrap{gap:10px}.lang a{padding:5px 5px;font-size:.8rem}}