/*
 * Nakveti Theme v1.30.0 — Stage 4
 * Services + listing upgrades presentation layer.
 * Business data, prices, duration and enabled state remain in Nakveti Core.
 */

/* ---------- Services page: lighter editorial hierarchy ---------- */
.snw-services-page .nk-content{
  padding:clamp(56px,6vw,86px) 0 clamp(76px,8vw,112px);
}
.snw-services{
  width:min(1160px,calc(100% - 40px));
}
.snw-services-head{
  max-width:780px;
  margin:0 auto clamp(34px,4vw,50px);
}
.snw-services-head .snw-kicker{
  margin-bottom:10px;
  letter-spacing:.12em;
}
.snw-services-head h2{
  max-width:760px;
  margin-bottom:14px;
  font-size:clamp(32px,4.2vw,52px);
  line-height:1.18;
}
.snw-services-head>p:last-child{
  max-width:650px;
  font-size:15px;
  line-height:1.72;
}

.snw-service-grid,
.snw-service-grid.is-three{
  gap:16px;
}
.snw-service-card{
  min-height:0;
  padding:clamp(25px,2.6vw,32px);
  border:1px solid color-mix(in srgb,var(--nk-line) 88%,transparent);
  border-radius:18px;
  background:var(--nk-surface,#fff);
  box-shadow:0 10px 30px rgba(31,77,58,.055);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.snw-service-card:hover{
  transform:translateY(-3px);
  border-color:color-mix(in srgb,var(--nk-green) 22%,var(--nk-line));
  box-shadow:0 16px 38px rgba(31,77,58,.085);
}
.snw-service-card:before{
  top:20px;
  left:24px;
  font-size:52px;
  letter-spacing:-.06em;
  opacity:.72;
}
.snw-service-tag{
  align-self:flex-end;
  margin:0 0 30px auto;
  padding:6px 10px;
  border:1px solid color-mix(in srgb,var(--nk-green) 10%,transparent);
  background:color-mix(in srgb,var(--nk-green) 7%,var(--nk-surface,#fff));
  font-size:10px;
  letter-spacing:.035em;
}
.snw-service-card h3{
  margin-bottom:10px;
  font-size:clamp(23px,2vw,28px);
  line-height:1.32;
}
.snw-service-card>p:not(.snw-service-commission):not(.snw-service-note){
  margin-bottom:16px;
  font-size:14px;
  line-height:1.68;
}
.snw-service-price{
  min-height:0;
  margin:6px 0 18px;
  gap:8px;
}
.snw-service-price strong{
  font-size:clamp(34px,3.4vw,44px);
  line-height:1.05;
}
.snw-service-price del{font-size:15px}
.snw-service-price span{font-size:12px}
.snw-service-commission{
  margin:0 0 17px;
  padding:9px 11px;
  border-left-width:1px;
  border-radius:8px;
  font-size:12px;
  line-height:1.55;
}
.snw-service-card ul{
  gap:8px;
  margin:6px 0 22px;
}
.snw-service-card li{
  padding-left:23px;
  font-size:13px;
  line-height:1.55;
}
.snw-service-card li:before{
  width:16px;
  height:16px;
  font-size:10px;
}
.snw-service-note{
  margin:4px 0 22px;
  padding:11px 12px;
  border-radius:9px;
  font-size:12px;
}
.snw-service-card .snw-primary{
  min-height:48px;
  margin-top:auto;
  padding:11px 15px;
  border-radius:10px;
  box-shadow:none;
}

/* Three primary services stay distinct without heavy borders or oversized shadows. */
.snw-service-card--digital{
  border:1px solid color-mix(in srgb,var(--nk-green) 18%,var(--nk-line));
  background:
    linear-gradient(145deg,color-mix(in srgb,var(--nk-green) 3%,var(--nk-surface,#fff)),var(--nk-surface,#fff) 46%);
}
.snw-service-card--landing_seo{
  margin:0;
  border:1px solid color-mix(in srgb,var(--nk-green-2) 26%,var(--nk-line));
  background:
    linear-gradient(145deg,color-mix(in srgb,var(--nk-cream) 66%,var(--nk-surface,#fff)),var(--nk-surface,#fff) 62%);
  box-shadow:0 11px 32px rgba(108,113,69,.07);
}
.snw-service-card--landing_seo:after{
  right:-78px;
  bottom:-88px;
  width:168px;
  height:168px;
  background:color-mix(in srgb,var(--nk-green-2) 7%,transparent);
}
.snw-service-card--landing_seo .snw-service-tag{
  border-color:transparent;
  background:color-mix(in srgb,var(--nk-green-2) 88%,var(--nk-green));
}
.snw-service-card--realtor{
  border:1px solid color-mix(in srgb,var(--nk-green) 78%,#000);
  background:
    linear-gradient(155deg,color-mix(in srgb,var(--nk-green) 94%,#000) 0%,color-mix(in srgb,var(--nk-green) 82%,#000) 74%,color-mix(in srgb,var(--nk-brown) 42%,var(--nk-green)) 140%);
  box-shadow:0 13px 34px rgba(20,54,41,.14);
}
.snw-service-card--realtor .snw-primary{
  border:1px solid rgba(255,255,255,.16);
}

/* ---------- Premium / Urgent / VIP listing upgrades ---------- */
.snw-services-upgrades{
  position:relative;
  isolation:isolate;
  margin-top:clamp(44px,6vw,68px);
  padding:clamp(24px,3vw,34px);
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--nk-green) 12%,var(--nk-line));
  border-radius:20px;
  background:color-mix(in srgb,var(--nk-surface,#fff) 94%,var(--nk-cream));
  box-shadow:0 10px 32px rgba(31,77,58,.045);
}
.snw-services-upgrades:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(90deg,transparent 0 92%,color-mix(in srgb,var(--nk-green) 4.5%,transparent) 92% 92.15%,transparent 92.15%),
    linear-gradient(0deg,transparent 0 88%,color-mix(in srgb,var(--nk-green-2) 5.5%,transparent) 88% 88.15%,transparent 88.15%);
  background-size:210px 150px,210px 150px;
  opacity:.8;
}
.snw-services-upgrades__head{
  align-items:center;
  gap:24px;
  margin-bottom:22px;
}
.snw-services-upgrades__head>div{max-width:720px}
.snw-services-upgrades__head h3{
  margin:5px 0 7px;
  font-size:clamp(25px,2.8vw,34px);
  line-height:1.25;
}
.snw-services-upgrades__head p{
  max-width:650px;
  font-size:14px;
  line-height:1.65;
}
.snw-services-upgrades__head>.snw-secondary{
  min-height:44px;
  padding:9px 14px;
  border:1px solid color-mix(in srgb,var(--nk-green) 42%,var(--nk-line));
  border-radius:10px;
  background:transparent;
}
.snw-services-upgrades__head>.snw-secondary:hover{
  background:color-mix(in srgb,var(--nk-green) 6%,transparent);
}
.snw-services-upgrades__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr));
  gap:14px;
}
.snw-services-upgrades__grid article{
  position:relative;
  isolation:isolate;
  display:flex;
  min-width:0;
  min-height:338px;
  padding:24px;
  overflow:hidden;
  flex-direction:column;
  border:1px solid var(--nk-line);
  border-radius:16px;
  background:var(--nk-surface,#fff);
  box-shadow:none;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.snw-services-upgrades__grid article:hover{
  transform:translateY(-3px);
  box-shadow:0 14px 32px rgba(31,77,58,.075);
}
.snw-services-upgrades__grid article:after{
  content:"";
  position:absolute;
  top:-48px;
  right:-44px;
  z-index:-1;
  width:130px;
  height:130px;
  border:1px solid color-mix(in srgb,var(--nk-green) 9%,transparent);
  border-radius:50%;
  opacity:.9;
}
.snw-services-upgrades__grid .snw-service-tag{
  margin:0 0 18px;
  padding:6px 10px;
}
.snw-services-upgrades__grid h4{
  margin:0 0 9px;
  font-size:clamp(20px,2vw,23px);
  line-height:1.32;
}
.snw-services-upgrades__meta{
  gap:8px;
  margin-bottom:12px;
}
.snw-services-upgrades__meta strong{
  font-size:19px;
  line-height:1.2;
}
.snw-services-upgrades__meta span{
  padding:4px 7px;
  border:1px solid color-mix(in srgb,var(--nk-line) 70%,transparent);
  border-radius:999px;
  background:color-mix(in srgb,var(--nk-cream) 72%,var(--nk-surface,#fff));
  font-size:11px;
}
.snw-services-upgrades__grid p{
  margin:0 0 13px;
  font-size:13px;
  line-height:1.62;
}
.snw-services-upgrades__grid ul{
  display:grid;
  gap:7px;
  margin:0 0 20px;
  padding:0;
  list-style:none;
  font-size:13px;
  line-height:1.5;
}
.snw-services-upgrades__grid li{
  position:relative;
  padding-left:20px;
}
.snw-services-upgrades__grid li:before{
  content:"";
  position:absolute;
  top:.58em;
  left:1px;
  width:7px;
  height:7px;
  border:1px solid currentColor;
  border-radius:50%;
  opacity:.55;
}
.snw-services-upgrades__grid .snw-primary{
  display:inline-flex;
  min-height:46px;
  margin-top:auto;
  padding:10px 14px;
  align-items:center;
  justify-content:center;
  align-self:stretch;
  border:1px solid transparent;
  border-radius:10px;
  box-shadow:none;
}

/* Premium — restrained olive/cream editorial card. */
.snw-services-upgrades__grid .snw-upgrade-premium,
.snw-services-upgrades__grid [data-package="premium"]{
  border-color:color-mix(in srgb,var(--nk-green-2) 30%,var(--nk-line));
  background:linear-gradient(150deg,color-mix(in srgb,var(--nk-cream) 76%,var(--nk-surface,#fff)),var(--nk-surface,#fff) 70%);
}
.snw-services-upgrades__grid .snw-upgrade-premium .snw-service-tag,
.snw-services-upgrades__grid [data-package="premium"] .snw-service-tag{
  border-color:transparent;
  background:var(--nk-green-2);
  color:#fff;
}
.snw-services-upgrades__grid .snw-upgrade-premium .snw-primary,
.snw-services-upgrades__grid [data-package="premium"] .snw-primary{
  background:var(--nk-green-2);
  color:#fff;
}

/* Urgent — earth-toned, clear but not alarm-red. */
.snw-services-upgrades__grid .snw-upgrade-urgent,
.snw-services-upgrades__grid [data-package="urgent"]{
  border-color:color-mix(in srgb,var(--nk-brown) 28%,var(--nk-line));
  background:linear-gradient(150deg,color-mix(in srgb,var(--nk-brown) 5%,var(--nk-surface,#fff)),var(--nk-surface,#fff) 66%);
}
.snw-services-upgrades__grid .snw-upgrade-urgent:before,
.snw-services-upgrades__grid [data-package="urgent"]:before{
  content:"";
  position:absolute;
  top:24px;
  right:24px;
  width:18px;
  height:18px;
  border:1px solid color-mix(in srgb,var(--nk-brown) 54%,transparent);
  border-radius:50%;
  box-shadow:inset 0 0 0 5px color-mix(in srgb,var(--nk-brown) 6%,transparent);
}
.snw-services-upgrades__grid .snw-upgrade-urgent .snw-service-tag,
.snw-services-upgrades__grid [data-package="urgent"] .snw-service-tag{
  border-color:color-mix(in srgb,var(--nk-brown) 20%,transparent);
  background:color-mix(in srgb,var(--nk-brown) 8%,var(--nk-surface,#fff));
  color:var(--nk-brown);
}
.snw-services-upgrades__grid .snw-upgrade-urgent .snw-primary,
.snw-services-upgrades__grid [data-package="urgent"] .snw-primary{
  background:var(--nk-brown);
  color:#fff;
}

/* VIP — representative dark-green card with an ivory action. */
.snw-services-upgrades__grid .snw-upgrade-vip,
.snw-services-upgrades__grid [data-package="vip"]{
  border-color:color-mix(in srgb,var(--nk-green) 74%,#000);
  background:linear-gradient(155deg,color-mix(in srgb,var(--nk-green) 96%,#000),color-mix(in srgb,var(--nk-green) 80%,#000) 78%,color-mix(in srgb,var(--nk-brown) 34%,var(--nk-green)) 145%);
  color:rgba(255,255,255,.9);
}
.snw-services-upgrades__grid .snw-upgrade-vip:after,
.snw-services-upgrades__grid [data-package="vip"]:after{
  border-color:rgba(255,255,255,.11);
}
.snw-services-upgrades__grid .snw-upgrade-vip :is(h4,.snw-services-upgrades__meta strong),
.snw-services-upgrades__grid [data-package="vip"] :is(h4,.snw-services-upgrades__meta strong){
  color:#fff;
}
.snw-services-upgrades__grid .snw-upgrade-vip :is(p,ul),
.snw-services-upgrades__grid [data-package="vip"] :is(p,ul){
  color:rgba(255,255,255,.78);
}
.snw-services-upgrades__grid .snw-upgrade-vip .snw-service-tag,
.snw-services-upgrades__grid [data-package="vip"] .snw-service-tag{
  border-color:rgba(255,255,255,.14);
  background:rgba(255,255,255,.09);
  color:#fff;
}
.snw-services-upgrades__grid .snw-upgrade-vip .snw-services-upgrades__meta span,
.snw-services-upgrades__grid [data-package="vip"] .snw-services-upgrades__meta span{
  border-color:rgba(255,255,255,.12);
  background:rgba(255,255,255,.08);
  color:rgba(255,255,255,.86);
}
.snw-services-upgrades__grid .snw-upgrade-vip .snw-primary,
.snw-services-upgrades__grid [data-package="vip"] .snw-primary{
  border-color:rgba(255,255,255,.14);
  background:var(--nk-cream);
  color:var(--nk-green);
}

/* ---------- Dark mode ---------- */
html[data-nk-theme="dark"] .snw-service-card:not(.snw-service-card--realtor){
  background:linear-gradient(145deg,color-mix(in srgb,var(--nk-surface) 94%,var(--nk-surface-3)),var(--nk-surface));
  border-color:var(--nk-line);
}
html[data-nk-theme="dark"] .snw-service-card:not(.snw-service-card--realtor) :is(h3,.snw-service-price strong,li){
  color:var(--nk-text);
}
html[data-nk-theme="dark"] .snw-service-card:not(.snw-service-card--realtor) :is(p,.snw-service-price span,.snw-service-note){
  color:var(--nk-text-2);
}
html[data-nk-theme="dark"] .snw-service-card:not(.snw-service-card--realtor) .snw-service-note{
  background:var(--nk-surface-3);
  border-color:var(--nk-line);
}
html[data-nk-theme="dark"] .snw-services-upgrades{
  background:color-mix(in srgb,var(--nk-surface) 94%,var(--nk-surface-3));
  border-color:var(--nk-line);
}
html[data-nk-theme="dark"] .snw-services-upgrades__grid article:not(.snw-upgrade-vip){
  background:linear-gradient(150deg,color-mix(in srgb,var(--nk-surface) 94%,var(--nk-surface-3)),var(--nk-surface));
  border-color:var(--nk-line);
  color:var(--nk-text);
}
html[data-nk-theme="dark"] .snw-services-upgrades__grid article:not(.snw-upgrade-vip) :is(h4,.snw-services-upgrades__meta strong){
  color:var(--nk-text);
}
html[data-nk-theme="dark"] .snw-services-upgrades__grid article:not(.snw-upgrade-vip) :is(p,ul){
  color:var(--nk-text-2);
}
html[data-nk-theme="dark"] .snw-services-upgrades__grid article:not(.snw-upgrade-vip) .snw-services-upgrades__meta span{
  background:var(--nk-surface-3);
  border-color:var(--nk-line);
  color:var(--nk-text-2);
}
html[data-nk-theme="dark"] .snw-services-upgrades__head>.snw-secondary{
  background:transparent;
  color:var(--nk-text);
  border-color:var(--nk-line);
}

@media(max-width:980px){
  .snw-service-grid,.snw-service-grid.is-three{grid-template-columns:1fr 1fr}
  .snw-service-card--realtor{grid-column:1/-1}
}
@media(max-width:760px){
  .snw-services-upgrades__head{align-items:stretch;flex-direction:column}
  .snw-services-upgrades__head>.snw-secondary{align-self:flex-start}
}
@media(max-width:680px){
  .snw-services{width:min(100% - 28px,1160px)}
  .snw-service-grid,.snw-service-grid.is-three{grid-template-columns:1fr}
  .snw-service-card,.snw-service-card--realtor{grid-column:auto;padding:24px 21px}
  .snw-service-card:before{top:18px;left:20px;font-size:46px}
  .snw-service-tag{margin-bottom:27px}
  .snw-services-upgrades{padding:20px;border-radius:16px}
  .snw-services-upgrades__grid article{min-height:0;padding:21px}
}
@media(prefers-reduced-motion:reduce){
  .snw-service-card,.snw-services-upgrades__grid article{transition:none}
  .snw-service-card:hover,.snw-services-upgrades__grid article:hover{transform:none}
}