:root{
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
  --font-body:'Tajawal',Tahoma,Arial,sans-serif; --font-head:'Reem Kufi',Tahoma,Arial,sans-serif; --font-title:'Oswald',Tahoma,Arial,sans-serif; --w-title:600;
  --oil:#f0a81a; --on-accent:#14191d;
  --home-bg:#f3f4f5; --home-ink:#14191d; --blob1:#f6c453; --blob2:#e9b9a2;
  --page-bg:#0f1316; --page-ink:#f1f3f4; --card-bg:#1a2025; --card-ink:#ffffff;
}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*,*::before,*::after{box-sizing:inherit}
body{margin:0;min-height:100vh;background:var(--home-bg);color:var(--home-ink);font-family:var(--font-body);line-height:1.6;transition:background-color .6s ease,color .6s ease}
body.is-brand{background:var(--page-bg);color:var(--page-ink)}
[hidden]{display:none!important}
a{color:inherit}

/* ===== الواجهة الرئيسية ===== */
#hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:70px 20px}
.blob{position:absolute;border-radius:50%;filter:blur(80px);opacity:.5}
.b1{width:46vmax;height:46vmax;background:var(--blob1);top:-16vmax;inset-inline-start:-12vmax;animation:drift1 19s ease-in-out infinite alternate}
.b2{width:38vmax;height:38vmax;background:var(--blob2);bottom:-18vmax;inset-inline-end:-10vmax;animation:drift2 23s ease-in-out infinite alternate}
@keyframes drift1{to{transform:translate(18vmax,12vmax) scale(1.15)}}
@keyframes drift2{to{transform:translate(-16vmax,-10vmax) scale(.9)}}
#heroVideo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-in{position:relative;text-align:center;width:100%;max-width:980px}
h1.site{font-family:var(--font-title);font-weight:var(--w-title);font-size:clamp(58px,14vw,160px);line-height:1;margin:0;direction:ltr;display:flex;justify-content:center;flex-wrap:wrap}
h1.site span{display:inline-block;animation:letter .9s cubic-bezier(.2,.8,.2,1) backwards}
@keyframes letter{from{opacity:0;transform:translateY(60px) rotate(6deg);filter:blur(10px)}}
.line{height:5px;width:0;background:var(--oil);margin:22px auto 0;border-radius:3px;animation:draw 1s .9s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes draw{to{width:120px}}
.hint{margin:18px 0 0;color:color-mix(in srgb,var(--home-ink) 58%,var(--home-bg));font-size:17px;animation:fade 1s 1.1s backwards}
@keyframes fade{from{opacity:0}}
.logos{display:flex;flex-wrap:wrap;justify-content:center;gap:22px 34px;margin-top:54px}
a.logo{display:block;padding:6px;text-decoration:none}
a.logo img{display:block;width:118px;height:42px;object-fit:contain;mix-blend-mode:multiply;filter:grayscale(1);opacity:.55;transition:transform .3s cubic-bezier(.2,.8,.2,1),opacity .3s,filter .3s;animation:rise .8s cubic-bezier(.2,.8,.2,1) backwards;animation-delay:calc(1.2s + var(--i)*70ms)}
@keyframes rise{from{opacity:0;transform:translateY(22px)}}
a.logo:hover img,a.logo:focus-visible img{filter:none;opacity:1;transform:translateY(-5px) scale(1.14)}
body[data-home=dark] a.logo img{mix-blend-mode:screen;filter:grayscale(1) invert(1);opacity:.62}
body[data-home=dark] a.logo:hover img,body[data-home=dark] a.logo:focus-visible img{filter:invert(1) hue-rotate(180deg);opacity:1}
a.logo:focus-visible{outline:3px solid var(--oil);outline-offset:2px;border-radius:4px}
.nologo{display:flex;align-items:center;justify-content:center;width:118px;height:42px;font-weight:700;color:color-mix(in srgb,var(--home-ink) 60%,var(--home-bg));font-size:15px;text-align:center;line-height:1.2}
.sform{display:flex;gap:8px;justify-content:center;margin:34px auto 0;max-width:560px;animation:fade 1s 1.2s backwards}
.sform input{flex:1;min-width:0;font:inherit;font-size:16px;padding:12px 18px;border:1px solid color-mix(in srgb,var(--home-ink) 20%,transparent);border-radius:999px;background:color-mix(in srgb,var(--home-bg) 62%,transparent);color:var(--home-ink);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}
.sform input::placeholder{color:color-mix(in srgb,var(--home-ink) 45%,var(--home-bg))}
.sform input:focus{border-color:var(--oil);box-shadow:0 0 0 4px color-mix(in srgb,var(--oil) 28%,transparent);background:var(--home-bg)}
.sform button{font:inherit;font-weight:700;border:0;background:var(--home-ink);color:var(--home-bg);border-radius:999px;padding:0 24px;cursor:pointer;transition:transform .2s,background .2s,color .2s}
.sform button:hover{background:var(--oil);color:var(--on-accent);transform:scale(1.05)}
.sform button:focus-visible{outline:3px solid var(--oil);outline-offset:2px}

/* ===== صفحة الشركة ===== */
#brandPage{position:relative;min-height:100vh}
.pbg{position:fixed;inset:0;z-index:-1;background:var(--page-bg) center/cover no-repeat}
.pbg::after{content:"";position:absolute;inset:0;background:color-mix(in srgb,var(--page-bg) var(--dimp,60%),transparent)}
.pbg.plain{background:radial-gradient(60vmax 40vmax at 85% -5%,color-mix(in srgb,var(--oil) 18%,transparent),transparent 60%),radial-gradient(50vmax 40vmax at 5% 105%,color-mix(in srgb,var(--oil) 10%,transparent),transparent 60%),var(--page-bg)}
.pbg.plain::after{display:none}
.view-in{animation:viewIn .6s cubic-bezier(.2,.7,.2,1)}
@keyframes viewIn{from{opacity:0;transform:translateY(22px)}}
.bwrap{max-width:1180px;margin:0 auto;padding:0 20px 70px}
.crumb{padding:26px 0 0}
.crumb a{color:color-mix(in srgb,var(--page-ink) 62%,var(--page-bg));text-decoration:none;font-size:16px;border-bottom:1px solid color-mix(in srgb,var(--page-ink) 22%,transparent);transition:color .2s,border-color .2s}
.crumb a:hover{color:var(--page-ink);border-color:var(--oil)}
.bhead{display:flex;align-items:center;gap:24px;flex-wrap:wrap;padding:34px 0 26px;margin-bottom:30px;position:relative}
.bhead::after{content:"";position:absolute;bottom:0;inset-inline-start:0;height:4px;width:100%;background:linear-gradient(90deg,var(--oil),transparent);transform-origin:right;animation:draw2 1s .2s cubic-bezier(.2,.8,.2,1) backwards}
@keyframes draw2{from{transform:scaleX(0)}}
.logo-plate{background:#fff;border-radius:10px;padding:12px 20px;height:92px;display:flex;align-items:center;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.logo-plate img{max-height:66px;max-width:230px;display:block}
.bhead h2{margin:0;font-family:var(--font-head);font-size:clamp(32px,6vw,56px);line-height:1.15}
.bhead.nologo-head .logo-plate{display:none}
.products{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(560px,100%),1fr));gap:30px}
.pcard{position:relative;direction:ltr;text-align:start;border-radius:16px;overflow:hidden;background:var(--card-bg) center/cover no-repeat;color:var(--card-ink);border:1px solid color-mix(in srgb,var(--page-ink) 14%,transparent);opacity:0;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s}
.pcard.in{opacity:1;animation:cardIn .75s var(--d,0ms) cubic-bezier(.2,.8,.2,1) backwards}
@keyframes cardIn{from{opacity:0;transform:translateY(36px) scale(.96)}}
.pcard.in:hover{transform:translateY(-4px) scale(1.035);z-index:4;box-shadow:0 24px 48px rgba(0,0,0,.5);border-color:color-mix(in srgb,var(--oil) 65%,transparent)}
@keyframes fill{to{width:100%}}
.empty{color:color-mix(in srgb,var(--page-ink) 60%,var(--page-bg));padding:20px 0}
.btag{display:inline-block;font-size:12.5px;color:var(--on-accent);background:var(--oil);border-radius:4px;padding:1px 8px;margin-top:4px;text-decoration:none}

