/* Pearl, glass and warm gold: the visual language of the clear watch. */
:root {
  --background-50: .99 .004 90;
  --background-100: .965 .008 85;
  --background-200: .94 .012 85;
  --background-300: .88 .02 85;
  --foreground-50: .98 .006 85;
  --foreground-100: .94 .01 85;
  --foreground-200: .86 .015 85;
  --foreground-300: .76 .02 85;
  --foreground-400: .65 .02 85;
  --foreground-500: .53 .02 85;
  --foreground-600: .46 .02 85;
  --foreground-700: .39 .018 85;
  --foreground-800: .32 .015 85;
  --foreground-900: .27 .012 85;
  --foreground-950: .23 .01 85;
  --primary-50: .985 .01 85;
  --primary-100: .965 .02 85;
  --primary-200: .89 .045 85;
  --primary-300: .56 .095 80;
  --primary-400: .61 .10 80;
  --primary-500: .54 .095 80;
  --primary-600: .48 .08 80;
  --primary-700: .43 .075 80;
  --accent-500: .56 .10 75;
  --accent-600: .48 .13 45;
  --secondary-800: .32 .02 85;
  --glass-border: rgb(160 132 76 / .28);
  --glass-shadow: 0 20px 60px rgb(92 76 43 / .07);
}
body { background: #faf9f5; color: #343128; }
.home-atmosphere {
  isolation: isolate;
  background-color: #f7f3ea;
  background-image: radial-gradient(ellipse at 8% 35%, rgb(226 205 153 / .24), transparent 40%), radial-gradient(ellipse at 93% 72%, rgb(231 213 171 / .26), transparent 38%), url('/images/glass-flow.svg');
  background-size: 100% 100%, 100% 100%, 100% 2000px;
  background-repeat: no-repeat, no-repeat, repeat-y;
}
.home-atmosphere > section:not(#top) {
  background-color: rgb(255 255 255 / .2);
  border-top: 1px solid rgb(255 255 255 / .6);
}
.home-atmosphere > section:nth-child(odd):not(#top) { background-color: rgb(255 255 255 / .35); }
.home-atmosphere #story .bg-background-100,
.home-atmosphere #spec-panel > div,
.home-atmosphere #spec-tabs { background: rgb(255 255 255 / .6); }
@media (max-width: 767px) {
  .home-atmosphere { background-size: 100% 100%, 100% 100%, auto 1600px; background-position: center, center, center top; }
}
#top {
  background: radial-gradient(ellipse at 75% 42%, #eee3c7 0, #f7f5ed 34%, #fdfcf9 75%);
}
#top > picture > img { opacity: .9; filter: none; mix-blend-mode: normal; transform: scaleX(-1); }
#top .hero-scrim-b { background: linear-gradient(to bottom, rgb(255 255 255 / .08), rgb(255 255 255 / .2)); }
#top .hero-scrim-l { background: linear-gradient(to right, rgb(252 251 247 / .94) 0%, rgb(252 251 247 / .72) 34%, rgb(252 251 247 / .12) 70%); }
html[dir="rtl"] #top > picture > img { transform: none; }
html[dir="rtl"] #top .hero-scrim-l { background: linear-gradient(to left, rgb(252 251 247 / .94) 0%, rgb(252 251 247 / .72) 34%, rgb(252 251 247 / .12) 70%); }
#top::before {
  display: none;
  content: "";
  position: absolute;
  width: min(46vw, 650px);
  aspect-ratio: 1;
  inset-inline-end: 4%;
  top: 19%;
  border-radius: 50%;
  border: 1px solid rgb(255 255 255 / .8);
  background: linear-gradient(135deg, rgb(255 255 255 / .48), rgb(255 255 255 / .03));
  box-shadow: inset 0 0 70px rgb(255 255 255 / .6), 0 25px 90px rgb(171 147 97 / .08);
}
#top h1 { color: #353128; }
#top h1 span, #top .hero-sub { color: #8b6929; }
#top p.mt-6 { color: #595449; }
.hero-status { color: #70664f; }
#top a[href="#reserve"], #top a[href="#showcase"]:not(.bg-primary-500) { color: #655435; border-color: #baa477; }
#top a.bg-primary-500, .reserve-form button, .custom-button {
  background: linear-gradient(125deg, #e9d49a, #ceb06b);
  color: #382d19;
  box-shadow: 0 7px 20px rgb(163 130 62 / .12);
}
#top a.bg-primary-500:hover, .reserve-form button:hover, .custom-button:hover { background: #e7d09a; }
.hero-product, .custom-hero-figure img { filter: drop-shadow(0 20px 28px rgb(105 91 60 / .12)); }
#site-header {
  background: rgb(255 255 255 / .68) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--glass-border);
}
#site-header nav a { color: #564c39; }
#site-header nav a:hover { color: #88651f; }
#site-header .brand-name { color: #373129; }
.brand-name, html[dir="rtl"] .brand-name {
  display: inline-flex;
  align-items: baseline;
  gap: .3em;
  font-family: var(--font-label, "Montserrat"), sans-serif;
  font-size: 1.1rem;
  font-weight: 400;
  letter-spacing: .045em;
  line-height: 1;
  direction: ltr;
  unicode-bidi: isolate;
  text-transform: none;
}
.brand-name .brand-initials, .brand-name .brand-initial { color: #87631f; font-weight: 650; }
.brand-name .brand-word { letter-spacing: .015em; }
#mobile-nav { background: rgb(253 252 248 / .97); }
#showcase-stage, .gallery-stage, .custom-detail-preview {
  background: radial-gradient(ellipse at 40% 35%, #fff, #f0eadc 80%);
  border-color: var(--glass-border);
  box-shadow: var(--glass-shadow), inset 0 0 60px rgb(255 255 255 / .6);
}
#showcase-card, .reserve-form, .custom-enquiry-form, .gallery-choice {
  background: rgb(255 255 255 / .66);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-color: var(--glass-border);
  box-shadow: var(--glass-shadow);
}
#showcase-chips button.bg-primary-500, #spec-tabs button.bg-primary-500 { color: #fffdf6; }
.gallery-choice { color: #40382a; }
.gallery-choice[aria-pressed="true"] { background: #f3ecd9; border-color: #a08345; }
.gallery-thumb { background: #f1ecdf; }
.gallery-choice small, .gallery-caption p { color: #635b4e; }
.gallery-caption h3, .full-watch-link, .custom-secondary { color: #87631f; }
.gallery-note, .product-note, .custom-enquiry-note, .custom-hero-figure figcaption { color: #71695b; }
.custom-hero { background: linear-gradient(90deg, rgb(252 251 247 / .96), rgb(252 251 247 / .65)), url('/images/clear-gold-landscape.webp') center / cover; }
.custom-enquiry-form label { color: #65583f; }
.custom-feedback { color: #76551c; border-color: var(--glass-border); background: #faf5e7; }
.field { background: rgb(255 255 255 / .85); border-color: #d9cfb8; color: #393328; }
.field::placeholder { color: #817767; }
.field:-webkit-autofill, .field:-webkit-autofill:hover, .field:-webkit-autofill:focus {
  -webkit-text-fill-color: #393328;
  caret-color: #393328;
  box-shadow: 0 0 0 1000px #fffdf7 inset;
}
footer { background: linear-gradient(135deg, #f5efe0, #fdfcf8); }
.anchor-alias { display: block; scroll-margin-top: 6rem; }
.hero-figure { margin: 0; min-width: 0; }
.teaser-art { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 540px; isolation: isolate; }
#top a[href="#story"].border { color: #76551c; border-color: #ad9460; }
#top > a { color: #76551c; }
.teaser-orbit { position: absolute; width: 88%; aspect-ratio: 1; border-radius: 50%; border: 1px solid rgb(160 131 69 / .25); transform: rotate(-25deg) scaleX(.8); box-shadow: inset 28px 0 40px rgb(255 255 255 / .7), 18px 12px 45px rgb(160 131 69 / .08); }
.teaser-orbit::after { content: ''; position: absolute; inset: 12%; border: 1px solid rgb(255 255 255 / .8); border-radius: 50%; }
.teaser-glass { position: relative; display: flex; flex-direction: column; gap: 2rem; align-items: center; justify-content: center; width: min(75%, 340px); min-height: 390px; border: 1px solid rgb(255 255 255 / .85); border-radius: 45% 45% 30% 30%; background: linear-gradient(130deg, #ffffffbb, #ffffff22); box-shadow: 18px 24px 60px rgb(137 109 49 / .1), inset 2px 2px 14px #fff; backdrop-filter: blur(9px); }
.teaser-glass img { width: 70px; height: 140px; object-fit: contain; }
.teaser-glass span { font-size: .75rem; letter-spacing: .3em; color: #87631f; direction: ltr; }
.teaser-art > p { position: relative; margin-top: 2rem; color: #71695b; font-size: .875rem; }
.teaser-art-small { min-height: 450px; }
.teaser-message { padding: 3rem; border: 1px solid var(--glass-border); border-radius: 1rem; background: #ffffff88; font-family: var(--font-heading); font-size: 1.7rem; line-height: 1.5; color: #87631f; }
@media (max-width: 767px) {
  .teaser-art, .teaser-art-small { min-height: 360px; }
  .teaser-glass { min-height: 270px; width: 65%; gap: 1rem; }
  .teaser-glass img { width: 50px; height: 100px; }
  .teaser-art > p { margin-top: 1.25rem; }
  .teaser-message { padding: 2rem; font-size: 1.4rem; }
}
.render-note { margin-top: 2.5rem; text-align: center; font-size: .75rem; line-height: 1.6; color: #71695b; }
@media (max-width: 767px) { .render-note { margin-top: 1rem; } }
.form-field { display: flex; flex-direction: column; gap: .45rem; min-width: 0; }
.form-field label { color: #65583f; font-size: .8rem; }
.form-field .field { width: 100%; min-width: 0; }
.form-help { color: #71695b; font-size: .8rem; line-height: 1.6; }
.enquiry-feedback { color: #76551c; border: 1px solid var(--glass-border); background: #faf5e7; padding: .9rem; border-radius: .5rem; line-height: 1.6; }
.enquiry-feedback:empty { display: none; }
.gallery-choice { min-height: 88px; }
#site-header nav { gap: 1rem; }
@media (max-width: 1023px) {
  #site-header nav > .hidden { display: none; }
  #site-header .nav-toggle { display: flex; }
  #mobile-nav:not(.hidden) { max-height: calc(100dvh - 5rem); overflow-y: auto; }
  #site-header nav > div:last-child > a { display: none; }
}
@media (min-width: 1024px) {
  #mobile-nav { display: none !important; }
}
@media (max-width: 767px) {
  #top { min-height: auto; }
  #top > .relative { padding-top: 7rem; padding-bottom: 4rem; gap: 1.25rem; }
  #top h1 { font-size: clamp(2.6rem, 10vw, 3.5rem); }
  #top .hero-stage { height: clamp(290px, 88vw, 420px); }
  #top .hero-product { transform: translateY(-50%) scale(1.05); }
  #top > a { bottom: .75rem; }
  .home-atmosphere > section:not(#top) { padding-block: 3.5rem; }
  #showcase .gallery-layout { gap: 1.5rem; }
  .gallery-choice { grid-template-columns: 44px minmax(0, 1fr); padding: .65rem; gap: .6rem; }
  .gallery-thumb { width: 44px; height: 52px; }
  .gallery-choice small { display: none; }
  .gallery-caption { min-height: 6rem; }
  .gallery-stage { max-width: 480px; margin-inline: auto; }
  .field { font-size: 16px; min-height: 48px; }
  #site-header nav { gap: .5rem; }
  #site-header nav > div:last-child { gap: .5rem; }
  .brand-lockup { gap: .5rem; }
  .brand-name { font-size: 1rem; }
  #spec-tabs { border-radius: 1rem; justify-content: center; }
  #spec-tabs button { min-height: 44px; letter-spacing: .08em; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .fade-up { animation: none; opacity: 1; transform: none; }
  .animate-bounce { animation: none; }
}
.hotspot:focus-visible, button:focus-visible, a:focus-visible, .field:focus-visible { outline: 2px solid #97732c; outline-offset: 4px; }
@media (max-width: 767px) {
  #top > picture > img { object-position: 68% bottom; opacity: .7; }
  #top .hero-scrim-b { background: linear-gradient(to bottom, rgb(252 251 247 / .96) 0%, rgb(252 251 247 / .88) 38%, rgb(252 251 247 / .18) 75%); }
  #top .hero-scrim-l, html[dir="rtl"] #top .hero-scrim-l { background: none; }
}
@media (min-width: 1024px) and (max-height: 800px) {
  #top .hero-stage { height: max(430px, calc(100svh - 180px)); }
  #top .hero-product { transform: translateY(-50%) scale(1.15); }
}

/* Defocus only the baked, already-blurred watch asset, never its surroundings. */
.teaser-art{background:transparent;border:0;box-shadow:none;backdrop-filter:none}
.teaser-art>.blurred-watch-only{display:block;width:min(100%,600px);height:clamp(350px,43vw,620px);object-fit:contain;filter:blur(16px);opacity:.82;transform:none}
.teaser-art-small>.blurred-watch-only{height:460px}
.teaser-art>p{margin-top:.5rem}
@media(max-width:767px){.teaser-art>.blurred-watch-only{width:100%;height:340px}.teaser-art-small>.blurred-watch-only{height:330px}}

/* Public introduction and direct concierge contact; product imagery stays blurred. */
section[id]{scroll-margin-top:80px}
.watch-introduction-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(32px,6vw,100px);max-width:1440px;margin:auto}
.watch-intro-lead{font-size:clamp(20px,2vw,26px);line-height:1.55;color:#765b2f;margin-top:24px;max-width:520px}
.watch-preview-note{font-size:12px;color:#71695b;text-align:center;padding:0 16px}
.watch-intro-link{display:inline-flex;align-items:center;gap:32px;margin-top:28px;padding:12px 0;border-bottom:1px solid #b79a5e;color:#76551c;font-size:13px}
.contact-section{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:48px}
.contact-copy{max-width:510px;margin-top:24px;color:#696152;font-size:15px;line-height:1.9}
.contact-details{justify-self:end;max-width:100%}
.contact-details>a{display:block;font-family:var(--font-heading);font-size:clamp(24px,3vw,42px);color:#80602d;overflow-wrap:anywhere;border-bottom:1px solid #c9b68d;padding-bottom:14px}
.contact-details>span{display:block;margin-top:12px;font-size:12px;color:#71695b}
#site-header nav>.md\:flex a{font-size:11px;letter-spacing:.12em}
@media(min-width:1024px) and (max-width:1279px){#site-header nav>.hidden{display:none}#site-header .nav-toggle{display:flex}#site-header nav>div:last-child>a{display:none}#mobile-nav:not(.hidden){display:flex!important}}
@media(max-width:767px){.watch-introduction-grid,.contact-section{grid-template-columns:1fr;gap:32px}.watch-introduction-grid>figure{order:2}.contact-details{justify-self:start}.watch-intro-lead{font-size:21px}.contact-copy{font-size:14px}}

/* A single mobile sequence: introduction, contained preview, then actions. */
@media(max-width:767px){
 #top{display:block;min-height:0}
 #top>.hero-layout{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"label" "title" "subtitle" "description" "preview" "actions" "status";gap:0;padding:112px 24px 40px;align-items:start}
 #top .hero-copy{display:contents;animation:none}
 #top .hero-copy>.font-label{grid-area:label;font-size:9px;line-height:1.7;letter-spacing:.22em;margin:0 0 18px}
 #top h1{grid-area:title;font-size:clamp(38px,10.7vw,50px);line-height:1.12;margin:0;letter-spacing:-.025em}
 #top .hero-sub{grid-area:subtitle;font-size:27px;line-height:1.4;margin:10px 0 0}
 #top .hero-description{grid-area:description;max-width:100%;font-size:13px;line-height:1.8;margin:18px 0 0}
 #top .teaser-art{grid-area:preview;min-height:0;height:238px;margin:8px 0 0;justify-content:flex-start;animation:none}
 #top .teaser-art>.blurred-watch-only{width:260px;max-width:100%;height:214px;flex:none;object-fit:contain;opacity:.85}
 #top .teaser-art>p{margin:0;max-width:none;text-align:center;font-size:9px;line-height:1.5;color:#766d5e}
 #top .hero-actions{grid-area:actions;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px;margin:22px 0 0}
 #top .hero-actions>a{min-height:48px;display:flex;align-items:center;justify-content:center;font-size:10px;letter-spacing:.13em;line-height:1.5;padding:12px 16px;border-radius:10px}
 #top .hero-actions>a[href="#story"]{padding:10px 0;border:0;border-bottom:1px solid #b29b6b;border-radius:0;min-height:40px}
 #top .hero-status{grid-area:status;margin:14px 0 0;font-size:10px;line-height:1.6;text-align:start}
 #top>a{display:none}
 #top>picture>img{object-position:62% bottom;opacity:.75}
 #top .hero-scrim-b{background:linear-gradient(to bottom,#fcfbf7f5 0%,#fcfbf7e6 38%,#fcfbf733 70%,#fcfbf7b3 100%)}
 html[dir="rtl"] #top h1{font-size:42px;letter-spacing:0;line-height:1.35}
 html[dir="rtl"] #top .hero-copy>.font-label{letter-spacing:0;font-size:11px}
 html[dir="rtl"] #top .hero-description{font-size:15px;line-height:1.8}
 html[dir="rtl"] #top .hero-actions>a{letter-spacing:0;font-size:12px}
}
@media(max-width:360px){#top>.hero-layout{padding-inline:20px;padding-top:104px}#top .hero-actions{gap:12px}#top .hero-actions>a{font-size:9px;padding-inline:12px}}

/* Fill the visible iPhone screen while allowing content to grow on short displays. */
@media(max-width:767px){
 #top{min-height:100svh;min-height:100dvh;display:flex;align-items:stretch}
 #top>.hero-layout{min-height:100svh;min-height:100dvh;flex:1;grid-template-rows:auto auto auto auto minmax(238px,1fr) auto auto;padding-bottom:max(32px,env(safe-area-inset-bottom))}
 #top .teaser-art{height:auto;min-height:238px;align-self:stretch;justify-content:center}
}

.direction-icon{display:inline-block;width:16px;height:16px;flex:0 0 16px;vertical-align:middle;color:inherit}

/* Stop mobile rubber-band scrolling from exposing space past the footer. */
@media(max-width:767px){
 html,body{overscroll-behavior-y:none;background-color:#fdfcf8}
 html{overflow-x:clip}
 body{margin-bottom:0;padding-bottom:0}
}

/* Password visibility control: fixed touch target, never a full-width form button. */
.deed-form .login-password{position:relative;display:block;width:100%;min-width:0;direction:ltr}
.deed-form .login-password .field{display:block;width:100%;min-width:0;padding-right:58px;padding-left:16px}
.deed-form .login-password .password-toggle{position:absolute;right:4px;left:auto;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:44px;min-width:44px;max-width:44px;height:44px;min-height:44px;padding:0;margin:0;border:0;border-radius:6px;background:transparent;color:#84662e;appearance:none;-webkit-appearance:none;touch-action:manipulation;cursor:pointer;line-height:1;box-shadow:none}
.deed-form .login-password .password-toggle:hover,.deed-form .login-password .password-toggle[aria-pressed="true"]{background:#eee6d480}
.password-toggle svg{display:block;width:20px;height:20px;pointer-events:none;overflow:visible}
.password-toggle .eye-slash{display:none}
.password-toggle[aria-pressed="true"] .eye-slash{display:block}

/* Restrained gold social links with comfortable touch targets. */
.footer-socials{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.footer-socials>a,.footer-socials>.social-pending{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:8px 11px;border:1px solid #c9b68d80;border-radius:12px;color:#80602d;font-size:12px;line-height:1.4}
.footer-socials i{font-size:19px;line-height:1}
.footer-socials>a:hover{background:#eee6d4;border-color:#b79a5e}
.footer-socials>.social-pending{opacity:.55}

@media (max-width: 767px) { .custom-hero { background-image: linear-gradient(90deg, rgb(252 251 247 / .96), rgb(252 251 247 / .65)), url('/images/clear-gold-landscape-mobile.webp'); } }