:root{
  --ink:#111211;
  --coal:#1c1d1c;
  --smoke:#2a2b2a;
  --rust:#a85335;
  --rust-dark:#743821;
  --wood:#9b6b42;
  --metal:#8a908e;
  --cement:#b5aa95;
  --paper:#efe1c1;
  --gold:#e0b66f;
  --line:rgba(224,182,111,.28);
  --shadow:0 24px 70px rgba(0,0,0,.45);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif;
  color:var(--paper);
  background:
    linear-gradient(135deg,rgba(15,15,14,.95),rgba(46,40,35,.92)),
    url('/assets/img/concrete-noise.svg');
  line-height:1.7;
}
a{color:inherit;text-decoration:none}
img,video{max-width:100%;display:block}
.skip-link{position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{left:12px;top:12px;width:auto;height:auto;background:var(--gold);color:#181818;padding:8px 12px;z-index:9999}
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(17,18,17,.88);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
  box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.header-inner{max-width:1240px;margin:auto;padding:14px 20px;display:flex;align-items:center;gap:22px;justify-content:space-between}
.logo-link{display:flex;align-items:center;gap:12px;font-weight:900;letter-spacing:.08em;color:var(--gold)}
.logo-link img{width:168px;height:auto;filter:drop-shadow(0 6px 18px rgba(168,83,53,.25))}
.brand-mark{display:none}
.nav-toggle{display:none;background:transparent;color:var(--paper);border:1px solid var(--line);padding:8px 10px;border-radius:10px}
.main-nav{display:flex;gap:4px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.main-nav a{font-size:14px;padding:9px 12px;border:1px solid transparent;border-radius:999px;color:#d7c7a7;transition:.25s ease}
.main-nav a:hover,.main-nav a.is-active{border-color:var(--line);background:rgba(168,83,53,.18);color:#fff}
.search-strip{border-top:1px solid rgba(224,182,111,.12);background:rgba(36,35,32,.78)}
.search-inner{max-width:1240px;margin:auto;padding:12px 20px;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}
.fake-search{display:flex;align-items:center;gap:10px;background:#151615;border:1px solid rgba(224,182,111,.22);border-radius:16px;padding:10px 12px;box-shadow:inset 0 0 18px rgba(0,0,0,.35)}
.fake-search input{flex:1;background:transparent;border:0;outline:0;color:#f6e4bc;font-size:15px}
.fake-search input::placeholder{color:#a79778}
.fake-search button,.btn{cursor:pointer;border:1px solid rgba(224,182,111,.48);border-radius:999px;background:linear-gradient(135deg,var(--rust),var(--rust-dark));color:#fff;padding:10px 18px;font-weight:800;letter-spacing:.04em;box-shadow:0 12px 28px rgba(116,56,33,.28);transition:.25s ease}
.fake-search button:hover,.btn:hover{transform:translateY(-2px);filter:brightness(1.08)}
.search-note{font-size:13px;color:#b9ad95;text-align:right}
.hero{min-height:82vh;position:relative;display:grid;place-items:center;overflow:hidden;background:#141414}
.hero::before{content:"";position:absolute;inset:0;background:url('/assets/img/hero-loft.webp') center/cover no-repeat;filter:saturate(.95) contrast(1.05)}
.hero::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 24% 20%,rgba(224,182,111,.24),transparent 28%),linear-gradient(90deg,rgba(12,12,11,.94),rgba(12,12,11,.42) 52%,rgba(12,12,11,.86));}
.hero-content{position:relative;z-index:2;max-width:1240px;width:100%;padding:90px 20px 70px;display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:40px;align-items:end}
.eyebrow{display:inline-flex;gap:8px;align-items:center;color:var(--gold);text-transform:uppercase;letter-spacing:.16em;font-size:13px;font-weight:800;border:1px solid var(--line);border-radius:999px;padding:7px 12px;background:rgba(0,0,0,.28)}
h1,h2,h3,h4{line-height:1.18;margin:0 0 14px;color:#fff}
h1{font-size:clamp(40px,7vw,82px);letter-spacing:-.05em;text-shadow:0 12px 35px rgba(0,0,0,.5)}
h2{font-size:clamp(28px,4vw,48px)}
h3{font-size:22px}
p{margin:0 0 14px;color:#d6c9ad}
.hero-lead{font-size:20px;max-width:820px;color:#f0dfbd}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.btn.secondary{background:rgba(20,20,19,.55);border-color:rgba(224,182,111,.35)}
.domain-card{background:rgba(20,20,18,.72);border:1px solid var(--line);border-radius:28px;padding:24px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.domain-card::before{content:"";position:absolute;inset:-80px;background:linear-gradient(120deg,transparent,rgba(224,182,111,.16),transparent);transform:rotate(18deg)}
.domain-card>*{position:relative}
.domain-card strong{display:block;color:var(--gold);font-size:13px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:8px}
.domain-card .domain{font-size:24px;color:#fff;font-weight:900;word-break:break-all}
.section{max-width:1240px;margin:auto;padding:76px 20px;position:relative}
.section.tight{padding-top:42px}
.section-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,430px);gap:28px;align-items:end;margin-bottom:28px;border-bottom:1px solid var(--line);padding-bottom:22px}
.kicker{color:var(--gold);font-weight:900;letter-spacing:.14em;font-size:12px;text-transform:uppercase}
.grid{display:grid;gap:22px}
.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.card{background:linear-gradient(145deg,rgba(42,43,42,.92),rgba(25,25,24,.95));border:1px solid rgba(224,182,111,.18);border-radius:24px;box-shadow:var(--shadow);overflow:hidden;position:relative}
.card-body{padding:22px}
.card::after{content:"";position:absolute;inset:0;border-radius:24px;pointer-events:none;background:linear-gradient(125deg,transparent 0%,rgba(255,255,255,.06) 30%,transparent 58%);opacity:.0;transition:.3s ease}
.card:hover::after{opacity:1;transform:translateX(12px)}
.video-shell{position:relative;aspect-ratio:16/10;background:#111;overflow:hidden;border-bottom:1px solid rgba(224,182,111,.18)}
.video-shell video{width:100%;height:100%;object-fit:cover;background:#111}
.video-shell img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease, filter .45s ease}
.video-card:hover .video-shell img{transform:scale(1.04);filter:contrast(1.08) saturate(1.05)}
.video-shell::after{content:"";position:absolute;inset:-45%;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.28) 48%,rgba(224,182,111,.16) 53%,transparent 64%);transform:translateX(-60%) rotate(12deg);opacity:0;transition:.45s ease;pointer-events:none}
.video-card:hover .video-shell::after{opacity:1;transform:translateX(52%) rotate(12deg)}
.play-btn{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.82);width:68px;height:68px;border-radius:50%;background:rgba(168,83,53,.88);border:2px solid rgba(224,182,111,.7);display:grid;place-items:center;color:#fff;opacity:0;transition:.3s ease;box-shadow:0 18px 40px rgba(0,0,0,.45)}
.play-btn::before{content:"";border-left:18px solid #fff;border-top:12px solid transparent;border-bottom:12px solid transparent;margin-left:5px}
.video-card:hover .play-btn{opacity:1;transform:translate(-50%,-50%) scale(1)}
.rust-particle{position:absolute;inset:0;opacity:0;pointer-events:none;background-image:radial-gradient(circle,rgba(181,83,49,.42) 1px,transparent 1.4px);background-size:16px 16px;mix-blend-mode:screen}
.video-card:hover .rust-particle{opacity:.75;animation:rustShake .38s steps(2,end) infinite}
@keyframes rustShake{0%{transform:translate(0,0)}50%{transform:translate(2px,-1px)}100%{transform:translate(-1px,1px)}}
.meta-row{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0}
.meta-row span,.tag{font-size:12px;color:#e8d3a1;border:1px solid rgba(224,182,111,.24);border-radius:999px;padding:4px 8px;background:rgba(168,83,53,.12)}
.stat-row{display:flex;gap:12px;flex-wrap:wrap;color:#b8ab91;font-size:13px;margin-top:14px}
.story-card img,.gallery-card img,.creator-card img,.tool-card img{width:100%;height:230px;object-fit:cover}
.gallery-card img{height:260px}
.creator-card img{height:320px;object-position:center 30%}
.quote-card{padding:24px;background:linear-gradient(145deg,rgba(45,43,39,.92),rgba(20,20,19,.9));border-left:4px solid var(--rust)}
.quote-card blockquote{margin:0;color:#f2dfbc;font-size:16px}
.quote-card cite{display:block;margin-top:14px;color:var(--gold);font-style:normal;font-weight:800}
.partner-wall{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:22px 0}
.partner{min-height:90px;border:1px solid var(--line);border-radius:18px;display:grid;place-items:center;background:repeating-linear-gradient(135deg,rgba(224,182,111,.08),rgba(224,182,111,.08) 8px,rgba(0,0,0,.1) 8px,rgba(0,0,0,.1) 16px);font-weight:900;color:#ead7aa}
.faq{display:grid;gap:14px}
details{background:rgba(31,31,30,.88);border:1px solid rgba(224,182,111,.2);border-radius:18px;padding:16px 18px}
summary{cursor:pointer;font-weight:900;color:#fff}
details p{margin-top:10px}
.contact-panel{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:stretch}
.qr-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.qr-box{background:#eadbb8;color:#191918;border-radius:20px;padding:16px;text-align:center;font-weight:900}
.qr-box img{border-radius:12px;margin-bottom:10px}
.breadcrumb{max-width:1240px;margin:auto;padding:20px 20px 0;color:#b8ab91;font-size:14px}
.breadcrumb a{color:var(--gold)}
.page-hero{position:relative;min-height:42vh;display:grid;place-items:end;background:#121312;overflow:hidden}
.page-hero::before{content:"";position:absolute;inset:0;background-position:center;background-size:cover;background-repeat:no-repeat;opacity:.55;filter:contrast(1.05)}
.page-brand-industry::before{background-image:url('/assets/img/video-industrial.webp')}
.page-loft-space::before{background-image:url('/assets/img/loft-guide.webp')}
.page-creative-video::before{background-image:url('/assets/img/darkroom.webp')}
.page-ai-studio::before{background-image:url('/assets/img/ai-tool.webp')}
.page-creator-warehouse::before{background-image:url('/assets/img/warehouse-story.webp')}
.page-contact::before{background-image:url('/assets/img/story-warehouse.webp')}
.page-industrial-photo-diary::before{background-image:url('/assets/img/video-industrial.webp')}
.page-loft-renovation-guide::before{background-image:url('/assets/img/loft-guide.webp')}
.page-creative-darkroom::before{background-image:url('/assets/img/darkroom.webp')}
.page-metal-art-space::before{background-image:url('/assets/img/metal-art.webp')}
.page-warehouse-stories::before{background-image:url('/assets/img/warehouse-story.webp')}
.page-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.4),rgba(16,16,15,.96))}
.page-hero .section{position:relative;z-index:1;padding-top:120px;padding-bottom:56px}
.article-list{display:grid;gap:18px}
.article-item{display:grid;grid-template-columns:260px 1fr;gap:22px;padding:16px;border:1px solid var(--line);border-radius:22px;background:rgba(27,27,26,.84)}
.article-item img{height:180px;width:100%;object-fit:cover;border-radius:16px}
.footer{border-top:1px solid var(--line);background:#121312;color:#bfb194}
.footer-inner{max-width:1240px;margin:auto;padding:42px 20px;display:grid;grid-template-columns:1.2fr .8fr;gap:24px}
.footer-logo{width:170px;margin-bottom:14px}
.footer-links{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0}
.footer-links a{color:#dfc895;border-bottom:1px solid rgba(224,182,111,.35)}
.footer small{color:#9c917c}
.update-time{color:#fff;font-weight:800}
.site-json{display:none}
.notice{border:1px solid var(--line);background:rgba(168,83,53,.12);border-radius:18px;padding:14px 16px;color:#ead7aa}
@media (max-width: 960px){
  .header-inner{align-items:flex-start}.nav-toggle{display:block}.main-nav{display:none;width:100%;padding-top:10px}.main-nav.is-open{display:grid;grid-template-columns:repeat(2,1fr)}.header-inner{flex-wrap:wrap}.hero-content{grid-template-columns:1fr}.section-head{grid-template-columns:1fr}.grid.three,.grid.four,.grid.two{grid-template-columns:1fr 1fr}.contact-panel,.footer-inner{grid-template-columns:1fr}.article-item{grid-template-columns:1fr}.partner-wall{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 620px){
  .search-inner{grid-template-columns:1fr}.search-note{text-align:left}.grid.three,.grid.four,.grid.two{grid-template-columns:1fr}.hero{min-height:auto}.hero-content{padding-top:72px}.domain-card .domain{font-size:19px}.main-nav.is-open{grid-template-columns:1fr}.qr-grid{grid-template-columns:1fr}.partner-wall{grid-template-columns:1fr}.footer-links{display:grid}.logo-link img{width:142px}
}