/*
Theme Name: Gavel Property Auctions
Theme URI: https://gavelpropertyauctions.co.uk
Author: Gable Property Group Limited
Description: Custom theme for Gavel Property Auctions. Works with the Property Hive plugin for listings.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: gavel
*/

:root{--navy:#0B1420;--navy2:#1B2B42;--line:#2A3A52;--gold:#C8A45C;--gold-dk:#7A5C1E;--gold-lt:#E6CF9A;--ink:#111827;--mute:#4A5565;--soft:#F4F5F7;--rule:#E3E6EB;--field:#C9CFD8;--pale:#D5DCE6;--paler:#B6C0CE;--slate:#5B6B82}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,sans-serif;color:var(--ink);background:#fff;font-size:16px;line-height:1.5;overflow-x:clip}
a{color:inherit;text-decoration:none}
a:hover{opacity:.85}
img{max-width:100%;display:block}
input,select,button,textarea{font-family:inherit;font-size:16px}
.serif{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600}
.wrap{max-width:1240px;margin:0 auto;padding-left:24px;padding-right:24px}
.eyebrow{margin:0 0 8px;font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-dk);font-weight:600}
.h2{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;font-size:clamp(40px,4.6vw,66px);letter-spacing:-.01em;line-height:1}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 26px;border-radius:2px;font-weight:700;border:1px solid transparent;cursor:pointer;transition:transform .25s ease;font-size:16px}
.btn:hover{opacity:1;transform:translateY(-3px)}
.btn-gold{background:var(--gold);color:var(--navy)}
.btn-navy{background:var(--navy);color:#fff}
.btn-ghost{border-color:var(--slate);color:#fff;font-weight:600}
.btn-line{border-color:var(--navy);color:var(--navy);font-weight:600}
.btn-light{border-color:var(--field);font-weight:600}
.lbl{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:var(--mute)}
.fld{height:48px;padding:0 14px;border:1px solid var(--field);border-radius:2px;width:100%;background:#fff;color:var(--ink)}
textarea.fld{height:auto;padding:12px 14px;resize:vertical}
.ph{background:repeating-linear-gradient(135deg,#E6EAF0 0 14px,#DDE2E9 14px 28px);display:flex;align-items:center;justify-content:center;color:var(--mute);font-size:12px;letter-spacing:.1em;text-transform:uppercase}
.ph img{width:100%;height:100%;object-fit:cover}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:16px;z-index:100;background:#fff;padding:10px 14px}

/* header */
.site-head{background:var(--navy);color:#fff;position:relative;z-index:5}
.site-head .wrap{padding-top:20px;padding-bottom:20px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px}
.logo{display:flex;flex-direction:column;align-items:center;gap:6px;line-height:1}
.logo .w{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;font-size:32px;letter-spacing:.2em;padding-left:.2em}
.logo .r{display:flex;align-items:center;gap:6px}
.logo .r i{width:38px;height:1px;background:#fff}
.logo .r b{width:6px;height:6px;border-radius:50%;background:var(--gold)}
.logo .s{font-size:8px;font-weight:600;letter-spacing:.42em;padding-left:.42em;text-transform:uppercase}
.nav{display:flex;flex-wrap:wrap;gap:4px 28px;font-size:15px;font-weight:500}
.nav a{padding:12px 0;border-bottom:2px solid transparent}
.nav a.on{border-bottom-color:var(--gold)}
.head-cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.head-cta .btn{min-height:44px;padding:0 18px;font-size:15px}

/* footer */
.site-foot{background:var(--navy);color:var(--pale);font-size:15px}
.site-foot .wrap{padding-top:80px;padding-bottom:32px}
.big-logo{display:flex;flex-direction:column;align-items:center;gap:16px;color:#fff;margin-bottom:64px;line-height:1}
.big-logo .w{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;font-size:clamp(64px,15vw,220px);letter-spacing:.2em;padding-left:.2em}
.big-logo .r{display:flex;align-items:center;gap:16px}
.big-logo .r i{width:clamp(60px,14vw,220px);height:2px;background:#fff}
.big-logo .r b{width:16px;height:16px;border-radius:50%;background:var(--gold)}
.big-logo .s{font-size:clamp(10px,1.4vw,18px);font-weight:600;letter-spacing:.5em;padding-left:.5em}
.foot-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:40px}
.foot-cols div{display:flex;flex-direction:column;gap:4px}
.foot-cols strong{color:#fff;margin-bottom:6px}
.foot-cols a,.foot-cols span{padding:6px 0}
.legal{margin:48px 0 0;padding-top:24px;border-top:1px solid var(--line);font-size:13px;color:var(--paler)}

/* motion */
@keyframes gv-rise{from{opacity:0;transform:translateY(44px)}to{opacity:1;transform:none}}
@keyframes gv-strike{0%{transform:rotateZ(52deg)}10%{transform:rotateZ(0)}14%{transform:rotateZ(8deg)}18%{transform:rotateZ(0)}36%{transform:rotateZ(0)}64%{transform:rotateZ(52deg)}100%{transform:rotateZ(52deg)}}
@keyframes gv-ring{0%,9%{opacity:0;transform:rotateX(72deg) scale(.2)}10%{opacity:.95;transform:rotateX(72deg) scale(.3)}42%,100%{opacity:0;transform:rotateX(72deg) scale(3.2)}}
@keyframes gv-jolt{0%,9%{transform:none}11%{transform:translateY(7px)}16%,100%{transform:none}}
@keyframes gv-pulse{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes gv-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.gv-line{display:block;animation:gv-rise 1s cubic-bezier(.2,.7,.1,1) both}
.js .reveal{opacity:0;transform:translateY(36px)}
.reveal.in{opacity:1;transform:none;transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.1,1)}
.card{display:flex;flex-direction:column;border:1px solid var(--rule);border-radius:3px;overflow:hidden;background:#fff;transition:opacity .9s ease,transform .5s cubic-bezier(.2,.7,.1,1),box-shadow .5s ease,border-color .5s ease}
.card:hover{transform:perspective(900px) rotateX(4deg) rotateY(-5deg) translateY(-10px);box-shadow:0 34px 60px rgba(11,20,32,.22);border-color:var(--gold)}
.cursor{position:fixed;left:0;top:0;z-index:60;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--gold);pointer-events:none;opacity:0;transition:opacity .3s,width .25s,height .25s,margin .25s}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.js .reveal{opacity:1;transform:none}.cursor{display:none}}

/* hero */
.hero{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.hero-in{position:relative;z-index:1;padding-top:48px;padding-bottom:150px;display:flex;flex-wrap:wrap;gap:40px;align-items:center}
.hero h1{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;font-size:clamp(48px,6.8vw,104px);line-height:.96;letter-spacing:-.02em;animation:gv-jolt 4.6s linear infinite}
.scene-wrap{flex:1 1 380px;min-width:0;display:flex;justify-content:center;perspective:1100px}
.scene{position:relative;flex:none;width:440px;height:440px;transform-style:preserve-3d;transform:rotateX(var(--rx,10deg)) rotateY(var(--ry,-26deg));transition:transform .3s ease-out}
.scene .ring{position:absolute;left:62px;top:316px;width:200px;height:200px;border:3px solid var(--gold);border-radius:50%;opacity:0;animation:gv-ring 4.6s linear infinite}
.scene .block{position:absolute;left:42px;top:398px;width:240px;height:30px;border-radius:6px}
.scene .arm{position:absolute;left:150px;top:302px;width:270px;height:20px;transform-origin:100% 50%;transform-style:preserve-3d;animation:gv-strike 4.6s cubic-bezier(.55,0,.9,.5) infinite}
.scene .arm>i{position:absolute;inset:0;border-radius:10px}
.scene .head{position:absolute;left:-32px;top:-66px;width:86px;height:152px;border-radius:10px}
@media (max-width:520px){.scene{transform:scale(.7) rotateX(var(--rx,10deg)) rotateY(var(--ry,-26deg))}.scene-wrap{height:330px}}

.searchbar{background:#fff;border:1px solid var(--rule);border-radius:3px;box-shadow:0 18px 44px rgba(11,20,32,.16);padding:24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;align-items:end}

/* lot cards */
.lots{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:28px}
.lot-ph{position:relative;height:220px}
.lot-type{position:absolute;top:14px;left:14px;background:var(--navy);color:#fff;font-size:12px;font-weight:600;letter-spacing:.04em;padding:6px 10px;border-radius:2px;text-transform:none}
.lot-ends{position:absolute;bottom:14px;left:14px;right:14px;background:var(--navy);color:#fff;padding:9px 12px;border-radius:2px;text-transform:none;letter-spacing:0;display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.lot-ends small{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--paler);font-weight:600}
.lot-ends span{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;font-size:22px;line-height:1;font-variant-numeric:tabular-nums;color:var(--gold-lt)}
.lot-body{padding:20px;display:flex;flex-direction:column;gap:8px;flex:1}
.lot-body .k{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);font-weight:600}
.lot-body .p{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;font-size:36px;line-height:1}
.lot-body .t{font-weight:600;font-size:17px;margin-top:6px}
.lot-body .a{color:var(--mute);font-size:15px}
.lot-body .f{margin-top:auto;padding-top:14px;border-top:1px solid var(--rule);color:var(--mute);font-size:14px}
.lot-btns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:16px}
.lot-btns a{height:46px;display:flex;align-items:center;justify-content:center;border-radius:2px;font-weight:600;font-size:15px}
.empty{border:1px dashed var(--field);padding:48px 24px;text-align:center;color:var(--mute);border-radius:3px}

/* going once */
.call{position:relative;height:2100px;background:var(--navy)}
.call-stage{position:sticky;top:0;height:min(100vh,900px);overflow:hidden;background:var(--navy);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:34px;text-align:center;padding:0 20px}
.phrases{position:relative;z-index:2;width:100%;height:clamp(90px,16vw,230px);font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;font-size:clamp(64px,13vw,210px);line-height:1;letter-spacing:-.02em}
.phrases span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;white-space:nowrap}
.rules{position:relative;z-index:1;display:flex;align-items:center;gap:22px;height:20px}
.rules i{width:180px;height:2px;background:#fff;transform:scaleX(.15)}
.rules i:first-child{transform-origin:100% 50%}.rules i:last-child{transform-origin:0 50%}
.rules b{flex:none;width:20px;height:20px;border-radius:50%;background:var(--gold)}

.marquee{background:var(--navy);color:#fff;overflow:hidden;padding:22px 0}
.marquee div{display:flex;align-items:center;width:max-content;gap:44px;font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:500;font-size:34px;white-space:nowrap;animation:gv-marquee 36s linear infinite}
.marquee b{width:9px;height:9px;border-radius:50%;background:var(--gold)}

.steps{margin:0;padding:0;list-style:none;display:flex;flex-direction:column}
.steps li{display:flex;gap:22px;align-items:baseline;padding:20px 0;border-top:1px solid #D6DAE1}
.steps li:last-child{border-bottom:1px solid #D6DAE1}
.steps .n{flex:none;width:54px;font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:500;font-size:52px;line-height:.8;color:var(--gold-dk)}
.steps strong{display:block;font-size:18px}
.steps span span{color:var(--mute)}

/* property page */
.crumbs{margin:0 0 16px;font-size:14px;color:var(--mute)}
.crumbs a{text-decoration:underline}
.tag{display:inline-block;font-size:12px;font-weight:600;padding:6px 10px;border-radius:2px}
.bidbox{flex:1 1 340px;min-width:0;background:var(--navy);color:#fff;border-radius:3px;padding:28px;display:flex;flex-direction:column;gap:16px}
.bidbox .big{height:58px;display:flex;align-items:center;justify-content:center;border-radius:2px;font-weight:700;font-size:18px}
.timer{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;text-align:center}
.timer div{background:var(--navy2);border-radius:2px;padding:12px 4px}
.timer strong{display:block;font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;font-size:32px;line-height:1}
.timer span{font-size:12px;color:var(--paler)}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:3px;overflow:hidden}
.facts div{background:#fff;padding:18px}
.facts span{display:block;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);font-weight:600}
.facts strong{font-size:20px}
.docs{display:flex;flex-direction:column;border:1px solid var(--rule);border-radius:3px;overflow:hidden}
.docs a,.docs div{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;border-bottom:1px solid var(--rule)}
.docs>*:last-child{border-bottom:0}
.docs small{color:var(--mute);font-size:14px}
.prose{color:#374151;font-size:17px}
.gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.gallery .ph{height:96px;border-radius:3px;overflow:hidden}

/* forms */
.notice{padding:16px 20px;border-radius:3px;margin-bottom:24px;font-weight:600}
.notice.ok{background:#E8F3EC;color:#1D5B33}
.notice.err{background:#FBEAEA;color:#7A1F1F}
.stepper{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.stepper li{padding:12px 14px;border-radius:2px;background:var(--soft);color:var(--mute)}
.stepper li.on{background:var(--navy);color:#fff}
.stepper li.done{background:var(--rule);color:var(--ink)}
.stepper span{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.js .fstep{display:none!important}.js .fstep.on{display:flex!important}
.sig{width:100%;height:180px;border:0;border-bottom:2px solid var(--navy);background:var(--soft);touch-action:none;cursor:crosshair;display:block}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.tile{min-height:64px;padding:14px 18px;border-radius:2px;text-align:left;font-size:17px;font-weight:600;cursor:pointer;background:#111E30;color:#fff;border:1px solid var(--slate)}
.tile.on{background:var(--gold);color:var(--navy);border-color:var(--gold)}
.dk .fld{background:#111E30;color:#fff;border-color:var(--slate)}
details.faq{background:#fff;border:1px solid var(--rule);border-radius:3px;padding:4px 22px}
details.faq summary{padding:16px 0;font-weight:600;font-size:18px;cursor:pointer}
details.faq p{margin:0 0 18px;color:var(--mute)}