*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{--s:#F0F4F8;--sd:#D8E2EC;--c:#1a1a1a;--g:#5a6370;--a:#E8860D;--al:#F0A040;--b:#2B6CB0;--bl:#4A90D0;--w:#fff;--f:'DM Sans',sans-serif;--d:'Playfair Display',serif}
html{scroll-behavior:smooth}
body{font-family:var(--f);color:var(--c);background:var(--w);line-height:1.6;-webkit-font-smoothing:antialiased}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:1.25rem 2rem;display:flex;align-items:center;justify-content:space-between;transition:all .4s}
nav.scrolled{background:rgba(255,255,255,.92);backdrop-filter:blur(12px);box-shadow:0 1px 0 rgba(0,0,0,.06)}
.logo{text-decoration:none;display:flex;align-items:center}
.logo-full{height:60px;width:auto;display:block}
.logo-mark{height:36px;width:auto;display:none}
.nav-links{display:flex;gap:3rem;list-style:none;margin:0;padding:0}
.nav-links a{text-decoration:none;font-size:.8rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.85);transition:color .3s}
nav.scrolled .nav-links a{color:var(--g)}
nav.scrolled .nav-links .nav-cta{color:var(--w)!important}
.mt span{display:block;width:100%;height:2px;background:#fff;position:absolute;left:0;transition:all .3s}
nav.scrolled .mt span{background:var(--c)}
.nav-links a:hover{color:var(--c)}
.nav-cta{background:var(--c)!important;color:var(--w)!important;padding:.6rem 1.4rem;border-radius:4px}
.nav-cta:hover{background:var(--a)!important}
.mt{display:none;background:none;border:none;cursor:pointer;width:28px;height:20px;position:relative;z-index:101}
.mt span:nth-child(1){top:0}.mt span:nth-child(2){top:9px}.mt span:nth-child(3){top:18px}
.mt.open span:nth-child(1){top:9px;transform:rotate(45deg)}.mt.open span:nth-child(2){opacity:0}.mt.open span:nth-child(3){top:9px;transform:rotate(-45deg)}
.mt.open{position:fixed;top:1rem;left:1.5rem;z-index:9999}.mt.open span{background:#1a1a1a}

/* HERO PARALLAX */
.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:8rem 2rem 6rem;position:relative;overflow:hidden}
.hero-bg{position:absolute;top:0;left:0;right:0;bottom:0;background-size:cover;background-position:center;transform:translateZ(0)}
@media(min-width:901px) and (hover:hover){.hero-bg,.hero-slide{background-attachment:fixed;will-change:transform;-webkit-backface-visibility:hidden}}
.hero-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(26,26,26,.75),rgba(26,26,26,.65))}
.htag{font-size:.75rem;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:var(--b);margin-bottom:2rem;position:relative;z-index:1;opacity:0;animation:fu .8s .2s forwards}
.hero h1{font-family:var(--d);font-size:clamp(2.5rem,6vw,4.5rem);font-weight:400;line-height:1.15;max-width:700px;position:relative;z-index:1;opacity:0;animation:fu .8s .4s forwards}
.hero>p{margin-top:1.5rem;font-size:1.05rem;color:var(--g);max-width:480px;font-weight:300;line-height:1.7;position:relative;z-index:1;opacity:0;animation:fu .8s .6s forwards}
.hb{margin-top:2.5rem;display:flex;gap:1rem;position:relative;z-index:1;opacity:0;animation:fu .8s .8s forwards}
@keyframes fu{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.btn{display:inline-block;padding:.9rem 2.2rem;font-family:var(--f);font-size:.8rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border-radius:4px;transition:all .3s;border:none;cursor:pointer}
.bp{background:var(--c);color:var(--w)}.bp:hover{background:var(--a)}
.bo{background:transparent;color:var(--c);border:1px solid var(--c)}.bo:hover{background:var(--c);color:var(--w)}

/* SECTIONS */
section{padding:7rem 2rem}.con{max-width:1100px;margin:0 auto}
.st{font-size:.7rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--b);margin-bottom:1rem}
.sh{font-family:var(--d);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:400;line-height:1.25;margin-bottom:1.2rem}
.sp{color:var(--g);font-weight:300;font-size:1rem;line-height:1.8;max-width:560px}

