@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,400;0,9..144,600;1,9..144,400;1,9..144,500&family=Archivo:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --ink:#0d1b2a;
  --stone:#eef2f7;
  --stone-deep:#e2e9f1;
  --surface:#ffffff;
  --line:#c7d3e0;
  --text:#0d1b2a;
  --text-muted:#5b6b7d;
  --accent:#d4af37;
  --accent-soft:#f7edc9;
  --accent2:#9ab7db;
  --on-dark:#eef2f7;
  --on-dark-muted:#a8bdd1;
  --brand-blue:#a8c3e4;
  --brand-blue-deep:#9ab7db;

  --font-display:'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body:'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --font-mono:'IBM Plex Mono', 'SFMono-Regular', Menlo, monospace;

  --r-sm:10px;
  --r-md:18px;
  --r-lg:26px;
  --r-xl:34px;
  --shadow-sm:0 2px 10px rgba(24,21,16,.06);
  --shadow-md:0 16px 40px -12px rgba(24,21,16,.18);
  --shadow-lg:0 30px 70px -20px rgba(24,21,16,.28);
  --ease:cubic-bezier(.22,1,.36,1);

  /* type scale */
  --fs-xs:clamp(.72rem,.7rem + .1vw,.78rem);
  --fs-sm:clamp(.82rem,.8rem + .1vw,.9rem);
  --fs-base:clamp(.95rem,.92rem + .15vw,1.05rem);
  --fs-md:clamp(1.1rem,1.05rem + .25vw,1.3rem);
  --fs-lg:clamp(1.4rem,1.2rem + 1vw,1.9rem);
  --fs-xl:clamp(1.9rem,1.5rem + 2vw,2.6rem);
  --fs-2xl:clamp(2.3rem,1.8rem + 2.6vw,3.4rem);
  --fs-3xl:clamp(2.8rem,2.1rem + 3.6vw,4.6rem);

  /* spacing rhythm */
  --sec-pad:clamp(64px,6vw + 24px,132px);
  --gutter:clamp(18px,4vw,32px);
  --container:1280px;
}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:#070d15;
    --stone:#0f1822;
    --stone-deep:#131f2c;
    --surface:#101b27;
    --line:#243447;
    --text:#e9eff6;
    --text-muted:#93a5ba;
    --accent:#e2c25f;
    --accent-soft:#2a2413;
    --accent2:#7fa0c9;
    --on-dark:#eef2f7;
    --on-dark-muted:#a8bdd1;
    --brand-blue:#7fa0c9;
    --brand-blue-deep:#6c91bd;
  }
}
:root[data-theme="dark"]{
  --ink:#070d15;
  --stone:#0f1822;
  --stone-deep:#131f2c;
  --surface:#101b27;
  --line:#243447;
  --text:#e9eff6;
  --text-muted:#93a5ba;
  --accent:#e2c25f;
  --accent-soft:#2a2413;
  --accent2:#7fa0c9;
  --on-dark:#eef2f7;
  --on-dark-muted:#a8bdd1;
  --brand-blue:#7fa0c9;
  --brand-blue-deep:#6c91bd;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;overflow-x:hidden;}
html,body{margin:0;padding:0;max-width:100%;}
body{
  background:var(--stone);
  color:var(--text);
  font-family:var(--font-body);
  font-size:var(--fs-base);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
::selection{background:var(--accent);color:var(--ink);}

.wrap{max-width:var(--container);margin:0 auto;padding-inline:var(--gutter);}

h1,h2,h3{font-family:var(--font-display);font-weight:600;margin:0;text-wrap:balance;letter-spacing:-0.015em;}
h2{font-size:var(--fs-xl);line-height:1.08;}
p{line-height:1.6;}
.eyebrow{
  font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent);display:flex;align-items:center;gap:10px;margin-bottom:14px;
}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--accent);display:block;}

.btn{
  font-family:var(--font-body);font-weight:600;font-size:14px;letter-spacing:.01em;
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 24px;border-radius:999px;cursor:pointer;border:1px solid transparent;
  transition:background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease);
}
.btn:active{transform:translateY(1px) scale(.98);}
.btn-solid{background:var(--accent);color:var(--ink);box-shadow:0 8px 22px -8px color-mix(in srgb, var(--accent) 70%, transparent);}
.btn-solid:hover{background:var(--on-dark);transform:translateY(-2px);box-shadow:0 14px 30px -10px color-mix(in srgb, var(--accent) 60%, transparent);}
.btn-line{border-color:var(--line);color:var(--text);}
.btn-line:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px);background:var(--accent-soft);}
.btn-line-dark{border-color:rgba(239,233,217,.35);color:var(--on-dark);}
.btn-line-dark:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px);background:rgba(201,163,76,.1);}
.btn-sm{padding:11px 18px;font-size:12.5px;}

/* ---------- NAV ---------- */
header{
  position:sticky;top:env(safe-area-inset-top,0px);z-index:50;
  background:color-mix(in srgb, var(--stone) 88%, transparent);
  backdrop-filter:blur(14px) saturate(1.4);
  -webkit-backdrop-filter:blur(14px) saturate(1.4);
  border-bottom:1px solid var(--line);
  transition:background .3s var(--ease);
}
/* while the full-screen mobile menu (id="mobileMenu", a sibling of header,
   see header.php) is open: lift header above it (menu is z-index:65) and
   match its solid dark background so the burger/close icon stays visible
   and legible instead of blending into the frosted header tint. */
