/* ============ Origin Land 元庐 官网 · v3 111W57 ============ */
:root{
  --ink:#1a1a1a;
  --muted:#6e6e6e;
  --paper:#ffffff;
  --warm:#f6f5f2;
  --line:#e6e4e0;
  --bronze:#8a6f4d;
  --serif:"Bodoni Moda","Didot","Bodoni 72","Playfair Display",Georgia,"Times New Roman",serif;
  --sans:"Noto Sans SC",-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:2;font-size:17px;font-weight:400;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul{list-style:none}

/* ---------- header ---------- */
.site-header{position:fixed;top:0;left:0;right:0;z-index:100;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;height:88px;transition:box-shadow .35s,height .35s;background:transparent}
/* 头部白底+毛玻璃放在伪元素上——backdrop-filter 挂在头部本体会把后代 fixed 元素（全屏菜单）的包含块劫持为头部盒子，导致菜单错乱 */
.site-header::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(255,255,255,.96);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;transition:opacity .35s}
.site-header.solid::before{opacity:1}
.site-header.solid{box-shadow:0 1px 0 var(--line);height:70px}
.brand{display:flex;align-items:center;white-space:nowrap}
.brand img{height:30px;width:auto;display:block}
.site-header .logo-dark{display:none}
.site-header.solid .logo-dark,.site-header.dark .logo-dark{display:block}
.site-header.solid .logo-light,.site-header.dark .logo-light{display:none}
.site-header,.site-header a{color:#fff}
.site-header.solid,.site-header.solid a,.site-header.dark,.site-header.dark a{color:var(--ink)}
.main-nav{display:flex;gap:2.1vw}
.main-nav a{font-size:14.5px;letter-spacing:.24em;opacity:.85;transition:opacity .2s;padding:6px 0;font-weight:400}
.main-nav a:hover,.main-nav a.on{opacity:1;border-bottom:1px solid currentColor}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;width:36px;height:36px;position:relative;color:inherit}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;left:5px;right:5px;height:1.5px;background:currentColor;transition:.3s}
.nav-toggle span{top:17px}
.nav-toggle span::before{top:-8px}
.nav-toggle span::after{top:8px}

.nav-close{display:none}
/* 无 hero 的页面（如 FAQ）：内容为固定头部让位 */
body.plain article{padding-top:70px}
@media (max-width:960px){
  /* 玻璃拟态全屏菜单：淡入淡出。不用 transform 位移——一是 iOS 地址栏伸缩会引发位移重算残留，二是 backdrop-filter 与 transform 动画在 iOS 上互相冲突 */
  .main-nav{position:fixed;inset:0;background:rgba(252,251,249,.97);flex-direction:column;align-items:center;justify-content:center;gap:26px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .32s ease,visibility 0s linear .32s}
  @supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
    .main-nav{background:rgba(252,251,249,.82);-webkit-backdrop-filter:blur(26px) saturate(1.6);backdrop-filter:blur(26px) saturate(1.6)}
  }
  .main-nav.open{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .32s ease}
  .main-nav a{color:var(--ink)!important;font-size:16px;letter-spacing:.34em}
  .nav-toggle{display:block;z-index:120}
  .nav-close{display:block;position:absolute;top:9px;right:4vw;width:46px;height:46px;background:none;border:none;cursor:pointer;padding:0}
  .nav-close::before,.nav-close::after{content:"";position:absolute;left:50%;top:50%;width:22px;height:1.5px;background:var(--ink);transform:translate(-50%,-50%) rotate(45deg)}
  .nav-close::after{transform:translate(-50%,-50%) rotate(-45deg)}
  body.nav-open .brand{position:relative;z-index:121}
  body.nav-open .logo-light{display:none}
  body.nav-open .logo-dark{display:block!important}
  /* 开菜单时隐藏汉堡，全场只保留菜单内的一个 × */
  body.nav-open .nav-toggle{visibility:hidden}
  body.nav-open{overflow:hidden}
}

