2 lines
8.0 KiB
CSS
2 lines
8.0 KiB
CSS
|
:root{color-scheme:light;--bg:var(--jw-bg,#f6f6f3);--panel:var(--jw-surface,#fff);--soft:var(--jw-surface-sunken,#eceeea);--line:var(--jw-line,rgba(10,10,10,.11));--text:var(--jw-text-primary,#0a0a0a);--body:var(--jw-text-body,#454545);--muted:var(--jw-text-muted,#747773);--accent:var(--jw-accent,#f4511e);--green:var(--jw-success,#08806b);font-family:var(--jw-font-sans,"Geist Variable",Inter,system-ui,sans-serif)}*{box-sizing:border-box}html{background:var(--bg);scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text)}button,input{font:inherit}.gallery-nav{height:78px;display:flex;align-items:center;gap:20px;padding:0 clamp(18px,4vw,64px);border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:blur(20px);position:sticky;top:0;z-index:20}.gallery-brand{display:flex;align-items:center;gap:11px;color:var(--text);text-decoration:none}.gallery-brand>[data-logo]{width:34px}.gallery-brand b{font-size:16px}.gallery-brand small{display:block;color:var(--muted);font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.map-link{margin-left:auto;display:flex;gap:12px;padding:10px 14px;border:1px solid var(--line);border-radius:999px;color:var(--text);background:var(--panel);text-decoration:none;font-size:12px;font-weight:800}.map-link:hover span{transform:translate(2px,-2px)}.map-link span{transition:.2s}main{width:min(1500px,calc(100% - 42px));margin:auto;padding-bottom:100px}.gallery-hero{min-height:460px;display:flex;align-items:flex-end;justify-content:space-between;gap:60px;padding:clamp(60px,9vw,145px) 0 clamp(48px,7vw,90px)}.hero-word p{margin:0;color:var(--accent);font-size:10px;font-weight:900;letter-spacing:.18em;text-transform:uppercase}.hero-word h1{font-family:var(--jw-font-display,"Syne Variable",system-ui);font-size:clamp(64px,10vw,150px);font-weight:620;line-height:.77;letter-spacing:-.075em;margin:24px 0 0}.hero-word em{color:var(--accent);font-style:normal}.hero-note{width:min(360px,30vw);padding-bottom:12px}.hero-note span{display:inline-block;padding:8px 12px;border:1px solid var(--line);border-radius:999px;font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}.hero-note p{color:var(--body);font-size:17px;line-height:1.55}.filter-dock{position:sticky;top:92px;z-index:15;display:grid;grid-template-columns:minmax(260px,1fr) auto;gap:10px;padding:12px;border:1px solid var(--line);border-radius:22px;background:color-mix(in srgb,var(--bg) 88%,transparent);box-shadow:0 15px 50px rgba(0,0,0,.07);backdrop-filter:blur(22px)}.search-wrap{height:52px;display:flex;align-items:center;gap:10px;padding:0 14px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}.search-wrap>span{font-size:25px}.search-wrap input{min-width:0;flex:1;border:0;outline:0;background:none;color:var(--text);font-size:15px}.search-wrap button{width:30px;height:30px;border:0;border-radius:50%;background:var(--soft);color:var(--muted);cursor:pointer}.payment-tabs{display:flex;padding:4px;border-radius:14px;background:var(--soft)}.payment-tabs button{border:0;border-radius:11px;padding:0 15px;background:transparent;color:var(--muted);font-size:12px;font-weight:850;cursor:pointer}.payment-tabs button span{margin-left:4px;font-size:10px}.payment-tabs button.active{background:var(--text);color:var(--bg);box-shadow:0 5px 16px rgba(0,0,0,.15)}.quick-filters{grid-column:1/-1;display:flex;gap:7px;overflow:auto;padding:1px 0 0;scrollbar-width:none}.quick-filters::-webkit-scrollbar{display:none}.quick-filters button{flex:none;padding:9px 13px;border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--body);font-size:11px;font-weight:800;cursor:pointer}.quick-filters button.active{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 7%,var(--panel))}.result-bar{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:42px 2px 24px}.result-bar strong,.result-bar span{display:block}.result-bar strong{font-family:var(--jw-font-display,"Syne Variable");f
|