.more{display:block;margin:34px auto 0;font:inherit;font-weight:700;cursor:pointer;border:1px solid color-mix(in srgb,var(--page-ink) 30%,transparent);background:color-mix(in srgb,var(--page-ink) 6%,transparent);color:var(--page-ink);border-radius:999px;padding:12px 34px;transition:all .25s}
.more:hover{background:var(--oil);border-color:var(--oil);color:var(--on-accent);transform:translateY(-2px)}
.more:focus-visible{outline:3px solid var(--oil);outline-offset:3px}
.share{margin:44px 0 0;padding:16px;background:color-mix(in srgb,var(--page-ink) 6%,transparent);border:1px solid color-mix(in srgb,var(--page-ink) 14%,transparent);border-radius:10px;display:flex;gap:10px;flex-wrap:wrap;align-items:center;backdrop-filter:blur(6px)}
.share span{color:color-mix(in srgb,var(--page-ink) 60%,var(--page-bg));font-size:15px}
.share input{flex:1;min-width:220px;direction:ltr;font:inherit;font-size:14px;padding:9px 11px;border:1px solid color-mix(in srgb,var(--page-ink) 20%,transparent);border-radius:6px;background:color-mix(in srgb,var(--page-bg) 55%,transparent);color:var(--page-ink)}
.share button{font:inherit;cursor:pointer;background:var(--oil);border:0;color:var(--on-accent);font-weight:700;padding:9px 18px;border-radius:6px;transition:transform .2s}
.share button:hover{transform:scale(1.05)}
.share button:focus-visible,.crumb a:focus-visible{outline:3px solid var(--oil);outline-offset:3px}
.nf{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px}
.nf h1{font-family:var(--font-title);font-weight:var(--w-title);font-size:clamp(40px,9vw,90px);margin:0;direction:ltr}
.nf p{color:color-mix(in srgb,var(--home-ink) 58%,var(--home-bg));font-size:18px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-delay:0ms!important;transition-duration:.01ms!important}}