header.menu-open{
  z-index:90;background:var(--ink);backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom-color:transparent;
}
nav.wrap{display:flex;align-items:center;justify-content:space-between;height:96px;gap:24px;}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-size:21px;font-weight:600;letter-spacing:.01em;flex:none;}
.brand .mark{width:30px;height:30px;flex:none;}
.brand .mark-img{width:40px;height:40px;flex:none;object-fit:contain;}
.brand small{display:block;font-family:var(--font-mono);font-size:9px;letter-spacing:.18em;color:var(--text-muted);font-weight:400;text-transform:uppercase;margin-top:2px;}
.brand--logo-only{transition:transform .3s var(--ease);}
.brand--logo-only:hover{transform:scale(1.05);}
.brand--logo-only .mark-img{width:72px;height:72px;}
@media (max-width:520px){ .brand--logo-only .mark-img{width:54px;height:54px;} }

/* ---------- LANGUAGE SWITCHER ---------- */
.lang-switch{position:relative;flex:none;}
.lang-btn{
  display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:12.5px;font-weight:600;letter-spacing:.02em;
  color:var(--text);background:none;border:1px solid var(--line);border-radius:999px;padding:9px 14px;cursor:pointer;
  transition:border-color .25s var(--ease),background .25s var(--ease),transform .2s var(--ease);
}
.lang-btn:hover{border-color:var(--accent);background:var(--accent-soft);}
.lang-btn .flag{font-size:15px;line-height:1;display:inline-block;}
.lang-btn svg{width:11px;height:11px;flex:none;transition:transform .25s var(--ease);}
.lang-switch.open .lang-btn svg{transform:rotate(180deg);}
.lang-menu{
  position:absolute;top:calc(100% + 10px);right:0;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-md);box-shadow:var(--shadow-md);padding:6px;min-width:168px;
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .25s var(--ease),transform .3s var(--ease),visibility 0s linear .25s;z-index:80;
}
.lang-switch.open .lang-menu{opacity:1;visibility:visible;transform:none;transition:opacity .25s var(--ease),transform .3s var(--ease),visibility 0s;}
.lang-menu button,.lang-menu a{
  width:100%;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--r-sm);background:none;border:none;
  cursor:pointer;font-family:var(--font-body);font-size:13.5px;color:var(--text);text-align:left;text-decoration:none;
  transition:background .2s var(--ease),color .2s var(--ease);
}
.lang-menu button .flag,.lang-menu a .flag{font-size:16px;line-height:1;}
.lang-menu button:hover,.lang-menu a:hover{background:var(--accent-soft);}
.lang-menu button.active,.lang-menu a.active{color:var(--accent);font-weight:700;}
@media (max-width:520px){
  .lang-btn{padding:8px 10px;}
  .lang-btn .lang-code{display:none;}
}
.navlinks{display:flex;align-items:center;gap:36px;}
.navlinks a{font-size:14px;font-weight:500;color:var(--text-muted);position:relative;padding:6px 0;transition:color .25s var(--ease);white-space:nowrap;}
.navlinks a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;border-radius:2px;background:var(--accent);transition:right .35s var(--ease);}
.navlinks a:hover{color:var(--text);}
.navlinks a:hover::after{right:0;}
.navlinks a.active{color:var(--text);}
.navlinks a.active::after{right:0;}
.navcta{display:flex;align-items:center;gap:16px;flex:none;}

.burger{
  display:none;position:relative;z-index:70;background:none;border:none;cursor:pointer;
  width:40px;height:40px;padding:0;
}
.burger span{
  display:block;position:absolute;left:9px;width:22px;height:2px;border-radius:2px;background:var(--text);
  transition:transform .3s var(--ease),opacity .3s var(--ease),top .3s var(--ease),background .2s var(--ease);
}
.burger span:nth-child(1){top:14px;}
.burger span:nth-child(2){top:20px;}
.burger span:nth-child(3){top:26px;}
.burger[aria-expanded="true"] span:nth-child(1){top:20px;transform:rotate(45deg);}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.burger[aria-expanded="true"] span:nth-child(3){top:20px;transform:rotate(-45deg);}
/* the mobile menu overlay is dark (var(--ink)), same tone as --text — without
   this the burger's X blends invisibly into the overlay once it's open */
.burger[aria-expanded="true"] span{background:var(--on-dark);}
@media (max-width:920px){
  .navlinks{display:none;}
  .burger{display:block;}
  .navcta .nav-btn{display:none;}
}

/* full-screen mobile menu overlay */
.mobile-menu{
  position:fixed;inset:0;z-index:65;background:var(--ink);
  display:flex;flex-direction:column;justify-content:center;gap:6px;padding:32px;
  opacity:0;visibility:hidden;transform:translateY(-12px);
  transition:opacity .35s var(--ease),transform .4s var(--ease),visibility 0s linear .4s;
}
.mobile-menu.open{opacity:1;visibility:visible;transform:none;transition:opacity .35s var(--ease),transform .4s var(--ease),visibility 0s;}
.mobile-menu a{
  padding:16px 4px;font-family:var(--font-display);font-size:clamp(28px,8vw,40px);font-weight:600;color:var(--on-dark-muted);
  border-top:1px solid rgba(239,233,217,.14);transition:color .25s var(--ease),padding-left .25s var(--ease);
}
.mobile-menu a.active{color:var(--accent);}
.mobile-menu a:last-of-type{border-bottom:1px solid rgba(239,233,217,.14);}
.mobile-menu a:hover, .mobile-menu a:active{color:var(--accent);padding-left:12px;}
.mobile-menu .mm-foot{margin-top:28px;display:flex;flex-direction:column;gap:10px;font-family:var(--font-mono);font-size:13px;color:var(--on-dark-muted);}
.mobile-menu .mm-foot a{font-family:var(--font-mono);font-size:13px;color:var(--on-dark-muted);border:none;padding:0;}
@media (min-width:921px){ .mobile-menu{display:none;} }

