/* Vertere Diamant: brand tokens (Zoe's Canva palette) */
:root{
  --cream:#EDD3B8; --camel:#C49E77; --gray-orange:#BBA793;
  --black:#111111; --white:#FFFFFF; --light-gray:#C4C4C4;
  --ink:#2E2620; --body:#4A4038; --muted:#6B5F55;
  --rule:#E2D8CC; --dark-rule:#BBA793; --dark-panel:#FFFFFF;
  --on-dark:#E0E0E0; --on-dark-muted:#C4C4C4;
  --accent-sub:#4F6B5A; /* 日光沃萊 sub-brand */
  --serif-en:'Cormorant Garamond','Noto Serif TC',serif;
  --serif-tc:'Noto Serif TC',serif;
  --kai:'LXGW WenKai TC','Noto Serif TC',serif;
  --sans:Manrope,'Noto Sans TC',sans-serif;
  --max:1160px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.7}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.wrap{max-width:var(--max);margin:0 auto;padding-left:24px;padding-right:24px}
.section{padding-top:112px;padding-bottom:112px}
.cream{background:var(--cream)}
.dark{background:var(--white);color:var(--ink)}
/* HR: calm gray-orange tint; Property: warm cream */
.hr-band{background:#F1ECE6}
.property-band{background:#F6E9DC}
.eyebrow{margin:0 0 16px;font-size:12px;letter-spacing:.28em;text-transform:uppercase}
.dark .eyebrow{color:var(--ink)}
h1,h2{font-family:var(--serif-en);font-weight:400;margin:0}
h1{font-size:60px;line-height:1.08;letter-spacing:-.01em}
h2{font-size:38px;line-height:1.2}
h3{margin:0 0 12px;font-size:18px;font-weight:500}
p{margin:0}
.lead{font-size:17px;color:var(--body);max-width:640px}
.dark .lead{color:var(--muted)}
.tc{font-family:var(--serif-tc);letter-spacing:.12em}
.zh{font-family:'Noto Sans TC',sans-serif;font-weight:300;font-size:14px;color:var(--muted);margin-left:8px}
.dark .zh{color:var(--muted)}
.muted{color:var(--muted)}
.dark .muted{color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:48px}
.item{border-top:1px solid var(--rule);padding-top:28px}
.dark .item{border-top-color:var(--dark-rule)}
.num{margin:0 0 12px;font-family:var(--serif-en);font-size:18px;color:var(--muted)}
.dark .num{color:var(--camel)}
.btn{display:inline-flex;align-items:center;min-height:48px;padding:14px 28px;font-size:13px;letter-spacing:.08em;background:var(--camel);color:var(--ink)}
.btn:hover{background:var(--gray-orange)}
.link{display:inline-flex;align-items:center;min-height:48px;padding:14px 4px;font-size:13px;letter-spacing:.08em;border-bottom:1px solid currentColor}
.placeholder{background:rgba(196,158,119,.18);outline:1px dashed var(--camel)}

/* photos */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);min-height:600px;background:var(--cream)}
.hero .copy{padding:96px 56px 96px max(24px,calc((100vw - var(--max))/2 + 24px));display:flex;flex-direction:column;justify-content:center;gap:28px}
.hero .photo{background-size:cover;background-position:center}
.thumb{aspect-ratio:4/3;background-size:cover;background-position:center;margin-bottom:24px;filter:saturate(.9)}
.wide-photo{aspect-ratio:21/8;background-size:cover;background-position:center}

/* header */
.site-header{background:#fff;border-bottom:1px solid var(--rule)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding-top:22px;padding-bottom:22px}
.brand{display:flex;align-items:center;gap:14px}
.brand .mono{height:40px;width:auto}
.brand .word{height:16px;width:auto}
.nav{display:flex;gap:28px;flex-wrap:wrap;font-size:13px;letter-spacing:.08em}
.nav a[aria-current="page"]{border-bottom:1px solid var(--camel)}
.cta{font-size:13px;letter-spacing:.08em;padding:12px 22px;border:1px solid var(--camel);min-height:44px;display:inline-flex;align-items:center}

/* page hero (inner pages) */
.page-hero{background:var(--cream);padding:96px 0 88px}
.page-hero h1{font-size:52px}
.page-hero .lead{margin-top:24px}

/* lists */
.rows{list-style:none;margin:0;padding:0}
.rows li{padding:20px 0;border-top:1px solid var(--rule);display:flex;justify-content:space-between;gap:24px}
.rows li:last-child{border-bottom:1px solid var(--rule)}
.rows li.industry{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:24px}
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:48px}

