/* Varbanoff Design - Services Page Styles */
.vbd {
  --W:  #f4f1ec;
  --G:  #888480;
  --B:  #080808;
  --DK: #0f0f0f;
  --BD: rgba(244,241,236,0.13);
  --BH: rgba(244,241,236,0.32);
  --MAX: 1280px;
  background: var(--B);
  color: var(--W);
  font-family: 'Jost', sans-serif;
  font-weight: 300;
  width: 100%;
}
.vbd *, .vbd *::before, .vbd *::after { box-sizing: border-box; margin: 0; padding: 0; }

.vbd-wrap { max-width: var(--MAX); margin: 0 auto; padding: 0 48px; }

.vbd h1, .vbd h2, .vbd h3,
.vbd .vbd-sub,
.vbd .vbd-wm,
.vbd .vbd-pn, .vbd .vbd-pp,
.vbd .vbd-stat b, .vbd .vbd-cta h2,
.vbd .vbd-ph h2 {
  font-family: 'Cormorant Garamond', Georgia, serif;
}

.vbd-hero {
  background: var(--B);
  padding: 80px 0 48px;
  position: relative; overflow: hidden;
  text-align: center;
}
.vbd-wm {
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-52%) rotate(-2deg);
  font-size: clamp(90px,14vw,220px);
  font-weight: 600; letter-spacing: .08em;
  color: rgba(244,241,236,0.025);
  white-space: nowrap; pointer-events: none;
  user-select: none; text-transform: uppercase;
  font-family: 'Cormorant Garamond', serif;
}
.vbd-eyebrow {
  font-size: 10px; letter-spacing: 5px; text-transform: uppercase;
  color: var(--G); margin-bottom: 28px;
  display: flex; align-items: center; justify-content: center; gap: 16px;
  animation: vup .8s .1s both;
  font-family: 'Jost', sans-serif;
}
.vbd-eyebrow::before,
.vbd-eyebrow::after { content:''; width:40px; height:1px; background:var(--G); }

.vbd-hero h1 {
  font-size: clamp(38px,6vw,90px); font-weight: 300;
  line-height: .9; text-transform: uppercase;
  color: var(--W); letter-spacing: -.01em;
  animation: vup .9s .25s both;
}
.vbd-hero h1 em { font-style: italic; color: var(--G); }

.vbd-rule {
  width: 1px; height: 36px; background: var(--BD);
  margin: 24px auto;
  animation: vup .8s .4s both;
}
.vbd-sub {
  font-style: italic; font-size: clamp(17px,1.5vw,22px);
  color: var(--W); line-height: 1.65;
  max-width: 560px; margin: 0 auto;
  animation: vup .9s .5s both;
}

.vbd-cat { background: var(--B); padding: 40px 0 0; }
.vbd-cat-inner {
  border-top: 1px solid var(--BD);
  padding-top: 56px;
  display: grid;
  grid-template-columns: 108px 1fr;
  gap: 40px; align-items: center;
}
.vbd-cat-n {
  font-family: 'Cormorant Garamond', serif;
  font-size: 52px; font-weight: 300; line-height: 1;
  color: var(--W);
  width: 96px; height: 96px;
  border: 1px solid var(--BH);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; letter-spacing: -1px;
}
.vbd-cat-lbl {
  font-size: 9px; letter-spacing: 4px; text-transform: uppercase;
  color: rgba(244,241,236,0.65); margin-bottom: 10px;
  font-family: 'Jost', sans-serif;
}
.vbd-cat-inner h2 { font-size: clamp(32px,4.5vw,58px); font-weight: 300; line-height: 1.1; color: var(--W); }
.vbd-cat-inner h2 em { font-style: italic; color: var(--G); }

.vbd-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; }
.vbd-grid-4 { display: grid; grid-template-columns: repeat(4,1fr); gap: 2px; }
.vbd-grid-5 { display: grid; grid-template-columns: repeat(5,1fr); gap: 2px; }

