/* ==========================================================================
   Client site previews — six bespoke layouts.
   Each client gets its own structure, type, art direction and imagery.
   Designed at ~1000px wide; scaled down inside cards.
   ========================================================================== */

.pv{
  background:#fff;
  font-family:var(--font);
  color:#16161a;
  line-height:1.5;
  --shot-a:#ddd;
  --shot-b:#bbb;
}
.pv *{box-sizing:border-box;}
.pv .pv-h1,.pv .pv-h4,.pv .pv-h5{display:block;margin:0;}

/* browser chrome keeps the "screenshot" read */
.pv-chrome{
  height:36px;display:flex;align-items:center;gap:6px;padding:0 14px;
  background:#f6f6f8;border-bottom:1px solid rgba(0,0,0,.07);flex:none;
}
.pv-chrome i{width:9px;height:9px;border-radius:50%;background:#dcdce0;}
.pv-chrome i:nth-child(1){background:#ff5f57;}
.pv-chrome i:nth-child(2){background:#febc2e;}
.pv-chrome i:nth-child(3){background:#28c840;}
.pv-chrome span{
  margin-left:12px;font-size:11px;color:#86868b;background:#fff;
  padding:3px 14px;border-radius:6px;border:1px solid rgba(0,0,0,.05);
  font-family:var(--font);
}

/* generated "photography": duotone wash + motif, no external images */
.shot{
  position:relative;overflow:hidden;
  background:linear-gradient(145deg,var(--shot-a),var(--shot-b));
}
.shot::after{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(120% 90% at 18% 12%, rgba(255,255,255,.34), transparent 60%),
    repeating-linear-gradient(48deg, rgba(255,255,255,.045) 0 2px, transparent 2px 5px);
}
.shot svg{position:relative;z-index:1;display:block;}
.shot--center{display:grid;place-items:center;}

/* ══════════ 1. COFFEE — warm, serif, product-led ══════════ */
.pv-coffee{background:#faf7f0;font-family:Georgia,"Times New Roman",serif;}
.pv-coffee .cf-nav{
  display:flex;align-items:center;gap:30px;padding:18px 40px;
  background:#faf7f0;border-bottom:1px solid rgba(47,93,63,.16);
}
.pv-coffee .cf-logo{
  font-size:19px;font-weight:700;letter-spacing:.16em;color:#2f5d3f;margin-right:auto;
}
.pv-coffee .cf-nav a{font-size:12px;color:#5c5346;letter-spacing:.05em;font-family:var(--font);}
.pv-coffee .cf-bag{
  font-family:var(--font);font-size:11.5px;font-weight:600;color:#fff;background:#2f5d3f;
  padding:8px 18px;border-radius:2px;letter-spacing:.04em;
}
.pv-coffee .cf-hero{display:grid;grid-template-columns:1.05fr .95fr;min-height:300px;}
.pv-coffee .cf-copy{padding:54px 44px;display:flex;flex-direction:column;justify-content:center;}
.pv-coffee .cf-kick{
  font-family:var(--font);font-size:10.5px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:#8a7a3f;margin-bottom:16px;
}
.pv-coffee .pv-h1{font-size:46px;line-height:1.04;margin:0 0 16px;color:#22301f;font-weight:400;}
.pv-coffee .cf-sub{font-family:var(--font);font-size:14px;line-height:1.65;color:#5c5346;margin:0 0 26px;max-width:36ch;}
.pv-coffee .cf-btns{display:flex;gap:12px;font-family:var(--font);}
.pv-coffee .cf-b1{background:#2f5d3f;color:#fff;font-size:12.5px;font-weight:600;padding:13px 26px;border-radius:2px;}
.pv-coffee .cf-b2{border:1px solid #2f5d3f;color:#2f5d3f;font-size:12.5px;font-weight:600;padding:13px 26px;border-radius:2px;}
.pv-coffee .cf-shot{--shot-a:#c8a97e;--shot-b:#6b4a2f;}
.pv-coffee .cf-beans{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;padding:42px 44px 30px;background:#fff;}
.pv-coffee .cf-bean{text-align:center;}
.pv-coffee .cf-sack{
  height:104px;border-radius:5px;margin-bottom:14px;position:relative;
  background:linear-gradient(170deg,#efe7d7,#ddd0b6);
  border:1px solid rgba(47,93,63,.16);display:grid;place-items:center;
}
.pv-coffee .cf-sack b{
  font-family:var(--font);font-size:9px;letter-spacing:.16em;color:#2f5d3f;
  border:1px solid #2f5d3f;padding:5px 10px;border-radius:1px;
}
.pv-coffee .cf-bean .pv-h4{font-size:15px;margin:0 0 5px;color:#22301f;font-weight:400;}
.pv-coffee .cf-bean p{font-family:var(--font);font-size:11px;color:#7a7060;margin:0 0 9px;line-height:1.45;}
.pv-coffee .cf-roast{display:flex;gap:4px;justify-content:center;align-items:center;}
.pv-coffee .cf-roast i{width:7px;height:7px;border-radius:50%;background:#ddd2bd;}
.pv-coffee .cf-roast i.on{background:#6b4a2f;}
.pv-coffee .cf-band{
  background:#2f5d3f;color:#f3efe4;padding:22px 44px;
  display:flex;align-items:center;justify-content:space-between;
}
.pv-coffee .cf-band b{font-size:17px;font-weight:400;}
.pv-coffee .cf-band span{font-family:var(--font);font-size:11.5px;opacity:.8;}
.pv-coffee .cf-band em{
  font-family:var(--font);font-style:normal;background:#f3efe4;color:#2f5d3f;
  font-size:11.5px;font-weight:600;padding:10px 20px;border-radius:2px;
}

/* ══════════ 2. DENTAL — clean, rounded, booking-led ══════════ */
.pv-dental{background:#fff;}
.pv-dental .dt-top{
  display:flex;align-items:center;gap:26px;padding:8px 40px;
  background:#1a72b8;color:#fff;font-size:11px;
}
.pv-dental .dt-top span{opacity:.92;}
.pv-dental .dt-top .dt-ph{margin-left:auto;font-weight:600;}
.pv-dental .dt-nav{display:flex;align-items:center;gap:26px;padding:18px 40px;border-bottom:1px solid #e8eef5;}
.pv-dental .dt-logo{font-size:20px;font-weight:700;color:#12243a;letter-spacing:-.02em;margin-right:auto;}
.pv-dental .dt-logo b{color:#1a72b8;}
.pv-dental .dt-nav a{font-size:12.5px;color:#4a5a6b;}
.pv-dental .dt-cta{background:#1a72b8;color:#fff;font-size:12px;font-weight:600;padding:11px 22px;border-radius:999px;}
.pv-dental .dt-hero{display:grid;grid-template-columns:1fr .85fr;gap:36px;padding:44px 40px;background:linear-gradient(170deg,#f2f8fd,#fff);}
.pv-dental .dt-kick{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#1a72b8;margin-bottom:14px;}
.pv-dental .pv-h1{font-size:40px;line-height:1.08;letter-spacing:-.03em;margin:0 0 14px;color:#12243a;}
.pv-dental .dt-sub{font-size:14px;line-height:1.6;color:#53657a;margin:0 0 22px;max-width:38ch;}
.pv-dental .dt-trust{display:flex;flex-wrap:wrap;gap:10px;}
.pv-dental .dt-trust span{
  font-size:11px;font-weight:600;color:#1a72b8;background:#e6f1fa;
  padding:7px 13px;border-radius:999px;display:inline-flex;align-items:center;gap:6px;
}
/* booking widget — reads as a working product */
.pv-dental .dt-book{
  background:#fff;border:1px solid #dce8f3;border-radius:16px;padding:20px;
  box-shadow:0 12px 30px rgba(26,114,184,.10);
}
.pv-dental .dt-book .pv-h5{font-size:13px;margin:0 0 14px;color:#12243a;font-weight:700;}
.pv-dental .dt-days{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin-bottom:14px;}
.pv-dental .dt-day{
  text-align:center;padding:9px 0;border-radius:9px;border:1px solid #e3ecf4;
  font-size:10px;color:#6b7c8d;
}
.pv-dental .dt-day b{display:block;font-size:14px;color:#12243a;margin-top:2px;}
.pv-dental .dt-day.on{background:#1a72b8;border-color:#1a72b8;color:#cfe4f5;}
.pv-dental .dt-day.on b{color:#fff;}
.pv-dental .dt-slots{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:16px;}
.pv-dental .dt-slots span{
  font-size:11px;color:#1a72b8;border:1px solid #bcd9ef;border-radius:7px;padding:7px 11px;
}
.pv-dental .dt-slots span.on{background:#1a72b8;color:#fff;border-color:#1a72b8;}
.pv-dental .dt-go{display:block;text-align:center;background:#1a72b8;color:#fff;font-size:12.5px;font-weight:600;padding:12px;border-radius:9px;}
.pv-dental .dt-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:34px 40px 44px;}
.pv-dental .dt-item{display:flex;gap:12px;align-items:flex-start;}
.pv-dental .dt-ic{width:36px;height:36px;border-radius:10px;background:#e6f1fa;display:grid;place-items:center;flex:none;}
.pv-dental .dt-item b{display:block;font-size:13px;color:#12243a;margin-bottom:3px;}
.pv-dental .dt-item em{font-style:normal;font-size:11.5px;color:#6b7c8d;line-height:1.5;}

/* ══════════ 3. GYM — dark, condensed, schedule-led ══════════ */
.pv-gym{background:#111216;color:#f2f2f5;}
.pv-gym .gy-nav{display:flex;align-items:center;gap:26px;padding:18px 40px;border-bottom:1px solid rgba(255,255,255,.09);}
.pv-gym .gy-logo{
  font-family:"Oswald",Impact,var(--font);font-size:20px;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;margin-right:auto;
}
.pv-gym .gy-logo b{color:#e2521f;}
.pv-gym .gy-nav a{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.62);font-weight:500;}
.pv-gym .gy-cta{background:#e2521f;color:#fff;font-size:11.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;padding:11px 20px;border-radius:3px;}
.pv-gym .gy-hero{display:grid;grid-template-columns:1.1fr .9fr;}
.pv-gym .gy-copy{padding:52px 40px;display:flex;flex-direction:column;justify-content:center;}
.pv-gym .gy-kick{font-size:10.5px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:#e2521f;margin-bottom:16px;}
.pv-gym .pv-h1{
  font-family:"Oswald",Impact,var(--font);font-size:52px;line-height:.98;
  text-transform:uppercase;letter-spacing:.005em;margin:0 0 16px;font-weight:600;
}
.pv-gym .gy-sub{font-size:13.5px;line-height:1.6;color:rgba(255,255,255,.66);margin:0 0 24px;max-width:36ch;}
.pv-gym .gy-btns{display:flex;gap:12px;align-items:center;}
.pv-gym .gy-b1{background:#e2521f;color:#fff;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:14px 26px;border-radius:3px;}
.pv-gym .gy-b2{color:#fff;font-size:12px;font-weight:600;letter-spacing:.06em;border-bottom:2px solid #e2521f;padding-bottom:3px;}
.pv-gym .gy-shot{--shot-a:#3a2419;--shot-b:#0c0d10;}
.pv-gym .gy-sched{padding:30px 40px 12px;}
.pv-gym .gy-sched .pv-h5{
  font-family:"Oswald",Impact,var(--font);font-size:13px;letter-spacing:.14em;
  text-transform:uppercase;margin:0 0 14px;color:rgba(255,255,255,.55);font-weight:500;
}
.pv-gym .gy-row{
  display:grid;grid-template-columns:76px 1fr 120px 92px;gap:14px;align-items:center;
  padding:13px 0;border-top:1px solid rgba(255,255,255,.08);font-size:12.5px;
}
.pv-gym .gy-row b{font-family:"Oswald",Impact,var(--font);font-size:14px;letter-spacing:.04em;}
.pv-gym .gy-row span{color:#fff;font-weight:600;}
.pv-gym .gy-row em{font-style:normal;color:rgba(255,255,255,.5);font-size:11.5px;}
.pv-gym .gy-spots{
  font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  padding:5px 10px;border-radius:999px;text-align:center;
  background:rgba(226,82,31,.16);color:#f0733f;
}
.pv-gym .gy-spots.full{background:rgba(255,255,255,.07);color:rgba(255,255,255,.4);}
.pv-gym .gy-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:26px 40px 44px;}
.pv-gym .gy-stat b{
  display:block;font-family:"Oswald",Impact,var(--font);font-size:34px;
  color:#e2521f;line-height:1;margin-bottom:5px;
}
.pv-gym .gy-stat span{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.5);}

/* ══════════ 4. INTERIORS — editorial, image-first, quiet ══════════ */
.pv-interiors{background:#faf8f5;font-family:Georgia,"Times New Roman",serif;color:#25211c;}
.pv-interiors .in-nav{
  display:flex;align-items:center;justify-content:center;gap:34px;
  padding:22px 40px;position:relative;
}
.pv-interiors .in-logo{
  font-size:14px;letter-spacing:.34em;text-transform:uppercase;font-weight:400;
}
.pv-interiors .in-nav a{
  font-family:var(--font);font-size:10.5px;letter-spacing:.17em;text-transform:uppercase;color:#7a7266;
}
.pv-interiors .in-left{position:absolute;left:40px;display:flex;gap:26px;}
.pv-interiors .in-right{position:absolute;right:40px;display:flex;gap:26px;}
.pv-interiors .in-hero{min-height:292px;position:relative;--shot-a:#cbbfae;--shot-b:#7d7062;}
.pv-interiors .in-cap{
  position:absolute;left:40px;bottom:30px;z-index:2;color:#fff;
}
.pv-interiors .in-cap b{display:block;font-size:34px;font-weight:400;line-height:1.1;margin-bottom:7px;}
.pv-interiors .in-cap span{font-family:var(--font);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;opacity:.85;}
.pv-interiors .in-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:40px;}
.pv-interiors .in-proj b{display:block;font-size:15px;font-weight:400;margin:14px 0 4px;}
.pv-interiors .in-proj span{font-family:var(--font);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:#8d8477;}
.pv-interiors .in-img{height:150px;}
.pv-interiors .in-proj:nth-child(1) .in-img{--shot-a:#d6cbba;--shot-b:#8a7c68;}
.pv-interiors .in-proj:nth-child(2) .in-img{height:178px;--shot-a:#c3b5a4;--shot-b:#6f6254;}
.pv-interiors .in-proj:nth-child(3) .in-img{--shot-a:#ded5c6;--shot-b:#9a8c78;}

/* ══════════ 5. LANDSCAPING — friendly, local, trust-led ══════════ */
.pv-landscape{background:#fff;}
.pv-landscape .ls-top{
  display:flex;align-items:center;gap:20px;padding:7px 40px;
  background:#2c5c25;color:#dbe9d7;font-size:11px;
}
.pv-landscape .ls-top .ls-ph{margin-left:auto;font-weight:700;color:#fff;}
.pv-landscape .ls-nav{display:flex;align-items:center;gap:24px;padding:16px 40px;border-bottom:1px solid #e6ece3;}
.pv-landscape .ls-logo{font-size:21px;font-weight:800;color:#2c5c25;letter-spacing:-.03em;margin-right:auto;}
.pv-landscape .ls-nav a{font-size:12px;color:#54614e;font-weight:500;}
.pv-landscape .ls-cta{background:#e8a33d;color:#3a2a06;font-size:12px;font-weight:700;padding:11px 20px;border-radius:8px;}
.pv-landscape .ls-hero{display:grid;grid-template-columns:1fr 1fr;}
.pv-landscape .ls-copy{padding:44px 40px;display:flex;flex-direction:column;justify-content:center;}
.pv-landscape .ls-kick{font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:#3f7d34;margin-bottom:13px;}
.pv-landscape .pv-h1{font-size:39px;line-height:1.08;letter-spacing:-.03em;margin:0 0 13px;color:#1d2a19;}
.pv-landscape .ls-sub{font-size:13.5px;line-height:1.6;color:#5b6656;margin:0 0 20px;max-width:36ch;}
.pv-landscape .ls-form{display:flex;gap:8px;margin-bottom:16px;}
.pv-landscape .ls-form i{
  flex:1;font-style:normal;font-size:12px;color:#93a08d;background:#f4f7f2;
  border:1px solid #dde6d9;border-radius:8px;padding:12px 14px;
}
.pv-landscape .ls-form b{background:#3f7d34;color:#fff;font-size:12px;font-weight:700;padding:12px 20px;border-radius:8px;}
.pv-landscape .ls-badges{display:flex;gap:16px;flex-wrap:wrap;}
.pv-landscape .ls-badges span{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:#3f7d34;}
.pv-landscape .ls-shot{--shot-a:#9fc47f;--shot-b:#2f5222;}
.pv-landscape .ls-svc{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:34px 40px 22px;}
.pv-landscape .ls-card{border:1px solid #e6ece3;border-radius:12px;padding:18px;background:#fbfdfa;}
.pv-landscape .ls-card .ls-ic{width:34px;height:34px;border-radius:9px;background:#e6f0e2;display:grid;place-items:center;margin-bottom:11px;}
.pv-landscape .ls-card b{display:block;font-size:13.5px;color:#1d2a19;margin-bottom:4px;}
.pv-landscape .ls-card em{font-style:normal;font-size:11.5px;color:#69735f;line-height:1.5;}
.pv-landscape .ls-rev{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  margin:0 40px 34px;padding:16px 22px;border-radius:12px;background:#f4f7f2;
}
.pv-landscape .ls-rev b{font-size:13px;color:#1d2a19;}
.pv-landscape .ls-rev span{font-size:11.5px;color:#69735f;}
.pv-landscape .ls-stars{color:#e8a33d;font-size:13px;letter-spacing:2px;}

/* ══════════ 6. RESTAURANT — dark, moody, menu-led ══════════ */
.pv-restaurant{background:#17130f;color:#f6efe7;font-family:Georgia,"Times New Roman",serif;}
.pv-restaurant .rs-nav{
  display:flex;align-items:center;justify-content:center;gap:30px;
  padding:20px 40px;position:relative;border-bottom:1px solid rgba(246,239,231,.12);
}
.pv-restaurant .rs-logo{font-size:17px;letter-spacing:.32em;text-transform:uppercase;}
.pv-restaurant .rs-left{position:absolute;left:40px;display:flex;gap:24px;}
.pv-restaurant .rs-nav a{font-family:var(--font);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(246,239,231,.62);}
.pv-restaurant .rs-book{
  position:absolute;right:40px;font-family:var(--font);font-size:11px;font-weight:600;
  letter-spacing:.06em;background:#a8322c;color:#fff;padding:10px 18px;border-radius:2px;
}
.pv-restaurant .rs-hero{min-height:270px;padding:44px 0;position:relative;--shot-a:#7a3a22;--shot-b:#140f0c;display:grid;place-items:center;text-align:center;}
.pv-restaurant .rs-hero-in{position:relative;z-index:2;padding:0 40px;}
.pv-restaurant .rs-kick{font-family:var(--font);font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:#e0a06a;margin-bottom:14px;}
.pv-restaurant .pv-h1{font-size:44px;line-height:1.08;margin:0 0 14px;font-weight:400;max-width:17ch;margin-inline:auto;}
.pv-restaurant .rs-sub{font-family:var(--font);font-size:13px;line-height:1.6;color:rgba(246,239,231,.72);margin:0 auto;max-width:44ch;}
.pv-restaurant .rs-menu{padding:36px 40px 10px;}
.pv-restaurant .rs-menu .pv-h5{
  font-family:var(--font);font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;
  color:#e0a06a;margin:0 0 18px;font-weight:600;text-align:center;
}
.pv-restaurant .rs-dish{display:flex;align-items:baseline;gap:10px;margin-bottom:15px;}
.pv-restaurant .rs-dish b{font-size:16px;font-weight:400;white-space:nowrap;}
.pv-restaurant .rs-dot{flex:1;border-bottom:1px dotted rgba(246,239,231,.28);transform:translateY(-4px);}
.pv-restaurant .rs-dish u{text-decoration:none;font-size:15px;color:#e0a06a;}
.pv-restaurant .rs-dish em{
  display:block;font-family:var(--font);font-style:normal;font-size:11.5px;
  color:rgba(246,239,231,.5);margin-top:3px;
}
.pv-restaurant .rs-dishwrap{margin-bottom:15px;}
.pv-restaurant .rs-res{
  display:flex;align-items:center;gap:10px;margin:22px 40px 38px;padding:16px;
  background:rgba(246,239,231,.06);border:1px solid rgba(246,239,231,.12);border-radius:3px;
}
.pv-restaurant .rs-res i{
  flex:1;font-style:normal;font-family:var(--font);font-size:11.5px;
  color:rgba(246,239,231,.62);background:rgba(0,0,0,.28);
  border:1px solid rgba(246,239,231,.12);border-radius:2px;padding:11px 13px;
}
.pv-restaurant .rs-res b{
  font-family:var(--font);font-size:11.5px;font-weight:700;letter-spacing:.05em;
  background:#a8322c;color:#fff;padding:12px 24px;border-radius:2px;white-space:nowrap;
}
