:root{
    --cream:#f5f4f0;        /* original greige, one shade whiter */
    --cream-2:#e7e6e0;
    --ink:#000000;          /* black */
    --ink-soft:#5f5f5a;
    --navy:#1A1A1A;         /* secondary brand colour: charcoal */
    --white:#ffffff;
    --line:rgba(30,29,26,0.14);
    --line-light:rgba(255,255,255,0.16);
    --gold:#b2935f;
    --logo:'Cinzel', serif;
    --serif:'Playfair Display', serif;       /* ONDA-style headings */
    --body:'Mulish', sans-serif;             /* Claridge's-style longer text */
    --sans:'Archivo', sans-serif;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{background:var(--cream);color:var(--ink);font-family:var(--sans);font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:hidden}
  ::selection{background:var(--navy);color:var(--cream)}
  img{display:block}

  /* ---------- NAV ---------- */
  nav{position:fixed;top:0;left:0;width:100%;z-index:50;display:flex;align-items:center;justify-content:space-between;
      padding:26px clamp(24px,5vw,64px);transition:background .6s ease,padding .6s ease,border-color .6s ease}
  nav.scrolled{background:var(--navy);padding:16px clamp(24px,5vw,64px)}
  .nav-left{display:flex;gap:clamp(18px,2.4vw,40px);align-items:center}
  .nav-left a{font-family:var(--sans);font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#f4f1ea;text-decoration:none;transition:color .35s ease;text-shadow:0 1px 16px rgba(0,0,0,.32)}
  .nav-left a:hover{color:#fff}
  .nav-center{position:absolute;left:50%;transform:translateX(-50%);font-family:var(--logo);font-weight:500;letter-spacing:.34em;font-size:16px;color:#fff;text-indent:.34em;opacity:0;transition:opacity .6s ease;pointer-events:none}
  nav.scrolled .nav-center{opacity:1}
  .enquire{font-family:var(--sans);font-weight:500;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:#f4f1ea;background:transparent;border:1px solid rgba(244,241,234,.4);text-decoration:none;padding:13px 30px;border-radius:3px;transition:background .45s ease,color .45s ease,border-color .45s ease}
  .enquire:hover{background:#f4f1ea;color:var(--navy);border-color:#f4f1ea}

  /* ---------- HERO (unchanged direction) ---------- */
  .hero{position:relative;height:100vh;width:100%;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--navy)}
  .hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .hero-content{position:relative;z-index:2;text-align:center;padding:0 24px}
  @keyframes appear{from{opacity:0}to{opacity:1}}
  @keyframes rule-in{0%{width:0;opacity:0}100%{width:58px;opacity:.7}}
  .wordmark{font-family:var(--logo);font-weight:400;font-size:clamp(2.1rem,6.4vw,5.7rem);line-height:1.08;letter-spacing:.16em;text-indent:.16em;color:#fff;overflow:hidden;padding-bottom:.04em}
  .wordmark .line{display:inline-block;opacity:0;animation:appear 1.8s ease 3.6s forwards}
  .hero-rule{width:0;height:1px;background:var(--gold);margin:30px auto 0;opacity:0;animation:rule-in .9s ease 5s forwards}
  .hero-london{margin-top:24px;font-family:var(--sans);font-weight:400;font-size:15.5px;letter-spacing:.52em;text-transform:uppercase;color:#fff;text-indent:.52em;overflow:hidden;padding-bottom:.2em}
  .hero-london .line{display:inline-block;opacity:0;animation:appear 1.5s ease 5s forwards}

  /* ---------- SHARED ---------- */
  .reveal{opacity:0;transform:translateY(30px);transition:opacity 1.3s cubic-bezier(.2,.7,.2,1),transform 1.3s cubic-bezier(.2,.7,.2,1)}
  .reveal.in{opacity:1;transform:none}
  .kicker{font-family:var(--sans);font-weight:600;font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--ink-soft)}

  /* ---------- 1. CENTERED STATEMENT (The Power Of Connection) ---------- */
  .statement{text-align:center;padding:clamp(60px,10vh,105px) clamp(24px,8vw,40px) clamp(50px,7vh,80px);max-width:1180px;margin:0 auto}
  .statement h2{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,2.9vw,2.55rem);line-height:1.18;letter-spacing:.005em;color:var(--ink)}
  .statement .body{max-width:900px;margin:28px auto 0}
  .statement .body p{font-family:var(--body);font-weight:400;font-size:clamp(15px,1.15vw,16.5px);line-height:1.8;color:var(--ink);margin-top:1.7em;letter-spacing:.004em}
  .statement .body p:first-child{margin-top:0}
  .statement .body p.close{font-family:var(--serif);font-style:italic;font-size:clamp(18px,1.6vw,22px);line-height:1.4;margin-top:2.2em;color:var(--ink);opacity:1}

  /* ---------- 2. SHORT STATEMENT (Hospitality At Heart) ---------- */
  .statement.tight{padding-top:clamp(20px,3.4vh,40px);padding-bottom:calc(clamp(90px,13vh,150px) - 2cm)}
  .statement.tight .body{max-width:880px}

  /* ---------- 3. THREE FEATURE CARDS ---------- */
  .cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;width:min(1232px,calc(100% - 48px));margin:0 auto;padding:0 0 clamp(50px,8vh,90px)}
  .c3{display:block;background:#fff;text-decoration:none;color:var(--ink)}
  .c3 .pic{position:relative;aspect-ratio:1/1;overflow:hidden}
  .c3 .pic img{width:100%;height:100%;object-fit:cover;transform:scale(1.02);transition:transform 7s ease}
  .c3:hover .pic img{transform:scale(1.09)}
  .c3 .pic::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,26,38,.18),rgba(11,26,38,.40))}
  .c3 .word{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;font-family:var(--sans);font-weight:600;font-size:clamp(1.5rem,2.7vw,2.2rem);letter-spacing:.14em;text-indent:.14em;text-transform:uppercase;color:#fff}
  .c3 .cap{display:flex;align-items:center;justify-content:space-between;padding:16px 20px}
  .c3 .cap .lbl{font-family:var(--sans);font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink)}
  .c3 .cap .arr{font-size:16px;color:var(--ink);transition:transform .5s ease}
  .c3:hover .cap .arr{transform:translateX(8px)}

  /* ---------- 4. DISCOVERY DIVIDER ---------- */
  .divider{text-align:center;padding:clamp(30px,5vh,60px) 24px clamp(50px,8vh,90px)}
  .divider .kicker{display:block;margin-bottom:22px;font-family:var(--body);font-weight:400;font-size:14px;letter-spacing:.04em;text-transform:none;color:var(--ink-soft)}
  .divider h2{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,2.9vw,2.55rem);line-height:1.18;color:var(--ink)}
  .divider p{font-family:var(--body);font-weight:400;max-width:900px;margin:28px auto 0;font-size:clamp(15px,1.15vw,16.5px);line-height:1.62;color:var(--ink);letter-spacing:.004em}

  /* ---------- 5. STATS ---------- */
  .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;max-width:1180px;margin:0 auto;padding:clamp(20px,4vh,60px) clamp(24px,6vw,64px) clamp(80px,12vh,140px);text-align:center}
  .stats .n{font-family:var(--serif);font-weight:400;font-size:clamp(2.4rem,4.6vw,3.9rem);line-height:1;color:var(--ink)}
  .stats .l{font-family:var(--sans);font-weight:600;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft);margin-top:18px}

  /* ---------- 6. CAROUSEL ---------- */
  .carousel{position:relative;padding:0 0 clamp(110px,16vh,180px)}
  .track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0;scrollbar-width:none}
  .track::-webkit-scrollbar{display:none}
  .slide{position:relative;flex:0 0 auto;width:clamp(340px,30vw,620px);aspect-ratio:4/3;overflow:hidden;scroll-snap-align:center;display:block;text-decoration:none;color:inherit;cursor:pointer}
  .slide img{width:100%;height:100%;object-fit:cover;transition:transform 7s ease}
  .slide:hover img{transform:scale(1.06)}
  .slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,26,38,.05) 30%,rgba(11,26,38,.55) 100%)}
  .slide .nm{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);z-index:2;text-align:center;font-family:var(--sans);font-weight:500;font-size:clamp(1rem,1.5vw,1.35rem);letter-spacing:.26em;text-indent:.26em;text-transform:uppercase;color:#fff}
  .slide .cat{position:absolute;bottom:30px;left:0;right:0;z-index:2;text-align:center;font-family:var(--sans);font-weight:500;font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:rgba(255,255,255,.85)}
  .car-btn{position:absolute;top:calc(50% - 30px);transform:translateY(-50%);z-index:5;width:54px;height:54px;border-radius:999px;background:var(--cream);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:18px;color:var(--ink);transition:background .3s ease}
  .car-btn:hover{background:#fff}
  .car-prev{left:clamp(10px,2vw,28px)}
  .car-next{right:clamp(10px,2vw,28px)}

  /* ---------- FORMS ---------- */
  .formsec{padding:clamp(100px,15vh,180px) clamp(24px,6vw,64px);border-top:1px solid var(--line)}
  .formsec.dark{background:var(--navy);color:var(--cream);border-top:none}
  .form-head{text-align:center;max-width:720px;margin:0 auto clamp(50px,7vh,76px)}
  .form-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.9rem,2.9vw,2.55rem);line-height:1.18;margin-top:20px;color:inherit}
  .form-head .kicker{color:var(--ink-soft);opacity:1}
  .form-head p{font-family:var(--body);max-width:560px;margin:22px auto 0;font-size:clamp(15px,1.15vw,16.5px);line-height:1.62;color:inherit;opacity:.85}
  form{max-width:840px;margin:0 auto}
  .row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(22px,3vw,44px)}
  .field{margin-bottom:32px}
  .field.full{grid-column:1 / -1}
  .field label{display:block;font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;opacity:.6;margin-bottom:11px}
  .field input,.field textarea{width:100%;background:transparent;border:none;border-bottom:1px solid currentColor;color:inherit;font-family:var(--sans);font-size:15px;padding:10px 0;opacity:.95;transition:opacity .3s}
  .formsec:not(.dark) .field input,.formsec:not(.dark) .field textarea{border-bottom:1px solid var(--line)}
  .field input:focus,.field textarea:focus{outline:none;opacity:1}
  .field textarea{resize:vertical;min-height:80px}
  .submit{margin-top:12px;background:transparent;border:1px solid currentColor;color:inherit;font-family:var(--sans);font-weight:600;font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;padding:17px 46px;cursor:pointer;border-radius:3px;transition:background .4s,color .4s}
  .formsec.dark .submit:hover{background:var(--cream);color:var(--navy)}
  .formsec:not(.dark) .submit:hover{background:var(--navy);color:var(--cream)}
  .form-foot{text-align:center}
  #enquire{border-top:none;background:var(--cream);padding-top:calc(clamp(100px,15vh,180px) - 2.54cm)}
  .enq-card{max-width:920px;margin:0 auto;background:#fff;border:0.5px solid var(--line);border-radius:3px;padding:clamp(44px,5vw,80px) clamp(28px,5vw,72px);box-shadow:0 50px 100px -60px rgba(20,20,20,.45)}
  .enq-card .form-head{margin-bottom:clamp(40px,5vh,60px)}

  /* ---------- FOOTER ---------- */
  footer{background:var(--navy);color:var(--cream);padding:clamp(70px,9vh,110px) clamp(24px,6vw,64px) 46px}
  .f-top{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;flex-wrap:wrap;padding-bottom:54px;border-bottom:1px solid var(--line-light)}
  .f-mark{font-family:var(--logo);font-weight:500;font-size:2.1rem;letter-spacing:.2em;text-indent:.2em;color:var(--cream);text-decoration:none}
  .f-cols{display:flex;gap:clamp(36px,6vw,90px);flex-wrap:wrap}
  .f-col h5{font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;opacity:.55;margin-bottom:16px}
  .f-col a,.f-col p{display:block;font-size:13px;line-height:2.1;color:var(--cream);text-decoration:none;opacity:.85}
  .f-col a:hover{opacity:1}
  .reg-form{display:flex;align-items:center;gap:12px;max-width:360px;margin:22px auto 0;border-bottom:1px solid var(--ink)}
  .reg-form input{flex:1;background:transparent;border:none;font-family:var(--sans);font-size:14px;color:var(--ink);padding:10px 0}
  .reg-form input:focus{outline:none}
  .reg-form input::placeholder{color:var(--ink-soft)}
  .reg-form button{background:none;border:none;font-size:18px;color:var(--ink);cursor:pointer;padding:0 4px;line-height:1}
  .f-brand{display:flex;flex-direction:column;gap:clamp(24px,3.4vw,40px);max-width:330px}
  .f-register{max-width:300px}
  .frlabel{display:block;font-family:var(--sans);font-weight:600;font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,0.55)}
  .frsub{margin-top:13px;font-family:var(--body);font-size:13px;line-height:1.6;color:rgba(255,255,255,0.46)}
  .reg-form.dark{margin:18px 0 0;max-width:300px;border-bottom-color:rgba(255,255,255,0.28)}
  .reg-form.dark input{color:var(--cream)}
  .reg-form.dark input::placeholder{color:rgba(255,255,255,0.42)}
  .reg-form.dark button{color:var(--cream)}
  .f-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:28px;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;opacity:.6}

  @media(max-width:980px){
    .cards3{grid-template-columns:1fr;max-width:560px}
    .stats{grid-template-columns:1fr 1fr;gap:50px 30px}
    .nav-left{display:none}
    .row{grid-template-columns:1fr;gap:0}
  }
  .field select{width:100%;background:transparent;border:none;border-bottom:1px solid var(--line);color:var(--ink);font-family:var(--sans);font-size:15px;padding:9px 0;cursor:pointer;border-radius:0}
  .field select:focus{outline:none;border-bottom-color:var(--ink)}
  .field input[type=date]{color:var(--ink-soft)}
  .tel-row{display:flex;gap:12px;align-items:flex-end}
  .tel-row .dial{flex:0 0 auto;width:auto;max-width:46%;background:transparent;border:none;border-bottom:1px solid var(--line);color:var(--ink);font-family:var(--sans);font-size:15px;padding:9px 0;cursor:pointer;border-radius:0}
  .tel-row .dial:focus{outline:none;border-bottom-color:var(--ink)}
  .tel-row input{flex:1}

  /* ---------- shared enquiry modal (injected from footer.php) ---------- */
  .nav-center{text-decoration:none}
  .hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .enq-overlay{position:fixed;inset:0;z-index:200;background:rgba(20,18,16,.55);display:none;align-items:flex-start;justify-content:center;overflow-y:auto;padding:5vh 20px}
  .enq-overlay.open{display:flex}
  .enq-modal{position:relative;background:var(--cream);width:100%;max-width:860px;padding:clamp(40px,5vw,72px) clamp(28px,5vw,64px);border-radius:3px;box-shadow:0 60px 120px -40px rgba(0,0,0,.5)}
  .enq-modal .form-head{text-align:center;max-width:640px;margin:0 auto clamp(34px,5vh,52px)}
  .enq-close{position:absolute;top:14px;right:20px;background:none;border:none;font-size:28px;line-height:1;color:var(--ink);cursor:pointer;opacity:.55}
  .enq-close:hover{opacity:1}


/* ---------- mobile-native polish (ONDA-style, phones/small tablets) ---------- */
@media(max-width:700px){
  .statement{padding-left:36px;padding-right:36px;padding-top:clamp(68px,10vh,100px);padding-bottom:clamp(68px,10vh,100px)}
  .statement .body{text-align:center;font-size:16px;line-height:1.72;margin-top:24px}
  .statement .body p{margin-bottom:26px}
  .statement .body p:last-child{margin-bottom:0}
  .enq-card{padding:40px 22px}
  .field{margin-bottom:26px}
  .field label{font-size:11px;letter-spacing:.2em;margin-bottom:10px}
  .field input,.field textarea,.field select,.tel-row .dial{font-size:16px;padding:12px 0}
  .submit{width:100%;padding:18px;margin-top:18px}
  .form-head{margin-bottom:42px}
  .form-head h2{font-size:1.9rem;line-height:1.2}
}