:root {
  --bg: #ffffff;
  --surface: #ffffff;
  --surface-soft: #f8f7f4;
  --surface-warm: #f3efe9;
  --line: #e9e5df;
  --text: #171717;
  --muted: #75716d;
  --accent: #a98b6d;
  --accent-soft: #efe7de;
  --radius-xl: 34px;
  --radius-lg: 26px;
  --radius-md: 20px;
  --shadow: 0 14px 38px rgba(39, 31, 24, .055);
  --shell: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: Dana, "Dana", Tahoma, Arial, sans-serif;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { display:block; width:100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
svg { width: 1em; height: 1em; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }

.shell { width: min(calc(100% - 40px), var(--shell)); margin-inline: auto; }
.card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(233,229,223,.75);
}
.nav-wrap {
  height: 82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  direction:ltr;
}
.brand { display:flex; flex-direction:column; gap:1px; direction:ltr; }
.brand strong { font-size:18px; line-height:1.25; letter-spacing:-.02em; font-weight:700; }
.brand small { font-size:11px; color:var(--muted); letter-spacing:.01em; }
.desktop-nav { direction:rtl; display:flex; align-items:center; gap:8px; }
.desktop-nav a { font-size:14px; padding:10px 14px; border-radius:999px; transition:.2s ease; }
.desktop-nav a:hover { background:var(--surface-soft); }
.menu-toggle { display:none; border:0; background:transparent; width:44px; height:44px; padding:10px; border-radius:14px; }
.menu-toggle span { display:block; height:2px; background:#1c1c1c; margin:5px 0; border-radius:2px; }
.mobile-menu { padding: 8px 0 18px; display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.mobile-menu[hidden] { display:none; }
.mobile-menu a { padding:12px 14px; border-radius:14px; background:var(--surface-soft); text-align:center; font-size:14px; }

.hero { padding-top: 34px; }
.hero-grid { display:grid; grid-template-columns: .88fr 1.12fr; gap:18px; align-items:stretch; direction:ltr; }
.hero-copy {
  direction:rtl;
  min-height:560px;
  padding:54px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  background: linear-gradient(145deg, #fff 0%, #fff 62%, #faf8f5 100%);
}
.hero-kicker { color:var(--accent); font-size:17px; font-weight:500; }
.hero-copy h1 { margin:12px 0 0; font-size:clamp(42px,5vw,72px); line-height:1.2; letter-spacing:-.045em; font-weight:700; max-width:520px; }
.hero-links { display:grid; gap:10px; }
.social-button {
  display:flex;
  align-items:center;
  gap:13px;
  padding:15px 16px;
  border:1px solid var(--line);
  background:#fff;
  border-radius:18px;
  transition:transform .2s ease, border-color .2s ease, background .2s ease;
}
.social-button:hover { transform:translateY(-2px); border-color:#d9d1c8; background:#fcfbf9; }
.social-button .social-icon { width:42px; height:42px; border-radius:14px; display:grid; place-items:center; background:var(--surface-soft); color:var(--accent); flex:0 0 auto; }
.social-button .social-icon svg { width:21px; height:21px; }
.social-button small, .contact-card small { display:block; color:var(--muted); font-size:11px; margin-bottom:2px; direction:ltr; text-align:right; }
.social-button strong, .contact-card strong { font-size:14px; font-weight:600; direction:ltr; display:block; }
.hero-photo { min-height:560px; background:var(--surface-warm); }
.hero-photo img { width:100%; height:100%; min-height:560px; object-fit:cover; object-position:50% 31%; }

.section { padding-top: 92px; }
.section-heading { display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; }
.section-heading h2 { font-size:27px; margin:0; letter-spacing:-.03em; font-weight:650; }
.section-heading h2::after { content:""; display:inline-block; width:38px; height:2px; background:var(--accent); margin-right:12px; vertical-align:middle; border-radius:3px; opacity:.7; }

.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.service-card {
  min-height:158px;
  padding:24px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  box-shadow:none;
  transition:transform .2s ease, background .2s ease, border-color .2s ease;
}
.service-card:hover { transform:translateY(-3px); background:#fdfcfb; border-color:#ddd5cc; }
.service-icon { width:44px; height:44px; display:grid; place-items:center; color:var(--accent); }
.service-icon svg { width:34px; height:34px; }
.service-card h3 { margin:20px 0 0; font-size:18px; font-weight:600; }

.about-grid {
  display:grid;
  grid-template-columns: 1.35fr .95fr;
  grid-template-rows: 300px 230px;
  gap:14px;
  direction:ltr;
}
.about-photo-large { grid-row:1 / span 2; }
.about-photo-large img, .about-photo-small img { width:100%; height:100%; object-fit:cover; }
.about-photo-large img { object-position:center 38%; }
.about-copy {
  direction:rtl;
  padding:34px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  background:var(--surface-soft);
  box-shadow:none;
}
.about-copy .eyebrow { color:var(--accent); direction:ltr; display:block; text-align:right; font-size:12px; font-weight:600; }
.about-copy h3 { font-size:31px; margin:10px 0 8px; font-weight:700; letter-spacing:-.035em; }
.about-copy p { margin:0; color:var(--muted); font-size:16px; }
.about-tags { display:flex; flex-wrap:wrap; gap:8px; }
.about-tags span { padding:8px 11px; border:1px solid #ded8d1; border-radius:999px; background:#fff; font-size:12px; color:#57524d; }
.about-photo-small img { object-position:center 38%; }

.gallery-grid {
  display:grid;
  grid-template-columns: 1.15fr .85fr .85fr;
  grid-template-rows: 410px;
  gap:14px;
  direction:ltr;
}
.gallery-card { box-shadow:none; }
.gallery-card img { width:100%; height:100%; object-fit:cover; }
.gallery-a img { object-position:center center; }
.gallery-b img { object-position:center 32%; }
.gallery-c img { object-position:center 38%; }

.contact-section { padding-bottom:86px; }
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.contact-card {
  min-height:112px;
  padding:20px 22px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:14px;
  align-items:center;
  direction:ltr;
  box-shadow:none;
  transition:.2s ease;
}
.contact-card:hover { transform:translateY(-2px); border-color:#d8d0c8; }
.contact-card > span:nth-child(2) { direction:rtl; }
.contact-mark { width:48px; height:48px; border-radius:16px; display:grid; place-items:center; background:var(--accent-soft); color:var(--accent); }
.contact-mark svg { width:23px; height:23px; }
.contact-card .arrow { font-size:22px; color:#a8a29b; }

.footer { border-top:1px solid var(--line); min-height:110px; display:flex; align-items:center; justify-content:space-between; color:var(--muted); font-size:12px; direction:ltr; }
.footer > div { display:flex; flex-direction:column; gap:4px; }
.footer strong { color:var(--text); font-size:14px; }

.reveal { opacity:0; transform:translateY(14px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in { opacity:1; transform:none; }
.delay-1 { transition-delay:.07s; }
.delay-2 { transition-delay:.14s; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .reveal { opacity:1; transform:none; transition:none; }
  * { transition-duration:0.001ms !important; }
}

@media (max-width: 900px) {
  .shell { width:min(calc(100% - 28px), var(--shell)); }
  .nav-wrap { height:72px; }
  .desktop-nav { display:none; }
  .menu-toggle { display:block; }
  .hero { padding-top:18px; }
  .hero-grid { grid-template-columns:1fr; gap:12px; }
  .hero-copy { min-height:auto; padding:28px 24px 24px; order:2; }
  .hero-photo { min-height:0; order:1; aspect-ratio: 4 / 4.3; }
  .hero-photo img { min-height:0; height:100%; object-position:50% 28%; }
  .hero-copy h1 { font-size:38px; margin:8px 0 30px; }
  .hero-kicker { font-size:14px; }
  .section { padding-top:64px; }
  .section-heading { margin-bottom:16px; }
  .section-heading h2 { font-size:22px; }
  .services-grid { grid-template-columns:repeat(2,1fr); gap:10px; }
  .service-card { min-height:132px; padding:18px; border-radius:22px; }
  .service-card h3 { font-size:15px; margin-top:14px; }
  .about-grid { grid-template-columns:1fr 1fr; grid-template-rows:auto 210px; gap:10px; }
  .about-photo-large { grid-column:1 / -1; grid-row:auto; aspect-ratio:16 / 10; }
  .about-copy { grid-column:1; grid-row:2; padding:20px; border-radius:22px; }
  .about-photo-small { grid-column:2; grid-row:2; border-radius:22px; }
  .about-copy h3 { font-size:22px; margin:6px 0; }
  .about-copy p { font-size:13px; }
  .about-tags { gap:5px; }
  .about-tags span { font-size:10px; padding:6px 8px; }
  .gallery-grid { grid-template-columns:1.25fr .75fr; grid-template-rows:230px 180px; gap:10px; }
  .gallery-a { grid-row:1 / span 2; }
  .gallery-b { grid-column:2; grid-row:1; }
  .gallery-c { grid-column:2; grid-row:2; }
  .gallery-card { border-radius:22px; }
  .contact-grid { grid-template-columns:1fr; gap:10px; }
  .contact-card { min-height:94px; border-radius:22px; padding:16px; }
  .contact-section { padding-bottom:60px; }
}

@media (max-width: 520px) {
  :root { --radius-xl:26px; }
  .shell { width:calc(100% - 20px); }
  .brand strong { font-size:15px; }
  .brand small { font-size:9px; }
  .hero-copy { padding:24px 20px 20px; }
  .hero-copy h1 { font-size:31px; letter-spacing:-.04em; }
  .social-button { padding:12px; border-radius:16px; }
  .social-button .social-icon { width:38px; height:38px; border-radius:12px; }
  .social-button strong { font-size:12px; }
  .service-card { min-height:120px; }
  .service-icon svg { width:30px; height:30px; }
  .about-grid { grid-template-rows:auto 180px; }
  .about-copy { padding:17px; }
  .about-copy .eyebrow { font-size:10px; }
  .about-copy h3 { font-size:19px; }
  .about-tags span:nth-child(3) { display:none; }
  .gallery-grid { grid-template-rows:205px 155px; }
  .footer { min-height:92px; }
}