/* ===== ورقة بيانات المنتج ===== */
.phead{padding-top:16px}
.phead .btag{margin:0 18px 8px}
.rib{display:inline-block;background:var(--oil);color:var(--on-accent);font:italic 700 15px/1.25 var(--font-body);padding:7px 38px 7px 18px;clip-path:polygon(0 0,100% 0,calc(100% - 18px) 100%,0 100%);margin:0}
h3.rib-title{display:block;font-size:19px;padding:11px 44px 11px 18px;clip-path:polygon(0 0,100% 0,calc(100% - 24px) 100%,0 100%)}
.tagline{margin:10px 18px 4px;font-style:italic;font-weight:700;font-size:16px}
.psec{margin-top:14px}
.psec>p,.psec>table{margin-inline:18px}
.psec>p{margin-top:8px;margin-bottom:0}
.desc{white-space:pre-line;font-size:15px;color:color-mix(in srgb,var(--card-ink) 88%,var(--card-bg))}
.dtab{width:calc(100% - 36px);border-collapse:collapse;margin-top:9px;font-size:14px;background:color-mix(in srgb,var(--card-bg) 55%,transparent);border:1px solid color-mix(in srgb,var(--card-ink) 30%,transparent);border-radius:6px}
.dtab th,.dtab td{padding:4px 10px;text-align:start;vertical-align:top}
.dtab tbody th{font-weight:500;white-space:nowrap;width:1%;padding-inline-end:18px;color:color-mix(in srgb,var(--card-ink) 82%,var(--card-bg))}
.dtab.chem th,.dtab.chem td{border:1px solid color-mix(in srgb,var(--card-ink) 26%,transparent)}
.dtab.chem thead th{background:color-mix(in srgb,var(--card-ink) 12%,transparent);font-weight:700;white-space:normal}
.dtab.chem tbody th{width:auto;font-weight:700;white-space:normal}
.dtab.chem td{text-align:center}