/* ---------- hero ---------- */
.hero{position:relative;height:100vh;height:100svh;min-height:560px;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(16,15,13,.3),rgba(16,15,13,.1) 45%,rgba(16,15,13,.42));z-index:1}
.hero img.bg,.hero video.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero .inner{position:relative;z-index:2;padding:0 6vw}
.hero .kicker{font-size:15px;letter-spacing:.6em;text-transform:uppercase;opacity:.92;font-weight:300}
.hero h1{font-family:var(--serif);font-size:clamp(46px,7.6vw,104px);letter-spacing:.18em;text-indent:.18em;line-height:1.18;margin:26px 0 18px;font-weight:400;text-transform:uppercase;font-optical-sizing:auto}
.hero video.hv{opacity:0;transition:opacity 1s ease}
.hero video.hv.on{opacity:1}
.hero .cn-title{font-size:clamp(19px,2.5vw,28px);letter-spacing:.95em;text-indent:.95em;font-weight:300}
.hero .tagline{margin-top:34px;font-size:16px;letter-spacing:.42em;opacity:.94;font-weight:300}
/* hero 视频轮播圆点（含加载动画） */
.hero-dots{position:absolute;bottom:32px;left:50%;transform:translateX(-50%);z-index:3;display:flex;gap:12px;align-items:center}
.hero-dots button{width:7px;height:7px;border-radius:99px;border:none;padding:0;background:rgba(255,255,255,.38);cursor:pointer;transition:width .45s ease,background .45s ease;position:relative;overflow:hidden;-webkit-tap-highlight-color:transparent}
.hero-dots button.on{width:32px;background:rgba(255,255,255,.26)}
.hero-dots button .fill{position:absolute;inset:0;width:0%;background:#fff;border-radius:99px}
.hero-dots button.loading .fill{width:34%!important;animation:dotload 1.1s ease-in-out infinite}
@keyframes dotload{0%{transform:translateX(-110%)}100%{transform:translateX(320%)}}

/* page hero */
.page-hero{position:relative;height:82vh;min-height:480px;display:flex;align-items:flex-end;color:#fff;overflow:hidden}
.page-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(16,15,13,.14),rgba(16,15,13,.5));z-index:1}
.page-hero img.bg,.page-hero video.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.page-hero .inner{position:relative;z-index:2;padding:0 6vw 9vh;max-width:1400px;margin:0 auto;width:100%}
.page-hero .en{font-family:var(--serif);font-size:clamp(46px,7vw,96px);letter-spacing:.08em;font-weight:400;line-height:1.15}
.page-hero .cn{font-size:clamp(17px,2.2vw,24px);letter-spacing:.6em;margin-top:18px;font-weight:300}

/* ---------- structure ---------- */
.wrap{max-width:1400px;margin:0 auto;padding:0 6vw}
section.block{padding:130px 0}
section.block.tight{padding:84px 0}
section.warm{background:var(--warm)}
.sec-label{display:flex;align-items:center;gap:18px;margin-bottom:52px}
.sec-label .no{font-family:var(--serif);font-size:16px;letter-spacing:.2em;color:var(--bronze)}
.sec-label .line{flex:0 0 60px;height:1px;background:var(--bronze)}
.sec-label .txt{font-size:14.5px;letter-spacing:.42em;color:var(--muted);font-weight:300}
h2.title{font-weight:300;font-size:clamp(30px,4vw,50px);letter-spacing:.14em;line-height:1.55;margin-bottom:24px}
h2.title .en{display:block;font-family:var(--serif);font-size:clamp(34px,4.6vw,64px);letter-spacing:.05em;color:var(--ink);margin-bottom:16px;font-weight:400;line-height:1.2}
h3.sub{font-weight:400;font-size:23px;letter-spacing:.12em;margin-bottom:12px}
p.lead{color:var(--muted);max-width:780px;font-size:19px;font-weight:300;line-height:2.15}
.center{text-align:center}
.center p.lead{margin:0 auto}
.note{font-size:15px;color:var(--muted);font-weight:300;padding-top:14px;line-height:1.9}

/* statement block (111w57式大字陈述) */
.statement{text-align:center;max-width:1000px;margin:0 auto;padding:0 6vw}
.statement .en{font-family:var(--serif);font-size:clamp(40px,6vw,84px);line-height:1.18;letter-spacing:.04em;font-weight:400}
.statement .cn{font-size:clamp(22px,2.8vw,34px);letter-spacing:.3em;margin-top:26px;font-weight:300}
.statement p.lead{margin:34px auto 0}