/* ABOUT */
.about .ag{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.av{position:relative}
.av .shape{width:100%;aspect-ratio:4/5;background:var(--s);border-radius:200px 200px 12px 12px;display:flex;align-items:center;justify-content:center}
.av .sn{font-family:var(--d);font-size:4rem;color:var(--a)}.av .sl{font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:var(--g);margin-top:.5rem}
.av .badge{position:absolute;bottom:-1rem;right:-1rem;background:var(--c);color:var(--w);padding:1.2rem 1.6rem;border-radius:8px;text-align:center}
.badge .bn{font-family:var(--d);font-size:1.6rem}.badge .bt{font-size:.65rem;letter-spacing:.15em;text-transform:uppercase;opacity:.7}
.vals{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:2.5rem}
.vi{padding:1.2rem 0;border-top:1px solid var(--sd)}.vi h4{font-size:.9rem;font-weight:500;margin-bottom:.3rem}.vi p{font-size:.82rem;color:var(--g);font-weight:300;line-height:1.5}

/* VICTOR */
.victor{background:var(--c);color:var(--w);padding:7rem 2rem}
.victor-grid{display:grid;grid-template-columns:320px 1fr;gap:4rem;align-items:start}
.victor-photo{position:sticky;top:6rem}
.victor-placeholder{width:100%;aspect-ratio:3/4;background:linear-gradient(135deg,#2a2a2a,#333);border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:1.5rem}
.victor-placeholder span{font-family:var(--d);font-size:5rem;color:var(--a);opacity:.3}
.victor-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}
.vstat{text-align:center;background:rgba(255,255,255,.05);border-radius:8px;padding:.8rem .5rem}
.vstat strong{display:block;font-family:var(--d);font-size:1.1rem;color:var(--w)}
.vstat small{font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.4);font-weight:300}
.victor-text .st{color:var(--bl)}
.victor-text .sh{color:var(--w)}
.victor-text .sp{color:rgba(255,255,255,.6);max-width:none}
.victor-quote{margin:2rem 0;padding:1.5rem 2rem;border-left:3px solid var(--a);font-family:var(--d);font-size:1.1rem;font-style:italic;color:rgba(255,255,255,.75);line-height:1.7}
.victor-quote cite{display:block;margin-top:.8rem;font-family:var(--f);font-size:.78rem;font-style:normal;color:var(--al);letter-spacing:.05em}

/* SERVICES */
.services{background:var(--s)}
.sc{text-align:center;margin-bottom:4rem}.sc .sp{margin:0 auto}
.sg{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}
.card{position:relative;overflow:hidden;background:var(--w);border-radius:8px;transition:transform .3s,box-shadow .3s;text-decoration:none;color:var(--c);display:flex;flex-direction:column;cursor:pointer}
.card-img{width:100%;height:240px;min-height:240px;flex-shrink:0;background-size:cover;background-position:center;transition:transform .5s}
.card-body{padding:1.5rem 2rem 2rem}
.card::before,.card::after{display:none}
.card:hover,.card.in-view{transform:translateY(-4px);box-shadow:0 20px 40px rgba(0,0,0,.06)}
.card:hover .card-img,.card.in-view .card-img{transform:scale(1.05)}
.card>*{position:relative;z-index:1}
.ci{width:48px;height:48px;border-radius:50%;background:var(--s);display:flex;align-items:center;justify-content:center;margin-bottom:1rem}
.ci svg{width:22px;height:22px;stroke:var(--b);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.card h3{font-family:var(--d);font-size:1.2rem;font-weight:500;margin-bottom:.8rem}.card p{font-size:.88rem;color:var(--g);font-weight:300;line-height:1.7}
.card .arrow{display:inline-flex;align-items:center;gap:.4rem;margin-top:1rem;font-size:.78rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--a)}
.card .arrow svg{width:14px;height:14px;stroke:var(--a);fill:none;stroke-width:2;transition:transform .3s}
.card:hover .arrow svg,.card.in-view .arrow svg{transform:translateX(4px)}

/* PROCESS */
.process{background:var(--c);color:var(--w)}.process .sh{color:var(--w)}.process .sp{color:rgba(255,255,255,.5)}
.pc{text-align:center;margin-bottom:4rem}.pc .sp{margin:0 auto}
.ps{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem}
.step{text-align:center}.step .num{font-family:var(--d);font-size:2.5rem;color:var(--b);opacity:.5;margin-bottom:1rem}
.step h4{font-size:.9rem;font-weight:500;margin-bottom:.6rem}.step p{font-size:.82rem;color:rgba(255,255,255,.45);font-weight:300;line-height:1.6}

/* REVIEWS */
.revs{background:var(--w)}.rh{text-align:center;margin-bottom:2rem}.rh .sp{margin:0 auto}
.mbb{display:flex;align-items:center;justify-content:center;gap:1.2rem;margin:2rem auto 3.5rem;padding:1.2rem 2rem;background:var(--s);border-radius:12px;max-width:480px}
.mbb .ml{display:flex;align-items:center;gap:.6rem}.mbb .ml svg{width:28px;height:28px}.mbb .ml span{font-weight:600;font-size:.85rem}
.mbd{width:1px;height:32px;background:var(--sd)}
.mbb .mr{display:flex;align-items:center;gap:.6rem}
.ms{font-family:var(--d);font-size:1.6rem;font-weight:500}.mds{color:var(--a);font-size:.75rem;letter-spacing:.1em;line-height:1;margin-bottom:.15rem}.mc{font-size:.72rem;color:var(--g);font-weight:300}
.tg{display:grid;grid-template-columns:1fr 1fr;gap:2rem}
.tc{background:var(--s);padding:2.5rem;border-radius:8px;position:relative}
.tc::before{content:'\201C';font-family:var(--d);font-size:5rem;color:var(--b);opacity:.2;position:absolute;top:.5rem;left:1.5rem;line-height:1}
.tc blockquote{font-size:.95rem;line-height:1.8;font-weight:300;font-style:italic;margin-bottom:1.5rem;position:relative;z-index:1}
.ta{display:flex;align-items:center;gap:.8rem}
.ta .av2{width:40px;height:40px;border-radius:50%;background:var(--a);display:flex;align-items:center;justify-content:center;color:var(--w);font-weight:500;font-size:.85rem;flex-shrink:0}
.ta .nm{font-weight:500;font-size:.88rem}.ta .loc{font-size:.78rem;color:var(--g);font-weight:300}.ta .src{font-size:.7rem;color:var(--b);font-weight:400;margin-top:.1rem}
.stars{color:var(--a);font-size:.85rem;margin-bottom:1rem;letter-spacing:.15em}
.mcta{text-align:center;margin-top:3rem}
.mcta a{display:inline-flex;align-items:center;gap:.5rem;font-size:.82rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--a);text-decoration:none;padding:.7rem 1.6rem;border:1px solid var(--a);border-radius:4px;transition:all .3s}
.mcta a:hover{background:var(--a);color:var(--w)}.mcta a svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}