/* ---------- STATS STRIP ---------- */
.stats{background:var(--surface);border-bottom:1px solid var(--line);}
.stats-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
}
.stat{
  padding:34px 26px;border-left:1px solid var(--line);
}
.stat:first-child{border-left:none;}
.stat b{
  display:block;font-family:var(--font-display);font-size:clamp(26px,3.4vw,38px);font-weight:600;
  font-variant-numeric:tabular-nums;
}
.stat span{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.05em;color:var(--text-muted);text-transform:uppercase;}
@media (max-width:760px){
  .stats-grid{grid-template-columns:repeat(2,1fr);}
  .stat{border-left:1px solid var(--line);}
  .stat:nth-child(2n+1){border-left:none;}
  .stat:nth-child(-n+2){border-bottom:1px solid var(--line);}
}

/* ---------- SECTION HEAD ---------- */
section{padding-block:var(--sec-pad);}

/* ---------- PROJECTS ---------- */
.projects{background:var(--surface);border-block:1px solid var(--line);}
.card{
  border:1px solid var(--line);background:var(--surface);overflow:hidden;border-radius:var(--r-md);
  transition:transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
  box-shadow:var(--shadow-sm);
}
.card:hover{border-color:transparent;transform:translateY(-6px);box-shadow:var(--shadow-lg);}
.card-art{
  aspect-ratio:4/3;
  position:relative;overflow:hidden;
}
.card-art svg{width:100%;height:100%;}
.card-art .tag{
  position:absolute;top:12px;left:12px;font-family:var(--font-body);font-weight:700;font-size:10.5px;letter-spacing:.03em;
  background:color-mix(in srgb, var(--surface) 85%, transparent);backdrop-filter:blur(6px);
  padding:6px 13px;border-radius:20px;color:var(--text);text-transform:uppercase;
}
.card-body{padding:22px 24px 24px;}
.card-body h3{font-size:18px;font-weight:600;margin-bottom:6px;}
.card-body .loc{font-size:13px;color:var(--text-muted);margin-bottom:14px;}
.card-foot{
  display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:11px;color:var(--text-muted);
  padding-top:14px;border-top:1px dashed var(--line);
}
.proj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
@media (max-width:920px){ .proj-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .proj-grid{grid-template-columns:1fr;} }

/* ---------- PROCESS ---------- */
.process{background:var(--ink);color:var(--on-dark);}

.stars{display:flex;gap:4px;margin-bottom:22px;color:var(--accent);}
.stars svg{width:18px;height:18px;}

/* ---------- FOOTER ---------- */
footer{background:var(--ink);color:var(--on-dark-muted);}
.foot-cta{
  display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;
  padding-block:56px;border-bottom:1px solid rgba(239,233,217,.14);
}
.foot-cta h2{color:var(--on-dark);font-size:clamp(24px,3.4vw,38px);max-width:16ch;}
.foot-top{
  display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:40px;padding-block:60px 40px;border-bottom:1px solid rgba(239,233,217,.14);
}
@media (max-width:820px){ .foot-top{grid-template-columns:1fr 1fr;} }
@media (max-width:520px){ .foot-top{grid-template-columns:1fr;} }
.foot-top h4{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--on-dark);margin:0 0 18px;}
.foot-top ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:13px;}
.foot-top a{font-size:14px;position:relative;transition:color .25s var(--ease);}
.foot-top a:hover{color:var(--accent);}
.foot-brand p{font-size:14px;line-height:1.65;max-width:34ch;color:var(--on-dark-muted);margin:16px 0 24px;}
.social{display:flex;gap:12px;}
.social a{
  width:38px;height:38px;border:1px solid rgba(239,233,217,.22);border-radius:50%;display:flex;align-items:center;justify-content:center;
  transition:border-color .25s var(--ease),color .25s var(--ease),transform .25s var(--ease),background .25s var(--ease);
}
.social a:hover{border-color:var(--accent);color:var(--accent);background:rgba(201,163,76,.1);transform:translateY(-3px);}
.social svg{width:15px;height:15px;}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;padding-block:24px;font-family:var(--font-mono);font-size:11.5px;flex-wrap:wrap;gap:10px;}
.foot-bottom a:hover{color:var(--accent);}

[data-reveal]{opacity:0;transform:translateY(16px);transition:opacity .6s ease, transform .6s ease;}
[data-reveal].in{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){
  [data-reveal]{opacity:1;transform:none;transition:none;}
  .card,.btn{transition:none;}
  .photo,.photo img,.photo svg,.card-art,.card-art img,.card-art svg,.pd-main-image,.pd-main-image img{transition:none!important;transform:none!important;}
}