.vbd-card {
  background: var(--DK);
  border: 1px solid var(--BD);
  padding: 40px 32px 36px;
  display: flex; flex-direction: column;
  min-height: 360px;
  position: relative; overflow: hidden;
  cursor: default; transition: border-color .4s;
}
.vbd-card:hover { border-color: var(--BH); }
.vbd-card::before {
  content:''; position:absolute; inset:0;
  background: linear-gradient(145deg,rgba(244,241,236,.025) 0%,transparent 55%);
  opacity:0; transition:opacity .5s; pointer-events:none;
}
.vbd-card:hover::before { opacity:1; }

.vbd-ch { margin-bottom: 28px; }
.vbd-cn {
  font-family: 'Cormorant Garamond', serif;
  font-size: 15px; letter-spacing: 3px; color: var(--W);
  display: inline-block;
  border: 1px solid var(--BH);
  padding: 5px 12px;
}

.vbd-ico { width:56px; height:56px; margin-bottom:24px; flex-shrink:0; }
.vbd-ico svg, .vbd-ico img { width:100%; height:100%; object-fit:contain; }

.vbd-card h3 {
  font-size: clamp(13px,1.3vw,17px); font-weight: 300;
  letter-spacing: 2.5px; text-transform: uppercase; line-height: 1.3;
  margin-bottom: 14px; color: var(--W);
}

.vbd-card p {
  color: var(--W); font-size: 16px;
  line-height: 1.88; letter-spacing: .3px; flex-grow: 1;
}

.vbd-tags { display:flex; flex-wrap:wrap; gap:5px; margin-top:20px; }
.vbd-tag {
  font-size: 7.5px; letter-spacing: 2px; text-transform: uppercase;
  border: 1px solid var(--BD); color: var(--G);
  padding: 4px 9px; transition: all .35s;
  font-family: 'Jost', sans-serif;
}
.vbd-card:hover .vbd-tag { border-color: var(--BH); color: var(--W); }

.vbd-wide { grid-column: span 2; flex-direction: row; gap: 52px; align-items: stretch; min-height: auto; }
.vbd-wm-body { flex:1; display:flex; flex-direction:column; }
.vbd-wm-body p { flex-grow:1; }
.vbd-side {
  width: 210px; flex-shrink: 0;
  border-left: 1px solid var(--BD);
  padding-left: 36px; padding-top: 4px;
}
.vbd-slbl {
  font-size: 8px; letter-spacing: 3px; text-transform: uppercase;
  color: var(--G); margin-bottom: 18px; font-family: 'Jost', sans-serif;
}
.vbd-side ul { list-style:none; display:flex; flex-direction:column; gap:12px; }
.vbd-side li { font-size:13px; color:var(--W); padding-left:18px; position:relative; }
.vbd-side li::before { content:'\2014'; position:absolute; left:0; color:var(--G); }

