/* WNS XtendRack catalogue styling. Layout values live here, not the admin panel. */
.site-header::before { background: var(--brand-dark); }
.site-branding { background:#fff; border-radius:7px; padding:8px 13px; margin-top:15px; box-shadow:0 6px 18px rgba(0,0,0,.10); }
.site-logo--image img { max-width: min(275px, 26vw); max-height: 69px; }
.site-header.is-scrolled .site-branding { margin-top: 0; padding: 4px 8px; }
.site-header.is-scrolled .site-logo--image img { max-height: 48px; }
.site-logo--fallback { color: #151515; }
.logo-emblem { color: #fff; background: var(--accent); }
.header-actions .main-menu > li > a { letter-spacing: .025em; }
.header-actions .main-menu > li > a:hover,
.header-actions .main-menu > li.current-menu-item > a { color: var(--menu-accent); }
.xtr-kicker { display: block; color: var(--accent); font-size: 12px; letter-spacing: .17em; line-height: 1.4; font-weight: 800; text-transform: uppercase; }
.xtr-hero {
    position: relative; min-height: 690px; height: min(825px, 94svh);
    display: flex; align-items: end; color: #fff;
    background: #16171c var(--xtr-hero) center / cover no-repeat;
}
.xtr-hero:before { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(7,8,10,.87) 0%,rgba(9,9,11,.55) 55%,rgba(7,8,10,.13) 100%); }
.xtr-hero-inner { position: relative; z-index: 1; padding: 280px 0 90px; }
.xtr-hero h1 { font-size: clamp(38px, 5.4vw, 76px); font-weight: 850; max-width: 850px; line-height: 1.08; letter-spacing: -.045em; margin: 14px 0 22px; color:#fff; }
.xtr-hero p { max-width: 650px; color:#f1f1f1; font-size: clamp(16px,1.5vw,19px); line-height: 1.65; margin: 0 0 30px; }
.xtr-hero-btn { display: inline-flex; gap:22px; justify-content:space-between; align-items:center; padding:16px 25px; border:0; border-radius:8px; background:var(--accent); color:#fff; text-decoration:none; font-size:13px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; transition:background .2s, transform .2s; }
.xtr-hero-btn:hover { background:var(--accent-hover); transform: translateY(-2px); color:#fff; }
.xtr-about { padding:110px 0; background:#fff; }
.xtr-about-grid { display:grid; grid-template-columns: 1.25fr .75fr; gap: clamp(30px,8vw,130px); align-items:center; }
.xtr-about h2,.xtr-section-heading h2 { font-size:clamp(34px,4vw,56px); letter-spacing:-.04em; line-height:1.16; margin:12px 0 28px; color:#202026; }
.xtr-about p { font-size:16px; line-height:1.85; color:#4c5057; margin:0 0 19px; }
.xtr-about-mark { min-height:360px; padding:60px 40px; background:linear-gradient(140deg,#f8f8f9,#efeff1); border-left:5px solid var(--accent); border-radius:8px; display:flex; flex-direction:column; justify-content:center; overflow:hidden; }
.xtr-about-oversized { font-size: clamp(95px,13vw,190px); font-weight:900; line-height:1; letter-spacing:-.1em; color:#e4e4e6; }
.xtr-about-mark strong { font-size:17px; color:#303034; max-width:300px; line-height:1.4; }
.xtr-products { padding:100px 0 110px; background:#f5f6f7; }
.xtr-section-heading { margin-bottom:20px; }
.xtr-section-heading h2 { margin:8px 0 0; }
.xtr-group-nav { display:flex; flex-wrap:wrap; gap:12px; margin:30px 0 60px; }
.xtr-group-nav a { color:#292930; background:#fff; border:1px solid #dbdcdf; border-radius:8px; padding:12px 17px; font-size:12px; font-weight:750; text-decoration:none; transition:color .2s,border-color .2s; }
.xtr-group-nav a:hover { color:var(--accent); border-color:var(--accent); }
.xtr-group { margin:0 0 72px; scroll-margin-top:105px; }
.xtr-group:last-child { margin-bottom:0; }
.xtr-group-heading { display:flex; gap:20px; align-items:center; justify-content:space-between; border-bottom:2px solid #dcdde0; margin-bottom:28px; padding-bottom:14px; }
.xtr-group-heading h3 { margin:0; color:#24242a; font-size:clamp(25px,2.4vw,34px); letter-spacing:-.03em; }
.xtr-group-heading span { color:var(--accent); font-weight:900; font-size:16px; }
.xtr-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
.xtr-product-card { background:#fff; min-width:0; border:1px solid #e8e8ea; border-radius:12px; overflow:hidden; transition:transform .25s,box-shadow .25s,border-color .25s; }
.xtr-product-card:hover { transform:translateY(-5px); border-color:#ead2d4; box-shadow:0 20px 48px rgba(13,13,18,.11); }
.xtr-card-image { display:flex; justify-content:center; align-items:center; background:#fff; aspect-ratio: 1.15; padding:18px; overflow:hidden; }
.xtr-card-image img { width:100%; height:100%; object-fit:contain; transition:transform .25s; }
.xtr-product-card:hover .xtr-card-image img { transform:scale(1.035); }
.xtr-card-details { padding:25px 28px 29px; border-top:1px solid #eee; }
.xtr-model { color:var(--accent); font-size:24px; line-height:1.1; font-weight:900; letter-spacing:-.03em; }
.xtr-card-details h4 { font-size:15px; color:#282830; font-weight:650; margin:10px 0 27px; line-height:1.5; min-height:46px; }
.xtr-card-details h4 a { text-decoration:none; }
.xtr-details-link { font-weight:750; font-size:12px; text-transform:uppercase; text-decoration:none; color:var(--accent); }
.xtr-cta { padding:65px 0; background:#1b1b20; color:#fff; }
.xtr-cta-grid { display:flex; align-items:center; justify-content:space-between; gap:45px; }
.xtr-cta h2 { margin:9px 0 10px; color:#fff; font-size:clamp(26px,3vw,44px); line-height:1.2; }
.xtr-cta p { margin:0; color:#c6c6cc; }
.xtr-single-product { background:#fff; padding:48px 0 110px; }
.xtr-breadcrumb { display:flex; gap:12px; align-items:center; margin:0 0 35px; font-size:12px; text-transform:uppercase; font-weight:800; color:#72727a; }
.xtr-breadcrumb a { color:var(--accent); text-decoration:none; }
.xtr-detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,6vw,90px); align-items:start; }
.xtr-detail-photo { background:#f6f7f8; display:flex; align-items:center; justify-content:center; padding:26px; border:1px solid var(--line); border-radius:12px; }
.xtr-detail-photo img { width:100%; height:auto; max-height:640px; object-fit:contain; }
.xtr-detail-model { display:block; color:var(--accent); font-size:clamp(40px,5vw,70px); letter-spacing:-.05em; line-height:1.12; margin:14px 0 24px; }
.xtr-description-body > p { font-size:19px; line-height:1.6; margin:0 0 25px; color:#4e4e53; }
.xtr-description-body h2 { color:#202024; font-size:25px; margin:35px 0 20px; }
.xt-specs { width:100%; border-collapse:collapse; font-size:14px; }
.xt-specs th, .xt-specs td { border-bottom:1px solid #e3e4e6; padding:14px 9px; text-align:left; line-height:1.5; vertical-align:top; }
.xt-specs th { color:#606069; font-weight:650; width:55%; }
.xt-specs td { font-weight:800; color:#23232a; }
.xtr-detail-description .xtr-hero-btn { margin-top:28px; }
.xtr-simple-post { min-height:300px; padding:60px 0 100px; }
.xtr-simple-post .entry-content { max-width:830px; }
.xtr-footer { background:#101115; color:#fff; padding:55px 0 22px; border-top:3px solid var(--accent); }
.xtr-footer-main { display:flex; align-items:center; justify-content:space-between; gap:30px; padding-bottom:45px; }
.xtr-footer-logo { display:block; background:#fff; border-radius:7px; padding:8px 12px; }
.xtr-footer-logo img { display:block; width:220px; height:auto; }
.xtr-footer-nav { display:flex; flex-wrap:wrap; gap:23px; }
.xtr-footer-nav a { color:#fff; text-decoration:none; font-size:13px; font-weight:700; }
.xtr-footer-nav a:hover { color:var(--menu-accent); }
.xtr-footer-note { padding-top:22px; border-top:1px solid #444; color:#999aa1; font-size:12px; }
@media(max-width:1100px) {
 .xtr-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .xtr-hero { min-height:600px; }
 .xtr-about-grid { gap:45px; }
}
@media(max-width:991px) {
 .site-branding { margin-top:0; padding:5px 8px; }
 .site-logo--image img { max-width:210px; max-height:55px; }
 .xtr-hero { height:auto; min-height:560px; }
 .xtr-hero-inner { padding:190px 0 75px; }
}
@media(max-width:680px) {
 .xtr-hero { min-height:520px; }
 .xtr-hero-inner { padding:160px 0 50px; }
 .xtr-hero h1 { font-size:37px; }
 .xtr-about,.xtr-products { padding:65px 0; }
 .xtr-about-grid, .xtr-detail-grid { grid-template-columns:1fr; }
 .xtr-about-mark { min-height:220px; padding:30px; }
 .xtr-group-nav { margin-bottom:35px; }
 .xtr-grid { grid-template-columns:1fr; gap:18px; }
 .xtr-card-image { aspect-ratio:1.4; }
 .xtr-group { margin-bottom:50px; }
 .xtr-cta-grid,.xtr-footer-main { flex-direction:column; align-items:flex-start; }
 .xtr-single-product { padding:35px 0 70px; }
 .xtr-footer-nav { gap:17px; }
}
@media(prefers-reduced-motion:reduce) { .xtr-product-card,.xtr-card-image img,.xtr-hero-btn {transition:none;} }

/* Modern surface finish; original section layout is preserved. */
.site-header.is-scrolled::before { background:#101115; box-shadow:0 7px 26px rgba(0,0,0,.20); }
.main-menu .sub-menu { border-top:3px solid var(--accent); box-shadow:0 17px 40px rgba(0,0,0,.22); }
.xtr-hero:before { background:linear-gradient(90deg,rgba(9,10,13,.92) 0%,rgba(15,10,13,.63) 52%,rgba(20,11,14,.19) 100%); }
.xtr-hero h1,.xtr-section-heading h2,.xtr-group-heading h3 { text-wrap:balance; }
.xtr-card-details a:focus-visible,.xtr-group-nav a:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.xtr-details-link:hover { color:var(--accent-hover); }
.xt-specs tr:nth-child(even) { background:#f8f8f9; }
.xtr-detail-description .xtr-description-body h2 { padding-bottom:10px; border-bottom:2px solid #efeff1; }
.xtr-footer-nav a { transition:color .2s; }
@media(max-width:991px) { .site-branding { border-radius:6px; } }
@media(prefers-reduced-motion:reduce) { .xtr-footer-nav a,.xtr-product-card,.xtr-hero-btn { transition:none; } }