/* full-bleed media */
.full-media{position:relative;height:92vh;min-height:520px;overflow:hidden}
.full-media img,.full-media video{width:100%;height:100%;object-fit:cover}
.full-media .cap{position:absolute;left:6vw;bottom:5vh;color:#fff;font-size:15px;letter-spacing:.35em;font-weight:300;text-shadow:0 1px 12px rgba(0,0,0,.4)}

/* editorial split */
.split{display:grid;grid-template-columns:1.25fr 1fr;gap:6vw;align-items:center}
.split.rev{grid-template-columns:1fr 1.25fr}
.split.rev .media{order:2}
.split .media img,.split .media video{width:100%;aspect-ratio:4/3;object-fit:cover}
.split .media.tall img{aspect-ratio:3/3.4}
.split .media.wide video,.split .media.wide img{aspect-ratio:16/10}
.split .body .sec-label{margin-bottom:30px}
@media (max-width:860px){.split,.split.rev{grid-template-columns:1fr;gap:40px}.split.rev .media{order:0}}

/* full-bleed banner */
.banner{position:relative;height:100vh;min-height:520px;overflow:hidden;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff}
.banner img.bg,.banner video.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.banner::before{content:"";position:absolute;inset:0;background:rgba(16,15,13,.3);z-index:1}
.banner .inner{position:relative;z-index:2;padding:0 6vw}
.banner .en{font-family:var(--serif);font-size:clamp(36px,5.6vw,80px);letter-spacing:.06em;font-weight:400;line-height:1.2}
.banner .cn{font-size:clamp(17px,2.1vw,24px);letter-spacing:.5em;margin-top:22px;font-weight:300}

/* stats strip */
.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stats .cell{padding:56px 20px;text-align:center;border-left:1px solid var(--line)}
.stats .cell:first-child{border-left:none}
.stats .num{font-family:var(--serif);font-size:clamp(28px,2.9vw,44px);color:var(--bronze);letter-spacing:.04em;font-weight:400;white-space:nowrap}
.stats .num small{font-size:.5em;letter-spacing:.12em}
.stats .cap{font-size:15px;letter-spacing:.28em;color:var(--muted);margin-top:14px;font-weight:300}
@media (max-width:720px){.stats{grid-template-columns:1fr 1fr}.stats .cell{padding:34px 12px}.stats .cell:nth-child(3){border-left:none}}

/* card grid */
.grid{display:grid;gap:38px}
.grid.c2{grid-template-columns:1fr 1fr}
.grid.c3{grid-template-columns:repeat(3,1fr)}
.grid.c4{grid-template-columns:repeat(4,1fr)}
@media (max-width:960px){.grid.c3,.grid.c4{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.grid.c2,.grid.c3,.grid.c4{grid-template-columns:1fr}}
.card{display:block}
.card .ph{overflow:hidden}
.card .ph img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .8s cubic-bezier(.2,.6,.2,1)}
.card:hover .ph img{transform:scale(1.045)}
.card .cap{padding:22px 0 26px;border-bottom:1px solid var(--line)}
.card .cap .en{font-family:var(--serif);font-size:15px;letter-spacing:.22em;color:var(--bronze)}
.card .cap h4{font-size:20px;letter-spacing:.16em;font-weight:400;margin:8px 0 8px}
.card .cap p{font-size:15.5px;color:var(--muted);line-height:2;font-weight:300}

/* definition rows */
.def-rows{border-top:1px solid var(--line)}
.def-rows .row{display:grid;grid-template-columns:220px 1fr;gap:30px;padding:32px 0;border-bottom:1px solid var(--line)}
.def-rows .k{letter-spacing:.3em;font-weight:400;font-size:18px}
.def-rows .k .en{display:block;font-family:var(--serif);font-size:14.5px;letter-spacing:.18em;color:var(--bronze);font-weight:400;margin-top:6px}
.def-rows .v{color:var(--muted);font-size:16.5px;font-weight:300;line-height:2.15}
@media (max-width:640px){.def-rows .row{grid-template-columns:1fr;gap:8px}}

/* feature list */
.feats{display:grid;grid-template-columns:1fr 1fr;gap:0 5vw}
.feats li{padding:24px 0;border-bottom:1px solid var(--line);font-size:16px;color:var(--muted);font-weight:300;line-height:2.05}
.feats li b{display:block;color:var(--ink);font-weight:500;letter-spacing:.1em;margin-bottom:5px;font-size:17.5px}
@media (max-width:720px){.feats{grid-template-columns:1fr}}

/* floorplan cards */
.fp{display:grid;grid-template-columns:1.2fr 1fr;gap:5vw;align-items:center;padding:84px 0;border-top:1px solid var(--line)}
.fp:first-of-type{border-top:none}
.fp .plan{background:var(--warm);padding:30px}
.fp .plan img{width:100%;object-fit:contain}
.fp .size{font-family:var(--serif);font-size:clamp(52px,6vw,84px);color:var(--bronze);letter-spacing:.02em;line-height:1;font-weight:400}
.fp .size small{font-size:.4em;letter-spacing:.12em}
.fp .type{font-size:20px;letter-spacing:.3em;margin:16px 0 28px;font-weight:300}
.fp ul li{padding:15px 0;border-bottom:1px solid var(--line);font-size:16px;color:var(--muted);font-weight:300;line-height:2.05}
.fp ul li b{color:var(--ink);font-weight:500;margin-right:12px}
@media (max-width:860px){.fp{grid-template-columns:1fr;gap:32px}}

/* gallery */
.masonry{columns:3;column-gap:24px}
.masonry figure{break-inside:avoid;margin-bottom:24px}
.masonry img{width:100%}
.masonry figcaption{font-size:14.5px;letter-spacing:.18em;color:var(--muted);padding:12px 0 6px;border-bottom:1px solid var(--line);font-weight:300}
@media (max-width:960px){.masonry{columns:2}}
@media (max-width:600px){.masonry{columns:1}}

/* film */
.film{position:relative;background:#0d0d0c}
.film video{width:100%;max-height:86vh;object-fit:contain;margin:0 auto}

/* faq */
.faq-item{border-bottom:1px solid var(--line)}
.faq-item summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:32px 0;font-size:19.5px;font-weight:400;letter-spacing:.08em}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-family:var(--serif);font-size:26px;color:var(--bronze);flex:none;transition:transform .3s;font-weight:400}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-item .a{padding:0 0 34px;color:var(--muted);font-size:16.5px;max-width:900px;font-weight:300;line-height:2.2;overflow:hidden;box-sizing:border-box}