/* ===== شريط البحث الثابت ===== */
/* ===== شريط البحث: ثابت بالأعلى بسطر واحد لا يغطي المنتجات ===== */
.tools{margin:0 0 24px;padding:6px 0}
.tools.sticky{position:sticky;top:0;z-index:30;margin:0 -20px 24px;padding:10px 20px;background:var(--page-bg);border-bottom:1px solid color-mix(in srgb,var(--page-ink) 14%,transparent);box-shadow:0 6px 16px -10px rgba(0,0,0,.6)}
.trow{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.trow input[type=search]{flex:1 1 220px;min-width:0;font:inherit;font-size:16px;padding:9px 16px;border:1px solid color-mix(in srgb,var(--page-ink) 24%,transparent);border-radius:999px;background:color-mix(in srgb,var(--page-ink) 6%,var(--page-bg));color:var(--page-ink);outline:none;transition:border-color .2s,box-shadow .2s}
.trow input[type=search]::placeholder{color:color-mix(in srgb,var(--page-ink) 45%,var(--page-bg))}
.trow input[type=search]:focus{border-color:var(--oil);box-shadow:0 0 0 4px color-mix(in srgb,var(--oil) 24%,transparent)}
.trow select{font:inherit;font-size:15px;padding:9px 14px;border:1px solid color-mix(in srgb,var(--page-ink) 24%,transparent);border-radius:999px;background:color-mix(in srgb,var(--page-ink) 6%,var(--page-bg));color:var(--page-ink);max-width:100%;cursor:pointer}
.trow select option{background:var(--page-bg);color:var(--page-ink)}
.trow select:focus-visible{outline:3px solid var(--oil);outline-offset:2px}
.count{color:color-mix(in srgb,var(--page-ink) 58%,var(--page-bg));font-size:14px;white-space:nowrap;margin-inline-start:auto}

/* ===== طبقات عرض المنتج: 1 خلفية بشفافية، 2 بقعة ضوء، 3 المنتج ===== */
.l1{position:absolute;inset:0;z-index:0;background:center/cover no-repeat;opacity:var(--bgop,1);pointer-events:none}
.pcard .content{position:relative;z-index:3}
.stage{direction:ltr;position:relative;z-index:1;height:clamp(280px,32vw,400px);margin-top:8px;cursor:default}
.stage[role=button]{cursor:pointer}
.slide{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:flex-end;padding:0 8% 10px 0;opacity:0;transition:opacity .9s ease,transform 1.5s ease;transform:scale(1.06)}
.slide.active{opacity:1;transform:none}
.pw{position:relative;height:94%;display:flex;align-items:flex-end}
.pw::before{content:"";position:absolute;left:50%;top:54%;width:240%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,color-mix(in srgb,var(--glow,transparent) var(--glowp,70%),transparent),transparent)}
.pw img,.pw svg{position:relative;height:100%;width:auto;max-width:100%;display:block;object-fit:contain}
.stage:not(.clear) .pw img{background:#fff;padding:10px;border-radius:12px}
.dots{position:absolute;bottom:6px;left:0;right:0;display:flex;justify-content:center;gap:5px;z-index:4}
.dot{width:6px;height:6px;border-radius:3px;background:color-mix(in srgb,var(--card-ink) 40%,transparent);transition:all .35s}
.dot.on{width:18px;background:var(--oil)}
.bar{position:absolute;bottom:0;left:0;height:3px;width:0;background:var(--oil);z-index:4}
.stage:focus-visible{outline:3px solid var(--oil);outline-offset:-3px}

/* =====================================================================
   طابع «قوة وصناعة»: بطاقة المنتج بعمودين (المواصفات + العبوة)
   ===================================================================== */
.pbg.plain::before{content:"";position:absolute;inset:0;opacity:.5;pointer-events:none;
  background:
   repeating-linear-gradient(135deg,color-mix(in srgb,var(--page-ink) 3%,transparent) 0 1px,transparent 1px 9px),
   radial-gradient(90vmax 50vmax at 50% 120%,color-mix(in srgb,var(--oil) 12%,transparent),transparent 70%)}
.bhead{gap:22px;padding:40px 0 28px}
.bhead::before{content:"";width:46px;height:34px;flex:none;order:3;background:
  linear-gradient(var(--oil),var(--oil)) 0 0/100% 6px no-repeat,
  linear-gradient(var(--oil),var(--oil)) 8px 14px/calc(100% - 8px) 6px no-repeat,
  linear-gradient(var(--oil),var(--oil)) 16px 28px/calc(100% - 16px) 6px no-repeat;transform:skewX(-18deg)}
.logo-plate{border-radius:4px;clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%)}
.bhead h2{letter-spacing:.01em}