/* ---------- REAL PHOTOGRAPHY (darken the existing gradient into a translucent scrim so the photo shows through and overlaid text stays legible) ---------- */
.has-photo{background-size:cover;background-position:center;background-repeat:no-repeat;}
.card-art.has-photo{background-color:#0d1b2a;}
.has-photo.photo::before,
.has-photo.hero2::before,
.has-photo.page-hero::before{
  background:
    repeating-linear-gradient(120deg, rgba(238,242,247,.04) 0 2px, transparent 2px 30px),
    linear-gradient(200deg, rgba(4,7,12,.86) 0%, rgba(10,20,32,.58) 42%, rgba(20,38,58,.34) 75%, rgba(30,50,75,.24) 100%);
}
.has-photo.photo--flat::before{
  background: linear-gradient(180deg, rgba(6,10,16,.48) 0%, rgba(6,10,16,.12) 38%, rgba(6,10,16,.52) 100%);
}

/* ---------- PHOTO PANELS (duotone illustrated stand-ins for photography) ---------- */
.photo{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--ink);border-radius:var(--r-md);perspective:1000px;}
.photo svg{transition:transform .6s cubic-bezier(.22,.85,.32,1);}
.photo img{transition:transform .6s cubic-bezier(.22,.85,.32,1);transform-style:preserve-3d;}
a.photo:hover svg, .card:hover .card-art svg, .how2-card:hover .photo svg, .art-card:hover .photo svg{transform:scale(1.08);}
.photo:hover img, .card:hover .card-art img, .art-card:hover .photo img{transform:scale(1.09) rotateY(-4deg) rotateX(2deg);}
a.photo, .photo{transition:transform .5s cubic-bezier(.22,.85,.32,1), box-shadow .5s ease;transform-style:preserve-3d;}
a.photo:hover, .photo:hover{transform:perspective(1000px) rotateX(3deg) rotateY(-4deg) translateY(-4px) scale(1.015);box-shadow:var(--shadow-md);}
/* nested photo panels inside a card: let the parent's radius do the clipping */
.card .card-art, .how2-card .photo{border-radius:0;}

