/*
Theme Name: KhoibrewMzansi Creations Service Showcase V4
Theme URI: https://urbanbusinessbuilders.co.za/
Author: Urban Business Builders
Author URI: https://urbanbusinessbuilders.co.za/
Description: A premium photography portfolio theme with a South African service-image showcase.
Version: 4.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: khoibrewmzansi-creations-service-showcase
Tags: photography, portfolio, business, responsive, custom-logo, one-page
*/

:root{--bg:#040911;--bg2:#081522;--gold:#d6a83b;--gold2:#ffcf67;--silver:#e9edf2;--muted:#b9c2cc;--panel:rgba(10,19,30,.78);--border:rgba(214,168,59,.36)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;background:radial-gradient(circle at 80% 0%,rgba(52,84,120,.38),transparent 34%),linear-gradient(135deg,var(--bg),#02050a 50%,#07121e);color:#fff;overflow-x:hidden}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.container{width:min(1180px,92%);margin:auto}.gold{color:var(--gold2)}.btn{display:inline-flex;align-items:center;gap:.7rem;padding:1rem 1.35rem;border:1px solid var(--border);border-radius:999px;background:linear-gradient(135deg,#241a07,var(--gold),#fff2b2,var(--gold));color:#05070b;font-weight:900;box-shadow:0 0 32px rgba(214,168,59,.35);transition:.35s}.btn:hover{transform:translateY(-4px) scale(1.02);filter:saturate(1.2)}.btn.ghost{background:rgba(255,255,255,.04);color:#fff;border-color:rgba(255,255,255,.2)}.site-header{position:fixed;inset:0 0 auto 0;z-index:50;background:rgba(3,7,13,.72);backdrop-filter:blur(18px);border-bottom:1px solid rgba(214,168,59,.18)}.nav{display:flex;align-items:center;justify-content:space-between;padding:.85rem 0}.brand{display:flex;align-items:center;gap:.8rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.brand img{width:58px;height:58px;border-radius:50%;box-shadow:0 0 22px rgba(214,168,59,.45)}.menu{display:flex;gap:1.2rem;align-items:center}.menu a{font-size:.85rem;color:var(--muted);font-weight:700}.menu a:hover{color:var(--gold2)}.menu-toggle{display:none}.hero{min-height:100vh;display:grid;align-items:center;position:relative;padding:9rem 0 5rem;overflow:hidden}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,9,17,.94),rgba(4,9,17,.72),rgba(4,9,17,.35)),url('assets/images/hero-cover.png') center right/cover no-repeat;z-index:-2}.hero:after{content:"";position:absolute;inset:auto -10% -30% -10%;height:42%;background:radial-gradient(ellipse,rgba(214,168,59,.25),transparent 60%);z-index:-1}.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center}.eyebrow{display:inline-flex;gap:.6rem;align-items:center;color:var(--gold2);font-weight:900;letter-spacing:.22em;text-transform:uppercase;font-size:.78rem}.eyebrow:before{content:"";width:42px;height:2px;background:var(--gold)}h1{font-size:clamp(3rem,7vw,6.8rem);line-height:.9;margin:1rem 0;background:linear-gradient(180deg,#fff,#cbd2da 45%,#777);-webkit-background-clip:text;color:transparent;text-shadow:0 18px 50px rgba(0,0,0,.65)}.hero p{font-size:1.12rem;line-height:1.8;color:#d8dde4;max-width:720px}.hero-card{background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.02));border:1px solid var(--border);border-radius:34px;padding:1.2rem;box-shadow:0 30px 90px rgba(0,0,0,.6),inset 0 0 40px rgba(214,168,59,.07);animation:float 5s ease-in-out infinite}.hero-card img{border-radius:28px}.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:2rem}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:3rem}.stat{padding:1rem;border:1px solid rgba(255,255,255,.11);background:rgba(255,255,255,.04);border-radius:18px}.stat strong{display:block;color:var(--gold2);font-size:1.5rem}.section{padding:6rem 0;position:relative}.section-title{max-width:820px;margin-bottom:3rem}.section-title h2{font-size:clamp(2.2rem,4vw,4rem);line-height:1;margin:.6rem 0;background:linear-gradient(180deg,#fff,#aeb7c2);-webkit-background-clip:text;color:transparent}.section-title p{color:var(--muted);line-height:1.8}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}.card{background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.025));border:1px solid var(--border);border-radius:26px;padding:1.5rem;box-shadow:0 18px 55px rgba(0,0,0,.38);transition:.35s;position:relative;overflow:hidden}.card:before{content:"";position:absolute;inset:-2px;background:linear-gradient(120deg,transparent,rgba(214,168,59,.25),transparent);transform:translateX(-100%);transition:.55s;pointer-events:none}.card:hover{transform:translateY(-8px);border-color:rgba(255,207,103,.7)}.card:hover:before{transform:translateX(100%)}.icon{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#111,#302104,var(--gold));border:1px solid rgba(255,230,160,.4);font-size:1.55rem;margin-bottom:1rem;box-shadow:0 0 24px rgba(214,168,59,.22);position:relative;z-index:2}.services-section{background:linear-gradient(180deg,transparent,rgba(5,10,17,.28),transparent)}.service-cards{align-items:stretch}.service-card{padding:0 1.5rem 1.5rem;display:flex;flex-direction:column}.service-image{height:208px;position:relative;overflow:hidden;margin:0 -1.5rem 1.15rem;border-radius:25px 25px 18px 18px;border-bottom:1px solid rgba(214,168,59,.25);background:#080f18}.service-image:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,9,17,.02) 22%,rgba(4,9,17,.28) 65%,rgba(4,9,17,.92) 100%);pointer-events:none}.service-image img{width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(1.08) contrast(1.04) brightness(1.04);transition:transform .65s ease,filter .45s ease}.service-image-glow{position:absolute;inset:auto -12% -58% 25%;height:72%;background:radial-gradient(ellipse,rgba(214,168,59,.42),transparent 68%);z-index:1;mix-blend-mode:screen;pointer-events:none}.service-card:hover .service-image img{transform:scale(1.08);filter:saturate(1.18) contrast(1.1) brightness(1.1)}.service-card h3,.service-card p,.service-card ul{position:relative;z-index:2}.service-card p,.service-card ul{margin-bottom:0}.service-card .icon{margin-top:-2.35rem;margin-bottom:1rem;align-self:flex-start}.service-card h3{min-height:2.55em;display:flex;align-items:center}.card h3{color:var(--gold2);margin:.5rem 0}.card p,.card li{color:#d7dde5;line-height:1.65}.card ul{padding-left:1.1rem}.split{display:grid;grid-template-columns:.95fr 1.05fr;gap:3rem;align-items:center}.panel{background:var(--panel);border:1px solid var(--border);border-radius:32px;padding:2rem;box-shadow:0 30px 80px rgba(0,0,0,.45)}.panel h3{font-size:2rem;color:var(--gold2);margin-top:0}.panel li{margin:.8rem 0;color:#dce3ec}.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.gallery-item{display:block;position:relative;overflow:hidden;border-radius:26px;border:1px solid var(--border);box-shadow:0 20px 60px rgba(0,0,0,.45);background:#060b12}.gallery-item:after{content:"View";position:absolute;inset:auto 1rem 1rem auto;padding:.5rem .8rem;border-radius:999px;background:rgba(0,0,0,.68);border:1px solid var(--border);color:var(--gold2);font-size:.76rem;font-weight:900;opacity:0;transform:translateY(10px);transition:.35s}.gallery-item:hover:after{opacity:1;transform:none}.gallery img{height:280px;width:100%;object-fit:cover;transition:.55s;filter:saturate(1.05) contrast(1.04)}.gallery-item:hover img{transform:scale(1.08);filter:saturate(1.25) contrast(1.12)}.slider{position:relative;overflow:hidden;border-radius:32px;border:1px solid var(--border)}.slides{display:flex;transition:transform .6s ease}.slide{min-width:100%;height:520px;position:relative}.slide img{width:100%;height:100%;object-fit:cover}.slide span{position:absolute;left:1.3rem;bottom:1.3rem;background:rgba(0,0,0,.65);border:1px solid var(--border);padding:.85rem 1rem;border-radius:999px;color:var(--gold2);font-weight:900}.dots{display:flex;gap:.5rem;margin-top:1rem}.dot{width:11px;height:11px;border-radius:50%;border:1px solid var(--gold);background:transparent;cursor:pointer}.dot.active{background:var(--gold)}.contact{display:grid;grid-template-columns:.9fr 1.1fr;gap:2rem}.contact-card{background:linear-gradient(145deg,rgba(214,168,59,.12),rgba(255,255,255,.03));border:1px solid var(--border);border-radius:30px;padding:2rem}.contact-card a{color:var(--gold2);font-weight:800}.form input,.form textarea,.form select{width:100%;margin-bottom:1rem;padding:1rem 1.1rem;border-radius:16px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:#fff;outline:none}.form textarea{min-height:150px}.form button{border:0;cursor:pointer}.map-pin{height:240px;border-radius:26px;background:radial-gradient(circle at center,rgba(214,168,59,.25),transparent 32%),linear-gradient(135deg,#101820,#05080d);display:grid;place-items:center;border:1px solid var(--border);font-size:4rem}.site-footer{padding:2rem 0;border-top:1px solid rgba(214,168,59,.2);color:var(--muted);background:#03070d}.reveal{opacity:0;transform:translateY(24px);transition:1s}.reveal.visible{opacity:1;transform:none}@keyframes float{50%{transform:translateY(-16px)}}@media(max-width:1100px){.gallery{grid-template-columns:repeat(3,1fr)}}@media(max-width:900px){.menu{display:none;position:absolute;top:80px;left:4%;right:4%;padding:1rem;background:#07101a;border:1px solid var(--border);border-radius:20px;flex-direction:column}.menu.open{display:flex}.menu-toggle{display:block;background:transparent;color:#fff;border:1px solid var(--border);border-radius:10px;padding:.6rem}.hero-grid,.split,.contact{grid-template-columns:1fr}.cards{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr)}.gallery{grid-template-columns:repeat(2,1fr)}.gallery img{height:220px}.slide{height:360px}h1{font-size:3.2rem}}@media(max-width:560px){.gallery{grid-template-columns:1fr}}

/* Service image integration safeguards */
.services-section .service-card .service-image{display:block!important;visibility:visible!important;opacity:1!important;height:220px!important;min-height:220px!important;overflow:hidden!important;background:#080f18!important}
.services-section .service-card .service-image>img{display:block!important;visibility:visible!important;opacity:1!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;position:relative!important;z-index:0!important}
.services-section .service-card .service-image-glow{display:block!important}
@media(max-width:900px){.services-section .service-card .service-image{height:240px!important;min-height:240px!important}}


/* About service-image showcase: replaces the former profile slider */
.about-services-section{padding-top:6.4rem;padding-bottom:6.4rem;background:radial-gradient(circle at 88% 18%,rgba(214,168,59,.12),transparent 31%),linear-gradient(180deg,rgba(255,255,255,.015),rgba(4,9,17,.16));}
.about-services-heading{max-width:780px;margin-bottom:2rem}.about-services-heading p{max-width:760px}
.about-service-showcase{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.15rem;position:relative}
.about-service-tile{margin:0;position:relative;min-height:250px;border-radius:24px;overflow:hidden;border:1px solid rgba(214,168,59,.42);background:#080f18;box-shadow:0 18px 55px rgba(0,0,0,.42);isolation:isolate;transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease}
.about-service-tile:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,8,14,.02) 24%,rgba(3,8,14,.22) 58%,rgba(3,8,14,.92) 100%);z-index:1;pointer-events:none}
.about-service-tile:after{content:"";position:absolute;inset:auto -20% -40% 16%;height:60%;background:radial-gradient(ellipse,rgba(214,168,59,.48),transparent 68%);z-index:2;mix-blend-mode:screen;pointer-events:none}
.about-service-tile img{width:100%;height:100%;min-height:250px;object-fit:cover;object-position:center;filter:saturate(1.1) contrast(1.06) brightness(1.08);transition:transform .7s ease,filter .5s ease}
.about-service-tile figcaption{position:absolute;left:1rem;right:1rem;bottom:1rem;z-index:3;color:#fff7dc;font-size:.92rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;text-shadow:0 2px 12px rgba(0,0,0,.85)}
.about-service-tile:hover{transform:translateY(-7px);border-color:rgba(255,207,103,.82);box-shadow:0 28px 68px rgba(0,0,0,.55),0 0 30px rgba(214,168,59,.13)}
.about-service-tile:hover img{transform:scale(1.075);filter:saturate(1.2) contrast(1.1) brightness(1.1)}
@media(max-width:900px){.about-service-showcase{grid-template-columns:repeat(2,minmax(0,1fr))}.about-service-tile,.about-service-tile img{min-height:235px}}
@media(max-width:560px){.about-services-section{padding-top:4.5rem;padding-bottom:4.5rem}.about-service-showcase{grid-template-columns:1fr}.about-service-tile,.about-service-tile img{min-height:250px}}


/* Version 4.0.0: New unique 8K-style service imagery */
.service-card:nth-child(1) .service-image img,.about-service-tile:nth-child(1) img{object-position:center 52%}
.service-card:nth-child(2) .service-image img,.about-service-tile:nth-child(2) img{object-position:center 48%}
.service-card:nth-child(3) .service-image img,.about-service-tile:nth-child(3) img{object-position:center 45%}
.service-card:nth-child(4) .service-image img,.about-service-tile:nth-child(4) img{object-position:center 50%}
.service-card:nth-child(5) .service-image img,.about-service-tile:nth-child(5) img{object-position:center 50%}
.service-card:nth-child(6) .service-image img,.about-service-tile:nth-child(6) img{object-position:center 52%}
