/* ========================================================== XAYSI SHIPPING POLICY (SCOPED / WPBakery-SAFE) - No // - Scoped CSS to avoid theme/plugin conflicts - Includes: smooth scroll + real search highlight (no alert) =========================================================== */ .xaysi-policy-shipping{ --gold:#D4AF37; --gold-light:#F4E4A6; --gold-dark:#B8860B; --grey-dark:#2C2C2C; --grey-medium:#4A4A4A; --grey-light:#F5F5F5; --grey-bg:#F9F9F9; --white:#FFFFFF; --text-dark:#333333; --text-light:#666666; --shadow:0 8px 30px rgba(0,0,0,.08); --shadow-lg:0 15px 35px rgba(0,0,0,.15); --transition:all .3s ease; font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background:var(--grey-bg); color:var(--text-dark); line-height:1.7; overflow-x:hidden; position:relative; } .xaysi-policy-shipping *{ margin:0; padding:0; box-sizing:border-box; } .xaysi-policy-shipping .container{ max-width:1200px; margin:0 auto; padding:0 20px; } .xaysi-policy-shipping section{ padding:70px 0; } /* ================= HEADER ================= */ .xaysi-policy-shipping .policy-header{ background:linear-gradient(135deg,var(--grey-dark) 0%,var(--grey-medium) 100%); color:var(--white); padding:80px 0 55px; position:relative; overflow:hidden; border-radius:16px; margin-bottom:30px; } .xaysi-policy-shipping .policy-header::before{ content:""; position:absolute; inset:0; background: linear-gradient(135deg, rgba(212,175,55,.22) 0%, rgba(212,175,55,.12) 35%, transparent 36%), radial-gradient(700px 360px at 10% 10%, rgba(212,175,55,.18), transparent 60%); pointer-events:none; } .xaysi-policy-shipping .header-content{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:28px; position:relative; z-index:1; } .xaysi-policy-shipping .header-text{ flex:1; min-width:280px; } .xaysi-policy-shipping .header-title{ font-size:46px; margin:0 0 10px; font-weight:900; line-height:1.15; background:linear-gradient(90deg,var(--white),var(--gold-light)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; } .xaysi-policy-shipping .header-subtitle{ font-size:16px; margin:0; font-weight:600; color:var(--gold-light); max-width:780px; line-height:1.65; } .xaysi-policy-shipping .header-actions{ flex:0 0 450px; background:rgba(255,255,255,.96); border-radius:20px; padding:26px; box-shadow:var(--shadow-lg); border-top:5px solid var(--gold); } /* Search */ .xaysi-policy-shipping .search-container{ position:relative; margin-bottom:14px; } .xaysi-policy-shipping .search-container input{ width:100%; padding:14px 16px; border:2px solid var(--grey-light); border-radius:999px; font-size:14px; transition:var(--transition); background:var(--white); outline:none; } .xaysi-policy-shipping .search-container input:focus{ border-color:var(--gold); box-shadow:0 0 0 3px rgba(212,175,55,.2); } .xaysi-policy-shipping .search-container button{ position:absolute; right:6px; top:6px; background:var(--gold); border:none; color:var(--grey-dark); padding:10px 16px; border-radius:999px; cursor:pointer; transition:var(--transition); font-weight:900; font-size:13px; display:flex; align-items:center; gap:8px; } .xaysi-policy-shipping .search-container button:hover{ background:var(--gold-dark); color:var(--white); transform:scale(1.03); } .xaysi-policy-shipping .search-hint{ font-size:12px; color:var(--text-light); text-align:center; margin-top:6px; line-height:1.5; } .xaysi-policy-shipping .quick-links{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:14px; } .xaysi-policy-shipping .quick-link{ background:var(--grey-light); color:var(--text-dark); padding:10px 14px; border-radius:999px; text-decoration:none; font-weight:900; font-size:13px; transition:var(--transition); border:1px solid rgba(0,0,0,.06); } .xaysi-policy-shipping .quick-link:hover{ background:var(--gold); color:var(--grey-dark); transform:translateY(-2px); box-shadow:0 10px 22px rgba(212,175,55,.18); } /* ================= TITLES ================= */ .xaysi-policy-shipping .section-title{ text-align:center; font-size:28px; margin:0 0 30px; color:var(--grey-dark); font-weight:900; line-height:1.25; position:relative; } .xaysi-policy-shipping .section-title:after{ content:""; display:block; width:110px; height:6px; background:linear-gradient(90deg,var(--gold),var(--gold-light)); margin:14px auto 0; border-radius:3px; } .xaysi-policy-shipping .section-subtitle{ text-align:center; font-size:14px; margin:-18px auto 40px; color:var(--text-light); max-width:900px; line-height:1.7; padding:0 10px; } /* ================= INTRO ================= */ .xaysi-policy-shipping .introduction{ background:var(--white); border-radius:16px; } .xaysi-policy-shipping .intro-content{ max-width:1000px; margin:0 auto; text-align:center; } .xaysi-policy-shipping .intro-text{ font-size:14px; line-height:1.9; color:var(--text-dark); margin:0 auto 18px; max-width:980px; text-align:left; } .xaysi-policy-shipping .intro-text p{ margin:0 0 14px; } .xaysi-policy-shipping .highlight-box{ background:linear-gradient(135deg,var(--gold-light) 0%,var(--gold) 100%); padding:22px; border-radius:18px; color:var(--grey-dark); box-shadow:var(--shadow); margin:18px auto 0; max-width:980px; text-align:left; } .xaysi-policy-shipping .highlight-box h3{ font-size:18px; margin:0 0 8px; font-weight:900; text-align:left; } .xaysi-policy-shipping .highlight-box p{ font-size:14px; line-height:1.85; margin:0; font-weight:700; } /* ================= POLICY CONTENT ================= */ .xaysi-policy-shipping .policy-content{ background:var(--grey-light); border-radius:16px; } .xaysi-policy-shipping .policy-sections{ max-width:1000px; margin:0 auto; } .xaysi-policy-shipping .policy-section{ background:var(--white); border-radius:18px; padding:18px; box-shadow:var(--shadow); margin-bottom:14px; position:relative; overflow:hidden; border:1px solid rgba(0,0,0,.06); } .xaysi-policy-shipping .policy-section::before{ content:""; position:absolute; top:0; left:0; right:0; height:6px; background:linear-gradient(90deg,var(--gold),var(--gold-light)); } .xaysi-policy-shipping .policy-section h2{ font-size:18px; margin:10px 0 10px; color:var(--grey-dark); font-weight:900; line-height:1.35; } .xaysi-policy-shipping .policy-section h3{ font-size:14px; margin:14px 0 8px; color:var(--grey-dark); font-weight:900; line-height:1.35; } .xaysi-policy-shipping .policy-section p{ color:var(--text-dark); font-size:14px; line-height:1.85; margin:0 0 10px; } .xaysi-policy-shipping .policy-section ul{ margin:0 0 10px 18px; padding-left:12px; } .xaysi-policy-shipping .policy-section li{ color:var(--text-dark); font-size:14px; line-height:1.85; margin:0 0 6px; } .xaysi-policy-shipping .policy-section li::marker{ color:var(--gold); } .xaysi-policy-shipping .policy-section strong{ font-weight:900; } /* ================= PRINCIPLES ================= */ .xaysi-policy-shipping .policy-principles{ background:var(--white); border-radius:16px; margin-top:30px; } .xaysi-policy-shipping .principles-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:14px; max-width:1000px; margin:0 auto; align-items:stretch; } .xaysi-policy-shipping .principle-item{ text-align:center; padding:22px 18px; background:rgba(245,245,245,.55); border-radius:18px; border:1px solid rgba(0,0,0,.06); box-shadow:var(--shadow); transition:var(--transition); } .xaysi-policy-shipping .principle-item:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:rgba(212,175,55,.35); } .xaysi-policy-shipping .principle-icon{ font-size:28px; color:var(--gold); margin:8px 0 12px; } .xaysi-policy-shipping .principle-title{ font-size:16px; font-weight:900; color:var(--grey-dark); margin:0 0 8px; line-height:1.35; } .xaysi-policy-shipping .principle-description{ font-size:14px; color:var(--text-light); line-height:1.75; margin:0; } /* ================= CTA ================= */ .xaysi-policy-shipping .cta-section{ background:linear-gradient(135deg,var(--grey-dark) 0%,var(--grey-medium) 100%); color:var(--white); border-radius:16px; overflow:hidden; position:relative; margin-top:30px; } .xaysi-policy-shipping .cta-section::before{ content:""; position:absolute; inset:0; background:linear-gradient(135deg, rgba(212,175,55,.18) 0%, transparent 45%); pointer-events:none; } .xaysi-policy-shipping .cta-content{ background:rgba(255,255,255,.96); border-radius:20px; padding:34px 26px; box-shadow:var(--shadow-lg); text-align:center; position:relative; z-index:1; border-top:5px solid var(--gold); max-width:980px; margin:0 auto; } .xaysi-policy-shipping .cta-content h2{ font-size:22px; margin:0 0 10px; color:var(--grey-dark); font-weight:900; } .xaysi-policy-shipping .cta-content p{ margin:0 0 16px; color:var(--text-dark); font-size:14px; line-height:1.8; max-width:780px; margin-left:auto; margin-right:auto; } .xaysi-policy-shipping .cta-buttons{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:10px; } .xaysi-policy-shipping .cta-button{ display:inline-block; background:var(--gold); color:var(--grey-dark); padding:12px 18px; border-radius:999px; text-decoration:none; font-weight:900; font-size:13px; transition:var(--transition); border:2px solid var(--gold); box-shadow:0 10px 22px rgba(212,175,55,.18); } .xaysi-policy-shipping .cta-button:hover{ background:transparent; color:var(--gold); transform:translateY(-3px); box-shadow:0 14px 28px rgba(212,175,55,.24); } .xaysi-policy-shipping .secondary-button{ display:inline-block; background:transparent; color:var(--grey-dark); padding:12px 18px; border-radius:999px; text-decoration:none; font-weight:900; font-size:13px; transition:var(--transition); border:2px solid var(--grey-dark); } .xaysi-policy-shipping .secondary-button:hover{ background:var(--grey-dark); color:var(--white); transform:translateY(-3px); } /* Search highlight */ .xaysi-policy-shipping mark.xaysi-hl{ background:rgba(212,175,55,.35); padding:0 .15em; border-radius:.2em; } /* ================= RESPONSIVE ================= */ @media (max-width: 992px){ .xaysi-policy-shipping .header-content{ flex-direction:column; text-align:center; } .xaysi-policy-shipping .header-actions{ width:100%; max-width:560px; flex:0 0 auto; } .xaysi-policy-shipping .header-title{ font-size:38px; } } @media (max-width: 768px){ .xaysi-policy-shipping section{ padding:55px 0; } .xaysi-policy-shipping .header-title{ font-size:34px; } .xaysi-policy-shipping .section-title{ font-size:22px; } .xaysi-policy-shipping .policy-section{ padding:16px; } } @media (max-width: 420px){ .xaysi-policy-shipping .header-title{ font-size:30px; } .xaysi-policy-shipping .quick-link{ width:100%; text-align:center; } .xaysi-policy-shipping .quick-links{ flex-direction:column; } .xaysi-policy-shipping .search-container button{ padding:10px 12px; } }