*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bd:#2C1A0E;--bm:#5C3317;--be:#F2E8D9;--cr:#F5EDD8;
  --go:#C8956A;--gl:#D4B896;--pk:#E8748A;--mu:#8a5530;
  --pad:40px
}
body{font-family:'Open Sans',sans-serif;background:var(--bd);color:var(--cr);-webkit-text-size-adjust:100%}
img{max-width:100%;height:auto;display:block}

header nav{padding:20px var(--pad);display:flex;align-items:center;border-bottom:.5px solid #3a2510}
.logo{font-size:14px;letter-spacing:3px;text-transform:uppercase;font-weight:400;color:var(--cr)}

.hero{padding:72px var(--pad) 48px;text-align:center}
.hero-inner{max-width:760px;margin:0 auto}
.hero-title{font-size:clamp(32px,5vw,62px);font-weight:700;color:var(--cr);line-height:1.15;margin-bottom:12px}
.hero-sub{font-size:clamp(32px,5vw,62px);font-weight:700;line-height:1.2}
.hl{color:var(--pk)}

.vid-wrap{padding:0 var(--pad) 48px}
.vid-box{max-width:960px;margin:0 auto;border-radius:16px;overflow:hidden}

.cta-wrap{padding:0 var(--pad) 64px;text-align:center}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:18px 64px;background:var(--pk);color:var(--bd);font-family:inherit;font-size:14px;letter-spacing:2.5px;text-transform:uppercase;font-weight:900;border:none;border-radius:50px;cursor:pointer;text-decoration:none;min-height:48px;-webkit-appearance:none;touch-action:manipulation}
.btn:hover{opacity:.88}
.btn:focus-visible{outline:3px solid var(--pk);outline-offset:4px}
.btn:active{opacity:.75}

.vtesti{padding:0 var(--pad) 80px}
.vtesti-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:960px;margin:0 auto}
.vt-thumb{border-radius:16px;overflow:hidden}
.vt-label{padding:16px 4px 0}
.vt-name{font-size:15px;font-weight:700;color:var(--cr);margin-bottom:4px}
.vt-role{font-size:12px;color:var(--go)}
.vt-brands{font-size:11px;color:var(--mu);margin-top:4px;letter-spacing:1px;text-transform:uppercase}

.logos{background:#000;border-top:.5px solid #111;border-bottom:.5px solid #111;padding:28px var(--pad)}
.logos-row{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px}
.logo-slot{height:80px;display:flex;align-items:center;justify-content:center;padding:0 16px}
.logo-slot img{max-width:120px;object-fit:contain}

.filter{background:var(--bm);padding:80px var(--pad)}
.filter-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;max-width:860px;margin:0 auto}
.f-label{font-size:22px;font-weight:700;text-transform:uppercase;color:var(--go);margin-bottom:20px}
.f-title{font-size:20px;font-weight:400;color:var(--cr);line-height:1.35;margin-bottom:28px}
.f-item{font-size:14px;line-height:1.75;color:var(--gl);margin-bottom:14px}

.testi{background:var(--be);padding:80px var(--pad)}
.testi-grid{column-count:3;column-gap:20px;max-width:1000px;margin:0 auto}
.card{background:#111;border-radius:12px;padding:24px;margin-bottom:20px;break-inside:avoid;display:flex;flex-direction:column;gap:10px}
.card-head{display:flex;align-items:center;gap:12px}
.avatar{width:48px;height:48px;border-radius:50%;flex-shrink:0;overflow:hidden;display:flex;align-items:center;justify-content:center}
.avatar span{font-size:16px;font-weight:700}
.avatar img{width:100%;height:100%;object-fit:cover}
.c-name{font-size:13px;font-weight:600;color:#fff}
.c-role{font-size:11px;color:var(--go);margin-top:2px}
.stars{color:#F5B731;font-size:14px;letter-spacing:2px}
.c-ttl{font-size:12px;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.5px}
.c-txt{font-size:13px;line-height:1.8;color:#fff}

.closing{padding:80px var(--pad) 100px;text-align:center;border-top:.5px solid #3a2510}
.closing-txt{font-size:clamp(18px,2.5vw,22px);line-height:2;color:var(--mu);max-width:520px;margin:0 auto 48px}
.closing-txt em{color:var(--cr);font-style:normal}
.closing-note{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--mu);margin-top:28px}

#cal-inline{max-width:900px;margin:0 auto 48px;border-radius:8px;overflow:hidden}

@media(max-width:768px){
  .testi-grid{column-count:2}
}
@media(max-width:640px){
  :root{--pad:20px}
  .vtesti-grid,.filter-grid{grid-template-columns:1fr}
  .hero{padding-top:48px;padding-bottom:32px}
  .btn{padding:16px 40px;font-size:13px;letter-spacing:2px}
  .logo-slot{padding:0 8px}
  .logo-slot img{max-width:80px}
  .f-label{font-size:18px}
  .f-title{font-size:17px}
  .filter-grid{gap:40px}
}
@media(max-width:400px){
  .testi-grid{column-count:1}
  .vid-box,.vt-thumb{border-radius:10px}
}
@media(prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
}