/* forms */
form .field{display:flex;flex-direction:column;gap:8px;margin-bottom:20px}
label{font-size:13px;letter-spacing:.06em}
input,textarea{font:inherit;padding:12px 14px;border:1px solid var(--light-gray);background:var(--white);color:var(--ink);min-height:48px}
input:focus,textarea:focus{outline:2px solid var(--camel);outline-offset:1px}
button.btn{border:0;cursor:pointer;font-family:inherit}

/* footer */
.site-footer{background:var(--gray-orange);color:var(--ink)}
.site-footer .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:48px;padding-top:88px;padding-bottom:40px;font-size:14px}
.site-footer .eyebrow{font-size:11px;color:var(--ink);margin-bottom:8px;opacity:.8}
.site-footer a{color:var(--ink)}
.site-footer .logo{display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin-bottom:20px}
.site-footer .logo .mono{height:64px;width:auto}
.site-footer .logo .word{height:14px;width:auto}
.site-footer .legal{border-top:1px solid rgba(46,38,32,.25);padding-top:24px;padding-bottom:24px;font-size:12px;color:var(--ink);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

@media (max-width:720px){
  h1,.page-hero h1{font-size:42px}
  h2{font-size:30px}
  .section{padding-top:72px;padding-bottom:72px}
  .page-hero{padding:64px 0}
  .nav{gap:18px}
  .hero{grid-template-columns:1fr}
  .hero .photo{min-height:280px;order:-1}
  .hero .copy{padding:56px 24px}
  .wide-photo{aspect-ratio:4/3}
  .rows li.industry{grid-template-columns:1fr;gap:4px}
}
/* 服務項目 dropdown: hover or keyboard focus on desktop; on phones the hero links and services page cover it */
.has-sub{position:relative}
.has-sub .sub{display:none;position:absolute;left:-18px;top:100%;padding-top:14px;z-index:20}
.has-sub .sub::before{content:"";position:absolute;inset:14px 0 0;background:#fff;border:1px solid var(--rule);box-shadow:0 8px 24px rgba(46,38,32,.08);z-index:-1}
.has-sub .sub a{display:block;white-space:nowrap;padding:12px 18px;min-height:44px}
.has-sub .sub a:hover{color:var(--camel)}
.has-sub:hover .sub,.has-sub:focus-within .sub{display:block}
@media (max-width:820px){.has-sub .sub{display:none!important}}
/* HR side: formal serif for Chinese card titles */
h3 .i18n[lang="zh-Hant"]{font-family:var(--serif-tc);font-weight:500;font-size:19px;letter-spacing:.06em}
/* Subtitles: same family as the heading, smaller and italic */
.lead{font-family:'Cormorant Garamond','Noto Serif TC',serif;font-style:italic;font-size:18px;letter-spacing:.04em}
.lead.tc{font-size:17px;letter-spacing:.1em}
/* 日光沃萊 brand name keeps its own warm script */
.kai{font-family:var(--kai)}

/* Live site: copy Zoe has not supplied yet stays hidden until filled in */
.placeholder{display:none}

/* Chinese + English shown together (property block, process steps) */
.bi-en{display:block;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:max(.55em,14px);letter-spacing:.06em;margin-top:6px;opacity:.85}
.eyebrow .bi-en,.link .bi-en{display:inline;font-size:1em;font-style:normal;font-family:inherit;margin:0 0 0 8px}
p > .bi-en{font-size:15px;margin-top:4px}
/* 日光沃萊 block on the VD site: text beside a fully visible home photo */
.solwell-card{display:grid;grid-template-columns:1fr 1fr;background:var(--cream,#EDD3B8)}
.solwell-text{padding:64px 48px;align-self:center}
.solwell-photo{background-size:cover;background-position:center;min-height:380px;order:2}
@media (max-width:820px){.solwell-card{grid-template-columns:1fr}.solwell-photo{order:-1;min-height:240px}.solwell-text{padding:40px 24px}}
.solwell-text .bi-en{line-height:1.7;margin-top:10px;letter-spacing:.04em}
.nowrap-wide{white-space:nowrap}@media (max-width:820px){.nowrap-wide{white-space:normal}}
/* Quiet outlined button: more visible than a text link, softer than .btn */
.btn-soft{display:inline-flex;align-items:center;gap:12px;min-height:48px;margin-top:28px;padding:12px 24px;font-size:13px;letter-spacing:.08em;color:var(--ink);border:1px solid #8F6C4A;background:rgba(255,255,255,.35);transition:background .2s,color .2s}
.btn-soft:hover{background:#8F6C4A;color:#fff}