.products{grid-template-columns:1fr;gap:46px}
.pcard{border-radius:6px;border:1px solid color-mix(in srgb,var(--page-ink) 12%,transparent);box-shadow:0 18px 40px -18px rgba(0,0,0,.8)}
.pcard::after{content:"";position:absolute;inset:0 0 auto 0;height:4px;z-index:5;background:linear-gradient(90deg,var(--oil) 0 62%,transparent 62% 64%,var(--oil) 64% 66%,transparent 66% 68%,var(--oil) 68% 70%,transparent 70%)}
.l1::after{content:"";position:absolute;inset:0;opacity:.55;background:
  linear-gradient(90deg,color-mix(in srgb,var(--card-bg) 92%,transparent) 0,color-mix(in srgb,var(--card-bg) 70%,transparent) 55%,transparent 100%)}
.pcard.in:hover{transform:translateY(-4px) scale(1.012);box-shadow:0 30px 60px -20px rgba(0,0,0,.85),0 0 0 1px color-mix(in srgb,var(--oil) 55%,transparent)}
.pgrid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);align-items:stretch}
.pcard .content{padding-bottom:26px}
.phead{padding-top:26px}
.rib{font-family:var(--font-title);font-style:italic;font-weight:600;letter-spacing:.02em;font-size:16px;padding:7px 40px 7px 20px}
h3.rib-title{font-size:clamp(20px,2.1vw,27px);padding:12px 52px 12px 20px;line-height:1.2;margin-inline-end:-1px}
.tagline{margin:12px 20px 4px;font-size:17px}
.psec{margin-top:18px}
.psec>p,.psec>table{margin-inline:20px}
.desc{font-size:15.5px;line-height:1.75;max-width:70ch}
.dtab{width:calc(100% - 40px);border-radius:3px;font-variant-numeric:tabular-nums;background:color-mix(in srgb,var(--card-bg) 72%,transparent)}
.dtab th,.dtab td{padding:7px 12px}
.dtab:not(.chem) tbody tr+tr th,.dtab:not(.chem) tbody tr+tr td{border-top:1px solid color-mix(in srgb,var(--card-ink) 10%,transparent)}
.dtab:not(.chem) td{font-weight:600}
.dtab.chem tbody tr:nth-child(even){background:color-mix(in srgb,var(--card-ink) 5%,transparent)}
.dtab.chem td:last-child{font-weight:700;color:var(--card-ink)}
.dtab.chem thead th{font-family:var(--font-title);letter-spacing:.03em;font-weight:600;background:color-mix(in srgb,var(--oil) 22%,transparent)}

/* عمود العبوة: يبقى ظاهراً وإنت عم تقرأ المواصفات */
.pside{position:relative;padding:18px 18px 18px}
.pstick{position:sticky;top:20px}
.pside .stage{height:clamp(380px,40vw,560px);margin:0}
.pside .stage::after{content:"";position:absolute;inset-inline:6% 6%;bottom:30px;height:2px;z-index:0;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--glow,var(--oil)) 85%,#fff),transparent)}
.pside .slide{justify-content:center;padding:0 0 32px}
.pw{height:84%;max-width:88%}
.pw img,.pw svg{filter:drop-shadow(0 26px 30px rgba(0,0,0,.55))}
.pcard.in .slide.active .pw{animation:floaty 6s ease-in-out infinite}
@keyframes floaty{50%{transform:translateY(-8px)}}
.kchips{position:absolute;top:6px;inset-inline-end:22px;z-index:6;display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.kc{display:inline-block;font:italic 600 14px/1 var(--font-title);letter-spacing:.04em;padding:7px 12px;border:1px solid color-mix(in srgb,var(--card-ink) 28%,transparent);background:color-mix(in srgb,var(--card-bg) 60%,transparent);backdrop-filter:blur(4px);clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%)}
.kc-main{font-size:clamp(26px,3vw,40px);padding:8px 18px;border:0;background:var(--oil);color:var(--on-accent)}
.kc-main small{font-size:.42em;margin-inline-end:6px;vertical-align:.55em;letter-spacing:.08em}

