/* Paris of Asia — shared stylesheet
   Identity carried over from the plan artifacts: Bodoni Moda display, Jost body,
   deep-brown ground with brass. Spacing/radius follow the Untitled UI scale. */

:root{
  /* ground + surfaces */
  --ground:#1d1410;
  --surface:#281c15;
  --surface-2:#33241b;
  --surface-3:#3d2b20;
  --line:#4a3626;
  --line-soft:#3a2a1e;

  /* text */
  --champagne:#f3e7d3;
  --muted:#c4b098;
  --faint:#93805f;

  /* accents */
  --brass:#c9a35c;
  --brass-bright:#e2c07c;
  --brass-dim:rgba(201,163,92,.12);
  --rose:#d98a94;
  --ok:#8fba74;
  --warn:#d9b45f;
  --err:#d9705f;

  /* type */
  --display:"Bodoni Moda",Didot,Georgia,serif;
  --body:"Jost",Futura,system-ui,-apple-system,"Segoe UI",sans-serif;

  /* untitled ui spacing scale */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px;
  --sp-6:24px; --sp-8:32px; --sp-10:40px; --sp-12:48px; --sp-16:64px; --sp-20:80px;
  --r-sm:4px; --r-md:8px; --r-lg:12px;

  --shadow-sm:0 1px 2px rgba(0,0,0,.35);
  --shadow-md:0 8px 24px rgba(0,0,0,.30);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  margin:0;
  background:var(--ground);
  color:var(--champagne);
  font-family:var(--body);
  font-weight:300;
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

a{color:var(--brass-bright);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
img{max-width:100%;display:block}

.wrap{max-width:1080px;margin:0 auto;padding:0 var(--sp-6)}
.narrow{max-width:720px;margin:0 auto;padding:0 var(--sp-6)}

/* ---------- nav ---------- */
.nav{
  position:sticky;top:0;z-index:40;
  background:rgba(29,20,16,.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line-soft);
}
.nav-in{
  max-width:1080px;margin:0 auto;padding:var(--sp-4) var(--sp-6);
  display:flex;align-items:center;gap:var(--sp-6);
}
.brand{
  font-family:var(--display);font-weight:700;font-size:1.12rem;
  letter-spacing:.02em;color:var(--champagne);white-space:nowrap;
}
.brand:hover{text-decoration:none;color:var(--brass-bright)}
.nav-links{display:flex;gap:var(--sp-5);margin-left:auto;align-items:center;flex-wrap:wrap}
.nav-links a{
  font-size:13px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);
}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--brass-bright);text-decoration:none}
@media(max-width:720px){
  .nav-in{flex-wrap:wrap;gap:var(--sp-3)}
  .nav-links{margin-left:0;width:100%;gap:var(--sp-4)}
  .nav-links a{font-size:11.5px}
}

/* ---------- type ---------- */
.over{
  font-weight:500;font-size:11.5px;letter-spacing:.42em;text-indent:.42em;
  text-transform:uppercase;color:var(--brass);margin:0 0 var(--sp-5);
}
h1{
  font-family:var(--display);font-weight:700;
  font-size:clamp(2.5rem,7vw,4.2rem);line-height:1;
  margin:0 0 var(--sp-5);text-wrap:balance;
}
h2{
  font-family:var(--display);font-weight:600;font-size:clamp(1.7rem,3.6vw,2.3rem);
  line-height:1.15;margin:0 0 var(--sp-3);text-wrap:balance;
}
h3{font-family:var(--display);font-weight:600;font-size:1.25rem;margin:0 0 var(--sp-2)}
p{margin:0 0 var(--sp-4)}
.lede{font-size:1.12rem;color:var(--muted);max-width:60ch}
.lede em{color:var(--champagne);font-style:normal}

.rule{display:flex;align-items:center;gap:var(--sp-4);color:var(--faint);margin:var(--sp-12) 0}
.rule::before,.rule::after{content:"";flex:1;height:1px;background:var(--line)}
.rule span{font-size:12px;letter-spacing:.4em;text-indent:.4em}

section{padding:var(--sp-16) 0 0}

