/* Shared finishing system: soft surfaces, restrained radii, consistent spacing. */
:root{--paper:#f3f5f8;--ink:#142131;--muted:#7e8999;--line:#e8edf2;--card-radius:14px;--control-radius:10px;--surface-shadow:0 8px 30px #15223206}
body{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Noto Sans SC','Microsoft YaHei',sans-serif;-webkit-font-smoothing:antialiased}
header{background:#ffffffed;border-bottom-color:#e9edf280}
.desktop-nav .nav-quote{border-radius:var(--control-radius)}
.brand-mark{border-radius:9px}
.primary,.outline{border-radius:var(--control-radius);min-height:46px;transition:background .2s,box-shadow .2s,transform .2s}
.primary{background:linear-gradient(115deg,#f18b35,#e76c24);border-color:#ec7c2b;box-shadow:0 5px 14px #e9782116;font-weight:600}
.primary:active,.outline:active{transform:translateY(1px)}
.outline{background:#fff;border-color:#acb6c3}
.page-title h1,.section-heading h2{font-weight:700;letter-spacing:-.5px}
.page-title .subtitle{color:#8b95a3}
.search{background:#edf0f4;border:1px solid #ffffff90;box-shadow:inset 0 1px 2px #192c401f;margin-bottom:24px;min-height:44px}
.search:focus-within{box-shadow:0 0 0 3px #ed7a2312;border-color:#edac7b}
.search input{font-size:13px}
.category{border-radius:var(--card-radius);box-shadow:0 3px 10px #1422320c;isolation:isolate}
.category:after{inset:48% 0 0;background:linear-gradient(180deg,transparent,#0a152bc4)}
.category .category-photo img{transform:scale(1.055);filter:brightness(1.14);object-position:45% 57%}
.category-label{font-weight:600;bottom:14px;left:15px;right:13px;align-items:center;text-shadow:0 1px 4px #0006}
.category-label svg{width:18px;height:18px;stroke-width:1.5;opacity:.9}
.tabs button,.tag{border-radius:8px;background:#eef1f5}
.tabs button{min-height:34px}
.tabs button.active{background:#fff1e6;box-shadow:inset 0 0 0 1px #efa568}
.tabs.solid button.active{background:linear-gradient(120deg,#f18a34,#ea7126);box-shadow:0 3px 9px #ea71261a}
#filter-toggle{display:flex;align-items:center;gap:4px}#filter-toggle svg{width:13px;height:13px}
.product{border-radius:var(--card-radius);box-shadow:var(--surface-shadow);border-color:#e8edf2;transition:box-shadow .2s,transform .2s}
.product h3{font-weight:600}.product-info{padding:20px 22px}.product p{color:#8690a0}.price{font-weight:600}
.detail-photo{border-radius:20px}.detail-body{background:#fff;border-radius:20px;padding:28px;box-shadow:var(--surface-shadow)}
.detail{gap:28px;align-items:start}.detail h1{font-size:27px;font-weight:700;letter-spacing:-.6px}
.image-note{font-size:10px;color:#929aaa;margin-bottom:12px}.specs th{color:#7f8998}.specs th,.specs td{border-color:#edf0f4;padding:16px 9px}
.tags{gap:8px}.tag{font-size:12px;color:#647182}
.quote-form{border-radius:20px;padding:32px;border:1px solid #fff;box-shadow:var(--surface-shadow)}
.quote-aside{border-radius:20px;background:radial-gradient(ellipse at 95% 5%,#344252,transparent 65%),#142230}
.field{font-weight:500}.field input,.field select,.field textarea{border-radius:9px;border-color:#e3e8f0;background:#fafbfd;min-height:43px;transition:border-color .2s,box-shadow .2s}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:#eeaa77;box-shadow:0 0 0 3px #ed7a2310}
.help{color:#8b95a3}.quote-form h1{font-weight:700}
.warehouse-tile{border-radius:12px;box-shadow:var(--surface-shadow)}.warehouse-caption{padding:35px 20px 18px;background:linear-gradient(transparent,#101a26cb)}
.advantages{background:radial-gradient(ellipse at 70% 0%,#34425280,transparent 70%),#13212f}
.adv-icon{background:linear-gradient(135deg,#ffffff30,#ffffff12);border-color:#ffffff18;box-shadow:inset 0 1px 1px #ffffff35,0 6px 15px #0001}
.adv-grid h3{font-weight:600}.adv-grid p{color:#c2cad4}.adv-icon svg{stroke-width:1.8}
.about-banner{border-radius:20px 20px 0 0}.about-body{border-radius:0 0 20px 20px;box-shadow:var(--surface-shadow)}
.contact>svg{background:linear-gradient(130deg,#f0f3f7,#e5eaf0)}
.cart-row:first-of-type{border-radius:16px 16px 0 0}.cart-actions{border-radius:0 0 16px 16px}
dialog{border-radius:18px}dialog .dialog-bar button{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:#f0f3f6}
@media(hover:hover){.product:hover{box-shadow:0 8px 26px #14223212;transform:translateY(-2px)}.primary:hover{box-shadow:0 7px 20px #e9782130}}
@media(min-width:901px){
body[data-page='categories'] .page{max-width:1240px;margin:34px auto 60px;padding:32px;background:#fff;border-radius:22px;box-shadow:var(--surface-shadow);min-height:0}
body[data-page='categories'] .category{height:auto;aspect-ratio:1.35}
body[data-page='categories'] .search{max-width:560px;margin-bottom:28px}
.intro{max-width:1180px;margin:0 auto;border-radius:20px;overflow:hidden}
.hero h1{letter-spacing:1px}.hero:after{background:linear-gradient(90deg,#101d2cf5,#101d2ce8 25%,#101d2c30 80%)}
}
@media(max-width:600px){
body{background:linear-gradient(135deg,#fff 0%,#f8fafe 65%,#f3f6fa 100%);padding-bottom:calc(69px + env(safe-area-inset-bottom));min-height:100vh}
body:not([data-page='home']) header{display:none}
.page{padding:25px 20px 28px;min-height:calc(100dvh - 70px)}
.page-title{min-height:32px;margin-bottom:18px;gap:8px;align-items:center}
.page-title h1{font-size:22px;line-height:1.4}.page-title .subtitle{font-size:11px}
.page-title .back{width:34px;height:34px;margin-left:-8px;justify-content:center}.page-title .back svg{width:20px;height:20px}
.search{margin:0 0 17px;padding:9px 14px;min-height:42px;box-shadow:none;border:0;background:#eff1f5}
.categories{gap:12px}.category,.page .category{height:auto;aspect-ratio:1.52;border-radius:11px}
.category-label{font-size:15px;left:13px;right:10px;bottom:11px;letter-spacing:.2px}
.category:after{inset:55% 0 0}
#bottom{min-height:65px;padding:9px 12px max(10px,env(safe-area-inset-bottom));background:#ffffffeb;border-top:1px solid #edf0f6;box-shadow:0 -5px 22px #15223204}
#bottom a{font-size:10px;gap:5px;color:#84909e}#bottom a svg{stroke-width:1.65;width:21px;height:21px}#bottom a.active{color:#ed7928}
body[data-page='products'] .page-title{position:relative;justify-content:center;margin-bottom:18px}
body[data-page='products'] .page-title .back{position:absolute;left:0}
body[data-page='products'] .page-title h1{font-size:21px}
.tabs{gap:9px;margin-bottom:8px;padding-bottom:5px}.tabs button{padding:7px 16px;min-height:33px}
.product{padding:14px 0;gap:15px;border-radius:0;box-shadow:none;border-color:#eaf0f5}
.product>.photo{width:110px;height:108px;border-radius:10px}
.product-info{padding:2px 0}.product h3{font-size:14px;margin-bottom:6px}.product p{line-height:1.95;font-size:12px}.price{margin-top:5px}
body[data-page='detail'] .page{padding-top:0}
body[data-page='detail'] .page>.page-title{position:absolute;inset:17px 20px auto;z-index:3;justify-content:space-between;margin:0;pointer-events:none}
body[data-page='detail'] .page-title h1{display:none}
body[data-page='detail'] .page-title .back,body[data-page='detail'] #favorite{pointer-events:auto;background:#24313a6e;color:white;border:1px solid #ffffff22;border-radius:50%;width:36px;height:36px;display:grid;place-items:center;margin:0;backdrop-filter:blur(8px)}
body[data-page='detail'] #favorite.saved{color:#ffad6c}
.detail{margin:0 -20px;display:block}.detail-photo{height:340px;border-radius:0}
.photo.category-photo.detail-photo img{object-fit:cover;object-position:42% 50%}
.detail-body{position:relative;margin-top:-22px;border-radius:22px 22px 0 0;padding:24px 20px 28px;box-shadow:0 -8px 24px #18243108}
.detail h1{font-size:25px;margin-bottom:14px}.image-note{font-size:9px;margin-bottom:9px}
.tags{margin-bottom:18px}.tag{padding:6px 11px;border-radius:6px}.specs th,.specs td{padding:14px 6px}.specs{margin-bottom:25px}
.actions{gap:12px}.actions>*{min-height:46px;border-radius:10px;padding:12px 14px}
.quote-form{padding:0;background:transparent;border:0;box-shadow:none;border-radius:0}.quote-form h1{font-size:23px}
.quote-form .help{margin-top:7px;margin-bottom:25px;line-height:1.8}.field{font-size:13px;margin-bottom:19px}.field input,.field select,.field textarea{padding:11px 12px;margin-top:9px}.field textarea{min-height:85px}.quote-form .primary{min-height:47px}
.warehouse-grid{gap:11px;grid-template-rows:245px 128px 128px;grid-auto-rows:128px}.warehouse-tile{border-radius:10px}.warehouse-caption{padding:28px 15px 15px}.warehouse-caption strong{font-size:15px}
body[data-page='warehouse'] .tabs{margin-bottom:15px}.tabs.solid button{padding:7px 12px}
body[data-page='about'] .page{padding-top:0}.about-banner{margin:0 -20px;height:240px;border-radius:0}.about-banner .banner-copy{bottom:34px}.about-body{margin:-20px -20px 0;padding:25px 22px 30px;border-radius:20px 20px 0 0;position:relative}.about-body>p{font-size:13px;line-height:1.95}.metrics{padding:25px 0;margin-bottom:23px}.metrics strong{font-size:24px}.contact{gap:13px}
.home-header{height:86px;background:linear-gradient(#13212bc9,#13212b30);border:0}.home-header .brand strong{font-size:16px}.home-header .brand small{font-size:7px}
.hero{height:490px}.hero-content{padding-top:151px}.hero h1{font-size:35px;letter-spacing:.4px;font-weight:750}.hero p{font-size:13px;color:#e4e8ed}.hero .primary{padding:11px 23px;min-height:43px;box-shadow:0 4px 14px #e9782126}.trust{margin-top:-72px;padding-bottom:30px}.trust svg{stroke-width:1.9}.trust strong{font-size:11px}
.section{padding:30px 20px}.section-heading h2{font-size:21px}.intro{position:relative;background:#e7edf3;isolation:isolate;min-height:230px}.intro>.photo{position:absolute;inset:0 0 0 34%;opacity:1;z-index:-2}.intro:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#e7edf3 8%,#e7edf3ed 38%,#e7edf330 100%)}.intro-copy{width:245px;padding:26px 0 25px 22px}.intro p{color:#536171}
.advantages .section{padding:32px 24px 37px}.adv-grid{gap:30px 20px}.adv-icon{width:55px;height:55px}.partner{min-height:275px}.partner .photo{opacity:.85}.partner>div:not(.photo){padding:28px 23px}
}
/* Persistent direct-dial contact, outside the route rendering container. */
.floating-phone{position:fixed;right:26px;bottom:30px;z-index:1000;display:flex;align-items:center;justify-content:center;gap:11px;min-height:58px;padding:12px 20px;border:1px solid #ffffff75;border-radius:32px;background:linear-gradient(135deg,#fa963e,#e86c24);color:#fff;box-shadow:0 7px 24px #bf531e3d,0 2px 6px #14223212;text-decoration:none;transition:transform .2s,box-shadow .2s}
.floating-phone svg{width:25px;height:25px;stroke-width:1.8}
.floating-phone strong{display:block;font-size:14px;font-weight:600;line-height:1.5}
.floating-phone small{display:block;font-size:11px;letter-spacing:.4px;line-height:1.5;opacity:.95}
.floating-phone:focus-visible{outline:3px solid #152232;outline-offset:4px}
.floating-phone:active{transform:scale(.96)}
@media(hover:hover){.floating-phone:hover{transform:translateY(-2px);box-shadow:0 10px 28px #bf531e50}}
@media(max-width:600px){
.floating-phone{right:14px;bottom:calc(84px + env(safe-area-inset-bottom));width:64px;min-height:66px;padding:10px 5px;gap:5px;flex-direction:column;border-radius:20px;box-shadow:0 5px 17px #bf531e38}
.floating-phone svg{width:23px;height:23px}.floating-phone strong{font-size:10px;line-height:1.4}.floating-phone small{display:none}
.page{padding-bottom:106px}body[data-page='home'] .partner{padding-bottom:62px}
}
.hero .hero-slide.real-photo{opacity:0;transition:opacity .85s ease;pointer-events:none}
.hero .hero-slide.real-photo.is-active{opacity:1}
.hero-carousel-controls{position:absolute;right:5%;bottom:24px;z-index:4;display:flex;align-items:center;gap:7px;color:#fff}
.hero-carousel-controls>button{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#14233166;border:1px solid #ffffff24;color:white;backdrop-filter:blur(5px);font-size:13px}
.hero-carousel-controls svg{width:17px;height:17px}.hero-dots{display:flex;align-items:center}
.hero-dots button{display:grid;place-items:center;width:26px;height:32px;padding:0}
.hero-dots span{width:6px;height:6px;border-radius:6px;background:#ffffff70;transition:width .25s,background .25s}
.hero-dots [aria-current='true'] span{width:21px;background:#f38a36}
@media(max-width:600px){.hero-carousel-controls{left:22px;right:auto;bottom:105px;gap:4px}.hero-carousel-controls>button{width:28px;height:28px}.hero-dots button{height:28px;width:25px}.hero .hero-slide.real-photo.is-active{opacity:.85}}
@media(prefers-reduced-motion:reduce){.hero .hero-slide.real-photo,.hero-dots span{transition:none}}