@media (max-width:820px){
  .pgrid{grid-template-columns:1fr}
  .pside{order:-1;padding-top:62px}
  .pstick{position:static}
  .pside .stage{height:340px}
  .kchips{top:16px;inset-inline-end:16px;flex-direction:row;flex-wrap:wrap;justify-content:flex-end}
  .kc-main{font-size:24px}
  .l1::after{background:linear-gradient(180deg,transparent 0,color-mix(in srgb,var(--card-bg) 60%,transparent) 32%,color-mix(in srgb,var(--card-bg) 92%,transparent) 60%)}
  h3.rib-title{margin-inline-end:24px}
}
@media (prefers-reduced-motion:reduce){.pcard.in .slide.active .pw{animation:none}}
@media (max-width:520px){.trow select{flex:1 1 40%;min-width:0}.count{flex-basis:100%;text-align:end}}

/* ===== شعار الموقع بالواجهة الرئيسية (قناع يتلوّن مع الثيم + حركة دخول ولمعة) ===== */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
h1.site.has-logo{display:block;font-size:inherit;line-height:0;filter:drop-shadow(0 0 28px color-mix(in srgb,var(--oil) 38%,transparent))}
h1.site .site-logo{display:block;width:min(80vw,620px);aspect-ratio:var(--ratio,2.7);margin:0 auto;
  background:linear-gradient(110deg,var(--home-ink) 0 40%,var(--oil) 47%,#fff 50%,var(--oil) 53%,var(--home-ink) 60% 100%) 100% 0/320% 100% no-repeat;
  -webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat;
  animation:logoIn 1.5s cubic-bezier(.16,.84,.24,1) both,logoShine 7s 1.2s ease-in-out infinite,logoBreath 7s 2.7s ease-in-out infinite}
@keyframes logoIn{0%{opacity:0;transform:scale(.78) translateY(18px);filter:blur(14px)}55%{opacity:1;filter:blur(0)}75%{transform:scale(1.035)}100%{transform:none}}
@keyframes logoShine{0%{background-position:100% 0}22%,100%{background-position:0 0}}
@keyframes logoBreath{0%,100%{transform:scale(1)}50%{transform:scale(1.02)}}

/* ===== شعار الشركة بصفحة المنتجات: أبيض (بلون نص الصفحة) بنص الصفحة بدون اسم ===== */
.bmask{display:none}
.bhead.mask-head{flex-direction:column;justify-content:center;text-align:center;padding:52px 0 36px}
.bhead.mask-head::before{display:none}
.bhead.mask-head::after{background:linear-gradient(90deg,transparent,var(--oil) 30% 70%,transparent);transform-origin:center}
.bhead.mask-head .logo-plate,.bhead.mask-head h2{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);padding:0;margin:-1px;border:0}
.bhead.mask-head .bmask{display:block;height:clamp(76px,13vw,150px);aspect-ratio:var(--ratio,2.5);max-width:86vw;
  background:linear-gradient(110deg,var(--page-ink) 0 40%,var(--oil) 48%,#fff 50%,var(--oil) 52%,var(--page-ink) 60% 100%) 100% 0/320% 100% no-repeat;
  -webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat;
  animation:logoIn 1.2s cubic-bezier(.16,.84,.24,1) both,logoShine 8s 1s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.site-logo,.bhead.mask-head .bmask{animation:none;background-position:0 0}}