/* ---------- 3D HOVER for other image boxes across the site (catalog/project cards, product page) ---------- */
.card-art{perspective:1000px;transition:transform .5s cubic-bezier(.22,.85,.32,1);transform-style:preserve-3d;}
.card:hover .card-art, .card-art:hover{transform:perspective(1000px) rotateX(3deg) rotateY(-4deg) scale(1.03);}
.card-art img{transition:transform .6s cubic-bezier(.22,.85,.32,1);}
.card:hover .card-art img, .card-art:hover img{transform:scale(1.1);}
.pd-main-image{perspective:1000px;}
.pd-main-image img{transition:transform .6s cubic-bezier(.22,.85,.32,1);}
.pd-main-image:hover img{transform:scale(1.06) rotateX(2deg) rotateY(-3deg);}
.photo::before{
  content:"";position:absolute;inset:0;
  background:
    repeating-linear-gradient(125deg, rgba(238,242,247,.06) 0 2px, transparent 2px 28px),
    linear-gradient(155deg,#070d15 0%,#0d1b2a 48%,#9ab7db 165%);
}
.photo--cool::before{ background:
    repeating-linear-gradient(125deg, rgba(238,242,247,.06) 0 2px, transparent 2px 28px),
    linear-gradient(155deg,#0a121c 0%,#16283b 45%,#5b83ac 145%); }
.photo--rose::before{ background:
    repeating-linear-gradient(125deg, rgba(238,242,247,.06) 0 2px, transparent 2px 28px),
    linear-gradient(155deg,#0d1006 0%,#2c2410 48%,#d4af37 165%); }
.photo--flat::before{ background:
    repeating-linear-gradient(125deg, rgba(13,27,42,.04) 0 2px, transparent 2px 28px),
    linear-gradient(155deg,#c7d3e0 0%,#e2e9f1 60%,#a8c3e4 160%); }
.photo svg{position:relative;z-index:1;width:44%;height:44%;color:rgba(238,242,247,.92);}
.photo--flat svg{color:rgba(13,27,42,.55);}
.photo .cap{
  position:absolute;z-index:1;left:14px;bottom:12px;font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;
  color:rgba(238,242,247,.75);text-transform:uppercase;
}
.photo--flat .cap{color:rgba(13,27,42,.55);}

/* ---------- HERO 2 (photo hero) ---------- */
.hero2{position:relative;color:var(--on-dark);min-height:min(88vh,760px);display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;}
.hero-slides{position:absolute;inset:0;z-index:-1;overflow:hidden;perspective:1600px;}
.hero-slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transform:translateY(-100%) rotateX(55deg);transform-origin:top;transition:transform 1.2s cubic-bezier(.65,0,.35,1),opacity .8s ease;will-change:transform,opacity;}
.hero-slide.active{opacity:1;transform:translateY(0) rotateX(0deg);z-index:2;}
.hero-slide.leaving{opacity:0;transform:translateY(100%) rotateX(-55deg);transform-origin:bottom;z-index:1;}
.hero2-dots span.active{background:var(--accent);width:22px;border-radius:4px;}
@media (prefers-reduced-motion: reduce){
  .hero-slide{transition:opacity .4s ease;transform:none !important;}
}
.hero2::before{
  content:"";position:absolute;inset:0;z-index:0;
  background:
    repeating-linear-gradient(120deg, rgba(238,242,247,.045) 0 2px, transparent 2px 30px),
    radial-gradient(ellipse at 78% 20%, rgba(212,175,55,.20), transparent 55%),
    linear-gradient(200deg,#060a10 0%, #0d1b2a 42%, #1c3552 78%, #3a5c85 100%);
}
.hero2-inner{position:relative;z-index:1;padding-block:72px 76px;display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:end;}
@media (max-width:820px){ .hero2-inner{grid-template-columns:1fr;} }
.hero2 h1{font-size:var(--fs-3xl);line-height:1.03;max-width:14ch;color:var(--on-dark);}
.hero2 p.lede{font-size:var(--fs-md);line-height:1.65;color:var(--on-dark-muted);max-width:42ch;margin:22px 0 32px;}
.hero2-cta{display:flex;align-items:center;gap:16px;}
.play-btn{
  width:56px;height:56px;border-radius:50%;border:1px solid rgba(239,233,217,.4);display:flex;align-items:center;justify-content:center;flex:none;
  transition:border-color .3s var(--ease),background .3s var(--ease),transform .3s var(--ease);
}
.play-btn:hover{border-color:var(--accent);background:rgba(201,163,76,.16);transform:scale(1.08);}
.play-btn svg{width:16px;height:16px;color:var(--on-dark);}
.hero2-dots{display:flex;gap:8px;margin-top:48px;}
.hero2-dots span{width:7px;height:7px;border-radius:50%;background:rgba(239,233,217,.3);transition:width .3s var(--ease),background .3s var(--ease);}
.hero2-dots span:first-child{background:var(--accent);width:22px;border-radius:4px;}

.hero2-badge{
  justify-self:end;display:flex;align-items:center;gap:14px;padding:16px 20px;border-radius:var(--r-lg);
  background:color-mix(in srgb, var(--ink) 55%, transparent);backdrop-filter:blur(16px);border:1px solid rgba(239,233,217,.16);
  box-shadow:var(--shadow-lg);
}
.hero2-badge .stars{margin:0;}
.hero2-badge .stars svg{width:13px;height:13px;}
.hero2-badge b{display:block;font-family:var(--font-display);font-size:22px;font-weight:600;color:var(--on-dark);}
.hero2-badge span{display:block;font-family:var(--font-mono);font-size:10.5px;color:var(--on-dark-muted);text-transform:uppercase;letter-spacing:.04em;}
@media (max-width:820px){ .hero2-badge{justify-self:start;} }
.scroll-cue{
  position:absolute;left:50%;bottom:28px;transform:translateX(-50%);z-index:1;
  width:46px;height:46px;border-radius:50%;background:var(--surface);display:flex;align-items:center;justify-content:center;
  animation:cueBob 2.4s ease-in-out infinite;
}
.scroll-cue svg{width:16px;height:16px;color:var(--accent);}
@keyframes cueBob{ 0%,100%{transform:translateX(-50%) translateY(0);} 50%{transform:translateX(-50%) translateY(6px);} }
@media (prefers-reduced-motion: reduce){ .scroll-cue{animation:none;} }

/* ---------- PAGE HERO (subpage banner) ---------- */
.page-hero{position:relative;color:var(--on-dark);overflow:hidden;padding-block:calc(var(--sec-pad) * .62) calc(var(--sec-pad) * .78);}
.page-hero::before{
  content:"";position:absolute;inset:0;z-index:0;
  background:
    repeating-linear-gradient(120deg, rgba(238,242,247,.045) 0 2px, transparent 2px 30px),
    radial-gradient(ellipse at 82% 12%, rgba(212,175,55,.18), transparent 55%),
    linear-gradient(200deg,#060a10 0%, #0d1b2a 46%, #1c3552 84%, #3a5c85 100%);
}
.page-hero .wrap{position:relative;z-index:1;}
.page-hero .crumb{font-family:var(--font-mono);font-size:12px;color:var(--on-dark-muted);display:flex;align-items:center;gap:8px;margin-top:18px;}
.page-hero .crumb a{color:var(--on-dark-muted);transition:color .2s var(--ease);}
.page-hero .crumb a:hover{color:var(--accent);}
.page-hero h1{font-size:var(--fs-2xl);color:var(--on-dark);max-width:22ch;}
.page-hero p.lede{font-size:var(--fs-md);line-height:1.6;color:var(--on-dark-muted);max-width:56ch;margin:18px 0 0;}

/* ---------- STORY (feature cards) ---------- */
.story-head{display:grid;grid-template-columns:1.2fr .8fr;gap:30px;align-items:end;margin-bottom:44px;}
@media (max-width:760px){ .story-head{grid-template-columns:1fr;} }
.story-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.story-card{
  background:var(--surface);padding:30px 26px;display:flex;flex-direction:column;gap:14px;min-height:240px;
  border-radius:var(--r-md);border:1px solid var(--line);box-shadow:var(--shadow-sm);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease);
}
.story-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);border-color:transparent;}
.story-card svg{width:28px;height:28px;color:var(--accent);}
.story-card h3{font-size:17px;font-weight:600;line-height:1.32;}
.story-card .div{height:1px;background:var(--line);width:100%;}
.story-card p{font-size:13px;color:var(--text-muted);line-height:1.55;margin:0;flex:1;}
.story-card a{margin-top:auto;font-family:var(--font-mono);font-size:11px;color:var(--accent);letter-spacing:.04em;display:inline-flex;align-items:center;gap:6px;}
@media (max-width:900px){ .story-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){ .story-grid{grid-template-columns:1fr;} }

/* ---------- INQUIRE (form + side panel) ---------- */
.inquire{background:var(--surface);border-block:1px solid var(--line);}
.inquire-grid{display:grid;grid-template-columns:1.3fr .9fr;gap:0;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-sm);}
@media (max-width:860px){ .inquire-grid{grid-template-columns:1fr;} }
.inquire-form{padding:44px 40px;}
.inquire-side{background:var(--surface);color:var(--text);padding:48px 36px 40px;display:flex;flex-direction:column;justify-content:center;border-top:1px solid var(--line);}
@media (min-width:861px){ .inquire-side{border-top:none;border-left:1px solid var(--line);} }
.inquire-side h3{color:var(--text);font-size:21px;margin:16px 0 10px;}
.inquire-side p{color:var(--text-muted);font-size:14px;line-height:1.6;margin:0 0 24px;}
.field{display:flex;flex-direction:column;gap:8px;font-family:var(--font-mono);font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;}
.field input,.field select,.field textarea{
  font-family:var(--font-body);font-size:15px;padding:13px 16px;border:1px solid var(--line);background:var(--stone);color:var(--text);
  border-radius:var(--r-sm);transition:border-color .25s var(--ease),box-shadow .25s var(--ease);
}
.field textarea{resize:vertical;min-height:110px;font-family:var(--font-body);}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft);}
.form2{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
@media (max-width:480px){ .form2{grid-template-columns:1fr;} }

/* ---------- CAROUSEL (projects) ---------- */
.carousel{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;margin:0 -24px;padding-inline:24px;}
.carousel::-webkit-scrollbar{height:5px;}
.carousel::-webkit-scrollbar-thumb{background:var(--line);}
.carousel .card{flex:0 0 300px;scroll-snap-align:start;}
.carousel-nav{display:flex;gap:10px;}
.carousel-nav button{
  width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;color:var(--text);
}
.carousel-nav button:hover{border-color:var(--accent);color:var(--accent);}
.carousel-nav svg{width:15px;height:15px;}

/* ---------- INTERIOR GALLERY (2x2 small + one tall) ---------- */
.interior-grid{display:grid;grid-template-columns:1fr 1fr 1.7fr;grid-template-rows:repeat(2,150px);gap:12px;}
.interior-grid a:nth-child(1){grid-column:1/2;grid-row:1/2;}
.interior-grid a:nth-child(2){grid-column:2/3;grid-row:1/2;}
.interior-grid a:nth-child(3){grid-column:1/2;grid-row:2/3;}
.interior-grid a:nth-child(4){grid-column:2/3;grid-row:2/3;}
.interior-grid a:nth-child(5){grid-column:3/4;grid-row:1/3;}
.interior-grid a{display:block;border:1px solid var(--line);}
.interior-grid .photo{width:100%;height:100%;}
@media (max-width:760px){
  .interior-grid{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(3,150px);}
  .interior-grid a:nth-child(1){grid-column:1/2;grid-row:1/2;}
  .interior-grid a:nth-child(2){grid-column:2/3;grid-row:1/2;}
  .interior-grid a:nth-child(3){grid-column:1/2;grid-row:2/3;}
  .interior-grid a:nth-child(4){grid-column:2/3;grid-row:2/3;}
  .interior-grid a:nth-child(5){grid-column:1/3;grid-row:3/4;}
}

/* ---------- VISION SPLIT ---------- */
.vision{background:var(--ink);color:var(--on-dark);position:relative;overflow:hidden;}
.vision-watermark{
  position:absolute;bottom:-4%;left:0;right:0;text-align:center;font-family:var(--font-display);font-weight:600;
  font-size:clamp(60px,14vw,180px);color:rgba(239,233,217,.05);white-space:nowrap;pointer-events:none;line-height:1;letter-spacing:.02em;
}
.vision-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:56px;align-items:center;position:relative;z-index:1;}
@media (max-width:860px){ .vision-grid{grid-template-columns:1fr;} }
.vision-photo{aspect-ratio:4/5;border:1px solid rgba(239,233,217,.18);}
.vision h2{color:var(--on-dark);font-size:clamp(26px,3.4vw,38px);}
.vision-points{display:grid;grid-template-columns:1fr 1fr;gap:18px 28px;margin:26px 0 30px;}
@media (max-width:480px){ .vision-points{grid-template-columns:1fr;} }
.vision-point{display:flex;gap:14px;align-items:flex-start;}
.vision-point svg{width:20px;height:20px;color:var(--accent);flex:none;margin-top:2px;}
.vision-point b{display:block;color:var(--on-dark);font-size:14.5px;margin-bottom:2px;}
.vision-point span{color:var(--on-dark-muted);font-size:13.5px;line-height:1.5;}

/* ---------- EXPERIENCE SPLIT (services + stats) ---------- */
.exp{background:var(--stone);}
.exp-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:56px;align-items:center;}
@media (max-width:860px){ .exp-grid{grid-template-columns:1fr;} }
.exp-list{display:flex;flex-direction:column;margin-top:26px;}
.exp-list li{
  list-style:none;display:flex;align-items:center;gap:14px;padding:16px 18px;border-top:1px solid var(--line);
  font-size:15px;cursor:default;transition:color .25s var(--ease),background .25s var(--ease),border-radius .25s var(--ease);
  margin:0 -18px;border-radius:var(--r-sm);
}
.exp-list li:last-child{border-bottom:1px solid var(--line);}
.exp-list li:hover{background:var(--surface);border-top-color:transparent;}
.exp-list li .arrow{
  width:26px;height:26px;border-radius:50%;border:1px solid var(--line);flex:none;display:flex;align-items:center;justify-content:center;
  transition:background .2s ease,border-color .2s ease,transform .2s ease;
}
.exp-list li .arrow svg{width:12px;height:12px;color:var(--text-muted);}
.exp-list li span.t{flex:1;}
.exp-list li span.n{font-family:var(--font-mono);font-size:11px;color:var(--text-muted);}
.exp-list li:hover{color:var(--accent);}
.exp-list li:hover .arrow{background:var(--accent);border-color:var(--accent);transform:rotate(45deg);}
.exp-list li:hover .arrow svg{color:var(--ink);}

.exp-photo-wrap{position:relative;}
.exp-photo{aspect-ratio:16/12;position:relative;}
.exp-photo-wrap .overlay{
  position:relative;z-index:1;margin:-46px 24px 0 0;margin-inline-start:auto;width:min(260px,72%);
  background:rgba(15,13,10,.86);backdrop-filter:blur(8px);
  padding:18px 20px;font-size:13px;line-height:1.5;color:var(--on-dark-muted);border:1px solid rgba(239,233,217,.15);
  border-radius:var(--r-md);box-shadow:var(--shadow-lg);
}

.exp-stats-wrap{position:relative;margin-top:50px;overflow:hidden;}
.exp-stats-wm{
  position:absolute;bottom:-10%;left:0;right:0;text-align:center;font-family:var(--font-display);font-weight:600;
  font-size:clamp(50px,11vw,140px);color:rgba(24,21,16,.05);white-space:nowrap;pointer-events:none;line-height:1;
}
.exp-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;position:relative;z-index:1;border-top:1px solid var(--line);padding-top:28px;}
.exp-stats b{display:block;font-family:var(--font-display);font-size:clamp(26px,3.2vw,38px);font-weight:600;margin-bottom:6px;}
.exp-stats h4{font-size:14.5px;font-weight:700;margin:0 0 8px;}
.exp-stats p{font-family:var(--font-body);font-size:12.5px;color:var(--text-muted);line-height:1.55;margin:0;}
@media (max-width:700px){ .exp-stats{grid-template-columns:repeat(2,1fr);row-gap:32px;} }

