/* Zumi Native Refunds & Cancellations v1.0.16 */ #zumi-native-refunds { --znr-orange:#E85E2A; --znr-orange-deep:#E85E2A; --znr-ink:#24211F; --znr-text:#3E3935; --znr-muted:#706963; --znr-line:#E6E0DB; --znr-cream:#F7F4F0; --znr-yellow:#FFF1C9; --znr-yellow-line:#E6B24B; --znr-green:#2F7A59; --znr-red:#A94739; --znr-radius:18px; background:#fff; color:var(--znr-text); font-family:"Roboto", Arial, Helvetica, sans-serif; } #zumi-native-refunds *,#zumi-native-refunds *::before,#zumi-native-refunds *::after{box-sizing:border-box} #zumi-native-refunds svg{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} #zumi-native-refunds .znr-shell{width:100%} #zumi-native-refunds .znr-page{width:min(1440px,calc(100% - 48px));margin:0 auto;padding:46px 0 70px} #zumi-native-refunds h1,#zumi-native-refunds h2,#zumi-native-refunds h3,#zumi-native-refunds p{margin-top:0} #zumi-native-refunds h1,#zumi-native-refunds h2,#zumi-native-refunds h3{color:var(--znr-ink);font-family:"Roboto", Arial, Helvetica, sans-serif} #zumi-native-refunds .znr-eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:10px;color:var(--znr-orange);font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase} #zumi-native-refunds .znr-eyebrow::before{content:"";display:block;flex:0 0 24px;width:24px;height:2px;border-radius:999px;background:currentColor} #zumi-native-refunds .znr-eyebrow--light{color:#F1C7A4} /* Hero — Namibia image with Insurance-page visual language. */ #zumi-native-refunds .znr-hero{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr);gap:clamp(28px,5vw,76px);align-items:center;min-height:clamp(500px,40vw,620px);padding:clamp(34px,5vw,72px);border:1px solid rgba(255,255,255,.14);border-radius:4px;background:linear-gradient(90deg,rgba(18,13,11,.90) 0%,rgba(18,13,11,.76) 34%,rgba(18,13,11,.48) 61%,rgba(18,13,11,.19) 100%),linear-gradient(180deg,rgba(0,0,0,.02) 0%,rgba(0,0,0,.10) 58%,rgba(0,0,0,.38) 100%),url("https://zumirentals.com/wp-content/uploads/2026/09/zumi-sand-dunes-hero.webp") center 58% / cover no-repeat;box-shadow:0 24px 70px rgba(28,17,12,.12),inset 0 1px 0 rgba(255,255,255,.08);overflow:hidden} #zumi-native-refunds .znr-hero::before{content:"";position:absolute;z-index:0;inset:0;pointer-events:none;background:radial-gradient(circle at 10% 12%,rgba(232,94,42,.25),transparent 24%),radial-gradient(circle at 88% 18%,rgba(226,164,40,.14),transparent 22%),linear-gradient(112deg,transparent 0 61%,rgba(232,94,42,.14) 61.1% 61.35%,transparent 61.45%),linear-gradient(112deg,transparent 0 73%,rgba(226,164,40,.10) 73.08% 73.24%,transparent 73.34%)} #zumi-native-refunds .znr-hero::after{content:"";position:absolute;z-index:0;right:-10%;bottom:-44%;width:min(760px,48vw);aspect-ratio:1;border:1px solid rgba(232,94,42,.30);border-radius:50%;box-shadow:0 0 0 46px rgba(232,94,42,.075),0 0 0 92px rgba(232,94,42,.04),0 0 90px rgba(232,94,42,.11);pointer-events:none} #zumi-native-refunds .znr-hero>*{position:relative;z-index:1} #zumi-native-refunds .znr-hero .znr-eyebrow{color:#F1C7A4;text-shadow:0 1px 12px rgba(0,0,0,.26)} #zumi-native-refunds .znr-hero h1{position:relative;max-width:900px;margin-bottom:18px;color:#fff;font-size:clamp(40px,4.7vw,76px);font-weight:700;line-height:.98;letter-spacing:-.05em;text-wrap:balance;text-shadow:0 8px 30px rgba(0,0,0,.32)} #zumi-native-refunds .znr-hero h1::after{content:"";display:block;width:clamp(78px,8vw,150px);height:clamp(5px,.38vw,7px);margin-top:clamp(16px,1.35vw,24px);border-radius:999px;background:linear-gradient(90deg,#E85E2A 0%,#E2A428 100%);box-shadow:0 0 24px rgba(232,94,42,.32)} #zumi-native-refunds .znr-hero__copy>p{position:relative;overflow:hidden;max-width:820px;margin:0 0 20px;padding:16px 19px;border:1px solid rgba(255,255,255,.14);border-radius:4px;background:radial-gradient(circle at 8% 0%,rgba(232,94,42,.14),transparent 34%),linear-gradient(135deg,rgba(18,13,11,.57) 0%,rgba(48,29,21,.40) 100%);color:rgba(255,255,255,.94);box-shadow:0 16px 38px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.05);font-family:"Roboto", Arial, Helvetica, sans-serif;font-size:clamp(15px,1.05vw,18px);font-weight:500;line-height:1.6;text-shadow:0 2px 14px rgba(0,0,0,.16);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)} #zumi-native-refunds .znr-hero__copy>p::before{content:none} #zumi-native-refunds .znr-pill-row{display:flex;flex-wrap:wrap;gap:8px} #zumi-native-refunds .znr-pill{display:inline-flex;align-items:center;gap:7px;min-height:31px;padding:6px 10px;border:1px solid rgba(255,255,255,.14);border-radius:4px;background:rgba(10,8,7,.34);color:rgba(255,255,255,.84);font-size:10.8px;font-weight:600;box-shadow:inset 0 1px 0 rgba(255,255,255,.035);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)} #zumi-native-refunds .znr-pill svg{color:#F1C7A4;font-size:14px;filter:drop-shadow(0 0 8px rgba(232,94,42,.25))} /* Straight translucent yellow cancellation card, echoing the Insurance hero. */ #zumi-native-refunds .znr-hero-card{position:relative;overflow:hidden;margin:0;padding:30px;border:1px solid rgba(255,231,161,.72);border-radius:4px;background:radial-gradient(circle at 92% 0%,rgba(255,255,255,.72),transparent 28%),linear-gradient(145deg,rgba(255,251,239,.94) 0%,rgba(255,235,181,.92) 54%,rgba(238,190,91,.88) 100%);color:#532A03;box-shadow:0 24px 58px rgba(0,0,0,.28),0 0 0 1px rgba(216,135,20,.18),inset 0 1px 0 rgba(255,255,255,.78);backdrop-filter:blur(18px) saturate(1.04);-webkit-backdrop-filter:blur(18px) saturate(1.04);transform:none!important} #zumi-native-refunds .znr-hero-card::before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(118deg,transparent 0 62%,rgba(232,94,42,.065) 62.1% 62.45%,transparent 62.55%);pointer-events:none;transform:none!important} #zumi-native-refunds .znr-hero-card::after{content:"0";position:absolute;z-index:0;right:-10px;top:-36px;color:rgba(120,64,8,.045);font-size:clamp(145px,11vw,220px);font-weight:700;line-height:1;letter-spacing:-.09em;pointer-events:none;transform:none!important} #zumi-native-refunds .znr-hero-card>*{position:relative;z-index:1} #zumi-native-refunds .znr-hero-card__topline{display:flex;align-items:center;gap:8px;color:#6C3B06;font-size:10px;font-weight:700;letter-spacing:.11em;text-transform:uppercase} #zumi-native-refunds .znr-hero-card__topline svg{font-size:18px} #zumi-native-refunds .znr-hero-card>strong{display:block;margin-top:18px;color:#4B2400;font-size:clamp(62px,5vw,88px);line-height:.92;letter-spacing:-.06em} #zumi-native-refunds .znr-hero-card__label{display:block;margin-top:7px;color:#653805;font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase} #zumi-native-refunds .znr-hero-card p{margin:18px 0 0;padding-top:16px;border-top:1px solid rgba(92,54,7,.24);color:#5A3A12;font-family:"Roboto", Arial, Helvetica, sans-serif;font-size:12.5px;font-weight:500;line-height:1.58} /* Shared sections */ #zumi-native-refunds .znr-section{padding:clamp(54px,6vw,82px) 0;border-bottom:1px solid var(--znr-line)} #zumi-native-refunds .znr-section-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,520px);gap:36px;align-items:end;margin-bottom:30px} #zumi-native-refunds .znr-section-head--compact{grid-template-columns:1fr;margin-bottom:24px} #zumi-native-refunds .znr-section-head h2{max-width:760px;margin:0;font-size:clamp(32px,3vw,60px);font-weight:700;line-height:1.02;letter-spacing:-.045em;text-wrap:balance} #zumi-native-refunds .znr-section-head>p{margin:0;color:var(--znr-muted);font-family:"Roboto", Arial, Helvetica, sans-serif;font-size:14px;line-height:1.65} /* Cancellation tiers */ #zumi-native-refunds .znr-tier-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px} #zumi-native-refunds .znr-tier-card{min-height:235px;padding:24px;border:1px solid var(--znr-line);border-radius:4px;background:#fff} #zumi-native-refunds .znr-tier-card__days{color:#4A433E;font-size:14px;font-weight:700} #zumi-native-refunds .znr-tier-card__charge{display:block;margin-top:14px;color:var(--znr-ink);font-size:clamp(42px,3.3vw,62px);line-height:.95;letter-spacing:-.055em} #zumi-native-refunds .znr-tier-card__label{display:block;margin-top:6px;color:#857D76;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase} #zumi-native-refunds .znr-tier-card p{margin:22px 0 0;padding-top:16px;border-top:1px solid var(--znr-line);color:var(--znr-muted);font-family:"Roboto", Arial, Helvetica, sans-serif;font-size:12px;line-height:1.55} #zumi-native-refunds .znr-tier-card--1{border-color:rgba(47,122,89,.28);background:linear-gradient(180deg,#fff 0%,#F3FAF6 100%)} #zumi-native-refunds .znr-tier-card--1 .znr-tier-card__charge{color:var(--znr-green)} #zumi-native-refunds .znr-tier-card--3{border-color:rgba(232,94,42,.30);background:#FFF9F5} #zumi-native-refunds .znr-tier-card--4{border-color:rgba(169,71,57,.30);background:#FFF7F5} #zumi-native-refunds .znr-tier-card--4 .znr-tier-card__charge{color:var(--znr-red)} #zumi-native-refunds .znr-policy-note{display:grid;grid-template-columns:42px minmax(0,1fr);gap:14px;align-items:start;margin-top:16px;padding:16px 18px;border:1px solid var(--znr-line);border-radius:4px;background:var(--znr-cream)} #zumi-native-refunds .znr-policy-note__icon{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#fff;color:var(--znr-orange);font-size:20px} #zumi-native-refunds .znr-policy-note strong{display:block;margin:1px 0 4px;color:var(--znr-ink);font-size:13px} #zumi-native-refunds .znr-policy-note p{margin:0;color:var(--znr-muted);font-family:"Roboto", Arial, Helvetica, sans-serif;font-size:12.5px;line-height:1.55} /* Three concise practical cards */ #zumi-native-refunds .znr-essential-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px} #zumi-native-refunds .znr-essential-card{padding:24px;border:1px solid var(--znr-line);border-radius:4px;background:#fff} #zumi-native-refunds .znr-essential-card__icon{display:grid;place-items:center;width:42px;height:42px;margin-bottom:18px;border-radius:50%;background:#FFF2E9;color:var(--znr-orange);font-size:20px} #zumi-native-refunds .znr-essential-card h3{margin-bottom:8px;font-size:16px;line-height:1.25} #zumi-native-refunds .znr-essential-card p{margin:0;color:var(--znr-muted);font-family:"Roboto", Arial, Helvetica, sans-serif;font-size:12.5px;line-height:1.65} /* FAQ — deliberately mirrors the Insurance page structure: line rows, black +, orange −. */ #zumi-native-refunds .znr-faq{background:#fff} #zumi-native-refunds .znr-faq-list{display:block;border-top:1px solid var(--znr-line)} #zumi-native-refunds .znr-faq-item{overflow:visible;border:0;border-bottom:1px solid var(--znr-line);border-radius:0;background:transparent} #zumi-native-refunds .znr-faq-item:last-child{border-bottom:0} #zumi-native-refunds .znr-faq.znr-section{border-bottom:0} #zumi-native-refunds .znr-faq-item summary{position:relative;display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:0;padding:clamp(18px,1.4vw,26px) 0;color:#1C1C1C;cursor:pointer;list-style:none;user-select:none;font-size:clamp(14px,.93vw,18px);font-weight:700;line-height:1.3} #zumi-native-refunds .znr-faq-item summary::-webkit-details-marker{display:none} #zumi-native-refunds .znr-faq-item summary::after{content:"+";display:grid;place-items:center;flex:0 0 31px;width:31px;height:31px;color:#fff;background:#1D1D1D;border-radius:50%;font-size:18px;font-weight:400;line-height:1;transition:background-color 160ms ease} #zumi-native-refunds .znr-faq-item[open] summary::after{content:"−";background:var(--znr-orange)} #zumi-native-refunds .znr-faq-item__question{min-width:0;color:#1C1C1C;font-size:inherit;font-weight:inherit;line-height:inherit} #zumi-native-refunds .znr-faq-item__answer{margin:0;padding:0 46px clamp(20px,1.5vw,28px) 0;color:#696969} #zumi-native-refunds .znr-faq-item__answer p{max-width:1400px;margin:0;color:#696969;font-family:"Roboto", Arial, Helvetica, sans-serif;font-size:clamp(13px,.78vw,15px);line-height:1.65} /* Contract strip */ #zumi-native-refunds .znr-contract{display:grid;grid-template-columns:58px minmax(0,1fr) auto;gap:20px;align-items:center;margin:clamp(54px,6vw,82px) 0 20px;padding:26px 28px;border:1px solid var(--znr-line);border-radius:4px;background:var(--znr-cream)} #zumi-native-refunds .znr-contract__icon{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:#fff;color:var(--znr-orange);font-size:27px} #zumi-native-refunds .znr-contract h2{margin:0 0 8px;font-size:clamp(22px,2vw,31px);line-height:1.2;letter-spacing:-.025em} #zumi-native-refunds .znr-contract p{max-width:850px;margin:0;color:var(--znr-muted);font-family:"Roboto", Arial, Helvetica, sans-serif;font-size:12.5px;line-height:1.6} #zumi-native-refunds .znr-contract__actions{display:flex;flex-direction:column;align-items:flex-end;gap:7px} #zumi-native-refunds .znr-contract__actions small{color:#8A817A;font-size:10px} /* CTA — matched to the Insurance page contact panel. */ #zumi-native-refunds .znr-contact{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:36px;align-items:center;overflow:hidden;padding:clamp(38px,3.4vw,68px);border-radius:4px;background:radial-gradient(circle at 88% 20%,rgba(232,94,42,.26),transparent 28%),linear-gradient(135deg,#111111,#211713);color:#fff} #zumi-native-refunds .znr-contact::after{content:"";position:absolute;right:-6%;bottom:-120%;width:560px;aspect-ratio:1;border:1px solid rgba(255,255,255,.06);border-radius:50%;box-shadow:0 0 0 55px rgba(255,255,255,.025),0 0 0 110px rgba(255,255,255,.018);pointer-events:none} #zumi-native-refunds .znr-contact__copy,#zumi-native-refunds .znr-contact__actions{position:relative;z-index:2} #zumi-native-refunds .znr-contact h2{max-width:920px;margin:0;color:#fff;font-size:clamp(32px,3vw,60px);font-weight:700;line-height:1.02;letter-spacing:-.045em;text-wrap:balance} #zumi-native-refunds .znr-contact p{max-width:860px;margin:16px 0 0;color:rgba(255,255,255,.66);font-family:"Roboto", Arial, Helvetica, sans-serif;font-size:14px;line-height:1.65} #zumi-native-refunds .znr-contact__actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:min(100%,430px);justify-self:end} /* General button treatment also serves the contract button. */ #zumi-native-refunds .znr-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:11px 16px;border:1px solid transparent;border-radius:4px;text-decoration:none!important;font-size:12px;font-weight:700;transform:none!important;transition:background-color .14s ease,border-color .14s ease,color .14s ease} #zumi-native-refunds .znr-btn svg{font-size:15px} #zumi-native-refunds .znr-btn--primary{border-color:#E85E2A !important;background:#E85E2A !important;color:#fff!important} #zumi-native-refunds .znr-btn--primary:hover,#zumi-native-refunds .znr-btn--primary:focus-visible{background:#E85E2A !important;border-color:#E85E2A !important;color:#fff!important;outline:none;transform:none!important} #zumi-native-refunds .znr-btn--ghost{border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:#fff!important} #zumi-native-refunds .znr-btn--ghost:hover,#zumi-native-refunds .znr-btn--ghost:focus-visible{border-color:rgba(255,255,255,.32);background:rgba(255,255,255,.11);color:#fff!important;outline:none;transform:none!important} #zumi-native-refunds .znr-contact .znr-btn{display:grid;grid-template-columns:22px minmax(0,auto);justify-content:start;gap:10px;min-height:48px;padding:11px 15px;border-radius:4px;font-size:13px} #zumi-native-refunds .znr-contact .znr-btn>span:first-child{font-size:20px} #zumi-native-refunds .znr-btn--whatsapp{grid-template-columns:24px minmax(0,1fr)!important} #zumi-native-refunds .znr-btn__whatsapp-icon{display:grid;place-items:center;width:24px;height:24px} #zumi-native-refunds .znr-btn__whatsapp-icon img{display:block;width:22px;height:22px;object-fit:contain} /* Keep theme/editor wrappers from constraining the native page. */ body.zumi-native-refunds-active .entry-header,body.zumi-native-refunds-active .page-header{display:none!important} body.zumi-native-refunds-active .site-main,body.zumi-native-refunds-active .content-area,body.zumi-native-refunds-active .entry-content{max-width:none!important;width:100%!important;margin:0!important;padding-left:0!important;padding-right:0!important} @media (max-width:1100px){ #zumi-native-refunds .znr-page{width:min(100% - 36px,1200px)} #zumi-native-refunds .znr-hero{grid-template-columns:1fr .62fr;padding:40px} #zumi-native-refunds .znr-tier-grid{grid-template-columns:repeat(2,minmax(0,1fr))} } @media (max-width:980px){ #zumi-native-refunds .znr-contact__actions{width:min(100%,430px);justify-self:start} } @media (max-width:760px){ #zumi-native-refunds .znr-eyebrow{gap:8px} #zumi-native-refunds .znr-eyebrow::before{flex-basis:19px;width:19px} #zumi-native-refunds .znr-page{width:min(100% - 24px,760px);padding:24px 0 44px} #zumi-native-refunds .znr-hero{grid-template-columns:1fr;gap:24px;min-height:0;padding:34px 22px 27px;border-radius:4px;background:linear-gradient(180deg,rgba(13,11,10,.80) 0%,rgba(13,11,10,.57) 56%,rgba(13,11,10,.34) 100%),url("https://zumirentals.com/wp-content/uploads/2026/09/zumi-sand-dunes-hero.webp") center center / cover no-repeat} #zumi-native-refunds .znr-hero::after{right:-45%;bottom:-20%;width:520px;opacity:.78} #zumi-native-refunds .znr-hero h1::after{margin-top:14px} #zumi-native-refunds .znr-hero__copy>p{padding:14px 15px;border-radius:4px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)} #zumi-native-refunds .znr-hero h1{font-size:clamp(34px,10vw,50px)} #zumi-native-refunds .znr-hero-card{padding:22px;border-radius:4px} #zumi-native-refunds .znr-section{padding:46px 0} #zumi-native-refunds .znr-section-head{grid-template-columns:1fr;gap:12px;margin-bottom:23px} #zumi-native-refunds .znr-tier-grid,#zumi-native-refunds .znr-essential-grid{grid-template-columns:1fr} #zumi-native-refunds .znr-tier-card{min-height:0;padding:20px} #zumi-native-refunds .znr-policy-note{grid-template-columns:36px minmax(0,1fr);padding:14px} #zumi-native-refunds .znr-policy-note__icon{width:36px;height:36px;font-size:17px} #zumi-native-refunds .znr-faq-item summary{padding:18px 0;font-size:14px} #zumi-native-refunds .znr-faq-item summary::after{flex-basis:29px;width:29px;height:29px;font-size:17px} #zumi-native-refunds .znr-faq-item__answer{padding:0 40px 20px 0} #zumi-native-refunds .znr-contract{grid-template-columns:46px minmax(0,1fr);padding:20px} #zumi-native-refunds .znr-contract__icon{width:46px;height:46px;font-size:22px} #zumi-native-refunds .znr-contract__actions{grid-column:1/-1;align-items:stretch} #zumi-native-refunds .znr-contract__actions .znr-contract__btn{width:100%} #zumi-native-refunds .znr-contact{grid-template-columns:1fr;padding:24px 20px} #zumi-native-refunds .znr-contact__actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;width:100%;justify-self:start} #zumi-native-refunds .znr-contact .znr-btn{min-height:44px;padding:9px 11px;font-size:11px;gap:7px} } /* ============================================================ v1.0.6 — INSURANCE-MATCH CONTACT ACTIONS + TIGHTER FAQ EXIT ============================================================ */ /* Avoid the previous double vertical gap: the FAQ had its own section bottom padding and the contract strip also added a large top margin. */ #zumi-native-refunds .znr-faq.znr-section { padding-bottom: 18px; } #zumi-native-refunds .znr-contract { margin-top: 18px; } /* Match the compact contact actions used on the Insurance page. */ #zumi-native-refunds .znr-contact__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; width: min(100%, 430px); justify-self: end; } #zumi-native-refunds .znr-contact .znr-btn { display: grid; grid-template-columns: 22px minmax(0, auto); justify-content: start; align-items: center; gap: 10px; min-height: 48px; padding: 11px 15px; border-radius: 4px; font-size: 13px; font-weight: 700; line-height: 1.2; } #zumi-native-refunds .znr-contact .znr-btn > span:first-child { display: grid; place-items: center; width: 22px; height: 22px; font-size: 20px; } #zumi-native-refunds .znr-contact .znr-btn > span:first-child svg { display: block; width: 20px; height: 20px; } #zumi-native-refunds .znr-contact .znr-btn--whatsapp { grid-template-columns: 24px minmax(0, 1fr) !important; } #zumi-native-refunds .znr-contact .znr-btn__whatsapp-icon { display: grid; place-items: center; width: 24px !important; height: 24px !important; font-size: initial !important; } #zumi-native-refunds .znr-contact .znr-btn__whatsapp-icon img { display: block; width: 22px; height: 22px; object-fit: contain; } @media (max-width: 980px) { #zumi-native-refunds .znr-contact__actions { width: min(100%, 430px); justify-self: start; } } @media (max-width: 760px) { #zumi-native-refunds .znr-faq.znr-section { padding-bottom: 12px; } #zumi-native-refunds .znr-contract { margin-top: 12px; } } @media (max-width: 620px) { #zumi-native-refunds .znr-contact__actions { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; width: 100%; } #zumi-native-refunds .znr-contact .znr-btn { min-height: 44px; padding: 9px 11px; font-size: 11px; gap: 7px; } #zumi-native-refunds .znr-contact .znr-btn > span:first-child { width: 20px; height: 20px; font-size: 18px; } #zumi-native-refunds .znr-contact .znr-btn > span:first-child svg { width: 18px; height: 18px; } #zumi-native-refunds .znr-contact .znr-btn__whatsapp-icon { width: 22px !important; height: 22px !important; } #zumi-native-refunds .znr-contact .znr-btn__whatsapp-icon img { width: 20px; height: 20px; } } /* ============================================================ v1.0.8 — EXACT INSURANCE BUTTON PARITY Source of truth: Zumi Native Insurance v1.0.20.24. These rules intentionally mirror the Insurance page's final desktop/mobile button layout and interactive states. ============================================================ */ /* Contract button — exact values used by the Insurance page. */ #zumi-native-refunds .znr-contract__btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 54px; padding: 13px 18px; border-radius: 4px; text-decoration: none !important; font-weight: 800; line-height: 1.2; transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease; } #zumi-native-refunds .znr-contract__btn:hover, #zumi-native-refunds .znr-contract__btn:focus-visible { transform: none; } #zumi-native-refunds .znr-contract__btn--primary { color: #fff !important; background: #E85E2A !important; border: 1px solid #E85E2A; box-shadow: 0 12px 28px rgba(232,94,42,0.20); } #zumi-native-refunds .znr-contract__btn--primary:hover, #zumi-native-refunds .znr-contract__btn--primary:focus-visible { color: #fff !important; background: #E85E2A !important; border-color: #E85E2A !important; } #zumi-native-refunds .znr-contract__btn--primary img { width: 22px; height: 22px; object-fit: contain; filter: brightness(0) invert(1); } /* Contact actions — exact final Insurance page layout. */ #zumi-native-refunds .znr-contact__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; width: min(100%, 430px); justify-self: end; } #zumi-native-refunds .znr-contact .znr-btn { display: grid; grid-template-columns: 22px minmax(0, auto); justify-content: start; align-items: center; gap: 10px; min-height: 48px; padding: 11px 15px; border: 1px solid transparent; border-radius: 4px; text-decoration: none; font-size: 13px; font-weight: 700; transform: none !important; transition: background-color .14s ease, border-color .14s ease, color .14s ease; } #zumi-native-refunds .znr-contact .znr-btn:hover, #zumi-native-refunds .znr-contact .znr-btn:focus-visible { transform: none !important; outline: none; } #zumi-native-refunds .znr-contact .znr-btn > span:first-child { width: auto; height: auto; font-size: 20px; } #zumi-native-refunds .znr-contact .znr-btn > span:first-child svg { display: block; width: 1em; height: 1em; stroke-width: 1.9; } #zumi-native-refunds .znr-btn__arrow { display: none !important; } #zumi-native-refunds .znr-contact .znr-btn--primary { background: #E85E2A !important; color: #FFFFFF !important; } #zumi-native-refunds .znr-contact .znr-btn--primary:hover, #zumi-native-refunds .znr-contact .znr-btn--primary:focus-visible { background: #E85E2A !important; color: #FFFFFF !important; } #zumi-native-refunds .znr-contact .znr-btn--ghost { border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.06); color: #FFFFFF !important; } #zumi-native-refunds .znr-contact .znr-btn--ghost:hover, #zumi-native-refunds .znr-contact .znr-btn--ghost:focus-visible { border-color: rgba(255,255,255,.32); background: rgba(255,255,255,.11); color: #FFFFFF !important; } #zumi-native-refunds .znr-contact .znr-btn--whatsapp { grid-template-columns: 24px minmax(0, 1fr) !important; } #zumi-native-refunds .znr-contact .znr-btn__whatsapp-icon { display: grid; place-items: center; width: 24px !important; height: 24px !important; font-size: initial !important; } #zumi-native-refunds .znr-contact .znr-btn__whatsapp-icon img { display: block; width: 22px; height: 22px; object-fit: contain; } @media (max-width: 980px) { #zumi-native-refunds .znr-contact__actions { width: min(100%, 430px); justify-self: start; } } @media (max-width: 620px) { #zumi-native-refunds .znr-contact__actions { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; width: 100%; } #zumi-native-refunds .znr-contact .znr-btn { min-height: 44px; padding: 9px 11px; font-size: 11px; gap: 7px; } /* Insurance keeps these icon sizes at the desktop values on phones. */ #zumi-native-refunds .znr-contact .znr-btn > span:first-child { width: auto; height: auto; font-size: 20px; } #zumi-native-refunds .znr-contact .znr-btn > span:first-child svg { width: 1em; height: 1em; stroke-width: 1.9; } #zumi-native-refunds .znr-contact .znr-btn__whatsapp-icon { width: 24px !important; height: 24px !important; } #zumi-native-refunds .znr-contact .znr-btn__whatsapp-icon img { width: 22px; height: 22px; } #zumi-native-refunds .znr-contract__btn { min-height: 46px; gap: 8px; padding: 10px 14px; border-radius: 4px; font-size: 14px; } #zumi-native-refunds .znr-contract__btn--primary img { width: 19px; height: 19px; } } /* ============================================================ v1.0.9 — INSTANT BUTTON STATES Match the live Insurance page as observed in production: the contract, Email and WhatsApp buttons switch state immediately. ============================================================ */ #zumi-native-refunds .znr-contract__btn, #zumi-native-refunds .znr-contract__btn *, #zumi-native-refunds .znr-contact .znr-btn, #zumi-native-refunds .znr-contact .znr-btn * { transition: none !important; animation: none !important; } /* ============================================================ v1.0.10 — TIGHTER PAGE RHYTHM + INSURANCE-MATCH FOOTER GAP Reduce accumulated whitespace between open sections while keeping the same content hierarchy. The page bottom now mirrors Insurance: 15px desktop/tablet breathing room and 8px on small mobile screens. ============================================================ */ #zumi-native-refunds .znr-page { padding-bottom: 15px !important; } /* These sections are visually open (not boxed), so large top + bottom padding on adjacent sections compounds into excessive whitespace. */ #zumi-native-refunds .znr-section { padding-top: clamp(30px, 2.6vw, 46px) !important; padding-bottom: clamp(30px, 2.6vw, 46px) !important; } #zumi-native-refunds .znr-section-head { margin-bottom: 22px !important; } #zumi-native-refunds .znr-section-head--compact { margin-bottom: 20px !important; } /* FAQ exits cleanly into the terms strip without a second large gap. */ #zumi-native-refunds .znr-faq.znr-section { padding-bottom: 10px !important; } #zumi-native-refunds .znr-contract { margin-top: 10px !important; margin-bottom: 12px !important; } @media (max-width: 760px) { #zumi-native-refunds .znr-page { padding-top: 24px; padding-bottom: 12px !important; } #zumi-native-refunds .znr-section { padding-top: 30px !important; padding-bottom: 30px !important; } #zumi-native-refunds .znr-section-head, #zumi-native-refunds .znr-section-head--compact { margin-bottom: 18px !important; } #zumi-native-refunds .znr-faq.znr-section { padding-bottom: 8px !important; } #zumi-native-refunds .znr-contract { margin-top: 8px !important; margin-bottom: 10px !important; } } @media (max-width: 620px) { #zumi-native-refunds .znr-page { padding-bottom: 8px !important; } } /* ============================================================ v1.0.15 — INDEPENDENT BOOKING NOTES + COMPACT MOBILE RHYTHM The practical cards are independent notes, not sequential steps. Mobile becomes denser without sacrificing readability. ============================================================ */ #zumi-native-refunds .znr-essentials .znr-section-head--compact { margin-bottom: 18px !important; } #zumi-native-refunds .znr-essential-card { min-height: 0; padding: 21px 22px; } #zumi-native-refunds .znr-essential-card__icon { margin-bottom: 14px; } #zumi-native-refunds .znr-essential-card h3 { margin-bottom: 6px; } @media (max-width: 760px) { /* Overall page/section rhythm */ #zumi-native-refunds .znr-page { width: min(100% - 20px, 760px); padding-top: 16px !important; padding-bottom: 10px !important; } #zumi-native-refunds .znr-hero { gap: 16px; padding: 24px 17px 20px; border-radius: 4px; } #zumi-native-refunds .znr-hero .znr-eyebrow { margin-bottom: 7px; } #zumi-native-refunds .znr-hero h1 { margin-bottom: 12px; font-size: clamp(32px, 9.2vw, 44px); line-height: 1; } #zumi-native-refunds .znr-hero h1::after { height: 4px; margin-top: 11px; } #zumi-native-refunds .znr-hero__copy > p { margin-bottom: 12px; padding: 11px 13px; font-size: 14px; line-height: 1.5; } #zumi-native-refunds .znr-pill-row { gap: 6px; } #zumi-native-refunds .znr-pill { min-height: 28px; padding: 5px 9px; font-size: 10px; } #zumi-native-refunds .znr-hero-card { padding: 18px; } #zumi-native-refunds .znr-hero-card > strong { margin-top: 12px; font-size: clamp(56px, 17vw, 72px); } #zumi-native-refunds .znr-hero-card p { margin-top: 13px; padding-top: 12px; line-height: 1.48; } #zumi-native-refunds .znr-section { padding-top: 22px !important; padding-bottom: 22px !important; } #zumi-native-refunds .znr-section-head, #zumi-native-refunds .znr-section-head--compact { gap: 8px; margin-bottom: 14px !important; } #zumi-native-refunds .znr-section-head h2 { font-size: clamp(28px, 8.4vw, 38px); line-height: 1.04; } #zumi-native-refunds .znr-section-head > p { font-size: 13px; line-height: 1.5; } #zumi-native-refunds .znr-eyebrow { margin-bottom: 7px; font-size: 10px; } /* Cancellation cards */ #zumi-native-refunds .znr-tier-grid { gap: 9px; } #zumi-native-refunds .znr-tier-card { padding: 16px 17px; } #zumi-native-refunds .znr-tier-card__days { font-size: 13px; } #zumi-native-refunds .znr-tier-card__charge { margin-top: 8px; font-size: 42px; } #zumi-native-refunds .znr-tier-card p { margin-top: 13px; padding-top: 11px; line-height: 1.45; } #zumi-native-refunds .znr-policy-note { gap: 11px; margin-top: 10px; padding: 12px 13px; } /* Practical notes become compact rows rather than tall cards. */ #zumi-native-refunds .znr-essential-grid { gap: 9px; } #zumi-native-refunds .znr-essential-card { display: grid; grid-template-columns: 36px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 12px; row-gap: 3px; align-items: start; padding: 14px 15px; border-radius: 4px; } #zumi-native-refunds .znr-essential-card__icon { grid-column: 1; grid-row: 1 / span 2; width: 36px; height: 36px; margin: 0; font-size: 17px; } #zumi-native-refunds .znr-essential-card h3 { grid-column: 2; grid-row: 1; margin: 1px 0 2px; font-size: 14px; line-height: 1.25; } #zumi-native-refunds .znr-essential-card p { grid-column: 2; grid-row: 2; font-size: 12px; line-height: 1.5; } /* FAQ */ #zumi-native-refunds .znr-faq.znr-section { padding-bottom: 5px !important; } #zumi-native-refunds .znr-faq-item summary { padding: 14px 0; font-size: 13.5px; } #zumi-native-refunds .znr-faq-item summary::after { flex-basis: 28px; width: 28px; height: 28px; font-size: 16px; } #zumi-native-refunds .znr-faq-item__answer { padding: 0 36px 15px 0; } #zumi-native-refunds .znr-faq-item__answer p { font-size: 12.5px; line-height: 1.5; } /* Terms + CTA */ #zumi-native-refunds .znr-contract { grid-template-columns: 40px minmax(0, 1fr); gap: 12px; margin-top: 6px !important; margin-bottom: 8px !important; padding: 15px; border-radius: 4px; } #zumi-native-refunds .znr-contract__icon { width: 40px; height: 40px; font-size: 19px; } #zumi-native-refunds .znr-contract h2 { margin-bottom: 5px; font-size: 20px; line-height: 1.18; } #zumi-native-refunds .znr-contract p { font-size: 12px; line-height: 1.48; } #zumi-native-refunds .znr-contract__actions { gap: 5px; margin-top: 1px; } #zumi-native-refunds .znr-contact { gap: 16px; padding: 20px 16px; border-radius: 4px; } #zumi-native-refunds .znr-contact h2 { font-size: clamp(27px, 8vw, 36px); line-height: 1.04; } #zumi-native-refunds .znr-contact p { margin-top: 9px; font-size: 12.5px; line-height: 1.5; } } @media (max-width: 480px) { #zumi-native-refunds .znr-page { width: calc(100% - 16px); padding-top: 10px !important; padding-bottom: 8px !important; } #zumi-native-refunds .znr-hero { padding: 20px 14px 16px; } #zumi-native-refunds .znr-section { padding-top: 18px !important; padding-bottom: 18px !important; } #zumi-native-refunds .znr-tier-card { padding: 14px 15px; } #zumi-native-refunds .znr-policy-note { grid-template-columns: 32px minmax(0, 1fr); padding: 11px 12px; } #zumi-native-refunds .znr-policy-note__icon { width: 32px; height: 32px; font-size: 15px; } #zumi-native-refunds .znr-essential-card { padding: 12px 13px; } #zumi-native-refunds .znr-contact__actions { gap: 6px; } } /* ============================================================ v1.0.16 — SITE-WIDE ROUNDED SECTION SYSTEM Match the Insurance page's top-level layout: each major content block lives in its own rounded, bordered section with a compact consistent gap between sections. ============================================================ */ #zumi-native-refunds .znr-shell { width: 100%; max-width: 2200px; margin: 0 auto; padding: 15px 0; } #zumi-native-refunds .znr-page { width: 100%; display: grid; gap: clamp(12px, 1.05vw, 20px); margin: 0; padding: 0; } #zumi-native-refunds .znr-hero, #zumi-native-refunds .znr-section, #zumi-native-refunds .znr-contract, #zumi-native-refunds .znr-contact { margin-left: 15px !important; margin-right: 15px !important; } #zumi-native-refunds .znr-section { margin-top: 0 !important; margin-bottom: 0 !important; padding: clamp(34px, 2.8vw, 54px); overflow: hidden; border: 1px solid #EEE9E5 !important; border-radius: 4px; background: #FFFFFF; } /* Give each shell a subtle distinction without breaking the site's clean white/cream visual language. */ #zumi-native-refunds .znr-schedule { background: linear-gradient(180deg, #FFFFFF 0%, #FCFAF8 100%); } #zumi-native-refunds .znr-essentials { background: #FFFFFF; } #zumi-native-refunds .znr-faq { padding-bottom: clamp(24px, 2vw, 38px) !important; background: linear-gradient(180deg, #FFFFFF 0%, #FDFCFB 100%); } /* The internal cards stay rounded, but the outer rounded shell now visually groups them as one section. */ #zumi-native-refunds .znr-tier-card, #zumi-native-refunds .znr-essential-card, #zumi-native-refunds .znr-policy-note { box-shadow: none; } /* Contract and contact already have their own rounded treatment; normalize their spacing so they behave like the other page sections. */ #zumi-native-refunds .znr-contract { margin-top: 0 !important; margin-bottom: 0 !important; } #zumi-native-refunds .znr-contact { margin-top: 0 !important; margin-bottom: 0 !important; } @media (max-width: 760px) { #zumi-native-refunds .znr-shell { padding: 8px 0; } #zumi-native-refunds .znr-page { width: 100%; gap: 8px; margin: 0; padding: 0 !important; } #zumi-native-refunds .znr-hero, #zumi-native-refunds .znr-section, #zumi-native-refunds .znr-contract, #zumi-native-refunds .znr-contact { margin-left: 8px !important; margin-right: 8px !important; } #zumi-native-refunds .znr-section { padding: 22px 16px !important; border-radius: 4px; } #zumi-native-refunds .znr-faq.znr-section { padding-top: 22px !important; padding-bottom: 14px !important; } #zumi-native-refunds .znr-contract { margin-top: 0 !important; margin-bottom: 0 !important; } } @media (max-width: 480px) { #zumi-native-refunds .znr-shell { padding: 8px 0; } #zumi-native-refunds .znr-page { width: 100%; gap: 8px; padding: 0 !important; } #zumi-native-refunds .znr-section { padding: 18px 14px !important; border-radius: 4px; } #zumi-native-refunds .znr-faq.znr-section { padding-bottom: 11px !important; } } /* ============================================================ v1.0.17 — FAQ TABLET / SMALL-LAPTOP WRAP FIX The FAQ intro needs more horizontal room in German/Russian than the standard two-column section header allows. Stack it before mobile so long translated headings wrap naturally rather than word-by-word. ============================================================ */ @media (max-width: 1180px) and (min-width: 761px) { #zumi-native-refunds .znr-section-head--faq { grid-template-columns: minmax(0, 1fr) !important; gap: 10px !important; align-items: start; } #zumi-native-refunds .znr-section-head--faq > div { width: 100%; max-width: 860px; } #zumi-native-refunds .znr-section-head--faq h2 { width: 100%; max-width: 820px; font-size: clamp(34px, 4.2vw, 50px); line-height: 1.02; text-wrap: balance; } #zumi-native-refunds .znr-section-head--faq > p { width: 100%; max-width: 760px; margin-top: 2px; } } @media (max-width: 760px) { #zumi-native-refunds .znr-section-head--faq h2 { max-width: 100%; text-wrap: balance; } } /* ============================================================ v1.0.18 — SECTION INTRO TABLET / SMALL-LAPTOP WRAP FIX The cancellation schedule uses the same early stacking strategy as the FAQ so the title and supporting copy never collide at in-between widths. Keep the eyebrow on one line while horizontal room allows. ============================================================ */ @media (max-width: 1180px) and (min-width: 761px) { #zumi-native-refunds .znr-schedule .znr-section-head { grid-template-columns: minmax(0, 1fr) !important; gap: 10px !important; align-items: start; } #zumi-native-refunds .znr-schedule .znr-section-head > div { width: 100%; max-width: 900px; } #zumi-native-refunds .znr-schedule .znr-section-head h2 { width: 100%; max-width: 860px; font-size: clamp(34px, 4.2vw, 50px); line-height: 1.02; text-wrap: balance; } #zumi-native-refunds .znr-schedule .znr-section-head > p { width: 100%; max-width: 800px; margin-top: 2px; } #zumi-native-refunds .znr-schedule .znr-eyebrow { white-space: nowrap; } } @media (max-width: 760px) { #zumi-native-refunds .znr-schedule .znr-section-head h2 { max-width: 100%; text-wrap: balance; } } /* ============================================================ v1.0.21 — MOBILE HERO CARD ONLY Preserve the v1.0.19 page exactly; only make the existing yellow cancellation card more compact on phones so more hero photography remains visible. ============================================================ */ @media (max-width: 760px) { #zumi-native-refunds .znr-hero-card { padding: 14px 15px !important; border-radius: 4px; } #zumi-native-refunds .znr-hero-card__topline { gap: 6px; font-size: 9px; letter-spacing: .09em; } #zumi-native-refunds .znr-hero-card__topline svg { width: 15px; height: 15px; font-size: 15px; } #zumi-native-refunds .znr-hero-card > strong { margin-top: 7px !important; font-size: clamp(44px, 13vw, 56px) !important; line-height: .9; } #zumi-native-refunds .znr-hero-card__label { margin-top: 3px; font-size: 9.5px; letter-spacing: .075em; } #zumi-native-refunds .znr-hero-card p { margin-top: 9px !important; padding-top: 8px !important; font-size: 11px; line-height: 1.38 !important; } #zumi-native-refunds .znr-hero-card::after { right: -2px; top: -22px; font-size: 120px; } } @media (max-width: 480px) { #zumi-native-refunds .znr-hero-card { padding: 12px 13px !important; } #zumi-native-refunds .znr-hero-card > strong { font-size: 42px !important; } #zumi-native-refunds .znr-hero-card p { font-size: 10.5px; } } /* ============================================================ v1.0.24 — COMPACT SINGLE CONTACT CTA + HEADING ICON Keep the single localized Contact button, shrink the panel now that there is only one action, and place the supplied contact icon beside the left-side CTA heading. ============================================================ */ #zumi-native-refunds .znr-contact { gap: clamp(22px, 2vw, 34px) !important; padding: clamp(26px, 2.35vw, 40px) !important; } #zumi-native-refunds .znr-contact__copy { min-width: 0; } #zumi-native-refunds .znr-contact__heading { display: flex; align-items: center; gap: 14px; margin-top: 0; } #zumi-native-refunds .znr-contact__heading-icon { display: grid; place-items: center; flex: 0 0 48px; width: 48px; height: 48px; border: 1px solid rgba(255,255,255,.16); border-radius: 4px; background: rgba(255,255,255,.07); } #zumi-native-refunds .znr-contact__heading-icon img { display: block; width: 25px; height: 25px; object-fit: contain; filter: brightness(0) saturate(100%) invert(56%) sepia(88%) saturate(2191%) hue-rotate(344deg) brightness(97%) contrast(87%); } #zumi-native-refunds .znr-contact h2 { max-width: 860px; font-size: clamp(29px, 2.55vw, 48px) !important; } #zumi-native-refunds .znr-contact p { margin-top: 10px !important; line-height: 1.55; } #zumi-native-refunds .znr-contact__actions { display: flex !important; width: max-content !important; max-width: 100%; justify-self: end; align-items: center; } #zumi-native-refunds .znr-contact .znr-btn--contact { display: inline-flex !important; width: max-content !important; max-width: 100%; min-width: 0 !important; min-height: 42px !important; grid-template-columns: none !important; justify-content: center; align-items: center; gap: 7px !important; padding: 9px 14px !important; border-radius: 4px; color: #fff !important; font-size: 12px !important; line-height: 1.15; white-space: nowrap; } #zumi-native-refunds .znr-contact .znr-btn__contact-icon { display: inline-grid; place-items: center; width: 18px !important; height: 18px !important; color: currentColor !important; font-size: 18px !important; } #zumi-native-refunds .znr-contact .znr-btn__contact-icon svg { display: block; width: 18px !important; height: 18px !important; color: currentColor !important; stroke: currentColor !important; fill: none !important; } #zumi-native-refunds .znr-contact .znr-btn__contact-icon img { display: block; width: 18px !important; height: 18px !important; object-fit: contain; filter: brightness(0) invert(1); } @media (max-width: 980px) { #zumi-native-refunds .znr-contact__actions { justify-self: start; } } @media (max-width: 760px) { #zumi-native-refunds .znr-contact { gap: 15px !important; padding: 20px 16px !important; } #zumi-native-refunds .znr-contact__heading { gap: 10px; align-items: flex-start; } #zumi-native-refunds .znr-contact__heading-icon { flex-basis: 40px; width: 40px; height: 40px; border-radius: 4px; margin-top: 1px; } #zumi-native-refunds .znr-contact__heading-icon img { width: 21px; height: 21px; } #zumi-native-refunds .znr-contact h2 { font-size: clamp(26px, 7.8vw, 34px) !important; } #zumi-native-refunds .znr-contact__actions { width: max-content !important; } #zumi-native-refunds .znr-contact .znr-btn--contact { min-height: 40px !important; padding: 8px 12px !important; gap: 6px !important; font-size: 11px !important; } #zumi-native-refunds .znr-contact .znr-btn__contact-icon, #zumi-native-refunds .znr-contact .znr-btn__contact-icon svg { width: 17px !important; height: 17px !important; font-size: 17px !important; } } \n\n/* ============================================================\n v1.0.26 — CONTACT OPTIONS + INSURANCE-MATCH WHATSAPP ACTION\n Keep the compact CTA panel, show localized Contact options first,\n then restore the Insurance-style WhatsApp action with instant states.\n ============================================================ */\n#zumi-native-refunds .znr-contact__actions {\n display: flex !important;\n flex-wrap: wrap;\n gap: 10px !important;\n width: max-content !important;\n max-width: 100%;\n justify-self: end;\n align-items: center;\n}\n\n#zumi-native-refunds .znr-contact .znr-btn--contact,\n#zumi-native-refunds .znr-contact .znr-btn--whatsapp {\n display: inline-flex !important;\n width: max-content !important;\n max-width: 100%;\n min-width: 0 !important;\n min-height: 48px !important;\n justify-content: center;\n align-items: center;\n padding: 11px 15px !important;\n border-radius: 12px;\n font-size: 13px !important;\n font-weight: 700;\n line-height: 1.15;\n white-space: nowrap;\n transform: none !important;\n transition: none !important;\n animation: none !important;\n}\n\n#zumi-native-refunds .znr-contact .znr-btn--contact {\n gap: 8px !important;\n}\n\n#zumi-native-refunds .znr-contact .znr-btn--whatsapp {\n gap: 10px !important;\n border-color: rgba(255,255,255,.18) !important;\n background: rgba(255,255,255,.06) !important;\n color: #fff !important;\n}\n\n#zumi-native-refunds .znr-contact .znr-btn--whatsapp:hover,\n#zumi-native-refunds .znr-contact .znr-btn--whatsapp:focus-visible {\n border-color: rgba(255,255,255,.32) !important;\n background: rgba(255,255,255,.11) !important;\n color: #fff !important;\n outline: none;\n transform: none !important;\n}\n\n#zumi-native-refunds .znr-contact .znr-btn__contact-icon {\n display: inline-grid;\n place-items: center;\n width: 20px !important;\n height: 20px !important;\n flex: 0 0 20px;\n}\n\n#zumi-native-refunds .znr-contact .znr-btn__contact-icon img {\n display: block;\n width: 20px !important;\n height: 20px !important;\n object-fit: contain;\n filter: brightness(0) invert(1);\n}\n\n#zumi-native-refunds .znr-contact .znr-btn__whatsapp-icon {\n display: inline-grid;\n place-items: center;\n width: 24px !important;\n height: 24px !important;\n flex: 0 0 24px;\n}\n\n#zumi-native-refunds .znr-contact .znr-btn__whatsapp-icon img {\n display: block;\n width: 22px !important;\n height: 22px !important;\n object-fit: contain;\n}\n\n@media (max-width: 980px) {\n #zumi-native-refunds .znr-contact__actions {\n justify-self: start;\n }\n}\n\n@media (max-width: 620px) {\n #zumi-native-refunds .znr-contact__actions {\n gap: 7px !important;\n }\n\n #zumi-native-refunds .znr-contact .znr-btn--contact,\n #zumi-native-refunds .znr-contact .znr-btn--whatsapp {\n min-height: 44px !important;\n padding: 9px 11px !important;\n font-size: 11px !important;\n }\n\n #zumi-native-refunds .znr-contact .znr-btn--contact {\n gap: 7px !important;\n }\n\n #zumi-native-refunds .znr-contact .znr-btn__contact-icon,\n #zumi-native-refunds .znr-contact .znr-btn__contact-icon img {\n width: 18px !important;\n height: 18px !important;\n flex-basis: 18px;\n }\n\n #zumi-native-refunds .znr-contact .znr-btn__whatsapp-icon {\n width: 24px !important;\n height: 24px !important;\n flex-basis: 24px;\n }\n\n #zumi-native-refunds .znr-contact .znr-btn__whatsapp-icon img {\n width: 22px !important;\n height: 22px !important;\n }\n}\n\n\n/* ============================================================ v1.0.27 — RENTAL DOCUMENT ICON FOR FULL TERMS PANEL Replace the shield in the panel only; keep the PDF button icon unchanged. ============================================================ */ #zumi-native-refunds .znr-contract__icon img { display: block; width: 28px; height: 28px; object-fit: contain; filter: invert(48%) sepia(89%) saturate(2937%) hue-rotate(347deg) brightness(98%) contrast(91%); } @media (max-width: 980px) { #zumi-native-refunds .znr-contract__icon img { width: 23px; height: 23px; } } @media (max-width: 620px) { #zumi-native-refunds .znr-contract__icon img { width: 21px; height: 21px; } } /* ============================================================ v1.0.28 — MATCH CONTACT OPTIONS + WHATSAPP BUTTON WIDTHS Both CTA actions use identical dimensions; size is based on the longer localized contact-options label rather than shrinking it. ============================================================ */ #zumi-native-refunds .znr-contact__actions { --znr-contact-action-width: 220px; } #zumi-native-refunds .znr-contact .znr-btn--contact, #zumi-native-refunds .znr-contact .znr-btn--whatsapp { width: var(--znr-contact-action-width) !important; min-width: var(--znr-contact-action-width) !important; max-width: var(--znr-contact-action-width) !important; min-height: 48px !important; padding: 11px 15px !important; box-sizing: border-box; } @media (max-width: 620px) { #zumi-native-refunds .znr-contact__actions { --znr-contact-action-width: min(220px, calc(100vw - 64px)); } #zumi-native-refunds .znr-contact .znr-btn--contact, #zumi-native-refunds .znr-contact .znr-btn--whatsapp { min-height: 44px !important; padding: 9px 11px !important; } } /* ============================================================ v1.0.29 — LARGE-SCREEN ICON SIZE CAPS Prevent supplied SVG icons from appearing oversized on very wide displays while preserving the existing tablet/mobile sizes. ============================================================ */ @media (min-width: 1200px) { #zumi-native-refunds .znr-contract__icon { width: 54px !important; height: 54px !important; flex: 0 0 54px !important; } #zumi-native-refunds .znr-contract__icon img { width: 24px !important; height: 24px !important; max-width: 24px !important; max-height: 24px !important; } #zumi-native-refunds .znr-contact__heading-icon { width: 46px !important; height: 46px !important; flex: 0 0 46px !important; } #zumi-native-refunds .znr-contact__heading-icon img { width: 22px !important; height: 22px !important; max-width: 22px !important; max-height: 22px !important; } #zumi-native-refunds .znr-contact .znr-btn__contact-icon, #zumi-native-refunds .znr-contact .znr-btn__contact-icon img { width: 19px !important; height: 19px !important; max-width: 19px !important; max-height: 19px !important; flex-basis: 19px !important; } #zumi-native-refunds .znr-contact .znr-btn__whatsapp-icon { width: 23px !important; height: 23px !important; flex: 0 0 23px !important; } #zumi-native-refunds .znr-contact .znr-btn__whatsapp-icon img { width: 21px !important; height: 21px !important; max-width: 21px !important; max-height: 21px !important; } } /* ============================================================ v1.0.30 — MOBILE CONTACT PANEL OVERFLOW FIX Prevent the CTA copy/buttons from being clipped on phone widths. ============================================================ */ @media (max-width: 620px) { #zumi-native-refunds .znr-contact { grid-template-columns: minmax(0, 1fr) !important; width: auto !important; max-width: none !important; min-width: 0 !important; box-sizing: border-box !important; overflow: hidden !important; } #zumi-native-refunds .znr-contact__copy, #zumi-native-refunds .znr-contact__heading, #zumi-native-refunds .znr-contact__actions, #zumi-native-refunds .znr-contact p { min-width: 0 !important; max-width: 100% !important; box-sizing: border-box !important; } #zumi-native-refunds .znr-contact p { width: 100% !important; white-space: normal !important; overflow-wrap: break-word !important; word-break: normal !important; } #zumi-native-refunds .znr-contact__actions { --znr-contact-action-width: 100%; display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 8px !important; width: 100% !important; max-width: 100% !important; justify-self: stretch !important; align-items: stretch !important; } #zumi-native-refunds .znr-contact .znr-btn--contact, #zumi-native-refunds .znr-contact .znr-btn--whatsapp { width: 100% !important; min-width: 0 !important; max-width: 100% !important; min-height: 46px !important; box-sizing: border-box !important; justify-content: flex-start !important; white-space: normal !important; overflow: hidden !important; } #zumi-native-refunds .znr-contact .znr-btn--contact > span:last-child, #zumi-native-refunds .znr-contact .znr-btn--whatsapp > span:last-child { min-width: 0 !important; white-space: normal !important; overflow-wrap: break-word !important; } } /* ============================================================ v1.0.31 — CONTENT-WIDTH CONTACT ACTIONS Preserve the mobile overflow fix while sizing each CTA to its own icon + label rather than stretching to the panel width. ============================================================ */ #zumi-native-refunds .znr-contact__actions { --znr-contact-action-width: auto !important; display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 8px !important; width: max-content !important; max-width: 100% !important; } #zumi-native-refunds .znr-contact .znr-btn--contact, #zumi-native-refunds .znr-contact .znr-btn--whatsapp { display: inline-flex !important; width: fit-content !important; min-width: 0 !important; max-width: 100% !important; flex: 0 0 auto !important; justify-content: center !important; white-space: nowrap !important; overflow: visible !important; } #zumi-native-refunds .znr-contact .znr-btn--contact > span:last-child, #zumi-native-refunds .znr-contact .znr-btn--whatsapp > span:last-child { white-space: nowrap !important; } @media (max-width: 620px) { #zumi-native-refunds .znr-contact__actions { flex-direction: column !important; flex-wrap: nowrap !important; align-items: flex-start !important; justify-self: start !important; width: 100% !important; max-width: 100% !important; } #zumi-native-refunds .znr-contact .znr-btn--contact, #zumi-native-refunds .znr-contact .znr-btn--whatsapp { width: fit-content !important; max-width: 100% !important; align-self: flex-start !important; } } /* ZUMI SOFT DESERT DESIGN SYSTEM — 2026-10-08 Consistent 4px soft corners on sections, buttons, media, images and icon tiles. SVG artwork, image pixels, sizing, layout, and interactive behaviour unchanged. Doubled ID specificity intentionally supersedes previous square-corner rules. */ #zumi-native-refunds#zumi-native-refunds { --znr-orange:#E85E2A;--znr-orange-deep:#E85E2A; --zumi-corner: 4px; } /* Keep native radio circles identifiable as radio inputs. */ #zumi-native-refunds#zumi-native-refunds input[type="radio"] { border-radius: 50% !important; } /* Preserve contrast: pale sand is used on photographic/dark hero kickers. */ #zumi-native-refunds#zumi-native-refunds .znr-hero .znr-eyebrow { color:#F1C7A4 !important; } #zumi-native-refunds#zumi-native-refunds .znr-btn--primary:not(:disabled):not(.is-disabled) { background-color:#E85E2A !important; border-color:#E85E2A !important; color:#FFFFFF !important; } #zumi-native-refunds#zumi-native-refunds .znr-btn--primary:hover:not(:disabled):not(.is-disabled), #zumi-native-refunds#zumi-native-refunds .znr-btn--primary:focus-visible:not(:disabled):not(.is-disabled) { background-color:#E85E2A !important; border-color:#E85E2A !important; color:#FFFFFF !important; } /* ZUMI BUTTON PALETTE — screenshot-matched orange #E85E2A (2026-10-08). Surface-only accents: preserves section colours, body copy, images and 4px corners. */ #zumi-native-refunds#zumi-native-refunds .znr-btn--primary { background:#E85E2A !important; border-color:#E85E2A !important; color:#FFFFFF !important; } #zumi-native-refunds#zumi-native-refunds .znr-btn--primary:is(:hover,:focus-visible):not(:disabled):not(.is-disabled) { background:#E85E2A !important; border-color:#E85E2A !important; color:#FFFFFF !important; } #zumi-native-refunds#zumi-native-refunds .znr-contract__btn--primary { background:#E85E2A !important; border-color:#E85E2A !important; color:#FFFFFF !important; } #zumi-native-refunds#zumi-native-refunds .znr-contract__btn--primary:is(:hover,:focus-visible):not(:disabled):not(.is-disabled) { background:#E85E2A !important; border-color:#E85E2A !important; color:#FFFFFF !important; } /* ZUMI: 4px on ordinary content surfaces; original banner artwork/radii preserved. */ #zumi-native-refunds#zumi-native-refunds .znr-contract, #zumi-native-refunds#zumi-native-refunds .znr-essential-card, #zumi-native-refunds#zumi-native-refunds .znr-faq-item, #zumi-native-refunds#zumi-native-refunds .znr-policy-note, #zumi-native-refunds#zumi-native-refunds .znr-tier-card {border-radius:4px!important;} /* Corner radius for real controls only, never banner layers or decorative pseudo-elements. */ #zumi-native-refunds#zumi-native-refunds :is(button, input:not([type="radio"]), textarea, select, a[class*="btn"], a[class*="button"], a[class*="action"]) {border-radius:4px!important;} /* Final solid orange surface contract — all orange action states use exact #E85E2A. */ #zumi-native-refunds#zumi-native-refunds .znr-btn--primary, #zumi-native-refunds#zumi-native-refunds .znr-btn--primary:hover, #zumi-native-refunds#zumi-native-refunds .znr-btn--primary:focus, #zumi-native-refunds#zumi-native-refunds .znr-btn--primary:focus-visible, #zumi-native-refunds#zumi-native-refunds .znr-btn--primary:active {background-color:#E85E2A!important; border-color:#E85E2A!important;} #zumi-native-refunds#zumi-native-refunds .znr-contract__btn--primary, #zumi-native-refunds#zumi-native-refunds .znr-contract__btn--primary:hover, #zumi-native-refunds#zumi-native-refunds .znr-contract__btn--primary:focus, #zumi-native-refunds#zumi-native-refunds .znr-contract__btn--primary:focus-visible, #zumi-native-refunds#zumi-native-refunds .znr-contract__btn--primary:active {background-color:#E85E2A!important; border-color:#E85E2A!important;} /* Zumi 2026-10-08: enforce 4px corners on every button-like control, including greyed-out, disabled and secondary span-based CTAs. Do not change pseudo-element artwork or the disabled state. */ #zumi-native-refunds#zumi-native-refunds :is( button, input[type="button"], input[type="submit"], input[type="reset"], [role="button"], [role="link"][aria-disabled="true"][class*="button"], [aria-disabled="true"][class*="btn"], [aria-disabled="true"][class*="button"], [aria-disabled="true"][class*="action"], a[class*="btn"]:not([class*="icon"]), a[class*="button"]:not([class*="icon"]), a[class*="action"]:not([class*="actions"]):not([class*="icon"]), .znr-btn, .znr-contract__btn ) { border-radius: 4px !important; } @font-face { font-family:"Zumi Poppins"; src:url("/cf-fonts/s/poppins/5.2.7/latin/700/normal.woff2") format("woff2"); font-style:normal; font-weight:700; font-display:swap; } /* ZUMI BANNER HEADING TYPE — POPPINS, October 2026. Scope: large banner/hero headings only. Body, controls and other headings stay Roboto. Existing sizes, layout, colour, weight and decoration are unchanged. */ #zumi-native-refunds#zumi-native-refunds .znr-hero h1 { font-family: "Zumi Poppins", "Poppins", Arial, sans-serif !important; letter-spacing: -.032em !important; } #zumi-native-refunds#zumi-native-refunds .znr-hero h1 span { font-family: "Zumi Poppins", "Poppins", Arial, sans-serif !important; }