:root { --td-orange:#c8540a; --td-orange-light:#e06010; --td-orange-dark:#a04008; --td-gold:#f5a623; --td-white:#ffffff; --td-text-dark:#222222; --td-gray-bg:#f4f4f4; --td-border:#ddd; } .com-spc { margin:30px 0; } #td-hamburger.active span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); } #td-hamburger.active span:nth-child(2) { opacity:0; } #td-hamburger.active span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); } #td-topbar { background-color:var(--td-orange); font-size:12px; font-family:var(--td-font); padding:6px 20px; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:6px; } #td-topbar .td-topbar-items { display:flex; gap:30px; flex-wrap:wrap; align-items:center; justify-content:space-between; } usmad-icon { position:relative; top:-2px } .td-topbar-item { display:flex; align-items:center; gap:6px; letter-spacing:0.4px; white-space:nowrap; } .td-topbar-item .td-topbar-icon { font-size:14px; } #td-main-nav { background:var(--td-white); border-bottom:1px solid var(--td-border); font-family:var(--td-font); padding:0 20px; display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:70px; position:relative; } #td-primary-links { display:flex; align-items:baseline; gap:2px; list-style:none; } .td-primary-link > a { text-decoration:none; color:var(--td-text-dark); font-size:13px; padding:0 12px; display:flex; align-items:center; letter-spacing:0.5px; transition:color 0.2s; position:relative; } .td-primary-link > a:hover { color:var(--td-orange); text-decoration:none; } .td-has-dropdown > a::after { content:' ▾'; font-size:24px; opacity:0.7; } @keyframes td-fadeSlide { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:translateY(0); } } #td-primary-links { position:static; } #td-main-nav { position:relative; } .td-has-dropdown { position:static; margin-bottom:-8px; } .td-mega-menu { display:none; position:absolute; top:49px; left:0; right:110px; background:var(--td-white); border-bottom:1px solid var(--td-border); box-shadow:0 8px 24px rgba(0, 0, 0, 0.13); z-index:9999; padding:20px 24px 24px; margin:auto; width:46%; } .td-has-dropdown:hover .td-mega-menu { display:block; } .td-mega-header { margin-bottom:14px; } .td-mega-view-all { color:var(--td-orange); font-size:13px; text-decoration:none; text-transform:uppercase; letter-spacing:0.5px; } .td-mega-view-all:hover { text-decoration:underline; } .td-mega-columns { display:flex; gap:0; flex-wrap:nowrap; } .td-mega-col { flex:1; min-width:90px; padding-right:16px; } .td-mega-col-title { color:var(--td-orange); font-size:13px; margin-bottom:10px; display:block; letter-spacing:0.3px; } .td-mega-col ul { list-style:none; padding:0px; } .td-mega-col ul li a { display:block; padding:3px 0; font-size:13px; color:var(--td-text-dark); text-decoration:none; transition:color 0.15s; } .td-mega-col ul li a:hover { color:var(--td-orange); } #app_search_values_mob ul { position:absolute; top:100%; left:0; width:100%; background:#fff; border:1px solid #ddd; border-top:none; list-style:none; margin:0; padding:0; display:block; max-height:200px; overflow-y:auto; z-index:1000; } #app_search_values_mob li { padding:10px; cursor:pointer; font-size:14px; } #btnSearchByInput1 { background:none; border:none; padding:8px 10px; cursor:pointer; font-size:15px; color:#888; } #app_search_values ul { position:absolute; top:100%; left:0; width:100%; background:#fff; border:1px solid #ddd; border-top:none; list-style:none; margin:0; padding:0; max-height:200px; overflow-y:auto; z-index:1000; } #app_search_values li { padding:10px; cursor:pointer; font-size:14px; } #td-nav-actions { display:flex; align-items:center; gap:20px; flex-shrink:0; } #td-search-form { display:flex; align-items:center; border:1px solid var(--td-border); border-radius:4px; overflow:hidden; } #td-search-input { border:none; outline:none; padding:8px 12px; font-size:13px; width:180px; color:var(--td-text-dark); font-family:var(--td-font); } #td-search-input::placeholder { color:#aaa; } #txtSearchByInput1 { border:none; outline:none; padding:8px 12px; font-size:13px; width:180px; color:var(--td-text-dark); font-family:var(--td-font); } #txtSearchByInput1::placeholder { color:#aaa; } #td-search-btn { background:none; border:none; padding:8px 10px; cursor:pointer; font-size:15px; color:#888; } #td-cart-btn { position:relative; text-decoration:none; font-size:22px; color:var(--td-text-dark); } #td-cart-badge { position:absolute; top:-6px; right:-8px; background:var(--td-orange); color:#fff; font-size:10px; width:17px; height:17px; border-radius:50%; display:flex; align-items:center; justify-content:center; } #tdcartbadge { position:absolute; top:-6px; right:-8px; background:var(--td-orange); color:#fff; font-size:10px; width:17px; height:17px; border-radius:50%; display:flex; align-items:center; justify-content:center; } #td-quote-btn { background:var(--td-orange); color:var(--td-white); border:none; padding:10px 18px; font-size:13px; border-radius:5px; cursor:pointer; white-space:nowrap; transition:background 0.2s; font-family:var(--td-font); letter-spacing:0.3px; } #td-quote-btn:hover { background:var(--td-orange-dark); } #td-hamburger { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px; } #td-hamburger span { display:block; width:24px; height:2px; background:var(--td-text-dark); border-radius:2px; transition:all 0.3s; } #td-category-bar { background:var(--td-white); border-bottom:2px solid var(--td-border); font-family:var(--td-font); padding:0 20px; overflow-x:auto; } #td-category-list { display:flex; list-style:none; gap:0; white-space:nowrap; min-width:max-content; justify-content:center; margin:0px; } .td-category-item a { display:block; padding:7px 14px; font-size:12px; text-decoration:none; color:var(--td-text-dark); letter-spacing:0.5px; text-transform:uppercase; transition:color 0.2s; border-bottom:3px solid transparent; } @media (max-width:900px) { #td-primary-links { display:none; } #td-hamburger { display:flex; } #td-search-input { width:120px; } #txtSearchByInput1 { width:120px; } } @media (max-width:600px) { #td-topbar .td-topbar-items { gap:12px; display:grid; grid-template-columns:auto auto; } #td-topbar { font-size:8px; } #td-search-form { display:none; } #td-main-nav { padding:0 12px; } #td-category-bar { padding:0 8px; } .td-category-item a { padding:10px 8px; font-size:10px; } } #td-mobile-nav { display:none; background:var(--td-white); border-bottom:1px solid var(--td-border); font-family:var(--td-font); padding:0 20px; } #td-mobile-nav.td-open { display:block; } #td-mobile-nav > ul { list-style:none; padding:0px; } .td-mob-row { display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #f0f0f0; } .td-mob-row a { display:block; padding:12px 0; font-size:14px; color:var(--td-text-dark); text-decoration:none; flex:1; } .td-mob-row a:hover { color:var(--td-orange); } .td-mob-toggle { background:transparent; border:none; cursor:pointer; font-size:32px; color:var(--td-text-dark); padding:6px 10px; line-height:1; transition:transform 0.25s, background 0.2s, color 0.2s; flex-shrink:0; } .td-mob-toggle:hover { background:var(--td-orange); color:#fff; border-color:var(--td-orange); } .td-mob-toggle.td-open { transform:rotate(180deg); color:#c8540a; } .td-mobile-sub { list-style:none; display:none; padding:6px 0 6px 16px; background:#fafafa; border-left:3px solid var(--td-orange); margin-bottom:4px; } .td-mobile-sub.td-open { display:block; } .td-mobile-sub li a { display:block; padding:7px 0; font-size:13px; color:#444; text-decoration:none; border-bottom:1px solid #f0f0f0; } .td-mobile-sub li:last-child a { border-bottom:none; } .td-mobile-sub li a:hover { color:var(--td-orange); } .td-mob-simple a { display:block; padding:12px 0; font-size:14px; color:var(--td-text-dark); text-decoration:none; border-bottom:1px solid #f0f0f0; } .td-mob-simple a:hover { color:var(--td-orange); } .user_login { color:#222222; text-decoration:none; font-size:13px; display:flex; align-items:center; gap:10px; } .user_login i { font-size:26px; } .rk-breadcrumb { padding:12px 20px; background:#f8f9fb; border-radius:8px; } .rk-breadcrumb__list { display:flex; flex-wrap:wrap; align-items:center; gap:6px; list-style:none; margin:0; padding:0; } .rk-breadcrumb__link { text-decoration:none; color:#555; font-size:14px; transition:color 0.3s ease; } .rk-breadcrumb__link:hover { color:#000; } .rk-breadcrumb__separator { color:#999; font-size:14px; } .rk-breadcrumb__item--active { color:#000; font-weight:600; font-size:14px; } @media (max-width:576px) { .rk-breadcrumb { padding:10px 15px; } .rk-breadcrumb__link, .rk-breadcrumb__item--active { font-size:13px; } } .td-search-wrapper { position:relative; } .td-search-suggestions { position:absolute; top:100%; left:0; width:100%; background:#fff; border:1px solid #ddd; border-top:none; list-style:none; margin:0; padding:0; display:none; max-height:200px; overflow-y:auto; z-index:1000; } .td-search-suggestions li { padding:10px; cursor:pointer; font-size:14px; } .td-search-suggestions li:hover { background:#f2f2f2; } #td-mob-search-wrap { display:none; padding:12px 0 8px; border-bottom:1px solid #f0f0f0; position:relative; } #td-mob-search-form { display:flex; align-items:center; border:1px solid var(--td-border); border-radius:6px; overflow:hidden; background:#fff; } #td-mob-search-input { border:none; outline:none; padding:10px 12px; font-size:14px; width:100%; color:var(--td-text-dark); font-family:var(--td-font); } #td-mob-search-input::placeholder { color:#aaa; } #td_mob_search_input { border:none; outline:none; padding:10px 12px; font-size:14px; width:100%; color:var(--td-text-dark); font-family:var(--td-font); } #td_mob_search_input::placeholder { color:#aaa; } #td-mob-search-btn { background:var(--td-orange); border:none; padding:10px 14px; cursor:pointer; font-size:15px; color:#fff; } #td_mob_search_btn { background:var(--td-orange); border:none; padding:10px 14px; cursor:pointer; font-size:15px; color:#fff; } @media (max-width:600px) { #td-mob-search-wrap { display:block; margin:0px 12px; } } :root { --faq-bg:#f7f5f0; --faq-card-bg:#ffffff; --faq-accent:#c87d2f; --faq-accent-light:#f5e9d8; --faq-text-dark:#1a1a1a; --faq-text-body:#4a4a4a; --faq-text-muted:#888; --faq-border:#e8e2d9; --faq-border-active:#c87d2f; --faq-radius:14px; --faq-shadow:0 2px 12px rgba(0,0,0,0.06); --faq-shadow-hover:0 6px 24px rgba(200,125,47,0.13); --faq-transition:0.32s cubic-bezier(0.4, 0, 0.2, 1); } #faq-section-wrapper { } #faq-section-header { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-bottom:32px; } #faq-section-title { font-size:clamp(1.8rem, 4vw, 2.6rem); color:var(--faq-text-dark); line-height:1.1; } #faq-section-title span { color:var(--faq-accent); } #faq-schema-badge { display:inline-flex; align-items:center; gap:6px; padding:7px 16px; border:1.5px solid var(--faq-accent); border-radius:999px; font-size:13px; font-weight:600; color:var(--faq-accent); letter-spacing:0.04em; background:transparent; white-space:nowrap; cursor:default; transition:background var(--faq-transition), color var(--faq-transition); } #faq-schema-badge::before { content:'✓'; font-weight:700; } #faq-schema-badge:hover { background:var(--faq-accent-light); } #faq-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; } @media (max-width:640px) { #faq-grid { grid-template-columns:1fr; } } .faq-card { background:var(--faq-card-bg); border:1.5px solid var(--faq-border); border-radius:var(--faq-radius); box-shadow:var(--faq-shadow); overflow:hidden; transition:box-shadow var(--faq-transition), border-color var(--faq-transition), transform var(--faq-transition); cursor:pointer; } .faq-card:hover { box-shadow:var(--faq-shadow-hover); transform:translateY(-1px); } .faq-card.faq-card--active { border-color:var(--faq-border-active); box-shadow:0 0 0 3px rgba(200,125,47,0.10), var(--faq-shadow-hover); } .faq-card__toggle { width:100%; background:none; border:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:20px 22px; text-align:left; } .faq-card__question { font-size:14px; font-weight:600; color:var(--faq-text-dark); line-height:1.45; flex:1; } .faq-card__icon { flex-shrink:0; width:28px; height:28px; border-radius:50%; border:1.5px solid var(--faq-border); display:flex; justify-content:center; font-size:22px; font-weight:300; color:var(--faq-accent); background:var(--faq-accent-light); transition:background var(--faq-transition), border-color var(--faq-transition), transform var(--faq-transition); line-height:1; user-select:none; } .faq-card.faq-card--active .faq-card__icon { background:var(--faq-accent); border-color:var(--faq-accent); color:#fff; transform:rotate(45deg); } .faq-card__body { display:grid; grid-template-rows:0fr; transition:grid-template-rows var(--faq-transition); } .faq-card.faq-card--active .faq-card__body { grid-template-rows:1fr; } .faq-card__body-inner { overflow:hidden; } .faq-card__answer { padding:0 22px 20px; font-size:13px; line-height:1.7; color:var(--faq-text-body); border-top:1px solid var(--faq-border); padding-top:14px; } .faq-card__divider { height:1px; background:var(--faq-border); margin:0 22px; opacity:0; transition:opacity var(--faq-transition); } .faq-card.faq-card--active .faq-card__divider { opacity:1; } :root { --rv-bg:#f7f5f0; --rv-card-bg:#edeae3; --rv-white:#ffffff; --rv-accent:#c87d2f; --rv-accent-dark:#a0621f; --rv-text-dark:#1a1a1a; --rv-text-body:#444; --rv-text-muted:#888; --rv-border:#ddd8ce; --rv-radius:16px; --rv-shadow:0 2px 16px rgba(0,0,0,0.07); --rv-transition:0.35s cubic-bezier(0.4,0,0.2,1); } #rv-section-heading { font-size:clamp(1.6rem, 3.5vw, 2.2rem); color:var(--rv-text-dark); margin-bottom:28px; line-height:1.15; } #rv-section-heading span { color:var(--rv-accent); } #rv-panel { background:var(--rv-white); border-radius:var(--rv-radius); box-shadow:var(--rv-shadow); display:flex; gap:0; overflow:hidden; } #rv-rating-summary { flex:0 0 220px; padding:32px 28px; border-right:1px solid var(--rv-border); display:flex; flex-direction:column; gap:10px; } #rv-rating-score { font-size:5rem; color:var(--rv-accent); line-height:1; font-weight:700; text-align:center; } #rv-rating-stars { display:flex; justify-content:center; gap:3px; } .rv-star { color:var(--rv-accent); font-size:23px; } #rv-rating-count { font-size:13px; color:var(--rv-text-muted); justify-content:center; display:flex; } #rv-bars-list { margin-top:12px; display:flex; flex-direction:column; gap:7px; } .rv-bar-row { display:flex; align-items:center; gap:8px; font-size:0.75rem; color:var(--rv-text-body); } .rv-bar-label { width:22px; text-align:right; white-space:nowrap; color:var(--rv-text-muted); font-size:13px; } .rv-bar-track { flex:1; height:5px; background:#e0dbd3; border-radius:99px; overflow:hidden; } .rv-bar-fill { height:100%; border-radius:99px; background:var(--rv-accent); transition:width 1s ease; } .rv-bar-pct { width:28px; font-size:13px; color:var(--rv-text-muted); } #rv-carousel-area { flex:1; min-width:0; display:flex; flex-direction:column; padding:28px 24px 20px; gap:16px; } #rv-carousel-track-outer { overflow:hidden; border-radius:10px; } #rv-carousel-track { display:flex; gap:16px; transition:transform var(--rv-transition); will-change:transform; } .rv-review-card { flex:0 0 calc(50% - 8px); background:var(--rv-card-bg); border-radius:12px; padding:22px 20px 20px; display:flex; flex-direction:column; gap:12px; min-height:160px; } @media (max-width:700px) { .rv-review-card { flex:0 0 100%; } } .rv-review-card__stars { display:flex; gap:2px; } .rv-review-card__star { color:var(--rv-accent); font-size:23px; } .rv-review-card__quote { font-size:14px; line-height:1.65; color:var(--rv-text-body); font-style:italic; flex:1; } .rv-review-card__author { font-size:14px; font-weight:600; color:var(--rv-accent-dark); margin-top:4px; } #rv-carousel-controls { display:flex; align-items:center; justify-content:space-between; gap:12px; } #rv-carousel-dots { display:flex; gap:7px; } .rv-dot { width:8px; height:8px; border-radius:50%; background:var(--rv-border); border:none; cursor:pointer; padding:0; transition:background var(--rv-transition), transform var(--rv-transition); } .rv-dot.rv-dot--active { background:var(--rv-accent); transform:scale(1.25); } #rv-carousel-arrows { display:flex; gap:8px; } .rv-arrow-btn { width:36px; height:36px; border-radius:50%; border:1.5px solid var(--rv-border); background:var(--rv-white); cursor:pointer; display:flex; align-items:center; justify-content:center; color:var(--rv-accent); font-size:30px; transition:background var(--rv-transition), border-color var(--rv-transition), color var(--rv-transition); } .rv-arrow-btn:hover { background:var(--rv-accent); border-color:var(--rv-accent); color:#fff; } .rv-arrow-btn:disabled { opacity:0.35; cursor:not-allowed; } .rv-arrow-btn:disabled:hover { background:var(--rv-white); border-color:var(--rv-border); color:var(--rv-accent); } @media (max-width:780px) { #rv-panel { flex-direction:column; } #rv-rating-summary { flex:none; border-right:none; border-bottom:1px solid var(--rv-border); flex-direction:row; flex-wrap:wrap; align-items:flex-start; gap:16px; padding:24px; } #rv-rating-left-col { display:flex; flex-direction:column; gap:6px; } #rv-bars-list { margin-top:0; flex:1; min-width:160px; } } @media (max-width:480px) { #rv-carousel-area { padding:20px 14px 16px; } }