/* 3S — creative enhancement layer */
.x-progress{position:fixed;inset-block-start:0;inset-inline:0;height:2px;z-index:9999;pointer-events:none;
  background:linear-gradient(90deg,var(--wine),var(--gold),var(--gold-l));transform-origin:var(--x-origin,right);transform:scaleX(0)}
html[dir="ltr"] .x-progress{--x-origin:left}
.x-grain{position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:.07;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
.x-cursor{position:fixed;top:0;left:0;width:38px;height:38px;margin:-19px 0 0 -19px;border:1px solid var(--gold);border-radius:50%;
  pointer-events:none;z-index:9997;transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),background .35s,border-color .35s;
  display:grid;place-items:center;font:500 .62rem/1 "Jost",sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--paper)}
.x-cursor span{opacity:0;transition:opacity .25s}
.x-cursor.is-big{width:92px;height:92px;margin:-46px 0 0 -46px;background:var(--wine);border-color:var(--wine)}
.x-cursor.is-big span{opacity:1}
.x-cursor.is-link{width:64px;height:64px;margin:-32px 0 0 -32px;background:color-mix(in oklab,var(--gold) 18%,transparent)}
@media (hover:none),(pointer:coarse){.x-cursor{display:none}}
.x-spot{position:absolute;inset:0;pointer-events:none;z-index:1;
  background:radial-gradient(520px circle at var(--mx,70%) var(--my,40%),color-mix(in oklab,var(--gold-l) 35%,transparent),transparent 60%);mix-blend-mode:soft-light}
.hero{position:relative}
.display em,.h2 em{background:linear-gradient(100deg,var(--wine) 0%,var(--wine) 38%,var(--gold) 50%,var(--wine) 62%,var(--wine) 100%);
  background-size:260% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:x-shine 7s ease-in-out infinite}
@keyframes x-shine{0%,100%{background-position:100% 0}50%{background-position:0 0}}
.x-tilt{transition:transform .5s var(--ease);transform-style:preserve-3d;will-change:transform}

