/* ═══════════════════════════════════════════
   TOKENS
═══════════════════════════════════════════ */
:root {
  --bg:             #F4EFE6;
  --bg-alt:         #EDE7DA;
  --dark:           #1D1A15;
  --card:           #FDFAF5;
  --ink:            #1D1A15;
  --ink-2:          #6B6456;
  --ink-3:          #9E9286;
  --terra:          #C0522A;
  --terra-bg:       #F5E5DC;
  --teal:           #2A7A6E;
  --teal-bg:        #DDF0EC;
  --cream:          #EDE7DA;
  --border:         #DDD7CC;
  --nav-bg:         rgba(244,239,230,0.93);
  --outline-border: #3A362E;
  --outline-hover:  #2A2720;
  --heading-font:   'Playfair Display', Georgia, serif;
  --t:              0.28s;
}
[data-theme="dark"] {
  --bg:       #1C1814; --bg-alt: #231F1A; --dark: #0D0B09;
  --card:     #252017; --ink: #EDE7DA; --ink-2: #A0978D; --ink-3: #6B6456;
  --terra:    #D0633A; --terra-bg: #3A1A0D;
  --teal:     #3A9484; --teal-bg: #0F2926;
  --cream:    #EDE7DA; --border: #302A22;
  --nav-bg:   rgba(20,17,13,0.93);
  --outline-border: #3A362E; --outline-hover: #2A2720;
}
[data-accent="teal"]                     { --terra:#2A7A6E; --terra-bg:#DDF0EC; }
[data-theme="dark"][data-accent="teal"]  { --terra:#3A9484; --terra-bg:#0F2926; }
[data-accent="amber"]                    { --terra:#A06B10; --terra-bg:#F5E9D0; }
[data-theme="dark"][data-accent="amber"] { --terra:#C8830A; --terra-bg:#2A1F08; }
[data-typo="code"]   { --heading-font:'JetBrains Mono',monospace; }
[data-typo="modern"] { --heading-font:'DM Sans',-apple-system,sans-serif; }

/* ═══════════════════════════════════════════
   BASE
═══════════════════════════════════════════ */
*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
img  { max-width:100%; height:auto; display:block; }
a    { color:inherit; text-decoration:none; }
button { font-family:inherit; cursor:pointer; border:none; }
body {
  font-family:'DM Sans',-apple-system,sans-serif;
  background:var(--bg); color:var(--ink);
  overflow-x:hidden;
  transition:background var(--t), color var(--t);
}
[dir="rtl"] body { font-family:'Heebo',-apple-system,sans-serif; }

/* Lang visibility */
html[lang="ru"] .en, html[lang="ru"] .he { display:none !important; }
html[lang="en"] .ru, html[lang="en"] .he { display:none !important; }
html[lang="he"] .ru, html[lang="he"] .en { display:none !important; }

/* RTL overrides */
[dir="rtl"] .proj-note { border-left:none; padding-left:0; border-right:2.5px solid var(--teal); padding-right:12px; }
[dir="rtl"] body { font-family:'Heebo',-apple-system,sans-serif; }
[dir="rtl"] .section-title { font-family:'Heebo',Georgia,sans-serif; font-weight:700; }
[dir="rtl"] .hero-tagline p { letter-spacing:0; line-height:1.5; }
[dir="rtl"] .contact-val { direction:ltr; }
[dir="rtl"] .tl-connector { transform:scaleX(-1); }

/* ═══════════════════════════════════════════
   CUSTOM CURSOR
═══════════════════════════════════════════ */
.cursor-dot {
  position:fixed; width:10px; height:10px;
  background:var(--terra); border-radius:50%;
  pointer-events:none; z-index:9999;
  transform:translate(-50%,-50%);
  transition:background var(--t), transform 0.12s, opacity 0.2s;
  will-change:transform;
  mix-blend-mode:multiply;
}
[data-theme="dark"] .cursor-dot { mix-blend-mode:screen; }
.cursor-dot.big { transform:translate(-50%,-50%) scale(3.5); opacity:0.35; }
@media (hover:none) { .cursor-dot { display:none; } }

/* ═══════════════════════════════════════════
   SCROLL ANIMATIONS
═══════════════════════════════════════════ */
[data-anim] {
  opacity:0;
  transform:translateY(24px);
  transition:opacity 0.6s cubic-bezier(.22,.68,0,1.2), transform 0.6s cubic-bezier(.22,.68,0,1.2);
}
[data-anim].visible { opacity:1; transform:translateY(0); }
[data-anim="left"]  { transform:translateX(-28px); }
[data-anim="left"].visible { transform:translateX(0); }
[data-anim="right"] { transform:translateX(28px); }
[data-anim="right"].visible { transform:translateX(0); }
[data-anim="scale"] { transform:scale(0.94); }
[data-anim="scale"].visible { transform:scale(1); }

/* ═══════════════════════════════════════════
   NAV
═══════════════════════════════════════════ */
nav {
  position:sticky; top:0; z-index:100;
  background:var(--nav-bg);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border);
  transition:background var(--t), border-color var(--t);
}
.nav-inner {
  max-width:1160px; margin:0 auto; padding:0 40px;
  display:flex; align-items:center; justify-content:space-between; height:64px;
}
.nav-left { display:flex; align-items:center; gap:14px; }
#logo-link {
  display:inline-flex; align-items:center;
  transition:transform 0.3s cubic-bezier(.22,.68,0,1.2);
}
#logo-link:hover { transform:translateY(-2px) scale(1.04); }
.logo-img {
  display:block; height:32px; aspect-ratio:899.77/290.68;
  -webkit-mask:url('assets/l41_text.svg') no-repeat left center/contain;
  mask:url('assets/l41_text.svg') no-repeat left center/contain;
  background-color:#000;
}
[data-theme="dark"] .logo-img { background-color:#F2E7D8; }
.avail-badge {
  display:flex; align-items:center; gap:6px;
  padding:4px 10px; border-radius:99px;
  border:1px solid rgba(34,160,90,0.3);
  background:rgba(34,160,90,0.08);
  font-size:12px; font-weight:500; color:#22a05a;
  white-space:nowrap;
}
.avail-dot {
  width:7px; height:7px; border-radius:50%;
  background:#22a05a;
  animation:pulse-dot 2s ease-in-out infinite;
}
@keyframes pulse-dot {
  0%,100% { box-shadow:0 0 0 0 rgba(34,160,90,0.4); }
  50%      { box-shadow:0 0 0 5px rgba(34,160,90,0); }
}
.lang-btn {
  padding:6px 11px; font-size:12px; font-weight:500;
  background:transparent; color:var(--ink-2);
  transition:background 0.15s, color 0.15s;
}
.lang-btn.active { background:var(--dark); color:var(--cream); }
.lang-wrap {
  display:flex; align-items:center;
  border:1px solid var(--border); border-radius:7px; overflow:hidden;
}
.lang-sep { width:1px; background:var(--border); align-self:stretch; }
.nav-cta {
  background:var(--terra); color:white;
  padding:9px 22px; border-radius:7px;
  font-size:14px; font-weight:500; white-space:nowrap;
  transition:opacity 0.15s, background var(--t);
}
.nav-cta:hover { opacity:0.85; }
@media (max-width:700px) { .avail-badge { display:none; } }

/* ═══════════════════════════════════════════
   HERO
═══════════════════════════════════════════ */
.hero { background:var(--dark); position:relative; overflow:hidden; }
.hero-grid {
  position:absolute; inset:0; pointer-events:none; opacity:0.033;
  background-image:linear-gradient(var(--cream) 1px,transparent 1px),linear-gradient(90deg,var(--cream) 1px,transparent 1px);
  background-size:54px 54px;
}
.hero-glow {
  position:absolute; top:-180px; left:50%; transform:translateX(-50%);
  width:760px; height:540px; pointer-events:none;
  background:radial-gradient(ellipse,rgba(192,82,42,0.11) 0%,transparent 68%);
}
.hero-inner {
  position:relative; max-width:1160px; margin:0 auto; padding:88px 40px;
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:36px;
}
.hero-logo-card {
  background:var(--cream); border-radius:20px; padding:22px 40px;
  display:inline-flex; align-items:center; justify-content:center;
  box-shadow:0 2px 0 #CFC9BC, 0 10px 48px rgba(0,0,0,0.38);
  border:1px solid #D8D2C4;
  transition:transform 0.3s, box-shadow 0.3s;
  cursor:default; position:relative;
}
.hero-logo-card:hover { transform:translateY(-4px) scale(1.015); box-shadow:0 6px 0 #CFC9BC, 0 20px 60px rgba(0,0,0,0.44); }
.egg-tooltip {
  position:absolute; bottom:calc(100% + 10px); left:50%; transform:translateX(-50%) scale(0.92);
  background:var(--dark); color:var(--cream); border:1px solid #3A362E;
  padding:7px 16px; border-radius:8px; font-size:13px; font-weight:500;
  white-space:nowrap; pointer-events:none;
  opacity:0; transition:opacity 0.18s, transform 0.18s;
}
.egg-tooltip::after {
  content:''; position:absolute; top:100%; left:50%; transform:translateX(-50%);
  border:5px solid transparent; border-top-color:var(--dark);
}
.hero-logo-card:hover .egg-tooltip { opacity:1; transform:translateX(-50%) scale(1); }
.hero-tagline { max-width:660px; }
.hero-tagline p {
  font-family:var(--heading-font);
  font-size:clamp(22px,3.2vw,42px); font-weight:400; color:var(--cream);
  line-height:1.38; letter-spacing:-0.01em; text-wrap:pretty;
  clip-path:inset(0 100% 0 0);
  animation:text-reveal 1.4s cubic-bezier(0.77,0,0.175,1) 0.4s forwards;
}
[dir="rtl"] .hero-tagline p { clip-path:inset(0 0 0 100%); animation-name:text-reveal-rtl; letter-spacing:0; line-height:1.5; }
@keyframes text-reveal     { to { clip-path:inset(0 0% 0 0); } }
@keyframes text-reveal-rtl { to { clip-path:inset(0 0 0 0%); } }
.hero-tagline small {
  display:block; margin-top:14px;
  font-size:12.5px; color:var(--ink-3);
  letter-spacing:0.14em; text-transform:uppercase; font-weight:300;
  opacity:0; animation:fade-up 0.6s ease 1.7s forwards;
}
@keyframes fade-up { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }
.hero-actions {
  display:flex; gap:12px; flex-wrap:wrap; justify-content:center;
  opacity:0; animation:fade-up 0.6s ease 1.9s forwards;
}
.socials {
  display:flex; gap:22px; align-items:center; padding-top:4px;
  opacity:0; animation:fade-up 0.6s ease 2.1s forwards;
}
.btn-primary {
  background:var(--terra); color:white;
  padding:14px 34px; border-radius:8px; font-size:16px; font-weight:500;
  display:inline-flex; align-items:center; gap:8px;
  transition:opacity 0.16s, transform 0.16s, background var(--t);
}
.btn-primary:hover { opacity:0.88; transform:translateY(-1px); }
.btn-outline {
  background:transparent; color:var(--cream);
  border:1.5px solid var(--outline-border);
  padding:14px 34px; border-radius:8px; font-size:16px; font-weight:500;
  display:inline-flex; align-items:center;
  transition:background 0.16s, transform 0.16s;
}
.btn-outline:hover { background:var(--outline-hover); transform:translateY(-1px); }
.social-link {
  display:flex; align-items:center; gap:7px;
  color:var(--ink-3); font-size:14px;
  transition:color 0.15s, transform 0.15s;
}
.social-link:hover { color:var(--terra); transform:translateY(-2px); }

/* ═══════════════════════════════════════════
   STATS STRIP
═══════════════════════════════════════════ */
.stats-strip {
  background:var(--dark); border-top:1px solid rgba(255,255,255,0.06);
  padding:32px 40px;
}
.stats-inner {
  max-width:1160px; margin:0 auto;
  display:grid; grid-template-columns:repeat(4,1fr); gap:8px;
}
.stat-item {
  text-align:center; padding:16px 8px;
  border-right:1px solid rgba(255,255,255,0.07);
}
.stat-item:last-child { border-right:none; }
.stat-num {
  font-family:'Playfair Display',Georgia,serif;
  font-size:clamp(32px,4vw,52px); font-weight:700;
  color:var(--terra); line-height:1;
  transition:color var(--t);
}
[dir="rtl"] .stat-num { font-family:'Heebo',sans-serif; }
.stat-label { margin-top:8px; font-size:13px; color:rgba(237,231,218,0.6); font-weight:300; }
@media (max-width:600px) {
  .stats-strip { padding:24px 18px; }
  .stats-inner { grid-template-columns:1fr 1fr; }
  .stat-item:nth-child(2) { border-right:none; }
  .stat-item:nth-child(3) { border-top:1px solid rgba(255,255,255,0.07); }
  .stat-item:nth-child(4) { border-top:1px solid rgba(255,255,255,0.07); border-right:none; }
}

/* ═══════════════════════════════════════════
   SECTION SHELL
═══════════════════════════════════════════ */
.section { padding:88px 0; }
.section-inner { max-width:1160px; margin:0 auto; padding:0 40px; }
.section-head { text-align:center; margin-bottom:54px; }
.section-ornament { display:flex; align-items:center; justify-content:center; gap:10px; margin-bottom:16px; }
.orn-line { width:34px; height:1px; background:var(--terra); transition:background var(--t); }
.orn-diamond { width:7px; height:7px; background:var(--terra); transform:rotate(45deg); flex-shrink:0; transition:background var(--t); }
.section-title { font-family:var(--heading-font); font-size:clamp(24px,2.8vw,40px); font-weight:500; }

/* ═══════════════════════════════════════════
   SERVICES
═══════════════════════════════════════════ */
.svc-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.svc-card {
  background:var(--card); border:1px solid var(--border); border-radius:14px;
  padding:30px 22px; display:flex; flex-direction:column; gap:16px;
  transition:box-shadow 0.18s, transform 0.18s, var(--t);
}
.svc-card:hover { box-shadow:0 8px 28px rgba(0,0,0,0.09); transform:translateY(-2px); }
.svc-icon { width:46px; height:46px; border-radius:10px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.svc-card h3 { font-family:var(--heading-font); font-size:17px; font-weight:500; margin-bottom:8px; line-height:1.3; }
[dir="rtl"] .svc-card h3 { font-family:'Heebo',sans-serif; font-weight:700; }
.svc-card p { font-size:13.5px; color:var(--ink-2); line-height:1.65; }

/* ═══════════════════════════════════════════
   HOW WE WORK TIMELINE
═══════════════════════════════════════════ */
.tl-wrap {
  display:grid; grid-template-columns:repeat(5,1fr);
  gap:0; position:relative;
}
.tl-step {
  display:flex; flex-direction:column; align-items:center; text-align:center;
  padding:0 12px; position:relative;
}
.tl-step:not(:last-child)::after {
  content:'';
  position:absolute; top:28px; left:calc(50% + 28px); right:calc(-50% + 28px);
  height:2px; background:linear-gradient(90deg,var(--terra),var(--teal));
  opacity:0.3;
}
[dir="rtl"] .tl-step:not(:last-child)::after {
  left:calc(-50% + 28px); right:calc(50% + 28px);
  background:linear-gradient(270deg,var(--terra),var(--teal));
}
.tl-circle {
  width:56px; height:56px; border-radius:50%;
  border:2px solid var(--border); background:var(--card);
  display:flex; align-items:center; justify-content:center;
  font-family:'JetBrains Mono',monospace; font-size:13px; font-weight:500;
  color:var(--terra); flex-shrink:0; margin-bottom:16px;
  transition:border-color 0.2s, background 0.2s, transform 0.2s, var(--t);
  position:relative; z-index:1;
}
.tl-step:hover .tl-circle { border-color:var(--terra); background:var(--terra-bg); transform:scale(1.08); }
.tl-icon { margin-bottom:10px; color:var(--teal); }
.tl-title { font-family:var(--heading-font); font-size:15px; font-weight:500; margin-bottom:8px; line-height:1.3; }
[dir="rtl"] .tl-title { font-family:'Heebo',sans-serif; font-weight:700; }
.tl-desc { font-size:12.5px; color:var(--ink-2); line-height:1.6; }

@media (max-width:900px) {
  .tl-wrap { grid-template-columns:1fr; gap:0; }
  .tl-step { flex-direction:row; text-align:left; padding:20px 0; gap:16px; align-items:flex-start; }
  [dir="rtl"] .tl-step { text-align:right; }
  .tl-step:not(:last-child)::after {
    top:auto; left:27px; right:auto;
    width:2px; height:40px;
    bottom:-20px; background:linear-gradient(180deg,var(--terra),var(--teal));
  }
  [dir="rtl"] .tl-step:not(:last-child)::after { left:auto; right:27px; }
  .tl-circle { margin-bottom:0; flex-shrink:0; }
  .tl-icon { display:none; }
}

/* ═══════════════════════════════════════════
   PROJECT FILTER
═══════════════════════════════════════════ */
.filter-bar {
  display:flex; gap:8px; flex-wrap:wrap; justify-content:center;
  margin-bottom:36px;
}
.filter-btn {
  padding:7px 18px; border-radius:99px;
  border:1px solid var(--border); background:transparent;
  color:var(--ink-2); font-size:13px; font-weight:500;
  transition:border-color 0.15s, background 0.15s, color 0.15s, var(--t);
  cursor:pointer;
}
.filter-btn:hover { border-color:var(--terra); color:var(--terra); }
.filter-btn.active { background:var(--terra); border-color:var(--terra); color:white; }

/* ═══════════════════════════════════════════
   PROJECTS
═══════════════════════════════════════════ */
.proj-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.project-card {
  background:var(--card); border:1px solid var(--border); border-radius:14px;
  overflow:hidden; display:flex; flex-direction:column;
  transition:transform 0.2s, box-shadow 0.2s, var(--t);
}
.project-card.hidden { display:none; }
.project-card:hover { transform:translateY(-3px); box-shadow:0 14px 44px rgba(0,0,0,0.13); }
.proj-header {
  background:var(--dark); padding:17px 22px;
  display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
  transition:background var(--t);
}
.proj-title-row { display:flex; align-items:center; gap:7px; min-width:0; flex:1; }
.proj-title { font-family:var(--heading-font); font-size:17px; font-weight:500; color:var(--cream); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.proj-link { color:var(--terra); display:flex; align-items:center; flex-shrink:0; transition:color var(--t); }
.proj-badge { background:var(--terra); color:white; padding:3px 10px; border-radius:4px; font-size:10.5px; font-weight:500; white-space:nowrap; flex-shrink:0; letter-spacing:0.02em; transition:background var(--t); }
.proj-body { padding:20px 22px; display:flex; flex-direction:column; gap:12px; flex:1; }
.proj-desc { font-size:14px; color:var(--ink); line-height:1.65; }
.proj-note { font-size:13px; color:var(--ink-2); line-height:1.6; padding-left:12px; border-left:2.5px solid var(--teal); font-style:italic; transition:border-color var(--t); }
.proj-tags { display:flex; flex-wrap:wrap; gap:5px; margin-top:2px; }
.tag { background:var(--bg-alt); border:1px solid var(--border); color:var(--ink-2); padding:3px 9px; border-radius:4px; font-family:'JetBrains Mono',monospace; font-size:11px; transition:var(--t); }

/* ═══════════════════════════════════════════
   TECH STACK
═══════════════════════════════════════════ */
.stack-group { display:flex; flex-direction:column; gap:14px; }
.stack-row { display:flex; align-items:flex-start; gap:16px; padding:18px 22px; background:var(--card); border:1px solid var(--border); border-radius:12px; transition:var(--t); }
.stack-lbl { font-size:11.5px; font-weight:500; color:var(--terra); letter-spacing:0.1em; text-transform:uppercase; min-width:130px; padding-top:4px; flex-shrink:0; transition:color var(--t); }
[dir="rtl"] .stack-lbl { letter-spacing:0; }
.stack-tags { display:flex; flex-wrap:wrap; gap:6px; }
.stack-tag { background:var(--bg-alt); border:1px solid var(--border); color:var(--ink-2); padding:4px 11px; border-radius:5px; font-family:'JetBrains Mono',monospace; font-size:12px; transition:var(--t); }

/* ═══════════════════════════════════════════
   CONTACT FORM + LINKS
═══════════════════════════════════════════ */
.contact-layout { max-width:620px; margin:0 auto; display:flex; flex-direction:column; gap:32px; }
.contact-grid { display:flex; flex-direction:column; gap:10px; }
.contact-row {
  background:var(--card); border:1px solid var(--border); border-radius:12px;
  padding:16px 20px; display:flex; align-items:center; gap:14px;
  transition:border-color 0.15s, var(--t);
}
.contact-row:hover { border-color:var(--terra); }
.contact-icon { width:38px; height:38px; border-radius:9px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.contact-lbl { font-size:12px; color:var(--ink-3); margin-bottom:2px; }
.contact-val { font-size:14.5px; font-weight:500; color:var(--ink); direction:ltr; }

/* ═══════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════ */
footer { background:var(--dark); text-align:center; padding:26px 20px; color:var(--ink-3); font-size:13px; transition:background var(--t); }

/* ═══════════════════════════════════════════
   TWEAKS PANEL
═══════════════════════════════════════════ */
#tweaks-trigger {
  position:fixed; bottom:28px; right:28px; z-index:200;
  width:44px; height:44px; border-radius:50%;
  background:var(--terra); color:white;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 20px rgba(0,0,0,0.22);
  border:none; cursor:pointer;
  transition:background var(--t), transform 0.18s, box-shadow 0.18s;
}
#tweaks-trigger:hover { transform:scale(1.08); box-shadow:0 6px 28px rgba(0,0,0,0.3); }
[dir="rtl"] #tweaks-trigger { right:auto; left:28px; }
#tweaks-panel {
  position:fixed; bottom:84px; right:28px; z-index:200;
  width:252px; background:var(--card);
  border:1px solid var(--border); border-radius:16px; padding:20px;
  box-shadow:0 12px 48px rgba(0,0,0,0.18);
  display:flex; flex-direction:column; gap:20px;
  transform:translateY(8px) scale(0.97);
  opacity:0; pointer-events:none;
  transition:opacity 0.2s, transform 0.2s, var(--t);
}
#tweaks-panel.open { opacity:1; pointer-events:auto; transform:translateY(0) scale(1); }
[dir="rtl"] #tweaks-panel { right:auto; left:28px; }
.tweak-group { display:flex; flex-direction:column; gap:10px; }
.tweak-label { font-size:10.5px; font-weight:600; color:var(--ink-3); letter-spacing:0.12em; text-transform:uppercase; }
[dir="rtl"] .tweak-label { letter-spacing:0; }
.tweak-seg { display:flex; border:1px solid var(--border); border-radius:8px; overflow:hidden; }
.tweak-seg button { flex:1; padding:7px 4px; font-size:12.5px; font-weight:500; background:transparent; color:var(--ink-2); border:none; cursor:pointer; transition:background 0.15s,color 0.15s; }
.tweak-seg button.active { background:var(--dark); color:var(--cream); }
.tweak-seg button+button { border-left:1px solid var(--border); }
.tweak-swatches { display:flex; gap:8px; }
.swatch { width:36px; height:36px; border-radius:8px; cursor:pointer; border:2.5px solid transparent; transition:transform 0.15s,border-color 0.15s; flex-shrink:0; }
.swatch:hover { transform:scale(1.1); }
.swatch.active { border-color:var(--ink); }
.swatch-terra { background:#C0522A; } .swatch-teal { background:#2A7A6E; } .swatch-amber { background:#A06B10; }
.tweak-type { display:flex; gap:6px; }
.type-btn { flex:1; padding:9px 6px; border-radius:8px; border:1.5px solid var(--border); background:transparent; color:var(--ink); cursor:pointer; text-align:center; line-height:1.2; transition:border-color 0.15s,background 0.15s; }
.type-btn:hover { background:var(--bg-alt); }
.type-btn.active { border-color:var(--terra); background:var(--terra-bg); }
.type-btn .type-label { font-size:10px; color:var(--ink-3); display:block; margin-top:3px; }
.type-btn .type-preview-classic { font-family:'Playfair Display',serif; font-size:18px; }
.type-btn .type-preview-code    { font-family:'JetBrains Mono',monospace; font-size:13px; font-weight:500; }
.type-btn .type-preview-modern  { font-family:'DM Sans',sans-serif; font-size:17px; font-weight:600; letter-spacing:-0.02em; }
.tweaks-title { font-size:12px; font-weight:600; color:var(--ink-2); padding-bottom:14px; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
.tweaks-close { width:22px; height:22px; border-radius:50%; background:var(--bg-alt); border:none; color:var(--ink-3); font-size:14px; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:background 0.15s; }
.tweaks-close:hover { background:var(--border); }

/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media (max-width:900px) {
  .svc-grid { grid-template-columns:1fr 1fr; }
  .proj-grid { grid-template-columns:1fr; }
}
@media (max-width:600px) {
  .svc-grid { grid-template-columns:1fr; }
  .nav-inner { padding:0 18px; }
  .section-inner { padding:0 18px; }
  .hero-inner { padding:52px 18px; }
  .hero-actions { flex-direction:column; align-items:stretch; }
  .hero-actions a { justify-content:center; }
  .stack-row { flex-direction:column; gap:10px; }
  .stack-lbl { min-width:unset; }
  .socials { gap:14px; }
  #tweaks-trigger { bottom:20px; right:20px; }
  [dir="rtl"] #tweaks-trigger { right:auto; left:20px; }
  #tweaks-panel { right:20px; bottom:76px; width:calc(100vw - 40px); }
  [dir="rtl"] #tweaks-panel { right:auto; left:20px; }
}