@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@600;700&display=swap');
:root{--bg:#070707;--panel:#0e0e0f;--line:#242426;--text:#f5f5f3;--muted:#9b9b9d;--silver:#d8d8d5;--gold:#c9ab72;--max:1180px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:"DM Sans",Arial,sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}.container{width:min(var(--max),calc(100% - 40px));margin:auto}
.nav{position:fixed;z-index:20;top:0;left:0;right:0;padding:18px 0;background:linear-gradient(#070707e8,transparent);backdrop-filter:blur(8px)}
.nav-inner{display:flex;align-items:center;justify-content:space-between}
/* ===== LOGO SIZE: change width/height below to make the logo bigger/smaller ===== */
.logo{width:112px;height:112px;object-fit:contain}
@media(max-width:650px){.logo{width:84px;height:84px}}
.navlinks{display:flex;gap:28px;font-size:13px;text-transform:uppercase;letter-spacing:.13em}.navlinks a{color:#c8c8c8}.navlinks a:hover{color:#fff}
.menu{display:none;border:1px solid #333;background:#111;color:#fff;border-radius:50%;width:42px;height:42px}
.hero{min-height:100svh;display:flex;align-items:center;position:relative;padding:130px 0 90px;overflow:hidden}
.hero:before{content:"";position:absolute;inset:-20%;background:radial-gradient(circle at 72% 42%,#ffffff12 0 1px,transparent 2px),radial-gradient(circle at 28% 68%,#c9ab7210 0 1px,transparent 2px);background-size:32px 32px,44px 44px;mask-image:linear-gradient(to bottom,#000,transparent 90%);animation:drift 18s linear infinite}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center;position:relative}
.kicker{font-size:12px;letter-spacing:.25em;text-transform:uppercase;color:var(--gold);margin-bottom:22px}
h1{font-family:"Playfair Display",serif;font-size:clamp(56px,8vw,116px);line-height:.9;margin:0;letter-spacing:-.055em;font-weight:700}
.gradient{background:linear-gradient(110deg,#fff 15%,#a9a9aa 48%,#fff 78%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{max-width:580px;color:#a8a8aa;font-size:18px;line-height:1.65;margin:30px 0}
.cta-row{display:flex;gap:12px;flex-wrap:wrap}.btn{padding:14px 20px;border:1px solid #444;border-radius:999px;text-transform:uppercase;letter-spacing:.13em;font-size:11px;font-weight:700;transition:transform .15s ease}.btn.primary{background:#f2f2ef;color:#090909;border-color:#f2f2ef}.btn:hover{transform:translateY(-2px)}
.hero-card{min-height:520px;border:1px solid #29292b;border-radius:26px;position:relative;overflow:hidden;background:linear-gradient(145deg,#151516,#080808);box-shadow:0 30px 90px #000}
.hero-card img{width:100%;height:100%;object-fit:cover;opacity:.78;filter:saturate(.7) contrast(1.05)}
.hero-card:after{content:"TARR";position:absolute;inset:auto 22px 20px;font-size:90px;font-weight:700;letter-spacing:-.08em;color:#fff2;line-height:.8}
.floating{position:absolute;background:#101011dd;border:1px solid #353537;border-radius:14px;padding:14px 16px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;backdrop-filter:blur(12px);box-shadow:0 20px 50px #000}.f1{top:10%;right:-8%}.f2{bottom:12%;left:-8%}
section{padding:110px 0;border-top:1px solid #161618}.section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:42px}.eyebrow{color:var(--gold);font-size:11px;letter-spacing:.22em;text-transform:uppercase}.section-head h2{font-family:"Playfair Display";font-size:clamp(38px,5vw,70px);margin:10px 0 0;letter-spacing:-.04em}.section-head p{max-width:430px;color:var(--muted);line-height:1.6}
.services{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.service{min-height:340px;border:1px solid #262628;border-radius:20px;overflow:hidden;position:relative;background:#0c0c0d}.service img{width:100%;height:100%;object-fit:cover;opacity:.52;transition:.6s}.service:hover img{transform:scale(1.07);opacity:.72}.service .overlay{position:absolute;inset:0;background:linear-gradient(transparent 25%,#050505ee 90%)}.service-content{position:absolute;left:22px;right:22px;bottom:22px}.service-num{color:#777;font-size:11px}.service h3{font-size:27px;margin:8px 0}.service p{color:#a5a5a7;font-size:13px;line-height:1.5;margin:0}
.statement{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.statement h2{font-family:"Playfair Display";font-size:clamp(44px,6vw,82px);line-height:.95;letter-spacing:-.05em;margin:0}.statement p{color:#aaa;line-height:1.8;font-size:16px}
.marquee{border-top:1px solid #222;border-bottom:1px solid #222;padding:18px 0;overflow:hidden;white-space:nowrap}.track{display:inline-block;animation:marquee 22s linear infinite;font-size:12px;letter-spacing:.25em;color:#8f8f91;text-transform:uppercase}.dot{color:var(--gold);padding:0 20px}
.work-grid{display:grid;grid-template-columns:1.4fr .8fr;gap:14px}.work{border:1px solid #262628;border-radius:20px;overflow:hidden;position:relative;min-height:340px}.work.big{min-height:560px}.work img{width:100%;height:100%;object-fit:cover;transition:.6s;filter:saturate(.72)}.work:hover img{transform:scale(1.04);filter:saturate(.95)}.work:after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#000)}.work-label{position:absolute;z-index:2;left:24px;bottom:22px}.work-label strong{display:block;font-size:22px}.work-label span{font-size:11px;color:#aaa;letter-spacing:.16em;text-transform:uppercase}
.contact{padding-bottom:130px}.contact-box{border:1px solid #303033;border-radius:28px;padding:60px;background:radial-gradient(circle at 80% 20%,#c9ab7210,transparent 30%),#0c0c0d;display:grid;grid-template-columns:1fr auto;gap:40px;align-items:end}.contact-box h2{font-family:"Playfair Display";font-size:clamp(45px,6vw,85px);line-height:.94;margin:12px 0}.contact-box p{color:#aaa}.contact-info{text-align:right}.contact-info a{display:block;font-size:16px;margin:10px 0;color:#ddd}.footer{border-top:1px solid #1e1e20;padding:26px 0;color:#777;font-size:11px;letter-spacing:.1em;text-transform:uppercase;display:flex;justify-content:space-between}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease}.reveal.show{opacity:1;transform:none}
@keyframes marquee{to{transform:translateX(-50%)}}@keyframes drift{to{transform:translate3d(32px,20px,0)}}
@media(max-width:850px){.navlinks{display:none}.menu{display:block}.hero-grid,.statement,.contact-box{grid-template-columns:1fr}.hero{padding-top:110px}.hero-card{min-height:420px}.floating.f1{right:5%}.floating.f2{left:5%}.services{grid-template-columns:1fr 1fr}.work-grid{grid-template-columns:1fr}.work.big{min-height:430px}.section-head{display:block}.contact-info{text-align:left}}
@media(max-width:520px){.container{width:min(var(--max),calc(100% - 28px))}.services{grid-template-columns:1fr}.service{min-height:300px}.hero p{font-size:16px}.contact-box{padding:34px 24px}.footer{display:block;line-height:2}}

.services-all{grid-template-columns:repeat(2,1fr)}
.services-all .service{min-height:245px}
.services-all .service-content h3{font-size:20px}
.services-all .service-content p{max-width:390px}
.services-all .service:last-child{grid-column:1/-1;min-height:210px}
.services-all .service:last-child h3{color:#d8b873}
@media(max-width:650px){.services-all{grid-template-columns:1fr}.services-all .service:last-child{grid-column:auto}}
.side-tabs{position:fixed;right:18px;top:50%;transform:translateY(-50%);z-index:30;display:flex;flex-direction:column;gap:8px;padding:7px;border:1px solid #2b2b2d;border-radius:18px;background:#090909cc;backdrop-filter:blur(16px);box-shadow:0 18px 55px #0009}.side-tab{width:58px;height:58px;border:1px solid transparent;border-radius:13px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:#777;text-decoration:none;transition:.3s ease}.side-tab span{font-size:8px;letter-spacing:.12em;color:#666}.side-tab b{font-size:8px;letter-spacing:.12em;font-weight:600}.side-tab:hover,.side-tab.active{border-color:#6e5c3d;background:linear-gradient(145deg,#191817,#0b0b0b);color:#e6d1a3;transform:translateX(-3px)}.side-tab.active span{color:#c9ab72}
.side-tabs{max-height:calc(100vh - 28px);overflow:auto;scrollbar-width:none}.side-tabs::-webkit-scrollbar{display:none}.side-action{font-family:inherit;cursor:pointer;background:transparent}
.modal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:20px}.modal.open{display:flex}.modal-backdrop{position:absolute;inset:0;background:#000d;backdrop-filter:blur(10px)}.modal-card{position:relative;z-index:2;width:min(720px,100%);max-height:90vh;overflow:auto;background:#0d0d0e;border:1px solid #39393b;border-radius:24px;padding:34px;box-shadow:0 30px 100px #000}.modal-close{position:absolute;right:18px;top:14px;background:none;border:0;color:#aaa;font-size:32px;cursor:pointer}.modal-card h2{font-family:"Playfair Display",serif;font-size:42px;line-height:1;margin:10px 0}.modal-card p{color:#aaa;line-height:1.6}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin:22px 0}.form-field{display:flex;flex-direction:column;gap:7px}.form-field.full{grid-column:1/-1}.form-field label{font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:#9a9a9c}.form-field input,.form-field select,.form-field textarea{width:100%;border:1px solid #303033;border-radius:12px;background:#121213;color:#eee;padding:13px 14px;font:inherit;outline:none}.form-field textarea{min-height:110px;resize:vertical}.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:#8e774e}.modal-card form>.btn{margin-top:4px}.modal-card small{display:block;color:#777;font-size:10px;line-height:1.5;margin-top:12px}.success{display:none;margin:20px 0;padding:16px;border:1px solid #51462f;border-radius:13px;color:#d7c18f;background:#15130f}.success.show{display:block}.modal-card .btn{display:inline-block;margin-top:10px}
@media(max-width:650px){.form-grid{grid-template-columns:1fr}.form-field.full{grid-column:auto}.modal-card{padding:28px 20px}.modal-card h2{font-size:34px}}

/* TARR right-top menu */
.nav .menu{position:relative;z-index:62;display:flex;align-items:center;justify-content:center;font-size:25px;line-height:1;width:54px;height:54px;border-radius:50%;border:1px solid #343436;background:#0d0d0dcc;color:#f3f1ec;cursor:pointer}
.tarr-menu-backdrop{position:fixed;inset:0;z-index:50;background:#0008;opacity:0;pointer-events:none;transition:.3s ease;backdrop-filter:blur(3px)}
.tarr-menu{position:fixed;z-index:60;right:24px;top:82px;width:min(330px,calc(100vw - 30px));background:#0d0d0deF;border:1px solid #2c2c2e;box-shadow:0 30px 80px #000b;transform:translateY(-12px);opacity:0;pointer-events:none;transition:.32s ease;backdrop-filter:blur(18px)}
.tarr-menu.open{transform:translateY(0);opacity:1;pointer-events:auto}.tarr-menu.open + .tarr-menu-backdrop{opacity:1;pointer-events:auto}
.tarr-menu-head{height:58px;padding:0 18px;border-bottom:1px solid #262628;display:flex;align-items:center;justify-content:space-between;color:#c9ab72;font-size:10px;letter-spacing:.22em}
.tarr-menu-head button{background:none;border:0;color:#ddd;font-size:29px;line-height:1;cursor:pointer}
.tarr-menu-links{display:flex;flex-direction:column;padding:8px 0}.tarr-menu-links a,.menu-form-link{display:flex;align-items:center;width:100%;min-height:55px;padding:0 22px;background:transparent;border:0;color:#ddd;text-decoration:none;font:500 15px "DM Sans",Arial,sans-serif;letter-spacing:.07em;text-align:left;cursor:pointer;transition:.2s ease}
.tarr-menu-links a span,.menu-form-link span{font-size:9px;color:#777;letter-spacing:.12em}.tarr-menu-links a:hover,.menu-form-link:hover{background:#171716;color:#f0d29a;padding-left:26px}.tarr-menu-links a:hover span,.menu-form-link:hover span{color:#c9ab72}
@media(max-width:650px){.tarr-menu{right:12px;top:78px;width:min(310px,calc(100vw - 24px))}.nav .menu{width:50px;height:50px}}

/* Extra mobile optimisation */
@media(max-width:850px){section{padding:72px 0}.hero{min-height:auto}.floating{font-size:10px;padding:11px 13px}}
@media(max-width:520px){h1{font-size:clamp(44px,13vw,64px)}.hero{padding:96px 0 60px}.hero-card{min-height:320px}.hero-card:after{font-size:60px}.cta-row .btn{flex:1 1 auto;text-align:center}.contact-info a{font-size:15px}}
@media(hover:none){.btn:hover,.service:hover img,.work:hover img{transform:none}}
img{max-width:100%}

/* CMS additions */
.logo-text{font-family:"Playfair Display",serif;font-weight:700;font-size:34px;letter-spacing:.02em;color:var(--text)}
@media(max-width:650px){.logo-text{font-size:26px}}
.page-section{padding:130px 0 90px}
.page-section h1{font-family:"Playfair Display",serif;font-size:clamp(38px,6vw,72px);letter-spacing:-.04em;margin:.1em 0 .3em}
.page-section p{color:#aaa;line-height:1.8;font-size:16px;max-width:760px}
.page-text{color:#cfcfcf;line-height:1.85;font-size:16px;white-space:normal}
.footer-links{display:flex;gap:16px;flex-wrap:wrap}
.footer-links a{color:#9b9b9d}.footer-links a:hover{color:var(--gold)}

/* ---- Brands strip ---- */
.brands-section{padding:80px 0;border-top:1px solid #161618;overflow:hidden}
.brands-head{text-align:center;margin-bottom:40px}
.brands-head .eyebrow{color:var(--gold);font-size:11px;letter-spacing:.22em;text-transform:uppercase}
.brands-head h2{font-family:"Playfair Display",serif;font-size:clamp(28px,4vw,52px);letter-spacing:-.03em;margin:10px 0 0}
.brands-marquee{position:relative;width:100%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.brands-track{display:inline-flex;align-items:center;gap:80px;padding:10px 40px;animation:brandscroll 22s linear infinite;white-space:nowrap;will-change:transform}
.brands-marquee:hover .brands-track{animation-play-state:paused}
.brand-item{flex:0 0 auto;height:110px;display:flex;align-items:center;justify-content:center}
.brand-item img{max-height:100px;max-width:240px;width:auto;object-fit:contain;opacity:.95;transition:.35s ease}
.brand-item:hover img{opacity:1;transform:scale(1.06)}
@keyframes brandscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(max-width:650px){.brands-section{padding:56px 0}.brands-track{gap:52px;animation-duration:18s}.brand-item{height:80px}.brand-item img{max-height:72px;max-width:170px}}
@media(prefers-reduced-motion:reduce){.brands-track{animation:none;flex-wrap:wrap;white-space:normal;justify-content:center}}
/* Brands page grid */
.brands-page-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:18px;margin-top:40px}
.brands-page-grid .brand-cell{border:1px solid #262628;border-radius:16px;background:#0c0c0d;height:130px;display:flex;align-items:center;justify-content:center;padding:22px}
.brands-page-grid .brand-cell img{max-height:90px;max-width:100%;object-fit:contain;opacity:.95;transition:.35s}
.brands-page-grid .brand-cell:hover img{opacity:1;transform:scale(1.04)}

/* ---- Our Talents ---- */
.talents-section{padding:90px 0;border-top:1px solid #161618}
.talents-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:20px}
.talent-card{background:#0c0c0d;border:1px solid #262628;border-radius:18px;overflow:hidden;text-align:center;transition:.35s ease}
.talent-card:hover{transform:translateY(-4px);border-color:#3a3a3d}
.talent-photo{aspect-ratio:1/1;overflow:hidden;background:#111}
.talent-photo img{width:100%;height:100%;object-fit:cover;transition:.5s ease;filter:saturate(.85)}
.talent-card:hover .talent-photo img{transform:scale(1.05);filter:saturate(1)}
.talent-info{padding:18px 16px 22px}
.talent-info h3{margin:0;font-size:19px;font-family:"Playfair Display",serif;letter-spacing:-.02em}
.talent-role{color:#8f8f91;font-size:12px;margin:5px 0 8px;text-transform:uppercase;letter-spacing:.1em}
.talent-insta{display:inline-block;margin-top:8px;color:var(--gold);font-size:13px;letter-spacing:.03em}
.talent-insta:hover{color:#fff}
.talents-cta{text-align:center;margin-top:44px}
@media(max-width:900px){.talents-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.talents-grid{grid-template-columns:repeat(2,1fr);gap:14px}.talent-info h3{font-size:16px}}

/* ---- Contact links with icons ---- */
.contact-link{display:inline-flex;align-items:center;gap:10px;color:#ddd;font-size:16px;margin:10px 0;transition:color .25s ease}
.contact-link .ci-icon{flex:0 0 auto;color:var(--gold);transition:transform .25s ease}
.contact-link:hover{color:#fff}
.contact-link:hover .ci-icon{transform:translateY(-1px) scale(1.08)}
.contact-info .btn.primary{margin-top:8px}