/* ---------- buttons (untitled ui sizing) ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);
  font-family:var(--body);font-weight:500;font-size:14px;
  letter-spacing:.16em;text-transform:uppercase;
  padding:13px 26px;border-radius:var(--r-md);
  border:1px solid var(--brass);background:var(--brass);color:#20160f;
  cursor:pointer;transition:background .15s ease,border-color .15s ease;
}
.btn:hover{background:var(--brass-bright);border-color:var(--brass-bright);text-decoration:none}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-ghost{background:transparent;color:var(--brass-bright)}
.btn-ghost:hover{background:var(--brass-dim);border-color:var(--brass-bright)}
.btn-google{
  background:var(--champagne);border-color:var(--champagne);color:#20160f;
  letter-spacing:.06em;text-transform:none;font-size:15px;
}
.btn-google:hover{background:#fff;border-color:#fff}
.btn-google svg{width:18px;height:18px}
.btn-sm{padding:9px 16px;font-size:12px}

/* ---------- cards ---------- */
.grid{display:grid;gap:var(--sp-4)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
@media(max-width:860px){.grid-3{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.grid-2,.grid-3{grid-template-columns:1fr}}

.card{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:var(--sp-6);
}
.card h3{color:var(--brass-bright)}
.card p{color:var(--muted);font-size:.96rem;margin:0}
.card-accent{border-left:3px solid var(--brass)}

.pill{
  display:inline-block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  padding:4px 10px;border-radius:999px;border:1px solid var(--line);
  color:var(--faint);background:var(--surface-2);
}
.pill-on{border-color:var(--brass);color:var(--brass-bright);background:var(--brass-dim)}

/* ---------- forms ---------- */
label{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin:0 0 var(--sp-2)}
input[type=text],input[type=email],input[type=tel],select,textarea{
  width:100%;font-family:var(--body);font-size:16px;font-weight:300;
  color:var(--champagne);background:var(--surface-2);
  border:1px solid var(--line);border-radius:var(--r-md);
  padding:11px 14px;
}
input:focus,select:focus,textarea:focus{border-color:var(--brass);outline:none}
textarea{min-height:120px;resize:vertical;line-height:1.6}
.field{margin:0 0 var(--sp-5)}
.help{font-size:.86rem;color:var(--faint);margin:var(--sp-2) 0 0}

.choices{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.choice{
  display:inline-flex;align-items:center;gap:var(--sp-2);
  border:1px solid var(--line);border-radius:999px;
  padding:8px 16px;cursor:pointer;background:var(--surface-2);
  font-size:14px;color:var(--muted);transition:all .14s ease;
}
.choice input{position:absolute;opacity:0;width:0;height:0}
.choice:hover{border-color:var(--brass)}
.choice:has(input:checked){border-color:var(--brass);background:var(--brass-dim);color:var(--brass-bright)}
.choice:has(input:focus-visible){outline:2px solid var(--brass);outline-offset:2px}

.note{
  border:1px solid var(--brass);background:var(--surface);
  border-radius:var(--r-lg);padding:var(--sp-5) var(--sp-6);margin:var(--sp-8) 0 0;
}
.note p{margin:0;font-size:.95rem;color:var(--muted)}
.note b{color:var(--champagne);font-weight:500}

.msg{border-radius:var(--r-md);padding:var(--sp-3) var(--sp-4);font-size:.94rem;margin:0 0 var(--sp-4);display:none}
.msg[data-show]{display:block}
.msg-ok{background:rgba(143,186,116,.12);border:1px solid var(--ok);color:var(--ok)}
.msg-err{background:rgba(217,112,95,.12);border:1px solid var(--err);color:var(--err)}

/* ---------- footer ---------- */
footer{
  margin-top:var(--sp-20);border-top:1px solid var(--line);
  padding:var(--sp-8) 0 var(--sp-16);
}
.foot-in{max-width:1080px;margin:0 auto;padding:0 var(--sp-6);
  display:flex;flex-wrap:wrap;gap:var(--sp-6);justify-content:space-between;align-items:flex-start}
footer p{font-size:.86rem;color:var(--faint);max-width:52ch;margin:0}
.foot-links{display:flex;gap:var(--sp-5);flex-wrap:wrap}
.foot-links a{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

.center{text-align:center}
.stack{display:flex;flex-direction:column;gap:var(--sp-4)}
.row{display:flex;gap:var(--sp-3);flex-wrap:wrap;align-items:center}
.hide{display:none !important}