/* ---------- HOW WE WORK 2 (photo cards) ---------- */
.how2-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:10px;}
@media (max-width:900px){ .how2-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){ .how2-grid{grid-template-columns:1fr;} }
.how2-card{
  border:1px solid var(--line);background:var(--surface);position:relative;overflow:hidden;border-radius:var(--r-md);
  box-shadow:var(--shadow-sm);transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease);
}
.how2-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);border-color:transparent;}
.how2-card .photo{aspect-ratio:4/3;}
.how2-card-body{padding:22px 20px 20px;position:relative;}
.how2-card h3{font-size:17px;margin:0 0 10px;font-weight:600;}
.how2-card h3 b{color:var(--accent);font-weight:600;}
.how2-card p{font-size:13px;color:var(--text-muted);line-height:1.5;margin:0;position:relative;z-index:1;}
.how2-card .ghost{
  position:absolute;left:14px;bottom:-14px;font-family:var(--font-display);font-weight:600;font-size:64px;
  color:var(--line);opacity:.55;line-height:1;pointer-events:none;z-index:0;
}

/* ---------- TESTIMONIAL 2 (rating) ---------- */
.testi2{background:var(--stone-deep);}
.testi2-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:50px;align-items:center;}
@media (max-width:860px){ .testi2-grid{grid-template-columns:1fr;} }
.rating-badge{display:flex;align-items:center;gap:10px;margin-bottom:20px;font-family:var(--font-mono);font-size:12.5px;color:var(--text-muted);}
.rating-badge b{font-family:var(--font-display);font-size:26px;color:var(--text);font-weight:600;}
.testi2-photo{aspect-ratio:4/3;}