/* CONTACT FORM */
.contact-form{max-width:600px;margin:2.5rem auto 0}
.form-row{margin-bottom:1.2rem}
.form-row label{display:block;font-size:.75rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:.5rem}
.form-row input,.form-row textarea{width:100%;padding:.9rem 1rem;font-family:var(--f);font-size:.9rem;border:1px solid rgba(255,255,255,.15);border-radius:6px;background:rgba(255,255,255,.08);color:var(--w);transition:border-color .3s}
.form-row input:focus,.form-row textarea:focus{outline:none;border-color:var(--al)}
.form-row textarea{resize:vertical;min-height:120px}
.hp{position:absolute;left:-9999px;opacity:0;height:0;width:0}
.form-msg{text-align:center;padding:1rem;border-radius:6px;margin-bottom:1.5rem;font-size:.9rem}
.form-msg.ok{background:rgba(232,134,13,.15);color:var(--a)}
.form-msg.err{background:rgba(200,50,50,.2);color:#e88}

/* AREA */
.area{background:var(--s)}.ai{text-align:center}
.at{display:flex;flex-wrap:wrap;justify-content:center;gap:.8rem;margin-top:2rem}
.atag{padding:.5rem 1.2rem;background:var(--w);border-radius:100px;font-size:.82rem;color:var(--g);transition:all .3s}.atag:hover{background:var(--c);color:var(--w)}

/* CTA */
.cta{background:var(--c);color:var(--w);text-align:center}.cta .sh{color:var(--w)}.cta .sp{color:rgba(255,255,255,.5);margin:0 auto 2.5rem}
.cd{display:flex;justify-content:center;gap:3rem;margin-top:2.5rem;flex-wrap:wrap}
.ci2{text-align:center}.ci2 .lb{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:.4rem}
.ci2 a,.ci2 p{color:var(--w);text-decoration:none;font-size:.95rem;font-weight:300;transition:color .3s}.ci2 a:hover{color:var(--al)}
footer{background:#111;color:rgba(255,255,255,.35);padding:2.5rem 2rem;text-align:center;font-size:.78rem;font-weight:300}
footer a{color:rgba(255,255,255,.5);text-decoration:none}
.sup-strip{padding:4rem 0;background:var(--w);border-top:1px solid var(--sd);border-bottom:1px solid var(--sd);overflow:hidden}
.sup-header{text-align:center;margin-bottom:2.5rem;padding:0 2rem}
.marquee{position:relative;width:100%;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.marquee-track{display:flex;gap:4rem;width:max-content;animation:scroll 30s linear infinite}
.marquee-track:hover{animation-play-state:paused}
@keyframes scroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.sup-logo{display:flex;flex-direction:column;align-items:center;gap:.3rem;text-decoration:none;opacity:.45;transition:opacity .4s;flex-shrink:0}.sup-logo:hover{opacity:1}
.sup-logo img,.sup-logo svg{height:40px;width:auto}
.sup-logo span{font-size:.65rem;color:var(--g);font-weight:300;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.lightbox{display:none;position:fixed;top:0;left:0;right:0;bottom:0;z-index:300;background:rgba(0,0,0,.92);align-items:center;justify-content:center;backdrop-filter:blur(4px)}.lightbox.active{display:flex}
.lb-img{max-width:90vw;max-height:85vh;object-fit:contain;border-radius:4px}
.lb-close{position:absolute;top:1.5rem;right:2rem;background:none;border:none;color:var(--w);font-size:2rem;cursor:pointer;opacity:.6}.lb-close:hover{opacity:1}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--w);font-size:2.5rem;cursor:pointer;opacity:.4;padding:1rem}.lb-nav:hover{opacity:1}.lb-prev{left:1rem}.lb-next{right:1rem}
.lb-counter{position:absolute;bottom:1.5rem;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.5);font-size:.8rem}
.proj-card{cursor:pointer}.proj-card img{transition:transform .3s}.proj-card:hover img{transform:scale(1.03)}

/* SERVICE DETAIL PAGE */
.svc-hero{padding:10rem 2rem 5rem;background:var(--s);text-align:center}
.svc-hero .ci{margin:0 auto 1.5rem;width:64px;height:64px}
.svc-hero .ci svg{width:30px;height:30px}
.svc-body{padding:5rem 2rem}
.svc-body .con{max-width:800px}
.svc-body .desc{font-size:1.05rem;color:var(--g);line-height:1.9;font-weight:300;margin-bottom:3rem}
.svc-includes{margin-bottom:3rem}
.svc-includes h3{font-family:var(--d);font-size:1.3rem;margin-bottom:1.5rem}
.svc-includes ul{list-style:none}
.svc-includes li{padding:.8rem 0;border-bottom:1px solid var(--sd);font-size:.92rem;color:var(--g);font-weight:300;padding-left:1.5rem;position:relative}
.svc-includes li::before{content:'✓';position:absolute;left:0;color:var(--a);font-weight:600}
.svc-meta{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:3rem}
.svc-meta-card{background:var(--s);padding:1.5rem;border-radius:8px}
.svc-meta-card .label{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--a);margin-bottom:.3rem}
.svc-meta-card .value{font-family:var(--d);font-size:1.2rem}
.back-link{display:inline-flex;align-items:center;gap:.5rem;font-size:.8rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--b);text-decoration:none;margin-bottom:2rem;background:var(--w);padding:.6rem 1.4rem;border-radius:100px;box-shadow:0 2px 12px rgba(0,0,0,.06);transition:all .3s}
.back-link:hover{background:var(--c);color:var(--w)}
.back-link svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}