/* Studio section */
.x-studio{position:relative;background:var(--wine-deep);color:var(--paper);padding-block:var(--sec);overflow:hidden}
.x-studio::before{content:"";position:absolute;inset:-20%;background:radial-gradient(circle at 20% 20%,color-mix(in oklab,var(--gold) 30%,transparent),transparent 40%),radial-gradient(circle at 85% 80%,color-mix(in oklab,var(--wine) 90%,transparent),transparent 50%);animation:x-drift 18s ease-in-out infinite alternate}
@keyframes x-drift{to{transform:translate3d(4%,-3%,0) rotate(6deg)}}
.x-studio .wrap{position:relative}
.x-studio__head{display:grid;gap:18px;max-inline-size:820px;margin-block-end:clamp(40px,6vw,80px)}
.x-studio__label{font:italic 400 1.1rem/1 var(--f-lat);color:var(--gold-l);display:flex;align-items:center;gap:14px}
.x-studio__label::before{content:"";inline-size:48px;block-size:1px;background:var(--gold)}
.x-studio h2{font:300 clamp(2.2rem,5.4vw,5rem)/1.12 var(--f-display);margin:0}
html[lang="en"] .x-studio h2{font-family:"Bodoni Moda",serif;font-weight:400;line-height:1.02}
.x-studio h2 em{font-style:normal;color:var(--gold-l)} html[lang="en"] .x-studio h2 em{font-style:italic}
.x-studio p.lead{color:color-mix(in oklab,var(--paper) 75%,transparent);font-size:1.08rem;line-height:1.9;max-inline-size:60ch;margin:0}
.x-studio__grid{display:grid;grid-template-columns:.8fr 1fr;gap:clamp(14px,2vw,28px);align-items:center}
.x-studio__grid .x-card:first-child{grid-column:1/-1;aspect-ratio:21/9}
.x-card{position:relative;border-radius:18px;overflow:hidden;background:var(--wine);box-shadow:0 40px 80px -30px #000a;border:1px solid color-mix(in oklab,var(--gold) 35%,transparent)}
.x-card img,.x-card video{display:block;inline-size:100%;block-size:100%;object-fit:cover}
.x-card--tall{aspect-ratio:9/16}.x-card--sq{aspect-ratio:1/1}
.x-card figcaption{position:absolute;inset-inline:0;inset-block-end:0;padding:18px 20px;background:linear-gradient(transparent,#000b);font:400 .8rem/1.4 "Jost",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-l)}
.x-card:nth-child(2){max-block-size:80vh;justify-self:end;inline-size:min(100%,440px)}
.x-studio__cta{margin-block-start:clamp(40px,5vw,64px);display:flex;flex-wrap:wrap;gap:16px;align-items:center}
.x-btn{display:inline-flex;align-items:center;gap:10px;padding:18px 30px;border-radius:999px;background:var(--gold);color:var(--wine-deep);font-weight:500;text-decoration:none;transition:transform .3s var(--ease),background .3s}
.x-btn:hover{background:var(--gold-l);transform:translateY(-2px)}
.x-studio__note{color:color-mix(in oklab,var(--paper) 60%,transparent);font-size:.9rem}
@media (max-width:860px){.x-studio__grid .x-card:first-child{aspect-ratio:16/10}.x-card:nth-child(2){inline-size:100%}}

/* Floating WhatsApp */
.x-fab{position:fixed;inset-block-end:22px;inset-inline-start:22px;z-index:9000;inline-size:58px;block-size:58px;border-radius:50%;background:var(--wa);display:grid;place-items:center;box-shadow:0 14px 30px -10px #25d36699}
.x-fab::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--wa);animation:x-ping 2.2s cubic-bezier(0,0,.2,1) infinite}
@keyframes x-ping{75%,100%{transform:scale(1.7);opacity:0}}
.x-fab svg{inline-size:28px;block-size:28px;fill:#fff}
@media (prefers-reduced-motion:reduce){.display em,.h2 em,.x-studio::before,.x-fab::after{animation:none}}

/* ===== Language switch ===== */
#langBtn{display:none!important}
.x-lang{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;border:1px solid rgba(90,24,40,.25);border-radius:999px;padding:3px;background:rgba(255,255,255,.5);backdrop-filter:blur(8px)}
.x-lang button{position:relative;z-index:1;border:0;background:none;font:600 .8rem/1 inherit;padding:.5rem .8rem;cursor:pointer;color:#5a1828;transition:color .3s}
.x-lang i{position:absolute;inset:3px;width:calc(50% - 3px);border-radius:999px;background:#5a1828;transition:transform .45s cubic-bezier(.7,0,.2,1)}
.x-lang[data-on="ar"] i{inset-inline-start:3px;transform:none}
[dir="ltr"] .x-lang i{left:3px}[dir="rtl"] .x-lang i{right:3px}
.x-lang[data-on="en"] i{transform:translateX(100%)}
[dir="rtl"] .x-lang[data-on="en"] i{transform:translateX(-100%)}
.x-lang button[aria-pressed="true"]{color:#f3f0ea}
.x-lang{direction:inherit}

/* ===== Before / After ===== */
.x-ba,.x-lab{padding:clamp(4rem,9vw,8rem) 0;background:#f3f0ea;color:#2a1a1d}
.x-lab{background:#1c0d11;color:#f3f0ea}
.x-ba .x-studio__label{color:#8a2438}
.x-ba__filters{display:flex;flex-wrap:wrap;gap:.5rem;margin:2rem 0 2.5rem}
.x-ba__filters button{border:1px solid rgba(90,24,40,.25);background:transparent;border-radius:999px;padding:.6rem 1.2rem;font:inherit;cursor:pointer;color:#5a1828;transition:all .3s}
.x-ba__filters button.on,.x-ba__filters button:hover{background:#5a1828;color:#f3f0ea;border-color:#5a1828}
.x-ba__grid{display:grid;grid-template-columns:repeat(12,1fr);gap:1.5rem}
.x-ba__item{grid-column:span 4;display:flex;flex-direction:column;gap:1rem;animation:xUp .6s both}
.x-ba__item--16x9{grid-column:span 12}
.x-ba__item--1x1{grid-column:span 4}
@media(max-width:900px){.x-ba__item,.x-ba__item--1x1{grid-column:span 6}}
@media(max-width:600px){.x-ba__item,.x-ba__item--1x1{grid-column:span 12}}
.x-ba__frame{position:relative;overflow:hidden;border-radius:18px;cursor:ew-resize;touch-action:none;user-select:none;box-shadow:0 30px 60px -30px rgba(40,10,20,.45);max-height:80vh;width:100%}
.x-ba__frame img,.x-ba__frame video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.x-ba__beforeWrap{position:absolute;inset:0}
.x-ba__before{filter:grayscale(.75) contrast(.78) brightness(1.08) saturate(.6) blur(.4px)}
.x-ba__tag{position:absolute;top:1rem;z-index:2;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;padding:.35rem .7rem;border-radius:999px;background:rgba(20,8,12,.55);color:#f3f0ea;backdrop-filter:blur(6px)}
.x-ba__tag--l{left:1rem}.x-ba__tag--r{right:1rem;background:#c9a45c;color:#1c0d11}
.x-ba__line{position:absolute;top:0;bottom:0;width:2px;background:#f3f0ea;z-index:3;transform:translateX(-1px);box-shadow:0 0 20px rgba(0,0,0,.4)}
.x-ba__knob{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;border:0;background:#f3f0ea;color:#5a1828;font-weight:700;cursor:ew-resize;box-shadow:0 8px 24px rgba(0,0,0,.3)}
.x-ba__knob:focus-visible{outline:3px solid #c9a45c}
.x-ba__cat,.x-ba__ol{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#a07a3a;margin:0}
.x-ba__meta h3{font-size:1.35rem;margin:.3rem 0 .6rem}
.x-ba__meta ul{list-style:none;padding:0;margin:.5rem 0 0;display:grid;gap:.35rem}
.x-ba__meta li{padding-inline-start:1.3rem;position:relative;font-size:.95rem}
.x-ba__meta li::before{content:"✦";position:absolute;inset-inline-start:0;color:#c9a45c}
@keyframes xUp{from{opacity:0;transform:translateY(20px)}}

/* ===== AI Lab ===== */
.x-lab__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:2rem;margin-top:2.5rem}
@media(max-width:900px){.x-lab__grid{grid-template-columns:1fr}}
.x-lab__panel{display:flex;flex-direction:column;gap:1rem}
.x-lab__drop{position:relative;display:grid;place-items:center;aspect-ratio:4/3;border:1.5px dashed rgba(201,164,92,.55);border-radius:20px;cursor:pointer;overflow:hidden;background:radial-gradient(circle at 30% 20%,rgba(201,164,92,.12),transparent 60%);transition:border-color .3s}
.x-lab__drop:hover{border-color:#c9a45c}
.x-lab__drop span{display:grid;gap:.5rem;text-align:center;color:rgba(243,240,234,.8)}
.x-lab__drop b{font-size:2.4rem;color:#c9a45c;font-weight:300}
.x-lab__drop small{opacity:.55;font-size:.75rem;letter-spacing:.1em}
.x-lab__drop img,.x-lab__drop video{width:100%;height:100%;object-fit:cover}
.x-lab__chg{position:absolute;bottom:.8rem;inset-inline-end:.8rem;font-style:normal;font-size:.75rem;padding:.35rem .7rem;border-radius:999px;background:rgba(20,8,12,.7)}
.x-lab textarea{font:inherit;background:rgba(243,240,234,.06);border:1px solid rgba(243,240,234,.15);border-radius:14px;color:inherit;padding:.9rem 1rem;resize:vertical}
.x-lab .x-btn:disabled{opacity:.45;cursor:not-allowed}
.x-lab__err{color:#ffb4a8;margin:0}
.x-lab__out{min-height:320px;border-radius:20px;background:rgba(243,240,234,.04);border:1px solid rgba(243,240,234,.08);padding:1.5rem}
.x-lab__empty{display:grid;place-items:center;height:100%;min-height:280px;font-size:3rem;color:rgba(201,164,92,.3);animation:xPulse 3s infinite}
@keyframes xPulse{50%{opacity:.4;transform:scale(.9)}}
.x-lab__sk{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.x-lab__sk i{height:180px;border-radius:14px;background:linear-gradient(90deg,rgba(243,240,234,.05),rgba(201,164,92,.15),rgba(243,240,234,.05));background-size:200% 100%;animation:xSh 1.4s infinite}
@keyframes xSh{to{background-position:-200% 0}}
.x-lab__sum{margin-bottom:1.2rem}.x-lab__sum p:last-child{margin:.4rem 0 0;opacity:.85;line-height:1.7}
.x-lab__cards{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:600px){.x-lab__cards,.x-lab__sk{grid-template-columns:1fr}}
.x-lab__card{position:relative;padding:1.3rem;border-radius:16px;background:linear-gradient(160deg,rgba(90,24,40,.55),rgba(28,13,17,.9));border:1px solid rgba(201,164,92,.25);animation:xUp .6s both}
.x-lab__n{position:absolute;top:1rem;inset-inline-end:1rem;color:#c9a45c;font-size:.8rem}
.x-lab__card h3{margin:0 0 .5rem;font-size:1.15rem;color:#e8c98a}
.x-lab__card p{margin:0 0 .8rem;font-size:.92rem;line-height:1.65;opacity:.9}
.x-lab__card dl{display:grid;grid-template-columns:auto 1fr;gap:.3rem .8rem;font-size:.82rem;margin:0 0 1rem}
.x-lab__card dt{color:#c9a45c}.x-lab__card dd{margin:0;opacity:.85}
.x-lab__card a{color:#e8c98a;font-size:.85rem;text-decoration:none;border-bottom:1px solid currentColor}
[dir="ltr"] .x-lab__card a{unicode-bidi:plaintext}
#nav a{white-space:nowrap}@media(min-width:1100px){#nav{gap:clamp(.6rem,1.4vw,1.4rem)}}
.x-ba h2,.x-lab h2{font-size:clamp(2.2rem,5.4vw,5rem)!important;font-weight:300!important;line-height:1.12!important;margin:0}
html[lang="en"] .x-ba h2,html[lang="en"] .x-lab h2{font-family:"Bodoni Moda",serif;font-weight:400;line-height:1.02}
.x-ba h2 em{font-style:normal;color:#8a2438}.x-lab h2 em{font-style:normal;color:#e8c98a}
html[lang="en"] .x-ba h2 em,html[lang="en"] .x-lab h2 em{font-style:italic}
.x-ba p.lead,.x-lab p.lead{font-size:1.08rem;line-height:1.9;max-inline-size:60ch;margin:0;opacity:.8}
.x-lab .x-btn{background:linear-gradient(120deg,#c9a45c,#e8c98a);color:#1c0d11;font-weight:600}