/* ---------- LOGOS ---------- */
.logos-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;padding-block:40px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.logos-row span{font-family:var(--font-mono);font-size:13.5px;letter-spacing:.1em;color:var(--text-muted);text-transform:uppercase;opacity:.7;}

/* ---------- VIDEO CTA ---------- */
.video-cta{position:relative;aspect-ratio:21/9;min-height:280px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;border-radius:0;}
.video-cta h2{color:var(--on-dark);position:relative;z-index:1;font-size:clamp(22px,3.2vw,34px);text-align:center;max-width:20ch;}
.video-cta .play-btn{position:relative;z-index:1;width:64px;height:64px;}
.video-cta .play-btn svg{width:20px;height:20px;}

/* ---------- ARTICLES ---------- */
.art-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
@media (max-width:860px){ .art-grid{grid-template-columns:1fr;} }
.art-card .photo{aspect-ratio:16/10;position:relative;}
.art-tag{
  position:absolute;z-index:1;top:14px;left:14px;font-family:var(--font-body);font-weight:700;font-size:11px;letter-spacing:.03em;
  color:var(--ink);background:var(--accent);padding:6px 13px;border-radius:20px;
}
.art-byline{font-family:var(--font-mono);font-size:10.5px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin:18px 0 8px;}
.art-byline b{color:var(--text);}
.art-card h3{font-size:17px;line-height:1.38;margin-bottom:8px;}
.art-card h3 em{font-style:normal;color:var(--accent);}
.art-card .art-excerpt{font-size:13px;color:var(--text-muted);line-height:1.55;margin:0;}

/* ---------- NEWSLETTER ---------- */
.newsletter{background:var(--surface);border-top:1px solid var(--line);text-align:center;}
.newsletter h2{font-size:clamp(24px,3.4vw,36px);max-width:22ch;margin:0 auto;}
.newsletter p{color:var(--text-muted);max-width:48ch;margin:16px auto 30px;font-size:14.5px;line-height:1.6;}
.newsletter-form{display:flex;max-width:440px;margin:0 auto;border-bottom:1px solid var(--text);}
.newsletter-form input{
  flex:1;border:none;background:none;font-family:var(--font-body);font-size:15px;padding:12px 4px;color:var(--text);
}
.newsletter-form input:focus{outline:none;}
.newsletter-form button{background:none;border:none;cursor:pointer;color:var(--accent);display:flex;align-items:center;padding:8px;}
.newsletter-form button svg{width:20px;height:20px;}

/* ---------- PILL TAG (section eyebrow badge) ---------- */
.pill-tag{
  display:inline-flex;align-items:center;gap:8px;font-family:var(--font-body);font-weight:700;font-size:12px;
  letter-spacing:.06em;text-transform:uppercase;color:var(--text);border:1px solid var(--line);border-radius:30px;
  padding:9px 18px;flex:none;white-space:nowrap;
}
.pill-tag::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent);}
.pill-tag--dark{color:var(--on-dark);border-color:rgba(239,233,217,.3);}
.pill-tag--solid{background:var(--ink);color:var(--on-dark);border-color:var(--ink);}
.pill-tag--solid::after{display:none;}