/* ADMIN */
.admin-wrap{max-width:900px;margin:0 auto;padding:6rem 2rem 3rem}
.admin-card{background:var(--s);border-radius:8px;padding:2rem;margin-bottom:1.5rem}
.admin-card h3{font-family:var(--d);font-size:1.1rem;margin-bottom:1rem}
.admin-table{width:100%;border-collapse:collapse;font-size:.85rem}
.admin-table th{text-align:left;padding:.6rem;font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;color:var(--a);border-bottom:2px solid var(--sd)}
.admin-table td{padding:.6rem;border-bottom:1px solid var(--sd);vertical-align:top}
.admin-table .actions a{margin-right:.5rem;font-size:.78rem;color:var(--a);text-decoration:none}
.admin-table .actions a:hover{color:var(--c)}
.admin-table .actions a.del{color:#c44}
.admin-form input,.admin-form textarea,.admin-form select{width:100%;padding:.7rem;font-family:var(--f);font-size:.88rem;border:1px solid var(--sd);border-radius:4px;margin-bottom:.8rem;background:var(--w)}
.admin-form textarea{min-height:80px;resize:vertical}
.admin-btn{display:inline-block;padding:.6rem 1.4rem;font-size:.78rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;border:none;border-radius:4px;cursor:pointer;transition:all .3s;font-family:var(--f)}
.admin-btn-p{background:var(--c);color:var(--w)}.admin-btn-p:hover{background:var(--a)}
.admin-btn-s{background:var(--sd);color:var(--c)}.admin-btn-s:hover{background:var(--a);color:var(--w)}
.admin-nav{display:flex;gap:1.5rem;margin-bottom:2rem;border-bottom:1px solid var(--sd);padding-bottom:1rem}
.admin-nav a{font-size:.8rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--g);text-decoration:none;padding-bottom:1rem;border-bottom:2px solid transparent;margin-bottom:-1.05rem}
.admin-nav a:hover,.admin-nav a.active{color:var(--c);border-bottom-color:var(--a)}
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--s)}
.login-box{background:var(--w);padding:3rem;border-radius:12px;width:100%;max-width:380px;box-shadow:0 20px 60px rgba(0,0,0,.08)}
.login-box h2{font-family:var(--d);text-align:center;margin-bottom:2rem}
.badge-unread{background:var(--a);color:var(--w);font-size:.65rem;padding:.15rem .5rem;border-radius:100px;margin-left:.3rem}