.vbd-packs { background: var(--B); padding: 80px 0 0; }
.vbd-packs-inner { border: 1px solid var(--BD); }
.vbd-ph {
  padding: 56px 52px 48px;
  border-bottom: 1px solid var(--BD);
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 60px; align-items: end;
}
.vbd-ph h2 { font-size: clamp(28px,3.5vw,46px); font-weight: 300; line-height: 1.15; color: var(--W); }
.vbd-ph p { color: var(--W); font-size: 13px; line-height: 1.85; }
.vbd-pg { display:grid; grid-template-columns:1fr 1fr; }
.vbd-pk {
  padding: 52px; border-right: 1px solid var(--BD);
  transition: background .4s;
}
.vbd-pk:last-child { border-right: none; }
.vbd-pk:hover { background: rgba(244,241,236,.02); }
.vbd-pb {
  font-size: 9px; letter-spacing: 3px; text-transform: uppercase;
  color: var(--G); margin-bottom: 20px; display: block;
  font-family: 'Jost', sans-serif;
}
.vbd-pk h3 {
  font-family:'Cormorant Garamond',serif; font-size:28px; font-weight:300; letter-spacing:1px; margin-bottom:12px; color:var(--W);
}
.vbd-pp {
  font-family:'Cormorant Garamond',serif; font-size:66px; font-weight:200; letter-spacing:-3px; line-height:1; color:var(--W);
}
.vbd-pp sup { font-size:22px; vertical-align:super; font-weight:300; }
.vbd-pp sub { font-size:14px; letter-spacing:1px; color:var(--G); vertical-align:baseline; }
.vbd-pm { font-size:10px; color:var(--G); letter-spacing:1px; margin:12px 0 36px; font-family:'Jost',sans-serif; }
.vbd-pl { list-style:none; display:flex; flex-direction:column; gap:12px; margin-bottom:40px; }
.vbd-pl li { font-size:15px; color:var(--W); padding-left:20px; position:relative; }
.vbd-pl li::before { content:'\2713'; position:absolute; left:0; color:var(--G); }
.vbd-pl li.no { color:var(--G); }
.vbd-pl li.no::before { content:'\2715'; }
.vbd-btn {
  display:inline-block; font-size:9px; letter-spacing:3px; text-transform:uppercase;
  text-decoration:none; padding:13px 30px; border:1px solid var(--G);
  color:var(--G); background:#1a1a1a; transition:all .3s; font-family:'Jost',sans-serif; font-weight:400;
}
.vbd-btn:hover { background:#3a3a3a; color:var(--W); border-color:var(--W); }

.vbd-cta { background:var(--B); padding:80px 0; }
.vbd-cta-inner {
  border:1px solid var(--BD); padding:100px 80px;
  text-align:center; position:relative; overflow:hidden;
}
.vbd-cta-inner::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 50% 70% at 50% 110%,rgba(244,241,236,.04) 0%,transparent 65%);
}
.vbd-cta h2 {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(38px,6vw,80px); font-weight:300; line-height:1.05;
  margin-bottom:20px; position:relative; color:var(--W);
}
.vbd-cta h2 em { font-style:italic; color:var(--G); }
.vbd-cta p {
  font-family:'Cormorant Garamond',serif; font-style:italic;
  font-size:17px; color:var(--W); margin-bottom:48px;
  line-height:1.65; position:relative;
}
.vbd-btns { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; position:relative; }
.vbd-btn-ghost { border-color:var(--BD); color:var(--G); padding:13px 44px; }
.vbd-btn-ghost:hover { background:transparent; color:var(--W); border-color:var(--BH); }
.vbd-spacer { height:80px; background:var(--B); }

@keyframes vup { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:translateY(0)} }
.vbd-rv { opacity:1; }
.vbd-rv.vbd-in { opacity:1; transform:translateY(0); }

@media(max-width:1200px) {
  .vbd-grid-5 { grid-template-columns:repeat(3,1fr); }
  .vbd-grid { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:900px) {
  .vbd-wrap { padding:0 24px; }
  .vbd-grid,.vbd-grid-4,.vbd-grid-5 { grid-template-columns:repeat(2,1fr); }
  .vbd-wide { grid-column:span 2; }
}
@media(max-width:600px) {
  .vbd-grid,.vbd-grid-4,.vbd-grid-5 { grid-template-columns:1fr; }
  .vbd-wide { grid-column:span 1; flex-direction:column; }
  .vbd-side { width:100%; border-left:none; border-top:1px solid var(--BD); padding-left:0; padding-top:20px; margin-top:20px; }
  .vbd-hero { padding:80px 0 60px; }
  .vbd-cat-inner { grid-template-columns:1fr; gap:14px; }
  .vbd-packs { padding:52px 0 0; }
  .vbd-ph { grid-template-columns:1fr; gap:18px; padding:32px 24px 28px; }
  .vbd-pg { grid-template-columns:1fr; }
  .vbd-pk { border-right:none; border-bottom:1px solid var(--BD); padding:36px 24px; }
  .vbd-cta { padding:48px 0; }
  .vbd-cta-inner { padding:56px 24px; }
}