.section-head2{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:44px;flex-wrap:wrap;}
.section-head2 h2{font-size:clamp(24px,3.4vw,38px);max-width:18ch;}
@media (max-width:700px){ .section-head2{flex-direction:column-reverse;align-items:flex-start;} }

/* ---------- PRODUCT DETAIL PAGE ---------- */
.pd-meta-row{display:flex;flex-wrap:wrap;justify-content:center;border-bottom:1px solid var(--line);padding-bottom:30px;margin-bottom:38px;}
.pd-meta-item{flex:1 1 170px;max-width:220px;text-align:center;padding:0 22px;position:relative;}
.pd-meta-item + .pd-meta-item::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:1px;background:var(--line);}
.pd-meta-item h3{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-muted);margin:0 0 10px;}
.pd-meta-item p{font-size:15px;font-weight:600;color:var(--text);margin:0;line-height:1.4;}

.pd-main-image{width:100%;height:clamp(320px,48vw,620px);border-radius:var(--r-md);overflow:hidden;margin-bottom:40px;background:var(--ink);box-shadow:var(--shadow-md);}
.pd-main-image img{width:100%;height:100%;object-fit:cover;display:block;}

.pd-section-centered{max-width:74ch;margin:0 auto 40px;text-align:center;}
.pd-section-centered h2{font-size:clamp(22px,3vw,32px);margin-bottom:16px;}
.pd-section-centered p{color:var(--text-muted);font-size:15px;line-height:1.75;}
.pd-section-centered + .pd-section-centered{margin-top:8px;}

.pd-gallery-head{text-align:center;margin:52px 0 24px;}
.pd-gallery-head h2{font-size:clamp(20px,2.6vw,28px);}
.pd-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;margin-bottom:44px;}
.pd-gallery .photo{aspect-ratio:4/3;border-radius:var(--r-md);}

@media (max-width:600px){
  .pd-meta-row{gap:18px 0;padding-bottom:22px;margin-bottom:26px;}
  .pd-meta-item{flex:1 1 45%;max-width:none;padding:0 14px 10px;}
  .pd-meta-item:nth-child(odd)::before{display:none;}
  .pd-main-image{height:220px;margin-bottom:24px;}
  .pd-section-centered{margin-bottom:28px;}
  .pd-gallery{grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:32px;}
}

/* ---------- MAP PANEL (illustrated, contact page) ---------- */
.map-panel{position:relative;aspect-ratio:16/11;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-sm);background:var(--stone-deep);}
.map-panel svg{width:100%;height:100%;display:block;}
.map-panel .map-tag{
  position:absolute;top:14px;left:14px;z-index:1;font-family:var(--font-mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;
  background:color-mix(in srgb, var(--surface) 88%, transparent);backdrop-filter:blur(6px);padding:7px 14px;border-radius:20px;color:var(--text);
}
.map-panel .map-cap{
  position:absolute;bottom:14px;left:14px;z-index:1;font-family:var(--font-mono);font-size:11.5px;color:var(--on-dark);
  background:rgba(15,13,10,.72);backdrop-filter:blur(6px);padding:9px 16px;border-radius:var(--r-sm);
}

/* ---------- FIXED CORNER CHROME ---------- */
.float-wa{
  position:fixed;z-index:60;right:22px;bottom:22px;width:52px;height:52px;border-radius:50%;background:#22c55e;
  display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(0,0,0,.25);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.float-wa:hover{transform:scale(1.08) translateY(-2px);box-shadow:0 14px 28px rgba(0,0,0,.3);}
.float-wa svg{width:24px;height:24px;color:#fff;}
.float-top{
  position:fixed;z-index:60;left:22px;bottom:22px;width:44px;height:44px;border-radius:50%;background:var(--surface);
  border:1px solid var(--line);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;
  transition:opacity .3s var(--ease),transform .3s var(--ease),box-shadow .3s var(--ease);box-shadow:var(--shadow-sm);
}
.float-top:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);}
.float-top.show{opacity:1;pointer-events:auto;}
.float-top svg{width:16px;height:16px;color:var(--text);}
@media (max-width:640px){ .float-wa{right:14px;bottom:14px;width:46px;height:46px;} .float-top{left:14px;bottom:14px;width:38px;height:38px;} }

/* ---------- RTL SUPPORT (Arabic) ---------- */
[dir="rtl"]{
  direction:rtl;
  text-align:right;
  font-family:'Segoe UI', Tahoma, Arial, sans-serif;
}
[dir="rtl"] .navlinks,
[dir="rtl"] .navcta,
[dir="rtl"] nav.wrap,
[dir="rtl"] .hero2-cta,
[dir="rtl"] .foot-top,
[dir="rtl"] .stats-grid,
[dir="rtl"] .proj-grid,
[dir="rtl"] .art-grid,
[dir="rtl"] .story-grid,
[dir="rtl"] .interior-grid,
[dir="rtl"] .how2-grid,
[dir="rtl"] .exp-grid,
[dir="rtl"] .vision-grid,
[dir="rtl"] .section-head2,
[dir="rtl"] .card-foot,
[dir="rtl"] .row-actions{
  direction:rtl;
}
[dir="rtl"] .crumb{flex-direction:row-reverse;justify-content:flex-end;}
[dir="rtl"] .exp-list li{flex-direction:row-reverse;text-align:right;}
[dir="rtl"] .lang-menu{right:auto;left:0;}
[dir="rtl"] .float-wa{right:auto;left:22px;}
[dir="rtl"] .float-top{left:auto;right:22px;}
[dir="rtl"] input,[dir="rtl"] textarea,[dir="rtl"] select{text-align:right;}
[dir="rtl"] .mobile-menu{direction:rtl;text-align:right;}