/* quote */
.quote{text-align:center;padding:150px 6vw}
.quote .mark{font-family:var(--serif);font-size:17px;letter-spacing:.4em;color:var(--bronze);margin-bottom:38px}
.quote p{font-size:clamp(22px,3vw,34px);letter-spacing:.22em;line-height:2.3;font-weight:300}

/* contact */
.contact-tel{font-family:var(--serif);font-size:clamp(40px,6vw,74px);letter-spacing:.08em;color:var(--ink);font-weight:400}
.contact-tel:hover{color:var(--bronze)}

/* buttons */
.btn{display:inline-block;border:1px solid var(--ink);padding:16px 52px;font-size:14px;letter-spacing:.38em;transition:.3s;margin-top:36px;font-weight:400;text-transform:uppercase}
.btn:hover{background:var(--ink);color:#fff}
.btn.light{border-color:#fff;color:#fff}
.btn.light:hover{background:#fff;color:var(--ink)}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line);padding:74px 6vw 44px;text-align:center;background:var(--paper)}
.foot-mark{font-family:var(--serif);font-size:clamp(22px,2.6vw,30px);letter-spacing:.2em;text-indent:.2em;font-weight:400;text-transform:uppercase}
.foot-line{margin-top:24px;font-size:14.5px;letter-spacing:.14em;color:var(--muted);font-weight:300}
.foot-line a{color:var(--ink)}
.foot-line a:hover{color:var(--bronze)}
.foot-social{margin-top:20px;display:flex;align-items:center;justify-content:center;gap:10px;color:var(--muted)}
.foot-social svg{width:22px;height:22px;color:var(--ink)}
.foot-social span{font-size:13px;letter-spacing:.2em;font-weight:300}
.foot-legal{margin-top:34px;padding-top:24px;border-top:1px solid var(--line);font-size:12.5px;color:#9a9a9a;font-weight:300;line-height:2;letter-spacing:.03em}

/* reveal on scroll (progressive enhancement: only hidden when JS is active) */
.js .rv{opacity:0;transform:translateY(28px);transition:opacity .9s ease,transform .9s ease}
.js .rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none;transition:none}}

/* screen-reader only (SEO 关键词保留，视觉隐藏) */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- 移动端精致化字号体系 ---------- */
@media (max-width:640px){
  body{font-size:14.5px;line-height:1.95}
  .site-header{height:64px;padding:0 5vw}
  .site-header.solid{height:56px}
  .brand img{height:24px}
  .hero h1{font-size:clamp(34px,10.5vw,44px);letter-spacing:.16em;text-indent:.16em;margin:0}
  .page-hero{height:64vh;height:64svh;min-height:380px}
  .page-hero .en{font-size:clamp(32px,9vw,42px)}
  .page-hero .cn{font-size:13px;letter-spacing:.44em;margin-top:12px}
  section.block{padding:64px 0}
  section.block.tight{padding:44px 0}
  .quote{padding:76px 7vw}
  .quote .mark{font-size:13px;margin-bottom:22px}
  .quote p{font-size:16px;letter-spacing:.16em;line-height:2.15}
  .statement .en{font-size:clamp(28px,8vw,36px)}
  .statement .cn{font-size:16px;letter-spacing:.22em;margin-top:16px}
  .statement p.lead{margin-top:22px}
  h2.title{font-size:20px;letter-spacing:.1em;margin-bottom:16px}
  h2.title .en{font-size:24px;margin-bottom:10px}
  h3.sub{font-size:17px}
  p.lead{font-size:14.5px;line-height:2.05}
  .note{font-size:12.5px}
  .sec-label{margin-bottom:30px;gap:12px}
  .sec-label .no{font-size:13px}
  .sec-label .txt{font-size:11.5px;letter-spacing:.3em}
  .full-media{height:56vh;min-height:340px}
  .full-media .cap{font-size:11.5px;letter-spacing:.26em}
  .banner{height:62vh;min-height:380px}
  .banner .en{font-size:clamp(24px,7vw,32px)}
  .banner .cn{font-size:12.5px;letter-spacing:.34em;margin-top:14px}
  .stats .cell{padding:26px 8px}
  .stats .num{font-size:22px}
  .stats .cap{font-size:11px;letter-spacing:.16em;margin-top:8px}
  .card .cap h4{font-size:16px}
  .card .cap .en{font-size:12px}
  .card .cap p{font-size:13.5px}
  .def-rows .row{padding:22px 0}
  .def-rows .k{font-size:15px;letter-spacing:.2em}
  .def-rows .k .en{font-size:11.5px}
  .def-rows .v{font-size:13.5px;line-height:2}
  .feats li{font-size:13.5px;padding:18px 0}
  .feats li b{font-size:14.5px}
  .fp{padding:52px 0}
  .fp .size{font-size:44px}
  .fp .type{font-size:15px;letter-spacing:.22em;margin:10px 0 16px}
  .fp ul li{font-size:13.5px;padding:11px 0}
  .faq-item summary{font-size:15.5px;padding:22px 0}
  .faq-item summary::after{font-size:20px}
  .faq-item .a{font-size:13.5px;padding-bottom:24px;line-height:2.05}
  .masonry figcaption{font-size:11.5px}
  .contact-tel{font-size:clamp(30px,9vw,40px)}
  .btn{padding:12px 34px;font-size:11.5px;letter-spacing:.3em;margin-top:26px}
  footer{padding:52px 6vw 34px}
  .foot-mark{font-size:19px}
  .foot-line{font-size:12px;margin-top:16px}
  .foot-social{margin-top:14px}
  .foot-social svg{width:19px;height:19px}
  .foot-social span{font-size:11.5px}
  .foot-legal{font-size:10.5px;margin-top:24px;padding-top:18px;line-height:1.9}
  .hero-dots{bottom:26px}
  body.plain article{padding-top:56px}
}