/* RESPONSIVE */
@media(max-width:900px){nav{display:grid;grid-template-columns:40px 1fr 40px;align-items:center;padding:1rem 1.5rem}.logo{justify-self:center;order:2}.logo-full{display:none}.logo-mark{display:block}.mt{display:block;order:1;justify-self:start}.nav-links{display:none;order:3}.nav-links.open{display:flex!important;flex-direction:column;position:fixed;top:0;left:0;right:0;bottom:0;width:100vw;height:100vh;background:#ffffff;justify-content:center;align-items:center;gap:2rem;z-index:9998;overflow:hidden}.nav-links.open li{list-style:none}.nav-links.open a{font-size:1.2rem;color:#1a1a1a!important;text-decoration:none}.nav-links.open a.nav-cta{color:#ffffff!important;background:#1a1a1a;padding:.9rem 2.5rem;border-radius:4px;font-size:1rem}.about .ag{grid-template-columns:1fr;gap:3rem}.sg,.tg{grid-template-columns:1fr}.ps{grid-template-columns:1fr 1fr}.vals{grid-template-columns:1fr}.mbb{flex-wrap:wrap}.svc-meta{grid-template-columns:1fr}}
@media(max-width:600px){section{padding:5rem 1.5rem}.hero{padding:7rem 1.5rem 5rem}.hb{flex-direction:column;align-items:center}.ps{grid-template-columns:1fr}.cd{flex-direction:column;gap:1.5rem}}
